/* Sitewide promo: badges and modal. EG dark design system; tokens come from
   the theme's variables.css with literal fallbacks so the plugin still
   renders sanely if it ever runs without the Savoy child theme. Discount UI
   keeps the warm sale gradient per STYLE-GUIDE.md (red/orange is reserved
   for sale/discount elements against the cyan palette). */

.eg-swp-badge {
    display: inline-block;
    margin: 6px 0 0;
    padding: 4px 10px;
    border-radius: var(--radius-button, 50px);
    background: var(--gradient-sale, linear-gradient(135deg, #ef4444, #ff7a59));
    color: var(--color-text-white, #fff);
    font-size: 11px;
    font-weight: var(--font-weight-bold, 700);
    letter-spacing: .04em;
    line-height: 1.4;
}

.eg-swp-note {
    margin: 8px 0 16px;
    padding: 8px 14px;
    border-left: 3px solid var(--color-primary-blue, #0EA5E9);
    background: rgba(14, 165, 233, .08);
    color: var(--color-text-on-dark-strong, rgba(255, 255, 255, .88));
    font-size: 13px;
    font-weight: 600;
}

/* --- modal --- */

.eg-swp-modal[hidden] { display: none; }

.eg-swp-modal {
    position: fixed;
    inset: 0;
    /* Deliberately below the age gate's 999999 (eg-age-gate.php), so the
       gate always wins when both are on screen. */
    z-index: 999000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(10, 15, 26, .80);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    animation: eg-swp-fade .25s ease-out both;
}

.eg-swp-card {
    position: relative;
    width: 100%;
    max-width: 440px;
    padding: 40px 32px;
    background: var(--color-surface-elevated, #0f1626);
    border: 1px solid var(--color-border-cyan-strong, rgba(14, 165, 233, .40));
    border-radius: var(--radius-card, 16px);
    box-shadow: 0 0 28px rgba(14, 165, 233, .25);
    text-align: center;
    animation: eg-swp-card-in .4s cubic-bezier(.4, 0, .2, 1) both;
}

.eg-swp-bar {
    display: block;
    width: 56px;
    height: 4px;
    margin: 0 auto 24px;
    border-radius: 2px;
    background: var(--gradient-primary, linear-gradient(135deg, #0EA5E9, #14B8A6));
}

.eg-swp-title {
    margin: 0 0 12px;
    color: var(--color-text-on-dark, #ffffff);
    font-size: 26px;
    font-weight: var(--font-weight-bold, 700);
    line-height: 1.2;
}

.eg-swp-body {
    margin: 0 auto 28px;
    max-width: 340px;
    color: var(--color-text-on-dark-medium, rgba(255, 255, 255, .75));
    font-size: 14px;
    line-height: 1.5;
}

.eg-swp-cta {
    display: inline-block;
    padding: 14px 32px;
    border-radius: var(--radius-button, 50px);
    background: var(--gradient-primary, linear-gradient(135deg, #0EA5E9, #14B8A6));
    color: var(--color-text-white, #fff);
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    box-shadow: var(--shadow-button, 0 10px 30px rgba(14, 165, 233, .3));
    transition: var(--transition-default, all .3s ease);
}

.eg-swp-cta:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-button-hover, 0 15px 40px rgba(14, 165, 233, .4));
    color: var(--color-text-white, #fff);
}

.eg-swp-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--color-text-on-dark-muted, rgba(255, 255, 255, .55));
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

.eg-swp-close:hover { color: var(--color-text-on-dark, #ffffff); }

.eg-swp-card :focus-visible,
.eg-swp-close:focus-visible {
    outline: 2px solid var(--color-primary-teal, #14B8A6);
    outline-offset: 2px;
}

body.eg-swp-open { overflow: hidden; }

@keyframes eg-swp-fade { from { opacity: 0 } to { opacity: 1 } }
@keyframes eg-swp-card-in {
    from { opacity: 0; transform: translateY(8px) scale(.97) }
    to   { opacity: 1; transform: none }
}

@media (prefers-reduced-motion: reduce) {
    .eg-swp-modal,
    .eg-swp-card { animation: none !important; }
    .eg-swp-cta { transition: none; }
    .eg-swp-cta:hover { transform: none; }
}
