/* Mondial Pupilles — site des résultats, habillage aligné sur le nouveau site (octobre 2026).
   Fichier CSS externe UTF-8. Remplace la feuille écran existante.
   Les noms de classes historiques sont conservés ; seuls les couleurs, les polices et l'en-tête changent.
   Logo : MONDIAL-pupilles-LOGO-FB.png, à placer dans le même dossier que ce fichier.
   Polices : Saira Condensed (titres) et Barlow (texte) si elles sont chargées par la page,
   sinon les polices système de repli ci-dessous. Aucun service externe n'est appelé par ce fichier.
   Impression : charger votre feuille print APRÈS celle-ci dans le HTML. */
:root {
  --mp-nuit: #1b2230;        /* bleu nuit : en-tête, menu, titres de tableaux, pied */
  --mp-ardoise: #2e3850;     /* survol dans les zones bleu nuit */
  --mp-or: #c9a23f;          /* or : filets, boutons, accents */
  --mp-or-fonce: #b38d2f;    /* survol des boutons */
  --mp-or-texte: #7a5c12;    /* or lisible sur fond clair : liens, vainqueurs */
  --mp-sur-or: #161a22;      /* texte posé sur l'or */
  --mp-text: #161a22;
  --mp-muted: #4f5666;
  --mp-line: #d9cfb8;
  --mp-bg: #f8f4ea;          /* crème : fond de page */
  --mp-sable: #efe6d2;       /* sable : bandeaux de date, survol de ligne */
  --mp-carte: #ffffff;
  --mp-clair: #f8f4ea;       /* texte sur bleu nuit */
  --mp-clair-doux: #b7bcc8;
  --mp-radius: 12px;
  --mp-shadow: 0 2px 4px rgb(22 26 34 / 6%), 0 8px 24px rgb(22 26 34 / 8%);
  --mp-display: "Saira Condensed", "Barlow Condensed", "Roboto Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --mp-sans: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; padding: 0; background: var(--mp-bg); color: var(--mp-text); font: 16px/1.6 var(--mp-sans); -webkit-font-smoothing: antialiased; }
img, video { max-width: 100%; height: auto; }
a { color: var(--mp-or-texte); font-weight: 600; text-underline-offset: 3px; }
a:hover { color: var(--mp-nuit); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 3px solid var(--mp-or-texte); outline-offset: 3px; }
p { margin: 0 0 1em; padding: 0; text-indent: 0; }
h1,h2,h3,h4,h5,h6 { margin: 0 0 .6em; color: var(--mp-text); font-family: var(--mp-display); font-weight: 700; line-height: 1.1; }
h1 { font-size: clamp(30px, 4.5vw, 48px); font-weight: 800; text-transform: uppercase; letter-spacing: .01em; }
h2 { font-size: clamp(24px, 3vw, 36px); }
div#container { position: relative; width: 100%; max-width: 1240px; margin: auto; padding: 0 24px 32px; }
div#contenu { position: relative; margin: 28px 0; }
div#contenu_texte { width: 100%; height: auto; min-height: 360px; overflow: visible; }
/* En-tête : bandeau bleu nuit rayé, filet or, blason à gauche. */
div#tournoi_entete {
  width: 100%; height: auto; min-height: 200px; margin: 24px auto 0; padding: 36px 190px;
  border-radius: 16px; border-bottom: 4px solid var(--mp-or);
  background:
    url("MONDIAL-pupilles-LOGO-FB.png") no-repeat 36px center / auto 150px,
    repeating-linear-gradient(135deg, rgb(255 255 255 / 3%) 0 2px, transparent 2px 26px),
    var(--mp-nuit);
  color: var(--mp-clair); box-shadow: var(--mp-shadow);
  display: flex; flex-direction: column; justify-content: center;
}
.titre_mondial, .titre_tournoi_international, .titre_tournoi_date_banniere { width: 100%; text-align: center; }
.titre_mondial { color: var(--mp-clair); font-family: var(--mp-display); font-size: clamp(32px, 6vw, 60px); font-weight: 800; line-height: 1.05; text-transform: uppercase; letter-spacing: .01em; }
.titre_tournoi_international { margin-top: 12px; color: var(--mp-or); font-family: var(--mp-display); font-size: clamp(14px, 2vw, 18px); font-weight: 700; text-transform: uppercase; letter-spacing: .14em; }
.titre_tournoi_date_banniere { margin-top: 14px; color: var(--mp-clair-doux); font-size: clamp(16px, 2.2vw, 20px); font-weight: 600; }
div#tournoi_menu, div#bloc_menu { position: relative; width: 100%; height: auto; min-height: 52px; margin: 16px auto 0; padding: 0; background: var(--mp-nuit); border-radius: 12px; border-bottom: 3px solid var(--mp-or); }
/* Menu historique : compatible avec sfHover ; focus clavier pris en charge.
   Un parent de sous-menu doit être un lien/bouton focalisable dans le HTML. */
