/**
 * LLA Checkout Pro — Master Stylesheet
 *
 * Specificity: body .lla-co double-class nesting to win over Elementor.
 * Uses LLA Design System tokens (--lla-*).
 * Mobile-first responsive approach.
 *
 * @package LLA_Checkout_Pro
 * @since 1.9.4
 */

/* ═══════════════════════════════════════════════
   0. DESIGN TOKENS (fallbacks if design system not loaded)
   ═══════════════════════════════════════════════ */
:root {
    --lla-co-primary: var(--lla-color-primary, #D79942);
    --lla-co-primary-dark: var(--lla-color-primary-dark, #C4872F);
    --lla-co-secondary: var(--lla-color-secondary, #30251D);
    --lla-co-bg: var(--lla-color-background, #FAF7F2);
    --lla-co-surface: #FFFFFF;
    --lla-co-border: #E8E0D6;
    --lla-co-border-light: #F0EBE4;
    --lla-co-text: var(--lla-color-text, #1A1612);
    --lla-co-text-muted: #6B5E52;
    --lla-co-text-light: #9A8E82;
    --lla-co-success: #16a34a;
    --lla-co-success-bg: #f0fdf4;
    --lla-co-warning: #f59e0b;
    --lla-co-error: #dc2626;
    --lla-co-error-bg: #fef2f2;
    --lla-co-discount: #dc2626;
    --lla-co-radius-sm: 6px;
    --lla-co-radius-md: 10px;
    --lla-co-radius-lg: 14px;
    --lla-co-shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
    --lla-co-shadow-md: 0 4px 12px rgba(0,0,0,0.08);
    --lla-co-shadow-lg: 0 8px 24px rgba(0,0,0,0.1);
    --lla-co-font: var(--lla-font-primary, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    --lla-co-transition: 0.2s ease;
    --lla-co-max-width: 1200px;
}

/* ═══════════════════════════════════════════════
   0b. ELEMENTOR SPECIFICITY ARMOR
   Force les propriétés critiques que Elementor écrase.
   Spécificité: body.elementor-page .lla-co (0,2,1) gagne sur
   .elementor-page .elementor-element .elementor-widget-container (0,3,0)
   en étant chargé APRÈS (priority 999).
   ═══════════════════════════════════════════════ */

/* Typography resets — Elementor force sa font-family sur body et .elementor */
body.elementor-default .lla-co,
body.elementor-page .lla-co,
.elementor-page .elementor-widget-container .lla-co,
.elementor .lla-co {
    font-family: var(--lla-co-font);
    color: var(--lla-co-text);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

/* All text elements inside .lla-co must inherit our font, not Elementor's */
body.elementor-default .lla-co *,
body.elementor-page .lla-co *,
.elementor-page .elementor-widget-container .lla-co * {
    font-family: inherit;
}

/* Links — Elementor styles .elementor a */
body.elementor-page .lla-co a,
.elementor .lla-co a {
    color: var(--lla-co-primary);
    text-decoration: none;
}

/* Headings — Elementor h1-h6 styles */
body.elementor-page .lla-co h1,
body.elementor-page .lla-co h2,
body.elementor-page .lla-co h3,
body.elementor-page .lla-co h4 {
    font-family: var(--lla-co-font);
    line-height: 1.2;
    margin: 0;
    padding: 0;
}

/* Paragraphs — Elementor adds big margins */
body.elementor-page .lla-co p {
    margin: 0;
    font-family: var(--lla-co-font);
}

/* Grid layout — Elementor .elementor-widget-container can force display:block */
body.elementor-page .lla-co .lla-co__grid {
    display: grid;
}

body.elementor-page .lla-co .lla-co__steps {
    display: flex;
}

body.elementor-page .lla-co .lla-co__trust-bar {
    display: grid;
}

/* Buttons — Elementor styles .elementor-button */
body.elementor-page .lla-co .lla-co__btn {
    font-family: var(--lla-co-font);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
}

/* Inputs — Elementor styles form elements globally */
body.elementor-page .lla-co input,
body.elementor-page .lla-co select,
body.elementor-page .lla-co textarea {
    font-family: var(--lla-co-font);
    font-size: 15px;
    color: var(--lla-co-text);
}

/* Images — Elementor forces inline-block on images */
body.elementor-page .lla-co img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Container max-width — Elementor .elementor-container forces its own */
body.elementor-page .lla-co .lla-co__container,
body.elementor-page .lla-co .lla-co__grid {
    max-width: var(--lla-co-max-width);
}

/* Sidebar sticky — put sticky on the sidebar itself, not summary */
@media (min-width: 768px) {
    body .lla-co .lla-co__sidebar,
    body.elementor-page .lla-co .lla-co__sidebar {
        position: sticky !important;
        top: 24px;
        align-self: start !important;
        max-height: calc(100vh - 48px);
        overflow-y: auto;
        scrollbar-width: thin;
    }
}
/* Sticky requires NO overflow:hidden/auto on ANY ancestor up to viewport */
body .lla-co,
body .lla-co .lla-co__checkout,
body .lla-co .lla-co__grid,
body .lla-co .lla-co__main,
body .lla-co .lla-co__panel,
body .lla-co .lla-co__sidebar,
body .lla-co .lla-co__content,
body.elementor-page .lla-co,
.elementor-element,
.e-con,
.e-con-inner,
.elementor-widget-container {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
}

/* Step title/subtitle — critical typography */
body.elementor-page .lla-co .lla-co__step-title {
    font-family: var(--lla-co-font);
    font-size: 28px;
    font-weight: 700;
    color: var(--lla-co-secondary);
    margin: 0 0 4px;
}

body.elementor-page .lla-co .lla-co__step-subtitle {
    font-family: var(--lla-co-font);
    font-size: 15px;
    color: var(--lla-co-text-muted);
    margin: 0;
}

/* Summary card title */
body.elementor-page .lla-co .lla-co__summary-title {
    font-family: var(--lla-co-font);
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 16px;
}

/* Vendor name */
body.elementor-page .lla-co .lla-co__vendor-name {
    font-family: var(--lla-co-font);
    font-size: 15px;
    font-weight: 600;
    margin: 0;
}

/* Item name */
body.elementor-page .lla-co .lla-co__item-name {
    font-family: var(--lla-co-font);
    font-size: 15px;
    font-weight: 500;
    margin: 0;
}

/* ═══════════════════════════════════════════════
   1. BASE / RESET (boosted specificity vs Elementor)
   ═══════════════════════════════════════════════ */

/*
 * Elementor Protection Layer
 * Neutralise les styles Elementor qui s'appliquent à l'intérieur de .lla-co.
 * Spécificité body .lla-co (0,1,1) > .elementor-widget-container (0,1,0)
 */
body .lla-co,
body .lla-co .elementor-widget-container,
body .lla-co .elementor-element,
body .lla-co .e-con,
body .lla-co .e-con-inner {
    font-family: var(--lla-co-font);
    color: var(--lla-co-text);
    line-height: 1.5;
    max-width: none;
    box-sizing: border-box;
}

body .lla-co {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
    width: 100%;
    overflow-x: hidden;
    padding-bottom: 100px; /* mobile bar clearance */
}

@media (min-width: 768px) {
    body .lla-co {
        padding-bottom: 40px; /* no mobile bar on desktop */
    }
}

/* Ensure intermediate wrappers take full width */
body .lla-co .lla-co__content,
body .lla-co .lla-co__cart {
    width: 100%;
}

body .lla-co *,
body .lla-co *::before,
body .lla-co *::after {
    box-sizing: border-box;
}

body .lla-co img {
    max-width: 100%;
    height: auto;
    display: block;
}

body .lla-co a {
    color: var(--lla-co-primary);
    text-decoration: none;
    transition: color var(--lla-co-transition);
}

body .lla-co a:hover {
    color: var(--lla-co-primary-dark);
}

/* Reset Elementor <p> margins inside our checkout */
body .lla-co p {
    margin: 0;
}

/* Reset Elementor headings */
body .lla-co h1, body .lla-co h2, body .lla-co h3,
body .lla-co h4, body .lla-co h5, body .lla-co h6 {
    font-family: var(--lla-co-font);
    color: var(--lla-co-text);
    margin: 0;
    padding: 0;
}

/* Reset Elementor widget spacing */
body .lla-co .elementor-widget:not(:last-child) {
    margin-bottom: 0;
}

/* ═══════════════════════════════════════════════
   2. LAYOUT — Container + 2-column grid (boosted specificity)
   ═══════════════════════════════════════════════ */
body .lla-co .lla-co__container {
    max-width: var(--lla-co-max-width);
    margin: 0 auto;
    padding: 0 16px;
}

body .lla-co .lla-co__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    width: 100%;
    max-width: var(--lla-co-max-width);
    margin: 0 auto;
    padding: 0 16px;
    box-sizing: border-box;
}

@media (min-width: 768px) {
    body .lla-co .lla-co__grid {
        grid-template-columns: 1fr 360px;
        gap: 32px;
        padding: 0 24px;
    }
}

@media (min-width: 1024px) {
    body .lla-co .lla-co__grid {
        grid-template-columns: 1fr 400px;
        gap: 40px;
    }
}

body .lla-co .lla-co__main {
    min-width: 0;
}

/* ═══════════════════════════════════════════════
   3. PROGRESS BAR (Stepper) — boosted specificity
   ═══════════════════════════════════════════════ */
body .lla-co .lla-co__progress {
    max-width: var(--lla-co-max-width);
    margin: 0 auto;
    padding: 24px 16px;
}

body .lla-co .lla-co__steps {
    display: flex;
    align-items: center;
    justify-content: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0;
}

body .lla-co .lla-co__step {
    display: flex;
    align-items: center;
    gap: 0;
}

body .lla-co .lla-co__step-link,
body .lla-co .lla-co__step-span {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: var(--lla-co-radius-sm);
    font-size: 14px;
    font-weight: 500;
    font-family: var(--lla-co-font);
    transition: all var(--lla-co-transition);
    white-space: nowrap;
    text-decoration: none;
}

/* Step states */
.lla-co__step[data-state="done"] .lla-co__step-link {
    color: var(--lla-co-success);
}

.lla-co__step[data-state="done"] .lla-co__step-link:hover {
    background: var(--lla-co-success-bg);
}

.lla-co__step[data-state="done"] .lla-co__step-number {
    background: var(--lla-co-success);
    color: #fff;
}

.lla-co__step[data-state="active"] .lla-co__step-link {
    color: var(--lla-co-primary);
    font-weight: 600;
}

.lla-co__step[data-state="active"] .lla-co__step-number {
    background: var(--lla-co-primary);
    color: #fff;
}

.lla-co__step[data-state="pending"] .lla-co__step-link {
    color: var(--lla-co-text-light);
}

.lla-co__step[data-state="pending"] .lla-co__step-number {
    background: var(--lla-co-border);
    color: var(--lla-co-text-light);
}

.lla-co__step-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 600;
    flex-shrink: 0;
    transition: all var(--lla-co-transition);
}

.lla-co__step-label {
    display: none;
}

@media (min-width: 640px) {
    .lla-co__step-label {
        display: inline;
    }
}

.lla-co__step-sep {
    width: 40px;
    height: 2px;
    background: var(--lla-co-border);
    margin: 0 4px;
    flex-shrink: 0;
    transition: background var(--lla-co-transition);
}

.lla-co__step[data-state="done"] + .lla-co__step-sep,
.lla-co__step-sep + .lla-co__step[data-state="done"]  {
    /* Handled in a cleaner way */
}

/* Previous separators (before active step) are colored */
.lla-co__step[data-state="done"] ~ .lla-co__step-sep {
    background: var(--lla-co-success);
}

/* ═══════════════════════════════════════════════
   4. FREE SHIPPING BAR
   ═══════════════════════════════════════════════ */
.lla-co__free-shipping {
    max-width: var(--lla-co-max-width);
    margin: 0 auto 20px;
    padding: 14px 18px;
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-md);
    box-sizing: border-box;
}

.lla-co__free-shipping-msg {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    margin-bottom: 10px;
}

.lla-co__free-shipping-msg--done {
    color: var(--lla-co-success);
    font-weight: 600;
    margin-bottom: 6px;
}

.lla-co__free-shipping-track {
    position: relative;
    height: 6px;
    background: var(--lla-co-border-light);
    border-radius: 3px;
    overflow: visible;
}

.lla-co__free-shipping-fill {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--lla-co-primary), var(--lla-co-success));
    transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.lla-co__free-shipping-marker {
    position: absolute;
    right: 0;
    top: -22px;
    font-size: 11px;
    color: var(--lla-co-text-muted);
}

/* ═══════════════════════════════════════════════
   5. TRUST BAR
   ═══════════════════════════════════════════════ */
body .lla-co .lla-co__trust-bar {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    padding: 12px 0;
    border-top: 1px solid var(--lla-co-border-light);
    margin-top: 16px;
}

@media (min-width: 768px) {
    body .lla-co .lla-co__trust-bar {
        grid-template-columns: repeat(4, 1fr);
    }
}

.lla-co__trust-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--lla-co-text-muted);
}

/* ═══════════════════════════════════════════════
   6. CART PAGE (Step 1)
   ═══════════════════════════════════════════════ */

/* Vendor Group */
body .lla-co .lla-co__vendor-group {
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-lg);
    overflow: hidden;
    margin-bottom: 16px;
    box-shadow: var(--lla-co-shadow-sm);
}

