/* =============================================================================
   ABML — Feuille de style principale
   Design basé sur ABML 3.0 beta (WEBDEV)
   Fonts  : Roboto-Bold (titre hero), NotoSans (corps)
   Palette: Blanc navbar / Dark navy hero / Brun-rouge admin / Orange CTA
============================================================================= */

/* ── Fonts ──────────────────────────────────────────────────────────────────── */
@font-face {
    font-family: 'RobotoBold';
    src: url('../fonts/Roboto-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'NotoSans';
    src: url('../fonts/NotoSans-Regular.ttf') format('truetype');
    font-weight: 400;
}
@font-face {
    font-family: 'NotoSans';
    src: url('../fonts/NotoSans-Bold.ttf') format('truetype');
    font-weight: 700;
}
@font-face {
    font-family: 'NotoSans';
    src: url('../fonts/NotoSans-Italic.ttf') format('truetype');
    font-style: italic;
}
@font-face {
    font-family: 'NotoSans';
    src: url('../fonts/NotoSans-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
}

/* ── Variables ── Palette ABML canonique (source unique de vérité) ───────────
   Hiérarchie : [couleur]-darker → dark → [base] → light → lighter → pastel
   Alias maintenus pour compatibilité ascendante.
   Ne jamais coder une couleur en dur dans les PHP/CSS — toujours utiliser ces vars.
────────────────────────────────────────────────────────────────────────────── */
:root {

    /* ═══ BLEU PRIMAIRE ════════════════════════════════════════════════════════ */
    --primary-darker:  #0D47A1;   /* liens sur fond clair très foncé            */
    --primary-dark:    #1565C0;   /* boutons actifs, titres                     */
    --primary:         #1E88E5;   /* couleur principale (liens, focus, MON ÉQUIPE) */
    --primary-light:   #BBDEFB;   /* arrière-plans légers, badges               */
    --primary-lighter: #E3F2FD;   /* fonds de cellules, hovers très discrets    */
    --primary-pastel:  #CFE8FC;   /* pastilles pâles                            */

    /* ═══ ORANGE SECONDAIRE / CTA ══════════════════════════════════════════════ */
    --secondary-darker: #E65100;  /* alias --orange-hover (hover CTA)           */
    --secondary-dark:   #EF6C00;  /* orange foncé intermédiaire                 */
    --secondary:        #FF6D00;  /* alias --orange : CTA hero, boutons         */
    --secondary-light:  #FFAB40;  /* badges orange pâle                         */
    --secondary-lighter:#FFE0B2;  /* fonds avertissement doux                   */
    --secondary-pastel: #FFECD2;  /* fonds très pâles                           */
    /* Alias historiques conservés */
    --orange:           #FF6D00;
    --orange-hover:     #E65100;

    /* ═══ VERT SUCCÈS ══════════════════════════════════════════════════════════ */
    --success-darker:  #1B5E20;   /* texte sur fond vert pâle                   */
    --success-dark:    #2E7D32;   /* statut validé foncé                        */
    --success:         #43A047;   /* validations, statut actif                  */
    --success-light:   #A5D6A7;   /* icônes sur fond blanc                      */
    --success-lighter: #E8F5E9;   /* fonds de badge succès                      */
    --success-pastel:  #C8E6C9;   /* pastilles vertes pâles                     */
    /* Alias */
    --green-active:    #43A047;

    /* ═══ ROUGE DANGER ═════════════════════════════════════════════════════════ */
    --danger-darker:   #B71C1C;   /* texte sur fond rouge très pâle             */
    --danger-dark:     #C62828;   /* bouton ADMIN navbar, alertes critiques      */
    --danger:          #E53935;   /* états d'erreur, suppressions               */
    --danger-light:    #EF9A9A;   /* icônes danger sur fond blanc               */
    --danger-lighter:  #FFEBEE;   /* fonds alerte danger                        */
    --danger-pastel:   #FFCDD2;   /* pastilles rouges pâles                     */

    /* ═══ INFO BLEU ════════════════════════════════════════════════════════════ */
    --info-darker:     #01579B;
    --info-dark:       #0277BD;
    --info:            #0288D1;
    --info-light:      #81D4FA;
    --info-lighter:    #E1F5FE;
    --info-pastel:     #B3E5FC;

    /* ═══ AVERTISSEMENT ORANGE/JAUNE ═══════════════════════════════════════════ */
    --warning-darker:  #E65100;
    --warning-dark:    #EF6C00;
    --warning:         #FF9800;
    --warning-light:   #FFCC80;
    --warning-lighter: #FFF8E1;
    --warning-pastel:  #FFE0B2;

    /* ═══ NEUTRES / GRIS-BLEU ══════════════════════════════════════════════════ */
    --dark-darker:     #1A2327;   /* fonds très sombres (email footer)          */
    --dark:            #263238;   /* texte principal                            */
    --dark-light:      #4F5B62;   /* texte secondaire sur fond sombre           */
    --gray-dark:       #455A64;   /* labels, placeholders                       */
    --gray:            #607D8B;   /* texte tertiaire, icônes                    */
    --gray-medium:     #546E7A;   /* entre gray et gray-dark                    */
    --gray-light:      #ECEFF1;   /* séparateurs, fonds tableaux                */
    --light:           #F5F7FA;   /* fond général des pages                     */
    --light-dark:      #CFD8DC;   /* bordures légères                           */
    --border:          #E0E0E0;   /* bordures standard                          */
    --border-light:    #E9ECEF;   /* bordures très légères (Bootstrap compat)   */
    --white:           #FFFFFF;
    /* Alias historiques */
    --dark-text:       #263238;
    --light-bg:        #F5F7FA;

    /* ═══ ABML STRUCTURE (spécifiques au design ABML) ══════════════════════════ */
    --dark-navy:       #1A1F35;   /* hero, headers de sections                  */
    --dark-navy2:      #141828;   /* footer, dégradé hero                       */
    --dark-navy-mid:   #1E2D3D;   /* sections intermédiaires (email, tableaux)  */
    --dark-navy-card:  #1B2A4A;   /* cartes sombres ABML                        */
    --admin-red:       #8B3220;   /* header admin (gradient gauche)             */
    --admin-red2:      #6B2518;   /* header admin (gradient droit)              */
    --blue-steel:      #90CAF9;   /* accents bleu acier (email, badges clairs)  */

    /* ═══ STATUS SÉMANTIQUES (alias courts) ════════════════════════════════════ */
    /* Conservés pour compatibilité avec Bootstrap + code existant */

    /* ═══ EFFETS ════════════════════════════════════════════════════════════════ */
    --shadow:          0 2px 8px rgba(0,0,0,.10);
    --shadow-md:       0 4px 12px rgba(0,0,0,.12);
    --shadow-lg:       0 6px 20px rgba(0,0,0,.15);
    --radius:          6px;
    --radius-md:       8px;
    --radius-lg:       12px;
}

/* ── Reset / Base ───────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: 'NotoSans', 'Segoe UI', sans-serif;
    font-size: 15px;
    color: var(--dark-text);
    background: var(--light-bg);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main { flex: 1; }

a { color: var(--info); text-decoration: none; }
a:hover { color: #1565C0; text-decoration: underline; }

h1, h2, h3, h4 { font-family: 'NotoSans', sans-serif; font-weight: 700; }

/* ── NAVBAR ─────────────────────────────────────────────────────────────────── */
.abml-navbar {
    background: var(--white) !important;
    border-bottom: 1px solid var(--border);
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
    padding: .4rem 1.5rem;
}

.abml-navbar .navbar-brand img {
    height: 48px;
}

/* Liens de navigation */
.abml-navbar .nav-link {
    color: var(--dark-text) !important;
    font-weight: 600;
    font-size: .92rem;
    padding: .35rem .7rem !important;
    border-radius: 4px;
    border: 1.5px solid transparent;
    transition: color .15s ease, border-color .15s ease;
}
.abml-navbar .nav-link:hover {
    color: var(--primary) !important;
    text-decoration: none;
}
/* Indicateur page active : rectangle bordure bleue */
.abml-navbar .nav-link.active,
.abml-navbar .nav-link.current {
    color: var(--primary) !important;
    font-weight: 700;
    border: 1.5px solid var(--primary) !important;
}

/* Bouton MON ÉQUIPE — spécificité augmentée pour battre .abml-navbar .nav-link */
.abml-navbar .btn-navbar-equipe {
    background: var(--primary) !important;
    color: var(--white) !important;
    font-weight: 700;
    font-size: .85rem;
    padding: .35rem 1rem !important;
    border-radius: 20px;
    border: none !important;
    transition: background .2s;
}
.abml-navbar .btn-navbar-equipe:hover {
    background: var(--primary-dark) !important;
    color: var(--white) !important;
    text-decoration: none;
}

/* Bouton ADMIN */
.abml-navbar .btn-navbar-admin {
    background: var(--danger-dark) !important;
    color: var(--white) !important;
    font-weight: 700;
    font-size: .85rem;
    padding: .35rem 1rem !important;
    border-radius: 20px;
    border: none !important;
    transition: background .2s;
}
.abml-navbar .btn-navbar-admin:hover {
    background: var(--danger-darker) !important;
    color: var(--white) !important;
    text-decoration: none;
}

/* Bouton utilisateur (connecté ou non) */
.abml-user-btn {
    display: flex !important;
    align-items: center;
    gap: .4rem;
    padding: .3rem .65rem !important;
    border: 1.5px solid var(--border) !important;
    border-radius: 20px;
    background: var(--white);
    color: var(--dark-text) !important;
    text-decoration: none !important;
    transition: border-color .15s;
    cursor: pointer;
}
.abml-user-btn:hover {
    border-color: var(--primary) !important;
    text-decoration: none !important;
}
.abml-user-btn img.user-icon {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}
.abml-user-name {
    font-size: .85rem;
    font-weight: 600;
    color: var(--dark-text);
    white-space: nowrap;
}

/* ── FOND « TERRAIN » DES BANDES NAVY ────────────────────────────────────────
   Trace d'un terrain de minifoot en perspective, posée entre le fond navy et le
   contenu. À ajouter sur n'importe quelle bande sombre déjà en position:relative
   et dont le contenu est au-dessus de z-index 0.
   ::before = le terrain (masque radial → il s'estompe sur les bords)
   ::after  = voile central qui garde logo et textes lisibles par-dessus       */
.abml-pitch-bg::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url('../img/terrain_blueprint.webp') center 58% / cover no-repeat;
    opacity: .09;
    z-index: 0;
    pointer-events: none;
    -webkit-mask-image: radial-gradient(125% 105% at 50% 58%, #000 40%, rgba(0,0,0,.35) 72%, transparent 100%);
            mask-image: radial-gradient(125% 105% at 50% 58%, #000 40%, rgba(0,0,0,.35) 72%, transparent 100%);
}
.abml-pitch-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(58% 68% at 50% 50%, rgba(10,14,30,.62) 0%, rgba(10,14,30,.28) 55%, rgba(10,14,30,0) 78%);
    z-index: 0;
    pointer-events: none;
}

/* ── HERO BANNER ────────────────────────────────────────────────────────────── */
.abml-hero {
    position: relative;
    background: linear-gradient(135deg, var(--dark-navy2) 0%, var(--dark-navy) 100%);
    color: var(--white);
    height: 480px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 0 1rem;
}

/* Joueurs gauche */
.abml-hero .hero-players {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 100%;
    width: auto;
    pointer-events: none;
    z-index: 1;
}

/* Gardien droite */
.abml-hero .hero-keeper {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 100%;
    width: auto;
    pointer-events: none;
    z-index: 1;
}

/* Contenu central */
.abml-hero .hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 600px;
    padding: 0 1rem;
}

.abml-hero .hero-logo {
    height: 120px;
    margin-bottom: .25rem;
}
.abml-hero .hero-depuis {
    font-style: italic;
    font-size: .85rem;
    opacity: .75;
    letter-spacing: 1.5px;
    margin-bottom: .85rem;
}

.abml-hero h1 {
    font-family: 'RobotoBold', 'NotoSans', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: .5rem;
    text-shadow: 0 2px 8px rgba(0,0,0,.4);
    text-transform: none;
}

.abml-hero p {
    font-family: 'NotoSans', sans-serif;
    font-size: .95rem;
    opacity: .9;
    margin-bottom: 1.5rem;
}

/* Boutons hero */
.btn-hero-primary {
    background: var(--orange);
    color: var(--white) !important;
    font-weight: 700;
    padding: .55rem 1.5rem;
    border-radius: 4px;
    border: none;
    margin: .25rem;
    display: inline-block;
    transition: background .2s;
}
.btn-hero-primary:hover { background: var(--orange-hover); text-decoration: none; color: var(--white) !important; }

.btn-hero-outline {
    background: transparent;
    color: var(--white) !important;
    font-weight: 700;
    padding: .53rem 1.5rem;
    border-radius: 4px;
    border: 2px solid var(--white);
    margin: .25rem;
    display: inline-block;
    transition: all .2s;
}
.btn-hero-outline:hover { background: rgba(255,255,255,.15); text-decoration: none; color: var(--white) !important; }

/* ── SECTION HEADERS ────────────────────────────────────────────────────────── */
.abml-section-header {
    background: var(--dark-navy);
    color: var(--white);
    padding: .65rem 1.1rem;
    border-radius: var(--radius) var(--radius) 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 0;
}

.abml-section-body {
    background: var(--white);
    border: 1px solid var(--border);
    border-top: none;
    border-radius: 0 0 var(--radius) var(--radius);
    padding: 1rem;
}

/* ── ADMIN HEADER ───────────────────────────────────────────────────────────── */
.abml-admin-header {
    background: linear-gradient(135deg, var(--danger-darker) 0%, var(--danger-dark) 100%);
    color: var(--white);
    padding: 1rem 1.5rem;
    text-align: center;
    font-family: 'RobotoBold', 'NotoSans', sans-serif;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 1.5rem;
    border-radius: var(--radius);
    position: relative;
}

/* Badge LIVE SCORES */
.badge-live {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    background: var(--success);
    color: var(--white);
    font-size: .75rem;
    font-weight: 700;
    padding: .3rem .7rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

/* ── ADMIN MODULE BUTTONS ───────────────────────────────────────────────────── */
.abml-admin-modules {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: center;
    margin-bottom: 1.5rem;
}
.abml-admin-modules-sep {
    width: 100%;
    border: none;
    border-top: 2px dashed var(--border);
    margin: .25rem 0;
    opacity: .6;
}
/* Séparateur vertical entre ORGANISATION et le reste */
.abml-admin-modules-sep--vert {
    width: 2px;
    height: auto;
    min-height: 60px;
    border: none;
    border-left: 2px dashed var(--border);
    margin: 0 .5rem;
    align-self: stretch;
    flex: none;
    opacity: .6;
}

/* Bouton ORGANISATION : légèrement mis en avant */
.abml-admin-module-org {
    border-color: var(--admin-red) !important;
    color: var(--admin-red) !important;
}
.abml-admin-module-org:hover {
    background: #fdf0ed;
    color: var(--admin-red) !important;
}

.abml-admin-module-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: .75rem 1rem;
    min-width: 90px;
    cursor: pointer;
    text-decoration: none;
    color: var(--dark-text);
    font-size: .8rem;
    font-weight: 600;
    box-shadow: var(--shadow);
    transition: transform .15s, box-shadow .15s;
}
.abml-admin-module-btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
    text-decoration: none;
    color: var(--dark-text);
}
.abml-admin-module-btn .module-icon {
    font-size: 1.8rem;
}

