/**
 * ALTRONIX — WooCommerce Shop, Product, Cart & Checkout
 * Industrial dark theme — full comprehensive B2B catalog redesign.
 */

/* ══════════════════════════════════════════════════════════════
   SHARED — WC notices
   ══════════════════════════════════════════════════════════════ */

.woocommerce-notices-wrapper {
    max-inline-size: 1320px;
    margin-inline: auto;
    padding-inline: var(--space-6);
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    background: var(--color-bg-tertiary) !important;
    border-block-start: 4px solid var(--color-accent-blue) !important;
    color: var(--color-text-primary) !important;
    border-radius: 0 0 8px 8px;
    padding: var(--space-4) var(--space-6) !important;
    margin-block-end: var(--space-6) !important;
    list-style: none !important;
}

.woocommerce-error {
    border-block-start-color: var(--color-danger) !important;
}

.woocommerce-message::before,
.woocommerce-info::before { color: var(--color-accent-blue) !important; }

/* Hide WC default icon on coupon toggle — we don't need it */
.woocommerce-form-coupon-toggle::before,
.woocommerce-form-coupon-toggle .woocommerce-info::before { display: none !important; content: '' !important; }

.woocommerce-message a.button,
.woocommerce-info a.button,
.woocommerce-error a.button {
    float: none !important;
    background: transparent !important;
    border: 1px solid var(--color-border-strong) !important;
    color: var(--color-text-primary) !important;
    border-radius: 6px !important;
    padding: 6px 16px !important;
    font-size: var(--fs-sm) !important;
    margin-inline-end: var(--space-3) !important;
}

/* ══════════════════════════════════════════════════════════════
   PAGE WRAPPER
   ══════════════════════════════════════════════════════════════ */

.altronix-shop {
    background: var(--color-bg-primary);
    color: var(--color-text-primary);
    min-block-size: 60vh;
}

/* ══════════════════════════════════════════════════════════════
   HERO BANNER
   ══════════════════════════════════════════════════════════════ */

.altronix-shop-hero {
    background:
        radial-gradient(ellipse 80% 60% at 50% 50%, rgba(0,166,251,0.1) 0%, transparent 65%),
        radial-gradient(ellipse 40% 40% at 85% 20%, rgba(255,107,26,0.06) 0%, transparent 60%),
        var(--gradient-industrial);
    border-block-end: 1px solid var(--color-border-subtle);
    position: relative;
    overflow: hidden;
    padding-block: var(--space-24) var(--space-16);
}

/* Ligne orange → bleue en haut — identique aux autres pages */
.altronix-shop-hero::before {
    content: '';
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    block-size: 3px;
    background: linear-gradient(90deg, var(--color-accent-orange), var(--color-accent-blue));
    z-index: 2;
}

/* Ligne bleue en bas */
.altronix-shop-hero::after {
    content: '';
    position: absolute;
    inset-block-end: 0;
    inset-inline: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(0,166,251,0.5) 40%, rgba(0,166,251,0.5) 60%, transparent);
    pointer-events: none;
}

.altronix-shop-hero__inner {
    position: relative;
    z-index: 1;
    max-inline-size: 800px;
    margin-inline: auto;
    padding-inline: var(--space-6);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-8);
}

/* Corner brackets — même style que Services / Secteurs / About */
.altronix-shop-hero__inner::before,
.altronix-shop-hero__inner::after {
    content: '';
    position: absolute;
    inline-size: 60px;
    block-size: 60px;
    border-style: solid;
    animation: altronix-shop-corner-pulse 3s ease-in-out infinite;
    pointer-events: none;
}

.altronix-shop-hero__inner::before {
    inset-block-start: -20px;
    inset-inline-start: -20px;
    border-width: 2px 0 0 2px;
    border-color: rgba(0, 166, 251, 0.35);
}

.altronix-shop-hero__inner::after {
    inset-block-end: -20px;
    inset-inline-end: -20px;
    border-width: 0 2px 2px 0;
    border-color: rgba(255, 107, 26, 0.35);
    animation-delay: 1.5s;
}

@keyframes altronix-shop-corner-pulse {
    0%, 100% { opacity: 0.4; }
    50%       { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .altronix-shop-hero__inner::before,
    .altronix-shop-hero__inner::after { animation: none; }
}

.altronix-shop-hero__tag {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    background: rgba(0, 166, 251, 0.12);
    border: 1px solid rgba(0, 166, 251, 0.3);
    color: var(--color-accent-blue);
    padding: 6px 16px;
    border-radius: 100px;
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.altronix-shop-hero__title {
    font-family: var(--font-display);
    font-size: clamp(var(--fs-3xl), 6vw, var(--fs-5xl));
    font-weight: 700;
    color: var(--color-text-primary);
    line-height: 1.1;
    margin: 0;
}

.altronix-shop-hero__title-accent { color: var(--color-accent-blue); }

.altronix-shop-hero__desc {
    font-size: var(--fs-lg);
    color: var(--color-text-secondary);
    margin: 0;
    max-inline-size: 600px;
}

/* Search */
.altronix-shop-hero__search { width: 100%; max-inline-size: 640px; }

.altronix-shop-hero__search-wrap {
    display: flex;
    align-items: center;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-strong);
    border-radius: 12px;
    padding: var(--space-1);
    gap: var(--space-2);
    transition: border-color var(--duration-base) var(--ease-out),
                box-shadow var(--duration-base) var(--ease-out);
}

.altronix-shop-hero__search-wrap:focus-within {
    border-color: var(--color-accent-blue);
    box-shadow: 0 0 0 3px rgba(0, 166, 251, 0.15);
}

.altronix-shop-hero__search-icon {
    flex-shrink: 0;
    color: var(--color-text-muted);
    margin-inline-start: var(--space-3);
}

.altronix-shop-hero__search-input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: var(--color-text-primary);
    font-size: var(--fs-base);
    padding-block: var(--space-3);
    min-width: 0;
}

.altronix-shop-hero__search-input::placeholder { color: var(--color-text-muted); }

.altronix-shop-hero__search-btn {
    background: var(--gradient-accent);
    border: none;
    color: #fff;
    font-size: var(--fs-sm);
    font-weight: 600;
    padding: var(--space-3) var(--space-6);
    border-radius: 8px;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity var(--duration-base);
    flex-shrink: 0;
}

.altronix-shop-hero__search-btn:hover { opacity: 0.88; }

/* Stats */
.altronix-shop-hero__stats {
    display: flex;
    gap: var(--space-12);
    justify-content: center;
}

.altronix-shop-hero__stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.altronix-shop-hero__stat-num {
    font-family: var(--font-display);
    font-size: var(--fs-2xl);
    font-weight: 700;
    color: var(--color-accent-blue);
    line-height: 1;
}

.altronix-shop-hero__stat-label {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* ══════════════════════════════════════════════════════════════
   CATEGORY CARDS GRID
   ══════════════════════════════════════════════════════════════ */

.altronix-shop-cats {
    padding-block: var(--space-16);
    border-block-end: 1px solid var(--color-border-subtle);
}

.altronix-shop-cats__inner {
    max-inline-size: 1320px;
    margin-inline: auto;
    padding-inline: var(--space-6);
}

.altronix-shop-cats__head {
    margin-block-end: var(--space-8);
}

.altronix-shop-cats__title {
    font-family: var(--font-display);
    font-size: var(--fs-2xl);
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0;
}

.altronix-shop-cats__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: var(--space-4);
}

/* Category card */
.altronix-cat-card {
    display: flex;
    flex-direction: column;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    position: relative;
    transition: transform var(--duration-base) var(--ease-out),
                border-color var(--duration-base) var(--ease-out),
                box-shadow var(--duration-base) var(--ease-out);
}

.altronix-cat-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.4);
}

.altronix-cat-card--blue:hover   { border-color: var(--color-accent-blue); box-shadow: 0 16px 40px rgba(0,166,251,0.15); }
.altronix-cat-card--orange:hover { border-color: var(--color-accent-orange); box-shadow: 0 16px 40px rgba(255,107,26,0.12); }
.altronix-cat-card--teal:hover   { border-color: #00C9B1; box-shadow: 0 16px 40px rgba(0,201,177,0.12); }
.altronix-cat-card--purple:hover { border-color: #8B5CF6; box-shadow: 0 16px 40px rgba(139,92,246,0.12); }
.altronix-cat-card--amber:hover  { border-color: #F59E0B; box-shadow: 0 16px 40px rgba(245,158,11,0.12); }

.altronix-cat-card__image-wrap {
    aspect-ratio: 3 / 2;
    position: relative;
    overflow: hidden;
    background: var(--color-bg-secondary);
}

/* Gradient backgrounds per variant — gives each card a unique atmosphere */
.altronix-cat-card--blue   .altronix-cat-card__image-wrap { background: linear-gradient(135deg, rgba(0,50,120,0.5) 0%, rgba(0,166,251,0.12) 100%); }
.altronix-cat-card--orange .altronix-cat-card__image-wrap { background: linear-gradient(135deg, rgba(120,50,0,0.5) 0%, rgba(255,107,26,0.12) 100%); }
.altronix-cat-card--teal   .altronix-cat-card__image-wrap { background: linear-gradient(135deg, rgba(0,80,70,0.5) 0%, rgba(0,201,177,0.12) 100%); }
.altronix-cat-card--purple .altronix-cat-card__image-wrap { background: linear-gradient(135deg, rgba(50,20,120,0.5) 0%, rgba(139,92,246,0.12) 100%); }
.altronix-cat-card--amber  .altronix-cat-card__image-wrap { background: linear-gradient(135deg, rgba(100,60,0,0.5) 0%, rgba(245,158,11,0.12) 100%); }

.altronix-cat-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--duration-slow) var(--ease-out);
}

.altronix-cat-card:hover .altronix-cat-card__img { transform: scale(1.06); }

.altronix-cat-card__placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.85;
    transition: opacity var(--duration-base) var(--ease-out),
                transform var(--duration-base) var(--ease-out);
}

.altronix-cat-card:hover .altronix-cat-card__placeholder { opacity: 1; transform: scale(1.08); }

.altronix-cat-card--blue   .altronix-cat-card__placeholder { color: var(--color-accent-blue); filter: drop-shadow(0 0 12px rgba(0,166,251,0.4)); }
.altronix-cat-card--orange .altronix-cat-card__placeholder { color: var(--color-accent-orange); filter: drop-shadow(0 0 12px rgba(255,107,26,0.4)); }
.altronix-cat-card--teal   .altronix-cat-card__placeholder { color: #00C9B1; filter: drop-shadow(0 0 12px rgba(0,201,177,0.4)); }
.altronix-cat-card--purple .altronix-cat-card__placeholder { color: #8B5CF6; filter: drop-shadow(0 0 12px rgba(139,92,246,0.4)); }
.altronix-cat-card--amber  .altronix-cat-card__placeholder { color: #F59E0B; filter: drop-shadow(0 0 12px rgba(245,158,11,0.4)); }

.altronix-cat-card__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10,14,26,0.7) 0%, transparent 60%);
}

.altronix-cat-card__body {
    padding: var(--space-3) var(--space-4);
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}

.altronix-cat-card__info { flex: 1; min-width: 0; }

.altronix-cat-card__name {
    font-family: var(--font-display);
    font-size: var(--fs-sm);
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 4px;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.altronix-cat-card__count {
    font-size: 11px;
    color: var(--color-text-muted);
    font-weight: 500;
}

.altronix-cat-card__arrow {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    opacity: 0.6;
    transform: translateX(-4px);
    transition: opacity var(--duration-base) var(--ease-out),
                transform var(--duration-base) var(--ease-out),
                background var(--duration-base),
                color var(--duration-base);
}

.altronix-cat-card:hover .altronix-cat-card__arrow {
    opacity: 1;
    transform: translateX(0);
    background: rgba(0,166,251,0.15);
    color: var(--color-accent-blue);
}

/* ══════════════════════════════════════════════════════════════
   SUBCATEGORY CHIPS
   ══════════════════════════════════════════════════════════════ */

.altronix-shop-subcats {
    border-block-end: 1px solid var(--color-border-subtle);
    padding-block: var(--space-6);
}

.altronix-shop-subcats__inner {
    max-inline-size: 1320px;
    margin-inline: auto;
    padding-inline: var(--space-6);
}

.altronix-shop-subcats__grid {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.altronix-subcat-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 8px;
    padding: var(--space-2) var(--space-4);
    text-decoration: none;
    color: var(--color-text-secondary);
    font-size: var(--fs-sm);
    transition: border-color var(--duration-base),
                color var(--duration-base),
                background var(--duration-base);
}

.altronix-subcat-chip:hover {
    border-color: var(--color-accent-blue);
    color: var(--color-text-primary);
    background: rgba(0,166,251,0.06);
}

.altronix-subcat-chip__img {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    object-fit: cover;
}

.altronix-subcat-chip__count {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    background: rgba(255,255,255,0.06);
    padding: 1px 7px;
    border-radius: 100px;
}

/* ══════════════════════════════════════════════════════════════
   LAYOUT — SIDEBAR + MAIN
   ══════════════════════════════════════════════════════════════ */

.altronix-shop__layout {
    max-inline-size: 1320px;
    margin-inline: auto;
    padding-inline: var(--space-6);
    padding-block: var(--space-12);
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: var(--space-8);
    align-items: start;
}

/* ══════════════════════════════════════════════════════════════
   SIDEBAR
   ══════════════════════════════════════════════════════════════ */

.altronix-shop-sidebar {
    position: sticky;
    top: 80px;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--color-bg-secondary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 12px;
    scroll-behavior: smooth;
}

/* Scrollbar slim — desktop only */
.altronix-shop-sidebar::-webkit-scrollbar {
    width: 4px;
}
.altronix-shop-sidebar::-webkit-scrollbar-track {
    background: transparent;
}
.altronix-shop-sidebar::-webkit-scrollbar-thumb {
    background: var(--color-border-strong);
    border-radius: 2px;
}
.altronix-shop-sidebar::-webkit-scrollbar-thumb:hover {
    background: var(--color-accent-blue);
}

.altronix-shop-sidebar__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-4) var(--space-5);
    border-block-end: 1px solid var(--color-border-subtle);
}

.altronix-shop-sidebar__head-label {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--color-text-primary);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.altronix-shop-sidebar__close {
    display: none;
    background: transparent;
    border: none;
    color: var(--color-text-muted);
    cursor: pointer;
    padding: var(--space-1);
    border-radius: 4px;
    transition: color var(--duration-fast);
}

.altronix-shop-sidebar__close:hover { color: var(--color-text-primary); }

/* All products link */
.altronix-sidebar__all {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-1);
    font-size: var(--fs-sm);
    color: var(--color-text-secondary);
    text-decoration: none;
    border-radius: 6px;
    margin-block-end: var(--space-2);
    transition: color var(--duration-fast);
}

.altronix-sidebar__all:hover,
.altronix-sidebar__all.is-active {
    color: var(--color-accent-blue);
}

/* Sidebar widgets */
.altronix-sidebar-widget {
    padding: var(--space-4) var(--space-5);
    border-block-end: 1px solid var(--color-border-subtle);
}

.altronix-sidebar-widget:last-child { border-block-end: none; }

.altronix-sidebar-widget__title {
    font-size: var(--fs-xs);
    font-weight: 600;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0 0 var(--space-4);
}

/* Widget search */
.altronix-sidebar-widget__search {
    display: flex;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 8px;
    overflow: hidden;
    transition: border-color var(--duration-base);
}

.altronix-sidebar-widget__search:focus-within { border-color: var(--color-accent-blue); }

.altronix-sidebar-widget__input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: var(--color-text-primary);
    font-size: var(--fs-sm);
    padding: var(--space-2) var(--space-3);
    min-width: 0;
}

.altronix-sidebar-widget__input::placeholder { color: var(--color-text-muted); }

.altronix-sidebar-widget__search-btn {
    background: transparent;
    border: none;
    border-inline-start: 1px solid var(--color-border-subtle);
    color: var(--color-text-muted);
    padding: 0 var(--space-3);
    cursor: pointer;
    transition: color var(--duration-fast);
    display: flex;
    align-items: center;
}

.altronix-sidebar-widget__search-btn:hover { color: var(--color-accent-blue); }

/* Category tree */
.altronix-cat-tree {
    list-style: none;
    padding: 0;
    margin: 0;
}

.altronix-cat-tree .altronix-cat-tree {
    padding-inline-start: var(--space-4);
    margin-block-start: var(--space-1);
    display: none;
}

.altronix-cat-tree__item {
    position: relative;
}

.altronix-cat-tree__item.is-open > .altronix-cat-tree { display: block; }

.altronix-cat-tree__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-1);
    color: var(--color-text-secondary);
    text-decoration: none;
    font-size: var(--fs-sm);
    border-radius: 6px;
    transition: color var(--duration-fast), background var(--duration-fast);
}

.altronix-cat-tree__link:hover { color: var(--color-text-primary); background: rgba(255,255,255,0.04); }
.altronix-cat-tree__link.is-current { color: var(--color-accent-blue); font-weight: 600; }

.altronix-cat-tree__count {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    background: rgba(255,255,255,0.06);
    padding: 1px 7px;
    border-radius: 100px;
    flex-shrink: 0;
}

.altronix-cat-tree__toggle {
    position: absolute;
    inset-block-start: 4px;
    inset-inline-end: 0;
    background: transparent;
    border: none;
    color: var(--color-text-muted);
    cursor: pointer;
    padding: var(--space-1);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: transform var(--duration-fast), color var(--duration-fast);
}

.altronix-cat-tree__toggle:hover { color: var(--color-text-primary); }

.altronix-cat-tree__item.is-open > .altronix-cat-tree__toggle {
    transform: rotate(180deg);
    color: var(--color-accent-blue);
}

/* Brand list */
.altronix-sidebar-widget__brand-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.altronix-sidebar-widget__brand {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-1);
    color: var(--color-text-secondary);
    text-decoration: none;
    font-size: var(--fs-sm);
    border-radius: 6px;
    transition: color var(--duration-fast);
}

.altronix-sidebar-widget__brand:hover { color: var(--color-text-primary); }
.altronix-sidebar-widget__brand.is-active { color: var(--color-accent-blue); font-weight: 600; }

.altronix-sidebar-widget__brand-count {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    background: rgba(255,255,255,0.06);
    padding: 1px 7px;
    border-radius: 100px;
}

/* Overlay (mobile sidebar backdrop) */
.altronix-sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.6);
    z-index: 199;
    opacity: 0;
    pointer-events: none; /* never block clicks when not active */
    transition: opacity var(--duration-base);
}

.altronix-sidebar-overlay.is-active {
    opacity: 1;
    pointer-events: auto;
}

/* ══════════════════════════════════════════════════════════════
   MAIN PRODUCT AREA
   ══════════════════════════════════════════════════════════════ */

.altronix-shop__main { min-width: 0; }

/* Breadcrumb */
.altronix-shop-breadcrumb {
    margin-block-end: var(--space-6);
}

.altronix-shop-breadcrumb__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
}

.altronix-shop-breadcrumb__list li { display: flex; align-items: center; gap: var(--space-1); }
.altronix-shop-breadcrumb__list a { color: var(--color-text-secondary); text-decoration: none; }
.altronix-shop-breadcrumb__list a:hover { color: var(--color-accent-blue); }
.altronix-shop-breadcrumb__list .sep { color: var(--color-text-muted); font-size: var(--fs-xs); }