body .lla-co .lla-co__vendor-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: var(--lla-co-bg);
    border-bottom: 1px solid var(--lla-co-border-light);
    font-size: 14px;
    font-weight: 600;
    font-family: var(--lla-co-font);
    color: var(--lla-co-secondary);
}

body .lla-co .lla-co__vendor-name {
    font-size: 15px;
    font-weight: 600;
    font-family: var(--lla-co-font);
    margin: 0;
}

.lla-co__vendor-delivery {
    padding: 10px 18px;
    background: var(--lla-co-bg);
    border-top: 1px solid var(--lla-co-border-light);
    font-size: 13px;
    color: var(--lla-co-text-muted);
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 0 0 var(--lla-co-radius-lg) var(--lla-co-radius-lg);
}

.lla-co__vendor-delivery svg {
    flex-shrink: 0;
    color: var(--lla-co-primary);
}

.lla-co__vendor-delivery strong {
    color: var(--lla-co-text);
}

/* Cart Item */
body .lla-co .lla-co__item {
    display: grid;
    grid-template-columns: 80px 1fr auto;
    gap: 14px;
    padding: 16px 18px;
    align-items: start;
    border-bottom: 1px solid var(--lla-co-border-light);
    position: relative;
    transition: opacity 0.3s, transform 0.3s;
}

.lla-co__item:last-child {
    border-bottom: none;
}

.lla-co__item--removing {
    opacity: 0;
    transform: translateX(-20px);
}

@media (min-width: 640px) {
    .lla-co__item {
        grid-template-columns: 100px 1fr auto;
        gap: 18px;
    }
}

.lla-co__item-img {
    position: relative;
    border-radius: var(--lla-co-radius-sm);
    overflow: hidden;
    aspect-ratio: 1;
    background: var(--lla-co-bg);
}

.lla-co__item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lla-co__item-badge {
    position: absolute;
    bottom: 4px;
    left: 4px;
    background: var(--lla-co-primary);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 3px;
    line-height: 1.3;
}

.lla-co__item-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

body .lla-co .lla-co__item-name {
    font-size: 15px;
    font-weight: 500;
    font-family: var(--lla-co-font);
    color: var(--lla-co-text);
    line-height: 1.3;
    margin: 0;
}

.lla-co__item-name a {
    color: inherit;
}

.lla-co__item-name a:hover {
    color: var(--lla-co-primary);
}

.lla-co__item-variant {
    font-size: 13px;
    color: var(--lla-co-text-muted);
}

.lla-co__item-stock {
    font-size: 12px;
    color: var(--lla-co-warning);
    font-weight: 500;
}

.lla-co__item-unit-price {
    font-size: 12px;
    color: var(--lla-co-text-light);
    margin-top: 2px;
}

.lla-co__item-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

body .lla-co .lla-co__item-price {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--lla-co-font);
    color: var(--lla-co-text);
    white-space: nowrap;
}

/* Quantity Controls */
.lla-co__qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-sm);
    overflow: hidden;
}

.lla-co__qty-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lla-co-text);
    transition: all var(--lla-co-transition);
    font-size: 16px;
    padding: 0;
}

.lla-co__qty-btn:hover:not(:disabled) {
    background: var(--lla-co-bg);
    color: var(--lla-co-primary);
}

.lla-co__qty-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.lla-co__qty-input {
    width: 36px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    border: none;
    background: transparent;
    color: var(--lla-co-text);
    -moz-appearance: textfield;
    padding: 0;
}

.lla-co__qty-input::-webkit-inner-spin-button,
.lla-co__qty-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

.lla-co__remove {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--lla-co-text-light);
    padding: 4px;
    transition: color var(--lla-co-transition);
}

.lla-co__remove:hover {
    color: var(--lla-co-error);
}

/* ═══════════════════════════════════════════════
   7. SIDEBAR (Summary)
   ═══════════════════════════════════════════════ */
.lla-co__sidebar {
    order: -1; /* mobile: sidebar first */
}

@media (min-width: 768px) {
    .lla-co__sidebar {
        order: 0;
    }
}

body .lla-co .lla-co__summary,
body .lla-co .lla-co__conf-sidebar-card {
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-lg);
    padding: 24px;
    box-shadow: var(--lla-co-shadow-md);
}

/* Sticky moved to .lla-co__sidebar — see sidebar sticky section */

body .lla-co .lla-co__summary-title {
    font-size: 18px;
    font-weight: 700;
    font-family: var(--lla-co-font);
    margin: 0 0 16px;
    color: var(--lla-co-secondary);
}

.lla-co__summary-rows {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--lla-co-border-light);
    margin-bottom: 14px;
}

.lla-co__summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: var(--lla-co-text-muted);
}

.lla-co__summary-row--discount {
    color: var(--lla-co-discount);
}

.lla-co__summary-value--free {
    color: var(--lla-co-success);
    font-weight: 600;
}

.lla-co__summary-value--muted {
    color: var(--lla-co-text-light);
    font-size: 12px;
    font-style: italic;
}

.lla-co__summary-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    font-weight: 700;
    color: var(--lla-co-text);
    padding-top: 14px;
    border-top: 2px solid var(--lla-co-secondary);
    margin-bottom: 20px;
}

.lla-co__total-amount {
    color: var(--lla-co-primary);
    font-size: 22px;
}

/* Coupon */
.lla-co__coupon-toggle {
    background: none;
    border: none;
    padding: 0;
    font-size: 13px;
    color: var(--lla-co-primary);
    cursor: pointer;
    text-decoration: underline;
    text-decoration-style: dashed;
    margin-bottom: 10px;
    display: inline-block;
}

.lla-co__coupon-form {
    display: none;
    gap: 8px;
    margin-bottom: 12px;
}

.lla-co__coupon-form:not([hidden]) {
    display: flex;
}

