/* ============================================================================
 * StreamUltras — movies.css — COMMUNITY TICKET skin (announce.js partner).
 * Loaded via ?v= cache-buster on linking/index.php and linking/match.php.
 * Scope: .su-ann-* elements + the deliberate bottom-left OVERRIDE block below.
 * ==========================================================================*/

/* ── bottom-left ticket launcher (the ONLY widget allowed in this slot) ── */
.su-ann-root {
    position: fixed;
    left: calc(16px + env(safe-area-inset-left, 0px));
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    z-index: 2147483000;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    font-family: inherit;
}

.su-ann-root.is-hidden { display: none !important; }

.su-ann-launcher {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 16px 0 12px;
    border: 1px solid rgba(224, 85, 125, 0.45);
    border-radius: 999px;
    background: linear-gradient(135deg, #c20b41 0%, #a50034 55%, #7d0027 100%);
    color: #ffffff;
    font: inherit;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.227), 0 0 14px rgba(0, 0, 0, 0.163);
animation: suAnnPulse 2.6s ease-out infinite;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.su-ann-launcher:hover,
.su-ann-launcher:focus-visible {
    transform: translateY(-2px);
    outline: none;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.325), 0 0 18px rgba(0, 0, 0, 0.227);
}

@keyframes suAnnPulse {
    0%   { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.227), 0 0 0 0 rgba(0, 0, 0, 0.26); }
    70%  { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.227), 0 0 0 12px rgba(0, 0, 0, 0); }
    100% { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.227), 0 0 0 0 rgba(0, 0, 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
    .su-ann-launcher { animation: none; }
}

.su-ann-launcher__icon { font-size: 1.05rem; line-height: 1; }

/* ── popup ticket panel ────────────────────────────────────────────────── */
.su-ann-panel {
    display: none;
    flex-direction: column;
    width: min(88vw, 340px);
    max-height: min(72vh, 520px);
    overflow: hidden auto;
    border: 1px solid rgba(224, 85, 125, 0.12);
    border-radius: 14px;
    background: #262626;
    color: #f2efe9;
    box-shadow: 0 14px 46px rgba(0, 0, 0, 0.65), 0 0 22px rgba(0, 0, 0, 0.078);
}

.su-ann-root.is-open .su-ann-panel { display: flex; }
.su-ann-root.is-open .su-ann-launcher { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.227); }

.su-ann-panel__head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(224, 85, 125, 0.1);
    background: linear-gradient(180deg, rgba(224, 85, 125, 0.10), rgba(224, 85, 125, 0));
}

.su-ann-panel__badge { font-size: 1.15rem; line-height: 1; }

.su-ann-panel__title {
    flex: 1;
    min-width: 0;
    margin: 0;
    font-size: 0.92rem;
    font-weight: 800;
    color: #FFF;
    line-height: 1.3;
}

.su-ann-panel__close {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #a8a29a;
    font-size: 0.95rem;
    cursor: pointer;
    transition: background 0.18s, color 0.18s;
}

.su-ann-panel__close:hover,
.su-ann-panel__close:focus-visible {
    background: rgba(224, 85, 125, 0.1);
    color: #FFF;
    outline: none;
}

.su-ann-panel__body {
    margin: 0;
    padding: 14px;
    font-size: 0.82rem;
    line-height: 1.6;
    color: #a8a29a;
    white-space: pre-line;
}

.su-ann-panel__ctas {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0 14px 14px;
    margin-top: auto;
}

.su-ann-cta {
    display: block;
    padding: 10px 12px;
    border: 1px solid rgba(224, 85, 125, 0.4);
    border-radius: 9px;
    background: rgba(224, 85, 125, 0.08);
    color: #a8a29a;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    transition: background 0.18s, box-shadow 0.18s, color 0.18s;
}

.su-ann-cta:hover,
.su-ann-cta:focus-visible {
    background: rgba(224, 85, 125, 0.2);
    color: #FFF;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.163);
    outline: none;
}

