/**
 * Tier promo box in cart/checkout. BEM, scoped to .wm-promo. See docs/TIER-PROMO-CODES.md.
 * No build step (plain CSS, FTP). Cache-buster = style.css Version (bumped in T10).
 */

/* ---- Container ---- */
.wm-promo {
    margin: 1.5rem 0;
    padding: 1.25rem;
    border: 1px solid var(--wm-border, #e5ded2);
    border-radius: var(--wm-radius, 12px);
    background: var(--wm-surface, #faf7f1);
    color: var(--wm-text, #1a1a1a);
}
.wm-promo__title { margin: 0 0 .25rem; font-size: 1.125rem; line-height: 1.3; font-weight: 700; }
.wm-promo__subtitle { margin: 0 0 1rem; font-size: 1rem; opacity: .8; }

/* ---- List ---- */
.wm-promo__list { list-style: none; margin: 0; padding: 0; }
.wm-promo__item {
    display: flex; flex-wrap: wrap; align-items: center;
    gap: .5rem .75rem; padding: .75rem 0;
    border-top: 1px solid var(--wm-border, #e5ded2);
}
.wm-promo__item:first-child { border-top: 0; }

.wm-promo__code {
    flex: 1 1 auto; min-width: 0; word-break: normal;       /* override inherited break-word */
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 1rem; font-weight: 700; letter-spacing: .03em;
    padding: .35rem .6rem; border-radius: 8px;
    background: var(--wm-code-bg, #fff);
    border: 1px dashed var(--wm-border, #cdbfa6);
    -webkit-user-select: all; user-select: all;             /* one-tap select */
}
.wm-promo__desc { flex: 1 1 100%; min-width: 0; word-break: normal; font-size: .9375rem; opacity: .75; }

/* ---- Actions ---- */
.wm-promo__actions { display: flex; flex-wrap: wrap; gap: .5rem; flex: 0 0 auto; }
.wm-promo__btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
    min-height: 44px;                                       /* senior-friendly tap target */
    padding: .55rem 1rem; font-size: 1rem; line-height: 1.1; font-weight: 600;
    border: 1px solid transparent; border-radius: 999px;    /* pill */
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.wm-promo__icon { width: 16px; height: 16px; flex: 0 0 auto; }

/* --copy = SECONDARY (tint chip) */
.wm-promo__btn--copy {
    background: var(--wm-accent-tint, #f0e9dc);
    color: var(--wm-accent-ink, #5b4a2e);
    border-color: var(--wm-accent, #C1AE8E);
}
.wm-promo__btn--copy:hover { background: var(--wm-accent-tint-hover, #e8dfcd); }

/* --apply = PRIMARY (accent fill; #C1AE8E is light → dark contrast text) */
.wm-promo__btn--apply {
    background: var(--wm-accent, #C1AE8E);
    color: var(--wm-accent-contrast, #1a1a1a);
    border-color: var(--wm-accent, #C1AE8E);
}
.wm-promo__btn--apply:hover { background: var(--wm-accent-hover, #b29c79); }

/* --copied = state via TWO channels: colour change + label/icon swap (JS swaps the label text) */
.wm-promo__btn--copied {
    background: var(--wm-success, #2e7d32);
    color: #fff;
    border-color: var(--wm-success, #2e7d32);
}

/* ---- Focus visibility (a11y) ---- */
.wm-promo__btn:focus-visible { outline: 2px solid var(--wm-focus, #1a1a1a); outline-offset: 2px; }

/* ---- Dark mode — cart/checkout body classes (NOT .woocommerce-account) ---- */
body.wm-dark.woocommerce-cart .wm-promo,
body.wm-dark.woocommerce-checkout .wm-promo {
    background: var(--wm-surface-dark, #1f1c17);
    border-color: var(--wm-border-dark, #3a3429);
    color: var(--wm-text-dark, #f2ede3);
}
body.wm-dark.woocommerce-cart .wm-promo__code,
body.wm-dark.woocommerce-checkout .wm-promo__code {
    background: var(--wm-code-bg-dark, #2a261f);
    border-color: var(--wm-border-dark, #4a4234);
}

/* ---- Theme-bleed shield (UNLAYERED on purpose): beats Kadence bare button/code rules ---- */
.wm-promo button.wm-promo__btn { text-transform: none; box-shadow: none; width: auto; }
.wm-promo code.wm-promo__code { color: inherit; }