.lla-co__coupon-input {
    flex: 1;
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-sm);
    padding: 8px 12px;
    font-size: 14px;
    font-family: var(--lla-co-font);
    transition: border-color var(--lla-co-transition);
    background: var(--lla-co-surface);
    color: var(--lla-co-text);
}

.lla-co__coupon-input:focus {
    border-color: var(--lla-co-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(215, 153, 66, 0.15);
}

.lla-co__coupon-applied {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
}

.lla-co__coupon-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #fef3c7;
    color: #92400e;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
}

.lla-co__coupon-remove {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--lla-co-text-light);
    font-size: 14px;
    padding: 0 4px;
    transition: color var(--lla-co-transition);
}

.lla-co__coupon-remove:hover {
    color: var(--lla-co-error);
}

/* ═══════════════════════════════════════════════
   8. BUTTONS
   ═══════════════════════════════════════════════ */
body .lla-co .lla-co__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: var(--lla-co-font);
    font-size: 15px;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: var(--lla-co-radius-md);
    border: none;
    cursor: pointer;
    transition: all var(--lla-co-transition);
    text-decoration: none;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
}

.lla-co__btn--primary {
    background: var(--lla-co-primary);
    color: #fff !important;
}

.lla-co__btn--primary:hover {
    background: var(--lla-co-primary-dark);
    color: #fff !important;
    box-shadow: var(--lla-co-shadow-md);
    transform: translateY(-1px);
}

.lla-co__btn--primary:active {
    transform: translateY(0);
    box-shadow: none;
}

.lla-co__btn--outline {
    background: transparent;
    color: var(--lla-co-primary);
    border: 2px solid var(--lla-co-primary);
}

.lla-co__btn--outline:hover {
    background: var(--lla-co-primary);
    color: #fff;
}

.lla-co__btn--small {
    font-size: 13px;
    padding: 8px 16px;
}

.lla-co__btn--full {
    width: 100%;
}

.lla-co__btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.lla-co__cta-btn {
    width: 100%;
    font-size: 16px;
    padding: 14px 24px;
}

.lla-co__cta-price {
    opacity: 0.9;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════
   9. CHECKOUT FORM (Step 2: Shipping/Payment)
   ═══════════════════════════════════════════════ */

/* Step heading — shared between cart & checkout */
body .lla-co .lla-co__step-heading {
    max-width: var(--lla-co-max-width);
    margin: 0 auto 24px;
    padding: 0 16px;
}

body .lla-co .lla-co__step-title {
    font-family: var(--lla-co-font);
    font-size: 28px;
    font-weight: 700;
    color: var(--lla-co-secondary);
    margin: 0 0 4px;
    line-height: 1.2;
}

body .lla-co .lla-co__step-subtitle {
    font-family: var(--lla-co-font);
    font-size: 15px;
    color: var(--lla-co-text-muted);
    margin: 0;
}

@media (max-width: 768px) {
    body .lla-co .lla-co__step-title {
        font-size: 22px;
    }
}

body .lla-co .lla-co__checkout,
body .lla-co .lla-co__confirmation {
    width: 100%;
    padding: 0;
    margin: 0;
}

/* Express Checkout (Apple Pay, Google Pay, Link — in sidebar) */
.lla-co__express-checkout:empty {
    display: none;
}

.lla-co__express-checkout {
    margin-top: 16px;
    padding: 0;
    border: none;
    background: none;
}

/* "Paiement express" label above buttons */
.lla-co__express-checkout::before {
    content: "Paiement express";
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--lla-co-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 10px;
    text-align: center;
}

/* No "ou" separator needed in sidebar */
.lla-co__express-checkout::after {
    content: none;
    display: none;
}

/* Style Stripe's express checkout wrapper */
.lla-co__express-checkout #wc-stripe-payment-request-wrapper,
.lla-co__express-checkout .wcpay-payment-request-wrapper,
.lla-co__express-checkout .wc-stripe-payment-request-wrapper,
.lla-co__express-checkout #wcpay-express-checkout-wrapper {
    margin: 0;
}

/* Hide Stripe's "or" separator — we handle our own */
.lla-co__express-checkout .wc-stripe-banner-checkout,
.lla-co__express-checkout #wc-stripe-payment-request-button-separator {
    display: none !important;
}

/* Express buttons — compact in sidebar */
.lla-co__express-checkout .apple-pay-button,
.lla-co__express-checkout .gpay-button,
.lla-co__express-checkout #wc-stripe-payment-request-button,
.lla-co__express-checkout .wcpay-payment-request-button-wrapper {
    border-radius: var(--lla-co-radius-md);
    min-height: 42px;
}

/* Stripe's "— OR —" / "— OU —" separator — ALL known variants */
.lla-co__express-checkout .wc-stripe-payment-request-button-separator,
.lla-co__express-checkout .wcpay-payment-request-button-separator,
.lla-co__express-checkout #wcpay-express-checkout-button-separator,
.lla-co__express-checkout [id*="separator"],
.lla-co__express-checkout [class*="separator"] {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    visibility: hidden !important;
}

/*
 * Stripe "ou continuez ci-dessous" / "or continue below" description text.
 * Can be a <p>, <span> or <div> with various class names.
 * Use broad selectors inside our express-checkout container.
 */
.lla-co__express-checkout p,
.lla-co__express-checkout > div > p,
.lla-co__express-checkout .wc-stripe-express-checkout-description,
.lla-co__express-checkout .wcpay-express-checkout-description,
.lla-co__express-checkout [class*="description"] {
    display: none !important;
}

/* ═══ Step Panels (Step 2 ↔ Step 3 split) ═══ */

.lla-co__panel[hidden] {
    display: none !important;
}

.lla-co__panel {
    animation: llaCoPanelIn 0.3s ease;
}

@keyframes llaCoPanelIn {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Continue to payment button */
body .lla-co .lla-co__btn--continue {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 8px;
    padding: 16px 32px;
    font-size: 16px;
    font-weight: 600;
    width: auto;
    border-radius: var(--lla-co-radius-md);
    background: var(--lla-co-primary);
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background var(--lla-co-transition), transform 0.1s;
}

body .lla-co .lla-co__btn--continue:hover {
    background: var(--lla-co-primary-dark);
}

body .lla-co .lla-co__btn--continue:active {
    transform: scale(0.98);
}

/* Full-width utility */
.lla-co__btn--full {
    width: 100%;
}

/* Back button */
body .lla-co .lla-co__btn--back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 0;
    margin-bottom: 16px;
    background: none;
    border: none;
    color: var(--lla-co-text-muted);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: color var(--lla-co-transition);
    font-family: var(--lla-co-font);
}

body .lla-co .lla-co__btn--back:hover {
    color: var(--lla-co-primary);
}

/* Address recap card */
.lla-co__address-recap {
    margin-bottom: 20px;
}

.lla-co__recap-card {
    background: var(--lla-co-bg);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-md);
    padding: 16px 20px;
    position: relative;
}

.lla-co__recap-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    color: var(--lla-co-secondary);
    font-size: 15px;
}

.lla-co__recap-details {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 13px;
    color: var(--lla-co-text-muted);
    padding-left: 24px;
}

body .lla-co .lla-co__recap-edit {
    position: absolute;
    top: 16px;
    right: 16px;
    background: none;
    border: none;
    color: var(--lla-co-primary);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: var(--lla-co-font);
    padding: 0;
}

body .lla-co .lla-co__recap-edit:hover {
    text-decoration: underline;
}

/* Sections always open, no toggle — used for single-page checkout */
.lla-co__section--no-toggle {
    border: none;
    box-shadow: none;
    background: #fff;
    padding: 20px 24px 24px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--lla-co-border, #f0e6d3);
    overflow: visible;
}

.lla-co__section--no-toggle:last-of-type {
    border-bottom: none;
}

/* Hide old accordion header (we use section-header-simple now) */
.lla-co__section--no-toggle .lla-co__section-header {
    display: none;
}

.lla-co__section--no-toggle .lla-co__section-body {
    max-height: none;
    overflow: visible;
    padding: 0;
}

/* Validation error on fields */
.lla-co__field--error {
    border-color: var(--lla-co-error) !important;
    box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.15) !important;
}

/* Section Accordion */
.lla-co__section {
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-lg);
    margin-bottom: 16px;
    overflow: visible;
    box-shadow: var(--lla-co-shadow-sm);
}

.lla-co__section-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    cursor: pointer;
    user-select: none;
    transition: background var(--lla-co-transition);
}

.lla-co__section-header:hover {
    background: var(--lla-co-bg);
}

.lla-co__section-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--lla-co-primary);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
}

.lla-co__section-title {
    flex: 1;
    font-size: 16px;
    font-weight: 600;
    margin: 0;
    color: var(--lla-co-secondary);
}

.lla-co__section-chevron {
    color: var(--lla-co-text-muted);
    transition: transform var(--lla-co-transition);
    flex-shrink: 0;
}

.lla-co__section--open .lla-co__section-chevron {
    transform: rotate(180deg);
}

.lla-co__section-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lla-co__section--open .lla-co__section-body {
    max-height: 2000px; /* large enough for content */
}

.lla-co__section-body > :first-child {
    padding-top: 4px;
}

.lla-co__section-body {
    padding: 0 20px;
}

.lla-co__section--open .lla-co__section-body {
    padding: 0 20px 20px;
}

/* Guest notice */
.lla-co__guest-notice {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fef3c7;
    color: #92400e;
    font-size: 13px;
    padding: 10px 14px;
    border-radius: var(--lla-co-radius-sm);
    margin-bottom: 16px;
}

