/* =====================================================================
   First Event – thème rouge
   Remplace le rose du modèle (#E41779) par un rouge.
   Pour changer de rouge : modifier les 4 valeurs ci-dessous.
   ===================================================================== */
:root {
    --fe-red: #E3242B;          /* rouge principal */
    --fe-red-dark: #C11D23;     /* survol / clic */
    --fe-red-light: #F0787C;    /* bordure des champs actifs */
    --fe-red-rgb: 227, 36, 43;

    --bs-primary: var(--fe-red);
    --bs-primary-rgb: var(--fe-red-rgb);
    --primary: var(--fe-red);
}

/* ---------- Couleurs Bootstrap « primary » ---------- */
a { color: var(--fe-red); }
a:hover { color: var(--fe-red-dark); }
.text-primary { color: var(--fe-red) !important; }
.bg-primary { background-color: var(--fe-red) !important; }
.border-primary { border-color: var(--fe-red) !important; }
.link-primary { color: var(--fe-red) !important; }
.link-primary:hover, .link-primary:focus { color: var(--fe-red-dark) !important; }
.btn-link { color: var(--fe-red); }
.btn-link:hover { color: var(--fe-red-dark); }

.btn-primary { color: #fff; background-color: var(--fe-red); border-color: var(--fe-red); }
.btn-primary:hover, .btn-primary:focus, .btn-check:checked + .btn-primary, .btn-check:active + .btn-primary,
.btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
    color: #fff; background-color: var(--fe-red-dark); border-color: var(--fe-red-dark);
}
.btn-primary:disabled, .btn-primary.disabled { color: #fff; background-color: var(--fe-red); border-color: var(--fe-red); }

.btn-outline-primary { color: var(--fe-red); border-color: var(--fe-red); }
.btn-outline-primary:hover, .btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary,
.btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {
    color: #fff; background-color: var(--fe-red); border-color: var(--fe-red);
}
.btn-outline-primary:disabled, .btn-outline-primary.disabled { color: var(--fe-red); background-color: transparent; }

.btn:focus, .btn-check:focus + .btn, .btn-primary:focus, .btn-outline-primary:focus,
.form-control:focus, .form-select:focus, .form-check-input:focus, .accordion-button:focus,
.page-link:focus, .btn-close:focus { box-shadow: 0 0 0 .25rem rgba(var(--fe-red-rgb), .25); }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: var(--fe-red-light); }
.form-check-input:checked, .form-check-input[type=checkbox]:indeterminate { background-color: var(--fe-red); border-color: var(--fe-red); }
.form-range::-webkit-slider-thumb { background-color: var(--fe-red); }
.form-range::-moz-range-thumb { background-color: var(--fe-red); }

.dropdown-item.active, .dropdown-item:active,
.dropdown-menu-dark .dropdown-item.active, .dropdown-menu-dark .dropdown-item:active { background-color: var(--fe-red); }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: var(--fe-red); }
.page-link { color: var(--fe-red); }
.page-item.active .page-link { background-color: var(--fe-red); border-color: var(--fe-red); }
.progress-bar { background-color: var(--fe-red); }
.list-group-item.active { background-color: var(--fe-red); border-color: var(--fe-red); }
.navbar .navbar-nav .nav-link:hover, .navbar .navbar-nav .nav-link.active { color: var(--fe-red); }

/* ---------- Menu téléphone : fond noir + bouton Billetterie ---------- */
@media (max-width: 991.98px) {
    .navbar { z-index: 1030; }
    .navbar .navbar-collapse {
        margin: .75rem 1rem 0; border-radius: 18px; overflow: hidden;
        background: #0b0b0e; border: 1px solid rgba(255, 255, 255, .1);
        box-shadow: 0 24px 50px rgba(0, 0, 0, .6);
    }
    .navbar .navbar-collapse .navbar-nav { padding: 1rem 1.25rem 1.25rem !important; }
    .navbar .navbar-collapse .nav-link { padding: .8rem 0; border-bottom: 1px solid rgba(255, 255, 255, .07); }
    .navbar .navbar-collapse .dropdown-menu { background: #16161b; border: 0; border-radius: 12px; margin: 0 0 .5rem; }
    .navbar .navbar-collapse .dropdown-item { color: #f2f2f5; }
    .navbar .navbar-collapse .mn-ticket {
        display: flex; align-items: center; justify-content: center; margin-top: 1rem; padding: .85rem 1rem;
        border: 2px solid var(--fe-red); border-bottom: 2px solid var(--fe-red);
        border-radius: 999px; color: var(--fe-red) !important; font-weight: 700;
    }
    .navbar .navbar-collapse .mn-ticket:hover, .navbar .navbar-collapse .mn-ticket:focus {
        background: var(--fe-red); color: #fff !important;
    }
}