/* ============================================================
   Charte graphique SCO Sainte-Marguerite
   Chargée APRÈS Bootstrap : surcharge ses variables CSS.
   Règles : rouge SCO = action et navigation ; jaune = onglet
   actif et surlignages ; les couleurs des types de séance
   restent les seules couleurs « signal » du contenu.
   ============================================================ */

/* Polices du site du club, auto-hébergées (aucune requête vers Google) :
   Roboto pour la navigation, le texte et les boutons ; Poppins pour les titres. */
@font-face {
    font-family: 'Roboto';
    src: url("../fonts/roboto-var.b7627e3c9663.woff2") format('woff2');
    font-weight: 100 900;  /* fonte variable : une seule ressource pour toutes les graisses */
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url("../fonts/poppins-600.b550bca8934b.woff2") format('woff2');
    font-weight: 600;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url("../fonts/poppins-700.0bd523f60499.woff2") format('woff2');
    font-weight: 700;
    font-display: swap;
}

:root {
    --sco-rouge: #B32025;
    --sco-rouge-fonce: #8F1519;
    --sco-jaune: #F1C232;

    /* Bootstrap utilise ces variables pour tout le corps de page */
    --bs-body-font-family: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --bs-font-sans-serif: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;

    /* Le « primaire » Bootstrap devient le rouge SCO
       (boutons, badges text-bg-primary, liens…) */
    --bs-primary: var(--sco-rouge);
    --bs-primary-rgb: 179, 32, 37;
    --bs-link-color: var(--sco-rouge);
    --bs-link-color-rgb: 179, 32, 37;
    --bs-link-hover-color: var(--sco-rouge-fonce);
    --bs-link-hover-color-rgb: 143, 21, 25;
    --bs-danger: var(--sco-rouge);
    --bs-danger-rgb: 179, 32, 37;
}

/* ---------- Typographie ----------
   Titres en Poppins ; navigation, texte courant et boutons en Roboto. */
body,
.btn,
.form-control,
.form-select,
.navbar {
    font-family: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', 'Roboto', system-ui, sans-serif;
    font-weight: 700;
}

/* La marque de la navbar suit la navigation : Roboto */
.sco-navbar .navbar-brand {
    font-family: 'Roboto', system-ui, sans-serif;
    font-weight: 700;
}

/* ---------- Boutons ----------
   Action principale : rouge SCO plein.
   Action destructrice : contour rouge (jamais plein), la forme
   distingue l'action du danger. Les .btn-danger existants sont
   automatiquement convertis en contour ici, sans toucher au HTML. */
.btn-primary, .btn-success {
    --bs-btn-bg: var(--sco-rouge);
    --bs-btn-border-color: var(--sco-rouge);
    --bs-btn-hover-bg: var(--sco-rouge-fonce);
    --bs-btn-hover-border-color: var(--sco-rouge-fonce);
    --bs-btn-active-bg: var(--sco-rouge-fonce);
    --bs-btn-active-border-color: var(--sco-rouge-fonce);
    --bs-btn-disabled-bg: var(--sco-rouge);
    --bs-btn-disabled-border-color: var(--sco-rouge);
}
.btn-outline-primary {
    --bs-btn-color: var(--sco-rouge);
    --bs-btn-border-color: var(--sco-rouge);
    --bs-btn-hover-bg: var(--sco-rouge);
    --bs-btn-hover-border-color: var(--sco-rouge);
    --bs-btn-active-bg: var(--sco-rouge-fonce);
    --bs-btn-active-border-color: var(--sco-rouge-fonce);
}
.btn-danger, .btn-outline-danger {
    --bs-btn-color: var(--sco-rouge);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--sco-rouge);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--sco-rouge);
    --bs-btn-hover-border-color: var(--sco-rouge);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--sco-rouge-fonce);
    --bs-btn-active-border-color: var(--sco-rouge-fonce);
}
/* « Modifier » (ex-jaune) : neutre — le jaune est réservé à
   l'onglet actif et aux surlignages */
.btn-warning {
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: #CFC5C0;
    --bs-btn-hover-color: var(--sco-rouge);
    --bs-btn-hover-bg: rgba(179, 32, 37, 0.06);
    --bs-btn-hover-border-color: var(--sco-rouge);
    --bs-btn-active-color: var(--sco-rouge-fonce);
    --bs-btn-active-bg: rgba(179, 32, 37, 0.1);
    --bs-btn-active-border-color: var(--sco-rouge-fonce);
}

/* ---------- Barre de navigation (variante C) ----------
   Blanche, liseré rouge, logo ; onglet actif rouge souligné de jaune. */
.sco-navbar {
    background: #fff;
    border-bottom: 3px solid var(--sco-rouge);
}
.sco-navbar .navbar-brand {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    color: var(--sco-rouge);
    font-weight: 700;
}
.sco-navbar .navbar-brand img { height: 34px; width: auto; }
.sco-navbar .nav-link {
    color: #4a403e;
    font-weight: 500;
}
.sco-navbar .nav-link:hover,
.sco-navbar .nav-link:focus { color: var(--sco-rouge); }
.sco-navbar .nav-link.active {
    color: var(--sco-rouge);
    font-weight: 700;
    box-shadow: inset 0 -3px var(--sco-jaune);
}
.sco-navbar .navbar-toggler { border-color: rgba(179, 32, 37, 0.4); }
.sco-navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(179, 32, 37, 0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ---------- Pied de page ----------
   Pied « collant » : sur une page peu remplie il se cale en bas de la
   fenêtre, sans jamais chevaucher le contenu d'une page longue.
   Le corps devient une colonne flexible et l'espace libre est absorbé
   par la marge automatique du pied. */
body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
body > .container {
    margin-bottom: 3rem;   /* respiration avant le pied sur les pages longues */
}

.sco-pied {
    margin-top: auto;      /* pousse le pied en bas quand la page est courte */
    flex-shrink: 0;
    padding: 1.1rem 0 1.3rem;
    border-top: 1px solid #E6DEDB;
    background: #fff;
    font-size: 0.85rem;
    color: #7A6F6C;
}
.sco-pied .container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
    justify-content: space-between;
    align-items: center;
}
.sco-pied-liens { display: flex; flex-wrap: wrap; gap: 1.25rem; }
.sco-pied a { color: var(--sco-rouge); text-decoration: none; }
.sco-pied a:hover, .sco-pied a:focus { text-decoration: underline; }