/* Category description */
.altronix-shop-cat-desc {
    font-size: var(--fs-sm);
    color: var(--color-text-secondary);
    margin: 0 0 var(--space-6);
    max-inline-size: 72ch;
}

/* Toolbar */
.altronix-shop__toolbar {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-block-end: var(--space-6);
    padding-block: var(--space-3);
    padding-inline: var(--space-4);
    background: var(--color-bg-secondary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 10px;
}

.altronix-shop__filter-btn {
    display: none;
    align-items: center;
    gap: var(--space-2);
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    color: var(--color-text-secondary);
    font-size: var(--fs-sm);
    font-weight: 600;
    padding: var(--space-2) var(--space-4);
    border-radius: 8px;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: border-color var(--duration-fast), color var(--duration-fast);
}

.altronix-shop__filter-btn:hover {
    border-color: var(--color-accent-blue);
    color: var(--color-accent-blue);
}

.altronix-shop__toolbar-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    flex: 1;
    min-width: 0;
    flex-wrap: nowrap;
}

/* WC result count & ordering */
.woocommerce-result-count {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    margin: 0 !important;
}

.woocommerce-ordering {
    margin: 0 !important;
}

.woocommerce-ordering select {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-secondary) !important;
    font-size: var(--fs-sm) !important;
    font-weight: 500 !important;
    padding: var(--space-2) var(--space-5) var(--space-2) var(--space-3) !important;
    outline: none !important;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color var(--duration-fast) !important;
}

.woocommerce-ordering select:hover,
.woocommerce-ordering select:focus {
    border-color: var(--color-accent-blue) !important;
    color: var(--color-text-primary) !important;
}

/* ══════════════════════════════════════════════════════════════
   PRODUCT GRID
   ══════════════════════════════════════════════════════════════ */

/* ── Product Grid ─────────────────────────────────────────────── */
ul.altronix-products,
.altronix-shop__body ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: var(--space-5) !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    width: 100% !important;
    box-sizing: border-box;
    align-items: stretch !important;
}

/* WooCommerce clearfix pseudo-elements become ghost grid items and create
   the diagonal empty slots bug on archive pages. */
ul.altronix-products::before,
ul.altronix-products::after,
.altronix-shop__body ul.products::before,
.altronix-shop__body ul.products::after {
    content: none !important;
    display: none !important;
}

ul.altronix-products > li,
.altronix-shop__body ul.products > li {
    float: none !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    clear: none !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    box-sizing: border-box;
}

/* Safety net: hide WooCommerce ghost <li> elements (Blocks compat layer) */
ul.altronix-products > li:not([class*="altronix-pcard"]),
ul.altronix-products > li:empty {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    pointer-events: none !important;
}

/* Force all product cards to auto-place — no column skipping */
ul.altronix-products > li.altronix-pcard {
    grid-column: auto !important;
    grid-row: auto !important;
}

/* ══════════════════════════════════════════════════════════════
   PRODUCT CARD (.altronix-pcard)
   ══════════════════════════════════════════════════════════════ */

.altronix-pcard {
    display: block !important;
    height: 100% !important;
}

.altronix-pcard__inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 590px;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 14px;
    overflow: hidden;
    transition: border-color var(--duration-base) var(--ease-out),
                box-shadow var(--duration-base) var(--ease-out),
                transform var(--duration-base) var(--ease-out);
}

/* Card hover */
.altronix-pcard:hover .altronix-pcard__inner {
    border-color: rgba(0,166,251,0.4);
    box-shadow: 0 20px 50px rgba(0,0,0,0.5), 0 0 0 1px rgba(0,166,251,0.12);
    transform: translateY(-4px);
}

.altronix-pcard:focus-within .altronix-pcard__inner {
    border-color: rgba(0,166,251,0.5);
    box-shadow: 0 0 0 3px rgba(0,166,251,0.2);
}

/* ── Image ─────────────────────────────────────────────────── */
.altronix-pcard__image-wrap {
    height: 280px !important;
    position: relative !important;
    overflow: hidden !important;
    background: #131929 !important;        /* slightly lighter — products pop */
    flex-shrink: 0 !important;
    border-block-end: 1px solid var(--color-border-subtle);
}

.altronix-pcard__image-link {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

.altronix-pcard__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: var(--space-4) !important;    /* 16px — max image visible */
    transition: transform var(--duration-slow) var(--ease-out);
}

.altronix-pcard:hover .altronix-pcard__img { transform: scale(1.06); }

/* Broken image fallback — placeholder styling */
.altronix-pcard__img.is-placeholder {
    object-fit: contain !important;
    padding: var(--space-6) !important;
    background: var(--color-bg-tertiary) !important;
    opacity: 0.4 !important;
    transform: none !important;
}

/* Badge */
.altronix-pcard__badge {
    position: absolute;
    inset-block-start: var(--space-3);
    inset-inline-start: var(--space-3);
    font-size: var(--fs-xs);
    font-weight: 800;
    padding: 4px 12px;
    border-radius: 100px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    z-index: 2;
}

.altronix-pcard__badge--sale {
    background: var(--color-accent-orange);
    color: #fff;
    box-shadow: 0 4px 12px rgba(255,107,26,0.4);
}

.altronix-pcard__badge--featured {
    background: var(--color-accent-blue);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0,166,251,0.4);
}

/* Overlay — slides up from bottom on hover */
.altronix-pcard__overlay {
    position: absolute;
    inset-block-end: 0;
    inset-inline: 0;
    padding: var(--space-3) var(--space-4) var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    background: linear-gradient(to top, rgba(5,8,18,0.97) 0%, rgba(5,8,18,0.6) 70%, transparent 100%);
    transform: translateY(100%);
    transition: transform var(--duration-base) var(--ease-out);
    z-index: 3;
    pointer-events: none;
}

.altronix-pcard:hover .altronix-pcard__overlay {
    transform: translateY(0);
    pointer-events: auto;
}

.altronix-pcard__overlay-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: 9px var(--space-4);
    border-radius: 8px;
    font-size: var(--fs-sm);
    font-weight: 600;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(20,28,55,0.9);
    color: var(--color-text-primary);
    backdrop-filter: blur(6px);
    transition: background var(--duration-fast), border-color var(--duration-fast);
    white-space: nowrap;
}

.altronix-pcard__overlay-btn:hover {
    background: rgba(255,255,255,0.14);
    border-color: rgba(255,255,255,0.25);
}

.altronix-pcard__overlay-btn--cart {
    background: var(--gradient-accent);
    border-color: transparent;
    color: #fff;
}

.altronix-pcard__overlay-btn--cart:hover { opacity: 0.88; }

/* ── Body ──────────────────────────────────────────────────── */
.altronix-pcard__body {
    padding: var(--space-5);
    flex: 1;
    min-height: 188px;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.altronix-pcard__cats {
    font-size: 10px;
    color: var(--color-accent-blue);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.altronix-pcard__name {
    font-family: var(--font-display);
    font-size: var(--fs-lg);
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0;
    line-height: 1.3;
    min-height: 2.7em;
}

.altronix-pcard__name-link {
    color: inherit;
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color var(--duration-fast);
}

.altronix-pcard__name-link:hover { color: var(--color-accent-blue); }

.altronix-pcard__excerpt {
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    margin: 0;
    line-height: 1.55;
    min-height: 3.1em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Stock + SKU */
.altronix-pcard__meta {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
    min-height: 30px;
    margin-block-start: auto;
}

.altronix-pcard__stock {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: var(--fs-xs);
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 100px;
}

.altronix-pcard__stock--in {
    background: rgba(16,185,129,0.12);
    color: var(--color-success);
    border: 1px solid rgba(16,185,129,0.2);
}

.altronix-pcard__stock--out {
    background: rgba(239,68,68,0.1);
    color: var(--color-danger);
    border: 1px solid rgba(239,68,68,0.2);
}

.altronix-pcard__sku {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    font-family: monospace;
}

/* ── WooCommerce Blocks quantity badge — blue themed ────────────────────── */
/* Targets the quantity overlay circle on product images in cart + checkout  */

/* Order summary badge (checkout right panel) */
.wc-block-order-summary-item__quantity,
.wc-block-components-order-summary-item__quantity,
.wc-block-order-summary-item__image > span,
.wc-block-order-summary-item__image > div:not(:has(img)) {
    background: var(--color-accent-blue) !important;
    color: #fff !important;
    border: 2px solid var(--color-bg-primary) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    min-width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 3px !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.4) !important;
    line-height: 1 !important;
    /* Keep absolute position set by WC */
}

/* Cart badge */
.wc-block-cart-item__image > span,
.wc-block-cart-item__image-quantity,
.wc-block-cart-item__quantity-badge {
    background: var(--color-accent-blue) !important;
    color: #fff !important;
    border: 2px solid var(--color-bg-primary) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    min-width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 3px !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.4) !important;
    line-height: 1 !important;
}

/* ══ Add-to-cart states ════════════════════════════════════════
   WooCommerce adds class "added" to button + shows "View cart" link
   ══════════════════════════════════════════════════════════════ */

/* Hide WooCommerce's "View cart" link everywhere */
a.added_to_cart,
a.added_to_cart.wc-forward,
.added_to_cart { display: none !important; }

/* Footer cart button — loading */
.altronix-pcard__btn--cart.loading {
    opacity: 0.5 !important;
    pointer-events: none !important;
    cursor: wait !important;
}

/* Footer cart button — added (green ✓) */
.altronix-pcard__btn--cart.added {
    background: #10b981 !important;
    pointer-events: none !important;
    cursor: default !important;
}

/* Overlay cart button — added */
.altronix-pcard__overlay-btn--cart.added {
    background: #10b981 !important;
    pointer-events: none !important;
}


/* ── Footer ─────────────────────────────────────────────────── */
.altronix-pcard__footer {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    min-height: 112px;
    padding: var(--space-4) var(--space-5);
    border-block-start: 1px solid var(--color-border-subtle);
    background: rgba(0,0,0,0.2);
}

/* Price */
.altronix-pcard__price {
    min-width: 0;
}

.altronix-pcard__price .woocommerce-Price-amount {
    font-family: var(--font-display);
    font-size: var(--fs-lg);
    font-weight: 800;
    color: var(--color-text-primary);
    white-space: nowrap;
}

.altronix-pcard__price del {
    display: block;
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    text-decoration: line-through;
}

.altronix-pcard__price del .woocommerce-Price-amount {
    font-size: var(--fs-sm);
    font-weight: 400;
    color: var(--color-text-muted);
}

.altronix-pcard__price ins {
    text-decoration: none;
    display: block;
}

.altronix-pcard__price ins .woocommerce-Price-amount { color: var(--color-accent-orange); }

/* Action buttons */
.altronix-pcard__actions {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.altronix-pcard__btn {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--fs-sm);
    font-weight: 600;
    border-radius: 8px;
    text-decoration: none;
    transition: background var(--duration-fast),
                color var(--duration-fast),
                transform var(--duration-fast);
}

.altronix-pcard__btn--view {
    flex: 1;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid var(--color-border-strong);
    background: transparent;
    color: var(--color-text-secondary);
}

.altronix-pcard__btn--view:hover {
    border-color: var(--color-accent-blue);
    color: var(--color-accent-blue);
    background: rgba(0,166,251,0.12);
}

/* ── Cart button: added state (green) ── */

/* Hide WooCommerce "View cart" link */
a.added_to_cart, .added_to_cart.wc-forward { display: none !important; }

/* Footer 🛒 — loading */
.altronix-pcard__btn--cart.loading {
    opacity: 0.5 !important;
    pointer-events: none !important;
    cursor: wait !important;
}

/* Footer 🛒 — added → green */
.altronix-pcard__btn--cart.added {
    background: #10b981 !important;
    box-shadow: 0 4px 12px rgba(16,185,129,0.35) !important;
    pointer-events: none !important;
    cursor: default !important;
}

/* Overlay "Ajouter au panier" — added → green */
.altronix-pcard__overlay-btn--cart.added {
    background: #10b981 !important;
    border-color: transparent !important;
    pointer-events: none !important;
}

/* Overlay "Ajouter au panier" — loading */
.altronix-pcard__overlay-btn--cart.loading {
    opacity: 0.5 !important;
    pointer-events: none !important;
    cursor: wait !important;
}

.altronix-pcard__btn--cart:hover { opacity: 0.82; }

.altronix-pcard__name-link:hover { color: var(--color-accent-blue); }

/* Focus states — all devices */
.altronix-pcard__btn--view:focus-visible {
    outline: 2px solid var(--color-accent-blue);
    outline-offset: 2px;
}
.altronix-pcard__btn--cart:focus-visible {
    outline: 2px solid var(--color-accent-blue);
    outline-offset: 2px;
}

.altronix-pcard__btn--cart {
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    justify-content: center;
    background: var(--gradient-accent);
    border: none;
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
}

.altronix-pcard__btn--cart:hover { opacity: 0.88; transform: translateY(-1px); }

/* ══════════════════════════════════════════════════════════════
   PAGINATION
   ══════════════════════════════════════════════════════════════ */

.altronix-shop__pagination {
    margin-block-start: var(--space-12);
    padding-block-start: var(--space-8);
    border-block-start: 1px solid var(--color-border-subtle);
    position: relative;
}

/* Accent line au centre du séparateur */
.altronix-shop__pagination::before {
    content: '';
    position: absolute;
    inset-block-start: -1px;
    inset-inline-start: 50%;
    translate: -50% 0;
    width: 120px;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--color-accent-blue), transparent);
}

.woocommerce-pagination {
    display: flex;
    justify-content: center;
}

.woocommerce-pagination ul.page-numbers {
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-pagination ul.page-numbers li { display: block; }

/* Base — tous les éléments */
.woocommerce-pagination a.page-numbers,
.woocommerce-pagination span.page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    min-inline-size: 40px;
    block-size: 40px;
    padding-inline: var(--space-3);
    background: transparent;
    border: 1px solid var(--color-border-subtle);
    border-radius: 10px;
    color: var(--color-text-muted);
    font-size: var(--fs-sm);
    font-weight: 500;
    text-decoration: none;
    transition: all var(--duration-fast) var(--ease-out);
}

/* Dots (...) — pas de bordure */
.woocommerce-pagination span.page-numbers.dots {
    border-color: transparent;
    background: transparent;
    color: var(--color-text-muted);
    letter-spacing: 0.15em;
    cursor: default;
    min-inline-size: 32px;
}

/* Hover */
.woocommerce-pagination a.page-numbers:hover {
    border-color: var(--color-accent-blue);
    color: var(--color-accent-blue);
    background: rgba(0, 166, 251, 0.07);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 166, 251, 0.15);
}

/* Page courante */
.woocommerce-pagination span.page-numbers.current {
    background: var(--gradient-accent);
    border-color: transparent;
    color: #fff;
    font-weight: 700;
    box-shadow: 0 0 20px rgba(0, 166, 251, 0.35), 0 4px 12px rgba(0, 166, 251, 0.2);
    transform: translateY(-1px);
}

/* Prev / Next — plus larges et distincts */
.woocommerce-pagination a.page-numbers.prev,
.woocommerce-pagination a.page-numbers.next {
    min-inline-size: 72px;
    padding-inline: var(--space-4);
    font-weight: 600;
    font-size: var(--fs-sm);
    color: var(--color-text-secondary);
    border-color: var(--color-border-strong);
    border-radius: 12px;
    gap: var(--space-1);
    letter-spacing: 0.02em;
}

.woocommerce-pagination a.page-numbers.prev:hover,
.woocommerce-pagination a.page-numbers.next:hover {
    border-color: var(--color-accent-blue);
    color: var(--color-accent-blue);
    background: rgba(0, 166, 251, 0.07);
    box-shadow: 0 6px 16px rgba(0, 166, 251, 0.15);
}

@media (max-width: 480px) {
    .woocommerce-pagination a.page-numbers,
    .woocommerce-pagination span.page-numbers { min-inline-size: 36px; block-size: 36px; font-size: var(--fs-xs); }
    .woocommerce-pagination a.page-numbers.prev,
    .woocommerce-pagination a.page-numbers.next { min-inline-size: 56px; padding-inline: var(--space-3); }
}

/* ══════════════════════════════════════════════════════════════
   EMPTY STATE
   ══════════════════════════════════════════════════════════════ */

.altronix-shop__empty {
    text-align: center;
    padding-block: var(--space-24);
    color: var(--color-text-muted);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-6);
}

.altronix-shop__empty svg { opacity: 0.3; }

.altronix-shop__empty p {
    font-size: var(--fs-lg);
    color: var(--color-text-secondary);
    margin: 0;
}

.altronix-shop__empty-cta {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    color: var(--color-text-secondary);
    text-decoration: none;
    padding: var(--space-3) var(--space-6);
    border-radius: 8px;
    font-size: var(--fs-sm);
    font-weight: 500;
    transition: border-color var(--duration-fast), color var(--duration-fast);
}

.altronix-shop__empty-cta:hover {
    border-color: var(--color-accent-blue);
    color: var(--color-accent-blue);
}

/* ══════════════════════════════════════════════════════════════
   RECENTLY VIEWED
   ══════════════════════════════════════════════════════════════ */

.altronix-shop-recent {
    border-block-start: 1px solid var(--color-border-subtle);
    padding-block: var(--space-12);
}

.altronix-shop-recent__inner {
    max-inline-size: 1320px;
    margin-inline: auto;
    padding-inline: var(--space-6);
}

.altronix-shop-recent__title {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-family: var(--font-display);
    font-size: var(--fs-xl);
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-8);
}

.altronix-shop-recent__title svg { color: var(--color-accent-blue); }

.altronix-shop-recent__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--space-4);
}

.altronix-shop-recent__item {
    display: flex;
    gap: var(--space-3);
    align-items: center;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 10px;
    padding: var(--space-3);
    text-decoration: none;
    transition: border-color var(--duration-base), transform var(--duration-base);
}

.altronix-shop-recent__item:hover {
    border-color: var(--color-accent-blue);
    transform: translateY(-2px);
}

.altronix-shop-recent__item img {
    width: 52px;
    height: 52px;
    object-fit: contain;
    border-radius: 6px;
    background: var(--color-bg-secondary);
    flex-shrink: 0;
}