/* Override WooCommerce form fields inside our sections */
.lla-co__checkout .woocommerce-billing-fields__field-wrapper,
.lla-co__checkout .woocommerce-shipping-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

@media (min-width: 640px) {
    .lla-co__checkout .woocommerce-billing-fields__field-wrapper,
    .lla-co__checkout .woocommerce-shipping-fields__field-wrapper {
        grid-template-columns: 1fr 1fr;
    }
}

.lla-co__checkout .form-row {
    margin: 0;
    padding: 0;
}

.lla-co__checkout .form-row-wide {
    grid-column: 1 / -1;
}

.lla-co__checkout .form-row label {
    font-size: 13px;
    font-weight: 500;
    color: var(--lla-co-text-muted);
    margin-bottom: 4px;
    display: block;
}

.lla-co__checkout .form-row input[type="text"],
.lla-co__checkout .form-row input[type="email"],
.lla-co__checkout .form-row input[type="tel"],
.lla-co__checkout .form-row input[type="number"],
.lla-co__checkout .form-row select,
.lla-co__checkout .form-row textarea {
    width: 100%;
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-sm);
    padding: 10px 14px;
    font-size: 15px;
    font-family: var(--lla-co-font);
    color: var(--lla-co-text);
    background: var(--lla-co-surface);
    transition: border-color var(--lla-co-transition), box-shadow var(--lla-co-transition);
}

