/* Theme jaune/noir */
:root{--bg:#000;--panel:#111;--panel2:#0b0b0b;--yellow:#FFD700;--yellow2:#ffea70;--muted:#bbb;--text:#FFD700;--border:2px solid var(--yellow)}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
.container{max-width:1320px;margin:auto;padding:18px}
.header{margin-bottom:10px}
.header h1{margin:0;font-size:30px;line-height:1.15;text-align:center;word-break:break-word}
.smallNote{color:var(--muted);font-size:12px;line-height:1.4}
.tabs{display:flex;gap:10px;margin:10px 0 14px;flex-wrap:wrap}
.tabBtn{background:var(--yellow);color:#000;border:0;padding:10px 16px;border-radius:10px;cursor:pointer;font-weight:bold}
.tabBtn:hover{background:var(--yellow2)}
.tabBtn.is-active{outline:3px solid var(--yellow2);box-shadow:0 0 0 2px #000 inset}
.tabPanel{min-height:260px;overflow:visible}
.subPanel{min-height:260px;overflow:visible}
.card{background:var(--panel);border:var(--border);border-radius:12px;padding:12px;margin:12px 0;position:relative;z-index:0;overflow:visible}
.card.zTop{z-index:99999}
.card h2{margin:0 0 10px 0}
.label{display:block;font-size:12px;color:#ffef9a;font-weight:bold;margin-bottom:6px}
input[type=time],input[type=number],select,textarea,input[type=text],input[type=password]{background:#000;color:var(--yellow);border:1px solid var(--yellow);border-radius:10px;padding:8px 10px;outline:none}
textarea{width:100%;min-height:120px;resize:vertical}
.filebar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:12px;background:var(--panel);border:var(--border);border-radius:12px}
.filebar button{background:var(--yellow);color:#000;border:0;padding:10px 14px;border-radius:10px;cursor:pointer;font-weight:bold}
.filebar button:hover{background:var(--yellow2)}
.filebar button:disabled{opacity:.4;cursor:not-allowed}
.btnRow{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.btnSecondary{background:transparent;border:1px solid var(--yellow);color:var(--yellow);padding:10px 14px;border-radius:10px;cursor:pointer;font-weight:bold}
.btnSecondary:hover{background:#141414}
.filterBar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.filterBar select{min-width:180px}
.encodageViewBar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:8px 0 12px}
.encodageViewTabs{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.encodageViewBar .smallNote{margin:0}
@media (max-width:720px){.encodageViewBar{align-items:flex-start;flex-direction:column}.encodageViewTabs{width:100%}.encodageViewTabs .tabBtn{flex:1 1 auto}}
.twoCol{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:900px){.twoCol{grid-template-columns:1fr}}
.varRow{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr));gap:10px}
@media (max-width:720px){.varRow{grid-template-columns:1fr}}
.time-block{margin-top:16px}
.time-title{background:var(--yellow);color:#000;font-weight:bold;padding:8px 12px;border-radius:8px;margin-bottom:10px}
.match{display:grid;grid-template-columns:180px 1fr 110px 1fr;gap:10px;align-items:center;background:var(--panel);border:var(--border);border-left-width:10px;border-radius:12px;padding:10px;margin:8px 0}
.meta{font-size:13px;color:#ffef9a;font-weight:bold}
.team{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.score{text-align:center;font-weight:bold;font-size:18px}
@media (max-width:720px){.match{grid-template-columns:1fr 1fr;grid-template-areas:"meta meta" "t1 t2" "score score"}.match .meta{grid-area:meta}.match .team.team1{grid-area:t1}.match .team.team2{grid-area:t2}.match .score{grid-area:score}}

table{width:100%;border-collapse:collapse;background:var(--panel);border:var(--border);border-radius:12px;overflow:hidden}
th,td{padding:8px;border-bottom:1px solid #333;text-align:right;vertical-align:middle}
th{background:var(--yellow);color:#000}
th.team,td.team{text-align:left}
tr:nth-child(even){background:var(--panel2)}

.groupTableWrap{overflow-x:auto;overflow-y:visible;position:relative;z-index:0;-webkit-overflow-scrolling:touch}
.groupTable{min-width:900px}
.groupTable th,.groupTable td{text-align:left}
.groupDot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:8px;vertical-align:middle;box-shadow:0 0 0 2px #000 inset}
.teamWithLogo{display:inline-flex;align-items:center;gap:8px;min-width:0}
.teamWithLogo .teamName{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.logo{width:22px;height:22px;object-fit:contain;flex:0 0 auto}
.logoSmall{width:18px;height:18px;object-fit:contain;flex:0 0 auto}

/* Combobox */
.combo{position:relative;display:flex;align-items:center;gap:8px;background:#000;border:1px solid var(--yellow);border-radius:10px;padding:6px 8px;min-width:220px;z-index:1}
.combo[data-open="1"]{z-index:99999}
.combo img{width:18px;height:18px;object-fit:contain;flex:0 0 auto}
.combo input{border:0;background:transparent;color:var(--yellow);outline:none;width:100%;padding:6px 2px;min-width:0}
.combo .chev{margin-left:auto;color:var(--yellow);font-weight:bold;opacity:.8}
.comboList{position:absolute;left:0;right:0;top:calc(100% + 6px);max-height:260px;overflow:auto;background:#000;border:1px solid var(--yellow);border-radius:10px;z-index:999999}
.comboItem{display:flex;align-items:center;gap:8px;padding:8px 10px;cursor:pointer}
.comboItem img{width:18px;height:18px;object-fit:contain;flex:0 0 auto}
.comboItem:hover{background:#141414}
.comboEmpty{padding:10px;color:#ffef9a}

.encodeTableWrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.encodeTable{min-width:1100px}
.encodeTable th,.encodeTable td{text-align:left}
.encodeTable input[type=time]{min-width:95px}
.encodeTable select{min-width:160px}
.encodeTable .mini{min-width:60px;width:60px;padding:6px 8px}

/* Modal */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.75);display:flex;align-items:center;justify-content:center;z-index:999999}
.modalBox{width:min(460px,92vw);background:#111;border:2px solid var(--yellow);border-radius:14px;padding:14px}
.modalTitle{font-weight:bold;font-size:18px;margin-bottom:8px}
.modalText{color:#ffef9a;font-weight:bold;margin-bottom:8px}
.modalActions{display:flex;gap:10px;justify-content:flex-end;margin-top:10px}
.modalActions button{background:var(--yellow);color:#000;border:0;padding:10px 14px;border-radius:10px;cursor:pointer;font-weight:bold}
.modalActions button:hover{background:var(--yellow2)}
.modalError{color:#ff6b6b;font-weight:bold;margin-top:8px}

/* Règlement */
.regWrap{display:flex;flex-direction:column;gap:12px}
.regSection{background:var(--panel);border:var(--border);border-radius:12px;padding:12px}
.regText{white-space:pre-wrap;line-height:1.35}
.emptyState{margin-top:12px;padding:12px;background:var(--panel);border:2px dashed var(--yellow);border-radius:12px;color:#ffef9a;font-weight:bold}
.footer{margin-top:18px}
[hidden]{display:none !important}
.regTitle{margin:0 0 10px 0;color:#ffef9a;font-weight:bold;font-size:16px}

/* Règlement : tuiles repliables (mobile-friendly) */
.regTile{background:var(--panel);border:var(--border);border-radius:12px;overflow:hidden}
.regTile + .regTile{margin-top:12px}
.regSummary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:12px;color:#ffef9a;font-weight:bold}
.regTile summary::-webkit-details-marker{display:none}
.regChevron{display:inline-block;transform:rotate(0deg);transition:transform .15s ease}
.regTile[open] .regChevron{transform:rotate(90deg)}
.regBody{padding:0 12px 12px 12px}
.regSummary:focus{outline:3px solid var(--yellow2);outline-offset:2px}

/* --- Onglet Plan (image PNG) --- */
.planWrap{
  background: var(--panel);
  border: var(--border);
  border-radius: 12px;
  padding: 12px;
}

.planImg{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
  border: 1px solid #333;
  background: #000;
}

.planHint{
  margin-top: 8px;
  color: #ffef9a;
  font-weight: bold;
}

/* --- FIX accordéon règlement : évite le texte coupé au toggle --- */
.regTile{overflow:visible}
.regSummary{margin:0}
.regBody{padding:12px 12px 14px 12px;border-top:1px solid #333;box-sizing:border-box}
.regText{margin:0;line-height:1.4}

/* --- Mobile: wrap noms équipes dans Matchs --- */
@media (max-width:720px){
  .match .team{white-space:normal;overflow:visible;text-overflow:clip}
  .match .teamWithLogo{align-items:flex-start}
  .match .teamWithLogo .teamName{white-space:normal;overflow:visible;text-overflow:clip;word-break:break-word}
}

/* --- Classement (mobile-friendly): colonne Équipe sticky + largeur via --teamcol --- */
.standingsWrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px}

/* IMPORTANT: la règle globale table met overflow:hidden; on l'annule ici pour que sticky fonctionne */
.standingsTable{width:100%;table-layout:auto;overflow:visible !important;border-radius:0 !important}

/* Cellules de base */
.standingsTable th,.standingsTable td{padding:8px;border-bottom:1px solid #333;vertical-align:middle}

/* Colonne Équipe (sticky) */
.standingsTable th.team,
.standingsTable td.team{
  position:sticky;
  left:0;
  z-index:3;
  width:var(--teamcol, 18ch);
  max-width:var(--teamcol, 18ch);
  text-align:left;
  overflow:hidden;
  background:var(--panel);
}
.standingsTable th.team{z-index:4;background:var(--yellow);color:#000}
.standingsTable tr:nth-child(even) td.team{background:var(--panel2)}

/* Contenu équipe: ne pousse jamais la colonne */
.standingsTable .teamWithLogo{min-width:0;max-width:100%}
.standingsTable .teamWithLogo .teamName{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Colonnes chiffres: compactes et alignées à droite */
.standingsTable th:not(.team),
.standingsTable td:not(.team){
  width:4ch;
  white-space:nowrap;
  text-align:right;
}

@media (max-width:720px){
  .standingsTable{table-layout:fixed}
  .standingsTable th,.standingsTable td{padding:6px;font-size:12px}
}


/* --- Filtre Matchs: sélection multiple des terrains --- */
.terrainMulti{display:flex;flex-direction:column;gap:6px;min-width:220px;max-width:380px}
.terrainMultiTitle{font-size:12px;color:#ffef9a;font-weight:bold;margin-left:2px}
.terrainMultiList{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.terrainOpt{display:inline-flex;align-items:center;gap:6px;background:#000;border:1px solid var(--yellow);border-radius:999px;padding:6px 10px;cursor:pointer;user-select:none}
.terrainOpt input{accent-color:var(--yellow)}
@media (max-width:720px){.terrainMulti{min-width:100%;max-width:none}.terrainMultiList{gap:6px}}

/* --- Matchs: tranches horaires repliables --- */
.timeSlice{margin-top:16px}
.timeSummary{background:var(--yellow);color:#000;font-weight:bold;padding:8px 12px;border-radius:8px;list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px}
.timeSlice summary::-webkit-details-marker{display:none}
.timeChevron{display:inline-block;transform:rotate(0deg);transition:transform .15s ease}
.timeSlice[open] .timeChevron{transform:rotate(90deg)}
.timeCount{margin-left:auto;background:#000;color:var(--yellow);border-radius:999px;padding:2px 8px;font-size:12px}
.timeBody{margin-top:10px}

/* --- Encodage: détection incohérences (terrain/équipe à la même heure) --- */
.encodageConflicts{margin:8px 0 4px 0;color:#ffef9a;font-weight:bold}
.encodageConflicts .ok{color:#7CFF9A;font-weight:bold}
.encodageConflicts .warn{color:#FFD700;font-weight:bold}

.encodeTable tr.conflictTerrain{box-shadow:inset 0 0 0 2px #FF9800;background:rgba(255,152,0,.10)}
.encodeTable tr.conflictTeam{box-shadow:inset 0 0 0 2px #FF5252;background:rgba(255,82,82,.10)}
.encodeTable tr.conflictTerrain.conflictTeam{box-shadow:inset 0 0 0 2px #E91E63;background:rgba(233,30,99,.12)}

.encodeTable tr.conflictTerrain td:first-child,
.encodeTable tr.conflictTeam td:first-child{position:relative}
.encodeTable tr.conflictTerrain td:first-child:before,
.encodeTable tr.conflictTeam td:first-child:before{
  content:'⚠';
  position:absolute;
  left:6px;
  top:50%;
  transform:translateY(-50%);
  font-size:14px;
}
.encodeTable tr.conflictTerrain td:first-child:before{color:#FF9800}
.encodeTable tr.conflictTeam td:first-child:before{color:#FF5252}
.encodeTable tr.conflictTerrain.conflictTeam td:first-child:before{color:#E91E63}

/* --- Encodage: détection incohérences (terrain/équipe à la même heure) --- */
.encodageConflicts{margin:8px 0 4px 0;color:#ffef9a;font-weight:bold}
.encodageConflicts .ok{color:#7CFF9A;font-weight:bold}
.encodageConflicts .warn{color:#FFD700;font-weight:bold}

.encodeTable tr.conflictTerrain{box-shadow:inset 0 0 0 2px #FF9800;background:rgba(255,152,0,.10)}
.encodeTable tr.conflictTeam{box-shadow:inset 0 0 0 2px #FF5252;background:rgba(255,82,82,.10)}
.encodeTable tr.conflictTerrain.conflictTeam{box-shadow:inset 0 0 0 2px #E91E63;background:rgba(233,30,99,.12)}

.encodeTable tr.conflictTerrain td:first-child,
.encodeTable tr.conflictTeam td:first-child{position:relative}

.encodeTable tr.conflictTerrain td:first-child:before,
.encodeTable tr.conflictTeam td:first-child:before{
  content:'⚠';
  position:absolute;
  left:6px;
  top:50%;
  transform:translateY(-50%);
  font-size:14px;
}

.encodeTable tr.conflictTerrain td:first-child:before{color:#FF9800}
.encodeTable tr.conflictTeam td:first-child:before{color:#FF5252}
.encodeTable tr.conflictTerrain.conflictTeam td:first-child:before{color:#E91E63}

/* Laisse de la place à l'icône ⚠ dans la 1ère colonne */
.encodeTable tr.conflictTerrain td:first-child,
.encodeTable tr.conflictTeam td:first-child{padding-left:22px}

.encodageConflictsGlobal{margin-top:0;margin-bottom:10px}

/* Laisse de la place à l'icône ⚠ dans la 1ère colonne */
.encodeTable tr.conflictTerrain td:first-child,
.encodeTable tr.conflictTeam td:first-child{padding-left:22px}


.encodageConflictsGlobal{margin-top:0;margin-bottom:10px}


/* --- Configuration: tooltip nom équipe complet --- */
.combo[data-open="0"][data-full]:hover::after{
  content: attr(data-full);
  position: absolute;
  left: 0;
  top: -36px;
  max-width: min(520px, 92vw);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: var(--yellow);
  color: #000;
  border: 2px solid #000;
  border-radius: 10px;
  padding: 6px 10px;
  font-weight: bold;
  z-index: 1000000;
  box-shadow: 0 6px 16px rgba(0,0,0,.35);
}
/* Sur mobile/pointer coarse: pas de tooltip hover */
@media (pointer: coarse){
  .combo[data-open="0"][data-full]:hover::after{content: none;}
}


/* --- Sélecteur de tournoi (visiteur + admin) --- */
.tournoiTopBar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 10px;padding:10px 12px;background:var(--panel);border:var(--border);border-radius:12px}
.tournoiCurrent{color:#ffef9a;font-weight:bold;font-size:16px;display:inline-block;padding-left:6px}
.tournoiModalBody{display:flex;flex-direction:column;gap:10px;max-height:60vh;overflow:auto;padding-right:4px}
.tournoiGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:720px){.tournoiGrid{grid-template-columns:repeat(2,minmax(0,1fr));}}
.tournoiPickBtn{background:var(--yellow);color:#000;border:0;padding:12px 10px;border-radius:12px;cursor:pointer;font-weight:bold}
.tournoiPickBtn:hover{background:var(--yellow2)}
.tournoiListSelect{width:100%}


.modal:not([hidden]) {
  display: flex;
}


/* --- Encodage phase finale : alerte égalité (score identique) --- */
.encodeTable tr.scoreDraw{box-shadow:inset 0 0 0 2px #FF5252;background:rgba(255,82,82,.10)}
.encodeTable tr.scoreDraw td{border-bottom-color:#FF5252}
.drawWarn{margin-top:4px;color:#FF5252;font-weight:bold;font-size:12px;line-height:1.2}


/* --- Phase finale : tirs au but (TAB) en cas d’égalité --- */
.scoreBox{display:flex;flex-direction:column;gap:4px}
.tabRow{display:none;align-items:center;gap:6px}
.tabLabel{font-size:11px;color:#ffef9a;font-weight:bold}
.tabMini{min-width:60px;width:60px;padding:6px 8px}

/* --- Header title responsive --- */
@media (max-width:720px){
  .header h1{font-size:18px;line-height:1.2}
}

/* --- Filtre Matchs: dropdown multi-sélection terrains --- */
.terrainDrop{position:relative;min-width:220px;max-width:380px}
@media (max-width:720px){.terrainDrop{min-width:100%;max-width:none}}
.terrainDrop summary{list-style:none;cursor:pointer;background:#000;border:1px solid var(--yellow);border-radius:10px;padding:8px 10px;color:var(--yellow);font-weight:bold;display:flex;align-items:center;gap:8px}
.terrainDrop summary::-webkit-details-marker{display:none}
.terrainDrop[open] summary{outline:3px solid var(--yellow2);outline-offset:2px}
.terrainDrop .terrainChev{margin-left:auto;opacity:.85}
.terrainMenu{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#000;border:1px solid var(--yellow);border-radius:10px;padding:8px;z-index:999999;max-height:260px;overflow:auto}
.terrainItem{display:flex;align-items:center;gap:8px;padding:6px 6px;border-radius:8px}
.terrainItem:hover{background:#141414}
.terrainMenu .smallNote{margin:4px 2px 8px 2px}
.terrainItem input{accent-color:var(--yellow)}


/* --- Filtre: dropdown multi-sélection (Poules / Phase finale) --- */
.multiDrop{position:relative;min-width:220px;max-width:380px}
@media (max-width:720px){.multiDrop{min-width:100%;max-width:none}}
.multiDrop summary{list-style:none;cursor:pointer;background:#000;border:1px solid var(--yellow);border-radius:10px;padding:8px 10px;color:var(--yellow);font-weight:bold;display:flex;align-items:center;gap:8px}
.multiDrop summary::-webkit-details-marker{display:none}
.multiDrop[open] summary{outline:3px solid var(--yellow2);outline-offset:2px}
.multiDrop .multiChev{margin-left:auto;opacity:.85}
.multiMenu{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#000;border:1px solid var(--yellow);border-radius:10px;padding:8px;z-index:999999;max-height:260px;overflow:auto}
.multiItem{display:flex;align-items:center;gap:8px;padding:6px 6px;border-radius:8px}
.multiItem:hover{background:#141414}
.multiMenu .smallNote{margin:4px 2px 8px 2px}
.multiItem input{accent-color:var(--yellow)}


/* --- Compteur visiteurs (approx, sans cookies) --- */
.visitorCounter{
  color:#ffef9a;
  font-weight:bold;
  white-space:nowrap;
}

/* --- Phase finale : vue bracket (visiteur) --- */
.finaleBracketWrap{display:flex;flex-direction:column;gap:12px}
.finaleBracketScroll{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;max-width:100%;padding-bottom:10px;scrollbar-gutter:stable both-edges;touch-action:pan-x pan-y}
.finaleBracket{display:flex;gap:14px;align-items:flex-start;padding:8px 2px}
.finaleBracketCol{min-width:260px;max-width:360px;flex:0 0 auto}
.finaleBracketColTitle{color:#ffef9a;font-weight:bold;font-size:12px;margin:0 0 6px 2px}
.finaleBracketMatch{background:var(--panel);border:var(--border);border-radius:12px;padding:10px;margin:10px 0}
.finaleBracketMeta{font-size:12px;color:#ffef9a;font-weight:bold;margin-bottom:6px}
.finaleBracketRow{display:flex;align-items:center;justify-content:space-between;gap:8px}
.finaleBracketScore{font-weight:bold;white-space:nowrap}
.finaleBracketHi{box-shadow:inset 0 0 0 2px #7CFF9A}
@media (max-width:720px){
  .finaleBracketCol{min-width:220px}
  .finaleBracketMatch{padding:8px}
}
@supports(padding:max(0px)){
  .finaleBracketScroll{padding-bottom:max(10px, env(safe-area-inset-bottom))}
}