.altronix-shop-recent__info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.altronix-shop-recent__name {
    font-size: var(--fs-sm);
    font-weight: 500;
    color: var(--color-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.altronix-shop-recent__price {
    font-size: var(--fs-sm);
    font-weight: 700;
    color: var(--color-accent-blue);
}

/* ══════════════════════════════════════════════════════════════
   SINGLE PRODUCT — NEW PROFESSIONAL LAYOUT (.altronix-sp)
   ══════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════
   DEFINITIVE LAYOUT FIX
   Gallery is a DIRECT child of .altronix-sp → flex-item (no float issues).
   Float property has NO EFFECT on flex items — this is the key insight.
   ═══════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════
   DEFINITIVE: CSS Grid with named areas.
   No flex percentage+gap ambiguity. Gallery always 40%, summary 60%.
   Float/width on .woocommerce-product-gallery is irrelevant — grid
   positioning completely overrides it.
   ═══════════════════════════════════════════════════════════════════ */

.woocommerce .altronix-sp,
.woocommerce-page .altronix-sp {
    display: grid !important;
    grid-template-columns: 40% 1fr !important;
    grid-template-rows: auto !important;
    grid-template-areas:
        "breadcrumb breadcrumb"
        "gallery    summary"
        "after      after" !important;
    column-gap: var(--space-6) !important;
    row-gap: 0 !important;
    align-items: start !important;
}

/* Each child → explicit named area */
.woocommerce .altronix-sp .altronix-sp__breadcrumb {
    grid-area: breadcrumb !important;
    margin-block-end: var(--space-3);
}

.woocommerce .altronix-sp .woocommerce-product-gallery {
    grid-area: gallery !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    align-self: start;
}

.woocommerce .altronix-sp .altronix-sp__summary {
    grid-area: summary !important;
    min-width: 0;
    align-self: start;
}

.woocommerce .altronix-sp .altronix-sp__after {
    grid-area: after !important;
    margin-block-start: var(--space-3); /* 12px max */
}

/* Wrapper padding — compact */
.altronix-sp {
    padding-block: var(--space-3) var(--space-8);
    color: var(--color-text-primary);
}

/* Breadcrumb */
.altronix-sp__breadcrumb {
    margin-block-end: var(--space-6);
    display: block;
    width: 100%;
}

.altronix-sp__bc-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
}

.altronix-sp__bc-list li { display: flex; align-items: center; gap: var(--space-1); }
.altronix-sp__bc-list a { color: var(--color-text-secondary); text-decoration: none; transition: color var(--duration-fast); }
.altronix-sp__bc-list a:hover { color: var(--color-accent-blue); }
.altronix-sp__bc-sep { color: var(--color-text-muted); font-size: var(--fs-xs); }

/* .altronix-sp__hero no longer used — gallery is direct flex child of .altronix-sp */
.altronix-sp__gallery-wrap { display: none; } /* safety: hide if still in DOM */

/* ── Gallery styling (direct flex child of .altronix-sp) ── */

/* Gallery container: bordered card */
.woocommerce .altronix-sp .woocommerce-product-gallery {
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: var(--color-bg-secondary) !important;
}

/* ══ Gallery: the RELIABLE approach — set height on container,
   use object-fit on the image. Stop fighting flexslider's chain.
   ══════════════════════════════════════════════════════════════ */

/* Gallery card */
.woocommerce .altronix-sp .woocommerce-product-gallery {
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: var(--color-bg-secondary) !important;
    position: relative !important;
}

/* flexslider: let JS manage its height, we cap the main image only */
.woocommerce .altronix-sp .woocommerce-product-gallery .flex-viewport {
    overflow: hidden !important;
    /* DO NOT set height here — let flexslider do its job */
}

/* The visible main product image — absolute approach */
.woocommerce .altronix-sp .woocommerce-product-gallery .woocommerce-product-gallery__image img,
.woocommerce .altronix-sp .woocommerce-product-gallery__image .wp-post-image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: 420px !important;
    min-height: 280px !important;
    object-fit: contain !important;
    padding: var(--space-4) !important;
    box-sizing: border-box !important;
    background: var(--color-bg-secondary) !important;
}

/* Zoom icon */
.woocommerce .altronix-sp .woocommerce-product-gallery__trigger {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
}

/* Thumbnails — single canonical rule (was duplicated 3×) */
.woocommerce .altronix-sp .flex-control-thumbs {
    display: flex !important;
    flex-wrap: wrap;
    gap: var(--space-2);
    padding: var(--space-3) !important;
    background: var(--color-bg-secondary);
    border-block-start: 1px solid var(--color-border-subtle);
    list-style: none !important;
    margin: 0 !important;
}

.woocommerce .altronix-sp .flex-control-thumbs li { list-style: none; }

.woocommerce .altronix-sp .flex-control-thumbs img {
    width: 60px !important;
    height: 60px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    border: 2px solid transparent !important;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity var(--duration-fast), border-color var(--duration-fast);
}

.woocommerce .altronix-sp .flex-control-thumbs .flex-active img,
.woocommerce .altronix-sp .flex-control-thumbs img:hover {
    border-color: var(--color-accent-blue) !important;
    opacity: 1;
}

/* Zoom icon */
.woocommerce .altronix-sp .woocommerce-product-gallery__trigger {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-secondary) !important;
}

/* .altronix-sp__gallery-wrap removed from template — dead CSS deleted */

/* ── Summary — full width below gallery */
.altronix-sp__summary {
    display: block;
    width: 100%;
}

/* ── Info panel (alias kept for compatibility) ──────────── */
.altronix-sp__info {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/* ── Summary: compact spacing ────────────────────────────── */

/* Title */
.altronix-sp__summary .product_title {
    font-family: var(--font-display) !important;
    font-size: var(--fs-2xl) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    line-height: 1.2 !important;
    margin: 0 0 var(--space-2) 0 !important;
}

/* Price */
.altronix-sp__summary p.price,
.altronix-sp__summary span.price {
    font-family: var(--font-display) !important;
    font-size: var(--fs-3xl) !important;
    font-weight: 800 !important;
    color: var(--color-accent-blue) !important;
    margin: 0 0 var(--space-2) 0 !important;
    display: block;
}

/* Short description */
.altronix-sp__summary .woocommerce-product-details__short-description {
    margin-block-end: var(--space-3) !important;
    font-size: var(--fs-sm) !important;
    color: var(--color-text-secondary) !important;
    line-height: 1.6 !important;
    padding-block: var(--space-2) !important;
    border-block: 1px solid var(--color-border-subtle) !important;
}

/* Add to cart row */
.altronix-sp__summary .cart {
    margin-block-end: var(--space-3) !important;
    display: flex !important;
    align-items: center !important;
    gap: var(--space-3) !important;
    flex-wrap: nowrap !important;
}

.altronix-sp__summary .quantity input {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    font-size: var(--fs-base) !important;
    width: 72px !important;
    height: 48px !important;
    text-align: center !important;
    padding: 0 var(--space-2) !important;
    flex-shrink: 0 !important;
}

/* Add to Cart button — full remaining width */
.altronix-sp__summary .single_add_to_cart_button {
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-family: var(--font-display) !important;
    font-weight: 700 !important;
    font-size: var(--fs-base) !important;
    padding: 14px var(--space-6) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    flex: 1 !important;
    white-space: nowrap !important;
    box-shadow: 0 4px 20px rgba(0,166,251,0.35) !important;
    transition: opacity var(--duration-base), transform var(--duration-fast) !important;
}

.altronix-sp__summary .single_add_to_cart_button:hover {
    opacity: 0.88 !important;
    transform: translateY(-1px) !important;
}

.altronix-sp__summary .single_add_to_cart_button.is-added {
    background: #10b981 !important;
    box-shadow: 0 8px 24px rgba(16,185,129,0.28) !important;
    cursor: default !important;
    pointer-events: none !important;
}

.altronix-sp__cart-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-block: var(--space-2) var(--space-3);
    padding: var(--space-3) var(--space-4);
    border: 1px solid rgba(16,185,129,0.28);
    border-radius: 10px;
    background: rgba(16,185,129,0.10);
    color: #b8f5d6;
    font-size: var(--fs-sm);
    font-weight: 600;
}

.altronix-sp__cart-status a {
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
}

.altronix-sp__cart-status a:hover {
    opacity: 0.85;
}

/* Meta (SKU, Category) — card style, compact */
.altronix-sp__summary .product_meta {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    padding: var(--space-2) var(--space-4) !important;
    font-size: var(--fs-xs) !important;
    color: var(--color-text-muted) !important;
    margin-block-end: var(--space-3) !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: var(--space-1) var(--space-4) !important;
}

.altronix-sp__summary .product_meta > span { display: inline-flex; align-items: center; gap: var(--space-1); }
.altronix-sp__summary .product_meta .label { font-weight: 600; color: var(--color-text-secondary) !important; }
.altronix-sp__summary .product_meta a { color: var(--color-accent-blue) !important; text-decoration: none; }

.altronix-sp__summary .star-rating { color: #F59E0B !important; }

/* ── Global WC spacing overrides for compact layout ──────── */
/* Remove WooCommerce default margins between summary hook outputs */
.altronix-sp__summary > * { margin-block-end: 0 !important; }

/* Add minimal spacing between direct children */
.altronix-sp__summary .woocommerce-product-rating { margin-block: var(--space-1) 0 !important; }

/* Remove extra padding from WC form elements */
.altronix-sp__summary form.cart { padding: 0 !important; }

/* Wishlist link compact */
.altronix-sp__summary .yith-wcwl-add-to-wishlist,
.altronix-sp__summary .wishlist-fragment { margin-block: var(--space-1) !important; }

/* Category chips */
.altronix-sp__cats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-block-end: var(--space-2);
}

.altronix-sp__cat {
    font-size: 11px;
    font-weight: 700;
    color: var(--color-accent-blue);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    background: rgba(0,166,251,0.08);
    padding: 3px 10px;
    border-radius: 100px;
    text-decoration: none;
}

/* Title */
.altronix-sp__title {
    font-family: var(--font-display);
    font-size: var(--fs-3xl);
    font-weight: 700;
    color: var(--color-text-primary);
    line-height: 1.2;
    margin: 0;
}

/* Rating */
.altronix-sp__rating .star-rating { color: #F59E0B !important; font-size: var(--fs-base) !important; }

/* Price + Stock row */
.altronix-sp__price-row {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    flex-wrap: wrap;
}

.altronix-sp__price .woocommerce-Price-amount {
    font-family: var(--font-display) !important;
    font-size: var(--fs-4xl) !important;
    font-weight: 800 !important;
    color: var(--color-accent-blue) !important;
}

.altronix-sp__price del .woocommerce-Price-amount {
    font-size: var(--fs-lg) !important;
    font-weight: 400 !important;
    color: var(--color-text-muted) !important;
}

.altronix-sp__price ins { text-decoration: none; }

.altronix-sp__stock .stock {
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    padding: 5px 14px !important;
    border-radius: 100px !important;
    display: inline-flex !important;
    align-items: center;
    gap: var(--space-2);
}

.altronix-sp__stock .in-stock {
    background: rgba(16,185,129,0.12) !important;
    color: var(--color-success) !important;
    border: 1px solid rgba(16,185,129,0.25) !important;
}

.altronix-sp__stock .out-of-stock {
    background: rgba(239,68,68,0.1) !important;
    color: var(--color-danger) !important;
    border: 1px solid rgba(239,68,68,0.2) !important;
}

/* Excerpt */
.altronix-sp__excerpt {
    font-size: var(--fs-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.altronix-sp__excerpt p { margin: 0; }

/* Divider — minimal */
.altronix-sp__divider {
    border: none;
    border-block-start: 1px solid var(--color-border-subtle);
    margin: var(--space-2) 0;
}

/* Add to Cart */
.altronix-sp__summary form.cart {
    display: flex !important;
    align-items: center !important;
    gap: var(--space-3) !important;
    flex-wrap: wrap;
}

.altronix-sp__summary form.cart .quantity { flex-shrink: 0; }

.altronix-sp__summary form.cart.altronix-cart-in-cart .quantity {
    display: none !important;
}

.altronix-sp__summary form.cart.altronix-cart-in-cart .single_add_to_cart_button {
    flex: 1 1 100% !important;
}

.altronix-sp__summary form.cart .quantity input {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    font-size: var(--fs-base) !important;
    font-weight: 600 !important;
    width: 80px !important;
    height: 48px !important;
    text-align: center !important;
    padding: 0 var(--space-3) !important;
}

.altronix-sp__summary form.cart button[type="submit"],
.altronix-sp__summary form.cart .single_add_to_cart_button {
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    padding: 14px var(--space-8) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    flex: 1;
    transition: opacity var(--duration-base), transform var(--duration-fast) !important;
    box-shadow: 0 4px 20px rgba(0,166,251,0.3) !important;
}

.altronix-sp__summary form.cart button[type="submit"]:hover { opacity: 0.88 !important; transform: translateY(-1px) !important; }

/* WhatsApp + Devis CTAs — compact */
.altronix-sp__cta-row {
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
    margin-block-end: var(--space-2);
}

.altronix-sp__btn {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-sm);
    font-weight: 600;
    padding: 10px var(--space-5);
    border-radius: 8px;
    text-decoration: none;
    transition: opacity var(--duration-fast), transform var(--duration-fast);
    flex: 1;
    justify-content: center;
}

.altronix-sp__btn--wa {
    background: #25D366;
    color: #fff;
    box-shadow: 0 4px 12px rgba(37,211,102,0.3);
}

.altronix-sp__btn--wa:hover { opacity: 0.88; transform: translateY(-1px); }

.altronix-sp__btn--quote {
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-strong);
    color: var(--color-text-secondary);
}

.altronix-sp__btn--quote:hover {
    border-color: var(--color-accent-blue);
    color: var(--color-accent-blue);
    background: rgba(0,166,251,0.06);
}

/* Trust badges — compact horizontal row */
.altronix-sp__trust {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-1);
    margin-block: var(--space-2);
}

.altronix-sp__trust-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-1);
    font-size: 11px;
    color: var(--color-text-secondary);
    font-weight: 500;
    padding: var(--space-2) var(--space-2);
    background: var(--color-surface-glass);
    border: 1px solid var(--color-border-subtle);
    border-radius: 8px;
}

.altronix-sp__trust-item svg { color: var(--color-accent-blue); flex-shrink: 0; }

.altronix-sp__trust-item svg { color: var(--color-accent-blue); flex-shrink: 0; }