/* ── CARDS ──────────────────────────────────────────────────────────────────── */
.abml-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
    transition: transform .15s, box-shadow .15s;
}
.abml-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }

/* ── TABLES ─────────────────────────────────────────────────────────────────── */
.abml-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
}
.abml-table thead th {
    background: var(--dark-navy);
    color: var(--white);
    padding: .6rem .9rem;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
}
.abml-table tbody td {
    padding: .55rem .9rem;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}
.abml-table tbody tr:last-child td { border-bottom: none; }
.abml-table tbody tr:hover { background: #F0F7FF; }

/* Badge abréviation club */
.club-badge {
    display: inline-block;
    background: var(--dark-navy);
    color: var(--white);
    font-weight: 700;
    font-size: .78rem;
    padding: .2rem .5rem;
    border-radius: 3px;
    min-width: 36px;
    text-align: center;
    letter-spacing: .5px;
}

/* ── FORMULAIRES ────────────────────────────────────────────────────────────── */
.abml-form-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 2rem;
    max-width: 460px;
    margin: 2rem auto;
}
.form-label { font-weight: 600; font-size: .9rem; }
.form-control:focus, .form-select:focus {
    border-color: var(--orange);
    box-shadow: 0 0 0 .2rem rgba(255,102,0,.2);
}