.lla-co__checkout .form-row input:focus,
.lla-co__checkout .form-row select:focus,
.lla-co__checkout .form-row textarea:focus {
    border-color: var(--lla-co-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(215, 153, 66, 0.15);
}

.lla-co__checkout .form-row .woocommerce-invalid input,
.lla-co__checkout .form-row .woocommerce-invalid select {
    border-color: var(--lla-co-error);
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

/* Shipping methods styling */
.lla-co__shipping-methods {
    margin-top: 16px;
}

/* ═══ Shipping method CARDS (no radio buttons) ═══ */
.lla-co__checkout .woocommerce-shipping-methods {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.lla-co__checkout .woocommerce-shipping-methods li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    border: 2px solid var(--lla-co-border, #e5e7eb);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.15s ease;
    position: relative;
    background: #fff;
}

/* Hide the radio button — card click handles selection */
.lla-co__checkout .woocommerce-shipping-methods li input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

/* Label fills the entire card */
.lla-co__checkout .woocommerce-shipping-methods li label {
    flex: 1;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    padding: 0;
    font-size: 15px;
    line-height: 1.4;
    font-weight: 500;
    color: #1f2937;
}

/* Price styling inside label */
.lla-co__checkout .woocommerce-shipping-methods li label .woocommerce-Price-amount {
    font-weight: 700;
    font-size: 16px;
    color: #1f2937;
    white-space: nowrap;
    margin-left: auto;
    padding-left: 16px;
}

/* Hover */
.lla-co__checkout .woocommerce-shipping-methods li:hover {
    border-color: var(--lla-co-primary, #D79942);
    background: rgba(215, 153, 66, 0.03);
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

/* Selected state — prominent visual */
.lla-co__checkout .woocommerce-shipping-methods li:has(input:checked) {
    border-color: var(--lla-co-primary, #D79942);
    background: rgba(215, 153, 66, 0.06);
    box-shadow: 0 0 0 1px var(--lla-co-primary, #D79942);
}

.lla-co__checkout .woocommerce-shipping-methods li:has(input:checked)::before {
    content: "✓";
    position: absolute;
    top: -8px;
    right: -8px;
    width: 22px;
    height: 22px;
    background: var(--lla-co-primary, #D79942);
    color: #fff;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.lla-co__checkout .woocommerce-shipping-methods li input[type="radio"]:checked + label {
    font-weight: 600;
}

/* Free shipping highlight */
.lla-co__checkout .woocommerce-shipping-methods li label .woocommerce-Price-amount:empty + .amount,
.lla-co__checkout .woocommerce-shipping-methods li label .amount[data-price="0"] {
    color: #16a34a;
}

/* Section summary (collapsed state) */
.lla-co__section-summary {
    display: none;
    font-size: 13px;
    color: #6b7280;
    margin-left: auto;
    padding-right: 8px;
}
.lla-co__section.lla-co__section--completed .lla-co__section-summary {
    display: inline;
}

/* Payment methods */
.lla-co__checkout .woocommerce-checkout-payment {
    margin-top: 8px;
    background: none !important;
}

.lla-co__checkout .wc_payment_methods {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.lla-co__checkout .wc_payment_method {
    border: 1.5px solid var(--lla-co-border);
    border-radius: 12px;
    padding: 16px 18px;
    transition: all var(--lla-co-transition);
    cursor: pointer;
    background: #fff;
}

.lla-co__checkout .wc_payment_method:hover {
    border-color: var(--lla-co-primary);
}

.lla-co__checkout .wc_payment_method:has(> input:checked),
.lla-co__checkout .wc_payment_method:has(> input[checked]) {
    border-color: var(--lla-co-primary);
    background: #faf6f0;
    box-shadow: 0 0 0 1px var(--lla-co-primary);
}

/* Hide native radio — we use the card border as indicator */
.lla-co__checkout .wc_payment_method > input[type="radio"] {
    display: none !important;
}

.lla-co__checkout .wc_payment_method > label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    color: #1f2937;
}

/* Payment box (Stripe content area) */
.lla-co__checkout .wc_payment_method .payment_box {
    margin-top: 14px;
    padding: 16px;
    border-top: none;
    font-size: 13px;
    color: var(--lla-co-text-muted);
    background: #f9fafb !important;
    border-radius: 8px;
}

/* Stripe test mode notice */
.lla-co__checkout .wc_payment_method .payment_box #wc-stripe-payment-method-instructions-card {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 12px;
    color: #92400e;
    margin-bottom: 14px;
    line-height: 1.5;
}

/* Saved payment methods list */
.lla-co__checkout .woocommerce-SavedPaymentMethods {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-token {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: #fff;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-token:hover {
    border-color: var(--lla-co-primary);
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-token:has(input:checked) {
    border-color: var(--lla-co-primary);
    background: #faf6f0;
    box-shadow: 0 0 0 1px var(--lla-co-primary);
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-token input[type="radio"] {
    width: 18px !important;
    height: 18px !important;
    accent-color: var(--lla-co-primary);
    margin: 0 !important;
    flex-shrink: 0;
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-token label {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
    margin: 0;
}

/* "Use new payment method" link */
.lla-co__checkout .woocommerce-SavedPaymentMethods-new {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-new input[type="radio"] {
    width: 18px !important;
    height: 18px !important;
    accent-color: var(--lla-co-primary);
    margin: 0 !important;
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-new label {
    font-size: 13px;
    color: var(--lla-co-primary);
    font-weight: 500;
    cursor: pointer;
    margin: 0;
}

/* Stripe UPE form (new card input) — only style when visible */
.lla-co__checkout #wc-stripe-upe-form {
    border: none !important;
    padding: 0 !important;
    margin-top: 12px;
}

.lla-co__checkout #wc-stripe-upe-form[style*="display: none"],
.lla-co__checkout #wc-stripe-upe-form[style*="display:none"] {
    margin: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

.lla-co__checkout .wc-stripe-upe-element {
    background: #fff;
    border-radius: 10px;
    padding: 0;
    min-height: 0;
}

.lla-co__checkout .wc-stripe-upe-element:empty,
.lla-co__checkout .wc-stripe-upe-element:not(:has(iframe)) {
    display: none !important;
}

/* Stripe errors */
.lla-co__checkout .stripe-source-errors,
.lla-co__checkout #wc-stripe-upe-errors {
    color: #dc2626;
    font-size: 13px;
    margin-top: 8px;
}

/* Save payment checkbox — hide when saved card selected */
.lla-co__checkout .woocommerce-SavedPaymentMethods-saveNew {
    margin-top: 10px;
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-saveNew[style*="display: none"] {
    margin: 0 !important;
}

.lla-co__checkout .woocommerce-SavedPaymentMethods-saveNew label {
    font-size: 13px;
    color: #6b7280;
}

/* Strip borders from Stripe fieldsets */
.lla-co__checkout .payment_method_stripe fieldset {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Place order */
.lla-co__checkout .place-order {
    margin-top: 24px;
}

.lla-co__checkout #place_order {
    width: 100%;
    background: var(--lla-co-primary);
    color: #fff;
    border: none;
    border-radius: 12px;
    padding: 16px;
    font-size: 17px;
    font-weight: 700;
    font-family: var(--lla-co-font);
    cursor: pointer;
    transition: all var(--lla-co-transition);
    letter-spacing: 0.3px;
}

.lla-co__checkout #place_order:hover {
    background: var(--lla-co-primary-dark);
    box-shadow: 0 4px 12px rgba(215, 153, 66, 0.35);
    transform: translateY(-1px);
}

.lla-co__checkout #place_order:active {
    transform: translateY(0);
}

/* Rename "Stripe" → "Carte bancaire" via CSS */
.lla-co__checkout .payment_method_stripe > label[for="payment_method_stripe"] {
    font-size: 0 !important;
    line-height: 0 !important;
}
.lla-co__checkout .payment_method_stripe > label[for="payment_method_stripe"]::before {
    content: "Carte bancaire" !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    color: #1f2937 !important;
}
/* Card brand icons next to label */
.lla-co__checkout .payment_method_stripe > label[for="payment_method_stripe"]::after {
    content: "";
    display: inline-block;
    width: 100px;
    height: 22px;
    margin-left: 10px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 22"><rect x="0" y="0" width="34" height="22" rx="3" fill="%231a1f71"/><text x="17" y="15" font-size="8.5" fill="white" text-anchor="middle" font-family="Arial,sans-serif" font-weight="bold">VISA</text><rect x="38" y="0" width="24" height="22" rx="3" fill="%23f0f0f0" stroke="%23ddd"/><circle cx="46" cy="11" r="8" fill="%23eb001b" opacity="0.85"/><circle cx="54" cy="11" r="8" fill="%23f79e1b" opacity="0.85"/><rect x="66" y="0" width="34" height="22" rx="3" fill="%23f0f0f0" stroke="%23ddd"/><text x="83" y="15" font-size="7.5" fill="%23333" text-anchor="middle" font-family="Arial,sans-serif" font-weight="bold">CB</text></svg>') no-repeat center / contain;
    vertical-align: middle;
}

/* WC terms/privacy text */
.lla-co__checkout .woocommerce-terms-and-conditions-wrapper {
    font-size: 12px;
    color: #9ca3af;
    margin-top: 12px;
    line-height: 1.5;
}

.lla-co__checkout .woocommerce-terms-and-conditions-wrapper a {
    color: var(--lla-co-primary);
}

/* Mini items (checkout sidebar - vendor grouped) */
.lla-co__mini-vendors {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 16px;
    max-height: 320px;
    overflow-y: auto;
}

.lla-co__mini-vendor-group {
    padding: 10px 0;
    border-bottom: 1px solid var(--lla-co-border);
}

.lla-co__mini-vendor-group:last-child {
    border-bottom: none;
}

.lla-co__mini-vendor-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.lla-co__mini-vendor-logo {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--lla-co-border);
}

.lla-co__mini-vendor-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--lla-co-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
}

.lla-co__mini-vendor-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--lla-co-text);
}

.lla-co__mini-item {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.lla-co__mini-item:last-child {
    margin-bottom: 0;
}

.lla-co__mini-item-img {
    position: relative;
    width: 44px;
    height: 44px;
    overflow: visible !important;
    background: var(--lla-co-bg);
    flex-shrink: 0;
}

.lla-co__mini-item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--lla-co-radius-sm, 6px);
}

.lla-co__mini-item-qty {
    position: absolute;
    top: -5px;
    right: -5px;
    background: var(--lla-co-secondary);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lla-co__mini-item-info {
    flex: 1;
    min-width: 0;
}

.lla-co__mini-item-name {
    display: block;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--lla-co-text);
}

.lla-co__mini-item-addon {
    display: block;
    font-size: 11px;
    color: var(--lla-co-text-light);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.lla-co__mini-item-price {
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
    color: var(--lla-co-text);
}

.lla-co__edit-cart {
    display: block;
    text-align: center;
    font-size: 13px;
    margin-top: 12px;
    color: var(--lla-co-primary);
}

/* ═══════════════════════════════════════════════
   10. CONFIRMATION PAGE (Step 4)
   ═══════════════════════════════════════════════ */
.lla-co__confirmation {
    max-width: var(--lla-co-max-width);
    margin: 0 auto;
    padding: 0 16px;
}

/* Hero */
.lla-co__conf-hero {
    text-align: center;
    padding: 40px 20px 32px;
}

.lla-co__conf-hero-icon {
    margin-bottom: 16px;
    animation: lla-co-pop 0.6s cubic-bezier(0.36, 1.5, 0.5, 1) both;
}

@keyframes lla-co-pop {
    0% { transform: scale(0); opacity: 0; }
    70% { transform: scale(1.15); }
    100% { transform: scale(1); opacity: 1; }
}

.lla-co__conf-title {
    font-size: 28px;
    font-weight: 700;
    color: var(--lla-co-secondary);
    margin: 0 0 8px;
}

.lla-co__conf-subtitle {
    font-size: 15px;
    color: var(--lla-co-text-muted);
    margin: 0 0 12px;
}

.lla-co__conf-delivery {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-md);
    padding: 10px 18px;
    font-size: 14px;
    color: var(--lla-co-text-muted);
}

/* Timeline */
.lla-co__conf-timeline {
    max-width: 600px;
    margin: 0 auto 32px;
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-lg);
    padding: 24px;
    box-shadow: var(--lla-co-shadow-sm);
}

.lla-co__conf-section-title {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 16px;
    color: var(--lla-co-secondary);
}

.lla-co__timeline-steps {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
}

.lla-co__timeline-step {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 0;
    position: relative;
}

.lla-co__timeline-step:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 14px;
    top: 40px;
    bottom: -12px;
    width: 2px;
    background: var(--lla-co-border);
}

.lla-co__timeline-step--done:not(:last-child)::after {
    background: var(--lla-co-success);
}

.lla-co__timeline-dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
    z-index: 1;
}

.lla-co__timeline-step--done .lla-co__timeline-dot {
    background: var(--lla-co-success);
    color: #fff;
}

.lla-co__timeline-step--pending .lla-co__timeline-dot {
    background: var(--lla-co-border);
    color: var(--lla-co-text-light);
}

.lla-co__timeline-label {
    font-size: 14px;
    font-weight: 500;
    flex: 1;
}

.lla-co__timeline-step--done .lla-co__timeline-label {
    color: var(--lla-co-success);
}

.lla-co__timeline-step--pending .lla-co__timeline-label {
    color: var(--lla-co-text-light);
}

.lla-co__timeline-date {
    font-size: 12px;
    color: var(--lla-co-text-light);
}

/* Tracking info inside timeline step */
.lla-co__timeline-tracking {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    margin-top: 6px;
    padding: 10px 14px;
    background: var(--lla-co-bg, #faf8f5);
    border: 1px solid var(--lla-co-border, #f0e6d3);
    border-radius: var(--lla-co-radius-sm, 8px);
    font-size: 13px;
}

.lla-co__timeline-tracking-carrier {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--lla-co-text);
    font-weight: 500;
}

.lla-co__timeline-tracking-carrier svg {
    color: var(--lla-co-primary);
    flex-shrink: 0;
}

.lla-co__timeline-tracking-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--lla-co-primary);
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
    transition: color 0.2s;
}

.lla-co__timeline-tracking-link:hover {
    color: var(--lla-co-primary-dark);
    text-decoration: underline;
}

/* Review CTA section (view-order) */
body .lla-co .lla-co__conf-reviews {
    margin-top: 24px !important;
}

body .lla-co .lla-co__review-cards {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

body .lla-co a.lla-co__review-card,
body .lla-co a.lla-co__review-card:visited,
body.elementor-page .lla-co a.lla-co__review-card {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 14px 16px !important;
    background: #fff !important;
    border: 1.5px solid #f0e6d3 !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    color: var(--lla-co-text, #1f2937) !important;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.1s !important;
    cursor: pointer !important;
}

body .lla-co a.lla-co__review-card:hover {
    border-color: var(--lla-co-primary, #D79942) !important;
    box-shadow: 0 2px 8px rgba(215, 153, 66, 0.12) !important;
    transform: translateY(-1px) !important;
}

body .lla-co .lla-co__review-card-visual {
    flex-shrink: 0 !important;
    width: 52px !important;
    height: 52px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: #faf8f5 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body .lla-co .lla-co__review-card-visual img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

body .lla-co .lla-co__review-card-avatar {
    border-radius: 50% !important;
    background: linear-gradient(135deg, #FEF7EC 0%, #FDF2E3 100%) !important;
    border: 1.5px solid #E7D5C8 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--lla-co-primary, #D79942) !important;
}

body .lla-co .lla-co__review-card-content {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

body .lla-co .lla-co__review-card-label {
    font-size: 11.5px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: #9ca3af !important;
}

body .lla-co .lla-co__review-card-name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--lla-co-text, #1f2937) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body .lla-co .lla-co__review-card-stars {
    display: flex !important;
    gap: 2px !important;
    margin-top: 2px !important;
}

body .lla-co .lla-co__review-card-stars svg {
    color: #e0d5c8 !important;
    transition: color 0.2s !important;
}

body .lla-co a.lla-co__review-card:hover .lla-co__review-card-stars svg {
    color: var(--lla-co-primary, #D79942) !important;
}

body .lla-co .lla-co__review-card-arrow {
    flex-shrink: 0 !important;
    font-size: 18px !important;
    font-weight: 300 !important;
    color: #9ca3af !important;
    transition: color 0.2s, transform 0.2s !important;
}

body .lla-co a.lla-co__review-card:hover .lla-co__review-card-arrow {
    color: var(--lla-co-primary, #D79942) !important;
    transform: translateX(3px) !important;
}

/* Confirmation items */
.lla-co__conf-items {
    margin-bottom: 24px;
}

.lla-co__conf-item {
    display: grid;
    grid-template-columns: 64px 1fr auto;
    gap: 12px;
    padding: 12px 16px;
    align-items: center;
    border-bottom: 1px solid var(--lla-co-border-light);
}

.lla-co__conf-item:last-child {
    border-bottom: none;
}

.lla-co__conf-item-img {
    border-radius: var(--lla-co-radius-sm);
    overflow: hidden;
    aspect-ratio: 1;
    background: var(--lla-co-bg);
}

.lla-co__conf-item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lla-co__conf-item-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--lla-co-border);
}

.lla-co__conf-item-name {
    font-size: 14px;
    font-weight: 500;
    margin: 0;
}

.lla-co__conf-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    margin-top: 2px;
}

.lla-co__conf-item-variant {
    font-size: 12px;
    color: var(--lla-co-text-muted);
}

.lla-co__conf-item-qty {
    font-size: 12px;
    color: var(--lla-co-text-light);
}

.lla-co__conf-item-price {
    font-size: 15px;
    font-weight: 600;
}

.lla-co__conf-item-variant strong {
    font-weight: 600;
    color: var(--lla-co-text);
}

/* Qty badge overlay on confirmation product image */
.lla-co__conf-item-img {
    position: relative;
}

.lla-co__conf-item-qty-badge {
    position: absolute;
    top: -6px;
    right: -6px;
    background: var(--lla-co-primary);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    min-width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    padding: 0 4px;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,.15);
}

/* Confirmation vendor group specific */
.lla-co__conf-vendor-group {
    margin-bottom: 16px;
}

.lla-co__conf-vendor-group:last-child {
    margin-bottom: 0;
}

/* ── Confirmation Shipping Method ── */
.lla-co__conf-shipping {
    margin-top: 20px;
}

.lla-co__conf-shipping-method {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--lla-co-bg);
    border: 1px solid var(--lla-co-border-light);
    border-radius: var(--lla-co-radius-md);
    margin-bottom: 8px;
}

.lla-co__conf-shipping-method svg {
    flex-shrink: 0;
    color: var(--lla-co-primary);
}

.lla-co__conf-shipping-detail {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex: 1;
    gap: 12px;
}

.lla-co__conf-shipping-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--lla-co-text);
}