/* Meta */
.altronix-sp__meta .product_meta {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.altronix-sp__meta .product_meta > span {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.altronix-sp__meta .product_meta .label {
    font-weight: 600;
    color: var(--color-text-secondary);
    min-inline-size: 80px;
}

.altronix-sp__meta .product_meta a {
    color: var(--color-accent-blue);
    text-decoration: none;
}

/* Social share */
.altronix-sp__share {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.altronix-sp__share-label {
    font-size: var(--fs-xs);
    font-weight: 600;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.altronix-sp__share-btns { display: flex; gap: var(--space-2); }

.altronix-sp__share-btn {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    color: var(--color-text-muted);
    text-decoration: none;
    transition: color var(--duration-fast), border-color var(--duration-fast), background var(--duration-fast);
}

.altronix-sp__share-btn--wa:hover  { color: #25D366; border-color: #25D366; background: rgba(37,211,102,0.08); }
.altronix-sp__share-btn--fb:hover  { color: #1877F2; border-color: #1877F2; background: rgba(24,119,242,0.08); }
.altronix-sp__share-btn--li:hover  { color: #0A66C2; border-color: #0A66C2; background: rgba(10,102,194,0.08); }

/* ── After (Tabs + Related) ─────────────────────────────── */
.altronix-sp__after {
    clear: both; /* clear gallery float so description starts below */
    display: block !important;
    width: 100%;
    margin-block-start: var(--space-6);
    padding-block-start: 0;
}

/* ── Technical Information Section (tabs) ─────────────────── */
.altronix-sp__after .woocommerce-tabs ul.tabs {
    display: flex !important;
    gap: 0 !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border-block-end: 2px solid var(--color-border-subtle) !important;
}

.altronix-sp__after .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

.altronix-sp__after .woocommerce-tabs ul.tabs li a {
    display: block !important;
    padding: var(--space-3) var(--space-6) !important;
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    color: var(--color-text-muted) !important;
    text-decoration: none !important;
    border-block-end: 2px solid transparent !important;
    margin-block-end: -2px !important;
    transition: color var(--duration-fast), border-color var(--duration-fast) !important;
}

.altronix-sp__after .woocommerce-tabs ul.tabs li.active a,
.altronix-sp__after .woocommerce-tabs ul.tabs li a:hover {
    color: var(--color-accent-blue) !important;
    border-block-end-color: var(--color-accent-blue) !important;
}

/* Description panel — compact card */
.altronix-sp__after .woocommerce-tabs .panel {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-block-start: none !important;
    border-radius: 0 0 12px 12px !important;
    padding: var(--space-5) var(--space-6) !important;
    color: var(--color-text-secondary) !important;
    font-size: var(--fs-sm) !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Inner heading of description panel */
.altronix-sp__after .woocommerce-tabs .panel h2 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-lg) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    margin: 0 0 var(--space-4) 0 !important;
    padding-block-end: var(--space-3) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

/* Description text */
.altronix-sp__after .woocommerce-tabs .panel p {
    margin-block-end: var(--space-3) !important;
    color: var(--color-text-secondary) !important;
    font-size: var(--fs-sm) !important;
}

/* Related products */
.altronix-sp__after .related.products,
.single-product .related.products {
    margin-block-start: var(--space-12);
    padding-block-start: var(--space-8);
    border-block-start: 1px solid var(--color-border-subtle);
}

.altronix-sp__after .related.products > h2,
.single-product .related.products > h2 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-2xl) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    margin-block-end: var(--space-6) !important;
}

/* 4 columns on large desktop */
.altronix-sp__after .related ul.altronix-products,
.single-product .related ul.altronix-products {
    grid-template-columns: repeat(4, 1fr) !important;
}

/* Smaller image zone for 4-col related cards */
.altronix-sp__after .related .altronix-pcard__image-wrap,
.single-product .related .altronix-pcard__image-wrap {
    height: 180px !important;
}

@media (max-width: 1024px) {
    .altronix-sp__after .related ul.altronix-products,
    .single-product .related ul.altronix-products {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .altronix-sp__after .related .altronix-pcard__image-wrap,
    .single-product .related .altronix-pcard__image-wrap {
        height: 200px !important;
    }
}

/* ── Single product Responsive ──────────────────────────── */
/* Tablet large: 768px–1023px — 2-col with smaller gallery */
@media (max-width: 1023px) and (min-width: 769px) {
    .woocommerce .altronix-sp,
    .woocommerce-page .altronix-sp {
        grid-template-columns: 45% 1fr !important;
        column-gap: var(--space-5) !important;
    }

    .altronix-sp__summary .product_title { font-size: var(--fs-xl) !important; }
    .altronix-sp__trust { grid-template-columns: repeat(2, 1fr) !important; }
}

/* Tablet small + Mobile: ≤768px — stacked single column */
@media (max-width: 768px) {
    .woocommerce .altronix-sp,
    .woocommerce-page .altronix-sp {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "breadcrumb"
            "gallery"
            "summary"
            "after" !important;
    }

    .altronix-sp__trust { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 767px) {
    .altronix-sp { padding-inline: var(--space-4) !important; }
    .altronix-sp__cta-row { flex-direction: column; }
    .altronix-sp__btn { width: 100% !important; justify-content: center; }

    .single-product .related ul.altronix-products {
        grid-template-columns: 1fr !important;
    }
}

/* ══════════════════════════════════════════════════════════════
   SINGLE PRODUCT PAGE — LEGACY (old CSS kept for compatibility)
   ══════════════════════════════════════════════════════════════ */

.altronix-product {
    background: var(--color-bg-primary);
    color: var(--color-text-primary);
}

.altronix-product__inner {
    max-inline-size: 1320px;
    margin-inline: auto;
    padding: var(--space-12) var(--space-6);
}

/* WC default columns */
.woocommerce div.product {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: var(--space-12) !important;
    align-items: start;
}

.woocommerce div.product div.images { grid-column: 1; }
.woocommerce div.product div.summary { grid-column: 2; }
.woocommerce div.product .woocommerce-tabs { grid-column: 1 / -1; }
.woocommerce div.product .related.products { grid-column: 1 / -1; }

/* Product images */
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: var(--color-bg-secondary) !important;
}

/* Summary */
.woocommerce div.product div.summary .product_title {
    font-family: var(--font-display) !important;
    font-size: var(--fs-3xl) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    margin-block-end: var(--space-4) !important;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    font-size: var(--fs-2xl) !important;
    font-weight: 700 !important;
    color: var(--color-accent-blue) !important;
    margin-block-end: var(--space-6) !important;
}

.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
    color: var(--color-text-muted) !important;
    font-size: var(--fs-lg) !important;
    margin-inline-end: var(--space-2);
}

/* Stock status */
.woocommerce div.product .stock {
    font-size: var(--fs-sm) !important;
    padding: 4px 12px !important;
    border-radius: 100px !important;
    display: inline-block !important;
}

.woocommerce div.product .stock.in-stock {
    background: rgba(16,185,129,0.1) !important;
    color: var(--color-success) !important;
    border: 1px solid rgba(16,185,129,0.2) !important;
}

.woocommerce div.product .stock.out-of-stock {
    background: rgba(239,68,68,0.1) !important;
    color: var(--color-danger) !important;
    border: 1px solid rgba(239,68,68,0.2) !important;
}

/* Add to cart */
.woocommerce div.product .cart { display: flex !important; align-items: center !important; gap: var(--space-3) !important; flex-wrap: wrap; }

.woocommerce div.product form.cart .quantity input {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    font-size: var(--fs-base) !important;
    width: 80px !important;
    text-align: center;
    padding: var(--space-2) var(--space-3) !important;
}

.woocommerce div.product form.cart button[type="submit"] {
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    padding: var(--space-3) var(--space-8) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: opacity var(--duration-base) !important;
}

.woocommerce div.product form.cart button[type="submit"]:hover { opacity: 0.88 !important; }

/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
    border-block-end: 1px solid var(--color-border-subtle) !important;
    padding: 0 !important;
    list-style: none !important;
    display: flex !important;
    gap: var(--space-1) !important;
    margin: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    font-size: var(--fs-sm) !important;
    color: var(--color-text-muted) !important;
    font-weight: 500 !important;
    padding: var(--space-3) var(--space-5) !important;
    display: block !important;
    border-block-end: 2px solid transparent !important;
    transition: color var(--duration-fast) !important;
    text-decoration: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--color-accent-blue) !important;
    border-block-end-color: var(--color-accent-blue) !important;
}

.woocommerce div.product .woocommerce-tabs .panel {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 0 0 12px 12px !important;
    padding: var(--space-8) !important;
    color: var(--color-text-secondary) !important;
    margin: 0 !important;
}

/* ══════════════════════════════════════════════════════════════
   WOOCOMMERCE BLOCKS CART — Professional dark theme
   Targets .wc-block-cart (blocks-based cart page)
   ══════════════════════════════════════════════════════════════ */

/* ── Page container ─────────────────────────────────────────── */
.wc-block-cart {
    max-inline-size: 1320px !important;
    margin-inline: auto !important;
    padding-inline: var(--space-6) !important;
    padding-block: var(--space-8) !important;
    color: var(--color-text-primary) !important;
}

/* ── Layout: products left, totals right ────────────────────── */
.wc-block-cart .wc-block-cart__main-heading { display: none !important; }

.wc-block-cart .wc-block-cart__main {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* ── Table headers — hidden (unprofessional table look) ─────── */
.wc-block-cart-items .wc-block-cart-items__header {
    display: none !important;
}

/* ── Scrollable products area — keeps page stable ───────────── */
.wc-block-cart .wc-block-cart__main {
    overflow: visible !important; /* reset to allow inner scroll */
}

.wc-block-cart-items {
    max-height: 520px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scroll-behavior: smooth;
}

/* Custom scrollbar */
.wc-block-cart-items::-webkit-scrollbar { width: 4px; }
.wc-block-cart-items::-webkit-scrollbar-track { background: transparent; }
.wc-block-cart-items::-webkit-scrollbar-thumb {
    background: var(--color-border-strong);
    border-radius: 2px;
}
.wc-block-cart-items::-webkit-scrollbar-thumb:hover { background: var(--color-accent-blue); }

/* ── Each product row — card style ─────────────────────────── */
.wc-block-cart-items__row,
.wc-block-cart-item {
    border-block-end: 1px solid var(--color-border-subtle) !important;
    padding: var(--space-4) var(--space-4) !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    gap: var(--space-3) !important;
}

.wc-block-cart-items__row:last-child,
.wc-block-cart-item:last-child { border-block-end: none !important; }

/* Product image */
.wc-block-cart-item__image img {
    width: 80px !important;
    height: 80px !important;
    object-fit: contain !important;
    border-radius: 8px !important;
    border: 1px solid var(--color-border-subtle) !important;
    background: var(--color-bg-primary) !important;
    padding: var(--space-2) !important;
}

/* Product name */
.wc-block-cart-item__product-name,
.wc-block-cart-item__description h3,
.wc-block-cart-item__description .product-name {
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    color: var(--color-text-primary) !important;
    text-decoration: none !important;
}

.wc-block-cart-item__product-name a,
.wc-block-cart-item__description a {
    color: var(--color-accent-blue) !important;
    text-decoration: none !important;
    transition: opacity var(--duration-fast) !important;
}

.wc-block-cart-item__product-name a:hover { opacity: 0.8 !important; }

/* Price */
.wc-block-cart-item__prices .wc-block-components-product-price,
.wc-block-cart-item__product-price {
    font-family: var(--font-display) !important;
    font-weight: 700 !important;
    color: var(--color-text-secondary) !important;
    font-size: var(--fs-sm) !important;
}

/* Row total */
.wc-block-cart-item__total .wc-block-components-product-price__value,
.wc-block-cart-item__total .price,
.wc-block-cart-item__total {
    font-family: var(--font-display) !important;
    font-weight: 800 !important;
    color: var(--color-accent-blue) !important;
    font-size: var(--fs-base) !important;
}

/* Quantity controls */
.wc-block-components-quantity-selector {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    display: inline-flex !important;
    align-items: center !important;
}

.wc-block-components-quantity-selector__button {
    background: transparent !important;
    border: none !important;
    color: var(--color-text-secondary) !important;
    padding: 0 !important;
    cursor: pointer !important;
    font-size: var(--fs-lg) !important;
    line-height: 1 !important;
    transition: color var(--duration-fast), background var(--duration-fast) !important;
    min-width: 36px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.wc-block-components-quantity-selector__button > * {
    margin: 0 auto !important;
}

.wc-block-components-quantity-selector__button:hover {
    background: var(--color-bg-secondary) !important;
    color: var(--color-accent-blue) !important;
}

.wc-block-components-quantity-selector__input {
    background: transparent !important;
    border: none !important;
    border-inline: 1px solid var(--color-border-subtle) !important;
    color: var(--color-text-primary) !important;
    font-size: var(--fs-base) !important;
    font-weight: 600 !important;
    text-align: center !important;
    width: 48px !important;
    height: 40px !important;
    padding: 0 !important;
    outline: none !important;
}

/* Remove button — icon only, no background box */
.wc-block-cart-item__remove-link,
button.wc-block-cart-item__remove-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    color: var(--color-text-muted) !important;
    background: transparent !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 0 !important;
    cursor: pointer !important;
    transition: color var(--duration-fast), background var(--duration-fast) !important;
    flex-shrink: 0 !important;
}
.wc-block-cart-item__remove-link:hover {
    color: var(--color-danger) !important;
    background: rgba(239,68,68,0.08) !important;
}
/* Hide text label, keep only icon */
.wc-block-cart-item__remove-link .wc-block-cart-item__remove-link-label {
    display: none !important;
}

/* Description text below product name */
.wc-block-cart-item__description-price,
.wc-block-cart-item__description p {
    font-size: var(--fs-xs) !important;
    color: var(--color-text-muted) !important;
    margin-block-start: 4px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 1 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

/* ── Cart Sidebar (Totals) ──────────────────────────────────── */
.wc-block-cart .wc-block-cart__sidebar {
    position: sticky !important;
    top: 90px !important;
}

.wc-block-components-totals-wrapper {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Order Summary title */
.wc-block-cart__sidebar .wp-block-heading,
.wc-block-cart__sidebar h2,
.wc-block-cart__sidebar h3 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-lg) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    padding: var(--space-5) var(--space-5) var(--space-4) !important;
    margin: 0 !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

/* Totals rows */
.wc-block-components-totals-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: var(--space-3) var(--space-5) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
    font-size: var(--fs-sm) !important;
    color: var(--color-text-secondary) !important;
}

.wc-block-components-totals-item__label { color: var(--color-text-muted) !important; }

.wc-block-components-totals-item__value {
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
}

/* Grand Total */
.wc-block-components-totals-footer-item {
    padding: var(--space-4) var(--space-5) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    font-family: var(--font-display) !important;
    font-weight: 700 !important;
    font-size: var(--fs-base) !important;
    color: var(--color-text-primary) !important;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__value .wc-block-formatted-money-amount,
.wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
    font-family: var(--font-display) !important;
    font-size: var(--fs-2xl) !important;
    font-weight: 800 !important;
    color: var(--color-accent-blue) !important;
}

/* Coupon */
.wc-block-components-totals-coupon {
    padding: var(--space-3) var(--space-5) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

.wc-block-components-totals-coupon__form {
    display: flex !important;
    gap: var(--space-2) !important;
}

.wc-block-components-totals-coupon__input input,
.wc-block-components-form-token-field-label__input {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    padding: var(--space-2) var(--space-3) !important;
    font-size: var(--fs-sm) !important;
    height: 40px !important;
    transition: border-color var(--duration-fast) !important;
}

.wc-block-components-totals-coupon__input input:focus {
    border-color: var(--color-accent-blue) !important;
    outline: none !important;
}

.wc-block-components-totals-coupon__button,
.wc-block-components-button.wc-block-components-totals-coupon__button {
    background: transparent !important;
    border: 1px solid var(--color-border-strong) !important;
    color: var(--color-text-secondary) !important;
    border-radius: 8px !important;
    padding: var(--space-2) var(--space-4) !important;
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    height: 40px !important;
    white-space: nowrap !important;
    transition: border-color var(--duration-fast), color var(--duration-fast) !important;
}

.wc-block-components-totals-coupon__button:hover {
    border-color: var(--color-accent-blue) !important;
    color: var(--color-accent-blue) !important;
}

/* Proceed to checkout button */
.wc-block-cart__submit-container {
    padding: var(--space-4) var(--space-5) !important;
}

.wc-block-cart__submit-container .wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-container a.checkout-button,
.wc-block-cart__submit-container .wc-block-components-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    padding: var(--space-4) var(--space-6) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    text-align: center !important;
    box-shadow: 0 4px 20px rgba(0,166,251,0.3) !important;
    transition: opacity var(--duration-base), transform var(--duration-fast) !important;
}

.wc-block-cart__submit-container .wc-block-components-button:hover {
    opacity: 0.9 !important;
    transform: translateY(-1px) !important;
}

/* ══════════════════════════════════════════════════════════════
   MOBILE & TABLET — Cart + Checkout complete fix (≤1023px)
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 1023px) {

    /* ── City selector: remove empty gap ──────────────────────── */
    .alx-ship-selector__inner {
        flex-direction: column !important;
        gap: var(--space-2) !important;
        padding: var(--space-3) var(--space-4) !important;
    }

    .alx-ship-selector__field { flex: none !important; width: 100% !important; }
    .alx-ship-selector__info  { flex: none !important; width: 100% !important; }

    /* ── Blocks cart page ─────────────────────────────────────── */
    .wc-block-cart {
        padding-inline: var(--space-3) !important;
        padding-block: var(--space-4) !important;
    }

    /* Stack: products first, cart totals below (not beside) */
    .wc-block-cart,
    .wp-block-woocommerce-cart {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--space-6) !important;
    }

    .wc-block-cart .wc-block-cart__main,
    .wp-block-woocommerce-cart .wc-block-cart__main {
        order: 1 !important;
        inline-size: 100% !important;
    }

    .wc-block-cart .wc-block-cart__sidebar,
    .wp-block-woocommerce-cart .wc-block-cart__sidebar {
        order: 2 !important;
        inline-size: 100% !important;
        position: static !important;
        inset-block-start: auto !important;
    }

    /* Cart item: fix layout so price doesn't get cut */
    .wc-block-cart-items__row,
    .wc-block-cart-item {
        display: grid !important;
        grid-template-columns: 60px 1fr auto !important;
        grid-template-rows: auto !important;
        gap: var(--space-2) !important;
        padding: var(--space-3) var(--space-3) !important;
        align-items: start !important;
    }

    /* Image: first column */
    .wc-block-cart-item__image {
        grid-column: 1 !important;
        grid-row: 1 / 3 !important;
    }

    .wc-block-cart-item__image img {
        width: 56px !important;
        height: 56px !important;
    }

    /* Description: middle column — overflow:hidden stops name bleeding into price */
    .wc-block-cart-item__description,
    .wc-block-cart-item__description-wrapper {
        grid-column: 2 !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    /* Total: right column - always visible */
    .wc-block-cart-item__total {
        grid-column: 3 !important;
        text-align: end !important;
        font-size: var(--fs-sm) !important;
        white-space: nowrap !important;
    }

    .wc-block-cart-item__total .wc-block-formatted-money-amount {
        font-size: var(--fs-base) !important;
        font-weight: 800 !important;
        color: var(--color-accent-blue) !important;
    }

    /* Product name: 2 lines max, no overflow */
    .wc-block-cart-item__product-name a,
    .wc-block-cart-item__product-name {
        font-size: var(--fs-xs) !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        max-inline-size: 100% !important;
    }

    /* Hide unit price (already shown as total in right column) + description text */
    .wc-block-cart-item__prices,
    .wc-block-cart-item__description-price,
    .wc-block-cart-item__description p,
    .wc-block-cart-item__low-stock-badge {
        display: none !important;
    }

    /* Quantity controls: compact */
    .wc-block-components-quantity-selector {
        height: 34px !important;
        border-radius: 6px !important;
    }

    .wc-block-components-quantity-selector__button {
        min-width: 28px !important;
        height: 32px !important;
        font-size: var(--fs-base) !important;
    }

    .wc-block-components-quantity-selector__input {
        width: 36px !important;
        height: 32px !important;
        font-size: var(--fs-sm) !important;
    }

    /* Remove button: icon only, small */
    .wc-block-cart-item__remove-link {
        width: 24px !important;
        height: 24px !important;
        font-size: 12px !important;
    }

    /* ── Blocks checkout ──────────────────────────────────────── */
} /* end @media 1023px */

/* ══════════════════════════════════════════════════════════════
   CART — Small mobile (≤ 600px): stacked card layout
   Name / Price / Qty each on own row — no horizontal collision
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 600px) {

    /* Sidebar below products on mobile too */
    .wc-block-cart,
    .wp-block-woocommerce-cart {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--space-4) !important;
    }

    .wc-block-cart .wc-block-cart__main,
    .wp-block-woocommerce-cart .wc-block-cart__main {
        order: 1 !important;
        inline-size: 100% !important;
    }

    .wc-block-cart .wc-block-cart__sidebar,
    .wp-block-woocommerce-cart .wc-block-cart__sidebar {
        order: 2 !important;
        inline-size: 100% !important;
        position: static !important;
        inset-block-start: auto !important;
    }

    /* 2-col grid: image fixed | everything else stacked */
    .wc-block-cart-items__row,
    .wc-block-cart-item {
        display: grid !important;
        grid-template-columns: 52px 1fr !important;
        grid-template-rows: auto auto auto !important;
        column-gap: var(--space-3) !important;
        row-gap: var(--space-2) !important;
        padding: var(--space-3) !important;
        align-items: start !important;
    }

    /* Image: col 1, spans all 3 rows */
    .wc-block-cart-item__image {
        grid-column: 1 !important;
        grid-row: 1 / 4 !important;
    }

    .wc-block-cart-item__image img {
        width: 52px !important;
        height: 52px !important;
        border-radius: 6px !important;
    }

    /* Name/description: col 2, row 1 */
    .wc-block-cart-item__description,
    .wc-block-cart-item__description-wrapper {
        grid-column: 2 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    /* Product name: max 2 lines, strict clamp */
    .wc-block-cart-item__product-name,
    .wc-block-cart-item__product-name a {
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        white-space: normal !important;
        word-break: break-word !important;
        font-size: var(--fs-xs) !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
    }

    /* Hide unit price inside description — total shown below */
    .wc-block-cart-item__prices,
    .wc-block-cart-item__description-price,
    .wc-block-cart-item__description p,
    .wc-block-cart-item__low-stock-badge {
        display: none !important;
    }

    /* Total price: col 2, row 2 — left-aligned, prominent */
    .wc-block-cart-item__total {
        grid-column: 2 !important;
        grid-row: 2 !important;
        text-align: start !important;
        white-space: nowrap !important;
    }

    .wc-block-cart-item__total .wc-block-formatted-money-amount,
    .wc-block-cart-item__total .price,
    .wc-block-cart-item__total {
        font-family: var(--font-display) !important;
        font-size: var(--fs-base) !important;
        font-weight: 800 !important;
        color: var(--color-accent-blue) !important;
    }

    /* Quantity + remove: col 2, row 3 */
    .wc-block-cart-item__quantity {
        grid-column: 2 !important;
        grid-row: 3 !important;
        display: flex !important;
        align-items: center !important;
        gap: var(--space-2) !important;
    }

    /* Quantity controls compact */
    .wc-block-components-quantity-selector {
        height: 32px !important;
        border-radius: 6px !important;
    }

    .wc-block-components-quantity-selector__button {
        min-width: 26px !important;
        height: 30px !important;
        font-size: var(--fs-sm) !important;
    }

    .wc-block-components-quantity-selector__input {
        width: 32px !important;
        height: 30px !important;
        font-size: var(--fs-xs) !important;
    }

    .wc-block-cart-item__remove-link {
        width: 28px !important;
        height: 28px !important;
    }

} /* end @media 600px */

@media (max-width: 1023px) { /* checkout order summary rules */

    /* ── Order summary: nuclear fix ──────────────────────────── */

    /* 1. Hide duplicate Order summary — try all possible WC Blocks class names */
    .wc-block-checkout__sidebar,
    .wc-block-checkout__order-summary + .wc-block-checkout__order-summary,
    .wp-block-woocommerce-checkout-order-summary-block ~ .wp-block-woocommerce-checkout-order-summary-block,
    .wc-block-checkout__order-summary-heading ~ .wc-block-checkout__order-summary-heading {
        display: none !important;
    }

    /* 2. Hide ALL descriptions everywhere in order summary */
    [class*="order-summary"] [class*="description"],
    [class*="order-summary"] p,
    .wc-block-order-summary-item__description,
    .wc-block-order-summary-item__full-price ~ p,
    .wc-block-components-order-summary-item__description {
        display: none !important;
    }

    /* 3. Order summary item: horizontal compact layout */
    .wc-block-order-summary-item,
    .wc-block-components-order-summary-item {
        display: grid !important;
        grid-template-columns: 40px 1fr auto !important;
        grid-template-rows: auto !important;
        gap: var(--space-1) var(--space-2) !important;
        align-items: center !important;
        padding: var(--space-2) !important;
        border-block-end: 1px solid var(--color-border-subtle) !important;
    }

    /* 4. Image: tiny, first column */
    .wc-block-order-summary-item__image,
    .wc-block-components-order-summary-item__image {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        flex-shrink: 0 !important;
    }

    .wc-block-order-summary-item__image img,
    .wc-block-components-order-summary-item__image img {
        width: 40px !important;
        height: 40px !important;
        object-fit: contain !important;
        border-radius: 5px !important;
        border: 1px solid var(--color-border-subtle) !important;
        background: var(--color-bg-secondary) !important;
        padding: 2px !important;
        display: block !important;
    }

    /* 5. Name: compact, 1 line, second column */
    .wc-block-order-summary-item__name,
    .wc-block-components-order-summary-item__name,
    [class*="order-summary-item"] [class*="name"] {
        grid-column: 2 !important;
        grid-row: 1 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;
        color: var(--color-text-primary) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        word-break: normal !important;
        max-width: 100% !important;
    }

    /* 6. Price: right column */
    .wc-block-order-summary-item__full-price,
    .wc-block-order-summary-item__individual-prices,
    [class*="order-summary-item"] [class*="price"] {
        grid-column: 3 !important;
        grid-row: 1 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        color: var(--color-accent-blue) !important;
        white-space: nowrap !important;
    }

    /* Classic checkout order review */
    .woocommerce-checkout-review-order td.product-name {
        font-size: 12px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 160px !important;
    }

    /* Checkout form inputs */
    .wc-block-components-text-input input,
    .wc-block-components-select select {
        font-size: 16px !important; /* prevents iOS zoom */
        height: 46px !important;
        padding: var(--space-2) var(--space-3) !important;
        background: var(--color-bg-tertiary) !important;
        border: 1px solid var(--color-border-subtle) !important;
        border-radius: 8px !important;
        color: var(--color-text-primary) !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }

    .wc-block-components-text-input input:focus,
    .wc-block-components-select select:focus {
        border-color: var(--color-accent-blue) !important;
        outline: none !important;
        box-shadow: 0 0 0 2px rgba(0,166,251,0.12) !important;
    }

    /* Labels uppercase compact */
    .wc-block-components-text-input label,
    .wc-block-components-select label {
        font-size: 10px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.07em !important;
        color: var(--color-text-muted) !important;
    }

    /* Section headings */
    .wp-block-woocommerce-checkout-contact-information-block h2,
    .wp-block-woocommerce-checkout-billing-address-block h2,
    .wp-block-woocommerce-checkout-payment-block h2,
    .wc-block-checkout h2 {
        font-size: var(--fs-lg) !important;
        margin-block-end: var(--space-3) !important;
        padding-block-end: var(--space-2) !important;
        border-block-end: 1px solid var(--color-border-subtle) !important;
    }

    /* Payment options: compact */
    .wc-block-components-payment-method-label {
        font-size: var(--fs-sm) !important;
        font-weight: 600 !important;
    }

    /* Place order button */
    .wc-block-components-checkout-place-order-button {
        width: 100% !important;
        padding: var(--space-4) !important;
        font-size: var(--fs-base) !important;
        font-weight: 700 !important;
        border-radius: 10px !important;
        background: var(--gradient-accent) !important;
        color: #fff !important;
        border: none !important;
        margin-block-start: var(--space-4) !important;
        box-shadow: 0 4px 16px rgba(0,166,251,0.3) !important;
    }

    /* Totals row: compact */
    .wc-block-components-totals-item {
        padding: var(--space-2) 0 !important;
        font-size: var(--fs-sm) !important;
    }

    .wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
        font-size: var(--fs-xl) !important;
        font-weight: 800 !important;
        color: var(--color-accent-blue) !important;
    }

    /* Coupon section */
    .wc-block-components-totals-coupon {
        padding: var(--space-2) 0 !important;
    }
}

/* ── Small mobile ≤ 480px extra tightening ───────────────────── */
@media (max-width: 480px) {
    .wc-block-cart { padding-inline: var(--space-2) !important; }

    .wc-block-cart-items__row,
    .wc-block-cart-item {
        grid-template-columns: 50px 1fr auto !important;
        gap: var(--space-1) !important;
        padding: var(--space-2) !important;
    }

    .wc-block-cart-item__image img {
        width: 48px !important;
        height: 48px !important;
    }
}

/* ══════════════════════════════════════════════════════════════
   BLOCKS CHECKOUT — Mobile & Tablet (≤1024px)
   Only layout/spacing fixes — no color changes
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 1023px) {

    /* Container padding */
    .wc-block-checkout {
        padding-inline: var(--space-4) !important;
        padding-block: var(--space-5) !important;
    }

    /* Section headings compact */
    .wc-block-checkout__contact-fields > h2,
    .wc-block-checkout__billing-fields > h2,
    .wc-block-checkout__shipping-fields > h2,
    .wc-block-checkout__payment > h2,
    .wp-block-woocommerce-checkout-contact-information-block h2,
    .wp-block-woocommerce-checkout-billing-address-block h2,
    .wp-block-woocommerce-checkout-payment-block h2 {
        font-size: var(--fs-lg) !important;
        margin-block-end: var(--space-3) !important;
        padding-block-end: var(--space-3) !important;
        border-block-end: 1px solid var(--color-border-subtle) !important;
    }

    /* Input fields */
    .wc-block-components-text-input input,
    .wc-block-components-select select,
    .wc-block-checkout .wc-block-components-text-input input {
        font-size: var(--fs-sm) !important;
        padding: var(--space-3) var(--space-3) !important;
        height: 44px !important;
        background: var(--color-bg-tertiary) !important;
        border: 1px solid var(--color-border-subtle) !important;
        border-radius: 8px !important;
        color: var(--color-text-primary) !important;
        box-sizing: border-box !important;
    }

    .wc-block-components-text-input input:focus,
    .wc-block-components-select select:focus {
        border-color: var(--color-accent-blue) !important;
        outline: none !important;
        box-shadow: 0 0 0 2px rgba(0,166,251,0.12) !important;
    }

    /* Input label */
    .wc-block-components-text-input label,
    .wc-block-components-select label {
        font-size: 10px !important;
        font-weight: 700 !important;
        letter-spacing: 0.08em !important;
        text-transform: uppercase !important;
        color: var(--color-text-muted) !important;
    }

    /* 2-col fields on medium screens → 1 col on mobile */
    .wc-block-components-address-form {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--space-3) !important;
    }

    /* Order summary: hide long description */
    .wc-block-order-summary-item__description {
        display: none !important;
    }

    /* Order summary: product name compact */
    .wc-block-order-summary-item__name {
        font-size: var(--fs-sm) !important;
        font-weight: 600 !important;
        color: var(--color-text-primary) !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    /* Order summary: product image smaller */
    .wc-block-order-summary-item__image img {
        width: 48px !important;
        height: 48px !important;
        object-fit: contain !important;
        border-radius: 6px !important;
        background: var(--color-bg-secondary) !important;
        border: 1px solid var(--color-border-subtle) !important;
        padding: 3px !important;
    }

    /* Payment methods */
    .wc-block-components-radio-control__input {
        accent-color: var(--color-accent-blue);
    }

    .wc-block-components-payment-method-label {
        font-size: var(--fs-sm) !important;
        font-weight: 600 !important;
        color: var(--color-text-primary) !important;
    }

    /* Place order button */
    .wc-block-components-checkout-place-order-button,
    .wc-block-checkout__actions .wc-block-components-button {
        width: 100% !important;
        padding: var(--space-4) !important;
        font-size: var(--fs-base) !important;
        font-weight: 700 !important;
        border-radius: 10px !important;
        background: var(--gradient-accent) !important;
        color: #fff !important;
        border: none !important;
        box-shadow: 0 4px 16px rgba(0,166,251,0.3) !important;
        cursor: pointer !important;
    }

    /* Totals section */
    .wc-block-components-totals-item {
        font-size: var(--fs-sm) !important;
        padding: var(--space-2) 0 !important;
    }

    .wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
        font-size: var(--fs-xl) !important;
        font-weight: 800 !important;
        color: var(--color-accent-blue) !important;
    }
}