/* ── BOUTONS ────────────────────────────────────────────────────────────────── */
.btn-abml {
    background: var(--orange);
    color: var(--white);
    font-weight: 700;
    border: none;
    border-radius: 4px;
    padding: .45rem 1.2rem;
    cursor: pointer;
    transition: background .2s;
    display: inline-block;
}
.btn-abml:hover { background: var(--orange-hover); color: var(--white); text-decoration: none; }

.btn-abml-outline {
    background: transparent;
    color: var(--orange);
    font-weight: 700;
    border: 2px solid var(--orange);
    border-radius: 4px;
    padding: .43rem 1.2rem;
    cursor: pointer;
    transition: all .2s;
    display: inline-block;
}
.btn-abml-outline:hover { background: var(--orange); color: var(--white); text-decoration: none; }

/* ── STATS ──────────────────────────────────────────────────────────────────── */
.abml-stat-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-top: 4px solid var(--dark-navy);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1.1rem;
    text-align: center;
}
.abml-stat-card .stat-value { font-size: 1.9rem; font-weight: 700; color: var(--dark-navy); }
.abml-stat-card .stat-label { font-size: .78rem; color: var(--gray); text-transform: uppercase; letter-spacing: .5px; }
.abml-stat-card.orange  { border-top-color: var(--orange); }
.abml-stat-card.orange  .stat-value { color: var(--orange); }
.abml-stat-card.green   { border-top-color: var(--success); }
.abml-stat-card.green   .stat-value { color: var(--success); }
.abml-stat-card.red     { border-top-color: var(--danger-dark); }
.abml-stat-card.red     .stat-value { color: var(--danger-dark); }