#menu_top, #menu_top * { margin: 0; padding: 0; list-style: none; }
#menu_top { display: flex; flex-wrap: wrap; gap: 4px; padding: 5px; line-height: 1.35; }
#menu_top li { float: none; position: relative; text-align: left; }
#menu_top a, #menu_top span { display: block; position: relative; }
#menu_top li a, #menu_top li a:visited, #menu_top li span { height: auto; min-height: 44px; padding: 12px 17px; border-radius: 8px; text-decoration: none; color: var(--mp-clair-doux); font-size: 15px; font-weight: 600; }
#menu_top li a:hover, #menu_top li a:active { color: var(--mp-clair); background: var(--mp-ardoise); }
#menu_top li a.active { color: var(--mp-sur-or); background: var(--mp-or); }
#menu_top a:focus-visible { outline-color: var(--mp-or); }
#menu_top ul { display: none; position: absolute; top: 100%; left: 0; z-index: 99; width: 240px; padding: 6px; background: var(--mp-nuit); border: 1px solid var(--mp-ardoise); border-radius: 12px; box-shadow: var(--mp-shadow); }
#menu_top ul li { width: 100%; }
#menu_top li:hover > ul, #menu_top li.sfHover > ul, #menu_top li:focus-within > ul { display: block; }
#menu_top ul ul { top: 0; left: 100%; }
div#entete_connexion { height: auto; min-height: 28px; padding-top: 8px; }
div#entete_connexion ul, div#pied_menu ul, div#pied_menu_connexion ul { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 18px; list-style: none; padding: 0; margin: 0; }
div#entete_connexion li, div#pied_menu li, div#pied_menu_connexion li { float: none; margin: 0; padding: 0; }
div#pied_menu_connexion ul { justify-content: flex-start; }
div#tournoi_pied_page, div#pied { position: relative; width: 100%; height: auto; margin: 28px auto 0; padding: 20px 24px; border-radius: var(--mp-radius); border-top: 3px solid var(--mp-or); background: var(--mp-nuit); color: var(--mp-clair-doux); font-size: 14px; }
div#pied_menu, div#pied_mentions { height: auto; }
div#pied a, div#pied span, div#tournoi_pied_page a { color: var(--mp-clair); }
div#pied a:hover, div#pied a.active, div#tournoi_pied_page a:hover { color: var(--mp-or); text-decoration: underline; }
div#pied a:focus-visible, div#tournoi_pied_page a:focus-visible { outline-color: var(--mp-or); }
div#pied_texte { padding: 12px 0; }
div#pied_mentions { width: 100%; margin: auto; padding-top: 12px; text-align: center; }
/* Les tableaux conservent leur structure sémantique ; les grands tableaux
   défilent dans leur bloc sur petit écran, sans masquer de colonnes. */