/* ══════════════════════════════════════════════════════════════
   CART — Professional B2B layout
   2-column: table (left) + order summary (right, sticky)
   ══════════════════════════════════════════════════════════════ */

/* ── Page wrapper ──────────────────────────────────────────── */
.woocommerce-cart .woocommerce {
    max-inline-size: 1320px !important;
    margin-inline: auto !important;
    padding-inline: var(--space-6) !important;
    padding-block: var(--space-8) !important;
    color: var(--color-text-primary);
    display: grid !important;
    grid-template-columns: 1fr 360px !important;
    grid-template-areas:
        "notices  notices"
        "form     totals"
        "crosses  crosses" !important;
    gap: var(--space-8) !important;
    align-items: start !important;
}

.woocommerce-cart .woocommerce-notices-wrapper { grid-area: notices; }
.woocommerce-cart .woocommerce-cart-form      { grid-area: form; }
.woocommerce-cart .cart-collaterals           { grid-area: totals; position: sticky; top: 90px; }
.woocommerce-cart .cross-sells               { grid-area: crosses; }

/* ── Cart Table ────────────────────────────────────────────── */
table.shop_table {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100% !important;
    overflow: hidden;
}

/* Header */
table.shop_table thead th {
    background: var(--color-bg-tertiary) !important;
    color: var(--color-text-muted) !important;
    font-size: var(--fs-xs) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    padding: var(--space-3) var(--space-4) !important;
    font-weight: 700 !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

/* Cells */
table.shop_table td {
    color: var(--color-text-primary) !important;
    padding: var(--space-4) var(--space-4) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
    vertical-align: middle !important;
}

table.shop_table tr:last-child td { border-block-end: none !important; }

table.shop_table td a {
    color: var(--color-text-primary) !important;
    text-decoration: none;
    font-weight: 500;
    transition: color var(--duration-fast);
}
table.shop_table td a:hover { color: var(--color-accent-blue) !important; }

/* Product thumbnail */
.woocommerce-cart-form .product-thumbnail {
    width: 90px !important;
}

.woocommerce-cart-form .product-thumbnail img {
    width: 72px !important;
    height: 72px !important;
    object-fit: contain !important;
    border-radius: 8px !important;
    border: 1px solid var(--color-border-subtle) !important;
    background: var(--color-bg-primary) !important;
    padding: 4px !important;
}

/* Product name cell */
.woocommerce-cart-form .product-name {
    font-weight: 600 !important;
    font-size: var(--fs-sm) !important;
}

.woocommerce-cart-form .product-name .variation {
    font-size: var(--fs-xs) !important;
    color: var(--color-text-muted) !important;
    margin-block-start: var(--space-1) !important;
}

/* Price cells */
.woocommerce-cart-form .product-price,
.woocommerce-cart-form .product-subtotal {
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    font-family: var(--font-display) !important;
}

.woocommerce-cart-form .product-subtotal .woocommerce-Price-amount {
    color: var(--color-accent-blue) !important;
    font-size: var(--fs-lg) !important;
}

/* Remove button */
.woocommerce-cart-form .product-remove a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 6px !important;
    background: rgba(239,68,68,0.1) !important;
    color: var(--color-danger) !important;
    font-size: 18px !important;
    transition: background var(--duration-fast) !important;
    text-decoration: none !important;
}
.woocommerce-cart-form .product-remove a:hover {
    background: rgba(239,68,68,0.2) !important;
    color: var(--color-danger) !important;
}

/* Quantity input */
.woocommerce-cart-form .quantity .qty {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    font-size: var(--fs-base) !important;
    font-weight: 600 !important;
    width: 70px !important;
    height: 40px !important;
    text-align: center !important;
    padding: 0 var(--space-2) !important;
    transition: border-color var(--duration-fast) !important;
}
.woocommerce-cart-form .quantity .qty:focus {
    border-color: var(--color-accent-blue) !important;
    outline: none !important;
}

/* Cart actions row */
.woocommerce-cart-form .actions {
    padding: var(--space-4) !important;
    background: var(--color-bg-tertiary) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: var(--space-4) !important;
    flex-wrap: wrap !important;
}

/* Coupon */
.woocommerce-cart-form .coupon {
    display: flex !important;
    gap: var(--space-2) !important;
    align-items: center !important;
}

.woocommerce-cart-form .coupon label { display: none !important; }

.woocommerce-cart-form .coupon #coupon_code {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    padding: var(--space-2) var(--space-4) !important;
    font-size: var(--fs-sm) !important;
    height: 40px !important;
    width: 200px !important;
    transition: border-color var(--duration-fast) !important;
}
.woocommerce-cart-form .coupon #coupon_code:focus {
    border-color: var(--color-accent-blue) !important;
    outline: none !important;
}
.woocommerce-cart-form .coupon #coupon_code::placeholder {
    color: var(--color-text-muted) !important;
}

.woocommerce-cart-form .coupon .button,
.woocommerce-cart-form button[name="apply_coupon"] {
    background: transparent !important;
    border: 1px solid var(--color-border-strong) !important;
    color: var(--color-text-secondary) !important;
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    padding: var(--space-2) var(--space-4) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    height: 40px !important;
    transition: border-color var(--duration-fast), color var(--duration-fast) !important;
}
.woocommerce-cart-form .coupon .button:hover {
    border-color: var(--color-accent-blue) !important;
    color: var(--color-accent-blue) !important;
}

/* Update cart button */
.woocommerce-cart-form button[name="update_cart"] {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-strong) !important;
    color: var(--color-text-secondary) !important;
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    padding: var(--space-2) var(--space-5) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    height: 40px !important;
    transition: border-color var(--duration-fast), color var(--duration-fast) !important;
}
.woocommerce-cart-form button[name="update_cart"]:hover {
    border-color: var(--color-accent-blue) !important;
    color: var(--color-accent-blue) !important;
}

/* ── Cart Totals (right sidebar) ───────────────────────────── */
.cart_totals {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}

.cart_totals h2 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-lg) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    margin: 0 !important;
    padding: var(--space-5) var(--space-5) var(--space-4) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

.cart_totals table {
    width: 100% !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.cart_totals table th {
    font-size: var(--fs-sm) !important;
    font-weight: 500 !important;
    color: var(--color-text-muted) !important;
    padding: var(--space-3) var(--space-5) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
    text-align: start !important;
    width: 40% !important;
}

.cart_totals table td {
    font-size: var(--fs-sm) !important;
    color: var(--color-text-primary) !important;
    padding: var(--space-3) var(--space-5) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

/* Order total row */
.cart_totals .order-total th,
.cart_totals .order-total td {
    font-family: var(--font-display) !important;
    font-weight: 800 !important;
    font-size: var(--fs-lg) !important;
    color: var(--color-text-primary) !important;
    padding-block: var(--space-4) !important;
    border-block-end: none !important;
}

.cart_totals .order-total .woocommerce-Price-amount {
    color: var(--color-accent-blue) !important;
    font-size: var(--fs-2xl) !important;
}

/* Shipping row */
.cart_totals .woocommerce-shipping-calculator { margin-block-start: var(--space-2) !important; }

/* Proceed to checkout */
.wc-proceed-to-checkout {
    padding: var(--space-4) var(--space-5) !important;
    border-block-start: 1px solid var(--color-border-subtle) !important;
}

.wc-proceed-to-checkout a.checkout-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--space-2) !important;
    width: 100% !important;
    text-align: center !important;
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    padding: var(--space-4) var(--space-6) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: opacity var(--duration-base), transform var(--duration-fast) !important;
    box-shadow: 0 4px 20px rgba(0,166,251,0.3) !important;
    margin-block-start: 0 !important;
}

.wc-proceed-to-checkout a.checkout-button:hover {
    opacity: 0.9 !important;
    transform: translateY(-1px) !important;
}

/* ── Empty cart ────────────────────────────────────────────── */
.woocommerce-cart .cart-empty {
    text-align: center;
    padding: var(--space-24) var(--space-8);
    color: var(--color-text-muted);
    font-size: var(--fs-lg);
    grid-column: 1 / -1;
}

.woocommerce-cart .return-to-shop .button {
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--space-2) !important;
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-weight: 700 !important;
    padding: var(--space-3) var(--space-8) !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    margin-block-start: var(--space-4) !important;
    transition: opacity var(--duration-base) !important;
}
.woocommerce-cart .return-to-shop .button:hover { opacity: 0.88 !important; }

/* ── Cross-sells ───────────────────────────────────────────── */
.woocommerce-cart .cross-sells {
    padding-block-start: var(--space-8);
    border-block-start: 1px solid var(--color-border-subtle);
}

.woocommerce-cart .cross-sells h2 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-xl) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    margin-block-end: var(--space-6) !important;
}

.woocommerce-cart .cross-sells ul.altronix-products {
    grid-template-columns: repeat(4, 1fr) !important;
}

/* ── Cart responsive ───────────────────────────────────────── */
@media (max-width: 1023px) {
    .woocommerce-cart .woocommerce {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "notices"
            "form"
            "totals"
            "crosses" !important;
    }

    .woocommerce-cart .cart-collaterals {
        position: static !important;
    }

    .woocommerce-cart .cross-sells ul.altronix-products {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 640px) {
    /* Responsive table on mobile */
    table.shop_table thead { display: none !important; }

    table.shop_table td {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: var(--space-2) var(--space-4) !important;
    }

    table.shop_table td::before {
        content: attr(data-title);
        font-size: var(--fs-xs);
        font-weight: 600;
        color: var(--color-text-muted);
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }

    .woocommerce-cart-form .product-thumbnail { display: none !important; }

    .woocommerce-cart-form .coupon { flex-direction: column; width: 100%; }
    .woocommerce-cart-form .coupon #coupon_code { width: 100% !important; }
}

/* ═══════════════════════════════════════════════════════════════
   CHECKOUT
   ═══════════════════════════════════════════════════════════════ */

.woocommerce-checkout .woocommerce {
    max-inline-size: 1200px !important;
    margin-inline: auto !important;
    padding-inline: var(--space-6) !important;
    padding-block: var(--space-8) !important;
    color: var(--color-text-primary);
}

.woocommerce-checkout h3 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-xl) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    margin-block-end: var(--space-5) !important;
}

/* Place order button */
.woocommerce #place_order {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    padding: var(--space-4) var(--space-8) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: opacity var(--duration-base) !important;
    margin-block-start: var(--space-4) !important;
    box-shadow: 0 4px 20px rgba(0,166,251,0.3) !important;
}
.woocommerce #place_order:hover { opacity: 0.88 !important; }

/* Checkout form fields */
.woocommerce-checkout .woocommerce-input-wrapper input,
.woocommerce-checkout .woocommerce-input-wrapper select,
.woocommerce-checkout .woocommerce-input-wrapper textarea {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    padding: var(--space-3) var(--space-4) !important;
    width: 100% !important;
    box-sizing: border-box !important;
    font-size: var(--fs-sm) !important;
    transition: border-color var(--duration-base) !important;
}

.woocommerce-checkout .woocommerce-input-wrapper input:focus,
.woocommerce-checkout .woocommerce-input-wrapper select:focus,
.woocommerce-checkout .woocommerce-input-wrapper textarea:focus {
    border-color: var(--color-accent-blue) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(0,166,251,0.12) !important;
}