.lla-co__conf-shipping-cost {
    font-size: 14px;
    font-weight: 600;
    color: var(--lla-co-primary);
    white-space: nowrap;
}

/* ── Cart item addons (gravure etc.) ── */
.lla-co__item-addons {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 4px;
}

.lla-co__item-addon {
    display: flex;
    align-items: baseline;
    gap: 6px;
    font-size: 12px;
    color: var(--lla-co-text-muted);
    line-height: 1.4;
}

.lla-co__item-addon strong {
    font-weight: 600;
    color: var(--lla-co-text-light);
}

.lla-co__addon-price {
    font-size: 11px;
    color: var(--lla-co-primary);
    font-weight: 500;
    white-space: nowrap;
}

/* Sidebar details */
.lla-co__conf-payment-method,
.lla-co__conf-address {
    margin-bottom: 14px;
}

.lla-co__conf-detail-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lla-co-text-light);
    margin-bottom: 4px;
}

.lla-co__conf-detail-value {
    font-size: 14px;
    color: var(--lla-co-text);
    font-style: normal;
}

.lla-co__separator {
    border: none;
    border-top: 1px solid var(--lla-co-border-light);
    margin: 16px 0;
}

/* Continue shopping */
.lla-co__continue-shopping {
    display: block;
    text-align: center;
    font-size: 13px;
    color: var(--lla-co-primary);
    margin-top: 12px;
}

/* Social sharing */
.lla-co__conf-share {
    margin-top: 32px;
    padding: 24px;
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-lg);
    text-align: center;
}

.lla-co__conf-share-desc {
    font-size: 14px;
    color: var(--lla-co-text-muted);
    margin: 0 0 16px;
}

.lla-co__conf-share-btns {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

.lla-co__share-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: var(--lla-co-radius-sm);
    font-size: 13px;
    font-weight: 500;
    border: 1px solid var(--lla-co-border);
    background: var(--lla-co-surface);
    color: var(--lla-co-text);
    cursor: pointer;
    transition: all var(--lla-co-transition);
    text-decoration: none;
    font-family: var(--lla-co-font);
}

.lla-co__share-btn:hover {
    border-color: var(--lla-co-primary);
    color: var(--lla-co-primary);
}

/* Newsletter CTA */
.lla-co__conf-newsletter {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 32px 24px;
    margin-top: 32px;
    background: var(--lla-co-secondary);
    color: #fff;
    border-radius: var(--lla-co-radius-lg);
    text-align: center;
}

@media (min-width: 640px) {
    .lla-co__conf-newsletter {
        flex-direction: row;
        text-align: left;
    }
}

.lla-co__conf-newsletter-content h3 {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 4px;
}

.lla-co__conf-newsletter-content p {
    font-size: 14px;
    margin: 0;
    opacity: 0.8;
}

.lla-co__conf-newsletter-form {
    display: flex;
    gap: 8px;
    width: 100%;
    max-width: 360px;
}

.lla-co__conf-newsletter-form input {
    flex: 1;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: var(--lla-co-radius-sm);
    padding: 10px 14px;
    font-size: 14px;
    background: rgba(255,255,255,0.1);
    color: #fff;
    font-family: var(--lla-co-font);
}

.lla-co__conf-newsletter-form input::placeholder {
    color: rgba(255,255,255,0.5);
}

.lla-co__conf-newsletter-form input:focus {
    outline: none;
    border-color: var(--lla-co-primary);
}

/* ═══════════════════════════════════════════════
   11. UPSELL GRID — Clone exact de content-product.php du connecteur
   Structure: Image → Vendeur → Titre → Badges → Prix → Actions (Wishlist + Bouton)
   ═══════════════════════════════════════════════ */
.lla-co__upsells {
    margin-top: 32px;
    padding: 24px;
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-lg);
}

.lla-co__upsells-title {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 16px;
    color: var(--lla-co-secondary);
}

/* Grid layout */
.lla-co__upsell-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

@media (min-width: 640px) {
    .lla-co__upsell-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1024px) {
    .lla-co__upsell-grid--4 {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 480px) {
    .lla-co__upsell-grid {
        gap: 12px;
    }
}

/* Card — miroir de .lla-card-inner */
.lla-co__upsell-card {
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    height: 100%;
}

.lla-co__upsell-card:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    transform: translateY(-4px);
}

/* Image — miroir de .lla-card-image-wrapper (PAS de badge sur l'image) */
.lla-co__upsell-img-link {
    display: block;
    text-decoration: none;
}

.lla-co__upsell-img {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    background: #f9fafb;
}

.lla-co__upsell-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.lla-co__upsell-card:hover .lla-co__upsell-img img {
    transform: scale(1.05);
}

.lla-co__upsell-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--lla-co-border);
}

/* Content — miroir de .lla-card-content */
.lla-co__upsell-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    flex: 1;
}

/* Vendeur — miroir de .lla-card-vendor (1re ligne) */
.lla-co__upsell-vendor {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #6b7280;
}

.lla-co__upsell-vendor-label {
    color: #9ca3af;
}

.lla-co__upsell-vendor-link {
    color: var(--lla-co-primary);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.lla-co__upsell-vendor-link:hover {
    color: var(--lla-co-primary-dark);
    text-decoration: underline;
}

.lla-co__upsell-vendor-name {
    font-weight: 500;
    color: #1f2937;
}

/* Titre — miroir de .lla-card-title */
.lla-co__upsell-title {
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    color: #1f2937;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.lla-co__upsell-title a {
    color: inherit;
    text-decoration: none;
}

.lla-co__upsell-title a:hover {
    color: var(--lla-co-primary);
}

/* Badges — miroir de .lla-card-badges (SOUS le titre) */
.lla-co__upsell-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.lla-co__upsell-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 4px;
    letter-spacing: 0.02em;
    color: #fff;
}

.lla-co__upsell-badge--sale {
    background: #dc2626;
}

.lla-co__upsell-badge--new {
    background: #059669;
}

.lla-co__upsell-badge--featured {
    background: #f59e0b;
}

.lla-co__upsell-badge--promo {
    background: #EF4444;
}

/* Prix — miroir de .lla-card-price */
.lla-co__upsell-price {
    font-size: 16px;
    font-weight: 700;
    color: #1f2937;
    margin-top: auto;
}

.lla-co__upsell-price del {
    font-size: 13px;
    color: #9ca3af;
    font-weight: 400;
    text-decoration: line-through;
    margin-left: 6px;
}

.lla-co__upsell-price ins {
    text-decoration: none;
    color: #dc2626;
}

/* Actions — miroir de .lla-card-actions (wishlist + bouton) */
.lla-co__upsell-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 8px;
    padding-top: 12px;
    border-top: 1px solid #e5e7eb;
}

/* Wishlist — miroir de .lla-wishlist-btn */
.lla-co__upsell-wishlist {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid #e5e7eb;
    border-radius: 50%;
    background: #fff;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.lla-co__upsell-wishlist:hover {
    border-color: #dc2626;
    color: #dc2626;
    background: #fef2f2;
}

.lla-co__upsell-wishlist.is-active,
.lla-co__upsell-wishlist.in-wishlist {
    border-color: #dc2626;
    background: #dc2626;
    color: #fff;
}

.lla-co__upsell-wishlist.is-active .lla-heart-icon,
.lla-co__upsell-wishlist.in-wishlist .lla-heart-icon {
    fill: currentColor;
}

/* Bouton "Ajouter" — miroir de .lla-add-to-cart-btn */
.lla-co__upsell-cart-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    background: var(--lla-co-primary);
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--lla-co-font);
    text-decoration: none;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.lla-co__upsell-cart-btn:hover {
    background: var(--lla-co-primary-dark);
    color: #ffffff;
}

/* Bouton "Voir options" — miroir de .lla-view-product */
.lla-co__upsell-cart-btn--link {
    background: transparent;
    border: 1px solid #f59e0b;
    color: #f59e0b;
}

.lla-co__upsell-cart-btn--link:hover {
    background: #f59e0b;
    color: #ffffff;
}

/* Rupture */
.lla-co__upsell-out-of-stock {
    flex: 1;
    text-align: center;
    padding: 10px;
    font-size: 13px;
    font-weight: 500;
    color: #9ca3af;
    background: #f3f4f6;
    border-radius: 8px;
}

