/**
 * CODwo - Skins + FBT/Extras styles.
 *
 * Each skin (.codwo-skin-{slug}) re-styles the form to match its design.
 * Overrides go from light (modern/minimal) to opinionated (editorial/cod/bold/classic/card).
 */

/* ============================================================
   FBT (Frequently Bought Together) — universal
   Polished card design: custom checkbox, ribbon discount badge,
   uniform media aspect, subtle selected-state tint.
   ============================================================ */
.codwo-fbt-section {
    position: relative;
    margin: 16px 0;
    padding: 18px;
    background: var(--codwo-surface, #f8fafc);
    border: 1px solid var(--codwo-border, #e2e6ec);
    border-radius: var(--codwo-radius-card, 16px);
}

.codwo-fbt-head {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 14px;
    padding-inline-start: 26px;
    position: relative;
}
.codwo-fbt-head::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 2px;
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background-color: var(--codwo-surface, rgba(15, 76, 129, 0.08));
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f4c81' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.5'/%3E%3Ccircle cx='18' cy='20' r='1.5'/%3E%3Cpath d='M2 3h3l2.7 12.2a2 2 0 0 0 2 1.6h8.6a2 2 0 0 0 2-1.6L22 7H6'/%3E%3Cpath d='M15 4v4M13 6h4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 13px 13px;
}
.codwo-product-form-wrapper .codwo-fbt-section .codwo-fbt-title,
.codwo-product-form-wrapper .codwo-fbt-title {
    margin: 0 !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    color: var(--codwo-text, #2c3e50) !important;
    text-transform: none !important;
    padding: 0 !important;
    border: 0 !important;
}
.codwo-product-form-wrapper .codwo-fbt-section .codwo-fbt-subtitle,
.codwo-product-form-wrapper .codwo-fbt-subtitle {
    margin: 0 !important;
    color: var(--codwo-text-muted, #7a8a99) !important;
    font-size: 12.5px !important;
    line-height: 1.45 !important;
    font-weight: 500 !important;
}

.codwo-fbt-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 12px;
}

/* ============================================================
   FBT CARD — full redesign
   ----------------------------------------------------------------
   We hide the native <input type="checkbox"> entirely (so no theme,
   icon-font, or browser default can ever leak a glyph into the
   card) and draw the tick indicator as a pseudo-element on the
   label. JS toggles `.is-selected` on the label on `change`.
   ============================================================ */

/* --- Card ---
   No `overflow: hidden` here — we want the tick indicator to overflow
   the top-corner border (image zoom is clipped on .codwo-fbt-image instead). */
.codwo-fbt-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px 10px 12px;
    background: var(--codwo-bg, #ffffff);
    border: 2px solid var(--codwo-border, #e2e6ec);
    border-radius: calc(var(--codwo-radius-card, 16px) - 2px);
    cursor: pointer;
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    isolation: isolate; /* lets ::before sit above the image cleanly */
}
.codwo-fbt-card:hover {
    border-color: var(--codwo-primary, #0073aa);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(15, 34, 54, 0.09);
}

/* Tick indicator — drawn on the LABEL, never on the input.
   Sits OVER the card's top-corner border so it reads as a badge.
   Empty circle by default; primary-filled with a white checkmark when
   `.is-selected`. SVG is embedded so no font/glyph can replace it.
   Negative offsets + an outer white "halo" keep it visually separated
   from the card border, even on color-matched backgrounds. */
.codwo-fbt-card::before {
    content: "";
    position: absolute;
    top: -10px;
    inset-inline-end: -10px;
    width: 26px;
    height: 26px;
    border: 2px solid var(--codwo-border-strong, #c8cfd8);
    border-radius: 999px;
    background: #ffffff;
    /* outer white ring "punches" the badge above the card border */
    box-shadow: 0 0 0 3px var(--codwo-bg, #ffffff), 0 2px 6px rgba(15, 34, 54, 0.12);
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    z-index: 3;
    pointer-events: none;
}
.codwo-fbt-card:hover::before {
    border-color: var(--codwo-primary, #0073aa);
}
.codwo-fbt-card.is-selected {
    border-width: 3.5px;
    border-color: var(--codwo-primary, #0073aa);
    background: color-mix(in srgb, var(--codwo-primary, #0073aa) 5%, var(--codwo-bg, #fff));
    box-shadow: 0 8px 20px rgba(15, 34, 54, 0.08);
}
.codwo-fbt-card.is-selected::before {
    background-color: var(--codwo-primary, #0073aa);
    border-color: var(--codwo-primary, #0073aa);
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 12 10 18 20 6'/%3E%3C/svg%3E");
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: center;
    /* slightly bigger on selection and keep the white halo so it stays "lifted" */
    transform: scale(1.06);
    box-shadow: 0 0 0 3px var(--codwo-bg, #ffffff), 0 3px 10px rgba(15, 34, 54, 0.18);
}

/* --- Native input: visually hidden but still accessible & functional ---
   `clip` + `clip-path` + zero size + zero opacity guarantees nothing
   the browser/theme tries to paint inside the input can ever be seen. */
.codwo-fbt-checkbox,
input[type="checkbox"].codwo-fbt-checkbox {
    position: absolute !important;
    top: 0 !important;
    inset-inline-end: 0 !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 1px !important;
    max-height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
}
.codwo-fbt-checkbox::before,
.codwo-fbt-checkbox::after,
input[type="checkbox"].codwo-fbt-checkbox::before,
input[type="checkbox"].codwo-fbt-checkbox::after {
    content: none !important;
    display: none !important;
}
.codwo-fbt-checkbox:focus-visible + .codwo-fbt-image,
.codwo-fbt-card:focus-within::before {
    outline: 2px solid var(--codwo-primary, #0073aa);
    outline-offset: 2px;
}

/* --- Image --- */
.codwo-fbt-image {
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: calc(var(--codwo-radius-card, 16px) - 6px);
    background: var(--codwo-surface, #f8fafc);
    border: 1px solid var(--codwo-border, #e2e6ec);
    aspect-ratio: 1 / 1;
}
.codwo-fbt-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.35s ease;
}
.codwo-fbt-card:hover .codwo-fbt-image img {
    transform: scale(1.04);
}

/* --- Info --- */
.codwo-fbt-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 2px 2px 4px;
}
.codwo-fbt-name {
    font-weight: 600;
    color: var(--codwo-text, #2c3e50);
    font-size: 13.5px;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.6em;
}

/* Discount badge — ribbon pinned to the top-inline-start corner of the image. */
.codwo-fbt-badge {
    position: absolute;
    top: 8px;
    inset-inline-start: 8px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 10.5px;
    font-weight: 800;
    color: #fff;
    background: var(--codwo-accent, #ef6c00);
    padding: 4px 9px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18);
    align-self: flex-start;
}
.codwo-fbt-badge::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
/* Move badge out of absolute on cards where image wrapper doesn't contain it. */
.codwo-fbt-info > .codwo-fbt-badge {
    position: static;
    box-shadow: 0 2px 6px rgba(217, 79, 0, 0.2);
    align-self: flex-start;
    margin: 0;
    font-size: 10px;
    padding: 3px 8px;
    line-height: 1.4;
    order: 2;
}
.codwo-fbt-info > .codwo-fbt-prices {
    order: 3;
}
.codwo-fbt-info > .codwo-fbt-name {
    order: 1;
}

.codwo-fbt-prices {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}
.codwo-fbt-old {
    color: var(--codwo-text-muted, #9aa3ad);
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
    font-size: 12px;
    font-weight: 500;
}
.codwo-fbt-new {
    color: var(--codwo-primary, #0073aa);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
}

/* Bundle hint — tucked under the grid, slimmer + with a checkmark. */
.codwo-fbt-bundle-hint {
    margin-top: 14px;
    padding: 10px 14px;
    background: var(--codwo-success, #16a34a);
    color: #fff;
    border-radius: var(--codwo-radius-input, 10px);
    text-align: center;
    font-weight: 600;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.16);
}
.codwo-fbt-bundle-hint::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1 14l-4-4 1.41-1.41L11 13.17l5.59-5.59L18 9l-7 7z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* ============================================================
   Extras (Add-ons) — universal
   ============================================================ */
.codwo-extras-section {
    margin: 5px 0; padding: 16px;
    background: var(--codwo-surface, #f8fafc);
    border: 1px solid var(--codwo-border, #e2e6ec);
    border-radius: var(--codwo-radius-card, 16px);
}
.codwo-product-form-wrapper .codwo-extras-title {
    margin: 0 0 12px !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    letter-spacing: -0.005em !important;
    color: var(--codwo-text, #2c3e50) !important;
    text-transform: none !important;
    padding: 0 !important;
    border: 0 !important;
}
.codwo-extras-list { display: flex; flex-direction: column; gap: 8px; }
.codwo-extra-row {
    display: grid; grid-template-columns: auto auto 1fr auto;
    align-items: center; gap: 12px;
    padding: 12px 14px;
    background: var(--codwo-bg, #fff);
    border: 1px solid var(--codwo-border, #e2e6ec);
    border-radius: var(--codwo-radius-input, 10px);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.codwo-extra-row:hover { border-color: var(--codwo-primary, #0073aa); }
.codwo-extra-row.is-selected { border-color: var(--codwo-primary, #0073aa); }
.codwo-extra-checkbox,
input[type="checkbox"].codwo-extra-checkbox {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    accent-color: var(--codwo-primary, #0073aa);
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
}
.codwo-extra-icon {
    width: 32px; height: 32px;
    min-width: 32px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: rgba(15, 76, 129, 0.10); color: var(--codwo-primary, #0073aa);
    font-size: 13px;
    line-height: 1;
}
.codwo-extra-icon svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}
.codwo-extra-icon > i {
    font-size: 13px;
    line-height: 1;
}
.codwo-extra-main { display: flex; flex-direction: column; gap: 2px; }
.codwo-extra-label { font-weight: 600; color: var(--codwo-text, #2c3e50); }
.codwo-extra-description { font-size: 0.85em; color: var(--codwo-text-muted, #7a8a99); }
.codwo-extra-price { font-weight: 700; color: var(--codwo-accent, #ef6c00); font-variant-numeric: tabular-nums; }

.codwo-is-hidden { display: none !important; }
.codwo-shortcode-error { padding: 10px 14px; background: #fdecea; border: 1px solid #f4a4a4; color: #842029; border-radius: 6px; }

/* ============================================================
   Inline product header (image + title + live total)
   Used when codwo_form_header_layout = inline.
   ============================================================ */
.codwo-product-header {
    display: grid;
    grid-template-columns: 76px 1fr;
    gap: 14px;
    align-items: center;
    padding: 14px;
    background: var(--codwo-surface, #f8fafc);
    border: 1px solid var(--codwo-border, #e2e6ec);
    border-radius: var(--codwo-radius-card, 16px);
    margin: 0 0 18px;
}
.codwo-product-header__media img {
    width: 76px;
    height: 76px;
    object-fit: cover;
    border-radius: calc(var(--codwo-radius-card, 16px) - 4px);
    background: #fff;
    border: 1px solid var(--codwo-border, #e2e6ec);
    display: block;
}
.codwo-product-header__body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.codwo-product-header__title {
    margin: 0 !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    color: var(--codwo-text, #2c3e50);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-align: start !important;
    border: 0 !important;
    padding: 0 !important;
}
.codwo-product-header__desc {
    margin: 0 !important;
    font-size: 12px !important;
    color: var(--codwo-text-muted, #7a8a99);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.codwo-product-header__total {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    margin-top: 4px;
}
.codwo-product-header__total-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--codwo-text-muted, #7a8a99);
}
.codwo-product-header__total-value {
    font-weight: 800;
    font-size: 18px;
    color: var(--codwo-primary, #0073aa);
    font-variant-numeric: tabular-nums;
}
.codwo-product-header__price {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 2px;
    flex-wrap: wrap;
}
.codwo-product-header__price-value {
    font-weight: 700;
    font-size: 15px;
    color: var(--codwo-text, #2c3e50);
    font-variant-numeric: tabular-nums;
}
/* Strikethrough regular price shown next to the sale price */
.codwo-product-header__price-regular {
    font-size: 12px;
    font-weight: 500;
    color: var(--codwo-text-muted, #94a3b8);
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
    font-variant-numeric: tabular-nums;
    opacity: 0.85;
}

/* Stand-alone product price (stacked header) + universal stock badge */
.codwo-form-product-price {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin: 0 0 12px;
    flex-wrap: wrap;
}
.codwo-product-price-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--codwo-primary, #0073aa);
    font-variant-numeric: tabular-nums;
}
.codwo-product-price-regular {
    font-size: 13px;
    font-weight: 500;
    color: var(--codwo-text-muted, #94a3b8);
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
    font-variant-numeric: tabular-nums;
    opacity: 0.85;
}
.codwo-stock-badge {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 3px 8px;
    border-radius: 999px;
    line-height: 1.4;
}
.codwo-stock-badge.codwo-stock--in {
    background: rgba(22, 163, 74, 0.12);
    color: var(--codwo-success, #16a34a);
}
.codwo-stock-badge.codwo-stock--low {
    background: rgba(239, 108, 0, 0.14);
    color: var(--codwo-accent, #ef6c00);
}
.codwo-stock-badge.codwo-stock--out {
    background: rgba(220, 38, 38, 0.12);
    color: var(--codwo-danger, #dc2626);
}
/* Hide the redundant title beneath the inline header. */
.codwo-header-inline > .codwo-form-title:not(.codwo-product-header__title) { display: none; }
.codwo-header-inline > .codwo-form-product-media { display: none; }

/* Form heading (rendered *inside* the form card, above the product header).
   Compact block: title + optional description, left-aligned with the body. */
.codwo-form-heading {
    margin: 0 0 14px;
    padding: 0 0 14px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--codwo-border, #e5e7eb);
    text-align: start;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.codwo-form-heading:last-child {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}
.codwo-product-form-wrapper .codwo-form-heading__title {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.015em !important;
    color: var(--codwo-text, #1f2933) !important;
}
.codwo-product-form-wrapper .codwo-form-heading__desc {
    margin: 0 !important;
    font-size: 13.5px !important;
    line-height: 1.55 !important;
    color: var(--codwo-text-muted, #64748b) !important;
}
.codwo-rtl .codwo-form-heading { text-align: right; }
@media (max-width: 540px) {
    .codwo-product-form-wrapper .codwo-form-heading__title { font-size: 18px !important; }
    .codwo-product-form-wrapper .codwo-form-heading__desc  { font-size: 13px !important; }
}

/* Skin-specific heading tweaks — keep the typographic identity of each skin. */
.codwo-skin-editorial .codwo-form-heading__title {
    font-family: 'Fraunces', 'Playfair Display', Georgia, serif !important;
    font-weight: 500 !important;
    font-size: 26px !important;
    letter-spacing: -0.02em !important;
}
.codwo-skin-classic .codwo-form-heading__title {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-weight: 700 !important;
    font-size: 24px !important;
    color: #16243b !important;
}
.codwo-skin-classic .codwo-form-heading {
    border-bottom: 2px solid #1f3a5f;
    padding-bottom: 12px;
}
.codwo-skin-bold .codwo-form-heading__title {
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: 0.02em !important;
    font-size: 22px !important;
    color: #0a0a0a !important;
}
.codwo-skin-bold .codwo-form-heading {
    border-bottom: 3px solid #0a0a0a;
    padding-bottom: 12px;
}
.codwo-skin-minimal .codwo-form-heading__title {
    font-size: 18px !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
}
.codwo-skin-minimal .codwo-form-heading {
    border-bottom-color: #ededed;
}
.codwo-skin-card .codwo-form-heading {
    border-bottom-color: #ecebff;
}
.codwo-skin-cod .codwo-form-heading {
    border-bottom-color: #e2e8f0;
}

/* ============================================================
   Universal swatch polish (works on top of swatches.css)
   ============================================================ */
.codwo-swatches-wrapper {
    gap: 12px;
    align-items: flex-start;
}
.codwo-swatch-item {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 4px;
    border-radius: var(--codwo-radius-input, 10px);
}
.codwo-swatch-item .codwo-swatch-label {
    margin-top: 0;
    font-size: 11px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--codwo-text-muted, #7a8a99);
    line-height: 1;
    white-space: nowrap;
}
.codwo-swatch-item .codwo-color-swatch {
    width: var(--codwo-swatch-size, 36px);
    height: var(--codwo-swatch-size, 36px);
    border-radius: 50%;
    border: 2px solid var(--codwo-bg, #fff);
    box-shadow: 0 0 0 1px var(--codwo-border, #e2e6ec);
    transition: box-shadow .15s ease, transform .15s ease;
}
.codwo-swatch-item:hover .codwo-color-swatch {
    box-shadow: 0 0 0 1px var(--codwo-primary, #0073aa);
}
.codwo-swatch-item.selected .codwo-color-swatch {
    box-shadow: 0 0 0 2px var(--codwo-primary, #0073aa);
    transform: scale(1.04);
}
.codwo-swatch-item.selected .codwo-swatch-label {
    color: var(--codwo-text, #2c3e50);
    font-weight: 700;
}
.codwo-swatch-item .codwo-image-swatch {
    width: calc(var(--codwo-swatch-size, 36px) * 1.6);
    height: calc(var(--codwo-swatch-size, 36px) * 1.6);
    border-radius: var(--codwo-radius-input, 10px);
    border: 2px solid var(--codwo-border, #e2e6ec);
    object-fit: cover;
    transition: border-color .15s ease, transform .15s ease;
}
.codwo-swatch-item:hover .codwo-image-swatch { border-color: var(--codwo-primary, #0073aa); }
.codwo-swatch-item.selected .codwo-image-swatch {
    border-color: var(--codwo-primary, #0073aa);
    transform: scale(1.03);
}
.codwo-swatch-item .codwo-button-swatch {
    min-width: 46px;
    min-height: var(--codwo-swatch-size, 36px);
    padding: 6px 14px;
    border: 1px solid var(--codwo-border, #e2e6ec);
    border-radius: var(--codwo-radius-input, 10px);
    background: var(--codwo-bg, #fff);
    color: var(--codwo-text, #2c3e50);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.1;
    transition: all .15s ease;
}
.codwo-swatch-item:hover .codwo-button-swatch {
    border-color: var(--codwo-primary, #0073aa);
    color: var(--codwo-primary, #0073aa);
}
.codwo-swatch-item.selected .codwo-button-swatch {
    background: var(--codwo-primary, #0073aa);
    color: var(--codwo-button-text, #fff);
    border-color: var(--codwo-primary, #0073aa);
}


/* ============================================================
   SKIN: MODERN — polished bundle/promo layout
   Three-column grid (media | info | pricing) with anchored badges,
   tighter type scale, and clear selected state.
   ============================================================ */
.codwo-skin-modern .codwo-promo-options {
    gap: 12px;
}
.codwo-skin-modern .codwo-promo-option {
    grid-template-columns: 72px minmax(0, 1fr);
    grid-template-rows: auto auto;
    padding: 14px 16px;
    min-height: 0;
    column-gap: 14px;
    row-gap: 6px;
    border-radius: 14px;
    border: 1.5px solid var(--codwo-border, #d7dee8);
    background: #fff !important;
    box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .2s ease;
    overflow: visible;
}
.codwo-skin-modern .codwo-promo-option-media {
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 72px;
    height: 72px;
    border-radius: 10px;
    border: 1px solid var(--codwo-border, #e2e8f0);
    align-self: center;
}
.codwo-skin-modern .codwo-promo-option-main {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    gap: 3px;
    min-width: 0;
    flex-direction: column;
    display: flex;
}
.codwo-skin-modern .codwo-promo-option-title {
    font-size: 16.5px !important;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.3;
    color: var(--codwo-text, #0f172a);
}
.codwo-skin-modern .codwo-promo-option-subtitle {
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--codwo-text-muted, #64748b);
}
.codwo-skin-modern .codwo-promo-option-badge {
    align-self: flex-start;
    margin-top: 4px;
    font-size: 10.5px;
    padding: 3px 9px;
    border-radius: 999px;
    background: var(--codwo-success, #16a34a);
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.35;
    white-space: nowrap;
}
.codwo-skin-modern .codwo-promo-option-pricing {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: flex-start;
    gap: 4px 10px;
    text-align: start;
    flex-wrap: wrap;
}
.codwo-skin-modern .codwo-promo-option-new-price {
    font-size: 20px !important;
    font-weight: 800;
    color: var(--codwo-success, #16a34a);
    line-height: 1.1;
    letter-spacing: -0.015em;
    font-variant-numeric: tabular-nums;
}
.codwo-skin-modern .codwo-promo-option-old-price {
    font-size: 12px;
    color: #94a3b8;
    font-weight: 500;
}
.codwo-skin-modern .codwo-promo-option-recommended {
    position: absolute;
    top: -10px;
    inset-inline-start: 18px;
    padding: 4px 10px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 999px;
    background: linear-gradient(135deg, #f59e0b, #ea580c);
    color: #fff;
    box-shadow: 0 3px 8px rgba(234, 88, 12, 0.32);
    z-index: 2;
    line-height: 1.4;
    white-space: nowrap;
    display: none;
    align-items: center;
    grid-row: auto;
    grid-column: auto;
    justify-self: auto;
    margin-top: 0;
}
.codwo-skin-modern .codwo-promo-option.is-highlighted .codwo-promo-option-recommended {
    display: inline-flex;
}
.codwo-skin-modern .codwo-promo-option:hover {
    border-color: var(--codwo-primary, #0f4c81);
    box-shadow: 0 8px 20px -6px rgba(15, 76, 129, 0.14);
    background: #fff !important;
    transform: translateY(-1px);
}
.codwo-skin-modern .codwo-promo-option.selected {
    border-color: var(--codwo-success, #16a34a);
    background: var(--codwo-success-soft, #ecfdf5) !important;
    box-shadow: 0 6px 16px -4px rgba(22, 163, 74, 0.22) !important;
    transform: none;
}
.codwo-skin-modern .codwo-promo-option.selected:hover {
    background: var(--codwo-success-soft, #ecfdf5) !important;
    transform: translateY(-1px);
}

/* RTL — flip the 2-column grid so media sits on the right */
.codwo-rtl.codwo-skin-modern .codwo-promo-option {
    grid-template-columns: minmax(0, 1fr) 72px;
}
.codwo-rtl.codwo-skin-modern .codwo-promo-option-media { grid-column: 2; }
.codwo-rtl.codwo-skin-modern .codwo-promo-option-main { grid-column: 1; }
.codwo-rtl.codwo-skin-modern .codwo-promo-option-pricing {
    grid-column: 1;
    justify-content: flex-end;
    text-align: end;
}
.codwo-rtl.codwo-skin-modern .codwo-promo-option-recommended {
    inset-inline-start: auto;
    inset-inline-end: 18px;
}

/* Small screens — tighter image + padding; layout stays the same stacked order */
@media (max-width: 560px) {
    .codwo-skin-modern .codwo-promo-option {
        grid-template-columns: 60px minmax(0, 1fr);
        column-gap: 12px;
        padding: 12px 14px;
    }
    .codwo-skin-modern .codwo-promo-option-media {
        width: 60px;
        height: 60px;
    }
    .codwo-skin-modern .codwo-promo-option-new-price {
        font-size: 18px !important;
    }
    .codwo-skin-modern .codwo-promo-option-title {
        font-size: 15.5px !important;
    }
    .codwo-rtl.codwo-skin-modern .codwo-promo-option {
        grid-template-columns: minmax(0, 1fr) 60px;
    }
}


/* ============================================================
   SKIN: MINIMAL — monochrome, borderless, line-only inputs
   Visually distinct from Modern: no card shadow, hairline dividers,
   bottom-line inputs, small-caps section labels.
   ============================================================ */
.codwo-skin-minimal.codwo-product-form-wrapper {
    --codwo-bg: #ffffff;
    --codwo-surface: #fafafa;
    --codwo-border: #ececec;
    --codwo-text: #0a0a0a;
    --codwo-text-muted: #737373;
    --codwo-primary: #0a0a0a;
    --codwo-button-bg: #0a0a0a;
    --codwo-button-bg-hover: #000000;
    --codwo-accent: #0a0a0a;

    max-width: 520px;
    background: var(--codwo-bg, #ffffff);
    border: 1px solid var(--codwo-border, #ededed);
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(10, 10, 10, 0.03);
    padding: 0;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    letter-spacing: -0.005em;
    color: var(--codwo-text, #0a0a0a);
}
.codwo-skin-minimal .codwo-product-form {
    padding: 32px 32px 8px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.codwo-skin-minimal .codwo-form-title {
    font-size: 24px;
    font-weight: 600;
    text-align: start;
    margin: 0 0 2px;
    color: var(--codwo-title-color, var(--codwo-text, #0a0a0a));
    letter-spacing: -0.02em;
    line-height: 1.2;
}
.codwo-skin-minimal .codwo-form-description {
    color: var(--codwo-text-muted, #737373);
    font-size: 14px;
    line-height: 1.55;
    margin: 0 0 4px;
    text-align: start;
}
.codwo-skin-minimal .codwo-form-product-media {
    justify-content: flex-start;
    margin-bottom: 4px;
}
.codwo-skin-minimal .codwo-form-product-media img {
    width: 100%;
    max-width: 200px;
    border-radius: 6px;
    border: 1px solid #ededed;
    box-shadow: none;
}

/* Section labels: small-caps gray */
.codwo-skin-minimal .codwo-promo-selector-section h4,
.codwo-skin-minimal .codwo-variations-section h4,
.codwo-skin-minimal .codwo-coupon-section h4,
.codwo-skin-minimal .codwo-fbt-title,
.codwo-skin-minimal .codwo-extras-title,
.codwo-skin-minimal .codwo-bank-transfer-section h4 {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #8a8a8a;
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f1f1f1;
}

/* Offers — refined bundle cards (single-column stack, no overlap) */
.codwo-skin-minimal .codwo-promo-options { gap: 10px; }
.codwo-skin-minimal .codwo-promo-option {
    border: 1px solid #e5e5e5 !important;
    border-radius: 6px !important;
    background: #fff !important;
    box-shadow: none !important;
    padding: 14px 16px;
    min-height: 0;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    column-gap: 0;
    row-gap: 6px;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
    overflow: visible;
}
.codwo-skin-minimal .codwo-promo-option-media { display: none; }
.codwo-skin-minimal .codwo-promo-option-main {
    grid-column: 1;
    grid-row: 1;
    gap: 3px;
    align-self: start;
}
.codwo-skin-minimal .codwo-promo-option-title {
    font-size: 14px; font-weight: 600;
    color: #0a0a0a; letter-spacing: -0.005em; line-height: 1.3;
}
.codwo-skin-minimal .codwo-promo-option-subtitle {
    font-size: 12.5px; color: #8a8a8a; line-height: 1.45;
}
.codwo-skin-minimal .codwo-promo-option-badge {
    align-self: flex-start;
    margin-top: 4px;
    background: #0a0a0a;
    color: #fff;
    border-radius: 2px;
    padding: 3px 8px;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 1.4;
}
.codwo-skin-minimal .codwo-promo-option-pricing {
    grid-column: 1;
    grid-row: 2;
    justify-self: start;
    text-align: start;
    align-self: start;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 10px;
}
.codwo-skin-minimal .codwo-promo-option-new-price {
    font-size: 17px; font-weight: 700;
    color: #0a0a0a;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}
.codwo-skin-minimal .codwo-promo-option-old-price {
    font-size: 12px; color: #b5b5b5; text-decoration: line-through;
}
.codwo-skin-minimal .codwo-promo-option:hover {
    border-color: #0a0a0a !important;
    background: #fafafa !important;
}
.codwo-skin-minimal .codwo-promo-option.selected {
    border-color: #0a0a0a !important;
    background: #fafafa !important;
    box-shadow: inset 0 0 0 1px #0a0a0a !important;
}
.codwo-skin-minimal .codwo-promo-option-recommended {
    position: absolute;
    top: -9px;
    inset-inline-start: 14px;
    background: #0a0a0a;
    color: #fff;
    border-radius: 2px;
    font-size: 9px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 700;
    padding: 3px 9px;
    line-height: 1.4;
    z-index: 2;
    display: none;
    align-items: center;
}
.codwo-skin-minimal .codwo-promo-option.is-highlighted .codwo-promo-option-recommended {
    display: inline-flex;
}
.codwo-rtl.codwo-skin-minimal .codwo-promo-option-recommended {
    inset-inline-start: auto;
    inset-inline-end: 14px;
}

/* Inputs: clean full-border fields — visible click target, still minimal */
.codwo-skin-minimal .codwo-field-group label,
.codwo-skin-minimal .codwo-variation-group label,
.codwo-skin-minimal .codwo-quantity-section label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #525252;
    margin-bottom: 8px;
}
.codwo-skin-minimal .codwo-field-group input,
.codwo-skin-minimal .codwo-field-group textarea,
.codwo-skin-minimal .codwo-variation-select {
    background: #fafafa;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    padding: 12px 14px;
    color: #0a0a0a;
    box-shadow: none;
    font-size: 14px;
    line-height: 1.4;
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.codwo-skin-minimal .codwo-field-group textarea {
    min-height: 92px;
    resize: vertical;
}
.codwo-skin-minimal .codwo-field-group input::placeholder,
.codwo-skin-minimal .codwo-field-group textarea::placeholder {
    color: #a3a3a3;
}
.codwo-skin-minimal .codwo-field-group input:hover,
.codwo-skin-minimal .codwo-field-group textarea:hover,
.codwo-skin-minimal .codwo-variation-select:hover {
    border-color: #c4c4c4;
    background: #fff;
}
.codwo-skin-minimal .codwo-field-group input:focus,
.codwo-skin-minimal .codwo-field-group textarea:focus,
.codwo-skin-minimal .codwo-variation-select:focus {
    background: #fff;
    border-color: #0a0a0a;
    box-shadow: 0 0 0 3px rgba(10, 10, 10, 0.08);
    outline: none;
}
.codwo-skin-minimal .codwo-field-group input.error,
.codwo-skin-minimal .codwo-field-group textarea.error {
    border-color: #dc2626;
    background: #fff5f5;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}
.codwo-skin-minimal .codwo-field-group input.success,
.codwo-skin-minimal .codwo-field-group textarea.success {
    border-color: #16a34a;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.08);
}
/* Quantity controls — match input radius + border (logical props for RTL) */
.codwo-skin-minimal .codwo-quantity-controls { border-radius: 6px; }
.codwo-skin-minimal .codwo-qty-minus,
.codwo-skin-minimal .codwo-qty-plus {
    border: 1px solid #e5e5e5;
    background: #fafafa;
    color: #0a0a0a;
}
.codwo-skin-minimal .codwo-qty-minus {
    border-start-start-radius: 6px;
    border-end-start-radius: 6px;
}
.codwo-skin-minimal .codwo-qty-plus {
    border-start-end-radius: 6px;
    border-end-end-radius: 6px;
}
.codwo-skin-minimal .codwo-qty-minus:hover,
.codwo-skin-minimal .codwo-qty-plus:hover {
    border-color: #0a0a0a;
    background: #fff;
    color: #0a0a0a;
}
.codwo-skin-minimal .codwo-quantity-controls input {
    background: #fff;
    border-color: #e5e5e5;
    color: #0a0a0a;
}

/* Swatches: small mono swatches with thin underline on active */
.codwo-skin-minimal .codwo-color-swatch {
    width: 30px; height: 30px;
    box-shadow: 0 0 0 1px #e0e0e0;
}
.codwo-skin-minimal .codwo-swatch-item.selected .codwo-color-swatch {
    box-shadow: 0 0 0 2px #0a0a0a;
}
.codwo-skin-minimal .codwo-button-swatch {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #fff; color: #0a0a0a;
    font-weight: 500;
    padding: 8px 14px;
    font-size: 13px;
}
.codwo-skin-minimal .codwo-swatch-item.selected .codwo-button-swatch {
    background: #0a0a0a; color: #fff; border-color: #0a0a0a;
}

/* Summary: borderless, hairlines */
.codwo-skin-minimal .codwo-order-summary {
    background: transparent;
    border: 0;
    border-top: 1px solid #ededed;
    border-bottom: 1px solid #ededed;
    border-radius: 0;
    padding: 18px 0;
}
.codwo-skin-minimal .codwo-summary-row {
    font-size: 13.5px;
    color: #525252;
    padding: 6px 0;
    border: 0;
}
.codwo-skin-minimal .codwo-summary-row strong { color: #0a0a0a; font-weight: 500; }
.codwo-skin-minimal .codwo-total-row {
    border-top: 1px solid #ededed;
    padding-top: 14px;
    margin-top: 10px;
    font-size: 15px;
}
.codwo-skin-minimal .codwo-total-row strong:first-child { font-weight: 600; color: #0a0a0a; letter-spacing: -0.005em; }
.codwo-skin-minimal .codwo-total-price {
    font-size: 20px;
    font-weight: 700;
    color: #0a0a0a;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}

/* Submit: full-width black bar, sharp corners.
   Theme-aware: button colors fall through to Theme Studio when set. */
.codwo-skin-minimal .codwo-submit-btn {
    background: var(--codwo-button-bg, #0a0a0a);
    color: var(--codwo-button-text, #fff);
    border: 0;
    border-radius: 4px;
    padding: 16px 20px;
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    box-shadow: none;
    transition: background .18s ease;
}
.codwo-skin-minimal .codwo-submit-btn:hover {
    background: var(--codwo-button-bg-hover, var(--codwo-button-bg, #000));
    transform: none;
    box-shadow: none;
}

/* Trust badges — small, all-uppercase, no chips */
.codwo-skin-minimal .codwo-trust-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    justify-content: center;
    padding: 20px 32px;
    background: transparent;
    border-top: 1px solid #ededed;
    margin: 0;
}
.codwo-skin-minimal .codwo-badge {
    background: transparent;
    border: 0;
    padding: 0;
    font-size: 10px;
    color: #8a8a8a;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 600;
}
.codwo-skin-minimal .codwo-badge-icon { color: #0a0a0a; }

/* Inline header tweaks for minimal */
.codwo-skin-minimal .codwo-product-header {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #ededed;
    border-radius: 0;
    padding: 0 0 8px;
    margin-bottom: 8px;
}
.codwo-skin-minimal .codwo-product-header__media img {
    border-radius: 4px;
    border: 1px solid #ececec;
}
.codwo-skin-minimal .codwo-product-header__total-value { color: #111; }


/* ============================================================
   SKIN: EDITORIAL — warm cream, serif headers, refined cards
   (matches UI/minimal form.html mockup)
   ============================================================ */
.codwo-skin-editorial.codwo-product-form-wrapper {
    --codwo-bg: #FFFFFF;
    --codwo-surface: #FAF8F3;
    --codwo-border: #E7E2D6;
    --codwo-border-strong: #D9D2BF;
    --codwo-text: #0F0F0E;
    --codwo-text-muted: #9B968C;
    --codwo-primary: #0F0F0E;
    --codwo-primary-strong: #000000;
    --codwo-button-bg: #0F0F0E;
    --codwo-button-bg-hover: #000000;
    --codwo-accent: #C2410C;
    --codwo-success: #2F6B40;

    max-width: 480px;
    background: var(--codwo-bg, #FFFFFF);
    background-image:
        radial-gradient(at 10% 0%, rgba(194,65,12,0.04) 0%, transparent 40%),
        radial-gradient(at 100% 100%, rgba(15,15,14,0.03) 0%, transparent 40%);
    border: 1px solid var(--codwo-border, #E7E2D6);
    border-radius: 22px;
    box-shadow: 0 20px 50px -20px rgba(15,15,14,0.12);
    padding: 0;
    overflow: hidden;
    font-family: 'Geist', 'SF Pro Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    letter-spacing: -0.005em;
}
.codwo-skin-editorial .codwo-product-form { padding: 24px 15px 5px; gap: 22px; display: flex; flex-direction: column; }

.codwo-skin-editorial .codwo-form-title {
    font-family: 'Fraunces', 'Playfair Display', Georgia, serif;
    font-weight: 500;
    font-size: 28px;
    letter-spacing: -0.02em;
    text-align: start;
    margin: 0 0 14px;
    line-height: 1.1;
}
.codwo-skin-editorial .codwo-form-product-media {
    justify-content: flex-start;
    margin-bottom: 18px;
}
.codwo-skin-editorial .codwo-form-product-media img {
    width: 76px; height: 76px;
    border-radius: 12px;
    border: 1px solid #EFEBE0;
    box-shadow: none;
}

.codwo-skin-editorial .codwo-promo-selector-section h4,
.codwo-skin-editorial .codwo-variations-section h4,
.codwo-skin-editorial .codwo-coupon-section h4,
.codwo-skin-editorial .codwo-fbt-title,
.codwo-skin-editorial .codwo-extras-title,
.codwo-skin-editorial .codwo-bank-transfer-section h4 {
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: #9B968C;
    margin: 0 0 20px;
}

/* Offer cards */
.codwo-skin-editorial .codwo-promo-option {
    border-radius: 12px;
    border: 1px solid #E7E2D6;
    background: #FFFFFF !important;
    box-shadow: none !important;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    padding: 14px 16px;
    min-height: 0;
    transition: border-color .2s ease, background .2s ease;
}
.codwo-skin-editorial .codwo-promo-option-media { display: none; }
.codwo-skin-editorial .codwo-promo-option-main {
    display: flex; flex-direction: column; gap: 2px;
}
.codwo-skin-editorial .codwo-promo-option-title { font-size: 15px; font-weight: 500; color: #0F0F0E; letter-spacing: -0.01em; }
.codwo-skin-editorial .codwo-promo-option-subtitle { font-size: 12px; color: #9B968C; }
.codwo-skin-editorial .codwo-promo-option-pricing { text-align: end; }
.codwo-skin-editorial .codwo-promo-option-new-price { font-size: 15px; font-weight: 600; color: #0F0F0E; }
.codwo-skin-editorial .codwo-promo-option-old-price { font-size: 12px; color: #9B968C; text-decoration: line-through; }
.codwo-skin-editorial .codwo-promo-option:hover { border-color: #525049; }
.codwo-skin-editorial .codwo-promo-option.selected {
    border-color: #0F0F0E;
    background: #FAF8F3 !important;
    box-shadow: none !important;
}
.codwo-skin-editorial .codwo-promo-option.is-highlighted::before {
    content: attr(data-promo-highlight-label);
    position: absolute; top: 0; inset-inline-end: 14px;
    transform: translateY(-50%);
    font-size: 9px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
    background: #0F0F0E; color: #fff;
    padding: 3px 9px; border-radius: 999px;
}
.codwo-skin-editorial .codwo-promo-option-recommended {
    background: #0F0F0E; color: #fff;
    border-radius: 999px; padding: 3px 9px;
    font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600;
    position: absolute; top: -10px; inset-inline-end: 14px;
}

/* Swatches */
.codwo-skin-editorial .codwo-color-swatch { width: 30px; height: 30px; border-radius: 50%; box-shadow: 0 0 0 1px #E7E2D6; }
.codwo-skin-editorial .codwo-swatch-item.selected .codwo-color-swatch { box-shadow: 0 0 0 2px #0F0F0E; }
.codwo-skin-editorial .codwo-button-swatch {
    min-width: 46px; height: 38px; padding: 0 12px;
    border: 1px solid #E7E2D6; border-radius: 8px;
    font-weight: 500; background: #FFFFFF; color: #0F0F0E;
    display: inline-flex; align-items: center; justify-content: center;
}
.codwo-skin-editorial .codwo-swatch-item.selected .codwo-button-swatch { background: #0F0F0E; color: #fff; border-color: #0F0F0E; }

/* Inputs */
.codwo-skin-editorial .codwo-field-group label {
    font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.09em; color: #9B968C;
    margin-bottom: 6px;
}
.codwo-skin-editorial .codwo-field-group input,
.codwo-skin-editorial .codwo-field-group textarea,
.codwo-skin-editorial .codwo-variation-select {
    background: #FAF8F3;
    border: 1px solid transparent;
    border-radius: 12px;
    color: #0F0F0E;
}
.codwo-skin-editorial .codwo-field-group input:focus,
.codwo-skin-editorial .codwo-field-group textarea:focus,
.codwo-skin-editorial .codwo-variation-select:focus {
    background: #fff; border-color: #0F0F0E; box-shadow: none;
}

/* Coupon */
.codwo-skin-editorial .codwo-coupon-section { padding: 0; background: transparent; border: none; }
.codwo-skin-editorial .codwo-coupon-input { border-radius: 12px; }
.codwo-skin-editorial .codwo-coupon-section .codwo-btn-secondary,
.codwo-skin-editorial .codwo-coupon-section button:not(.codwo-coupon-toggle) { background: #0F0F0E; color: #fff; border-radius: 12px; border: none; }

/* Summary */
.codwo-skin-editorial .codwo-order-summary {
    background: #F4F1EA;
    border-radius: 16px;
    padding: 16px 18px;
    border: none;
}
.codwo-skin-editorial .codwo-summary-row { font-size: 14px; color: #525049; padding: 4px 0; border: none; }
.codwo-skin-editorial .codwo-total-row {
    border-top: 1px solid #E7E2D6;
    padding-top: 11px; margin-top: 6px;
}
.codwo-skin-editorial .codwo-total-row strong:first-child { font-size: 14px; font-weight: 500; color: #0F0F0E; }
.codwo-skin-editorial .codwo-total-price {
    font-family: 'Fraunces', 'Playfair Display', Georgia, serif;
    font-size: 26px; font-weight: 500; letter-spacing: -0.03em; color: #0F0F0E;
}

/* Submit + Whatsapp */
.codwo-skin-editorial .codwo-submit-btn {
    background: var(--codwo-button-bg, #0F0F0E); color: var(--codwo-button-text, #fff);
    border: none; border-radius: 12px;
    padding: 15px 18px; font-weight: 500; font-size: 15px;
    letter-spacing: -0.01em; box-shadow: none;
    text-transform: none;
}
.codwo-skin-editorial .codwo-submit-btn:hover {
    background: var(--codwo-button-bg-hover, var(--codwo-button-bg, #000)); transform: translateY(-1px);
    box-shadow: 0 8px 20px -8px rgba(15,15,14,0.4);
}

/* Trust */
.codwo-skin-editorial .codwo-trust-badges {
    border-top: 1px solid #EFEBE0; padding: 18px 24px; margin: 0;
    background: transparent; gap: 18px; justify-content: center;
}
.codwo-skin-editorial .codwo-badge { font-size: 12px; color: #9B968C; background: transparent; padding: 0; }


/* ============================================================
   SKIN: COD — modern Bootstrap-style with urgency + dashed warranty
   (matches UI/cod form ui.html mockup)
   ============================================================ */
.codwo-skin-cod.codwo-product-form-wrapper {
    --codwo-bg: #ffffff;
    --codwo-surface: #f8fafc;
    --codwo-surface-muted: #f1f5f9;
    --codwo-border: #e2e8f0;
    --codwo-border-strong: #cbd5e1;
    --codwo-text: #0f172a;
    --codwo-text-muted: #64748b;
    --codwo-primary: #2563eb;
    --codwo-primary-strong: #1d4ed8;
    --codwo-button-bg: #2563eb;
    --codwo-button-bg-hover: #1d4ed8;
    --codwo-accent: #f59e0b;
    --codwo-success: #10b981;

    max-width: 520px;
    background: var(--codwo-bg, #ffffff);
    border: 1px solid var(--codwo-border, #e5e7eb);
    border-radius: 16px;
    box-shadow: 0 10px 30px -12px rgba(15, 23, 42, 0.12);
    padding: 0;
    overflow: hidden;
    font-family: 'Manrope', 'Cairo', system-ui, -apple-system, sans-serif;
    color: var(--codwo-text, #0f172a);
}
.codwo-skin-cod .codwo-product-form {
    padding: 22px 22px 5px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.codwo-skin-cod .codwo-form-title {
    font-size: 19px;
    font-weight: 800;
    text-align: start;
    margin: 0 0 6px;
    color: var(--codwo-title-color, var(--codwo-text, #0f172a));
    letter-spacing: -0.015em;
    line-height: 1.25;
}
.codwo-skin-cod .codwo-form-description {
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--codwo-text-muted, #64748b);
    margin: 0 0 4px;
    text-align: start;
}
.codwo-skin-cod .codwo-form-product-media {
    justify-content: flex-start; margin-bottom: 4px;
}
.codwo-skin-cod .codwo-form-product-media img {
    width: 72px; height: 72px; border-radius: 10px;
    border: 1px solid #e2e8f0; box-shadow: none; object-fit: cover;
}

.codwo-product-form-wrapper.codwo-skin-cod .codwo-promo-selector-section h4,
.codwo-product-form-wrapper.codwo-skin-cod .codwo-variations-section h4,
.codwo-product-form-wrapper.codwo-skin-cod .codwo-coupon-section h4,
.codwo-product-form-wrapper.codwo-skin-cod .codwo-fbt-title,
.codwo-product-form-wrapper.codwo-skin-cod .codwo-extras-title,
.codwo-product-form-wrapper.codwo-skin-cod .codwo-bank-transfer-section h4 {
    font-size: 13px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 10px !important;
    letter-spacing: -0.005em !important;
    padding: 0 !important;
    border: 0 !important;
    text-transform: none !important;
}

/* Offer cards — 2-col with product image, title+pricing+badge stacked */
.codwo-skin-cod .codwo-promo-options { gap: 12px; }
.codwo-skin-cod .codwo-promo-option {
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 14px !important;
    background: #fff !important;
    grid-template-columns: 64px minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto !important;
    column-gap: 14px !important;
    row-gap: 6px !important;
    padding: 14px 16px !important;
    min-height: 0;
    box-shadow: none !important;
    overflow: visible;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
/* Product image — now VISIBLE on COD bundle cards */
.codwo-skin-cod .codwo-promo-option-media {
    display: inline-flex !important;
    grid-column: 1 !important;
    grid-row: 1 / span 3 !important;
    width: 64px !important;
    height: 64px !important;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    background: #fff;
    align-self: center;
    overflow: hidden;
}
.codwo-skin-cod .codwo-promo-option-media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.codwo-skin-cod .codwo-promo-option-main {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: end;
    gap: 3px;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.codwo-skin-cod .codwo-promo-option-title {
    font-size: 14.5px !important;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.005em;
    line-height: 1.3;
}
.codwo-skin-cod .codwo-promo-option-subtitle {
    font-size: 12.5px;
    color: #64748b;
    line-height: 1.45;
}
.codwo-skin-cod .codwo-promo-option-pricing {
    grid-column: 2 !important;
    grid-row: 2 !important;
    align-self: start !important;
    justify-self: start;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 10px;
    text-align: start;
}
.codwo-skin-cod .codwo-promo-option-new-price {
    font-weight: 800;
    color: #2563eb;
    font-size: 17px !important;
    line-height: 1.1;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
}
.codwo-skin-cod .codwo-promo-option-old-price {
    font-size: 12px;
    color: #94a3b8;
    text-decoration: line-through;
}
.codwo-skin-cod .codwo-promo-option-badge {
    grid-column: 2 !important;
    grid-row: 3 !important;
    align-self: start;
    justify-self: start;
    margin-top: 2px;
    background: #10b981;
    color: #fff;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.4;
    white-space: nowrap;
    width: fit-content;
}
.codwo-skin-cod .codwo-promo-option.is-highlighted { border-color: #fcd34d !important; }
.codwo-skin-cod .codwo-promo-option-recommended {
    position: absolute; top: -9px; inset-inline-end: 14px;
    background: linear-gradient(135deg, #f59e0b, #d97706); color: #fff;
    font-size: 10px; font-weight: 800;
    padding: 3px 10px; border-radius: 999px; letter-spacing: 0.04em;
    text-transform: uppercase; line-height: 1.3;
    box-shadow: 0 2px 6px rgba(245, 158, 11, 0.35);
    z-index: 2;
    grid-column: auto !important;
    grid-row: auto !important;
    justify-self: auto;
    margin-top: 0;
    display: none;
    align-items: center;
}
.codwo-skin-cod .codwo-promo-option.is-highlighted .codwo-promo-option-recommended {
    display: inline-flex;
}
.codwo-skin-cod .codwo-promo-option:hover {
    border-color: #93c5fd !important;
    box-shadow: 0 4px 10px -2px rgba(37,99,235,0.1) !important;
    transform: translateY(-1px);
}
.codwo-skin-cod .codwo-promo-option.selected {
    border-color: #2563eb !important;
    background: #eff6ff !important;
    box-shadow: 0 4px 12px -4px rgba(37,99,235,0.25) !important;
    transform: none;
}
.codwo-skin-cod .codwo-promo-option.selected::before { display: none !important; }

/* RTL — flip media to the right, info to the left */
.codwo-rtl.codwo-skin-cod .codwo-promo-option {
    grid-template-columns: minmax(0, 1fr) 64px !important;
}
.codwo-rtl.codwo-skin-cod .codwo-promo-option-media {
    grid-column: 2 !important;
}
.codwo-rtl.codwo-skin-cod .codwo-promo-option-main {
    grid-column: 1 !important;
}
.codwo-rtl.codwo-skin-cod .codwo-promo-option-pricing,
.codwo-rtl.codwo-skin-cod .codwo-promo-option-badge {
    grid-column: 1 !important;
    justify-self: end;
    justify-content: flex-end;
    text-align: end;
}
.codwo-rtl.codwo-skin-cod .codwo-promo-option-recommended {
    inset-inline-start: auto;
    inset-inline-end: 14px;
}

/* Swatches */
.codwo-skin-cod .codwo-color-swatch { width: 30px; height: 30px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px #e2e8f0; }
.codwo-skin-cod .codwo-swatch-item:hover .codwo-color-swatch { box-shadow: 0 0 0 1px #93c5fd; }
.codwo-skin-cod .codwo-swatch-item.selected .codwo-color-swatch { box-shadow: 0 0 0 2px #2563eb; transform: scale(1.08); }
.codwo-skin-cod .codwo-button-swatch {
    min-width: 48px; height: 40px;
    padding: 0 14px; border: 1.5px solid #e2e8f0; border-radius: 10px;
    font-size: 13px; font-weight: 700; background: #fff; color: #0f172a;
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .18s ease;
}
.codwo-skin-cod .codwo-swatch-item:hover .codwo-button-swatch {
    border-color: #2563eb; color: #2563eb; background: #eff6ff;
}
.codwo-skin-cod .codwo-swatch-item.selected .codwo-button-swatch {
    background: #2563eb; color: #fff; border-color: #2563eb;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25);
}

/* FBT — COD treatment */
.codwo-skin-cod .codwo-fbt-section {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
}
.codwo-skin-cod .codwo-fbt-head::before {
    background: rgba(37, 99, 235, 0.12);
    color: #2563eb;
    border-radius: 6px;
}

/* Extras = upsell-style dashed amber box for COD */
.codwo-skin-cod .codwo-extras-section {
    background: #fffbeb; border: 1px dashed #f59e0b; border-radius: 12px;
    padding: 14px 16px;
}
.codwo-skin-cod .codwo-extra-row {
    background: transparent; border: none; padding: 8px 0;
    grid-template-columns: auto auto 1fr auto;
}
.codwo-skin-cod .codwo-extra-row.is-selected { background: transparent; }
.codwo-skin-cod .codwo-extra-icon { background: rgba(245,158,11,0.15); color: #f59e0b; }
.codwo-skin-cod .codwo-extra-label { color: #0f172a; font-weight: 700; font-size: 13.5px; }
.codwo-skin-cod .codwo-extra-description { color: #64748b; font-size: 12px; }
.codwo-skin-cod .codwo-extra-price { color: #d97706; font-weight: 800; font-size: 13.5px; }

/* Inputs */
.codwo-skin-cod .codwo-field-group label,
.codwo-skin-cod .codwo-variation-group label,
.codwo-skin-cod .codwo-quantity-section label {
    font-size: 13px; font-weight: 700; margin-bottom: 7px; color: #0f172a;
}
.codwo-skin-cod .codwo-field-group input,
.codwo-skin-cod .codwo-field-group textarea,
.codwo-skin-cod .codwo-variation-select {
    background: #f8fafc; border: 1.5px solid #e2e8f0; border-radius: 10px;
    padding: 12px 14px; font-size: 14px; color: #0f172a;
    transition: all .18s ease;
}
.codwo-skin-cod .codwo-field-group input::placeholder,
.codwo-skin-cod .codwo-field-group textarea::placeholder {
    color: #94a3b8;
}
.codwo-skin-cod .codwo-field-group input:focus,
.codwo-skin-cod .codwo-field-group textarea:focus,
.codwo-skin-cod .codwo-variation-select:focus {
    background: #fff; border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,0.12);
}

/* Coupon — COD blue pill */
.codwo-skin-cod .codwo-coupon-toggle,
.codwo-skin-cod .codwo-coupon-toggle:hover,
.codwo-skin-cod .codwo-coupon-toggle:focus {
    background: #eff6ff !important;
    border: 1px dashed #93c5fd !important;
    color: #2563eb !important;
    font-weight: 700;
}
.codwo-skin-cod .codwo-coupon-toggle:hover {
    background: #dbeafe !important;
    border-color: #2563eb !important;
}
.codwo-skin-cod .codwo-coupon-section {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px 16px;
}
.codwo-skin-cod .codwo-coupon-input {
    background: #fff !important;
    border-radius: 10px;
}
.codwo-skin-cod .codwo-coupon-section button:not(.codwo-coupon-toggle) {
    background: #2563eb;
    color: #fff;
    border: 1px solid #2563eb;
    border-radius: 10px;
    font-weight: 700;
    padding: 10px 16px;
}
.codwo-skin-cod .codwo-coupon-section button:not(.codwo-coupon-toggle):hover {
    background: #1d4ed8;
    border-color: #1d4ed8;
}

/* Summary */
.codwo-skin-cod .codwo-order-summary {
    background: #f8fafc; border: 1px solid #e2e8f0;
    border-radius: 12px; padding: 16px 18px;
}
.codwo-skin-cod .codwo-summary-row {
    font-size: 13.5px; color: #64748b; padding: 6px 0; border: none;
}
.codwo-skin-cod .codwo-summary-row strong { color: #0f172a; font-weight: 600; }
.codwo-skin-cod .codwo-total-row {
    border-top: 1px dashed #cbd5e1;
    padding-top: 12px; margin-top: 8px;
    font-size: 15px;
}
.codwo-skin-cod .codwo-total-row strong:first-child {
    font-size: 14px; font-weight: 700; color: #0f172a;
}
.codwo-skin-cod .codwo-total-price {
    color: #2563eb; font-weight: 800;
    font-size: 22px; letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}

/* Buttons — theme-aware: Theme Studio button color overrides the gradient. */
.codwo-skin-cod .codwo-submit-btn,
.codwo-skin-cod .codwo-submit-btn:hover,
.codwo-skin-cod .codwo-submit-btn:focus,
.codwo-skin-cod .codwo-submit-btn:active {
    background: var(--codwo-button-bg, linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%)) !important;
    background-color: var(--codwo-button-bg, #2563eb) !important;
    background-image: var(--codwo-button-bg-image, linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%)) !important;
    color: var(--codwo-button-text, #fff) !important;
    border: 1px solid var(--codwo-button-bg, #1d4ed8) !important;
    border-radius: 12px !important;
    padding: 15px 20px !important;
    font-weight: 800 !important;
    font-size: 15px !important;
    letter-spacing: -0.005em;
    box-shadow: 0 6px 18px -4px rgba(37,99,235,0.45);
    text-transform: none;
    text-shadow: none !important;
    transition: all .2s ease;
}
.codwo-skin-cod .codwo-submit-btn:hover {
    background: var(--codwo-button-bg-hover, var(--codwo-button-bg, linear-gradient(180deg, #1d4ed8 0%, #1e40af 100%))) !important;
    background-image: var(--codwo-button-bg-image-hover, linear-gradient(180deg, #1d4ed8 0%, #1e40af 100%)) !important;
    background-color: var(--codwo-button-bg-hover, var(--codwo-button-bg, #1d4ed8)) !important;
    box-shadow: 0 10px 22px -4px rgba(37,99,235,0.55);
    transform: translateY(-1px);
}
.codwo-skin-cod .codwo-submit-btn .codwo-btn-text,
.codwo-skin-cod .codwo-submit-btn .codwo-btn-price {
    color: var(--codwo-button-text, #fff) !important;
}

/* WhatsApp & Add-to-cart inside COD — match rounding */
.codwo-skin-cod .codwo-whatsapp-btn,
.codwo-skin-cod .codwo-add-to-cart-btn { border-radius: 12px; font-weight: 700; padding: 14px 18px; }

/* Trust */
.codwo-skin-cod .codwo-trust-badges {
    margin: 6px 0 0;
    padding: 7px 6px 7px;
    gap: 10px;
    justify-content: stretch;
    background: transparent;
    border-top: 1px solid #f1f5f9;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.codwo-skin-cod .codwo-badge {
    font-size: 11.5px; color: #64748b;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 8px 10px;
    font-weight: 600;
    gap: 6px;
}
.codwo-skin-cod .codwo-badge-icon { color: #2563eb; font-size: 13px; }


/* ============================================================
   SKIN: CLASSIC — navy + serif title + traditional borders
   ============================================================ */
.codwo-skin-classic.codwo-product-form-wrapper {
    --codwo-bg: #ffffff;
    --codwo-surface: #f7f9fc;
    --codwo-border: #d8dee6;
    --codwo-border-strong: #b9c2cf;
    --codwo-text: #16243b;
    --codwo-text-muted: #4f6275;
    --codwo-primary: #1f3a5f;
    --codwo-primary-strong: #142a48;
    --codwo-button-bg: #1f3a5f;
    --codwo-button-bg-hover: #142a48;
    --codwo-accent: #b8860b;
    --codwo-success: #2e7d32;

    max-width: 580px;
    background: var(--codwo-bg, #ffffff);
    border: 1px solid var(--codwo-border, #d8dee6);
    border-radius: 6px;
    box-shadow: 0 4px 14px rgba(31,58,95,0.08);
    font-family: Georgia, 'Times New Roman', 'Cairo', serif;
}

.codwo-skin-classic .codwo-form-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-weight: 700;
    border-bottom: 2px solid var(--codwo-primary, #1f3a5f);
    padding-bottom: 10px;
    margin-bottom: 24px;
    text-align: start;
    font-size: 28px;
    color: var(--codwo-title-color, var(--codwo-text, #16243b));
}

.codwo-skin-classic .codwo-promo-selector-section h4,
.codwo-skin-classic .codwo-variations-section h4,
.codwo-skin-classic .codwo-coupon-section h4,
.codwo-skin-classic .codwo-fbt-title,
.codwo-skin-classic .codwo-extras-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-weight: 700;
    font-size: 18px;
    color: #1f3a5f;
    border-bottom: 1px solid #d8dee6;
    padding-bottom: 6px;
    margin-bottom: 12px;
}

.codwo-skin-classic .codwo-promo-option {
    border-radius: 6px; border: 1px solid #d8dee6;
    background: #fff !important;
}
.codwo-skin-classic .codwo-promo-option:hover { border-color: #1f3a5f; box-shadow: none !important; }
.codwo-skin-classic .codwo-promo-option.selected {
    border-color: #1f3a5f; background: #f7f9fc !important;
    box-shadow: inset 4px 0 0 #b8860b !important;
}
.codwo-skin-classic .codwo-promo-option-recommended { background: #b8860b; color: #fff; border-radius: 0; }

.codwo-skin-classic .codwo-field-group input,
.codwo-skin-classic .codwo-field-group textarea,
.codwo-skin-classic .codwo-variation-select {
    border-radius: 4px; border: 1px solid #b9c2cf;
    background: #fff; font-family: inherit;
}
.codwo-skin-classic .codwo-field-group input:focus,
.codwo-skin-classic .codwo-field-group textarea:focus,
.codwo-skin-classic .codwo-variation-select:focus { border-color: #1f3a5f; box-shadow: 0 0 0 3px rgba(31,58,95,0.12); }

.codwo-skin-classic .codwo-order-summary {
    background: #f7f9fc; border: 1px solid #d8dee6; border-radius: 4px;
}

.codwo-skin-classic .codwo-order-summary {
    margin: 10px 0 !important;
}
.codwo-skin-classic .codwo-extras-section {
    border-radius: var(--codwo-radius-card, 4px);
}
.codwo-skin-classic .codwo-total-price { color: #1f3a5f; font-family: 'Playfair Display', Georgia, serif; font-size: 22px; }

.codwo-skin-classic .codwo-submit-btn {
    background: var(--codwo-button-bg, #1f3a5f); color: var(--codwo-button-text, #fff);
    border-radius: 4px; padding: 14px 18px;
    font-family: Georgia, serif; font-weight: 700; letter-spacing: 0.02em;
    text-transform: none; box-shadow: none;
}
.codwo-skin-classic .codwo-submit-btn:hover { background: var(--codwo-button-bg-hover, var(--codwo-button-bg, #142a48)); }


/* ============================================================
   SKIN: BOLD — yellow/black neo-brutalist with hard shadows
   ============================================================ */
.codwo-skin-bold.codwo-product-form-wrapper {
    --codwo-bg: #ffffff;
    --codwo-surface: #ffeb3b;
    --codwo-border: #0a0a0a;
    --codwo-border-strong: #0a0a0a;
    --codwo-text: #0a0a0a;
    --codwo-text-muted: #2c2c2c;
    --codwo-primary: #0a0a0a;
    --codwo-button-bg: #0a0a0a;
    --codwo-button-bg-hover: #1a1a1a;
    --codwo-accent: #ff3d00;
    --codwo-success: #00897b;

    background: var(--codwo-bg, #fffbe6);
    border: 3px solid var(--codwo-border, #0a0a0a);
    border-radius: 0;
    box-shadow: 10px 10px 0 0 var(--codwo-border, #0a0a0a);
    font-family: 'Inter', 'Cairo', system-ui, sans-serif;
}

.codwo-skin-bold .codwo-form-title {
    font-weight: 900; text-transform: uppercase; letter-spacing: 0.02em;
    text-align: start; font-size: 32px; color: var(--codwo-title-color, var(--codwo-text, #0a0a0a));
    border-bottom: 3px solid var(--codwo-text, #0a0a0a); padding-bottom: 12px;
}

.codwo-skin-bold .codwo-promo-selector-section h4,
.codwo-skin-bold .codwo-variations-section h4,
.codwo-skin-bold .codwo-coupon-section h4,
.codwo-skin-bold .codwo-fbt-title,
.codwo-skin-bold .codwo-extras-title {
    font-weight: 900; text-transform: uppercase; letter-spacing: 0.04em;
    font-size: 16px; color: #0a0a0a;
}

.codwo-skin-bold .codwo-promo-option,
.codwo-skin-bold .codwo-extra-row,
.codwo-skin-bold .codwo-fbt-card {
    border: 2px solid #0a0a0a;
    border-radius: 0;
    box-shadow: 5px 5px 0 0 #0a0a0a;
    background: #fff !important;
}
.codwo-skin-bold .codwo-promo-option:hover,
.codwo-skin-bold .codwo-fbt-card:hover {
    transform: translate(2px, 2px); box-shadow: 3px 3px 0 0 #0a0a0a !important;
}
.codwo-skin-bold .codwo-promo-option.selected {
    background: #ffeb3b !important; box-shadow: 5px 5px 0 0 #0a0a0a !important;
}
.codwo-skin-bold .codwo-promo-option-recommended {
    background: #ff3d00 !important; color: #fff;
    border: 2px solid #0a0a0a; border-radius: 0;
    font-weight: 900; padding: 4px 10px;
}

.codwo-skin-bold .codwo-extras-section { background: #ffeb3b; border: 2px solid #0a0a0a; border-radius: 0; }
.codwo-skin-bold .codwo-extra-icon { background: #0a0a0a; color: #ffeb3b; border-radius: 0; }

.codwo-skin-bold .codwo-field-group input,
.codwo-skin-bold .codwo-field-group textarea,
.codwo-skin-bold .codwo-variation-select {
    border: 2px solid #0a0a0a; border-radius: 0;
    background: #fff;
}
.codwo-skin-bold .codwo-field-group input:focus,
.codwo-skin-bold .codwo-field-group textarea:focus,
.codwo-skin-bold .codwo-variation-select:focus {
    box-shadow: 4px 4px 0 0 #0a0a0a; border-color: #0a0a0a;
}

.codwo-skin-bold .codwo-order-summary {
    background: #ffeb3b; border: 2px solid #0a0a0a; border-radius: 0;
}
.codwo-skin-bold .codwo-total-price { font-weight: 900; font-size: 22px; }

.codwo-skin-bold .codwo-submit-btn,
.codwo-skin-bold .codwo-submit-btn:hover,
.codwo-skin-bold .codwo-submit-btn:focus,
.codwo-skin-bold .codwo-submit-btn:active {
    background: var(--codwo-button-bg, #0a0a0a) !important;
    background-image: none !important;
    color: var(--codwo-button-text, #ffeb3b) !important;
    border: 2px solid var(--codwo-button-bg, #0a0a0a) !important;
    border-radius: 0 !important;
    box-shadow: 6px 6px 0 0 var(--codwo-button-bg, #0a0a0a) !important;
    padding: 14px 20px !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    font-size: 15px !important;
    text-shadow: none !important;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.codwo-skin-bold .codwo-submit-btn:hover {
    transform: translate(3px, 3px);
    box-shadow: 3px 3px 0 0 var(--codwo-button-bg, #0a0a0a) !important;
    background: var(--codwo-button-bg-hover, var(--codwo-button-bg, #1a1a1a)) !important;
}

/* WhatsApp button — same brutalist frame, keeps green brand fill */
.codwo-skin-bold .codwo-whatsapp-btn,
.codwo-skin-bold .codwo-whatsapp-btn:hover,
.codwo-skin-bold .codwo-whatsapp-btn:focus,
.codwo-skin-bold .codwo-whatsapp-btn:active {
    background: #25D366 !important;
    background-image: none !important;
    color: #0a0a0a !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    box-shadow: 6px 6px 0 0 #0a0a0a !important;
    padding: 14px 20px !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    font-size: 15px !important;
    text-shadow: none !important;
    margin-top: 12px;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.codwo-skin-bold .codwo-whatsapp-btn:hover {
    transform: translate(3px, 3px);
    box-shadow: 3px 3px 0 0 #0a0a0a !important;
    background: #1ebe5d !important;
    color: #0a0a0a !important;
}
.codwo-skin-bold .codwo-whatsapp-btn__icon,
.codwo-skin-bold .codwo-whatsapp-btn__icon svg {
    color: #0a0a0a !important;
    fill: #0a0a0a !important;
}

/* "OR" divider — hard uppercase, black hairlines */
.codwo-skin-bold .codwo-woo-cart-fallback .codwo-woo-cart-divider {
    color: #0a0a0a;
    font-weight: 900;
    letter-spacing: 0.18em;
}
.codwo-skin-bold .codwo-woo-cart-fallback .codwo-woo-cart-divider::before,
.codwo-skin-bold .codwo-woo-cart-fallback .codwo-woo-cart-divider::after {
    background: #0a0a0a;
    height: 2px;
}

/* Add to Cart — inverted (yellow on black with hard shadow) */
.codwo-skin-bold .codwo-add-to-cart-btn,
.codwo-skin-bold .codwo-add-to-cart-btn:hover,
.codwo-skin-bold .codwo-add-to-cart-btn:focus {
    background: #ffeb3b !important;
    background-image: none !important;
    color: #0a0a0a !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    box-shadow: 6px 6px 0 0 #0a0a0a !important;
    padding: 13px 18px !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    font-size: 14px !important;
    text-shadow: none !important;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.codwo-skin-bold .codwo-add-to-cart-btn:hover {
    transform: translate(3px, 3px);
    box-shadow: 3px 3px 0 0 #0a0a0a !important;
    background: #fde047 !important;
}

/* Trust badge chips — brutalist frame */
.codwo-skin-bold .codwo-badge {
    border: 2px solid #0a0a0a;
    border-radius: 0;
    padding: 6px 10px;
    background: #ffeb3b;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.codwo-skin-bold .codwo-badge-icon { color: #0a0a0a; }

/* ─── FBT section — brutalist card with hard borders + shadow ─── */
.codwo-skin-bold .codwo-fbt-section {
    background: #ffeb3b !important;
    border: 3px solid #0a0a0a !important;
    border-radius: 0 !important;
    box-shadow: 6px 6px 0 0 #0a0a0a;
    padding: 18px !important;
}
.codwo-skin-bold .codwo-fbt-head::before {
    background: #0a0a0a;
    border-radius: 0;
    /* recolour the SVG cart icon from primary blue to yellow-on-black */
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffeb3b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.5'/%3E%3Ccircle cx='18' cy='20' r='1.5'/%3E%3Cpath d='M2 3h3l2.7 12.2a2 2 0 0 0 2 1.6h8.6a2 2 0 0 0 2-1.6L22 7H6'/%3E%3Cpath d='M15 4v4M13 6h4'/%3E%3C/svg%3E") !important;
}
.codwo-skin-bold .codwo-fbt-title,
.codwo-product-form-wrapper.codwo-skin-bold .codwo-fbt-title {
    color: #0a0a0a !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    letter-spacing: 0.02em !important;
}
.codwo-skin-bold .codwo-fbt-subtitle,
.codwo-product-form-wrapper.codwo-skin-bold .codwo-fbt-subtitle {
    color: #2c2c2c !important;
    font-weight: 700 !important;
}

/* FBT product card */
.codwo-skin-bold .codwo-fbt-card {
    background: #fff !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    box-shadow: 5px 5px 0 0 #0a0a0a;
    padding: 10px !important;
    gap: 10px;
    transition: transform .15s ease, box-shadow .15s ease;
}
.codwo-skin-bold .codwo-fbt-card:hover {
    transform: translate(2px, 2px);
    box-shadow: 3px 3px 0 0 #0a0a0a;
}
.codwo-skin-bold .codwo-fbt-card.is-selected {
    background: #fff7a8 !important;
    box-shadow: 5px 5px 0 0 #ff3d00;
    transform: none;
}
.codwo-skin-bold .codwo-fbt-image {
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    background: #fff !important;
}
.codwo-skin-bold .codwo-fbt-name {
    color: #0a0a0a;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    font-size: 13px;
}
.codwo-skin-bold .codwo-fbt-prices {
    font-weight: 900;
}
.codwo-skin-bold .codwo-fbt-old {
    color: #6b6b6b;
    font-weight: 700;
}
.codwo-skin-bold .codwo-fbt-new {
    color: #0a0a0a;
    font-weight: 900;
    font-size: 16px;
}

/* Savings badge — hard orange block, not a pill */
.codwo-skin-bold .codwo-fbt-badge,
.codwo-skin-bold .codwo-fbt-info > .codwo-fbt-badge {
    background: #ff3d00 !important;
    color: #fff !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    box-shadow: 2px 2px 0 0 #0a0a0a;
    padding: 3px 8px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.codwo-skin-bold .codwo-fbt-badge::before {
    /* star icon — re-tinted white to stay visible on orange */
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E");
}

/* Bundle hint pill under the grid — brutalist block */
.codwo-skin-bold .codwo-fbt-bundle-hint {
    background: #0a0a0a !important;
    color: #ffeb3b !important;
    border: 2px solid #0a0a0a;
    border-radius: 0 !important;
    box-shadow: 4px 4px 0 0 #ff3d00;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.codwo-skin-bold .codwo-fbt-bundle-hint::before {
    /* check icon — tinted yellow to match text */
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffeb3b'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1 14l-4-4 1.41-1.41L11 13.17l5.59-5.59L18 9l-7 7z'/%3E%3C/svg%3E");
}

/* FBT tick indicator — square, hard border, yellow when selected (brutalist).
   Overlaps the card corner like a hard-edged badge. */
.codwo-skin-bold .codwo-fbt-card::before {
    width: 28px;
    height: 28px;
    border: 2px solid #0a0a0a;
    border-radius: 0;
    background: #fff;
    box-shadow: 3px 3px 0 0 #0a0a0a;
    top: -10px;
    inset-inline-end: -10px;
}
.codwo-skin-bold .codwo-fbt-card.is-selected::before {
    background-color: #ffeb3b;
    border-color: #0a0a0a;
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a0a0a' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 12 10 18 20 6'/%3E%3C/svg%3E");
    background-size: 18px 18px;
    transform: none;
}

/* ─── Coupon section — brutalist treatment to match buttons/FBT ─── */
.codwo-skin-bold .codwo-coupon-toggle,
.codwo-skin-bold .codwo-coupon-toggle:hover,
.codwo-skin-bold .codwo-coupon-toggle:focus,
.codwo-skin-bold .codwo-coupon-toggle:active {
    background: #ffeb3b !important;
    background-image: none !important;
    color: #0a0a0a !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    box-shadow: 4px 4px 0 0 #0a0a0a !important;
    padding: 10px 18px !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    text-shadow: none !important;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.codwo-skin-bold .codwo-coupon-toggle:hover {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0 0 #0a0a0a !important;
    background: #fde047 !important;
}
.codwo-skin-bold .codwo-coupon-toggle svg {
    stroke: #0a0a0a;
}

/* Expanded coupon panel = yellow card with black frame */
.codwo-skin-bold .codwo-coupon-section {
    background: #ffeb3b !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    box-shadow: 5px 5px 0 0 #0a0a0a;
    padding: 14px 16px !important;
    margin-bottom: 22px;
}
.codwo-product-form-wrapper.codwo-skin-bold .codwo-coupon-section h4 {
    color: #0a0a0a !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    font-size: 13px !important;
    margin: 0 0 12px !important;
}

/* Coupon input — match body inputs but keep full opacity over yellow */
.codwo-skin-bold .codwo-coupon-input,
.codwo-skin-bold .codwo-coupon-section input[type="text"] {
    background: #fff !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    color: #0a0a0a !important;
    font-weight: 700;
    padding: 11px 14px !important;
    box-shadow: none !important;
}
.codwo-skin-bold .codwo-coupon-input:focus,
.codwo-skin-bold .codwo-coupon-section input[type="text"]:focus {
    box-shadow: 3px 3px 0 0 #0a0a0a !important;
    outline: none;
}

/* Apply button — inverse of toggle (black fill, yellow text) */
.codwo-skin-bold .codwo-coupon-section button:not(.codwo-coupon-toggle),
.codwo-skin-bold .codwo-coupon-section .codwo-btn-secondary,
.codwo-skin-bold .codwo-coupon-section button:not(.codwo-coupon-toggle):hover,
.codwo-skin-bold .codwo-coupon-section button:not(.codwo-coupon-toggle):focus {
    background: #0a0a0a !important;
    background-image: none !important;
    color: #ffeb3b !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    box-shadow: 3px 3px 0 0 #0a0a0a !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    padding: 11px 18px !important;
    text-shadow: none !important;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.codwo-skin-bold .codwo-coupon-section button:not(.codwo-coupon-toggle):hover {
    transform: translate(2px, 2px);
    box-shadow: 1px 1px 0 0 #0a0a0a !important;
    background: #1a1a1a !important;
}

/* Applied / success message inside coupon — hard green block */
.codwo-skin-bold .codwo-coupon-section .codwo-message,
.codwo-skin-bold .codwo-coupon-section .codwo-message.success {
    background: #00d084 !important;
    color: #0a0a0a !important;
    border: 2px solid #0a0a0a !important;
    border-radius: 0 !important;
    font-weight: 800;
    padding: 10px 12px !important;
    box-shadow: 3px 3px 0 0 #0a0a0a;
}
.codwo-skin-bold .codwo-coupon-section .codwo-message.error {
    background: #ff3d00 !important;
    color: #fff !important;
    border: 2px solid #0a0a0a !important;
}


/* ============================================================
   SKIN: CARD — soft purple gradient, pastel, friendly pill buttons
   ============================================================ */
.codwo-skin-card.codwo-product-form-wrapper {
    --codwo-bg: #ffffff;
    --codwo-surface: #f5f3ff;
    --codwo-surface-muted: #faf9ff;
    --codwo-border: #e8e7ff;
    --codwo-border-strong: #d4d4f7;
    --codwo-text: #1e1b4b;
    --codwo-text-muted: #6b6b8a;
    --codwo-primary: #4f46e5;
    --codwo-primary-strong: #4338ca;
    --codwo-button-bg: #4f46e5;
    --codwo-button-bg-hover: #4338ca;
    --codwo-accent: #ec4899;
    --codwo-success: #10b981;

    max-width: 520px;
    background: var(--codwo-bg, #ffffff);
    border: 1px solid var(--codwo-border, #ecebff);
    border-radius: 20px;
    box-shadow: 0 12px 40px -18px rgba(79, 70, 229, 0.18);
    padding: 0;
    overflow: hidden;
    font-family: 'Inter', 'Plus Jakarta Sans', 'Cairo', system-ui, sans-serif;
    color: var(--codwo-text, #1e1b4b);
    letter-spacing: -0.005em;
}
.codwo-skin-card .codwo-product-form {
    padding: 24px 24px 26px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    background: var(--codwo-bg, #ffffff);
}
.codwo-skin-card .codwo-form-title {
    text-align: start;
    font-weight: 700;
    font-size: 22px;
    color: var(--codwo-title-color, var(--codwo-text, #1e1b4b));
    margin: 0 0 4px;
    letter-spacing: -0.015em;
    line-height: 1.25;
    background: none;
    -webkit-background-clip: initial;
    background-clip: initial;
}
.codwo-skin-card .codwo-form-description {
    color: var(--codwo-text-muted, #6b6b8a);
    font-size: 13.5px;
    line-height: 1.55;
    margin: 0 0 4px;
    text-align: start;
}
.codwo-skin-card .codwo-form-product-media {
    justify-content: flex-start;
    margin-bottom: 4px;
}
.codwo-skin-card .codwo-form-product-media img {
    width: 76px;
    height: 76px;
    border-radius: 14px;
    border: 1px solid #ecebff;
    box-shadow: none;
    object-fit: cover;
}

/* Section headings — clean, consistent */
.codwo-product-form-wrapper.codwo-skin-card .codwo-promo-selector-section h4,
.codwo-product-form-wrapper.codwo-skin-card .codwo-variations-section h4,
.codwo-product-form-wrapper.codwo-skin-card .codwo-coupon-section h4,
.codwo-product-form-wrapper.codwo-skin-card .codwo-fbt-title,
.codwo-product-form-wrapper.codwo-skin-card .codwo-extras-title,
.codwo-product-form-wrapper.codwo-skin-card .codwo-bank-transfer-section h4 {
    font-weight: 700 !important;
    font-size: 13.5px !important;
    line-height: 1.3 !important;
    color: #1e1b4b !important;
    margin: 0 0 10px !important;
    letter-spacing: -0.005em !important;
    text-transform: none !important;
    padding: 0 !important;
    border: 0 !important;
}

/* Promo / bundle cards — 2-col with image, stacked info + pricing + badge */
.codwo-skin-card .codwo-promo-options { gap: 12px; }
.codwo-skin-card .codwo-promo-option {
    border-radius: 16px !important;
    border: 1.5px solid #ecebff !important;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(79, 70, 229, 0.05) !important;
    grid-template-columns: 64px minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto !important;
    column-gap: 14px !important;
    row-gap: 6px !important;
    padding: 14px 16px !important;
    min-height: 0;
    overflow: visible;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.codwo-skin-card .codwo-promo-option-media {
    display: inline-flex !important;
    grid-column: 1 !important;
    grid-row: 1 / span 3 !important;
    width: 64px !important;
    height: 64px !important;
    border-radius: 12px;
    border: 1px solid #ecebff;
    background: #fff;
    align-self: center;
    overflow: hidden;
}
.codwo-skin-card .codwo-promo-option-media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.codwo-skin-card .codwo-promo-option-main {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: end;
    gap: 3px;
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.codwo-skin-card .codwo-promo-option-title {
    font-size: 14.5px !important;
    font-weight: 700;
    color: #1e1b4b;
    letter-spacing: -0.005em;
    line-height: 1.3;
}
.codwo-skin-card .codwo-promo-option-subtitle {
    font-size: 12.5px;
    color: #6b6b8a;
    line-height: 1.45;
}
.codwo-skin-card .codwo-promo-option-pricing {
    grid-column: 2 !important;
    grid-row: 2 !important;
    align-self: start !important;
    justify-self: start;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 10px;
    text-align: start;
}
.codwo-skin-card .codwo-promo-option-new-price {
    font-weight: 800 !important;
    color: #10b981 !important;
    font-size: 18px !important;
    line-height: 1.1;
    letter-spacing: -0.015em;
    font-variant-numeric: tabular-nums;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
}
.codwo-skin-card .codwo-promo-option-old-price {
    font-size: 12px;
    color: #a5a5bf;
    text-decoration: line-through;
    font-weight: 500;
}
.codwo-skin-card .codwo-promo-option-badge {
    grid-column: 2 !important;
    grid-row: 3 !important;
    align-self: start;
    justify-self: start;
    margin-top: 2px;
    background: #10b981;
    color: #fff;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.01em;
    white-space: nowrap;
    width: fit-content;
}
.codwo-skin-card .codwo-promo-option:hover {
    border-color: #c7c4ff !important;
    box-shadow: 0 6px 18px -4px rgba(79, 70, 229, 0.12) !important;
    transform: translateY(-1px);
}
.codwo-skin-card .codwo-promo-option.selected {
    border-color: #4f46e5 !important;
    background: #faf9ff !important;
    box-shadow: 0 4px 14px -2px rgba(79, 70, 229, 0.18) !important;
    transform: none;
}
.codwo-skin-card .codwo-promo-option-recommended {
    position: absolute !important;
    top: -9px;
    inset-inline-start: 18px;
    background: #4f46e5 !important;
    color: #fff;
    border-radius: 999px !important;
    padding: 3px 10px;
    font-weight: 700;
    font-size: 10px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1.4;
    box-shadow: 0 2px 6px rgba(79, 70, 229, 0.3);
    grid-column: auto !important;
    grid-row: auto !important;
    justify-self: auto !important;
    margin-top: 0;
    display: none;
    align-items: center;
    z-index: 2;
}
.codwo-skin-card .codwo-promo-option.is-highlighted .codwo-promo-option-recommended {
    display: inline-flex;
}
.codwo-rtl.codwo-skin-card .codwo-promo-option {
    grid-template-columns: minmax(0, 1fr) 64px !important;
}
.codwo-rtl.codwo-skin-card .codwo-promo-option-media { grid-column: 2 !important; }
.codwo-rtl.codwo-skin-card .codwo-promo-option-main { grid-column: 1 !important; }
.codwo-rtl.codwo-skin-card .codwo-promo-option-pricing,
.codwo-rtl.codwo-skin-card .codwo-promo-option-badge {
    grid-column: 1 !important;
    justify-self: end;
    justify-content: flex-end;
    text-align: end;
}
.codwo-rtl.codwo-skin-card .codwo-promo-option-recommended {
    inset-inline-start: auto;
    inset-inline-end: 18px;
}

/* Swatches */
.codwo-skin-card .codwo-color-swatch {
    width: 34px; height: 34px;
    border-radius: 50%;
    box-shadow: 0 0 0 1.5px #ecebff;
}
.codwo-skin-card .codwo-swatch-item:hover .codwo-color-swatch { box-shadow: 0 0 0 1.5px #c7c4ff; }
.codwo-skin-card .codwo-swatch-item.selected .codwo-color-swatch {
    box-shadow: 0 0 0 2.5px #4f46e5;
    transform: scale(1.05);
}
.codwo-skin-card .codwo-button-swatch {
    min-width: 52px;
    height: 42px;
    padding: 0 16px;
    border: 1.5px solid #ecebff;
    border-radius: 12px;
    background: #fff;
    color: #1e1b4b;
    font-weight: 600;
    font-size: 13px;
    transition: all .2s ease;
}
.codwo-skin-card .codwo-swatch-item:hover .codwo-button-swatch {
    border-color: #c7c4ff;
    color: #4f46e5;
    background: #faf9ff;
}
.codwo-skin-card .codwo-swatch-item.selected .codwo-button-swatch {
    background: #4f46e5;
    color: #fff;
    border-color: #4f46e5;
    box-shadow: 0 3px 8px rgba(79, 70, 229, 0.25);
}

/* FBT — light surface card, no gradient */
.codwo-skin-card .codwo-fbt-section {
    background: #faf9ff !important;
    background-image: none !important;
    border: 1px solid #ecebff !important;
    border-radius: 16px !important;
    box-shadow: none;
    padding: 16px !important;
}
.codwo-skin-card .codwo-fbt-head::before {
    background: #ecebff;
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.5'/%3E%3Ccircle cx='18' cy='20' r='1.5'/%3E%3Cpath d='M2 3h3l2.7 12.2a2 2 0 0 0 2 1.6h8.6a2 2 0 0 0 2-1.6L22 7H6'/%3E%3Cpath d='M15 4v4M13 6h4'/%3E%3C/svg%3E");
    border-radius: 8px;
}
.codwo-skin-card .codwo-fbt-card {
    border-radius: 14px !important;
    border: 2px solid #ecebff;
    background: #fff !important;
    box-shadow: none !important;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.codwo-skin-card .codwo-fbt-card:hover {
    border-color: #c7c4ff;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px -4px rgba(79, 70, 229, 0.12);
}
.codwo-skin-card .codwo-fbt-card.is-selected {
    border-color: #4f46e5;
    background: #faf9ff !important;
    box-shadow: 0 0 0 1.5px #4f46e5 inset;
}
.codwo-skin-card .codwo-fbt-image {
    border-radius: 10px !important;
    background: #f5f3ff !important;
    background-image: none !important;
}
.codwo-skin-card .codwo-fbt-badge,
.codwo-skin-card .codwo-fbt-info > .codwo-fbt-badge {
    background: #ec4899 !important;
    background-image: none !important;
    color: #fff !important;
    border-radius: 999px;
    box-shadow: 0 2px 6px rgba(236, 72, 153, 0.25);
}
.codwo-skin-card .codwo-fbt-new {
    color: #4f46e5;
}
.codwo-skin-card .codwo-fbt-card::before {
    border-color: #c7c4ff;
}
.codwo-skin-card .codwo-fbt-card.is-selected::before {
    background-color: #4f46e5;
    border-color: #4f46e5;
}
.codwo-skin-card .codwo-fbt-bundle-hint {
    background: #10b981 !important;
    background-image: none !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.22);
}

/* Extras — flat surface, solid icon chip */
.codwo-skin-card .codwo-extras-section {
    background: #faf9ff !important;
    border: 1px solid #ecebff !important;
    border-radius: 16px !important;
    padding: 14px 16px !important;
}
.codwo-skin-card .codwo-extra-row {
    border-radius: 14px !important;
    border: 1.5px solid #ecebff !important;
    background: #fff !important;
    box-shadow: none !important;
    padding: 12px 14px !important;
}
.codwo-skin-card .codwo-extra-row:hover { border-color: #c7c4ff !important; }
.codwo-skin-card .codwo-extra-row.is-selected {
    border-color: #4f46e5 !important;
    background: #faf9ff !important;
}
.codwo-skin-card .codwo-extra-icon {
    background: #ecebff !important;
    background-image: none !important;
    color: #4f46e5 !important;
    border-radius: 10px;
}
.codwo-skin-card .codwo-extra-label { color: #1e1b4b; font-weight: 700; }
.codwo-skin-card .codwo-extra-description { color: #6b6b8a; }
.codwo-skin-card .codwo-extra-price {
    color: #4f46e5 !important;
    font-weight: 800;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
}

/* Inputs — airy, rounded, clear focus ring */
.codwo-skin-card .codwo-field-group label,
.codwo-skin-card .codwo-variation-group label,
.codwo-skin-card .codwo-quantity-section label {
    font-size: 13px;
    font-weight: 700;
    color: #1e1b4b;
    margin-bottom: 7px;
}
.codwo-skin-card .codwo-field-group input,
.codwo-skin-card .codwo-field-group textarea,
.codwo-skin-card .codwo-variation-select {
    border-radius: 12px;
    border: 1.5px solid #ecebff;
    background: #fff;
    padding: 12px 14px;
    font-size: 14px;
    color: #1e1b4b;
    transition: all .18s ease;
}
.codwo-skin-card .codwo-field-group input::placeholder,
.codwo-skin-card .codwo-field-group textarea::placeholder {
    color: #a5a5bf;
}
.codwo-skin-card .codwo-field-group input:hover,
.codwo-skin-card .codwo-field-group textarea:hover,
.codwo-skin-card .codwo-variation-select:hover {
    border-color: #c7c4ff;
}
.codwo-skin-card .codwo-field-group input:focus,
.codwo-skin-card .codwo-field-group textarea:focus,
.codwo-skin-card .codwo-variation-select:focus {
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12);
    outline: none;
}

/* Coupon */
.codwo-skin-card .codwo-coupon-toggle,
.codwo-skin-card .codwo-coupon-toggle:hover,
.codwo-skin-card .codwo-coupon-toggle:focus {
    background: #f5f3ff !important;
    background-image: none !important;
    border: 1px dashed #c7c4ff !important;
    color: #4f46e5 !important;
    font-weight: 700;
}
.codwo-skin-card .codwo-coupon-toggle:hover {
    background: #ecebff !important;
    border-color: #4f46e5 !important;
}
.codwo-skin-card .codwo-coupon-section {
    background: #faf9ff;
    border: 1px solid #ecebff;
    border-radius: 16px;
    padding: 14px 16px;
}
.codwo-skin-card .codwo-coupon-input {
    background: #fff !important;
    border-radius: 12px;
}
.codwo-skin-card .codwo-coupon-section button:not(.codwo-coupon-toggle) {
    background: #4f46e5;
    color: #fff;
    border: 1px solid #4f46e5;
    border-radius: 12px;
    font-weight: 700;
    padding: 10px 16px;
}
.codwo-skin-card .codwo-coupon-section button:not(.codwo-coupon-toggle):hover {
    background: #4338ca;
    border-color: #4338ca;
}

/* Summary */
.codwo-skin-card .codwo-order-summary {
    background: #faf9ff;
    border: 1px solid #ecebff;
    border-radius: 16px;
    padding: 16px 18px;
}
.codwo-skin-card .codwo-summary-row {
    font-size: 13.5px;
    color: #6b6b8a;
    padding: 6px 0;
    border: none;
}
.codwo-skin-card .codwo-summary-row strong { color: #1e1b4b; font-weight: 600; }
.codwo-skin-card .codwo-total-row {
    border-top: 1px solid #ecebff;
    padding-top: 12px;
    margin-top: 8px;
    font-size: 15px;
}
.codwo-skin-card .codwo-total-row strong:first-child {
    font-size: 14px;
    font-weight: 700;
    color: #1e1b4b;
}
.codwo-skin-card .codwo-total-price {
    font-weight: 800 !important;
    font-size: 22px !important;
    color: #4f46e5 !important;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
}

/* Submit + secondary buttons — solid indigo, no gradient */
.codwo-skin-card .codwo-submit-btn,
.codwo-skin-card .codwo-submit-btn:hover,
.codwo-skin-card .codwo-submit-btn:focus,
.codwo-skin-card .codwo-submit-btn:active {
    background: var(--codwo-button-bg, #4f46e5) !important;
    background-image: none !important;
    background-color: var(--codwo-button-bg, #4f46e5) !important;
    color: var(--codwo-button-text, #fff) !important;
    border: 1px solid var(--codwo-button-bg, #4f46e5) !important;
    border-radius: 14px !important;
    padding: 15px 22px !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    text-transform: none !important;
    text-shadow: none !important;
    letter-spacing: -0.005em;
    box-shadow: 0 6px 18px -4px rgba(79, 70, 229, 0.35) !important;
    transition: all .2s ease;
}
.codwo-skin-card .codwo-submit-btn:hover {
    background: var(--codwo-button-bg-hover, var(--codwo-button-bg, #4338ca)) !important;
    background-color: var(--codwo-button-bg-hover, var(--codwo-button-bg, #4338ca)) !important;
    transform: translateY(-1px);
    box-shadow: 0 10px 22px -4px rgba(79, 70, 229, 0.45) !important;
}
.codwo-skin-card .codwo-submit-btn .codwo-btn-text,
.codwo-skin-card .codwo-submit-btn .codwo-btn-price { color: var(--codwo-button-text, #fff) !important; }

.codwo-skin-card .codwo-whatsapp-btn {
    border-radius: 14px;
    font-weight: 700;
    padding: 14px 18px;
}
.codwo-skin-card .codwo-add-to-cart-btn {
    border-radius: 14px !important;
    border-color: #ecebff !important;
    color: #1e1b4b !important;
    font-weight: 700;
    padding: 13px 18px !important;
}
.codwo-skin-card .codwo-add-to-cart-btn:hover {
    border-color: #4f46e5 !important;
    background: #faf9ff !important;
    color: #4f46e5 !important;
}

/* Trust badges */
.codwo-skin-card .codwo-trust-badges {
    margin: 6px 0 0;
    padding: 8px 8px 8px;
    gap: 10px;
    background: transparent;
    border-top: 1px solid #ecebff;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.codwo-skin-card .codwo-badge {
    background: #faf9ff;
    border: 1px solid #ecebff;
    border-radius: 12px;
    padding: 8px 10px;
    font-size: 11.5px;
    color: #4f46e5;
    font-weight: 600;
    box-shadow: none;
    gap: 6px;
}
.codwo-skin-card .codwo-badge-icon { color: #4f46e5; font-size: 13px; }


/* ============================================================
   Per-skin overrides for the inline product header
   ============================================================ */

/* Modern — tight, readable spacing (no overlap between price / total rows) */
.codwo-skin-modern .codwo-product-header {
    display: grid;
    grid-template-columns: 72px 1fr;
    column-gap: 14px;
    align-items: center;
    padding: 14px 16px;
    border-radius: 14px;
    margin: 0 0 16px;
}
.codwo-skin-modern .codwo-product-header__media img {
    width: 72px !important;
    height: 72px !important;
    border-radius: 10px;
    object-fit: cover;
}
.codwo-skin-modern .codwo-product-header__body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.codwo-skin-modern .codwo-product-header__title {
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
    margin: 0 !important;
}
.codwo-skin-modern .codwo-product-header__desc {
    font-size: 12px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}
.codwo-skin-modern .codwo-product-header__price {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin-top: 2px;
    line-height: 1.3;
}
.codwo-skin-modern .codwo-product-header__price-value {
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--codwo-text, #0f172a);
}
.codwo-skin-modern .codwo-product-header__total {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    margin-top: 4px;
    line-height: 1.2;
    flex-wrap: wrap;
}
.codwo-skin-modern .codwo-product-header__total-label {
    font-size: 10.5px;
    line-height: 1.4;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--codwo-text-muted, #64748b);
    font-weight: 600;
}
.codwo-skin-modern .codwo-product-header__total-value {
    font-size: 16px;
    line-height: 1.2;
    font-weight: 800;
    color: var(--codwo-primary, #0f4c81);
    letter-spacing: -0.015em;
    font-variant-numeric: tabular-nums;
}
.codwo-skin-modern .codwo-product-header .codwo-stock-badge {
    font-size: 10px;
    padding: 3px 8px;
    line-height: 1.4;
}

/* Editorial — cream rounded card, serif title in header */
.codwo-skin-editorial .codwo-product-header {
    background: #FAF8F3;
    border: 1px solid #EFEBE0;
    border-radius: 16px;
    padding: 14px;
    margin-bottom: 18px;
}
.codwo-skin-editorial .codwo-product-header__media img {
    border-radius: 12px;
    border: 1px solid #EFEBE0;
}
.codwo-skin-editorial .codwo-product-header__title {
    font-family: 'Fraunces', 'Playfair Display', Georgia, serif !important;
    font-weight: 500 !important;
    font-size: 17px !important;
    letter-spacing: -0.015em;
    color: #0F0F0E;
}
.codwo-skin-editorial .codwo-product-header__total-label {
    color: #9B968C;
}
.codwo-skin-editorial .codwo-product-header__total-value {
    font-family: 'Fraunces', 'Playfair Display', Georgia, serif;
    font-weight: 500;
    font-size: 20px;
    color: #0F0F0E;
    letter-spacing: -0.02em;
}

/* COD — blue gradient card with white text */
.codwo-skin-cod .codwo-product-header {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 12px;
    align-items: center;
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    border: 0;
    border-radius: 14px;
    padding: 14px 16px;
    color: #fff;
    box-shadow: 0 8px 22px -10px rgba(37,99,235,0.45);
    margin: 0 0 5px;
}
.codwo-skin-cod .codwo-product-header__media img {
    width: 64px !important;
    height: 64px !important;
    object-fit: cover;
    border-radius: 10px;
    border: 2px solid rgba(255,255,255,0.35);
    background: #fff;
}
.codwo-skin-cod .codwo-product-header__body {
    gap: 3px;
}
.codwo-skin-cod .codwo-product-header__title {
    color: #fff !important;
    font-weight: 800 !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    letter-spacing: -0.01em;
    margin: 0 !important;
}
.codwo-skin-cod .codwo-product-header__desc {
    color: rgba(255,255,255,0.85);
    font-size: 12px !important;
}
.codwo-skin-cod .codwo-product-header__price {
    margin-top: 4px;
    gap: 8px;
}
.codwo-skin-cod .codwo-product-header__price-value {
    font-size: 13px;
    font-weight: 700;
    color: #ffffff;
}
.codwo-skin-cod .codwo-product-header__total {
    margin-top: 4px;
    gap: 6px;
}
.codwo-skin-cod .codwo-product-header__total-label {
    color: rgba(255,255,255,0.8);
    font-weight: 600;
    font-size: 10.5px;
    letter-spacing: 0.08em;
}
.codwo-skin-cod .codwo-product-header__total-value {
    color: #fff;
    font-weight: 800;
    font-size: 17px;
    letter-spacing: -0.015em;
    font-variant-numeric: tabular-nums;
}
.codwo-skin-cod .codwo-product-header .codwo-stock-badge {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(4px);
}

/* Classic — navy serif heading, sharp corners, gold rule */
.codwo-skin-classic .codwo-product-header {
    background: #f7f9fc;
    border: 1px solid #d8dee6;
    border-left: 4px solid #b8860b;
    border-radius: 4px;
    padding: 14px;
}
.codwo-skin-classic .codwo-product-header__media img {
    border-radius: 4px;
    border: 1px solid #d8dee6;
}
.codwo-skin-classic .codwo-product-header__title {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    color: #16243b;
    border: 0 !important;
    padding: 0 !important;
}
.codwo-skin-classic .codwo-product-header__total-label {
    color: #4f6275;
    font-style: italic;
    text-transform: none;
    letter-spacing: 0;
    font-size: 12px;
}
.codwo-skin-classic .codwo-product-header__total-value {
    font-family: 'Playfair Display', Georgia, serif;
    font-weight: 700;
    font-size: 22px;
    color: #1f3a5f;
}

/* Bold — neo-brutalist hard shadow */
.codwo-skin-bold .codwo-product-header {
    background: #ffeb3b;
    border: 3px solid #0a0a0a;
    border-radius: 0;
    padding: 14px;
    box-shadow: 6px 6px 0 0 #0a0a0a;
    /* margin-bottom: 22px; */
}
.codwo-skin-bold .codwo-product-header__media img {
    border: 2px solid #0a0a0a;
    border-radius: 0;
    background: #fff;
}
.codwo-skin-bold .codwo-product-header__title {
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-size: 16px !important;
    color: #0a0a0a;
}
.codwo-skin-bold .codwo-product-header__desc { color: #2c2c2c; font-weight: 600; }
.codwo-skin-bold .codwo-product-header__total {
    background: #0a0a0a;
    color: #ffeb3b;
    padding: 4px 10px;
    margin-top: 8px;
}
.codwo-skin-bold .codwo-product-header__total-label {
    color: #ffeb3b;
    font-weight: 900;
}
.codwo-skin-bold .codwo-product-header__total-value {
    color: #ffeb3b;
    font-weight: 900;
    font-size: 18px;
}

/* Card — soft purple-pink gradient with pill total */
.codwo-skin-card .codwo-product-header {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 14px;
    row-gap: 10px;
    align-items: center;
    background: #faf9ff !important;
    background-image: none !important;
    border: 1px solid #ecebff;
    border-radius: 16px;
    padding: 16px;
    box-shadow: none;
    margin: 0 0 18px;
}
.codwo-skin-card .codwo-product-header__media {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
}
.codwo-skin-card .codwo-product-header__media img {
    width: 72px !important;
    height: 72px !important;
    border-radius: 12px;
    border: 1px solid #ecebff;
    box-shadow: none;
    object-fit: cover;
    background: #ffffff;
}
.codwo-skin-card .codwo-product-header__body {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.codwo-skin-card .codwo-product-header__title {
    font-weight: 700 !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    color: #1e1b4b !important;
    letter-spacing: -0.01em;
    margin: 0 !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}
.codwo-skin-card .codwo-product-header__desc {
    font-size: 12px !important;
    color: #6b6b8a !important;
    margin: 0 !important;
    line-height: 1.45 !important;
}
.codwo-skin-card .codwo-product-header__price {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 2px;
    line-height: 1.2;
    flex-wrap: wrap;
}
.codwo-skin-card .codwo-product-header__price-value {
    font-size: 14px;
    font-weight: 700;
    color: #1e1b4b;
    font-variant-numeric: tabular-nums;
}
.codwo-skin-card .codwo-product-header .codwo-stock-badge {
    font-size: 10px;
    padding: 3px 8px;
    line-height: 1.4;
    background: rgba(16, 185, 129, 0.12);
    color: #0f7a40;
    border: 0;
}
.codwo-skin-card .codwo-product-header .codwo-stock-badge.codwo-stock--low {
    background: rgba(239, 108, 0, 0.14);
    color: #9a4a04;
}
.codwo-skin-card .codwo-product-header .codwo-stock-badge.codwo-stock--out {
    background: rgba(220, 38, 38, 0.12);
    color: #991b1b;
}
/* Total row — spans full width across both columns so it doesn't float alone */
.codwo-skin-card .codwo-product-header__total {
    grid-column: 1 / -1;
    grid-row: 2;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    background: #ffffff;
    border: 1px solid #ecebff;
    border-radius: 12px;
    padding: 10px 14px;
    box-shadow: none;
    margin-top: 0;
    line-height: 1.2;
}
.codwo-skin-card .codwo-product-header__total-label {
    color: #6b6b8a;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 700;
}
.codwo-skin-card .codwo-product-header__total-value {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    color: #4f46e5 !important;
    font-weight: 800 !important;
    font-size: 17px !important;
    line-height: 1.2;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}

/* RTL — swap image to inline-end side of the header */
.codwo-rtl.codwo-skin-card .codwo-product-header {
    grid-template-columns: minmax(0, 1fr) 72px;
}
.codwo-rtl.codwo-skin-card .codwo-product-header__media { grid-column: 2; }
.codwo-rtl.codwo-skin-card .codwo-product-header__body  { grid-column: 1; }

/* ============================================================
   Coupon overflow fix — grid keeps input + button on one row
   ============================================================ */
.codwo-coupon-input-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 8px;
}
.codwo-coupon-input {
    width: 100%;
    min-width: 0;
}
.codwo-coupon-input-group .codwo-btn,
.codwo-coupon-input-group .codwo-btn-secondary,
.codwo-coupon-input-group button {
    width: auto;
    min-width: 0;
    padding-inline: 18px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ============================================================
   Collapsible coupon — compact pill button
   Hardened with !important so theme/skin button rules can't
   repaint it into a full-width primary button.
   ============================================================ */
.codwo-coupon-toggle-wrap {
    display: flex;
    justify-content: center;
    margin: 4px 0 12px;
}
.codwo-coupon-toggle,
.codwo-coupon-toggle:hover,
.codwo-coupon-toggle:focus,
.codwo-coupon-toggle:active {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100%;
    margin: 0 !important;
    padding: 10px 18px !important;
    background: var(--codwo-surface-muted, #f6f7f9) !important;
    background-image: none !important;
    border: 1px dashed var(--codwo-border-strong, #cbd5e1) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    color: var(--codwo-primary, #0073aa) !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.005em;
    text-decoration: none !important;
    text-shadow: none !important;
    cursor: pointer;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}
.codwo-coupon-toggle:hover {
    background: var(--codwo-surface, #eef2f7) !important;
    border-color: var(--codwo-primary, #0073aa) !important;
    transform: translateY(-1px);
}
.codwo-coupon-toggle:active {
    transform: translateY(0);
}
.codwo-coupon-toggle:focus-visible {
    outline: 2px solid var(--codwo-primary, #0073aa);
    outline-offset: 2px;
}
.codwo-coupon-toggle i,
.codwo-coupon-toggle svg {
    font-size: 13px;
    line-height: 1;
    flex-shrink: 0;
}
.codwo-coupon-toggle svg {
    width: 14px;
    height: 14px;
}
.codwo-add-to-cart-btn__icon svg {
    width: 18px;
    height: 18px;
}
.codwo-coupon-section.is-hidden { display: none !important; }

/* ============================================================
   One font across the entire form
   Overrides any skin-level display-font declarations (Fraunces,
   Playfair, Georgia, etc.) so the form always renders in a
   single, consistent typeface. Icons (<i>, <svg>, .dashicons)
   keep their own font so FontAwesome / glyph fonts still work.
   ============================================================ */
.codwo-product-form-wrapper,
.codwo-product-form-wrapper *:not(i):not(svg):not(.dashicons):not([class*="fa-"]):not(.fab):not(.fas):not(.far):not(.fal) {
    font-family: var(--codwo-font, "Inter", "Cairo", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
}

/* ============================================================
   RTL adjustments shared across skins
   ============================================================ */
.codwo-rtl.codwo-skin-cod .codwo-promo-option.selected::before { inset-inline-start: auto; inset-inline-end: 12px; }
.codwo-rtl.codwo-skin-cod .codwo-promo-option-recommended { inset-inline-start: auto; inset-inline-end: 14px; }
.codwo-rtl.codwo-skin-classic .codwo-product-header { border-left: 0; border-right: 4px solid #b8860b; }

.codwo-woo-cart-fallback {
    padding: 8px;
}