/* Checkout labels */
.woocommerce-checkout label {
    font-size: var(--fs-xs) !important;
    font-weight: 600 !important;
    color: var(--color-text-secondary) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    margin-block-end: var(--space-1) !important;
    display: block !important;
}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════════ */

/* Tablet ≤ 1024px */
@media (max-width: 1024px) {
    .altronix-shop__layout {
        grid-template-columns: 220px 1fr;
        gap: var(--space-6);
    }

    .woocommerce div.product {
        grid-template-columns: 1fr !important;
    }

    .woocommerce div.product div.images,
    .woocommerce div.product div.summary { grid-column: 1; }
}

/* Mobile ≤ 768px */
@media (max-width: 768px) {
    .altronix-shop-hero { padding-block: var(--space-12) var(--space-8); }

    .altronix-shop-hero__stats { gap: var(--space-8); }

    .altronix-shop-cats__grid {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }

    .altronix-shop__layout {
        grid-template-columns: 1fr;
        padding-block-start: var(--space-6);
    }

    .altronix-shop-sidebar {
        position: fixed;
        inset-block: 0;
        inset-inline-start: -100%;
        z-index: 200;
        max-inline-size: 300px;
        width: 80%;
        border-radius: 0;
        border-inline-end: 1px solid var(--color-border-subtle);
        overflow-y: auto;
        transition: inset-inline-start var(--duration-slow) var(--ease-out);
    }

    .altronix-shop-sidebar.is-open { inset-inline-start: 0; }

    .altronix-shop-sidebar__close { display: flex; }

    /* overlay shown only via JS (.is-active class + inline display:block) */

    /* Tablet ≤768px: show filter button, HORIZONTAL row (as before) */
    .altronix-shop__filter-btn { display: flex; }

    .altronix-shop__toolbar {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        padding: var(--space-2) var(--space-3);
        gap: var(--space-3);
    }

    .altronix-shop__filter-btn {
        width: auto;
        flex-shrink: 0;
    }

    .altronix-shop__toolbar-controls {
        flex: 1;
        justify-content: flex-end;
        flex-wrap: nowrap;
        min-width: 0;
    }

    .woocommerce-result-count {
        display: none !important;
    }

    ul.altronix-products,
    .altronix-shop__body ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: var(--space-3) !important;
    }

    .altronix-pcard__inner { min-height: 540px; }
    .altronix-pcard__image-wrap { height: 200px !important; }
    .altronix-pcard__body { min-height: 176px; padding: var(--space-4); }
    .altronix-pcard__footer { min-height: 104px; padding: var(--space-4); }

    .altronix-shop-recent__grid { grid-template-columns: 1fr; }
}

/* Small mobile ≤ 480px */
@media (max-width: 480px) {
    .altronix-cat-card__arrow { display: none; }
    .altronix-cat-card__name { font-size: var(--fs-xs); }

    /* Mobile toolbar: vertical stack — Filtres top, Sort bottom, both full-width */
    .altronix-shop__toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: var(--space-2);
    }

    .altronix-shop__filter-btn {
        width: 100% !important;
        justify-content: center;
    }

    .altronix-shop__toolbar-controls {
        width: 100%;
        justify-content: stretch;
        flex-wrap: nowrap;
    }

    .altronix-shop__toolbar-controls,
    .altronix-shop__toolbar .woocommerce-ordering,
    .altronix-shop__toolbar .woocommerce-ordering form,
    .altronix-shop__toolbar .woocommerce-ordering select {
        float: none !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }

    .altronix-shop__toolbar .woocommerce-ordering select {
        font-size: var(--fs-sm) !important;
        padding: var(--space-2) var(--space-4) !important;
        text-align: start !important;
        text-align-last: start !important;
        background: var(--color-bg-tertiary) !important;
        border: 1px solid var(--color-border-subtle) !important;
        border-radius: 8px !important;
        color: var(--color-text-secondary) !important;
    }

    ul.altronix-products,
    .altronix-shop__body ul.products {
        grid-template-columns: 1fr !important;
    }

    .altronix-pcard__inner { min-height: 0; }
    .altronix-pcard__image-wrap { height: 220px !important; }
    .altronix-pcard__body { min-height: 0; }
    .altronix-pcard__footer { min-height: 0; }

    .altronix-shop-hero__search-btn { display: none; }

    .altronix-shop-cats__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ══════════════════════════════════════════════════════════════
   CART TOAST NOTIFICATION
   ══════════════════════════════════════════════════════════════ */

#alx-cart-toast {
    position: fixed;
    inset-block-end: var(--space-8);
    inset-inline-end: var(--space-6);
    z-index: 9999;
    padding: var(--space-3) var(--space-5);
    border-radius: 10px;
    font-family: var(--font-body);
    font-size: var(--fs-sm);
    font-weight: 600;
    color: #fff;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity var(--duration-base), transform var(--duration-base);
    pointer-events: none;
    max-inline-size: 280px;
}

#alx-cart-toast.alx-toast--show {
    opacity: 1;
    transform: translateY(0);
}

#alx-cart-toast.alx-toast-success {
    background: #10b981;
    box-shadow: 0 8px 24px rgba(16,185,129,0.35);
}

#alx-cart-toast.alx-toast-info {
    background: var(--color-accent-blue);
    box-shadow: 0 8px 24px rgba(0,166,251,0.35);
}

/* ══════════════════════════════════════════════════════════════
   YOUCAN PAY — Professional styling (Classic + Blocks checkout)
   ══════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════
   CLASSIC CHECKOUT — Decathlon-inspired, Altronix identity
   ══════════════════════════════════════════════════════════════ */

/* ── Progress steps ─────────────────────────────────────────── */
.alx-steps {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-6);
    background: var(--color-bg-secondary);
    border-block-end: 1px solid var(--color-border-subtle);
    margin-block-end: var(--space-6);
    flex-wrap: wrap;
}

.alx-steps__sep { color: var(--color-border-strong); font-size: var(--fs-lg); }

.alx-steps__step {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    opacity: 0.4;
    text-decoration: none;
    transition: opacity var(--duration-fast);
}

.alx-steps__step--done {
    opacity: 0.7;
    cursor: pointer;
}

.alx-steps__step--done:hover { opacity: 1; }

.alx-steps__step--active {
    opacity: 1;
}

.alx-steps__num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--color-border-subtle);
    color: var(--color-text-muted);
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.alx-steps__step--done .alx-steps__num {
    background: #10b981;
    color: #fff;
}

.alx-steps__step--active .alx-steps__num {
    background: var(--color-accent-blue);
    color: #fff;
    box-shadow: 0 0 0 4px rgba(0,166,251,0.2);
}

.alx-steps__label {
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--color-text-secondary);
}

.alx-steps__step--active .alx-steps__label { color: var(--color-accent-blue); }
.alx-steps__step--done .alx-steps__label   { color: #10b981; }

/* ── Trust badges ─────────────────────────────────────────────── */
.alx-checkout-trust {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-2);
    background: var(--color-bg-secondary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 10px;
    padding: var(--space-4);
}

.alx-checkout-trust__item {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: 12px;
    color: var(--color-text-secondary);
    font-weight: 500;
}

.alx-checkout-trust__item svg { color: var(--color-accent-blue); flex-shrink: 0; }

/* ── Why Altronix ─────────────────────────────────────────────── */
.alx-checkout-why {
    background: linear-gradient(135deg, rgba(0,166,251,0.06) 0%, rgba(0,166,251,0.02) 100%);
    border: 1px solid rgba(0,166,251,0.2);
    border-radius: 10px;
    padding: var(--space-4) var(--space-5);
}

.alx-checkout-why__title {
    font-family: var(--font-display) !important;
    font-size: var(--fs-sm) !important;
    font-weight: 700 !important;
    color: var(--color-accent-blue) !important;
    margin: 0 0 var(--space-3) 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
}

.alx-checkout-why__list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.alx-checkout-why__list li {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-sm) !important;
    color: var(--color-text-secondary) !important;
}

/* ══════════════════════════════════════════════════════════════
   CLASSIC WOOCOMMERCE CHECKOUT — Complete dark professional layout
   ══════════════════════════════════════════════════════════════ */

/* ── Checkout page container ─────────────────────────────── */
.woocommerce-checkout .woocommerce {
    max-inline-size: 1320px !important;
    margin-inline: auto !important;
    padding-inline: var(--space-6) !important;
    padding-block: var(--space-6) !important;
}

/* City selector: full width at top */
.woocommerce-checkout .alx-ship-selector {
    margin-block-end: var(--space-5) !important;
}

/* ══════════════════════════════════════════════════════════════
   CHECKOUT FLOW LAYOUT — Single column, 4 sections
   1.Commande → 2.Coordonnées → 3.Paiement → 4.Commander
   ══════════════════════════════════════════════════════════════ */

/* Container: centered single column */
.woocommerce-checkout .woocommerce {
    max-inline-size: 720px !important;
    margin-inline: auto !important;
    padding-inline: var(--space-5) !important;
    padding-block: var(--space-4) !important;
}

/* Form: vertical flow */
form.alx-checkout-flow {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-5) !important;
}

/* ── Flow sections ──────────────────────────────────────── */
.alx-flow-section {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    transition: box-shadow var(--duration-base);
}

.alx-flow-section:focus-within {
    box-shadow: 0 0 0 3px rgba(0,166,251,0.12) !important;
    border-color: rgba(0,166,251,0.3) !important;
}

/* Section title */
.alx-flow-section__title {
    display: flex !important;
    align-items: center !important;
    gap: var(--space-3) !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-sm) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    margin: 0 !important;
    padding: var(--space-4) var(--space-5) !important;
    background: var(--color-bg-tertiary) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

.alx-flow-section__num {
    width: 26px !important;
    height: 26px !important;
    border-radius: 50% !important;
    background: var(--color-accent-blue) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.alx-flow-section__body {
    padding: var(--space-5) !important;
}

/* Section payment: no padding (payment template has its own) */
.alx-flow-section--payment .alx-flow-section__body {
    padding: 0 !important;
}

/* ── Section 1: Order Review table ───────────────────────── */
#alx-flow-order .woocommerce-checkout-review-order-table {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}

/* ── Section 2: Customer form ───────────────────────────── */
#alx-flow-form .woocommerce-billing-fields,
#alx-flow-form .woocommerce-additional-fields {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

.alx-checkout-account-note {
    display: flex !important;
    align-items: flex-start !important;
    gap: var(--space-3) !important;
    margin-block-end: var(--space-4) !important;
    padding: var(--space-4) !important;
    border-radius: 12px !important;
    border: 1px solid rgba(0, 166, 251, 0.22) !important;
    background:
        linear-gradient(135deg, rgba(0, 166, 251, 0.1), rgba(255, 145, 77, 0.06)),
        var(--color-bg-tertiary) !important;
}

.alx-checkout-account-note__icon {
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    border-radius: 999px !important;
    color: var(--color-accent-blue) !important;
    background: rgba(0, 166, 251, 0.14) !important;
    box-shadow: inset 0 0 0 1px rgba(0, 166, 251, 0.16) !important;
}

.alx-checkout-account-note__content {
    min-width: 0 !important;
}

.alx-checkout-account-note__eyebrow,
.alx-checkout-account-note__title,
.alx-checkout-account-note__text {
    margin: 0 !important;
}

.alx-checkout-account-note__eyebrow {
    margin-block-end: 6px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--color-accent-blue) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
}

.alx-checkout-account-note__title {
    margin-block-end: 8px !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: var(--color-text-primary) !important;
}

.alx-checkout-account-note__text {
    max-width: 66ch !important;
    font-size: var(--fs-sm) !important;
    line-height: 1.7 !important;
    color: var(--color-text-secondary) !important;
}

/* ── Trust badges (below payment) ───────────────────────── */
.alx-flow-trust {
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 10px !important;
    background: var(--color-bg-secondary) !important;
}

/* ── Payment section: full WC payment styling ───────────── */
.alx-flow-section--payment #payment {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}

.alx-flow-section--payment #payment ul.payment_methods {
    padding: var(--space-4) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

.alx-flow-section--payment #payment .place-order {
    padding: var(--space-4) var(--space-5) !important;
}

/* Commander maintenant: full width prominent */
.alx-flow-section--payment #payment #place_order {
    font-size: var(--fs-lg) !important;
    padding: var(--space-4) var(--space-8) !important;
}

/* ── Hide redundant "BILLING DETAILS" heading ──────────── */
/* Our section title "2 VOS COORDONNÉES" is enough */
.alx-checkout-flow .woocommerce-billing-fields h3,
.alx-checkout-flow .woocommerce-billing-fields__field-wrapper h3,
.alx-checkout-flow .woocommerce-shipping-fields h3 {
    display: none !important;
}

/* ── Notes section: seamless ──────────────────────────── */
.alx-checkout-flow .woocommerce-additional-fields {
    padding-block-start: var(--space-4) !important;
    border-block-start: 1px solid var(--color-border-subtle) !important;
    margin-block-start: var(--space-4) !important;
}

.alx-checkout-flow .woocommerce-additional-fields h3 {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--color-text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    margin: 0 0 var(--space-3) 0 !important;
}

/* ── Coupon toggle: single line ─────────────────────────── */
.alx-checkout-flow .woocommerce-form-coupon-toggle {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: var(--space-2) !important;
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 10px !important;
    padding: var(--space-3) var(--space-4) !important;
    font-size: var(--fs-sm) !important;
    color: var(--color-text-muted) !important;
}

.alx-checkout-flow .woocommerce-form-coupon-toggle a {
    color: var(--color-accent-blue) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    font-weight: 600 !important;
}

/* ── Order review table — mobile responsive ─────────────── */
@media (max-width: 768px) {

    /* Section bodies */
    .alx-flow-section__body { padding: var(--space-3) !important; }
    .alx-flow-section--payment .alx-flow-section__body { padding: 0 !important; }

    .alx-checkout-account-note {
        flex-direction: column !important;
        padding: var(--space-3) !important;
    }

    .alx-checkout-account-note__icon {
        width: 40px !important;
        height: 40px !important;
    }

    .alx-checkout-account-note__text {
        max-width: none !important;
    }

    /* Order table: hide header, stack rows */
    .alx-flow-section__body .woocommerce-checkout-review-order-table thead {
        display: none !important;
    }

    .alx-flow-section__body .woocommerce-checkout-review-order-table,
    .alx-flow-section__body .woocommerce-checkout-review-order-table tbody,
    .alx-flow-section__body .woocommerce-checkout-review-order-table tr {
        display: block !important;
        width: 100% !important;
    }

    /* Each product row */
    .alx-flow-section__body .woocommerce-checkout-review-order-table tr.cart_item {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: var(--space-2) 0 !important;
        border-block-end: 1px solid var(--color-border-subtle) !important;
        gap: var(--space-2) !important;
    }

    /* Product name: truncate */
    .alx-flow-section__body .product-name {
        flex: 1 !important;
        font-size: 12px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 55vw !important;
    }

    /* Product total */
    .alx-flow-section__body .product-total {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: var(--color-accent-blue) !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }

    /* Subtotal / Shipping / Total rows */
    .alx-flow-section__body .woocommerce-checkout-review-order-table tfoot {
        display: block !important;
        border-block-start: 2px solid var(--color-border-subtle) !important;
        margin-block-start: var(--space-2) !important;
    }

    .alx-flow-section__body .woocommerce-checkout-review-order-table tfoot tr {
        display: flex !important;
        justify-content: space-between !important;
        padding: var(--space-1) 0 !important;
        font-size: 13px !important;
    }

    .alx-flow-section__body .woocommerce-checkout-review-order-table .order-total td {
        font-size: var(--fs-xl) !important;
        font-weight: 800 !important;
        color: var(--color-accent-blue) !important;
    }

    /* Form fields: full width */
    .woocommerce-checkout .form-row-first,
    .woocommerce-checkout .form-row-last {
        width: 100% !important;
        float: none !important;
        margin-inline-end: 0 !important;
    }

    /* Payment methods on mobile */
    .alx-flow-section--payment #payment ul.payment_methods {
        gap: var(--space-2) !important;
        padding: var(--space-3) !important;
    }

    .alx-flow-section--payment #payment .place-order {
        padding: var(--space-3) !important;
    }

    /* Trust badges: 2 cols on mobile */
    .alx-flow-trust {
        grid-template-columns: 1fr 1fr !important;
    }

    /* Steps: circles only on small mobile */
    .alx-steps__label { font-size: 10px !important; }
}

/* Very small: ≤ 400px */
@media (max-width: 400px) {
    .woocommerce-checkout .woocommerce {
        padding-inline: var(--space-2) !important;
    }

    .alx-steps__label { display: none !important; }

    .alx-flow-section__body { padding: var(--space-2) !important; }
}

/* Left column: customer details */
.woocommerce-checkout .alx-checkout__left {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

/* Right column: order review + payment */
.woocommerce-checkout .alx-checkout__right {
    position: sticky;
    top: 90px;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/* Override WC's default floats */
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
}

/* Coupon toggle: full width */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
    grid-column: 1 / -1;
    margin-block-end: var(--space-4) !important;
}

/* ── Left col: stack billing + notes vertically ───────────── */
.woocommerce-checkout #customer_details {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-4) !important;
}

.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ── Form sections ───────────────────────────────────────── */
.woocommerce-billing-fields,
.woocommerce-additional-fields {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    padding: var(--space-5) !important;
}

/* Account-creation fields are always unset server-side (checkout accounts
   are created automatically — see woocommerce_checkout_fields), so this
   wrapper is permanently empty. WooCommerce still prints it, and it would
   otherwise inherit the "card" look above and show as a blank box. */
.woocommerce-checkout .woocommerce-account-fields {
    display: none !important;
}

.woocommerce-checkout h3,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper h3 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    margin: 0 0 var(--space-4) 0 !important;
    padding-block-end: var(--space-3) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    font-size: var(--fs-xs) !important;
}

/* Pays / Pays de livraison — forcé à "MA" côté serveur (boutique
   mono-marché, zone de livraison "Maroc" uniquement). WooCommerce rend
   toujours le <p class="form-row">+<label> autour d'un champ "hidden",
   donc on masque ce wrapper ici plutôt que de retirer le champ : la
   valeur continue d'être envoyée et traitée normalement, seul l'habillage
   visuel disparaît. */
.woocommerce-checkout #billing_country_field,
.woocommerce-checkout #shipping_country_field {
    display: none !important;
}

/* Mot de passe — champ déplacé dans le bloc "billing" (juste sous l'email,
   voir woocommerce_checkout_fields) pour que la création du compte espace
   client se fasse au même endroit que la saisie des coordonnées. */
.woocommerce-checkout #account_password_field .woocommerce-input-wrapper {
    position: relative !important;
    display: block !important;
}

.woocommerce-checkout #account_password_field input#account_password {
    padding-inline-end: 3rem !important;
}

.alx-pw-toggle {
    position: absolute !important;
    inset-block: 0 !important;
    inset-inline-end: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    inline-size: 2.75rem !important;
    background: transparent !important;
    border: none !important;
    border-radius: 8px !important;
    color: var(--color-text-muted) !important;
    cursor: pointer !important;
    transition: color var(--duration-base) var(--ease-out) !important;
}

.alx-pw-toggle:hover,
.alx-pw-toggle:focus-visible {
    color: var(--color-accent-blue) !important;
}

.alx-pw-toggle:focus-visible {
    outline: 2px solid var(--color-accent-blue) !important;
    outline-offset: -2px !important;
}