/* Responsive mobile: cacher texte bouton, montrer icône */
@media (max-width: 768px) {
    .lla-co__upsell-content {
        padding: 10px;
    }

    .lla-co__upsell-title {
        font-size: 13px;
    }

    .lla-co__upsell-price {
        font-size: 15px;
    }

    .lla-co__upsell-cart-btn {
        padding: 8px 12px;
        font-size: 12px;
    }

    .lla-co__upsell-wishlist {
        width: 36px;
        height: 36px;
    }
}

/* ═══════════════════════════════════════════════
   12. PAYMENT ICONS
   ═══════════════════════════════════════════════ */
.lla-co__payment-icons {
    display: flex;
    gap: 6px;
    justify-content: center;
    padding: 12px 0;
    flex-wrap: wrap;
}

.lla-co__payment-icon {
    display: inline-block;
    opacity: 0.7;
    transition: opacity var(--lla-co-transition);
}

.lla-co__payment-icon:hover {
    opacity: 1;
}

/* ═══════════════════════════════════════════════
   13. MOBILE STICKY BAR
   ═══════════════════════════════════════════════ */
.lla-co__mobile-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    background: var(--lla-co-surface);
    padding: 12px 16px;
    border-top: 1px solid var(--lla-co-border);
    box-shadow: 0 -4px 16px rgba(0,0,0,0.08);
    transform: translateY(100%);
    transition: transform 0.3s;
}

.lla-co__mobile-bar--visible {
    transform: translateY(0);
}

@media (min-width: 768px) {
    .lla-co__mobile-bar {
        display: none;
    }
}

.lla-co__mobile-bar-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lla-co__mobile-bar-count,
.lla-co__mobile-bar-label {
    font-size: 12px;
    color: var(--lla-co-text-muted);
}

.lla-co__mobile-bar-total {
    font-size: 18px;
    font-weight: 700;
    color: var(--lla-co-text);
}

.lla-co__mobile-bar-btn {
    flex-shrink: 0;
    padding: 12px 20px;
    font-size: 15px;
}

/* ═══════════════════════════════════════════════
   14. EMPTY CART
   ═══════════════════════════════════════════════ */
.lla-co__empty {
    text-align: center;
    padding: 60px 20px;
    max-width: 400px;
    margin: 0 auto;
}

.lla-co__empty-icon {
    margin-bottom: 16px;
    color: var(--lla-co-border);
}

.lla-co__empty h2 {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--lla-co-secondary);
}

.lla-co__empty p {
    font-size: 15px;
    color: var(--lla-co-text-muted);
    margin: 0 0 24px;
}

/* ═══════════════════════════════════════════════
   15. UTILITIES
   ═══════════════════════════════════════════════ */
.lla-co__trust-signal {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--lla-co-text-muted);
    margin-top: 10px;
    justify-content: center;
}

.lla-co__loading {
    opacity: 0.5;
    pointer-events: none;
}

/* Screen reader only */
.lla-co__sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Spinner */
.lla-co__spinner {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid var(--lla-co-border);
    border-top-color: var(--lla-co-primary);
    border-radius: 50%;
    animation: lla-co-spin 0.6s linear infinite;
}

@keyframes lla-co-spin {
    to { transform: rotate(360deg); }
}

/* Toast notification */
.lla-co__toast {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: var(--lla-co-secondary);
    color: #fff;
    padding: 12px 20px;
    border-radius: var(--lla-co-radius-md);
    font-size: 14px;
    font-weight: 500;
    z-index: 10000;
    opacity: 0;
    transition: all 0.3s;
    box-shadow: var(--lla-co-shadow-lg);
    pointer-events: none;
}

.lla-co__toast--visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ═══════════════════════════════════════════════
   16. WC NATIVE OVERRIDES — Hide/fix leaking WC elements
   ═══════════════════════════════════════════════ */

/*
 * Hide WC's native order review entirely — we have our own sidebar.
 * display:none is the ONLY reliable approach. sr-only fails because
 * child elements (shipping radios, relay popups) can escape clipping
 * via their own position/overflow CSS.
 * display:none is safe because:
 * - jQuery .html()/.replaceWith() still works on display:none elements
 * - MutationObserver fires regardless of CSS display state
 * - DOM queries (querySelector, textContent) still work
 * Using !important to override any WC/theme/payment-gateway CSS.
 */
.lla-co__checkout #order_review,
.lla-co__checkout #order_review.woocommerce-checkout-review-order,
.lla-co__checkout > .woocommerce-checkout-review-order {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/*
 * Prevent relay popup or other positioned elements from escaping #order_review.
 * Use contain: strict instead of display:none on children — display:none on
 * individual elements breaks WC's internal jQuery operations on them.
 * The parent's display:none already hides everything visually.
 */
.lla-co__checkout #order_review *,
.lla-co__checkout #order_review.woocommerce-checkout-review-order * {
    pointer-events: none !important;
}

/*
 * Relay point picker (lla-checkout-shipping) — protect from Elementor/theme resets.
 * These styles reinforce the relay plugin's own CSS with higher specificity.
 */
.lla-co__checkout .lla-relay-selector {
    margin: 12px 0 6px 28px;
    border: 1px solid #F0EBE6;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    overflow: hidden;
}

.lla-co__checkout .lla-relay-search {
    display: flex;
    gap: 8px;
    padding: 0 16px 14px;
}

.lla-co__checkout .lla-relay-zip-input {
    flex: 1;
    min-width: 0;
    padding: 9px 12px !important;
    border: 1.5px solid #F0EBE6 !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    color: #30251D !important;
    background: #F7F5F3 !important;
    height: auto !important;
    margin: 0 !important;
}

.lla-co__checkout .lla-relay-zip-input:focus {
    border-color: #D79942 !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(215,153,66,0.12) !important;
}

.lla-co__checkout .lla-relay-search-btn {
    padding: 9px 18px !important;
    background: #D79942 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    white-space: nowrap;
    line-height: 1.4;
    letter-spacing: 0.01em;
    text-transform: none !important;
    box-shadow: none !important;
    min-height: auto !important;
    height: auto !important;
    width: auto !important;
}

.lla-co__checkout .lla-relay-search-btn:hover {
    background: #C88835 !important;
}

.lla-co__checkout .lla-relay-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px 10px;
    font-size: 13.5px;
    font-weight: 600;
    color: #30251D;
}

/*
 * WC "Avez-vous un code promo ?" — style it nicely
 * instead of letting it look random.
 */
/* Hide WC native coupon from top of page — moved to sidebar */
.lla-co__checkout .woocommerce-form-coupon-toggle,
.lla-co__checkout > .checkout_coupon,
.lla-co .woocommerce-form-coupon-toggle,
.lla-co > .checkout_coupon {
    display: none !important;
}

/* Hide WC duplicate titles and unnecessary elements */
.lla-co .woocommerce-billing-fields > h3,
.lla-co .woocommerce-shipping-fields > h3,
.lla-co .woocommerce-additional-fields {
    display: none !important;
}

/* Hide newsletter checkbox on checkout (Hostinger plugin) */
.lla-co__checkout .hostinger-reach-optin,
.lla-co .hostinger-reach-optin {
    display: none !important;
}

/* Coupon in sidebar */
.lla-co__sidebar-coupon {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--lla-co-border, #f0e6d3);
}
body .lla-co button.lla-co__sidebar-coupon-toggle {
    font-size: 13px !important;
    color: #6b7280 !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    gap: 4px;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    font-family: inherit;
    border-radius: 0 !important;
    white-space: normal !important;
}
body .lla-co button.lla-co__sidebar-coupon-toggle:hover { color: #374151 !important; }
body .lla-co .lla-co__sidebar-coupon-form {
    display: none;
    margin-top: 8px;
}
body .lla-co .lla-co__sidebar-coupon-form.is-open {
    display: flex !important;
    gap: 6px;
}
body .lla-co .lla-co__sidebar-coupon-form input {
    flex: 1;
    padding: 8px 10px !important;
    font-size: 13px !important;
    border: 1px solid var(--lla-co-border, #e5e7eb) !important;
    border-radius: 6px !important;
    font-family: inherit;
    background: #fff !important;
    color: #333 !important;
}
body .lla-co .lla-co__sidebar-coupon-form button {
    padding: 8px 14px !important;
    font-size: 13px !important;
    font-weight: 600;
    background: var(--lla-co-primary, #D79942) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer;
    font-family: inherit;
    white-space: nowrap;
}
body .lla-co .lla-co__sidebar-coupon-form button:hover { opacity: 0.9; }

.lla-co__checkout .woocommerce-form-coupon-toggle {
    margin-bottom: 16px;
}

.lla-co__checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-md);
    padding: 12px 16px;
    font-size: 14px;
    color: var(--lla-co-text-muted);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.lla-co__checkout .woocommerce-form-coupon-toggle .woocommerce-info::before {
    content: none;
    display: none;
}

.lla-co__checkout .woocommerce-form-coupon-toggle .woocommerce-info a {
    color: var(--lla-co-primary);
    font-weight: 500;
    text-decoration: none;
}

.lla-co__checkout .woocommerce-form-coupon-toggle .woocommerce-info a:hover {
    text-decoration: underline;
}

/* WC coupon form (expanded) */
.lla-co__checkout .checkout_coupon {
    background: var(--lla-co-surface);
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-md);
    padding: 16px;
    margin-bottom: 16px;
    display: flex;
    gap: 8px;
    align-items: flex-end;
}

.lla-co__checkout .checkout_coupon p {
    margin: 0;
}

.lla-co__checkout .checkout_coupon .input-text {
    border: 1px solid var(--lla-co-border);
    border-radius: var(--lla-co-radius-sm);
    padding: 10px 14px;
    font-size: 14px;
    font-family: var(--lla-co-font);
    width: 100%;
}

.lla-co__checkout .checkout_coupon .button {
    background: var(--lla-co-primary);
    color: #fff;
    border: none;
    border-radius: var(--lla-co-radius-sm);
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 600;
    font-family: var(--lla-co-font);
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--lla-co-transition);
}

