/* ============================================================
 * SPIZZ CHECKOUT V2 — Mockup CSS
 * Inspireret af Kokken & Jomfru, men i Spizz-brand
 * ============================================================ */

:root {
    --cov2-rd: #5a1a1a;
    --cov2-rd-dark: #3d0d0d;
    --cov2-gd: #a8823a;
    --cov2-cr: #f7f3eb;
    --cov2-cr-dk: #eee7d7;
    --cov2-dk: #2d2d2d;
    --cov2-md: #5a5a5a;
    --cov2-lt: #ffffff;
    --cov2-br: #e7dfd0;
    --cov2-success: #2d7d3b;
    --cov2-radius: 10px;
    --cov2-radius-lg: 14px;
    --cov2-shadow: 0 1px 3px rgba(0,0,0,.04), 0 10px 30px rgba(0,0,0,.06);
}

/* === Page === */
.spz-cov2-page {
    background: var(--cov2-cr);
    min-height: 80vh;
    padding: 40px 0 80px;
    font-family: "Inter", "Poppins", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--cov2-dk);
    line-height: 1.5;
    /* Bruger overflow-x: clip (ikke hidden) saa position:sticky paa sidebar virker.
       clip = klipper uden at lave scroll-container. */
    overflow-x: clip;
    max-width: 100vw;
    box-sizing: border-box;
}
/* Fallback for browsers der ikke supporterer overflow:clip — anvend kun paa narrow mobile */
@supports not (overflow: clip) {
    @media (max-width: 600px) {
        .spz-cov2-page { overflow-x: hidden; }
    }
}
.spz-cov2-container {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 32px;
    align-items: start;
    width: 100%;
    box-sizing: border-box;
}
/* Box-sizing på ALLE checkout-elementer */
.spz-cov2-page *,
.spz-cov2-page *::before,
.spz-cov2-page *::after {
    box-sizing: border-box;
}
@media (max-width: 960px) {
    .spz-cov2-container { grid-template-columns: 1fr; }
}

/* === Title === */
.spz-cov2-title {
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.8rem, 3.2vw, 2.4rem);
    font-weight: 600;
    color: var(--cov2-dk);
    margin: 0 0 8px;
    letter-spacing: -.01em;
}
.spz-cov2-subtitle {
    color: var(--cov2-md);
    margin: 0 0 28px;
    font-size: 1rem;
}

/* === Section card === */
.spz-cov2-section {
    background: var(--cov2-lt);
    border-radius: var(--cov2-radius-lg);
    padding: 0;
    margin-bottom: 16px;
    box-shadow: var(--cov2-shadow);
    overflow: hidden;
    border: 1px solid var(--cov2-br);
}
.spz-cov2-section-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 24px;
    border-bottom: 1px solid var(--cov2-br);
    background: linear-gradient(180deg, #fff 0%, #fbf9f4 100%);
}
.spz-cov2-step {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--cov2-rd);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: "Playfair Display", serif;
    font-weight: 700;
    font-size: 14px;
    flex-shrink: 0;
}
.spz-cov2-section-head h2 {
    margin: 0;
    font-family: "Playfair Display", serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--cov2-dk);
}
.spz-cov2-section-body {
    padding: 22px 24px;
}

/* === Form fields === */
.spz-cov2-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}
.spz-cov2-row-3 {
    grid-template-columns: 1fr auto auto;
}
.spz-cov2-row:last-child { margin-bottom: 0; }

.spz-cov2-field {
    display: flex;
    flex-direction: column;
}
.spz-cov2-field.spz-cov2-grow { min-width: 0; }
.spz-cov2-field + .spz-cov2-field { margin-top: 0; }

