/* ============================================================
    STB — shared styles across all site variants (main, Topsi)
    Loaded by STBMaster.cshtml and TopsiMaster.cshtml
    so components rendered from a shared partial (e.g. _CookieConsent) look
    the same regardless of which master/stylesheet the page otherwise uses.
   ============================================================ */
:root {
    --stb-magenta: #ec008c;      /* primary brand */
    --stb-magenta-dark: #c40077;
    --stb-ink: #343a40;          /* body text */
    --stb-slate: #4a4f57;        /* nav text */
    --stb-muted: #6c757d;
    --stb-border: #e6e6e6;
}

/* Bootstrap primary overrides -> magenta (relied on by _CookieConsent's buttons) */
.btn-primary {
    background-color: var(--stb-magenta);
    border-color: var(--stb-magenta);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary:disabled, .btn-primary.disabled {
    background-color: var(--stb-magenta-dark) !important;
    border-color: var(--stb-magenta-dark) !important;
    color: #fff !important;
}
.btn-primary:disabled, .btn-primary.disabled {
    opacity: 0.7;
    box-shadow: none;
}
.btn-outline-primary {
    color: var(--stb-magenta);
    border-color: var(--stb-magenta);
}
.btn-outline-primary:hover, .btn-outline-primary:active {
    background-color: var(--stb-magenta) !important;
    border-color: var(--stb-magenta) !important;
    color: #fff !important;
}
.btn-outline-danger { color: var(--stb-magenta); border-color: #f0aecb; }
.btn-outline-danger:hover { background-color: var(--stb-magenta); border-color: var(--stb-magenta); color: #fff; }

/* Consistent keyboard focus ring across all site variants */
:focus-visible {
    outline: 2px solid var(--stb-magenta);
    outline-offset: 2px;
}

:focus:not(:focus-visible) {
    outline: none;
}

/* ============================ COOKIE CONSENT ============================ */
.stb-cookie-banner {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1080;
    background: #fff; box-shadow: 0 -2px 20px rgba(0,0,0,.15);
    padding: 1.25rem 0; display: none;
}
.stb-cookie-banner.show { display: block; }
.stb-cookie-banner h5 { font-weight: 700; color: var(--stb-ink); margin-bottom: .6rem; }
.stb-cookie-banner p { color: var(--stb-slate); font-size: .92rem; margin-bottom: 1rem; }
.stb-cookie-link { color: var(--stb-magenta); }
.stb-cookie-actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.stb-cookie-banner .btn,
.stb-cookie-modal .btn { border-radius: 0; }

/* Settings modal category toggles */
.stb-cookie-cat { padding: 1rem 0; border-bottom: 1px solid var(--stb-border); }
.stb-cookie-cat:last-child { border-bottom: 0; }
.stb-cookie-cat-head { display: flex; align-items: center; justify-content: space-between; }
.stb-cookie-cat h6 { font-weight: 700; margin: 0; color: var(--stb-ink); }
.stb-cookie-cat p { color: var(--stb-muted); font-size: .85rem; margin: .5rem 0 0; }
.stb-cookie-switch { display: flex; align-items: center; gap: .5rem; }
.stb-cookie-switch-label { color: var(--stb-muted); font-size: .85rem; }
.modal-backdrop:has(+ .stb-cookie-modal),
.modal-backdrop.stb-cookie-backdrop { z-index: 1090; }
.stb-cookie-modal { z-index: 1100; }
.stb-cookie-modal .modal-header { border-bottom: 1px solid var(--stb-border); }
.stb-cookie-modal .form-check-input:checked { background-color: var(--stb-magenta); border-color: var(--stb-magenta); }