.alx-pw-toggle svg {
    inline-size: 1.125rem !important;
    block-size: 1.125rem !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.75 !important;
}

.alx-pw-toggle .alx-pw-toggle__icon--hide {
    display: none !important;
}

.alx-pw-toggle[aria-pressed="true"] .alx-pw-toggle__icon--show {
    display: none !important;
}

.alx-pw-toggle[aria-pressed="true"] .alx-pw-toggle__icon--hide {
    display: block !important;
}

/* ── Dynamic account-password reveal ──────────────────────── */
.alx-checkout__password-field--hidden {
    display: none !important;
}

.alx-checkout__email-hint {
    margin: var(--space-2) 0 var(--space-4);
    padding: var(--space-3) var(--space-4);
    border-radius: 10px;
    font-size: var(--fs-sm);
    line-height: 1.5;
}

.alx-checkout__email-hint a {
    color: inherit;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.alx-checkout__email-hint--info {
    background: rgba(0, 166, 251, 0.07);
    border: 1px solid rgba(0, 166, 251, 0.25);
    color: var(--color-text-secondary);
}

.alx-checkout__email-hint--info a {
    color: var(--color-accent-blue);
}

.alx-checkout__email-hint--warning {
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.3);
    color: var(--color-text-secondary);
}

.alx-checkout__email-hint--warning a {
    color: var(--color-warning);
}

/* ── Form inputs ─────────────────────────────────────────── */
.woocommerce-checkout input:not([type="radio"]):not([type="checkbox"]),
.woocommerce-checkout select,
.woocommerce-checkout textarea {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    padding: var(--space-3) var(--space-4) !important;
    font-size: var(--fs-sm) !important;
    width: 100% !important;
    box-sizing: border-box !important;
    height: 46px !important;
    transition: border-color var(--duration-base) !important;
    margin-block-end: var(--space-1) !important;
}

.woocommerce-checkout input:not([type="radio"]):not([type="checkbox"]) {
    line-height: 1.35 !important;
}

.woocommerce-checkout select {
    min-height: 48px !important;
    height: 48px !important;
    line-height: 1.35 !important;
    padding-block: 0 !important;
    padding-inline: var(--space-4) 2.75rem !important;
}

/* WooCommerce enhances country/state selects with SelectWoo.
   Style the generated widget directly so the visible control matches
   the checkout theme and does not inherit Select2's default white UI. */
.woocommerce-checkout .select2-container {
    width: 100% !important;
}

.woocommerce-checkout .select2-container .select2-selection--single {
    margin: 0 !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    min-height: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--color-text-primary) !important;
    font-size: var(--fs-sm) !important;
    line-height: 48px !important;
    padding-inline: var(--space-4) 2.75rem !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--color-text-muted) !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 46px !important;
    right: 10px !important;
    width: 20px !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: var(--color-text-muted) transparent transparent transparent !important;
}

.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--color-accent-blue) !important;
    box-shadow: 0 0 0 3px rgba(0,166,251,0.12) !important;
}

.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent var(--color-accent-blue) transparent !important;
}

.woocommerce-checkout .select2-dropdown {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-accent-blue) !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35) !important;
}

.woocommerce-checkout .select2-search--dropdown {
    padding: var(--space-2) !important;
}

.woocommerce-checkout .select2-search--dropdown .select2-search__field {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 6px !important;
    color: var(--color-text-primary) !important;
    padding: var(--space-2) var(--space-3) !important;
}

.woocommerce-checkout .select2-results__option {
    color: var(--color-text-secondary) !important;
    font-size: var(--fs-sm) !important;
    padding: var(--space-3) var(--space-4) !important;
}

.woocommerce-checkout .select2-results__option--highlighted[aria-selected],
.woocommerce-checkout .select2-results__option--highlighted[data-selected],
.woocommerce-checkout .select2-results__option[aria-selected="true"] {
    background: rgba(0,166,251,0.12) !important;
    color: var(--color-text-primary) !important;
}

.woocommerce-checkout textarea { height: auto !important; min-height: 80px !important; }

.woocommerce-checkout input:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
    border-color: var(--color-accent-blue) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(0,166,251,0.12) !important;
}

.woocommerce-checkout label {
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--color-text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.07em !important;
    margin-block-end: var(--space-1) !important;
}

/* Required asterisk */
.woocommerce-checkout .required { color: #ef4444 !important; }

/* Inline form fields (first/last name) */
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last { width: 48% !important; float: left !important; }
.woocommerce-checkout .form-row-first { margin-inline-end: 4% !important; }
.woocommerce-checkout .form-row.form-row-wide { width: 100% !important; float: none !important; clear: both !important; }

/* Form row validation */
.woocommerce-checkout .form-row.woocommerce-invalid input,
.woocommerce-checkout .form-row.woocommerce-invalid select {
    border-color: #ef4444 !important;
}

.woocommerce-checkout .form-row.woocommerce-validated input,
.woocommerce-checkout .form-row.woocommerce-validated select {
    border-color: #10b981 !important;
}

/* ── Order review (right column) ─────────────────────────── */
#order_review_heading { display: none !important; } /* removed via filter, but just in case */

.woocommerce-checkout-review-order-table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.woocommerce-checkout-review-order-table thead tr th {
    background: var(--color-bg-tertiary) !important;
    color: var(--color-text-muted) !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    padding: var(--space-3) var(--space-4) !important;
    font-weight: 700 !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
    padding: var(--space-3) var(--space-4) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
    vertical-align: middle !important;
}

.woocommerce-checkout-review-order-table .product-name {
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    color: var(--color-text-primary) !important;
}

.woocommerce-checkout-review-order-table .product-total {
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    text-align: end !important;
}

/* Subtotal, shipping, total rows */
.woocommerce-checkout-review-order-table .cart-subtotal td,
.woocommerce-checkout-review-order-table .shipping td {
    color: var(--color-text-secondary) !important;
    font-size: var(--fs-sm) !important;
}

.woocommerce-checkout-review-order-table .shipping td {
    color: var(--color-text-secondary) !important;
}

.woocommerce-checkout-review-order-table .order-total td .woocommerce-Price-amount {
    font-family: var(--font-display) !important;
    font-size: var(--fs-2xl) !important;
    font-weight: 800 !important;
    color: var(--color-accent-blue) !important;
}

.woocommerce-checkout-review-order-table tr:last-child td { border-block-end: none !important; }

/* ── Full-width payment section ─────────────────────────── */
.alx-checkout__payment {
    background: var(--color-bg-secondary);
    border: 1px solid var(--color-border-subtle);
    border-radius: 14px;
    overflow: hidden;
}

.alx-checkout__payment #payment {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}

/* Payment methods: single vertical stack */
.alx-checkout__payment #payment ul.payment_methods {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-3) !important;
    padding: var(--space-4) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

/* YouCan Pay form: full width now */
.alx-checkout__payment .payment_method_youcanpay .payment_box {
    background: var(--color-bg-tertiary) !important;
    border-radius: 0 0 10px 10px !important;
    padding: var(--space-5) var(--space-6) !important;
    border-block-start: 1px solid rgba(0,166,251,0.3) !important;
}

/* YouCan Pay iframe: constrain max-width for readability */
.alx-checkout__payment .payment_method_youcanpay .payment_box iframe,
.alx-checkout__payment .payment_method_youcanpay .payment_box form {
    max-width: 480px !important;
    margin-inline: auto !important;
}

/* Place order: full width prominent */
.alx-checkout__payment #payment .place-order {
    padding: var(--space-4) var(--space-6) !important;
    background: var(--color-bg-tertiary) !important;
    border-block-start: 1px solid var(--color-border-subtle) !important;
}

/* Privacy text in payment section */
.alx-checkout__payment .woocommerce-privacy-policy-text {
    padding: var(--space-2) var(--space-6) !important;
    font-size: var(--fs-xs) !important;
    color: var(--color-text-muted) !important;
    text-align: center !important;
}

/* ── Payment methods ──────────────────────────────────────── */

/* Hide YouCan Pay empty payment request block */
#wc-youcanpay-payment-request-wrapper,
.wc-youcanpay-payment-request-wrapper,
[id*="youcanpay"][id*="request"],
[class*="youcanpay"][class*="request"] {
    display: none !important;
}

#payment {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

#payment ul.payment_methods {
    list-style: none !important;
    padding: var(--space-3) !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-2) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

/* Each payment method card */
#payment ul.payment_methods li {
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    overflow: visible !important;
    background: var(--color-bg-tertiary) !important;
    transition: border-color var(--duration-base) !important;
    list-style: none !important;
}

/* Selected state */
#payment ul.payment_methods li:has(input:checked) {
    border-color: var(--color-accent-blue) !important;
    background: rgba(0,166,251,0.05) !important;
    box-shadow: 0 0 0 3px rgba(0,166,251,0.1) !important;
}

/* YouCan Pay: highlighted only, not forced first */
#payment ul.payment_methods .payment_method_youcanpay {
    border-color: var(--color-accent-blue) !important;
    order: 0 !important;
}

#payment ul.payment_methods label {
    display: flex !important;
    align-items: center !important;
    gap: var(--space-3) !important;
    padding: var(--space-3) var(--space-4) !important;
    cursor: pointer !important;
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    color: var(--color-text-primary) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    width: 100%;
    box-sizing: border-box;
}

#payment ul.payment_methods label img {
    height: 22px !important;
    width: auto !important;
    border-radius: 3px !important;
}

#payment ul.payment_methods input[type="radio"] {
    width: 16px !important;
    height: 16px !important;
    accent-color: var(--color-accent-blue) !important;
    flex-shrink: 0 !important;
}

/* Payment box (form appears when method selected) */
#payment .payment_box {
    background: var(--color-bg-primary) !important;
    border-block-start: 1px solid var(--color-border-subtle) !important;
    padding: var(--space-4) !important;
    margin: 0 !important;
    font-size: var(--fs-sm) !important;
    color: var(--color-text-secondary) !important;
    border-radius: 0 0 6px 6px !important;
}

/* ── Place Order button ───────────────────────────────────── */
#payment .place-order { padding: var(--space-4) !important; }

#payment #place_order,
#payment button[type="submit"],
.woocommerce-checkout #place_order {
    display: block !important;
    width: 100% !important;
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    padding: var(--space-4) var(--space-6) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    box-shadow: 0 4px 20px rgba(0,166,251,0.3) !important;
    transition: opacity var(--duration-base), transform var(--duration-fast) !important;
    text-align: center !important;
}

#payment #place_order:hover { opacity: 0.88 !important; transform: translateY(-1px) !important; }

/* Privacy policy text */
.woocommerce-checkout .woocommerce-privacy-policy-text {
    font-size: var(--fs-xs) !important;
    color: var(--color-text-muted) !important;
    padding: 0 var(--space-4) var(--space-3) !important;
    text-align: center !important;
}

/* ── Responsive ──────────────────────────────────────────── */

/* Tablet 768–1023px: narrower 2-col */
@media (max-width: 1023px) and (min-width: 769px) {
    .woocommerce-checkout form.checkout {
        grid-template-columns: 1fr 360px !important;
        column-gap: var(--space-5) !important;
    }

    .woocommerce-checkout .form-row-first,
    .woocommerce-checkout .form-row-last {
        width: 100% !important;
        float: none !important;
        margin-inline-end: 0 !important;
    }
}

/* Tablet ≤1023px: payment still grid row */
@media (max-width: 1023px) and (min-width: 769px) {
    .alx-checkout__payment #payment ul.payment_methods {
        display: flex !important;
        flex-direction: column !important;
    }
}

/* Mobile ≤768px ─────────────────────────────────────────────── */
@media (max-width: 768px) {
    /* ── Payment: single column methods ─── */
    .alx-checkout__payment #payment ul.payment_methods {
        display: flex !important;
        flex-direction: column !important;
        padding: var(--space-3) !important;
        gap: var(--space-2) !important;
    }

    .alx-checkout__payment .payment_method_youcanpay .payment_box {
        padding: var(--space-3) !important;
    }

    .alx-checkout__payment #payment .place-order {
        padding: var(--space-3) !important;
    }

    /* ── Steps: circles only ─── */
    .alx-steps {
        padding: var(--space-3) var(--space-4) !important;
        margin-block-end: var(--space-4) !important;
        gap: var(--space-2) !important;
    }
    .alx-steps__label { display: none !important; }
    .alx-steps__sep   { font-size: var(--fs-sm) !important; }
    .alx-steps__num   { width: 24px !important; height: 24px !important; font-size: 11px !important; }

    /* ── Layout: single column ─── */
    .woocommerce-checkout .woocommerce {
        padding-inline: var(--space-3) !important;
        padding-block: var(--space-3) !important;
    }

    .woocommerce-checkout form.checkout {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--space-4) !important;
    }

    /* Order: Right (summary) FIRST, then Left (form) */
    .woocommerce-checkout .alx-checkout__right { order: -1 !important; position: static !important; }
    .woocommerce-checkout .alx-checkout__left  { order: 1 !important; }

    /* ── All form fields full width ─── */
    .woocommerce-checkout .form-row-first,
    .woocommerce-checkout .form-row-last {
        width: 100% !important;
        float: none !important;
        margin-inline-end: 0 !important;
    }

    /* ── Billing + Additional: full width ─── */
    .woocommerce-billing-fields,
    .woocommerce-additional-fields {
        padding: var(--space-4) !important;
    }

    /* ── Order review table: compact ─── */
    .woocommerce-checkout-review-order-table th,
    .woocommerce-checkout-review-order-table td {
        padding: var(--space-2) var(--space-3) !important;
        font-size: var(--fs-xs) !important;
    }

    .woocommerce-checkout-review-order-table .product-name {
        font-size: 12px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 160px !important;
    }

    .woocommerce-checkout-review-order-table .order-total .woocommerce-Price-amount {
        font-size: var(--fs-xl) !important;
    }

    /* ── Payment methods: compact ─── */
    #payment ul.payment_methods { padding: var(--space-2) !important; gap: var(--space-1) !important; }
    #payment ul.payment_methods label {
        padding: var(--space-2) var(--space-3) !important;
        font-size: 13px !important;
    }

    /* ── Commander button: sticky at bottom ─── */
    #payment .place-order { padding: var(--space-3) !important; }

    #payment #place_order {
        position: sticky !important;
        bottom: var(--space-3) !important;
        z-index: 10;
        font-size: 15px !important;
        padding: var(--space-3) var(--space-4) !important;
    }

    /* ── Trust badges ─── */
    .alx-checkout-trust { grid-template-columns: 1fr 1fr !important; }

    /* ── Why Altronix: hidden on mobile ─── */
    .alx-checkout-why { display: none !important; }

    /* ── City selector ─── */
    .alx-ship-selector__inner { flex-direction: column !important; }
}

/* Form section headings */
.woocommerce-checkout h3 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-lg) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    padding-block-end: var(--space-3) !important;
    margin-block-end: var(--space-4) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
}

/* Form inputs */
.woocommerce-checkout input,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
    background: var(--color-bg-tertiary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    color: var(--color-text-primary) !important;
    padding: var(--space-3) var(--space-4) !important;
    font-size: var(--fs-sm) !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: border-color var(--duration-base) !important;
}

.woocommerce-checkout input:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
    border-color: var(--color-accent-blue) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(0,166,251,0.12) !important;
}

/* Labels */
.woocommerce-checkout label {
    font-size: var(--fs-xs) !important;
    font-weight: 600 !important;
    color: var(--color-text-secondary) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    margin-block-end: var(--space-1) !important;
}

/* Order review table */
.woocommerce-checkout-review-order-table {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.woocommerce-checkout-review-order-table th {
    background: var(--color-bg-tertiary) !important;
    color: var(--color-text-muted) !important;
    font-size: var(--fs-xs) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    padding: var(--space-3) var(--space-4) !important;
    font-weight: 700 !important;
}

.woocommerce-checkout-review-order-table td {
    padding: var(--space-3) var(--space-4) !important;
    border-block-end: 1px solid var(--color-border-subtle) !important;
    color: var(--color-text-primary) !important;
    font-size: var(--fs-sm) !important;
}

/* Order total */
.woocommerce-checkout-review-order-table .order-total td .woocommerce-Price-amount {
    font-family: var(--font-display) !important;
    font-size: var(--fs-2xl) !important;
    font-weight: 800 !important;
    color: var(--color-accent-blue) !important;
}

/* Payment methods */
#payment {
    background: var(--color-bg-secondary) !important;
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    margin-block-start: var(--space-4) !important;
}

#payment ul.payment_methods {
    list-style: none !important;
    padding: var(--space-3) !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-2) !important;
}

#payment ul.payment_methods li {
    border: 1px solid var(--color-border-subtle) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: var(--color-bg-tertiary) !important;
    transition: border-color var(--duration-base) !important;
}

#payment ul.payment_methods li:has(input:checked) {
    border-color: var(--color-accent-blue) !important;
    background: rgba(0,166,251,0.04) !important;
}

#payment ul.payment_methods label {
    display: flex !important;
    align-items: center !important;
    gap: var(--space-3) !important;
    padding: var(--space-3) var(--space-4) !important;
    cursor: pointer !important;
    font-size: var(--fs-sm) !important;
    font-weight: 600 !important;
    color: var(--color-text-primary) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
}

#payment ul.payment_methods label img {
    height: 24px !important;
    width: auto !important;
    border-radius: 4px !important;
}

#payment .payment_box {
    background: var(--color-bg-primary) !important;
    border-block-start: 1px solid var(--color-border-subtle) !important;
    padding: var(--space-4) !important;
    font-size: var(--fs-sm) !important;
    color: var(--color-text-secondary) !important;
}

/* Place Order / Buy button */
#payment #place_order,
#payment button[type="submit"],
.woocommerce-checkout #place_order {
    display: block !important;
    width: 100% !important;
    background: var(--gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    padding: var(--space-4) var(--space-6) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    margin-block-start: var(--space-4) !important;
    box-shadow: 0 4px 20px rgba(0,166,251,0.3) !important;
    transition: opacity var(--duration-base), transform var(--duration-fast) !important;
    letter-spacing: 0.02em !important;
}

#payment #place_order:hover,
#payment button[type="submit"]:hover {
    opacity: 0.9 !important;
    transform: translateY(-1px) !important;
}

/* Return to cart link */
.woocommerce-checkout .return-to-shop,
.checkout_coupon,
.login-with-account-button { color: var(--color-text-muted) !important; }

/* ── Payment logos (Visa / Mastercard / YouCan Pay) ─────── */
.alx-pay-logos {
    display: flex !important;
    align-items: center !important;
    gap: var(--space-2) !important;
    margin-block-end: var(--space-2) !important;
    flex-wrap: wrap;
}

.alx-pay-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    border: 1px solid;
}

.alx-pay-logo--visa {
    background: #1a1f71;
    color: #fff;
    border-color: #1a1f71;
    font-style: italic;
}

.alx-pay-logo--mc {
    background: #eb001b;
    color: #fff;
    border-color: #eb001b;
}

.alx-pay-logo--yc {
    background: rgba(0,166,251,0.15);
    color: var(--color-accent-blue);
    border-color: var(--color-accent-blue);
}

/* Payment method icons via CSS */
#payment ul.payment_methods .payment_method_youcanpay label::before {
    content: '💳';
    font-size: 18px;
}

#payment ul.payment_methods .payment_method_cod label::before {
    content: '💵';
    font-size: 18px;
}