.lla-co__checkout .checkout_coupon .button:hover {
    background: var(--lla-co-primary-dark);
}

/* WC notices inside checkout */
.lla-co__checkout .woocommerce-error,
.lla-co__checkout .woocommerce-message,
.lla-co__checkout .woocommerce-info {
    border-radius: var(--lla-co-radius-md);
    padding: 12px 16px;
    margin-bottom: 16px;
    font-size: 14px;
    list-style: none;
}

.lla-co__checkout .woocommerce-error {
    background: var(--lla-co-error-bg);
    border: 1px solid var(--lla-co-error);
    color: var(--lla-co-error);
}

.lla-co__checkout .woocommerce-message {
    background: var(--lla-co-success-bg);
    border: 1px solid var(--lla-co-success);
    color: #166534;
}

/* WC privacy policy text */
.lla-co__checkout .woocommerce-privacy-policy-text {
    font-size: 12px;
    color: var(--lla-co-text-light);
    margin-top: 12px;
}

.lla-co__checkout .woocommerce-privacy-policy-text a {
    color: var(--lla-co-primary);
}

/* Terms & conditions checkbox */
.lla-co__checkout .woocommerce-terms-and-conditions-wrapper {
    font-size: 13px;
    color: var(--lla-co-text-muted);
    margin-top: 12px;
}

.lla-co__checkout .woocommerce-terms-and-conditions-wrapper a {
    color: var(--lla-co-primary);
}

/* ═══════════════════════════════════════════════
   17. CHECKOUT SIDEBAR — RESPONSIVE
   ═══════════════════════════════════════════════ */

/* Sidebar "Votre commande" colored title */
.lla-co__checkout .lla-co__summary-title {
    color: var(--lla-co-primary);
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 16px;
}

/* Shipping updating state */
.lla-co__summary-row[data-updating] span:last-child,
[data-co-shipping-pkg][data-updating] span:last-child {
    opacity: 0.5;
    transition: opacity 0.2s;
}

/* Per-vendor shipping rows */
.lla-co__summary-row--shipping-vendor {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    color: var(--lla-co-text-muted);
    padding: 2px 0;
}

.lla-co__shipping-vendor-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--lla-co-text-muted);
}

.lla-co__shipping-icon {
    flex-shrink: 0;
    color: var(--lla-co-text-light);
    width: 14px;
    height: 14px;
}

/* Free badge in sidebar */
.lla-co__summary-value--free {
    color: var(--lla-co-success);
    font-weight: 600;
}

/* ═══════════════════════════════════════════════
   18. PRINT
   ═══════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════
   RESPONSIVE — Mobile-first overrides
   ═══════════════════════════════════════════════ */

/* ── Extra-small screens (< 400px) ── */
@media (max-width: 399px) {
    .lla-co__item {
        grid-template-columns: 64px 1fr auto;
        gap: 10px;
        padding: 12px 12px;
    }

    .lla-co__item-name {
        font-size: 13px;
    }

    .lla-co__item-price {
        font-size: 14px;
    }

    .lla-co__vendor-header {
        padding: 10px 12px;
    }

    .lla-co__vendor-delivery {
        padding: 8px 12px;
        font-size: 12px;
    }

    .lla-co__conf-newsletter-form {
        flex-direction: column;
    }

    .lla-co__conf-newsletter-form input,
    .lla-co__conf-newsletter-form button {
        width: 100%;
    }

    .lla-co__section-header {
        padding: 14px 14px;
        gap: 10px;
    }

    .lla-co__section-body {
        padding: 0 14px;
    }

    .lla-co__section--open .lla-co__section-body {
        padding: 0 14px 14px;
    }

    .lla-co__step-sep {
        width: 24px;
    }

    .lla-co__step-link,
    .lla-co__step-span {
        padding: 6px 8px;
    }
}

/* ── Small screens (< 640px) ── */
@media (max-width: 639px) {
    /* Confirmation hero */
    .lla-co__conf-hero {
        padding: 24px 16px 20px;
    }

    .lla-co__conf-hero-icon svg {
        width: 48px;
        height: 48px;
    }

    .lla-co__conf-title {
        font-size: 22px;
    }

    .lla-co__conf-subtitle {
        font-size: 13px;
    }

    .lla-co__conf-delivery {
        font-size: 12px;
        padding: 8px 14px;
    }

    /* Confirmation timeline */
    .lla-co__conf-timeline {
        padding: 16px;
        margin-bottom: 20px;
    }

    /* Confirmation items */
    .lla-co__conf-item {
        grid-template-columns: 50px 1fr auto;
        gap: 10px;
        padding: 10px 12px;
    }

    .lla-co__conf-item-name {
        font-size: 13px;
    }

    .lla-co__conf-item-price {
        font-size: 13px;
    }

    .lla-co__conf-item-meta {
        gap: 2px 8px;
    }

    .lla-co__conf-item-variant {
        font-size: 11px;
    }

    /* Confirmation shipping method */
    .lla-co__conf-shipping-method {
        padding: 10px 12px;
        gap: 10px;
    }

    .lla-co__conf-shipping-name {
        font-size: 13px;
    }

    .lla-co__conf-shipping-cost {
        font-size: 13px;
    }

    /* Social sharing */
    .lla-co__conf-share {
        padding: 16px;
        margin-top: 20px;
    }

    .lla-co__conf-share-btns {
        flex-direction: column;
        align-items: stretch;
    }

    .lla-co__share-btn {
        justify-content: center;
    }

    /* Sidebar card */
    .lla-co__summary,
    .lla-co__conf-sidebar-card {
        padding: 16px;
    }

    .lla-co__summary-total {
        font-size: 16px;
    }

    .lla-co__total-amount {
        font-size: 19px;
    }

    /* Newsletter */
    .lla-co__conf-newsletter {
        padding: 20px 16px;
        margin-top: 20px;
    }

    .lla-co__conf-newsletter-content h3 {
        font-size: 16px;
    }

    /* Upsell grid */
    .lla-co__upsells {
        padding: 16px;
        margin-top: 20px;
    }

    /* Recommendations */
    .lla-co__conf-reco {
        padding: 0 4px;
        margin-top: 20px;
    }

    .lla-co__conf-section-title {
        font-size: 16px;
    }

    /* Section number badge */
    .lla-co__section-number {
        width: 26px;
        height: 26px;
        font-size: 12px;
    }

    /* Progress bar */
    .lla-co__progress {
        padding: 16px 12px;
    }

    .lla-co__step-number {
        width: 24px;
        height: 24px;
        font-size: 12px;
    }
}

/* ── Medium screens (640px–767px) ── */
@media (min-width: 640px) and (max-width: 767px) {
    .lla-co__conf-title {
        font-size: 26px;
    }

    .lla-co__conf-hero {
        padding: 32px 20px 24px;
    }
}

/* ═══════════════════════════════════════════════
   18. SIDEBAR IMPROVEMENTS
   ═══════════════════════════════════════════════ */
.lla-co__summary-count { font-size: 13px; font-weight: 400; color: #9ca3af; margin-left: 8px; }
.lla-co__mini-item-vendor { display: block; font-size: 12px; color: #9ca3af; margin-top: 2px; }
/* Quantity badge on image — Shopify style */
.lla-co .lla-co__mini-item-img {
    position: relative;
    overflow: visible !important;
    flex-shrink: 0;
}
.lla-co .lla-co__mini-item-qty-badge {
    position: absolute;
    top: -8px;
    right: -8px;
    min-width: 22px;
    height: 22px;
    background: #374151;
    color: #fff;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0 5px;
    z-index: 10;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.lla-co__trust-inline { display: flex; justify-content: center; gap: 6px; padding: 14px 0 4px; margin-top: 14px; border-top: 1px solid var(--lla-co-border, #f0e6d3); flex-wrap: wrap; }
.lla-co__trust-inline span { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: #6b7280; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 20px; padding: 4px 10px; white-space: nowrap; }
.lla-co .lla-co__separator { border: none; border-top: 1px solid var(--lla-co-border, #f0e6d3); margin: 16px 0; }
.lla-co__summary-value--muted { color: #d1d5db; font-style: italic; }
.lla-co__upsells-title { font-size: 16px; font-weight: 700; margin: 0 0 16px; }
.lla-co__upsells-title::before { content: "✨ "; }

/* Simple section header (no toggle, always visible) */
.lla-co__section-header-simple {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-top: 8px;
}
.lla-co__section-header-simple .lla-co__section-number {
    width: 28px; height: 28px; border-radius: 50%;
    background: var(--lla-co-primary, #D79942); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 600; font-size: 13px; flex-shrink: 0;
}
.lla-co__section-title-text {
    font-size: 16px; font-weight: 600; color: #1f2937; margin: 0;
}

/* Sections always visible — with padding and separator */
@media (max-width: 768px) {
    .lla-co__section--no-toggle {
        padding: 16px !important;
    }
}

/* ═══════════════════════════════════════════════
   19. PRINT
   ═══════════════════════════════════════════════ */
@media print {
    .lla-co__mobile-bar,
    .lla-co__progress,
    .lla-co__free-shipping,
    .lla-co__upsells,
    .lla-co__conf-share,
    .lla-co__conf-newsletter,
    .lla-co__conf-reco {
        display: none;
    }

    .lla-co {
        background: #fff;
    }

    .lla-co__grid {
        display: block;
    }
}