.su-ann-cta:first-child {
    background: linear-gradient(135deg, #c20b41 0%, #a50034 55%, #7d0027 100%);
    border-color: rgba(224, 85, 125, 0.55);
    color: #ffffff;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.163);
}

/* ticket-stub perforation at the panel foot */
.su-ann-panel__stub {
    height: 10px;
    margin-top: 4px;
    border-top: 2px dashed rgba(224, 85, 125, 0.18);
    background: repeating-linear-gradient(90deg, rgba(224, 85, 125, 0.10) 0 8px, rgba(0, 0, 0, 0) 8px 16px);
}

/* ── menubar entry (inserted after #cwBtn / into the pill menubar) ─────── */
.su-ann-menu {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid rgba(224, 85, 125, 0.4);
    border-radius: 8px;
    background: rgba(224, 85, 125, 0.10);
    color: #a8a29a;
    font: inherit;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.18s, color 0.18s;
}

.su-ann-menu:hover,
.su-ann-menu:focus-visible {
    background: rgba(224, 85, 125, 0.22);
    color: #FFF;
    outline: none;
}

.su-ann-menu__icon { font-size: 0.95rem; line-height: 1; }

/* ── play-gate note pill (vignette / interstitial countdown) ───────────── */
.su-ann-pill {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 8px;
    max-width: min(92vw, 560px);
    margin: 0 auto 1.1rem;
    padding: 8px 16px;
    border: 1px solid rgba(224, 85, 125, 0.5);
    border-radius: 999px;
    background: rgba(224, 85, 125, 0.14);
    color: #a8a29a;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 0 14px rgba(0, 0, 0, 0.163);
}

.su-ann-pill.is-shown { display: inline-flex; }

.su-ann-pill:hover,
.su-ann-pill:focus-visible {
    background: rgba(224, 85, 125, 0.28);
    color: #FFF;
    outline: none;
}

.su-ann-pill__icon { font-size: 0.95rem; line-height: 1; }

/* ── community block inside the gate vignette card (admin-toggled) ─────── */
.su-ann-vignette {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
}

.su-ann-vignette .su-ann-pill {
    display: inline-flex;
    margin: 0 auto;
}

.su-ann-vignette__ctas {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
}

.su-ann-vignette__cta {
    display: inline-flex;
    align-items: center;
    padding: 7px 14px;
    border: 1px solid rgba(224, 85, 125, 0.45);
    border-radius: 999px;
    background: rgba(224, 85, 125, 0.10);
    color: #a8a29a;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.18s, color 0.18s, box-shadow 0.18s;
}

.su-ann-vignette__cta:first-child {
    background: linear-gradient(135deg, #c20b41 0%, #a50034 55%, #7d0027 100%);
    border-color: rgba(224, 85, 125, 0.55);
    color: #ffffff;
}

.su-ann-vignette__cta:hover,
.su-ann-vignette__cta:focus-visible {
    background: rgba(224, 85, 125, 0.28);
    color: #FFF;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.195);
    outline: none;
}

/* ══════════════════════════════════════════════════════════════════════════
 * OVERRIDE — the community ticket is the ONLY bottom-left floating widget.
 *
 * The legacy "STADIUM FLOATING DOCK" (the 56px warm-amber open-ticket chat
 * bubble + chat-style panel that linked/m/index.php and linking/match.php
 * pinned to bottom:20px / left:20px, z-index 99999) occupies exactly the
 * slot the new ticket owns, so it is neutralised here:
 *   WHAT:  .stadium-floating-dock (bubble + panel, all breakpoints, RTL
 *          mirrors included) -> display:none.
 *   WHY:   superseded by announce.js .su-ann-* (bottom-left 🎟️ ticket,
 *          z-index 2147483000). Scope is ONLY that widget's subtree — no
 *          other layout reads .stadium-floating-dock, so nothing else is
 *          affected.
 *   RESTORE: delete the rule below (markup/CSS/JS of the dock is kept
 *          dormant in the templates on purpose).
 * announce.js additionally hides any unknown small fixed widget parked in
 * the bottom-left corner at mount time (data-su-ann-suppressed).
 * ════════════════════════════════════════════════════════════════════════ */
.stadium-floating-dock,
.stadium-floating-dock .dock-bubble,
.stadium-floating-dock .dock-panel {
    display: none !important;
}

/* ── SLEEK PHONE MENUBAR (<560px) ───────────────────────────────────────
 * 52px bar, pill nav; the announce entry collapses to icon-only and the
 * ticket panel takes full width with safe-area insets. Applied on top of
 * the base widgets above; nothing else on the page is re-flowed. ─────────*/
@media (max-width: 559px) {
    .su-ann-root {
        left: calc(12px + env(safe-area-inset-left, 0px));
        bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    }

    .su-ann-launcher {
        height: 52px;
        padding: 0 18px 0 14px;
    }

    /* menubar: 52px bar with pill nav items */
    .su-ann-menu {
        width: 52px;
        height: 52px;
        justify-content: center;
        padding: 0;
        border-radius: 14px;
    }

    .su-ann-menu__label { display: none; }

    .su-ann-menu__icon { font-size: 1.25rem; }

    /* full-width sheet panel, safe-area aware */
    .su-ann-panel {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        width: auto;
        max-width: none;
        max-height: min(78dvh, 560px);
        border-radius: 16px 16px 0 0;
        padding-bottom: env(safe-area-inset-bottom, 0px);
        z-index: 2147483000;
    }

    .su-ann-root.is-open .su-ann-launcher { display: none; }

    .su-ann-pill {
        font-size: 0.72rem;
        padding: 7px 12px;
    }

    .su-ann-vignette {
        margin-top: 12px;
        gap: 8px;
    }

    .su-ann-vignette__cta {
        padding: 6px 11px;
        font-size: 0.62rem;
    }
}

/* ══════════════════════════════════════════════════════════════════════════
 * SPICE — ticket launcher sheen + panel entrance (reduced-motion aware).
 * ════════════════════════════════════════════════════════════════════════ */
.su-ann-launcher { position: relative; overflow: hidden; }
.su-ann-launcher::after {
    content: "";
    position: absolute;
    top: 0; bottom: 0; left: -60%;
    width: 45%;
    background: linear-gradient(105deg, transparent, rgba(224, 85, 125, 0.35), transparent);
    transform: skewX(-18deg);
    animation: suAnnSheen 5s ease-in-out infinite;
    pointer-events: none;
}
@keyframes suAnnSheen {
    0%, 55%   { left: -60%; }
    75%, 100% { left: 130%; }
}

.su-ann-root.is-open .su-ann-panel { animation: suAnnPanelIn 0.2s cubic-bezier(0.22, 0.61, 0.36, 1); }
@keyframes suAnnPanelIn { from { opacity: 0; transform: translateY(12px) scale(0.98); } }

.su-ann-panel { box-shadow: 0 18px 50px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(224, 85, 125, 0.18); }

.su-ann-cta, .su-ann-menu, .su-ann-vignette__cta {
    transition: background 0.18s, color 0.18s, box-shadow 0.18s, transform 0.12s;
}
.su-ann-cta:hover, .su-ann-vignette__cta:hover { transform: translateY(-1px); }

@media (prefers-reduced-motion: reduce) {
    .su-ann-launcher::after { animation: none; display: none; }
    .su-ann-root.is-open .su-ann-panel { animation: none; }
}