#payment ul.payment_methods .payment_method_bacs label::before {
    content: '🏦';
    font-size: 18px;
}

#payment ul.payment_methods .payment_method_cheque label::before {
    content: '📝';
    font-size: 18px;
}

/* YouCan Pay — gateway ID is "youcanpay" (no underscore) */
.payment_method_youcanpay {
    border: 2px solid var(--color-accent-blue) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    background: rgba(0,166,251,0.04) !important;
    order: 0 !important;
}

.payment_method_youcanpay .payment_box {
    background: var(--color-bg-primary) !important;
    border-block-start: 1px solid var(--color-border-subtle) !important;
    padding: var(--space-5) !important;
}

.payment_method_youcanpay .payment_box > #youcanpay-payment-data-credit-card {
    display: grid !important;
    gap: var(--space-4) !important;
}

.alx-youcanpay-intro,
.alx-youcanpay-note {
    display: grid !important;
    gap: 8px !important;
}

.alx-youcanpay-intro p,
.alx-youcanpay-note p {
    margin: 0 !important;
}

.alx-youcanpay-intro__title,
.alx-youcanpay-note__title {
    font-family: var(--font-display) !important;
    font-size: var(--fs-base) !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    line-height: 1.35 !important;
}

.alx-youcanpay-intro__text,
.alx-youcanpay-note__text {
    font-size: var(--fs-sm) !important;
    line-height: 1.7 !important;
    color: var(--color-text-secondary) !important;
}

.alx-youcanpay-note {
    padding: var(--space-3) var(--space-4) !important;
    border: 1px solid rgba(0, 166, 251, 0.2) !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, rgba(0, 166, 251, 0.08), rgba(255, 145, 77, 0.05)) !important;
}

/* ── Retrait en magasin — shipping option highlight ──────────── */
#shipping_method li label[for*="altronix_retrait"],
.woocommerce-shipping-methods li label[for*="altronix_retrait"] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    color: var(--color-success);
    font-weight: 600;
}

/* Highlight the entire row when retrait is selected */
#shipping_method li:has(input[value*="altronix_retrait"]:checked),
.woocommerce-shipping-methods li:has(input[value*="altronix_retrait"]:checked) {
    background: rgba(16, 185, 129, 0.06);
    border-color: rgba(16, 185, 129, 0.3) !important;
    border-radius: 8px;
}

/* "Gratuit" badge next to the label */
#shipping_method li label[for*="altronix_retrait"]::after,
.woocommerce-shipping-methods li label[for*="altronix_retrait"]::after {
    content: 'GRATUIT';
    display: inline-block;
    padding: 2px var(--space-2);
    background: rgba(16, 185, 129, 0.15);
    border: 1px solid rgba(16, 185, 129, 0.35);
    border-radius: 999px;
    font-size: 0.6rem;
    letter-spacing: 0.06em;
    color: var(--color-success);
    font-weight: 700;
    margin-inline-start: var(--space-2);
}

/* ══════════════════════════════════════════════════════════════
   REDUCE MOTION
   ══════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
    .altronix-pcard__inner,
    .altronix-pcard__img,
    .altronix-pcard__overlay,
    .altronix-cat-card,
    .altronix-cat-card__img,
    .altronix-shop-sidebar,
    .altronix-pcard__btn,
    .altronix-cat-card__placeholder { transition: none !important; }
}

/* ══════════════════════════════════════════════════════════════
   LIVE SEARCH DROPDOWN
══════════════════════════════════════════════════════════════ */

.altronix-shop-hero__search { position: relative; }

.altronix-srch-drop {
    position: fixed;
    /* top / left / width set by JS (positionDrop) */
    background: var(--color-bg-secondary);
    border: 1px solid var(--color-border-strong);
    border-block-start: 2px solid var(--color-accent-blue);
    border-radius: 0 0 14px 14px;
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(0, 166, 251, 0.1);
    z-index: 9999;
    max-block-size: 440px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--color-border-strong) transparent;
}

.altronix-srch-drop::-webkit-scrollbar { width: 4px; }
.altronix-srch-drop::-webkit-scrollbar-track { background: transparent; }
.altronix-srch-drop::-webkit-scrollbar-thumb { background: var(--color-border-strong); border-radius: 2px; }

.altronix-srch-item {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    text-decoration: none;
    border-block-end: 1px solid var(--color-border-subtle);
    transition:
        background var(--duration-fast) var(--ease-out),
        padding-inline-start var(--duration-fast) var(--ease-out);
}

.altronix-srch-item:last-of-type { border-block-end: none; }

.altronix-srch-item:hover,
.altronix-srch-item.is-active {
    background: rgba(0, 166, 251, 0.07);
    padding-inline-start: calc(var(--space-4) + 4px);
}

.altronix-srch-item__img {
    inline-size: 56px;
    block-size: 56px;
    object-fit: contain;
    border-radius: 8px;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    flex-shrink: 0;
}

.altronix-srch-item__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-inline-size: 0;
}

.altronix-srch-item__cat {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-accent-blue);
}

.altronix-srch-item__name {
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--color-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.altronix-srch-item__price {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    font-weight: 500;
}

.altronix-srch-item__arrow {
    color: var(--color-text-muted);
    flex-shrink: 0;
    transition:
        transform var(--duration-fast) var(--ease-out),
        color var(--duration-fast) var(--ease-out);
}

.altronix-srch-item:hover .altronix-srch-item__arrow,
.altronix-srch-item.is-active .altronix-srch-item__arrow {
    transform: translateX(4px);
    color: var(--color-accent-blue);
}

.altronix-srch-footer {
    padding: var(--space-3) var(--space-4);
    border-block-start: 1px solid var(--color-border-subtle);
    background: rgba(0, 166, 251, 0.03);
}

.altronix-srch-footer a {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    justify-content: center;
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--color-accent-blue);
    text-decoration: none;
    transition: gap var(--duration-fast) var(--ease-out);
}

.altronix-srch-footer a:hover { gap: var(--space-3); }

.altronix-srch-empty {
    padding: var(--space-6) var(--space-4);
    text-align: center;
    font-size: var(--fs-sm);
    color: var(--color-text-muted);
    margin: 0;
}

.altronix-srch-empty strong { color: var(--color-text-secondary); }

.altronix-srch-loading {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-6);
}

.altronix-srch-loading span {
    inline-size: 8px;
    block-size: 8px;
    border-radius: 50%;
    background: var(--color-accent-blue);
    animation: srch-bounce 1.2s ease-in-out infinite;
}

.altronix-srch-loading span:nth-child(2) { animation-delay: 0.2s; }
.altronix-srch-loading span:nth-child(3) { animation-delay: 0.4s; }

@keyframes srch-bounce {
    0%, 80%, 100% { transform: scale(0.55); opacity: 0.3; }
    40%            { transform: scale(1);    opacity: 1;   }
}

@media (prefers-reduced-motion: reduce) {
    .altronix-srch-loading span { animation: none; }
    .altronix-srch-item { transition: none; }
}

/* ════════════════════════════════════════════════════════════════
   Thank-you / Order-received page — enterprise redesign
   ════════════════════════════════════════════════════════════════ */

.alx-thankyou {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin-block: var(--space-6) var(--space-12);
}

.alx-u-visually-hidden {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
    padding: 0;
    margin: -1px;
}

/* ── Hero / confirmation banner ──────────────────────────── */
.alx-thankyou__hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-3);
    padding: var(--space-8) var(--space-6);
    border-radius: 20px;
    background: var(--gradient-industrial);
    border: 1px solid var(--color-border-subtle);
}

.alx-thankyou__hero-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 64px;
    block-size: 64px;
    border-radius: 50%;
    background: rgba(16, 185, 129, 0.12);
    color: var(--color-success);
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.alx-thankyou__hero-icon svg {
    inline-size: 30px;
    block-size: 30px;
}

.alx-thankyou__hero--failed .alx-thankyou__hero-icon {
    background: rgba(239, 68, 68, 0.12);
    color: var(--color-danger);
    border-color: rgba(239, 68, 68, 0.3);
}

.alx-thankyou__hero-title {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--fs-2xl);
    color: var(--color-text-primary);
    margin: 0;
    max-inline-size: 38ch;
}

.alx-thankyou__hero-text {
    font-size: var(--fs-base);
    line-height: 1.65;
    color: var(--color-text-secondary);
    max-inline-size: 56ch;
    margin: 0;
}

/* ── Account-created notice ──────────────────────────────── */
.alx-thankyou__notice {
    display: flex;
    align-items: flex-start;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-6);
    border-radius: 14px;
    background: rgba(0, 166, 251, 0.06);
    border: 1px solid rgba(0, 166, 251, 0.25);
}

.alx-thankyou__notice-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 40px;
    block-size: 40px;
    border-radius: 50%;
    background: rgba(0, 166, 251, 0.12);
    color: var(--color-accent-blue);
}

.alx-thankyou__notice-icon svg {
    inline-size: 20px;
    block-size: 20px;
}

.alx-thankyou__notice p {
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.alx-thankyou__notice a {
    display: inline-block;
    margin-inline-start: var(--space-1);
    color: var(--color-accent-blue);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color var(--duration-fast) var(--ease-out);
}

.alx-thankyou__notice a:hover,
.alx-thankyou__notice a:focus-visible {
    border-color: currentColor;
}

/* ── Section title ────────────────────────────────────────── */
.alx-thankyou__section-title {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: var(--fs-lg);
    color: var(--color-text-primary);
    margin: 0 0 var(--space-4);
}

/* ── Order summary cards ──────────────────────────────────── */
.alx-thankyou__cards {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: 1fr;
    gap: var(--space-4);
    list-style: none;
    margin: 0;
    padding: 0;
}

.alx-thankyou__card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-6);
    border-radius: 16px;
    background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border-subtle);
    transition: border-color var(--duration-base) var(--ease-out),
                transform var(--duration-base) var(--ease-out);
}

.alx-thankyou__card:hover {
    border-color: var(--color-border-strong);
    transform: translateY(-2px);
}

.alx-thankyou__card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 44px;
    block-size: 44px;
    border-radius: 10px;
    background: rgba(0, 166, 251, 0.1);
    color: var(--color-accent-blue);
    margin-block-end: var(--space-1);
}

.alx-thankyou__card-icon svg {
    inline-size: 22px;
    block-size: 22px;
}

.alx-thankyou__card-label {
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-muted);
    font-weight: 600;
}

.alx-thankyou__card-value {
    font-family: var(--font-display);
    font-size: var(--fs-lg);
    line-height: 1.3;
    font-weight: 700;
    color: var(--color-text-primary);
    overflow-wrap: break-word;
}

.alx-thankyou__card-value strong {
    font-family: inherit;
    font-weight: inherit;
    color: inherit;
}

/* ── Prochaines étapes ────────────────────────────────────── */
.alx-thankyou__steps {
    padding: var(--space-6);
    border-radius: 16px;
    background: var(--color-bg-secondary);
    border: 1px solid var(--color-border-subtle);
}

.alx-thankyou__steps-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    list-style: none;
    margin: 0;
    padding: 0;
}

.alx-thankyou__steps-item {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--fs-sm);
    font-weight: 500;
    color: var(--color-text-secondary);
}

.alx-thankyou__steps-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 28px;
    block-size: 28px;
    border-radius: 50%;
    background: rgba(16, 185, 129, 0.12);
    color: var(--color-success);
}

.alx-thankyou__steps-icon svg {
    inline-size: 16px;
    block-size: 16px;
}

/* ── Actions panel ────────────────────────────────────────── */
.alx-thankyou__actions {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
}

/* Download PDF buttons — 1 colonne chacun (côte à côte) */
.alx-thankyou__actions .alx-thankyou__btn--download {
    grid-column: span 1;
}

/* Retour à la boutique — pleine largeur, centré */
.alx-thankyou__actions .alx-thankyou__btn--primary {
    grid-column: 1 / -1;
    max-inline-size: 380px;
    justify-self: center;
    inline-size: 100%;
}

.alx-thankyou__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-6);
    border-radius: 10px;
    font-size: var(--fs-sm);
    font-weight: 600;
    letter-spacing: 0.01em;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid transparent;
    transition: transform var(--duration-fast) var(--ease-out),
                border-color var(--duration-base) var(--ease-out),
                background var(--duration-base) var(--ease-out),
                box-shadow var(--duration-base) var(--ease-out);
}

.alx-thankyou__btn svg {
    inline-size: 16px;
    block-size: 16px;
    flex-shrink: 0;
    opacity: 0.85;
}

.alx-thankyou__btn:hover,
.alx-thankyou__btn:focus-visible {
    transform: translateY(-2px);
}

/* Primary — Retour à la boutique */
.alx-thankyou__btn--primary {
    color: #ffffff;
    background: var(--gradient-accent);
    box-shadow: 0 6px 20px -8px rgba(0, 166, 251, 0.6);
}

.alx-thankyou__btn--primary svg { opacity: 1; }

.alx-thankyou__btn--primary:hover,
.alx-thankyou__btn--primary:focus-visible {
    box-shadow: 0 10px 28px -6px rgba(0, 166, 251, 0.7);
}

/* Download — PDF buttons (invoice + packing slip) */
.alx-thankyou__btn--download {
    color: var(--color-text-primary);
    background: var(--color-bg-tertiary);
    border-color: var(--color-border-strong);
}

.alx-thankyou__btn--download:hover,
.alx-thankyou__btn--download:focus-visible {
    color: var(--color-accent-blue);
    border-color: var(--color-accent-blue);
    background: rgba(0, 166, 251, 0.06);
    box-shadow: 0 4px 16px -6px rgba(0, 166, 251, 0.3);
}

/* Ghost — Print */
.alx-thankyou__btn--ghost {
    color: var(--color-text-muted);
    background: transparent;
    border-color: var(--color-border-subtle);
}

.alx-thankyou__btn--ghost:hover,
.alx-thankyou__btn--ghost:focus-visible {
    color: var(--color-text-secondary);
    border-color: var(--color-border-strong);
    background: var(--color-surface-glass);
}

/* ── Gateway note (payment instructions from hook chain) ──── */
.alx-thankyou__gateway-note {
    padding: var(--space-4) var(--space-6);
    border-radius: 14px;
    background: var(--color-surface-glass);
    border: 1px solid var(--color-border-subtle);
    color: var(--color-text-secondary);
    font-size: var(--fs-sm);
    line-height: 1.6;
}

.alx-thankyou__gateway-note p {
    margin: 0;
}

.alx-thankyou__gateway-note p + p {
    margin-block-start: var(--space-2);
}

/* ── Besoin d'aide ────────────────────────────────────────── */
.alx-thankyou__help {
    padding: var(--space-6);
    border-radius: 16px;
    background: var(--color-bg-secondary);
    border: 1px solid var(--color-border-subtle);
}

.alx-thankyou__help-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-3);
    list-style: none;
    margin: 0;
    padding: 0;
}

.alx-thankyou__help-link {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    border-radius: 12px;
    background: var(--color-surface-glass);
    border: 1px solid var(--color-border-subtle);
    color: inherit;
    text-decoration: none;
    transition: border-color var(--duration-base) var(--ease-out),
                background var(--duration-base) var(--ease-out),
                transform var(--duration-base) var(--ease-out);
}

.alx-thankyou__help-link:hover,
.alx-thankyou__help-link:focus-visible {
    border-color: var(--color-accent-blue);
    background: rgba(0, 166, 251, 0.08);
    transform: translateY(-2px);
}

.alx-thankyou__help-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 44px;
    block-size: 44px;
    border-radius: 12px;
    background: rgba(0, 166, 251, 0.12);
    color: var(--color-accent-blue);
}

.alx-thankyou__help-icon svg {
    inline-size: 22px;
    block-size: 22px;
}

.alx-thankyou__help-label {
    display: block;
    font-size: var(--fs-xs);
    font-weight: 500;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.alx-thankyou__help-value {
    display: block;
    margin-block-start: var(--space-1);
    font-size: var(--fs-base);
    font-weight: 600;
    color: var(--color-text-primary);
    overflow-wrap: break-word;
}

/* ── Responsive ───────────────────────────────────────────── */
@media (min-width: 768px) {
    .alx-thankyou__hero {
        padding-inline: var(--space-16);
    }

    .alx-thankyou__cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alx-thankyou__actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alx-thankyou__help-list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .alx-thankyou {
        gap: var(--space-12);
    }

    .alx-thankyou__hero-title {
        font-size: var(--fs-3xl);
    }

    .alx-thankyou__cards {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (prefers-reduced-motion: reduce) {
    .alx-thankyou__card,
    .alx-thankyou__btn,
    .alx-thankyou__help-link {
        transition: none;
    }

    .alx-thankyou__card:hover,
    .alx-thankyou__btn:hover,
    .alx-thankyou__help-link:hover {
        transform: none;
    }
}

/* ── Print: keep only the essentials ──────────────────────── */
@media print {
    .alx-thankyou__actions,
    .alx-thankyou__help,
    .site-header,
    .site-footer,
    .altronix-cta,
    [data-sidebar],
    [data-sidebar-overlay] {
        display: none !important;
    }

    .alx-thankyou__hero,
    .alx-thankyou__card,
    .alx-thankyou__steps {
        background: #fff !important;
        border-color: #ccc !important;
        box-shadow: none !important;
        color: #111 !important;
    }

    .alx-thankyou__hero-title,
    .alx-thankyou__card-value {
        color: #111 !important;
    }
}

@media (max-width: 767px) {
    .woocommerce .altronix-sp,
    .woocommerce-page .altronix-sp {
        row-gap: var(--space-3) !important;
    }

    .altronix-sp {
        padding-block: var(--space-2) var(--space-5) !important;
        padding-inline: var(--space-4) !important;
    }

    .woocommerce .altronix-sp .altronix-sp__breadcrumb,
    .altronix-sp__breadcrumb {
        margin-block-end: var(--space-2) !important;
    }

    .woocommerce .altronix-sp .woocommerce-product-gallery {
        margin-block-end: 0 !important;
    }

    .woocommerce .altronix-sp .woocommerce-product-gallery .woocommerce-product-gallery__image img,
    .woocommerce .altronix-sp .woocommerce-product-gallery__image .wp-post-image {
        min-height: 220px !important;
        max-height: 320px !important;
        padding: var(--space-3) !important;
    }

    .altronix-sp__summary .product_title {
        margin-block-end: var(--space-1) !important;
    }

    .altronix-sp__summary p.price,
    .altronix-sp__summary span.price,
    .altronix-sp__summary .woocommerce-product-details__short-description,
    .altronix-sp__summary .cart,
    .altronix-sp__summary .product_meta {
        margin-block-end: var(--space-2) !important;
    }

    .altronix-sp__trust {
        margin-block: var(--space-1) !important;
    }

    .altronix-sp__cta-row {
        margin-block-end: 0 !important;
    }

    .altronix-sp__summary form.cart,
    .altronix-sp__summary form.cart.altronix-cart-in-cart {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .altronix-sp__summary form.cart.altronix-cart-in-cart .single_add_to_cart_button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        padding-inline: var(--space-4) !important;
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.35 !important;
    }

    .altronix-sp__cart-status {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .altronix-sp__cart-status span,
    .altronix-sp__cart-status a {
        min-width: 0 !important;
    }

    .altronix-sp__cart-status a {
        white-space: normal !important;
    }
}