/* Back-office bénévoles - Seynod Roller Hockey */
:root { --red:#d51217; --red-dk:#a50f12; --vert:#2e9e44; --orange:#f0a020; --gris:#f3f3f3; --texte:#222; --doux:#777; --bord:#e6e6e6; }
*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: env(safe-area-inset-top, 0px); }
body { margin: 0; font-family: 'Poppins', Arial, sans-serif; background: var(--gris); color: var(--texte); font-size: 0.92rem;
       padding-bottom: env(safe-area-inset-bottom, 0px); }
a { color: var(--red); text-decoration: none; }
button { font-family: inherit; }

/* Barre du haut */
.barre { position: sticky; top: 0; z-index: 50; background: #000; color: #fff; display: flex; align-items: center; gap: 1rem;
         padding: 0.75rem 1rem; padding-top: calc(0.75rem + env(safe-area-inset-top, 0px)); }
.barre .titre { font-weight: 700; white-space: nowrap; color: #fff; }
.barre .titre span { color: var(--red); }
.barre nav { display: flex; gap: 0.25rem; margin-left: auto; overflow-x: auto; }
.barre nav a { color: #ccc; padding: 0.4rem 0.75rem; border-radius: 6px; white-space: nowrap; font-size: 0.88rem; }
.barre nav a.actif, .barre nav a:hover { color: #fff; background: #222; }
.barre nav a.actif { box-shadow: inset 0 -2px 0 var(--red); }
@media (max-width: 640px) { .barre { flex-wrap: wrap; } .barre nav { margin-left: 0; width: 100%; } }

.page { max-width: 900px; margin: 1.5rem auto; padding: 0 1rem 3rem; }
.entete { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1rem; }
.entete h1 { font-size: 1.4rem; font-weight: 600; margin: 0; flex: 1; min-width: 200px; }
.retour { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.85rem; margin-bottom: 0.75rem; }
.flash { background: #e8f5e9; color: #2e7d32; border-left: 4px solid #43a047; padding: 0.75rem 1rem; border-radius: 6px; margin-bottom: 1rem; }
.vide { color: var(--doux); }

/* Cartes (même style que les notes de frais) */
.carte { background: #fff; border-radius: 10px; box-shadow: 0 6px 20px rgba(0,0,0,0.08); padding: 1.4rem; margin-bottom: 1.25rem; }
.carte h2 { font-weight: 600; font-size: 0.95rem; color: var(--red); margin: 0 0 1rem; text-transform: uppercase; letter-spacing: 0.05em;
            display: flex; align-items: center; gap: 0.5rem; }
.carte h2::before { content: ''; width: 4px; height: 1.1em; background: var(--red); border-radius: 2px; }
.carte h2 .droite { margin-left: auto; text-transform: none; letter-spacing: 0; }

/* Boutons */
.btn { display: inline-flex; align-items: center; gap: 0.45rem; border: none; border-radius: 6px; padding: 0.6rem 1rem; font-weight: 600;
       font-size: 0.85rem; cursor: pointer; background: var(--red); color: #fff; transition: background .2s; }
.btn:hover { background: var(--red-dk); }
.btn.second { background: #fff; color: #333; border: 1.5px solid #ddd; }
.btn.second:hover { border-color: var(--red); color: var(--red); }
.btn.danger { background: #fff; color: var(--red); border: 1.5px solid #f3c2c3; }
.btn.danger:hover { background: var(--red); color: #fff; }
.btn.petit { padding: 0.35rem 0.65rem; font-size: 0.78rem; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.groupe-btn { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.segment { display: inline-flex; background: #fff; border: 1.5px solid #ddd; border-radius: 6px; overflow: hidden; }
.segment a { padding: 0.45rem 0.9rem; font-size: 0.82rem; color: #555; }
.segment a.on { background: #222; color: #fff; }

/* Liste des matchs */
.mois { font-size: 0.8rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--doux); margin: 1.25rem 0 0.5rem; }
.ligne-match { display: grid; grid-template-columns: 95px 70px 1fr auto 16px; align-items: center; gap: 0.75rem; background: #fff; color: var(--texte);
               border-radius: 8px; padding: 0.8rem 1rem; margin-bottom: 0.5rem; box-shadow: 0 2px 6px rgba(0,0,0,0.05); border: 1.5px solid transparent; }
.ligne-match:hover { border-color: var(--red); }
.ligne-match .date { font-weight: 600; line-height: 1.2; white-space: nowrap; font-size: 0.85rem; }
.ligne-match .date small { display: block; font-weight: 300; color: var(--doux); }
.badge-cat { display: inline-block; font-size: 0.75rem; font-weight: 600; background: #f1f1f1; border-radius: 4px; padding: 0.15rem 0.45rem; }
.trophee { color: #d4a017; }
.chevron { color: #bbb; }
@media (max-width: 540px) {
  .ligne-match { grid-template-columns: 88px 1fr auto 12px; gap: 0.5rem; padding: 0.75rem; }
  .ligne-match .col-cat { display: none; }
}
.remplissage { font-size: 0.78rem; font-weight: 600; padding: 0.15rem 0.6rem; border-radius: 999px; color: #fff; white-space: nowrap; }
.r-ok { background: var(--vert); } .r-partiel { background: var(--orange); } .r-vide { background: var(--red); }

/* Détail d'un match */
.infos-match { display: flex; flex-wrap: wrap; gap: 0.4rem 1.5rem; color: #444; font-size: 0.88rem; }
.infos-match i { color: var(--red); width: 1.1em; }
.note { background: #fff8e6; border-left: 3px solid var(--orange); padding: 0.5rem 0.75rem; border-radius: 0 6px 6px 0; font-size: 0.85rem; margin-top: 0.9rem; }
.sous-match { font-weight: 600; margin: 1.2rem 0 0.4rem; padding-top: 1rem; border-top: 1px solid var(--bord); }
.carte h2 + .sous-match { border-top: none; padding-top: 0; margin-top: 0; }
.tache-ent { display: flex; align-items: center; gap: 0.5rem; margin: 0.7rem 0 0.35rem; font-weight: 600; font-size: 0.88rem; }
.tache-ent i { color: var(--red); }
.tache-ent .remplissage { margin-left: auto; }
.inscrit { display: flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.6rem; border: 1px solid var(--bord); border-radius: 6px;
           margin-bottom: 0.35rem; font-size: 0.85rem; flex-wrap: wrap; }
.inscrit .nom { font-weight: 600; }
.inscrit .eq { font-size: 0.75rem; color: #666; border: 1px solid #ddd; border-radius: 999px; padding: 0 0.45rem; }
.inscrit .mail { color: var(--doux); font-size: 0.8rem; }
.inscrit .meta { font-size: 0.72rem; color: #999; margin-left: auto; }
.inscrit .ajout-bureau { font-size: 0.7rem; background: #eef4ff; color: #3559a8; border-radius: 4px; padding: 0 0.35rem; }
.place-libre { padding: 0.45rem 0.6rem; border: 1.5px dashed #ddd; border-radius: 6px; font-size: 0.8rem; color: #999; margin-bottom: 0.35rem; }
details.histo { margin-top: 1rem; }
details.histo summary { cursor: pointer; font-size: 0.85rem; color: #555; }
details.histo li { font-size: 0.82rem; color: #777; margin: 0.25rem 0; }

/* Impression de la feuille du jour J */
@media print {
  .barre, .retour, .groupe-btn, details.histo, .flash { display: none !important; }
  body { background: #fff; font-size: 11pt; }
  .page { margin: 0; max-width: none; }
  .carte { box-shadow: none; padding: 0; margin-bottom: 1rem; }
  .carte:last-of-type { display: none; }
  .inscrit, .place-libre { break-inside: avoid; }
  .remplissage { color: #000; background: none !important; border: 1px solid #999; }
}

/* Écran de connexion (repris des notes de frais) */
.ecran-pin { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem;
             background: linear-gradient(135deg, #1a1a1a, #d51217, #111); }
.carte-pin { background: #fff; border-radius: 20px; padding: 2.5rem 2rem; width: 100%; max-width: 340px; text-align: center;
             box-shadow: 0 24px 60px rgba(0,0,0,0.3); }
.carte-pin .logo { max-width: 90px; margin-bottom: 0.75rem; }
.carte-pin .cadenas { font-size: 2.5rem; margin-bottom: 0.5rem; }
.carte-pin h1 { margin: 0 0 0.25rem; font-size: 1.3rem; }
.carte-pin p { margin: 0 0 1.5rem; font-size: 0.82rem; color: #b6bbc0; }
.points { display: flex; justify-content: center; gap: 0.75rem; margin-bottom: 1.5rem; }
.points span { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #ddd; transition: background .15s, border-color .15s; }
.points span.plein { background: var(--red); border-color: var(--red); }
.points span.erreur { background: var(--red-dk); border-color: var(--red-dk); animation: secoue 0.4s ease; }
@keyframes secoue { 20% { transform: translateX(-5px); } 40% { transform: translateX(5px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(4px); } }
.essais { display: flex; justify-content: center; gap: 0.4rem; margin-bottom: 1.25rem; }
.essais span { width: 10px; height: 10px; border-radius: 50%; background: #eee; border: 1.5px solid #ddd; }
.essais span.utilise { background: var(--red-dk); border-color: #7a0a0c; }
.compte-rebours { font-size: 1.4rem; font-weight: 700; color: var(--red-dk); margin: 0.25rem 0 1rem; }
.msg-erreur { font-size: 0.82rem; color: var(--red-dk); margin-bottom: 0.75rem; min-height: 1.2em; font-weight: 600; }
.pave { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 1rem; }
.pave button { height: 64px; border-radius: 12px; border: 2px solid #eee; background: #f8f9fa; font-size: 1.4rem; font-weight: 600; color: #111;
               cursor: pointer; transition: background .15s, transform .1s; -webkit-tap-highlight-color: transparent; }
.pave button:hover { background: var(--red); color: #fff; border-color: var(--red); }
.pave button:active { transform: scale(0.94); }
.pave .zero { grid-column: 2; }
.pave .effacer { background: #fff0f0; border-color: #ffd0d0; color: var(--red-dk); font-size: 1rem; }
.pave button:disabled { opacity: 0.4; pointer-events: none; }
.retour-site { display: block; margin-top: 1rem; font-size: 0.8rem; color: #b6bbc0; }

/* Formulaires */
.erreurs { background: #fff5f5; border-left: 4px solid var(--red); color: #a50f12; padding: 0.6rem 1rem; border-radius: 6px; margin-bottom: 1rem; }
.erreurs p { margin: 0.25rem 0; font-size: 0.88rem; }
.info { background: #eef4ff; border-left: 4px solid #3559a8; color: #2c4a8c; padding: 0.6rem 1rem; border-radius: 6px; margin-bottom: 1rem; font-size: 0.88rem; }
.ligne2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 540px) { .ligne2 { grid-template-columns: 1fr; gap: 0; } }
.champ { display: flex; flex-direction: column; margin-bottom: 1rem; }
.champ label { font-size: 0.8rem; font-weight: 600; margin-bottom: 0.3rem; color: #333; }
.champ input, .champ select, .champ textarea { padding: 0.55rem 0.7rem; border: 1.5px solid #ddd; border-radius: 6px; font: inherit;
                                              font-size: 0.88rem; background: #fafafa; width: 100%; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--red); background: #fff; }
.aide { font-size: 0.75rem; color: var(--doux); margin-top: 0.25rem; }
.radio-type { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.radio-type label { display: flex; align-items: center; gap: 0.4rem; border: 1.5px solid #ddd; border-radius: 6px; padding: 0.45rem 0.8rem;
                    cursor: pointer; font-size: 0.85rem; font-weight: 400; margin: 0; }
.radio-type label:has(input:checked) { border-color: var(--red); background: #fff5f5; }
.radio-type input { accent-color: var(--red); width: auto; }
.match-saisie { display: grid; grid-template-columns: 120px 1fr 36px; gap: 0.6rem; align-items: end; margin-bottom: 0.6rem; }
.match-saisie .champ { margin-bottom: 0; }
.suppr { height: 38px; border: none; background: none; color: #bbb; cursor: pointer; font-size: 1rem; }
.suppr:hover { color: var(--red); }
.suppr:disabled { color: #e3e3e3; cursor: not-allowed; }
.besoin { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0.75rem; padding: 0.55rem 0.7rem; border: 1.5px solid #e8e8e8;
          border-radius: 8px; margin-bottom: 0.5rem; background: #f9f9f9; }
.besoin label.case { display: flex; align-items: center; flex-wrap: wrap; gap: 0 0.6rem; cursor: pointer; font-size: 0.88rem; }
.besoin .arb-info { flex-basis: 100%; padding-left: 1.7rem; font-size: 0.72rem; }
.besoin input[type=checkbox], .case-simple input { width: 1.1rem; height: 1.1rem; accent-color: var(--red); }
.besoin .places { display: flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; color: #666; justify-content: flex-end; }
.besoin .places input { width: 56px; padding: 0.3rem; border: 1.5px solid #ddd; border-radius: 5px; text-align: center; font: inherit; }
.besoin.off { opacity: 0.5; }
.besoin small { color: var(--doux); }
.case-simple { display: flex; align-items: center; gap: 0.6rem; font-size: 0.88rem; cursor: pointer; }
.pied-form { display: flex; gap: 0.6rem; justify-content: flex-end; flex-wrap: wrap; }

/* Ajouter / retirer un bénévole */
.flash.alerte { background: #fff5f5; color: #a50f12; border-left-color: var(--red); }
.form-retirer { margin: 0; }
.retirer { border: none; background: none; color: #bbb; cursor: pointer; font-size: 0.95rem; padding: 0.1rem 0.3rem; }
.retirer:hover { color: var(--red); }
details.place-libre { padding: 0; border-style: dashed; }
details.place-libre summary { list-style: none; cursor: pointer; padding: 0.45rem 0.6rem; display: flex; justify-content: space-between; align-items: center; }
details.place-libre summary::-webkit-details-marker { display: none; }
details.place-libre .ajouter { font-weight: 600; font-size: 0.78rem; color: var(--red); }
details.place-libre[open] { border-color: var(--red); background: #fffafa; }
details.place-libre[open] .ajouter { display: none; }
.form-ajout { padding: 0.25rem 0.75rem 0.75rem; color: var(--texte); }
.form-ajout .champ { margin-bottom: 0.6rem; }
.places-restantes { font-size: 0.75rem; color: #999; margin: -0.1rem 0 0.4rem 0.2rem; }
@media print { details.place-libre summary .ajouter, .form-retirer, .places-restantes { display: none; } }

/* Grille des besoins d'un plateau (match par match) */
.grille { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.grille th { font-size: 0.75rem; font-weight: 600; color: #555; text-align: center; padding: 0.4rem 0.3rem; border-bottom: 1.5px solid var(--bord); }
.grille th:first-child { text-align: left; }
.grille th i { color: var(--red); display: block; margin: 0 auto 0.2rem; font-size: 1rem; }
.grille td { padding: 0.45rem 0.3rem; border-bottom: 1px solid #eee; text-align: center; vertical-align: middle; }
.grille td:first-child { text-align: left; }
.grille td:first-child strong { display: block; }
.grille td:first-child small { color: var(--doux); }
.grille input { width: 52px; padding: 0.35rem; border: 1.5px solid #ddd; border-radius: 6px; text-align: center; font: inherit; background: #fafafa; }
.grille input:focus { outline: none; border-color: var(--red); background: #fff; }
.grille input.zero { color: #bbb; background: #f3f3f3; border-style: dashed; }
.grille small.pris { display: block; font-size: 0.68rem; color: var(--orange); margin-top: 0.15rem; }
.grille tr.tous td { background: #fafafa; border-bottom: 1.5px solid var(--bord); }
.grille tr.tous td:first-child { font-size: 0.78rem; font-weight: 600; color: #555; }
.grille tr.total td { font-size: 0.78rem; color: var(--doux); border-bottom: none; }

/* Réglages */
.liste-reglages { border: 1px solid var(--bord); border-radius: 8px; overflow: hidden; }
.ent-reglage, details.reglage > summary { display: grid; grid-template-columns: 1fr 70px 80px 70px; gap: 0.5rem; align-items: center; padding: 0.55rem 0.75rem; }
.ent-reglage.taches, details.reglage.taches > summary { grid-template-columns: 1fr 70px 80px; }
.ent-reglage { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--doux); font-weight: 600; background: #fafafa; }
.ent-reglage span:not(:first-child), details.reglage > summary > span:not(:first-child) { text-align: center; }
details.reglage { border-top: 1px solid var(--bord); }
details.reglage > summary { cursor: pointer; list-style: none; font-size: 0.86rem; }
details.reglage > summary::-webkit-details-marker { display: none; }
details.reglage > summary:hover { background: #fffafa; }
details.reglage[open] > summary { background: #fff5f5; }
details.reglage.inactif > summary { color: #aaa; }
.oui { color: var(--vert); }
.non { color: #ccc; }
.ico { color: var(--red); width: 1.2em; }
.a-consigne { font-size: 0.68rem; color: #3559a8; background: #eef4ff; border-radius: 4px; padding: 0 0.35rem; margin-left: 0.3rem; }
.form-reglage { padding: 0.9rem 0.9rem 0.75rem; background: #fffafa; border-top: 1px dashed #f3c2c3; }
.ligne3 { display: grid; grid-template-columns: 2fr 1fr 1.3fr; gap: 0.75rem; }
@media (max-width: 600px) { .ligne3 { grid-template-columns: 1fr; gap: 0; } }
.cases { display: flex; flex-direction: column; gap: 0.35rem; margin: 0.2rem 0 0.8rem; }
.form-reglage .pied-form { align-items: flex-end; justify-content: space-between; }
.champ.ordre { margin: 0; width: 90px; }
details.ajout-reglage { margin-top: 0.8rem; }
details.ajout-reglage > summary { list-style: none; }
details.ajout-reglage > summary::-webkit-details-marker { display: none; }
details.ajout-reglage[open] > summary { margin-bottom: 0.6rem; }
details.ajout-reglage .form-reglage { border: 1px dashed #f3c2c3; border-radius: 8px; }
@media (max-width: 540px) {
  .ent-reglage, details.reglage > summary { grid-template-columns: 1fr 50px 50px 54px; gap: 0.3rem; font-size: 0.8rem; padding: 0.5rem; }
  .ent-reglage { font-size: 0.6rem; letter-spacing: 0; }
  .ent-reglage.taches, details.reglage.taches > summary { grid-template-columns: 1fr 50px 54px; }
}

/* Reporting */
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; margin-bottom: 1.25rem; }
@media (max-width: 640px) { .kpis { grid-template-columns: repeat(2, 1fr); } }
.kpi { background: #fff; border-radius: 10px; padding: 1rem; box-shadow: 0 6px 20px rgba(0,0,0,0.06); }
.kpi .val { font-size: 1.6rem; font-weight: 700; color: var(--red); line-height: 1.1; }
.kpi .lib { font-size: 0.75rem; color: var(--doux); }
.tableau { overflow-x: auto; }
.tableau table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.tableau th, .tableau td { padding: 0.55rem 0.5rem; text-align: right; border-bottom: 1px solid var(--bord); white-space: nowrap; }
.tableau th:first-child, .tableau td:first-child { text-align: left; }
.tableau th { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--doux); font-weight: 600; }
.doux { color: var(--doux); font-size: 0.78rem; }
.barre-prog { height: 6px; background: #eee; border-radius: 3px; overflow: hidden; min-width: 60px; }
.barre-prog span { display: block; height: 100%; background: var(--red); }
.rang { display: inline-block; width: 1.4rem; color: var(--doux); }
.camembert { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; justify-content: center; }
.camembert svg { width: 220px; height: 220px; flex-shrink: 0; }
.camembert path, .camembert circle { stroke: #fff; stroke-width: 2; }
.legende-cam { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: auto auto auto; gap: 0.35rem 0.9rem; font-size: 0.85rem; align-items: center; }
.legende-cam li { display: contents; }
.legende-cam .pastille { width: 12px; height: 12px; border-radius: 3px; display: inline-block; margin-right: 0.5rem; vertical-align: -1px; }
.legende-cam .nb { text-align: right; font-weight: 600; }
.legende-cam .pc { text-align: right; color: var(--doux); }
a.btn[aria-disabled="true"] { opacity: 0.5; pointer-events: none; }
@media (max-width: 540px) { .tableau td .doux { display: none; } .tableau th, .tableau td { padding: 0.5rem 0.35rem; } }

/* Menu : boutons ronds (même esprit que MIHWA) */
.barre nav { align-items: center; gap: 0.5rem; }
.form-deconnexion { margin: 0; display: inline-flex; }
.barre nav .hico { cursor: pointer; font-family: inherit; }
.barre nav a.hico, .barre nav button.hico { width: 2.5rem; height: 2.5rem; padding: 0; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
                    flex-shrink: 0; font-size: 1rem; color: #ddd; background: rgba(255,255,255,0.08); border: 1.5px solid rgba(255,255,255,0.18);
                    transition: background .2s, border-color .2s, color .2s; }
.barre nav a.hico:hover, .barre nav button.hico:hover { color: #fff; background: rgba(213,18,23,0.25); border-color: rgba(213,18,23,0.6); }
.barre nav a.hico.actif { color: #fff; background: var(--red); border-color: var(--red); box-shadow: none; }
@media (max-width: 640px) { .barre nav { justify-content: flex-start; } }

/* Choix de l'icône d'une tâche : grille cliquable avec aperçu */
.choix-icones { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 0.4rem; }
.choix-icones label { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; padding: 0.55rem 0.3rem; border: 1.5px solid #e6e6e6;
                      border-radius: 8px; background: #fff; cursor: pointer; font-weight: 400; margin: 0; transition: border-color .15s, background .15s; }
.choix-icones label:hover { border-color: #f3c2c3; }
.choix-icones input { position: absolute; opacity: 0; pointer-events: none; }
.choix-icones i { font-size: 1.3rem; color: #666; }
.choix-icones span { font-size: 0.68rem; color: #666; text-align: center; line-height: 1.2; overflow-wrap: anywhere; hyphens: auto; max-width: 100%; }
.choix-icones label:has(input:checked) { border-color: var(--red); background: #fff5f5; }
.choix-icones label:has(input:checked) i, .choix-icones label:has(input:checked) span { color: var(--red); }
.choix-icones label:has(input:focus-visible) { outline: 2px solid var(--red); outline-offset: 1px; }
@media (max-width: 540px) { .choix-icones { grid-template-columns: repeat(4, minmax(0, 1fr)); } .choix-icones span { font-size: 0.6rem; } }

/* Icône « sifflet » maison (absente de Font Awesome gratuit) : s'utilise comme les autres, classe fa-sifflet */
.fa-sifflet { display: inline-block; width: 1em; height: 1em; vertical-align: -0.125em; background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M11 7H13.5A1.5 1.5 0 0 0 16.5 7H22A1 1 0 0 1 23 8V11A1 1 0 0 1 22 12H17.71A7 7 0 1 1 11 7ZM4.3 14A1.85 1.85 0 0 1 0.6 14A1.85 1.85 0 0 1 4.3 14ZM3.25 14A0.8 0.8 0 0 0 1.65 14A0.8 0.8 0 0 0 3.25 14Z%22/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M11 7H13.5A1.5 1.5 0 0 0 16.5 7H22A1 1 0 0 1 23 8V11A1 1 0 0 1 22 12H17.71A7 7 0 1 1 11 7ZM4.3 14A1.85 1.85 0 0 1 0.6 14A1.85 1.85 0 0 1 4.3 14ZM3.25 14A0.8 0.8 0 0 0 1.65 14A0.8 0.8 0 0 0 3.25 14Z%22/%3E%3C/svg%3E") center / contain no-repeat; }
.fa-sifflet::before { content: none !important; }

/* Lien du live vidéo */
.match-saisie .champ-video { grid-column: 1 / -1; margin: -0.1rem 0 0.4rem; }
.champ-video label i { color: #2f6fd0; }
.match-saisie + .match-saisie { border-top: 1px dashed var(--bord); padding-top: 0.6rem; }
.video-admin { background: #e7f0fd; color: #1a4f9c; border-left: 3px solid #2f6fd0; border-radius: 0 6px 6px 0; padding: 0.5rem 0.75rem;
               font-size: 0.85rem; margin-top: 0.9rem; overflow-wrap: anywhere; }
.video-admin i { color: #2f6fd0; margin-right: 0.2rem; }
.video-admin a { color: #1a4f9c; font-weight: 600; }