/* ── PAGE HEADER (admin pages) ──────────────────────────────────────────────── */
.abml-page-header {
    background: linear-gradient(135deg, var(--danger-darker) 0%, var(--danger-dark) 100%);
    color: var(--white);
    border-radius: var(--radius);
    padding: 1rem 1.5rem;
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .5rem;
}
.abml-page-header h1 { font-size: 1.3rem; font-weight: 700; margin: 0; }

/* ── ALERTES ────────────────────────────────────────────────────────────────── */
.alert { border-radius: var(--radius); font-size: .9rem; }

/* ── FOOTER ─────────────────────────────────────────────────────────────────── */
.abml-footer {
    background: var(--dark-navy2);
    color: rgba(255,255,255,.7);
    font-size: .85rem;
    padding: 1rem 1.5rem;
    margin-top: 3rem;
}
.abml-footer a { color: rgba(255,255,255,.85); }
.abml-footer a:hover { color: var(--white); }

/* ── RESPONSIVE ─────────────────────────────────────────────────────────────── */
@media (max-width: 992px) {
    .abml-hero { height: 300px; }
    .abml-hero .hero-players,
    .abml-hero .hero-keeper { opacity: .35; }
    .abml-hero h1 { font-size: 1.5rem; }
}
@media (max-width: 576px) {
    .abml-hero { height: 260px; }
    .abml-hero .hero-players,
    .abml-hero .hero-keeper { display: none; }
    .abml-hero h1 { font-size: 1.3rem; }
    .abml-admin-header { font-size: 1.2rem; }
    .badge-live { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   CARTE SAISON COURANTE  (.abml-sc)
   ═══════════════════════════════════════════════════════════════════════════ */
.abml-sc {
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: 0 4px 18px rgba(0,0,0,.12);
    background: var(--white);
    border: 1px solid var(--border);
}

/* -- En-tête gradient bleu -- */
.abml-sc-header {
    background: linear-gradient(135deg, #0D47A1 0%, #1E88E5 60%, #42A5F5 100%);
    color: #fff;
    padding: 1rem 1.4rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}
.abml-sc-badge {
    background: rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 20px;
    padding: .3rem .9rem;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .6px;
    text-transform: uppercase;
    white-space: nowrap;
}
.abml-sc-title {
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: .3px;
    flex: 1;
    text-shadow: 0 1px 4px rgba(0,0,0,.2);
}
.abml-sc-header-actions { margin-left: auto; }

/* -- Barre de progression -- */
.abml-sc-progress-wrap {
    background: #f0f4ff;
    padding: .7rem 1.4rem .5rem;
    border-bottom: 1px solid var(--border);
}
.abml-sc-progress-track {
    background: #dde4f0;
    border-radius: 6px;
    height: 10px;
    overflow: hidden;
    position: relative;
}
.abml-sc-progress-fill {
    height: 100%;
    border-radius: 6px;
    transition: width .4s ease;
    background: var(--primary);
    box-shadow: inset 0 1px 2px rgba(255,255,255,.4);
}
.abml-sc-progress-labels {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: .35rem;
    font-size: .8rem;
    color: var(--gray);
    flex-wrap: wrap;
    gap: .25rem;
}
.abml-sc-prog-date { color: var(--dark-navy); font-weight: 500; }
.abml-sc-prog-status { font-size: .82rem; font-weight: 500; text-align: center; flex: 1; }

/* -- Grille des blocs -- */
.abml-sc-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    border-top: 1px solid var(--border);
}
.abml-sc-grid-3 {
    grid-template-columns: repeat(3, 1fr);
}
.abml-sc-block {
    padding: 1.1rem 1.2rem;
    border-right: 1px solid var(--border);
}
.abml-sc-block:last-child { border-right: none; }

/* Bloc équipes centré */
.abml-sc-block-center { text-align: center; }
.abml-sc-block-center .abml-sc-kv { text-align: left; }

/* -- Titre de section interne -- */
.abml-sc-block-title {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .6px;
    color: var(--primary);
    border-bottom: 2px solid #e3edf8;
    padding-bottom: .35rem;
    margin-bottom: .6rem;
}

/* -- Ligne clé/valeur -- */
.abml-sc-kv {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: .5rem;
    font-size: .82rem;
    padding: .18rem 0;
    border-bottom: 1px dotted #e8ecf2;
}
.abml-sc-kv:last-child { border-bottom: none; }
.abml-sc-kv span { color: var(--gray); white-space: nowrap; }
.abml-sc-kv strong { text-align: right; }

/* -- Séparateur intra-bloc -- */
.abml-sc-sep {
    border: none;
    border-top: 1px solid #e3edf8;
    margin: .65rem 0 .5rem;
}

/* -- Grands chiffres (jauge équipes) -- */
.abml-sc-big-number {
    font-size: 3rem;
    font-weight: 900;
    line-height: 1;
    margin: .4rem 0 .1rem;
}
.abml-sc-sub { font-size: .8rem; color: var(--gray); }

/* -- Mini barre de progression équipes -- */
.abml-sc-mini-bar {
    background: #dde4f0;
    border-radius: 4px;
    height: 7px;
    overflow: hidden;
    margin: .4rem 0 .2rem;
}
.abml-sc-mini-fill {
    height: 100%;
    border-radius: 4px;
    background: var(--primary);
}
.abml-sc-mini-pct { font-size: .75rem; color: var(--gray); }

/* -- Chips tarifs -- */
.abml-sc-chips {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    margin-bottom: .6rem;
}
.abml-sc-chip {
    flex: 1;
    min-width: 70px;
    background: color-mix(in srgb, var(--chip) 10%, white);
    border: 2px solid var(--chip);
    border-radius: var(--radius);
    padding: .4rem .5rem;
    text-align: center;
}
.abml-sc-chip-lbl { font-size: .68rem; color: var(--chip); font-weight: 600; text-transform: uppercase; letter-spacing: .4px; }
.abml-sc-chip-val { font-size: 1rem; font-weight: 800; color: var(--chip); }

/* -- Pied de carte -- */
.abml-sc-footer {
    background: #f7f9fc;
    border-top: 1px solid var(--border);
    padding: .6rem 1.4rem;
    font-size: .82rem;
    color: var(--gray);
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
}
.abml-sc-footer-sep { color: #ccc; margin: 0 .3rem; }

/* -- Responsive -- */
@media (max-width: 1100px) {
    .abml-sc-grid     { grid-template-columns: repeat(2, 1fr); }
    .abml-sc-grid-3   { grid-template-columns: repeat(2, 1fr); }
    .abml-sc-block:nth-child(2) { border-right: none; }
    .abml-sc-block:nth-child(3) { border-top: 1px solid var(--border); }
    .abml-sc-block:nth-child(4) { border-right: none; border-top: 1px solid var(--border); }
    .abml-sc-grid-3 .abml-sc-block:nth-child(3) { border-right: none; }
}
@media (max-width: 640px) {
    .abml-sc-grid { grid-template-columns: 1fr; }
    .abml-sc-block { border-right: none; border-top: 1px solid var(--border); }
    .abml-sc-block:first-child { border-top: none; }
    .abml-sc-title { font-size: 1.15rem; }
    .abml-sc-big-number { font-size: 2.2rem; }
    .abml-sc-chips { gap: .3rem; }
}

/* =============================================================================
   Cartes d'accueil modulaires (système liste_cartes) — classes préfixées hw-
   ========================================================================== */
.home-grid{max-width:1120px;margin:0 auto;display:grid;
  grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.hw-cell{display:flex;grid-column:span 1}
.hw-cell>.hw-card{flex:1;width:100%}
.hw-span-2{grid-column:span 2}
.hw-span-3{grid-column:span 3}
@media (max-width:1000px){
  .home-grid{grid-template-columns:repeat(2,1fr)}
  .hw-span-2,.hw-span-3{grid-column:span 2}
}
@media (max-width:640px){
  .home-grid{grid-template-columns:1fr}
  .hw-span-2,.hw-span-3{grid-column:span 1}
}

/* Colonnes internes (carte saison : classement | prochaine journée) */
.hw-split{display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.5rem;margin-top:.2rem;
  flex:1;align-content:stretch}
@media (max-width:700px){.hw-split{grid-template-columns:1fr;gap:1.3rem;flex:0 1 auto;align-content:start}}
.hw-col{display:flex;flex-direction:column;min-width:0}
.hw-subh{align-self:flex-start;display:inline-flex;align-items:center;gap:.35rem;
  background:#1A1F35;color:#fff;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;
  font-weight:800;padding:.32rem .62rem;border-radius:8px;margin-bottom:.7rem}
.hw-subh i{color:#FF6D00}

/* Gabarit commun */
.hw-card{background:#fff;border-radius:16px;overflow:hidden;
  box-shadow:0 12px 34px rgba(26,31,53,.14);display:flex;flex-direction:column}
.hw-head{background:linear-gradient(120deg,#1A1F35,#26305c);color:#fff;padding:.9rem 1.1rem;
  display:flex;align-items:center;gap:.6rem;font-weight:800}
.hw-head .hw-ic{color:#FF6D00}
.hw-body{padding:1.1rem;display:flex;flex-direction:column;flex:1}
.hw-cta{margin-top:auto}
.hw-link{margin-top:1rem;display:inline-flex;align-items:center;gap:.4rem;
  color:#1E88E5;font-weight:700;text-decoration:none;font-size:.9rem}
.hw-link:hover{color:#1565C0}

/* Carte inscriptions (affiche) */
.hw-ins .hw-hero{position:relative;background:linear-gradient(120deg,#1A1F35,#26305c);color:#fff;
  padding:1.2rem 1.2rem 1.1rem;overflow:hidden}
.hw-ins .hw-hero::after{content:"";position:absolute;right:-50px;top:-40px;width:180px;height:180px;
  border-radius:50%;background:radial-gradient(circle,rgba(255,109,0,.24),transparent 70%)}
.hw-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem}
.hw-top img{height:34px}
.hw-chip{background:#FF6D00;color:#fff;font-weight:800;font-size:.78rem;padding:.28rem .7rem;border-radius:20px}
.hw-title{margin:0;font-weight:900;line-height:.95;letter-spacing:-.01em;font-size:1.85rem;text-transform:uppercase}
.hw-title .o{color:#FF6D00}
.hw-sub{margin:.5rem 0 0;color:#cdd6ee;font-size:.9rem}
.hw-insbody{padding:1rem 1.1rem 1.15rem;display:flex;flex-direction:column;flex:1}
.hw-tile{border:1px solid #e6e9f0;border-radius:12px;padding:.7rem .85rem;background:#fbfcfe}
.hw-lbl{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:#607D8B;font-weight:700;margin-bottom:.25rem}
.hw-big{font-size:1.6rem;font-weight:900;line-height:1;letter-spacing:-.02em}
.hw-big.hw-date{font-size:1.15rem}
.hw-sfx{font-size:.9rem;font-weight:700;color:#607D8B}
.hw-small{font-size:.75rem;color:#607D8B;margin-top:.15rem}
.hw-bar{height:7px;border-radius:6px;background:#e7ebf3;overflow:hidden;margin-top:.5rem}
.hw-bar>i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,#FF6D00,#ff9245)}
.hw-jx{display:inline-block;margin-top:.3rem;background:#fff3e6;color:#c2560a;font-weight:800;
  font-size:.72rem;padding:.1rem .45rem;border-radius:20px}
.hw-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.hw-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;background:#FF6D00;color:#fff;
  font-weight:800;font-size:1rem;padding:.8rem 1rem;border-radius:11px;text-decoration:none;
  box-shadow:0 9px 22px rgba(255,109,0,.32);transition:transform .15s,box-shadow .15s;margin-top:1rem}
.hw-btn:hover{transform:translateY(-2px);box-shadow:0 13px 28px rgba(255,109,0,.42);color:#fff}
.hw-prio{font-size:.76rem;color:#607D8B;margin-top:.6rem;text-align:center}
.hw-prio b{color:#1A1F35}

/* Stats (saison + journée) */
.hw-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;text-align:center;margin-bottom:1rem}
.hw-stats.two{grid-template-columns:1fr 1fr}
.hw-stats.five{grid-template-columns:repeat(auto-fit,minmax(96px,1fr))}
.hw-s{background:#fbfcfe;border:1px solid #e6e9f0;border-radius:11px;padding:.6rem .3rem}
.hw-v{font-size:1.45rem;font-weight:900;line-height:1;color:#1A1F35}
.hw-v.o{color:#FF6D00}.hw-v.g{color:#43A047}
.hw-v.hw-date{font-size:1.1rem}
.hw-v.hw-none{font-size:.82rem;color:#607D8B;font-weight:700;line-height:1.25}
.hw-l{font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:#607D8B;font-weight:700;margin-top:.3rem}

/* Résumé classement */
.hw-clh{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#607D8B;font-weight:700;margin-bottom:.4rem}
.hw-clr{display:flex;align-items:center;gap:.6rem;padding:.32rem 0;border-top:1px solid #e6e9f0;font-size:.9rem}
.hw-clr:first-of-type{border-top:0}
.hw-rk{width:22px;height:22px;border-radius:6px;background:#eef1f6;color:#1A1F35;font-weight:800;
  font-size:.75rem;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.hw-nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.hw-pt{margin-left:auto;font-weight:900;color:#1E88E5}

/* Matchs de la journée */
.hw-day{display:flex;align-items:center;gap:.6rem;margin:.55rem 0 .1rem;
  font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:#8792a6;font-weight:800}
.hw-day::before,.hw-day::after{content:"";flex:1;height:1px;background:#e6e9f0}
.hw-day:first-child{margin-top:0}
.hw-mn{display:flex;align-items:center;gap:.55rem;padding:.42rem 0;border-top:1px solid #e6e9f0;font-size:.86rem}
.hw-mn:first-of-type{border-top:0}
.hw-day + .hw-mn{border-top:0}
.hw-d{font-weight:800;color:#607D8B;font-size:.72rem;width:40px;flex:0 0 auto}
.hw-t{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hw-sc{margin-left:auto;font-weight:800;font-variant-numeric:tabular-nums}
.hw-sc.byez{font-weight:700;font-size:.68rem;letter-spacing:.06em;color:#607D8B;
  background:#eef1f6;padding:.08rem .4rem;border-radius:6px}
.hw-sc.todo{font-weight:600;font-size:.78rem;color:#607D8B}

/* =============================================================================
   Bandeau commun des pages publiques (titre à gauche + logo à droite)
   Composant : includes/module_banner.php — hors Contacts / À Propos (hero custom)
   ========================================================================== */
.abml-page-banner{position:relative;overflow:hidden;background:var(--dark-navy,#1A1F35);padding:26px 0}
.abml-page-banner-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.abml-page-banner-title{color:#fff;font-weight:800;font-size:2.4rem;letter-spacing:.04em;margin:0;text-transform:uppercase}
.abml-page-banner-logo{height:56px}
@media (max-width:576px){.abml-page-banner-title{font-size:1.8rem}}