div#tournoi_tableau, div#tournoi_resultat, div#tournoi_resultat_finales { width: 100%; margin: 24px auto; padding: 0 0 6px; overflow-x: auto; border: 1px solid var(--mp-line); border-radius: var(--mp-radius); background: var(--mp-carte); box-shadow: var(--mp-shadow); }
table { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 15px; font-variant-numeric: tabular-nums; }
#tournoi_tableau table, #tournoi_resultat table, #tournoi_resultat_finales table { min-width: 700px; }
caption { padding: 16px; text-align: left; color: var(--mp-text); font-family: var(--mp-display); font-size: 20px; font-weight: 700; }
th, td { padding: 13px 12px; vertical-align: middle; border: 0; border-bottom: 1px solid var(--mp-line); }
th { background: var(--mp-nuit); color: var(--mp-clair); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
tr#tournoi_ligne_titre { height: auto; text-align: center; background: var(--mp-nuit); color: var(--mp-clair); }
tr#tournoi_ligne_titre > td { background: var(--mp-nuit); color: var(--mp-clair); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border-bottom: 3px solid var(--mp-or); }
#tournoi_tableau tbody tr:nth-child(even) > td, #tournoi_resultat tbody tr:nth-child(even) > td, #tournoi_resultat_finales tbody tr:nth-child(even) > td { background: #fbf8f0; }
#tournoi_tableau tbody tr:hover > td, #tournoi_resultat tbody tr:hover > td, #tournoi_resultat_finales tbody tr:hover > td { background: var(--mp-sable); }
/* La ligne de titre garde son fond bleu nuit, même paire ou survolée. */
#tournoi_tableau tbody tr#tournoi_ligne_titre > td, #tournoi_tableau tbody tr#tournoi_ligne_titre:hover > td { background: var(--mp-nuit); }
th.tournoi_titre_equipe { text-align: left; padding-left: 18px; }
th.tournoi_titre_jeu { width: 62px; text-align: center; }
td.tournoi_case_centre, td.tournoi_resultat_case_centre { text-align: center; }
td.tournoi_case_gauche { text-align: left; padding-left: 18px; font-weight: 600; }
#tournoi_resultat_titre { width: 100%; height: auto; margin-top: 28px; padding: 14px 20px; border-radius: 12px; border-left: 6px solid var(--mp-or); background: var(--mp-nuit); color: var(--mp-clair); font-family: var(--mp-display); font-size: 24px; font-weight: 700; line-height: 1.15; text-transform: uppercase; letter-spacing: .02em; }
div.tournoi_resultat_date, div.tournoi_libelle_ligne { margin: 0; padding: 14px 18px; border-bottom: 1px solid var(--mp-line); background: var(--mp-sable); color: var(--mp-or-texte); font-family: var(--mp-display); font-size: 15px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
div.tournoi_resultat_match { clear: both; padding: 0; font-size: 15px; }
/* Suppression des float sur les td : alignement par le tableau natif. */
td[class^="tournoi_resultat_"], td[class^="phase_finale_resultat_"], td[class^="saisie_finale_resultat_"], td.saisie_resultat_no_match { float: none; }
td.tournoi_resultat_horaire, td.phase_finale_resultat_horaire, td.saisie_finale_resultat_horaire { width: 84px; text-align: center; color: var(--mp-muted); font-weight: 600; white-space: nowrap; }
td.tournoi_resultat_equipe1, td.tournoi_resultat_equipe1_gras, td.phase_finale_resultat_equipe1, td.phase_finale_resultat_equipe1_gras, td.saisie_finale_resultat_equipe1 { width: 28%; text-align: right; }
td.tournoi_resultat_equipe2, td.tournoi_resultat_equipe2_gras, td.phase_finale_resultat_equipe2, td.phase_finale_resultat_equipe2_gras, td.saisie_finale_resultat_equipe2 { width: 28%; text-align: left; }
td.tournoi_resultat_equipe1_gras, td.tournoi_resultat_equipe2_gras, td.phase_finale_resultat_equipe1_gras, td.phase_finale_resultat_equipe2_gras { font-weight: 700; color: var(--mp-or-texte); }
td.tournoi_resultat_score1, td.tournoi_resultat_score2, td.phase_finale_resultat_score1, td.phase_finale_resultat_score2, td.phase_finale_resultat_score1_gras, td.phase_finale_resultat_score2_gras { width: 46px; padding: 10px 8px; text-align: center; font-family: var(--mp-display); font-size: 26px; line-height: 1.1; font-weight: 800; color: var(--mp-text); }
td.tournoi_resultat_tiret, td.phase_finale_resultat_tiret, td.saisie_finale_resultat_tiret { width: 14px; padding: 10px 2px; text-align: center; color: var(--mp-muted); }
td.phase_finale_resultat_no_match, td.saisie_resultat_no_match { width: 64px; text-align: center; color: var(--mp-muted); }
td.phase_finale_resultat_centre, td.saisie_finale_resultat_centre { width: 100px; text-align: center; }
td.saisie_finale_resultat_score1, td.saisie_finale_resultat_score2 { width: 76px; text-align: center; }
td.saisie_finale_resultat_score1 input, td.saisie_finale_resultat_score2 input { width: 58px; text-align: center; padding: 8px 4px; }
/* Connexion et administration */
div#connexion { width: 100%; max-width: 520px; margin: 32px auto; padding: 28px; position: relative; border: 1px solid var(--mp-line); border-radius: 16px; background: var(--mp-carte); box-shadow: var(--mp-shadow); }
div#connexion_titre { height: auto; padding-bottom: 14px; border-bottom: 3px solid var(--mp-or); color: var(--mp-text); font-family: var(--mp-display); font-size: 28px; font-weight: 700; line-height: 1.1; }
div#connexion_desc, div#connexion_desc1, div#connexion_desc2 { margin-top: 12px; color: var(--mp-muted); }
div#connexion_champ { margin-top: 18px; }
td.connexion_col { width: 130px; height: auto; }
td.connexion_point { width: 14px; padding: 4px; }
input, select, textarea, button { font: inherit; max-width: 100%; }
/* Les boutons sont exclus ici, sinon ce style de champ prend le pas sur leur fond or. */
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="image"]):not([type="submit"]):not([type="button"]):not([type="reset"]), select, textarea { min-height: 44px; padding: 10px 12px; border: 1.5px solid #a89f88; border-radius: 8px; background: var(--mp-carte); color: var(--mp-text); }
input { text-align: left; }
input.connexion_input { width: 100%; min-width: 0; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--mp-or-texte); }
input.button, input.button-small, button, input[type="submit"], input[type="button"], input[type="reset"] { min-height: 44px; padding: 11px 20px; border: 1.5px solid transparent; border-radius: 8px; background: var(--mp-or); color: var(--mp-sur-or); font-weight: 700; text-align: center; cursor: pointer; }
input.button:hover, input.button-small:hover, button:hover, input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover { background: var(--mp-or-fonce); color: var(--mp-sur-or); }
input.button:active, input.button-small:active, button:active { background: var(--mp-nuit); color: var(--mp-clair); }
input.button-small { font-size: 14px; padding: 9px 12px; }
input:disabled, button:disabled, select:disabled, textarea:disabled { opacity: .6; cursor: not-allowed; }
/* Spécificité nécessaire face aux styles génériques des champs ci-dessus. */
input.button, input.button-small, input[type="submit"], input[type="button"], input[type="reset"] { background: var(--mp-or); color: var(--mp-sur-or); border-color: transparent; }
input.button:hover, input.button-small:hover, input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover { background: var(--mp-or-fonce); }
td.page_titre_nom, td.tournoi_titre_nom { padding: 14px 16px; text-align: left; font-weight: 600; }
td.page_titre_action, td.tournoi_titre_action, td.tournoi_titre_score { width: 110px; text-align: center; }
td.tournoi_titre_date { width: 150px; text-align: center; }
textarea.page_area_desc { width: 100%; min-height: 100px; }
textarea.page_area_contenu { width: 100%; min-height: 380px; }
textarea { resize: vertical; }
input.tournoi_equipe { width: 100%; max-width: 600px; }
a.lien_visible { color: var(--mp-or-texte); text-decoration: underline; }
a.lien_visible:hover { color: var(--mp-nuit); }
td.titre, td.titre2 { height: auto; padding: 18px 12px 10px; font-family: var(--mp-display); font-size: 22px; font-weight: 700; color: var(--mp-text); }
div#page_container { clear: both; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; height: auto; padding-top: 24px; margin: auto; text-align: center; }
div.page, div.page_inactif { float: none; width: 44px; height: 44px; margin: 0; border: 1.5px solid var(--mp-line); border-radius: 8px; overflow: hidden; }
div.page a, div.page a:visited, div.page_inactif span { display: grid; place-items: center; width: 100%; height: 100%; text-decoration: none; background: var(--mp-carte); color: var(--mp-text); font-weight: 700; }
div.page a:hover, div.page a.active { background: var(--mp-nuit); color: var(--mp-clair); }
div.page_inactif span { background: var(--mp-sable); color: var(--mp-muted); }
@media (max-width: 900px) {
  /* Le blason passe au-dessus des titres. */
  div#tournoi_entete { padding: 124px 20px 28px; background-position: center 24px, 0 0, 0 0; background-size: auto 84px, auto, auto; }
}
@media (max-width: 700px) {
  div#container { padding: 0 12px 20px; }
  div#contenu { margin: 20px 0; }
  div#tournoi_entete { margin-top: 12px; min-height: 180px; padding: 112px 16px 24px; border-radius: 14px; background-position: center 20px, 0 0, 0 0; background-size: auto 76px, auto, auto; }
  #menu_top { gap: 2px; }
  #menu_top > li { flex: 1 1 140px; }
  #menu_top li a, #menu_top li span { padding: 12px; }
  /* Sous-menus visibles sur mobile : accès tactile sans script requis. */
  #menu_top ul, #menu_top ul ul { display: block; position: static; width: 100%; padding: 0 0 0 8px; border: 0; border-left: 2px solid var(--mp-ardoise); border-radius: 0; box-shadow: none; }
  div#connexion { padding: 20px 14px; }
  #connexion th, #connexion td { padding: 10px 4px; }
  td.connexion_col { width: 100px; }
  input, select, textarea { font-size: 16px; }
  .hide_mobile { display: none !important; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media print {
  body { color: black; background: white; font-size: 10pt; }
  div#container { max-width: none; padding: 0; }
  div#tournoi_entete { display: block; min-height: 0; padding: 10px; margin: 0; background: white; border: 0; box-shadow: none; }
  .titre_mondial, .titre_tournoi_international, .titre_tournoi_date_banniere { color: black; }
  div#bloc_menu, div#tournoi_menu, div#entete_connexion, div#page_container { display: none; }
  div#tournoi_tableau, div#tournoi_resultat, div#tournoi_resultat_finales { overflow: visible; border-radius: 0; box-shadow: none; }
  #tournoi_tableau table, #tournoi_resultat table, #tournoi_resultat_finales table { min-width: 0; }
  th, td { padding: 5px; }
  th, tr#tournoi_ligne_titre > td, #tournoi_resultat_titre, #tournoi_tableau tbody tr#tournoi_ligne_titre > td { background: #eee; color: black; }
  tr { break-inside: avoid; }
  thead { display: table-header-group; }
}

/* Ajustements après inspection du site public réel. */
.titre_mondial, .titre_tournoi_international, .titre_tournoi_date_banniere { display: block; }
.titre_mondial { font-size: clamp(30px, 4.5vw, 54px); }
#tournoi_entete > br { display: none; }
/* Accueil : uniquement les blocs contenant directement les liens des centres. */
#tournoi_tableau > div > p { margin: 0; padding: 8px 16px; }
#tournoi_tableau > div > p > a { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 54px; padding: 14px 18px; border: 1px solid var(--mp-line); border-left: 3px solid var(--mp-or); border-radius: 10px; background: #fbf8f0; color: var(--mp-text); font-weight: 700; text-decoration: none; }
#tournoi_tableau > div > p > a::after { content: '→'; color: var(--mp-or-texte); font-size: 22px; }
#tournoi_tableau > div > p > a:hover { background: var(--mp-sable); border-color: var(--mp-or); }
#tournoi_tableau > .tournoi_libelle_ligne { margin-bottom: 8px; }
#tournoi_tableau > div:last-child > p { padding-bottom: 16px; }
/* Le classement réel emploie des td pour ses en-têtes. */
td.tournoi_titre_jeu { text-align: center; white-space: nowrap; }
td.tournoi_titre_equipe { text-align: left; }
#tournoi_tableau table:has(td.tournoi_titre_equipe) td:nth-child(2) { min-width: 200px; text-align: left; font-weight: 700; }
#tournoi_tableau table:has(td.tournoi_titre_equipe) tr:not(#tournoi_ligne_titre) td:nth-child(3) { color: var(--mp-or-texte); font-family: var(--mp-display); font-size: 20px; font-weight: 800; }
/* Garder le score et les tirs au but ensemble : ex. 0 (5). */
td.phase_finale_resultat_score1, td.phase_finale_resultat_score2 { width: 76px; white-space: nowrap; }
td.tournoi_resultat_centre:empty, td.phase_finale_resultat_centre:empty { padding: 0; width: 0; }
div.connexion_col { margin: 16px 0 6px; font-weight: 600; }
#connexion_champ .bouton { margin-top: 20px; }
#pied_menu + #pied_menu, #pied_menu_connexion + #pied_menu { margin-top: 12px; }
#container > br { display: none; }
@media screen and (min-width: 850px) {
  /* :has limite cette grille à l’accueil, jamais aux blocs de résultats. */
  #tournoi_tableau:has(> div > p > a) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding-bottom: 12px; }
  #tournoi_tableau:has(> div > p > a) > .tournoi_libelle_ligne { grid-column: 1 / -1; }
}