.spz-cov2-field label {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cov2-md);
    margin-bottom: 6px;
    letter-spacing: 0.02em;
}
.spz-cov2-optional {
    color: #999;
    font-weight: 400;
    margin-left: 4px;
    font-size: 0.75rem;
}
.spz-cov2-field input[type="text"],
.spz-cov2-field input[type="email"],
.spz-cov2-field input[type="tel"],
.spz-cov2-field input[type="date"],
.spz-cov2-field input[type="number"],
.spz-cov2-field select,
.spz-cov2-field textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--cov2-br);
    border-radius: var(--cov2-radius);
    font-size: 0.95rem !important;
    font-family: inherit !important;
    color: #2d2d2d !important;
    background: #fff !important;
    transition: border-color .15s ease, box-shadow .15s ease;
    box-sizing: border-box;
    line-height: 1.4 !important;
    font-weight: 500 !important;
    appearance: auto;
    -webkit-appearance: auto;
    opacity: 1 !important;
}
/* Select-specifik: tving god kontrast og custom dropdown-pil */
.spz-cov2-field select {
    background-color: #fff !important;
    color: #2d2d2d !important;
    cursor: pointer;
    padding-right: 36px !important; /* plads til pil */
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%235a1a1a' stroke-width='1.5' fill='none' stroke-linecap='round'/></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 12px 8px !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}
/* Placeholder-option (når intet er valgt) */
.spz-cov2-field select option[value=""] {
    color: #6a6a6a;
}
.spz-cov2-field select option {
    color: #2d2d2d;
    background: #fff;
}
.spz-cov2-field input:focus,
.spz-cov2-field select:focus,
.spz-cov2-field textarea:focus {
    outline: none;
    border-color: var(--cov2-rd);
    box-shadow: 0 0 0 3px rgba(90, 26, 26, 0.12);
}
.spz-cov2-field input[readonly] {
    background: #f6f7f7;
    color: var(--cov2-md);
}
.spz-cov2-field textarea {
    resize: vertical;
    min-height: 60px;
}
.spz-cov2-hint {
    font-size: 0.78rem;
    color: var(--cov2-md);
    margin-top: 6px;
    line-height: 1.4;
}

.spz-cov2-section-body > .spz-cov2-field {
    margin-bottom: 14px;
}
.spz-cov2-section-body > .spz-cov2-field:last-child {
    margin-bottom: 0;
}

/* Mobile: row → stack */
@media (max-width: 600px) {
    .spz-cov2-row,
    .spz-cov2-row-3 {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

/* === Upsell-card === */
.spz-cov2-upsell {
    background: linear-gradient(135deg, #fff 0%, #faf6ed 100%);
    border: 2px solid var(--cov2-gd);
    padding: 0;
}
.spz-cov2-upsell-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 20px 24px;
    cursor: pointer;
    background: transparent;
}
.spz-cov2-upsell-card input[type="checkbox"] {
    width: 22px;
    height: 22px;
    margin: 0;
    margin-top: 4px;
    flex-shrink: 0;
    accent-color: var(--cov2-gd);
    cursor: pointer;
}
.spz-cov2-upsell-content {
    flex: 1;
}
.spz-cov2-upsell-title {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 6px;
}
.spz-cov2-upsell-title strong {
    font-family: "Playfair Display", serif;
    font-size: 1.1rem;
    color: var(--cov2-dk);
}
.spz-cov2-upsell-icon {
    font-size: 1.4rem;
}
.spz-cov2-upsell-price {
    background: var(--cov2-gd);
    color: #fff;
    padding: 3px 10px;
    border-radius: 50px;
    font-size: 0.78rem;
    font-weight: 600;
}
.spz-cov2-upsell-content p {
    margin: 0;
    color: var(--cov2-md);
    font-size: 0.9rem;
    line-height: 1.5;
}
.spz-cov2-upsell-link {
    display: inline-block;
    margin-left: 4px;
    color: var(--cov2-rd);
    text-decoration: underline;
    font-weight: 600;
    white-space: nowrap;
    transition: color .15s ease;
}
.spz-cov2-upsell-link:hover {
    color: var(--cov2-rd-dark);
    text-decoration: none;
}

/* === Payment options === */
.spz-cov2-payment-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.spz-cov2-payment {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    border: 1.5px solid var(--cov2-br);
    border-radius: var(--cov2-radius);
    cursor: pointer;
    transition: all .15s ease;
    background: #fff;
}
.spz-cov2-payment:has(input:checked) {
    border-color: var(--cov2-rd);
    background: #fbf6f6;
    box-shadow: 0 0 0 3px rgba(90, 26, 26, 0.08);
}
.spz-cov2-payment input[type="radio"] {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--cov2-rd);
    flex-shrink: 0;
}
.spz-cov2-payment-content {
    flex: 1;
}
.spz-cov2-payment-content strong {
    display: block;
    font-size: 1rem;
    color: var(--cov2-dk);
    margin-bottom: 2px;
}
.spz-cov2-payment-content small {
    color: var(--cov2-md);
    font-size: 0.82rem;
}
.spz-cov2-payment-logos {
    display: flex;
    gap: 6px;
    align-items: center;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--cov2-md);
}
.spz-cov2-payment-logos span {
    padding: 3px 7px;
    border: 1px solid var(--cov2-br);
    border-radius: 4px;
    background: #fff;
}

/* === Submit === */
.spz-cov2-submit-row {
    margin-top: 24px;
    padding: 0 4px;
}
.spz-cov2-submit-btn {
    width: 100%;
    background: var(--cov2-rd);
    color: #fff;
    border: none;
    padding: 18px 32px;
    border-radius: 50px;
    font-family: "Playfair Display", serif;
    font-size: 1.15rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: 0 8px 24px rgba(90, 26, 26, 0.25);
    transition: all .18s ease;
    letter-spacing: 0.01em;
}
.spz-cov2-submit-btn:hover {
    background: var(--cov2-rd-dark);
    transform: translateY(-1px);
    box-shadow: 0 12px 32px rgba(90, 26, 26, 0.35);
}
.spz-cov2-submit-arrow {
    font-size: 1.3rem;
    transition: transform .18s ease;
}
.spz-cov2-submit-btn:hover .spz-cov2-submit-arrow {
    transform: translateX(4px);
}
.spz-cov2-terms {
    text-align: center;
    color: var(--cov2-md);
    font-size: 0.82rem;
    margin: 14px 0 0;
}
.spz-cov2-terms a {
    color: var(--cov2-rd);
    text-decoration: underline;
}

/* === Sidebar === */
.spz-cov2-sidebar {
    position: sticky;
    position: -webkit-sticky; /* iOS Safari < 13 fallback */
    top: 110px; /* clear Woodmart's sticky-header (ca. 80-90px) + 20px margin */
    align-self: start; /* important: i grid skal sidebar ikke stretche fuld hojde */
    max-height: calc(100vh - 130px); /* hvis ordre-summary er meget lang */
    overflow-y: auto; /* scroll i sidebar hvis indhold er for langt */
}
.spz-cov2-sidebar-card {
    background: #fff;
    border-radius: var(--cov2-radius-lg);
    padding: 24px;
    border: 1px solid var(--cov2-br);
    box-shadow: var(--cov2-shadow);
}
.spz-cov2-sidebar-card h3 {
    margin: 0 0 18px;
    font-family: "Playfair Display", serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--cov2-dk);
}
.spz-cov2-order-item {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid var(--cov2-cr-dk);
    align-items: flex-start;
}
.spz-cov2-order-item:last-child { border-bottom: none; padding-bottom: 16px; }
.spz-cov2-order-name {
    flex: 1 1 0;
    min-width: 0;
    overflow-wrap: break-word; /* tillader break på lange ord men ikke 'anywhere' */
}
.spz-cov2-order-name strong {
    overflow-wrap: break-word; /* kun titlen må break'e — IKKE qty-controls */
}
.spz-cov2-order-name strong {
    display: block;
    font-size: 0.92rem;
    color: var(--cov2-dk);
    line-height: 1.3;
    margin-bottom: 2px;
}
.spz-cov2-order-name small {
    font-size: 0.78rem;
    color: var(--cov2-md);
    display: block;
}
.spz-cov2-order-price {
    font-weight: 600;
    color: var(--cov2-dk);
    white-space: nowrap;
    font-size: 0.92rem;
    flex-shrink: 0;
    text-align: right;
}
/* Per-item qty kontroller (± + input) — vises under produktnavn */
.spz-cov2-order-qty {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 6px;
    background: var(--cov2-cr, #f7f3eb);
    border-radius: 8px;
    padding: 2px 4px;
    white-space: nowrap; /* Forhindr "kuverter" eller "stk" i at wrap'e */
    word-break: normal; /* Override parent's break-word */
}
.spz-cov2-order-qty-btn {
    width: 28px;
    height: 28px;
    border: 1px solid var(--cov2-br, #e7dfd0);
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 600;
    color: var(--cov2-rd, #5a1a1a);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}
.spz-cov2-order-qty-btn:hover { background: var(--cov2-cr, #f7f3eb); }
.spz-cov2-order-qty-btn:active { transform: scale(0.95); }
.spz-cov2-order-qty-input {
    width: 38px;
    height: 28px;
    border: 1px solid var(--cov2-br, #e7dfd0);
    background: #fff;
    border-radius: 6px;
    text-align: center;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--cov2-dk, #2d2d2d);
    -moz-appearance: textfield;
    appearance: textfield;
}
.spz-cov2-order-qty-input::-webkit-outer-spin-button,
.spz-cov2-order-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.spz-cov2-order-qty-unit {
    font-size: 0.75rem;
    color: var(--cov2-md, #5a5a5a);
    margin-left: 4px;
    margin-right: 4px;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
    display: inline-block;
}
/* Højre side: pris + remove × */
.spz-cov2-order-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    flex-shrink: 0;
}
.spz-cov2-order-remove {
    width: 24px;
    height: 24px;
    border: none;
    background: transparent;
    color: var(--cov2-md, #5a5a5a);
    cursor: pointer;
    border-radius: 50%;
    font-size: 1.1rem;
    line-height: 1;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
}
.spz-cov2-order-remove:hover {
    background: #fdecea;
    color: #c44;
}
/* Loading state */
.spz-cov2-order-item.is-loading {
    opacity: 0.6;
    pointer-events: none;
}

/* "Levér til samme adresse som fakturaen" toggle (kun firma/offentlig) */
.spz-cov2-same-address-toggle {
    background: var(--cov2-cr, #f7f3eb);
    border: 1px solid var(--cov2-br, #e7dfd0);
    border-radius: 10px;
    padding: 14px 18px;
    margin-bottom: 20px;
}
.spz-cov2-same-address-label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    color: var(--cov2-dk, #2d2d2d);
    font-size: 0.95rem;
}
.spz-cov2-same-address-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    flex-shrink: 0;
    accent-color: var(--cov2-rd, #5a1a1a);
}
.spz-cov2-same-address-label strong {
    color: var(--cov2-rd, #5a1a1a);
    font-weight: 600;
}
.spz-cov2-same-address-toggle .spz-cov2-hint {
    color: var(--cov2-md, #5a5a5a);
    font-size: 0.85rem;
    margin-top: 8px;
    line-height: 1.5;
    padding-left: 28px;
}
.spz-cov2-same-address-toggle .spz-cov2-hint strong {
    color: var(--cov2-dk, #2d2d2d);
}

/* Faktura-adresse info-card (vises efter CVR-opslag) */
.spz-cov2-invoice-address {
    background: linear-gradient(135deg, #fef4e6 0%, #fcefd6 100%);
    border: 1px solid var(--cov2-gd, #a8823a);
    border-radius: 10px;
    padding: 14px 18px;
    margin: 14px 0;
}
.spz-cov2-invoice-label {
    display: flex;
    align-items: baseline;
    gap: 8px;
    color: var(--cov2-gd, #a8823a);
    font-size: 0.92rem;
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.spz-cov2-invoice-label strong {
    color: var(--cov2-rd, #5a1a1a);
}
.spz-cov2-invoice-address-display {
    color: var(--cov2-dk, #2d2d2d);
    font-weight: 600;
    font-size: 0.95rem;
}
.spz-cov2-order-line {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0;
    font-size: 0.9rem;
    color: var(--cov2-md);
}
.spz-cov2-order-line span:first-child {
    flex: 1 1 0;
    min-width: 0;
    overflow-wrap: anywhere;
}
.spz-cov2-order-line span:last-child {
    flex-shrink: 0;
    white-space: nowrap;
}
.spz-cov2-order-divider {
    height: 1px;
    background: var(--cov2-cr-dk);
    margin: 10px 0;
}
.spz-cov2-order-line {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    font-size: 0.9rem;
    color: var(--cov2-md);
}
.spz-cov2-order-total {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 14px 0 4px;
    margin-top: 6px;
    border-top: 2px solid var(--cov2-dk);
}
.spz-cov2-order-total span {
    font-family: "Playfair Display", serif;
    font-size: 1.05rem;
    color: var(--cov2-dk);
}
.spz-cov2-order-total strong {
    font-family: "Playfair Display", serif;
    font-size: 1.45rem;
    color: var(--cov2-rd);
    font-weight: 700;
}
.spz-cov2-order-promo {
    margin-top: 16px;
    padding: 12px 14px;
    background: linear-gradient(135deg, #fbf6f6 0%, #f7eded 100%);
    border-radius: var(--cov2-radius);
    font-size: 0.82rem;
    color: var(--cov2-dk);
    line-height: 1.5;
    border: 1px dashed var(--cov2-rd);
    display: flex;
    gap: 8px;
    align-items: flex-start;
}
.spz-cov2-order-promo-icon {
    font-size: 1.1rem;
    flex-shrink: 0;
}

/* === Trust strip under sidebar === */
.spz-cov2-sidebar-trust {
    display: flex;
    gap: 10px;
    margin-top: 14px;
}
.spz-cov2-trust-item {
    flex: 1;
    background: #fff;
    border: 1px solid var(--cov2-br);
    border-radius: var(--cov2-radius);
    padding: 12px;
    text-align: center;
    font-size: 0.78rem;
    box-shadow: var(--cov2-shadow);
}
.spz-cov2-trust-item span {
    display: block;
    font-weight: 700;
    color: var(--cov2-dk);
    font-size: 0.86rem;
    margin-bottom: 2px;
}
.spz-cov2-trust-item small {
    color: var(--cov2-md);
}

/* Mobile sidebar: gå under main, ikke sticky */
@media (max-width: 960px) {
    .spz-cov2-sidebar {
        position: static;
        order: -1;
        margin-bottom: 20px;
    }
    .spz-cov2-sidebar-card {
        padding: 18px;
    }
}

/* ============================================================
 * v0.2 ADDITIONS — Fulfillment, Tabs, Autocomplete, Calendar
 * ============================================================ */

/* === Fulfillment toggle (Levering / Afhentning) === */
.spz-cov2-fulfillment {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
@media (max-width: 600px) {
    .spz-cov2-fulfillment { grid-template-columns: 1fr; }
}
.spz-cov2-fulfillment-card {
    display: flex;
    gap: 16px;
    padding: 18px 20px;
    border: 2px solid var(--cov2-br);
    border-radius: var(--cov2-radius-lg);
    cursor: pointer;
    transition: all .15s ease;
    background: #fff;
    align-items: center;
    position: relative;
}
.spz-cov2-fulfillment-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.spz-cov2-fulfillment-card:hover {
    border-color: var(--cov2-rd);
    background: #fbf6f6;
}
.spz-cov2-fulfillment-card.is-selected {
    border-color: var(--cov2-rd);
    background: #fbf6f6;
    box-shadow: 0 0 0 4px rgba(90, 26, 26, 0.08);
}
.spz-cov2-fulfillment-card.is-selected::after {
    content: "✓";
    position: absolute;
    top: 10px;
    right: 14px;
    color: var(--cov2-rd);
    font-weight: 700;
    font-size: 1.1rem;
}
.spz-cov2-fulfillment-icon {
    font-size: 2.2rem;
    line-height: 1;
    flex-shrink: 0;
}
.spz-cov2-fulfillment-content {
    flex: 1;
    min-width: 0;
}
.spz-cov2-fulfillment-content strong {
    display: block;
    font-family: "Playfair Display", serif;
    font-size: 1.1rem;
    color: var(--cov2-dk);
    margin-bottom: 2px;
}
.spz-cov2-fulfillment-content small {
    display: block;
    color: var(--cov2-md);
    font-size: 0.82rem;
    margin-bottom: 6px;
}
.spz-cov2-fulfillment-price {
    display: inline-block;
    background: var(--cov2-rd);
    color: #fff;
    padding: 3px 10px;
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 700;
}
.spz-cov2-fulfillment-price.spz-cov2-free {
    background: var(--cov2-success) !important;
    color: #fff !important; /* override .spz-cov2-free global "color:green" rule */
}

/* === Customer-type tabs (Privat / Virksomhed) === */
.spz-cov2-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
    border-bottom: 2px solid var(--cov2-br);
    padding-bottom: 0;
}
.spz-cov2-tab {
    background: none;
    border: none;
    padding: 10px 20px;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--cov2-md);
    cursor: pointer;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: all .15s ease;
}
.spz-cov2-tab.is-active {
    color: var(--cov2-rd);
    border-bottom-color: var(--cov2-rd);
}
.spz-cov2-tab:hover:not(.is-active) {
    color: var(--cov2-dk);
}
.spz-cov2-tab-icon {
    margin-right: 6px;
}
.spz-cov2-customer-fields {
    display: none;
}
.spz-cov2-customer-fields.is-active {
    display: block;
}

/* === Address-autocomplete === */
.spz-cov2-hint-inline {
    font-weight: 400;
    color: #999;
    font-size: 0.72rem;
    margin-left: 6px;
}
.spz-cov2-autocomplete {
    position: relative;
}
.spz-cov2-address-input {
    padding-right: 38px !important;
}
.spz-cov2-address-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.95rem;
    color: var(--cov2-md);
    pointer-events: none;
}
.spz-cov2-suggestions {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid var(--cov2-br);
    border-radius: var(--cov2-radius);
    box-shadow: 0 8px 30px rgba(0,0,0,.12);
    max-height: 280px;
    overflow-y: auto;
    z-index: 100;
}
.spz-cov2-suggestion {
    padding: 12px 14px;
    cursor: pointer;
    font-size: 0.92rem;
    border-bottom: 1px solid var(--cov2-cr-dk);
    transition: background .12s ease;
}
.spz-cov2-suggestion:last-child { border-bottom: none; }
.spz-cov2-suggestion:hover {
    background: var(--cov2-cr);
    color: var(--cov2-rd);
}

/* === Pickup-info (når afhentning er valgt) === */
.spz-cov2-pickup-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}
@media (max-width: 600px) {
    .spz-cov2-pickup-info { grid-template-columns: 1fr; }
}
.spz-cov2-pickup-address,
.spz-cov2-pickup-hours {
    background: var(--cov2-cr);
    padding: 14px 16px;
    border-radius: var(--cov2-radius);
    font-size: 0.88rem;
    line-height: 1.6;
    color: var(--cov2-dk);
}
.spz-cov2-pickup-address strong,
.spz-cov2-pickup-hours strong {
    display: block;
    margin-bottom: 6px;
    font-family: "Playfair Display", serif;
    font-size: 1rem;
}
.spz-cov2-pickup-address a {
    color: var(--cov2-rd);
    text-decoration: underline;
}

/* === Custom calendar / date-picker === */
.spz-cov2-datepicker {
    background: #fff;
    border: 1px solid var(--cov2-br);
    border-radius: var(--cov2-radius-lg);
    padding: 14px 16px;
    margin-bottom: 8px;
}
.spz-cov2-cal-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}
.spz-cov2-cal-month {
    font-family: "Playfair Display", serif;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--cov2-dk);
    text-transform: capitalize;
}
.spz-cov2-cal-prev,
.spz-cov2-cal-next {
    background: var(--cov2-cr);
    border: 1px solid var(--cov2-br);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.1rem;
    color: var(--cov2-dk);
    transition: all .15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}
.spz-cov2-cal-prev:hover,
.spz-cov2-cal-next:hover {
    background: var(--cov2-rd);
    color: #fff;
    border-color: var(--cov2-rd);
}
.spz-cov2-cal-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 6px;
}
.spz-cov2-cal-weekdays span {
    text-align: center;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--cov2-md);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 6px 0;
}
.spz-cov2-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.spz-cov2-cal-day {
    aspect-ratio: 1;
    background: var(--cov2-cr);
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--cov2-dk);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all .12s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.spz-cov2-cal-day:hover:not(.is-disabled):not(.is-empty) {
    background: #fff;
    border-color: var(--cov2-rd);
    color: var(--cov2-rd);
    transform: scale(1.05);
}
.spz-cov2-cal-day.is-empty {
    background: transparent;
    cursor: default;
    opacity: 0;
}
.spz-cov2-cal-day.is-disabled {
    background: #f6f7f7;
    color: #c3c4c7;
    cursor: not-allowed;
}
.spz-cov2-cal-day.is-weekend {
    background: #fff4e6;
    color: #d68900;
}
.spz-cov2-cal-day.is-selected {
    background: var(--cov2-rd) !important;
    color: #fff !important;
    border-color: var(--cov2-rd) !important;
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(90, 26, 26, 0.3);
}
.spz-cov2-cal-legend {
    display: flex;
    gap: 14px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--cov2-cr-dk);
    flex-wrap: wrap;
}
.spz-cov2-cal-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    color: var(--cov2-md);
}
.spz-cov2-cal-legend-item .dot {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    display: inline-block;
}
.spz-cov2-cal-legend-item .dot.is-available { background: var(--cov2-cr); border: 1px solid var(--cov2-br); }
.spz-cov2-cal-legend-item .dot.is-disabled  { background: #f6f7f7; border: 1px solid #ddd; }
.spz-cov2-cal-legend-item .dot.is-weekend   { background: #fff4e6; border: 1px solid #ffd99a; }

/* === Section-head sub-label === */
.spz-cov2-section-sub {
    color: var(--cov2-md);
    font-size: 0.85rem;
    font-weight: 400;
    margin-left: 8px;
}

.spz-cov2-free {
    color: var(--cov2-success);
    font-weight: 700;
}

/* === Postnummer-først flow === */
.spz-cov2-postcode-wrap {
    background: linear-gradient(135deg, #fbf6f6 0%, #faf6ed 100%);
    border: 1.5px dashed var(--cov2-rd);
    border-radius: var(--cov2-radius-lg);
    padding: 20px 22px;
    margin-bottom: 0;
}
.spz-cov2-postcode-wrap label {
    display: block;
    font-family: "Playfair Display", serif;
    font-size: 1.05rem;
    color: var(--cov2-dk);
    margin-bottom: 8px;
    font-weight: 600;
}
.spz-cov2-postcode-row {
    display: flex;
    gap: 10px;
    margin-bottom: 8px;
}
.spz-cov2-postcode-row input {
    flex: 0 0 140px;
    padding: 14px 16px;
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
    letter-spacing: 0.12em;
    border: 1.5px solid var(--cov2-br);
    border-radius: var(--cov2-radius);
    background: #fff;
    color: var(--cov2-dk);
    transition: all .15s ease;
}
.spz-cov2-postcode-row input:focus {
    outline: none;
    border-color: var(--cov2-rd);
    box-shadow: 0 0 0 3px rgba(90, 26, 26, 0.12);
}
.spz-cov2-postcode-row input.is-error {
    border-color: #c0392b;
    background: #fdecea;
    animation: spzShake 0.4s ease;
}
@keyframes spzShake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}
.spz-cov2-zip-check-btn {
    flex: 1;
    background: var(--cov2-rd);
    color: #fff;
    border: none;
    border-radius: var(--cov2-radius);
    padding: 14px 20px;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all .15s ease;
}
.spz-cov2-zip-check-btn:hover {
    background: var(--cov2-rd-dark);
    transform: translateY(-1px);
}
@media (max-width: 600px) {
    .spz-cov2-postcode-row { flex-direction: column; }
    .spz-cov2-postcode-row input { flex: 1; }
}

/* Resultat-status efter postcode-check */
.spz-cov2-zip-status {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #f0f8f0;
    border-left: 4px solid var(--cov2-success);
    border-radius: var(--cov2-radius);
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.spz-cov2-zip-icon { font-size: 1.2rem; }
.spz-cov2-zip-text { flex: 1; color: var(--cov2-dk); font-size: 0.95rem; }
.spz-cov2-zip-text strong { color: var(--cov2-dk); }
.spz-cov2-zip-change {
    background: none;
    border: none;
    color: var(--cov2-rd);
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: underline;
    padding: 0;
}
.spz-cov2-zip-change:hover { color: var(--cov2-rd-dark); }

/* Udenfor zone */
.spz-cov2-zip-warning {
    padding: 14px 18px;
    background: #fef4e6;
    border-left: 4px solid #d68900;
    border-radius: var(--cov2-radius);
    margin-bottom: 14px;
}
.spz-cov2-zip-warning strong {
    display: block;
    color: var(--cov2-dk);
    font-size: 1rem;
    margin-bottom: 4px;
}
.spz-cov2-zip-warning p {
    margin: 0;
    color: var(--cov2-md);
    font-size: 0.88rem;
    line-height: 1.5;
}
.spz-cov2-fulfillment-single {
    grid-template-columns: 1fr !important;
    max-width: 100%;
}
.spz-cov2-fulfillment-meta {
    display: block;
}

/* Switch til pickup-knap (når postcode er udenfor zone) */
.spz-cov2-switch-pickup {
    margin-top: 10px;
    background: var(--cov2-rd);
    color: #fff;
    border: none;
    padding: 10px 18px;
    border-radius: 50px;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-size: 0.88rem;
    cursor: pointer;
    transition: all .15s ease;
}
.spz-cov2-switch-pickup:hover {
    background: var(--cov2-rd-dark);
    transform: translateY(-1px);
}

/* Spacing mellem fulfillment-cards og postcode-block */
.spz-cov2-delivery-zip,
.spz-cov2-pickup-confirm {
    margin-top: 18px;
}

/* ============================================================
 * v0.6 — Kunde-type cards (Privat / Firma / Offentlig)
 * ============================================================ */
.spz-cov2-customer-type-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
@media (max-width: 700px) {
    .spz-cov2-customer-type-grid { grid-template-columns: 1fr; }
}
.spz-cov2-ctype-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding: 22px 16px;
    border: 2px solid var(--cov2-br);
    border-radius: var(--cov2-radius-lg);
    cursor: pointer;
    transition: all .15s ease;
    background: #fff;
    position: relative;
}
.spz-cov2-ctype-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.spz-cov2-ctype-card:hover {
    border-color: var(--cov2-rd);
    background: #fbf6f6;
    transform: translateY(-2px);
}
.spz-cov2-ctype-card.is-selected {
    border-color: var(--cov2-rd);
    background: linear-gradient(135deg, #fbf6f6 0%, #faf6ed 100%);
    box-shadow: 0 0 0 4px rgba(90, 26, 26, 0.08);
}
.spz-cov2-ctype-card.is-selected::after {
    content: "✓";
    position: absolute;
    top: 8px;
    right: 12px;
    color: var(--cov2-rd);
    font-weight: 700;
}
.spz-cov2-ctype-icon { font-size: 2.6rem; line-height: 1; }
.spz-cov2-ctype-content strong {
    display: block;
    font-family: "Playfair Display", serif;
    font-size: 1.1rem;
    color: var(--cov2-dk);
    margin-bottom: 4px;
}
.spz-cov2-ctype-content small {
    display: block;
    color: var(--cov2-md);
    font-size: 0.78rem;
    line-height: 1.4;
}

/* === CVR-opslag-blok === */
.spz-cov2-cvr-lookup,
.spz-cov2-ean-lookup {
    background: #fbf9f4;
    border: 1px solid var(--cov2-br);
    border-radius: var(--cov2-radius);
    padding: 14px 16px;
    margin-bottom: 14px;
}
.spz-cov2-cvr-row {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}
.spz-cov2-cvr-row input {
    flex: 0 0 140px;
    padding: 11px 14px;
    border: 1.5px solid var(--cov2-br);
    border-radius: var(--cov2-radius);
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.06em;
    background: #fff;
}
.spz-cov2-cvr-row input:focus {
    outline: none;
    border-color: var(--cov2-rd);
    box-shadow: 0 0 0 3px rgba(90, 26, 26, 0.12);
}
.spz-cov2-cvr-row input.is-error {
    border-color: #c0392b;
    background: #fdecea;
}
.spz-cov2-cvr-lookup-btn {
    flex: 1;
    background: var(--cov2-rd);
    color: #fff;
    border: none;
    padding: 11px 18px;
    border-radius: var(--cov2-radius);
    font-weight: 600;
    font-size: 0.92rem;
    cursor: pointer;
    transition: all .15s ease;
}
.spz-cov2-cvr-lookup-btn:hover:not(:disabled) {
    background: var(--cov2-rd-dark);
}
.spz-cov2-cvr-lookup-btn:disabled { opacity: 0.6; cursor: wait; }
@media (max-width: 600px) {
    .spz-cov2-cvr-row { flex-direction: column; }
    .spz-cov2-cvr-row input { flex: 1; }
}

.spz-cov2-cvr-status,
.spz-cov2-ean-status {
    padding: 8px 12px;
    border-radius: var(--cov2-radius);
    font-size: 0.88rem;
    margin-top: 6px;
}
.spz-cov2-cvr-status.is-ok,
.spz-cov2-ean-status.is-ok {
    background: #e8f5e9;
    color: #1b5e20;
    border-left: 3px solid var(--cov2-success);
}
.spz-cov2-cvr-status.is-err,
.spz-cov2-ean-status.is-err {
    background: #fdecea;
    color: #c0392b;
    border-left: 3px solid #c0392b;
}
.spz-cov2-cvr-status.is-loading {
    background: #f0f7ff;
    color: #1565c0;
    border-left: 3px solid #1565c0;
}

/* EAN-lookup input full-width */
.spz-cov2-ean-lookup input {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid var(--cov2-br);
    border-radius: var(--cov2-radius);
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.06em;
    background: #fff;
}

/* === Google Places Autocomplete dropdown (pac-container) — match Spizz-stil === */
.pac-container {
    border-radius: var(--cov2-radius);
    border: 1px solid var(--cov2-br);
    box-shadow: 0 8px 30px rgba(0,0,0,.12);
    margin-top: 4px;
    font-family: "Inter", sans-serif;
    background: #fff;
    overflow: hidden;
}
.pac-item {
    padding: 10px 14px;
    cursor: pointer;
    border-top: 1px solid var(--cov2-cr-dk);
    font-size: 0.9rem;
    color: var(--cov2-dk);
}
.pac-item:first-child { border-top: 0; }
.pac-item:hover,
.pac-item-selected {
    background: var(--cov2-cr);
    color: var(--cov2-rd);
}
.pac-icon { display: none; } /* Skjul Google's location-icon */
.pac-item-query {
    font-size: 0.95rem;
    color: var(--cov2-dk);
    padding-right: 4px;
}
.pac-matched { color: var(--cov2-rd); font-weight: 600; }
.pac-logo:after {
    height: 18px;
    padding: 6px 12px;
    background-size: 90px;
}

/* ============================================================
 * v0.8 — STICKY MOBILE CTA-BAR (kun synlig under 960px)
 * Hard-coded colors + !important saa Woodmart ikke kan overruler
 * ============================================================ */
.spz-cov2-mobile-cta {
    display: none !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: #ffffff !important;
    border-top: 1px solid #e7dfd0 !important;
    box-shadow: 0 -8px 24px rgba(0,0,0,0.08) !important;
    padding: 4px 8px !important;
    z-index: 999999 !important;
    gap: 6px !important;
    align-items: center !important;
    /* Force visibility (mod evt. theme/plugin der hider sticky-elements paa scroll) */
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    /* iOS Safari safe-area (kun bottom — top padding er allerede 4px) */
    padding-bottom: calc(4px + env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    /* INGEN transform/will-change paa CTA-bar — det breaker position:fixed paa iOS Safari!
       Vi haandterer i stedet ancestor-transforms via JS killAncestorTransforms() */
}
.spz-cov2-mobile-cta-summary,
.spz-cov2-mobile-cta-submit {
    /* Reset theme button-styling */
    font-family: "Inter", "Poppins", sans-serif !important;
    line-height: 1.2 !important;
    box-sizing: border-box !important;
}
.spz-cov2-mobile-cta-summary {
    flex: 1 !important;
    background: #f7f3eb !important;
    border: 1px solid #e7dfd0 !important;
    border-radius: 50px !important;
    padding: 4px 12px !important;
    text-align: left !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #2d2d2d !important;
    transition: all .15s ease;
    min-height: 34px !important;
}
.spz-cov2-mobile-cta-summary:hover { background: #eee7d7 !important; }
.spz-cov2-mobile-cta-label,
.spz-cov2-mobile-cta-price,
.spz-cov2-mobile-cta-toggle,
.spz-cov2-mobile-cta-submit > * {
    visibility: visible !important;
    opacity: 1 !important;
}
.spz-cov2-mobile-cta-label {
    color: #5a5a5a !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    display: inline-block !important;
}
.spz-cov2-mobile-cta-price {
    flex: 1 !important;
    font-family: "Playfair Display", Georgia, serif !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #5a1a1a !important;
    display: inline-block !important;
    line-height: 1.1 !important;
}
.spz-cov2-mobile-cta-toggle {
    color: #5a5a5a !important;
    font-size: 0.85rem !important;
    transition: transform .18s ease;
    display: inline-block !important;
}
/* Ekstra hardening: nogen tema/plugin kunne saette opacity:0 paa scroll */
.spz-cov2-mobile-cta * {
    visibility: visible !important;
    opacity: 1 !important;
}
.spz-cov2-mobile-cta-submit {
    background: #5a1a1a !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 6px 16px !important;
    font-family: "Playfair Display", Georgia, serif !important;
    font-weight: 600 !important;
    font-size: 0.92rem !important;
    cursor: pointer !important;
    box-shadow: 0 4px 14px rgba(90, 26, 26, 0.3) !important;
    transition: all .18s ease;
    white-space: nowrap !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    min-height: 34px !important;
}
.spz-cov2-mobile-cta-submit:hover {
    background: #3d0d0d !important;
    transform: translateY(-1px);
}
.spz-cov2-mobile-cta-submit:active {
    transform: translateY(0);
}

/* Expandable details panel */
.spz-cov2-mobile-cta-details {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid var(--cov2-br);
    box-shadow: 0 -16px 40px rgba(0,0,0,0.15);
    z-index: 10000;
    max-height: 70vh;
    overflow-y: auto;
    border-radius: 18px 18px 0 0;
    padding-bottom: max(20px, env(safe-area-inset-bottom));
    animation: spzSlideUp .25s ease;
}
@keyframes spzSlideUp {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
}
.spz-cov2-mobile-cta-details:not([hidden]) {
    display: block;
}
.spz-cov2-mobile-cta-details-inner {
    padding: 22px 20px 12px;
}
.spz-cov2-mobile-cta-details-inner h4 {
    font-family: "Playfair Display", serif;
    font-size: 1.15rem;
    margin: 0 0 14px;
    color: var(--cov2-dk);
}
.spz-cov2-mobile-cta-items .spz-cov2-order-item,
.spz-cov2-mobile-cta-items .spz-cov2-order-line {
    padding: 8px 0;
    border-bottom: 1px solid var(--cov2-cr-dk);
    display: flex;
    justify-content: space-between;
    gap: 10px;
    font-size: 0.92rem;
}
.spz-cov2-mobile-cta-items .spz-cov2-order-total {
    margin-top: 10px;
    padding-top: 14px;
    border-top: 2px solid var(--cov2-dk);
    display: flex;
    justify-content: space-between;
}
.spz-cov2-mobile-cta-items .spz-cov2-order-total strong {
    color: var(--cov2-rd);
    font-size: 1.3rem;
    font-family: "Playfair Display", serif;
}
.spz-cov2-mobile-cta-close {
    width: 100%;
    background: transparent;
    border: 1px solid var(--cov2-br);
    color: var(--cov2-md);
    padding: 12px;
    border-radius: 50px;
    margin-top: 14px;
    cursor: pointer;
    font-family: inherit;
    font-weight: 600;
    font-size: 0.9rem;
}
.spz-cov2-mobile-cta-close:hover {
    background: var(--cov2-cr);
    color: var(--cov2-dk);
}

/* === Vis CTA-bar kun under 960px (matcher sidebar-breakpoint) === */
@media (max-width: 960px) {
    .spz-cov2-mobile-cta { display: flex !important; }
    /* Padding-bottom på main så indhold ikke gemmer sig bag CTA (bar ca. 46px tall + safe-area) */
    .spz-cov2-page { padding-bottom: 70px !important; }
}

/* ============================================================
 * MOBIL-OPTIMERINGER (Stage A polish)
 * ============================================================ */

/* Tablet+small-desktop justeringer (601-960px) */
@media (max-width: 960px) {
    .spz-cov2-container { padding: 0 16px; gap: 20px; }
    .spz-cov2-title { font-size: clamp(1.5rem, 5vw, 2rem); }
    .spz-cov2-subtitle { font-size: 0.95rem; margin-bottom: 20px; }
    /* Section-padding lidt tighter */
    .spz-cov2-section-head { padding: 14px 18px; }
    .spz-cov2-section-body { padding: 18px; }
    /* Sidebar-card lidt tighter */
    .spz-cov2-sidebar-card { padding: 18px; }
}

/* Mobile (≤600px) — kompakt layout */
@media (max-width: 600px) {
    .spz-cov2-page { padding: 24px 0 100px; }
    .spz-cov2-container { padding: 0 8px !important; gap: 14px; max-width: 100% !important; }
    .spz-cov2-title { font-size: 1.5rem; line-height: 1.15; padding: 0 4px; }
    .spz-cov2-subtitle { font-size: 0.9rem; margin-bottom: 16px; padding: 0 4px; }

    /* Override evt. theme-container-padding (Woodmart .container) */
    body .wd-content-layout.container,
    body .container.wd-content-layout {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
    }

    /* Mindre section-padding */
    .spz-cov2-section { margin-bottom: 12px; border-radius: 10px; }
    .spz-cov2-section-head { padding: 12px 14px; gap: 10px; }
    .spz-cov2-section-head h2 { font-size: 1.05rem; }
    .spz-cov2-section-body { padding: 14px 14px; }
    .spz-cov2-step { width: 26px; height: 26px; font-size: 13px; }

    /* Hint-text bryd til ny linje for at undgå overflow */
    .spz-cov2-hint-inline {
        display: block;
        margin-left: 0;
        margin-top: 2px;
        font-size: 0.7rem;
    }

    /* Sidebar (når den vises som order: -1) */
    .spz-cov2-sidebar-card { padding: 16px; border-radius: 10px; }
    .spz-cov2-sidebar-card h3 { font-size: 1.1rem; margin-bottom: 12px; }
    .spz-cov2-order-name strong { font-size: 0.88rem; }
    .spz-cov2-order-name small { font-size: 0.75rem; }
    .spz-cov2-order-price { font-size: 0.88rem; }
    .spz-cov2-order-total strong { font-size: 1.25rem; }
    .spz-cov2-order-promo { padding: 10px 12px; font-size: 0.78rem; }
    .spz-cov2-sidebar-trust { gap: 8px; }
    .spz-cov2-trust-item { padding: 10px 8px; font-size: 0.72rem; }

    /* Customer-type-kort tighter */
    .spz-cov2-ctype-card { padding: 16px 10px; }
    .spz-cov2-ctype-icon { font-size: 2.2rem; }
    .spz-cov2-ctype-content strong { font-size: 1rem; }
    .spz-cov2-ctype-content small { font-size: 0.74rem; }

    /* Fulfillment-cards (kun 1 kolonne på smal mobile) */
    .spz-cov2-fulfillment-card { padding: 14px 16px; }
    .spz-cov2-fulfillment-icon { font-size: 1.9rem; }
    .spz-cov2-fulfillment-content strong { font-size: 1rem; }

    /* Calendar tightere på mobile */
    .spz-cov2-datepicker { padding: 10px 12px; }
    .spz-cov2-cal-day { font-size: 0.82rem; }
    .spz-cov2-cal-weekdays span { font-size: 0.65rem; padding: 4px 0; }
    .spz-cov2-cal-month { font-size: 0.95rem; }
    .spz-cov2-cal-legend { gap: 8px; flex-wrap: wrap; }
    .spz-cov2-cal-legend-item { font-size: 0.68rem; }

    /* CVR/EAN-lookup tighter */
    .spz-cov2-cvr-lookup, .spz-cov2-ean-lookup { padding: 12px 14px; }
    .spz-cov2-cvr-row { gap: 6px; }

    /* Payment-cards tighter */
    .spz-cov2-payment { padding: 12px 14px; gap: 10px; }
    .spz-cov2-payment-content strong { font-size: 0.95rem; }
    .spz-cov2-payment-content small { font-size: 0.78rem; }

    /* Submit-button på mobil */
    .spz-cov2-submit-btn { padding: 16px 24px; font-size: 1.05rem; }
    .spz-cov2-terms { font-size: 0.76rem; }

    /* Upsell-card mobile */
    .spz-cov2-upsell-card { padding: 14px 16px; gap: 10px; }
    .spz-cov2-upsell-title strong { font-size: 1rem; }
    .spz-cov2-upsell-content p { font-size: 0.84rem; }

    /* Long text break-words (CVR/EAN/email) */
    .spz-cov2-cvr-status, .spz-cov2-ean-status,
    .spz-cov2-zip-text { overflow-wrap: anywhere; word-break: break-word; }
}

/* Ekstra-small (≤380px / iPhone SE 2nd) */
@media (max-width: 380px) {
    .spz-cov2-section-body { padding: 12px 14px; }
    .spz-cov2-section-head { padding: 10px 14px; }
    .spz-cov2-section-head h2 { font-size: 1rem; }
    .spz-cov2-mobile-cta-price { font-size: 1rem !important; }
    .spz-cov2-mobile-cta-submit { padding: 10px 14px !important; font-size: 0.9rem !important; }
}

/* ============================================================
 * MOBIL OVERFLOW-GUARDS (vigtig for iPhone SE/12 Pro 375-390px)
 * ============================================================ */
@media (max-width: 600px) {
    /* Forhindr ALLE elementer i at overflow vandret */
    .spz-cov2-page,
    .spz-cov2-container,
    .spz-cov2-main,
    .spz-cov2-sidebar,
    .spz-cov2-section,
    .spz-cov2-sidebar-card {
        max-width: 100%;
        width: 100%;
    }
    /* Inputs må aldrig overflowe deres parent */
    .spz-cov2-page input,
    .spz-cov2-page select,
    .spz-cov2-page textarea {
        max-width: 100%;
        min-width: 0;
    }
    /* Sticky CTA-bar viewport-bundet */
    .spz-cov2-mobile-cta {
        max-width: 100vw !important;
        width: 100vw !important;
        left: 0 !important;
        right: 0 !important;
    }
    /* Order-summary aldrig wider end parent */
    .spz-cov2-sidebar-card { max-width: 100%; overflow: hidden; }

    /* Hint-inline aldrig overflow */
    .spz-cov2-hint-inline { word-break: break-word; overflow-wrap: anywhere; }

    /* Calendar bestemmer dynamisk størrelse */
    .spz-cov2-cal-grid { min-width: 0; }
    .spz-cov2-cal-day { min-width: 0; font-size: 0.78rem; }
}


/* ===== STAGE B — Faded placeholders så de ikke ligner rigtige værdier ===== */
.spz-cov2-page input::placeholder,
.spz-cov2-page textarea::placeholder,
.spz-cov2-page select::placeholder,
.spz-cov2-field input::placeholder,
.spz-cov2-field textarea::placeholder,
.spz-cov2-field select::placeholder {
    color: #9aa3a8 !important;
    opacity: 1 !important;
    font-weight: 400 !important;
    font-style: italic;
}
/* Webkit-specifik (Safari/Chrome) — for at trumfe over woodmart styles */
.spz-cov2-page input::-webkit-input-placeholder,
.spz-cov2-field input::-webkit-input-placeholder {
    color: #9aa3a8 !important;
    opacity: 1 !important;
    font-weight: 400 !important;
    font-style: italic;
}
/* Mozilla-specifik */
.spz-cov2-page input::-moz-placeholder,
.spz-cov2-field input::-moz-placeholder {
    color: #9aa3a8 !important;
    opacity: 1 !important;
    font-weight: 400 !important;
    font-style: italic;
}
/* Readonly inputs (Gade, Nr, Postnummer, By — auto-udfyldes fra Google) skal stadig se faded ud */
.spz-cov2-page input[readonly],
.spz-cov2-field input[readonly] {
    background: #f8f5ef !important;
    color: #6a6a6a !important;
}


/* ===== STAGE B — Master kuvert-kontrol i sidebar ===== */
.spz-cov2-master-qty {
    background: var(--cov2-cr, #f7f3eb);
    border: 1px solid var(--cov2-br, #e7dfd0);
    border-radius: 12px;
    padding: 12px 14px;
    margin: 12px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.spz-cov2-master-qty-label {
    font-weight: 600;
    color: #2d2d2d;
    font-size: 0.95rem;
    margin: 0;
}
.spz-cov2-master-qty-controls {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    border: 1px solid var(--cov2-br, #e7dfd0);
    border-radius: 8px;
    padding: 2px;
}
.spz-cov2-master-qty-btn {
    background: transparent;
    border: none;
    width: 30px; height: 30px;
    font-size: 1.1rem; font-weight: 700;
    cursor: pointer;
    color: #5a1a1a;
    border-radius: 6px;
    transition: background 0.15s;
    padding: 0; line-height: 1;
}
.spz-cov2-master-qty-btn:hover { background: var(--cov2-cr, #f7f3eb); }
.spz-cov2-master-qty-btn:active { background: #e7dfd0; }
.spz-cov2-master-qty-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.spz-cov2-master-qty-input {
    width: 44px;
    text-align: center;
    border: none !important;
    background: transparent !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: #2d2d2d !important;
    padding: 4px !important;
    box-shadow: none !important;
    -moz-appearance: textfield;
}
.spz-cov2-master-qty-input::-webkit-outer-spin-button,
.spz-cov2-master-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.spz-cov2-master-qty.is-loading {
    opacity: 0.6;
    pointer-events: none;
}


/* ===== STAGE B — Per-item controls (replace master qty) ===== */
.spz-cov2-order-item {
    position: relative;
    display: flex !important;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 0;
}
.spz-cov2-order-item.is-loading {
    opacity: 0.5;
    pointer-events: none;
}
.spz-cov2-order-name {
    flex: 1 1 0;
    min-width: 0;
}
.spz-cov2-order-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    flex-shrink: 0;
}
.spz-cov2-item-qty-row {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    font-size: 0.85rem;
}
.spz-cov2-item-btn {
    background: var(--cov2-cr, #f7f3eb);
    border: 1px solid var(--cov2-br, #e7dfd0);
    width: 24px; height: 24px;
    font-size: 0.95rem; font-weight: 700;
    cursor: pointer;
    color: #5a1a1a;
    border-radius: 5px;
    padding: 0; line-height: 1;
    transition: background 0.15s;
}
.spz-cov2-item-btn:hover { background: #ede2cf; }
.spz-cov2-item-btn:active { background: #e0d0b3; }
.spz-cov2-item-qty {
    width: 38px !important;
    text-align: center;
    border: 1px solid var(--cov2-br, #e7dfd0) !important;
    background: #fff !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    color: #2d2d2d !important;
    padding: 2px 4px !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    line-height: 1 !important;
    -moz-appearance: textfield;
}
.spz-cov2-item-qty::-webkit-outer-spin-button,
.spz-cov2-item-qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.spz-cov2-item-qty-unit {
    color: #6a6a6a;
    font-size: 0.82rem;
    margin-left: 2px;
}
.spz-cov2-item-remove {
    background: transparent;
    border: none;
    color: #999;
    font-size: 1.2rem;
    cursor: pointer;
    width: 24px; height: 24px;
    line-height: 1;
    padding: 0;
    border-radius: 50%;
    transition: all 0.15s;
}
.spz-cov2-item-remove:hover {
    color: #c00;
    background: #fdecea;
}

/* ===== STAGE B — Worldline payment widget ===== */
.spz-cov2-payment-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}
.spz-cov2-worldline-badge {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 4px 10px;
}
.spz-cov2-online-logos {
    margin-top: 12px;
    flex-wrap: wrap;
    gap: 8px !important;
    align-items: center;
}
.spz-cov2-online-logos .spz-cov2-logo {
    display: inline-flex;
    align-items: center;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 4px 8px;
    transition: all 0.15s;
}
.spz-cov2-online-logos .spz-cov2-logo:hover {
    border-color: var(--cov2-rd, #5a1a1a);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.spz-cov2-payment.spz-pay-online {
    padding: 16px 20px;
}
.spz-cov2-payment.spz-pay-online .spz-cov2-payment-content {
    width: 100%;
}

/* ===== STAGE B — Client-side validation visuals ===== */
.spz-cov2-field-error input,
.spz-cov2-field-error select,
.spz-cov2-field-error textarea {
    border-color: #d44 !important;
    background: #fef9f9 !important;
    box-shadow: 0 0 0 3px rgba(212,68,68,0.1) !important;
    animation: spz-shake 0.4s ease-in-out;
}
@keyframes spz-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}
.spz-cov2-field-error label {
    color: #c44 !important;
}
.spz-cov2-inline-error {
    color: #c44;
    font-size: 0.82rem;
    font-weight: 500;
    margin-top: 6px;
    padding: 4px 8px;
    background: #fdecea;
    border-radius: 6px;
    display: inline-block;
}

/* Tydeligere * markering på påkrævede felter */
.spz-cov2-field label .spz-required,
.spz-cov2-field label sup {
    color: #c44 !important;
    font-weight: 700;
    margin-left: 2px;
}

/* ===== STAGE B — Faktura-adresse + same-as-invoice toggle ===== */
.spz-cov2-invoice-address {
    background: #fdf6e3;
    border: 1px solid var(--cov2-gd, #a8823a);
    border-left: 4px solid var(--cov2-gd, #a8823a);
    border-radius: 10px;
    padding: 14px 16px;
    margin: 12px 0;
}
.spz-cov2-invoice-label {
    font-size: 0.88rem;
    color: var(--cov2-dk, #2d2d2d);
    margin-bottom: 6px;
}
.spz-cov2-invoice-label strong {
    color: var(--cov2-rd, #5a1a1a);
}
.spz-cov2-invoice-label .spz-cov2-hint-inline {
    color: var(--cov2-md, #6a6a6a);
    font-weight: 400;
    margin-left: 6px;
    font-size: 0.8rem;
}
.spz-cov2-invoice-address-display {
    font-weight: 600;
    color: var(--cov2-dk, #2d2d2d);
    font-size: 0.95rem;
    margin-top: 4px;
}

.spz-cov2-same-as-invoice {
    background: var(--cov2-cr, #f7f3eb);
    border: 1px solid var(--cov2-br, #e7dfd0);
    border-radius: 10px;
    padding: 14px 18px;
    margin-bottom: 16px;
}
.spz-cov2-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    font-size: 0.95rem;
    color: var(--cov2-dk, #2d2d2d);
}
.spz-cov2-checkbox-label input[type='checkbox'] {
    margin-top: 2px;
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--cov2-rd, #5a1a1a);
}
.spz-cov2-delivery-address-fields {
    transition: opacity 0.25s, max-height 0.25s;
}
.spz-cov2-delivery-section.is-using-invoice-address .spz-cov2-delivery-address-fields {
    display: none !important;
}