/* =========================================================================
 * Charte D — « Site de l'AS »
 * Reprend l'habillage de asgolfcdi.fr : barre noire, fond blanc, police Poppins,
 * texte gris, accent saumon #f1868a, angles droits.
 * Feuille complète et autonome : le choix se fait dans Comité → Réglages → Apparence.
 * ========================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');

:root {
  --green-900: #133f2c;
  --green-700: #1d6b45;
  --green-500: #36a46c;
  --green-100: #e3f5ea;
  --gold: #d8a63a;
  --gold-100: #fbf1da;
  --sand: #f5f8f2;
  --ink: #17231c;
  --muted: #6b766f;
  --line: #dce6dc;
  --white: #fff;
  --red: #b3372b;
  --red-100: #fbe7e4;
  --amber: #9a6a00;
  --orange: #d97b0a;
  --blue-500: #2f6ea8;
  --blue-700: #23507b;
  --amber-100: #fdf1d3;
  --blue-100: #e5eef9;
  --radius: 10px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--ink);
  background: var(--sand);
  background-image: linear-gradient(180deg, #eef5ec 0, var(--sand) 420px);
  background-repeat: no-repeat;
}
a { color: var(--green-700); }
h1 { font-size: 1.6rem; margin: 1.4rem 0 .8rem; color: var(--green-900); letter-spacing: -.2px; }
h2 { font-size: 1.2rem; margin: 1.6rem 0 .6rem; color: var(--green-900); position: relative; padding-left: 14px; }
/* Barre dorée devant les titres de section (pas dans les cartes ni les documents imprimés) */
h2::before { content: ""; position: absolute; left: 0; top: .18em; bottom: .18em; width: 5px; border-radius: 3px; background: var(--gold); }
.card h2, .doc h2, .poster h2 { padding-left: 0; }
.card h2::before, .doc h2::before, .poster h2::before { display: none; }
h3 { font-size: 1rem; margin: 1rem 0 .4rem; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
main.wrap { padding-top: 18px; }
main.wrap > :first-child { margin-top: 0; }
.muted { color: var(--muted); }
.small { font-size: .85rem; }
.nowrap { white-space: nowrap; }
.right { text-align: right; }
.center { text-align: center; }

/* En-tête */
.site-header { background: linear-gradient(135deg, #133f2c 0%, #1d6b45 60%, #238155 100%); color: #fff;
                box-shadow: 0 2px 10px rgba(16, 48, 34, .18); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; padding-bottom: 8px; flex-wrap: wrap; }
.brand { display: flex; gap: 10px; align-items: center; color: #fff; text-decoration: none; }
.brand-logo { height: 46px; width: auto; background: #fff; border-radius: 8px; padding: 3px 6px; }
.brand strong { display: block; font-size: 1.1rem; }
.brand small { display: block; opacity: .75; font-size: .8rem; }
.user-box { display: flex; gap: 14px; align-items: center; font-size: .9rem; }
.user-box a { color: #d5eadf; }
.user-box .who { opacity: .8; }
.main-nav { display: flex; gap: 4px; flex-wrap: wrap; padding-bottom: 10px; align-items: center; }
.main-nav a { color: #e6f2ec; text-decoration: none; padding: 6px 10px; border-radius: 6px; font-size: .92rem; }
.main-nav a:hover { background: rgba(255,255,255,.1); }
.main-nav a.active { background: var(--gold); color: #17231c; font-weight: 600; }
.main-nav .nav-sep { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; opacity: .7; margin-right: 4px; }
/* Deuxième barre, réservée au comité */
.admin-nav-bar { background: rgba(0, 0, 0, .18); border-top: 1px solid rgba(255, 255, 255, .12); }
.admin-nav { padding-top: 6px; padding-bottom: 6px; gap: 2px; }
.admin-nav a { padding: 5px 8px; font-size: .88rem; }
.main-nav a.admin-link { color: #ffe7a8; }
.main-nav a.admin-link.active { color: #17231c; }

.site-footer { color: var(--muted); font-size: .85rem; padding-top: 24px; padding-bottom: 32px; }

/* Blocs */
.card { background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; margin-bottom: 16px;
         box-shadow: 0 1px 3px rgba(19, 63, 44, .06); }
.card h2:first-child, .card h3:first-child { margin-top: 0; }
.grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
/* Accueil : colonne large (information du comité, matchs) et colonne étroite (à traiter, infos) */
.todo-box { border-left: 4px solid var(--amber); background: var(--amber-100); border-color: #efd9a0; }
.todo-box h2 { margin: 0 0 8px; font-size: 1.05rem; }
/* Bandeau du haut de l'accueil : « À traiter » à gauche, information du comité à droite.
   Un seul des deux présent, il occupe toute la largeur. */
.home-top { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
            gap: 0 18px; align-items: start; }
.home-top > .card { margin-bottom: 18px; }
/* Bandeau orange plein : on ne peut pas le manquer, et le fond reste lisible */
.todo-top { padding: 0; overflow: hidden; background: #fff6ea; border: 1px solid #edb978;
            border-left: 7px solid #d97b0a; box-shadow: 0 2px 12px rgba(0, 0, 0, .09); }
.todo-top h2 { background: #d97b0a; color: #fff; margin: 0; padding: 11px 18px; font-size: 1.2rem;
               display: flex; align-items: center; gap: 10px; }
.todo-top h2 .badge { background: #fff; color: #a85c04; font-size: .85rem; padding: 2px 11px; }
.todo-top .todo-intro { color: #7a4e07; margin: 0; padding: 12px 18px 0; }
.todo-top .todo-items { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
                        gap: 10px; padding: 12px 18px 18px; }
.todo-top .todo-items .todo-item + .todo-item { margin-top: 0; }
.todo-top .todo-item { border-color: #edc89a; }
.todo-item { background: #fff; border: 1px solid #e8dcb6; border-radius: 8px; padding: 8px 10px; font-size: .9rem; }
.todo-item + .todo-item { margin-top: 8px; }
.todo-item .quote { margin-top: 2px; }
.todo-item form { margin-top: 6px; }
.todo-item input[type="text"] { font-size: .85rem; padding: 5px 8px; }
.todo-item .actions { margin-top: 6px; }
.todo-contested { border-left: 3px solid var(--red); }
.todo-toreport { border-left: 3px solid var(--green-500); }
.todo-message { border-left: 3px solid #2f6ea8; }
.todo-expired { border-left: 3px solid #6f7b74; }
.todo-adminset { border-left: 3px solid var(--orange); }
/* Accueil : à gauche les matchs sur deux colonnes, à droite une colonne d'infos */
.home-grid { display: grid; gap: 0 18px; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: start; }
.home-grid > .home-col:only-child { grid-column: 1 / -1; }
.card-grid { display: grid; gap: 0 16px; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); align-items: start; }
.card-grid .section-sep { grid-column: 1 / -1; }
@media (max-width: 1000px) { .home-grid { grid-template-columns: 1fr; } }
.home-col h2:first-child { margin-top: 0; }
.stats { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin-bottom: 16px; }
.stat { background: var(--white); border: 1px solid var(--line); border-top: 3px solid var(--gold);
         border-radius: 14px; padding: 12px 14px; box-shadow: 0 1px 3px rgba(19, 63, 44, .06); }
.stat b { display: block; font-size: 1.6rem; color: var(--green-700); line-height: 1.2; }
.stat span { color: var(--muted); font-size: .85rem; }

.flash { padding: 10px 14px; border-radius: 8px; margin: 14px 0; border: 1px solid; }
.flash-success { background: var(--green-100); border-color: #b9dcc9; color: var(--green-900); }
.flash-error { background: var(--red-100); border-color: #efc1ba; color: var(--red); }
.flash-warning { background: var(--amber-100); border-color: #efd9a0; color: #6b4a00; }
.flash-info { background: var(--blue-100); border-color: #c4d5ec; color: #23466f; }

/* Tableaux */
.table-wrap { overflow-x: auto; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 16px; }
table { border-collapse: collapse; width: 100%; }
th, td { padding: 8px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
th { background: #f3f6f4; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); white-space: nowrap; }
tr:last-child td { border-bottom: none; }
tbody tr:hover { background: #fafcfb; }
tr.cut td { border-bottom: 2px dashed var(--green-500); }
tr.mine-row { background: #fff8e1; }
tr.no-contact td { background: var(--red-100); }
tr.no-contact td:first-child { box-shadow: inset 3px 0 0 var(--red); }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }

/* Le vainqueur est cerclé : dans une liste de matchs, le gras seul ne se repère pas */
.team.winner { font-weight: 700; color: var(--green-900); background: var(--green-100);
    border: 1px solid var(--green-500); border-radius: 6px; padding: 1px 8px;
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.team.loser { color: var(--muted); }
.team.mine { text-decoration: underline; text-decoration-color: #e0b100; text-decoration-thickness: 2px; }
.tee { display: inline-block; width: 10px; height: 10px; border-radius: 50%; vertical-align: 1px;
        border: 1px solid rgba(0,0,0,.25); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.tee-f { background: #cf3a2f; }
.tee-h { background: #efc417; }
.strokes { display: inline-block; background: var(--green-100); color: var(--green-700); border-radius: 10px; padding: 0 6px; font-size: .78rem; font-weight: 700; }

.badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: .78rem; font-weight: 600; white-space: nowrap; }
.badge-ok { background: var(--green-100); color: var(--green-700); }
.badge-todo { background: var(--blue-100); color: #23466f; }
.badge-late { background: var(--red-100); color: var(--red); }
.badge-warn { background: var(--amber-100); color: var(--amber); }
.badge-muted { background: #eceeed; color: var(--muted); }
/* Classement : podium et points en avant */
.standings td { padding: 10px; }
.standings th.rank-col, .standings td.rank-col { width: 76px; padding-left: 6px; padding-right: 6px; }
.standings .rank-cell { position: relative; display: flex; align-items: center; justify-content: center; }
/* le repère d'égalité ne décale pas la pastille : il se place à côté, sans occuper de place */
.standings .rank-cell .tie { position: absolute; left: calc(50% + 19px); margin: 0; }
.standings td.center, .standings th.center { text-align: center; font-variant-numeric: tabular-nums; }
.standings tbody tr:hover td { background: #f7faf7; }
.standings tr.podium td { background: #fcfbf4; }
.standings .st-pts { font-size: 1.15rem; font-weight: 700; color: var(--green-900); }
.standings .sa-pos { color: var(--green-700); font-weight: 600; }
.standings .sa-neg { color: var(--red); }
.standings .tie { margin-left: 4px; color: var(--amber); font-weight: 700; }
.rank.medal { color: #fff; }
.rank.medal-1 { background: #d9a400; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #d9a400; }
.rank.medal-2 { background: #8d969b; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #8d969b; }
.rank.medal-3 { background: #b47238; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #b47238; }

.rank { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; background: #eef2ef; font-weight: 700; font-size: .85rem; }
.rank.q-principal { background: var(--green-700); color: #fff; }
.rank.q-consolante { background: #c9a227; color: #fff; }

/* Formulaires */
form.inline { display: inline; }
label { display: block; font-weight: 600; font-size: .88rem; margin: 10px 0 4px; }
input[type=text], input[type=password], input[type=email], input[type=tel], input[type=number], input[type=date], select, textarea {
  width: 100%; padding: 8px 10px; border: 1px solid #c8d1cb; border-radius: 7px; font: inherit; background: #fff;
}
textarea { min-height: 70px; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--green-500); outline-offset: 0; border-color: var(--green-500); }
.form-row { display: grid; gap: 12px 16px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); align-items: end; }
.form-row > div { display: flex; flex-direction: column; min-width: 0; }
.form-row > div > label { margin-top: 0; flex: 1 0 auto; }   /* les champs d'une même ligne restent alignés */

/* Classement des trous : une grille, pas un tableau à faire défiler */
.hole-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 8px; }
.hole-grid label { margin: 0 0 3px; font-size: .78rem; color: var(--muted); text-align: center; }
.hole-grid input { text-align: center; padding: 7px 4px; }
.hole-grid .hole { background: #f7faf7; border: 1px solid var(--line); border-radius: 8px; padding: 6px 6px 7px; }
.checkbox { display: flex; gap: 8px; align-items: center; font-weight: normal; }
.checkbox input { width: auto; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; align-items: center; }
.btn, button {
  display: inline-block; border: 1px solid var(--green-700); background: var(--green-700); color: #fff;
  padding: 8px 14px; border-radius: 7px; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; line-height: 1.3;
}
.btn:hover, button:hover { background: var(--green-900); }
.btn-secondary { background: #fff; color: var(--green-700); }
.btn-secondary:hover { background: var(--green-100); }
.btn-danger { background: var(--red); border-color: var(--red); }
.btn-danger:hover { background: #8e2a20; }
.btn-small { padding: 4px 10px; font-size: .85rem; }
fieldset { border: 1px solid var(--line); border-radius: var(--radius); padding: 6px 14px 14px; margin: 0 0 14px; }
legend { font-weight: 700; padding: 0 6px; color: var(--green-900); }

.login-box { max-width: 380px; margin: 40px auto; }

/* Choix gagnant */
.winner-choice { display: grid; gap: 8px; }
.winner-choice label { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; margin: 0; font-weight: 600; cursor: pointer; background: #fff; }
.winner-choice input { width: auto; }
.winner-choice label:has(input:checked) { border-color: var(--green-500); background: var(--green-100); }

/* Match cards (Mon équipe) */
.section-sep { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin: 18px 0 8px; }
.countdown { display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
              border-left: 4px solid var(--green-500); background: var(--green-100); border-color: #b9dcc9; }
.countdown h2 { margin: 0 0 2px; }
.countdown > div:first-child { flex: 1; min-width: 240px; }
.cd-clock { text-align: center; background: #fff; border: 1px solid #b9dcc9; border-radius: var(--radius); padding: 8px 16px; }
.cd-clock b { display: block; font-size: 2rem; line-height: 1.1; color: var(--green-700); }
.cd-clock span { font-size: .8rem; color: var(--muted); }
.notice { border-left: 4px solid var(--blue-500); }
.notice h2 { margin-top: 0; }
.notice-info { background: var(--blue-100); border-color: #c4d5ec; }
.notice-warning { background: var(--amber-100); border-color: #efd9a0; border-left-color: var(--orange); }
.notice-success { background: var(--green-100); border-color: #b9dcc9; border-left-color: var(--green-500); }
/* Choix des destinataires : une tuile par équipe, qui se coche d'un clic n'importe où dessus.
   Les repères (sans réponse, jamais connectée…) tiennent sur leur propre ligne, pour que les
   tuiles gardent toutes la même allure quelle que soit la longueur du nom. */
.picker-tools { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 10px; }
.picker-sep { width: 1px; height: 22px; background: var(--line); margin: 0 3px; }
.team-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(238px, 1fr)); gap: 6px;
               max-height: 340px; overflow-y: auto; padding: 8px;
               background: var(--sand); border: 1px solid var(--line); border-radius: var(--radius); }
.team-pick { display: flex; gap: 9px; align-items: flex-start; padding: 7px 9px; cursor: pointer;
             background: var(--white); border: 1px solid var(--line); border-radius: 8px;
             font-weight: 400; line-height: 1.3; }
.team-pick:hover { border-color: var(--green-500); }
.team-pick input { width: auto; flex: 0 0 auto; margin: 1px 0 0; }
.team-pick:has(input:checked) { background: var(--green-100); border-color: var(--green-500); }
.tp-txt { min-width: 0; }
.tp-nom { display: block; font-size: .92rem; }
.tp-code { color: var(--muted); font-size: .76rem; letter-spacing: .03em; margin-right: 5px; }
.tp-marques { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.tp-marques .badge { font-size: .7rem; padding: 1px 6px; }
.team-pick.sans-mail .tp-nom { color: var(--muted); }
.proposal-card { border-left: 4px solid var(--blue-500); }
.dispo-follow th.current, .dispo-follow td.current { background: var(--blue-100); }
.dispo-count { display: inline-block; min-width: 26px; padding: 1px 6px; border-radius: 10px; font-weight: 700;
               background: var(--green-100); color: var(--green-700); }
.dispo-count.zero { background: var(--red-100); color: var(--red); }
.dispo-count.zero-past { background: #eceeed; color: var(--muted); }
.quote { font-style: italic; color: var(--muted); }
.scheduled { color: var(--orange); }
/* Proposition en attente : le bleu du planning du comité */
.proposed { color: #2f6ea8; }
.match-card { border-left: 5px solid var(--gold); }
.match-card.played { border-left-color: #b7c2bb; }
.match-card .vs { font-size: 1.05rem; }
.kv { display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px; font-size: .92rem; margin-top: 8px; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; min-width: 0; }
/* Adresses e-mail longues : police réduite et coupure, pour ne jamais déborder de la case */
.mail { font-size: .75em; overflow-wrap: break-word; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { background: var(--green-100); color: var(--green-900); border-radius: 12px; padding: 2px 10px; font-size: .82rem; }

/* Disponibilités */

/* Tableaux à élimination */
.bracket { display: flex; gap: 18px; overflow-x: auto; padding: 8px 2px 16px; }
.bracket-round { display: flex; flex-direction: column; min-width: 230px; }
.bracket-round h3 { text-align: center; font-size: .82rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin: 0 0 4px; }
.bracket-round .deadline { text-align: center; font-size: .75rem; color: var(--muted); margin-bottom: 8px; }
.bracket-matches { display: flex; flex-direction: column; justify-content: space-around; flex: 1; gap: 10px; }
.b-match { background: #fff; border: 1px solid var(--line); border-radius: 8px; font-size: .85rem; overflow: hidden; }
.b-match .b-team { display: flex; justify-content: space-between; gap: 6px; padding: 6px 9px; }
.b-match .b-team + .b-team { border-top: 1px solid var(--line); }
.b-match .b-team.winner { background: var(--green-100); font-weight: 700; }
.b-match .b-team.loser { color: var(--muted); }
.b-match .b-team.mine { box-shadow: inset 3px 0 0 #e0b100; }
.b-match .b-foot { background: #f6f8f7; padding: 3px 9px; font-size: .75rem; color: var(--muted); display: flex; justify-content: space-between; }
.b-seed { color: var(--muted); font-size: .75rem; min-width: 18px; }

/* Guides illustrés de la page d'aide */
.guide { display: block; margin-top: 10px; text-decoration: none; }
.guide img { width: 100%; height: auto; border: 1px solid var(--line); border-radius: 8px; display: block; }
.guide span { display: block; margin-top: 4px; }
.guide:hover img { border-color: var(--green-500); }

/* Identifiants imprimables */
.credentials { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.credential { border: 1px dashed #9aa79f; border-radius: 8px; padding: 12px; background: #fff; page-break-inside: avoid; }
.credential-logo { height: 38px; width: auto; float: right; margin: 0 0 4px 8px; }
.credential code { font-size: 1rem; background: #f1f4f2; padding: 1px 6px; border-radius: 4px; }

/* Calendrier des disponibilités */
.cal-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; font-size: .85rem; color: var(--muted); margin-bottom: 12px; }
.cal-swatch { display: inline-block; width: 14px; height: 14px; border-radius: 4px; border: 1px solid #c8d1cb; background: #fff; vertical-align: -2px; }
.cal-swatch.oui { background: #479e6e; border-color: #479e6e; }
.cal-swatch.non { background: #b65d54; border-color: #b65d54; }
.cal-swatch.common { background: var(--green-500); border-color: var(--green-500); box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--amber); margin: 0 4px; }
.cal-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; margin-bottom: 16px; }
.cal-month { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 12px 12px; }
.cal-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.cal-head h2 { margin: 0; font-size: 1.05rem; }
.cal-tools { display: flex; gap: 4px; }
.cal-tools .btn-small { padding: 2px 8px; font-size: .75rem; }
.cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.cal-dow { text-align: center; font-size: .7rem; text-transform: uppercase; color: var(--muted); padding: 2px 0; }
.cal-dow.we { color: var(--green-900); font-weight: 700; }
.cal-day { min-height: 44px; border-radius: 6px; padding: 3px 4px; display: flex; flex-direction: column; align-items: flex-start;
           justify-content: space-between; font: inherit; font-size: .8rem; text-align: left; margin: 0; }
.cal-day.empty { background: transparent; }
.cal-day.off { background: #f5f7f6; color: #b3bbb6; }
.cal-day.we { background: #fff; border: 1px solid #c8d1cb; color: var(--ink); }
.cal-day.we.wknd { border-color: var(--green-700); }
button.cal-day.we { cursor: pointer; width: 100%; }
button.cal-day.we:hover { border-color: var(--green-500); background: var(--green-100); color: var(--ink); }
.cal-day.we.oui, button.cal-day.we.oui:hover { background: #479e6e; border-color: #479e6e; color: #fff; }
.cal-day.we.non, button.cal-day.we.non:hover { background: #b65d54; border-color: #b65d54; color: #fff; }
.cal-day.past { opacity: .45; }
.cal-day.we.common, a.cal-day.we.common { background: var(--blue-500); border-color: var(--blue-500); color: #fff; text-decoration: none; }
a.cal-day.we.common:hover { background: var(--blue-700); border-color: var(--blue-700); color: #fff; }
.cal-day.we.booked-mine { background: var(--orange); border-color: var(--orange); color: #fff; }
.cal-day.we.booked-other { background: #6f7b74; border-color: #6f7b74; color: #fff; }
.cal-swatch.common { background: var(--blue-500); border-color: var(--blue-500); box-shadow: none; margin: 0; }
.cal-swatch.booked-mine { background: var(--orange); border-color: var(--orange); }
.cal-swatch.booked-other { background: #6f7b74; border-color: #6f7b74; }
.cal-num { font-weight: 700; line-height: 1; }
.cal-state { font-size: .68rem; font-weight: 600; line-height: 1; min-height: .68rem; }
@media (max-width: 640px) {
  .cal-grid { grid-template-columns: 1fr; }
  .cal-day { min-height: 40px; }
}
@media print {
  .cal-day.we.oui { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .cal-day.we.non { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

@media print {
  img { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .site-header, .site-footer, .no-print, .flash { display: none !important; }
  body { background: #fff; }
  .card, .table-wrap { border: none; }
}

@media (max-width: 640px) {
  h1 { font-size: 1.35rem; }
  .hide-mobile { display: none; }
  th, td { padding: 7px 6px; }
}


/* ---- Palette et formes propres à la charte D ---- */
:root {
  --green-900: #000;      /* barre de navigation */
  --green-700: #32373c;   /* boutons et liens, comme sur le site de l'AS */
  --green-500: #f1868a;   /* accent saumon */
  --green-100: #fdeeee;
  --gold: #f1868a;
  --gold-100: #fdeeee;
  --sand: #fff;
  --ink: #232323;
  --muted: #6f6f6f;
  --line: #e2e2e2;
  --radius: 0;
}
body { font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
       font-size: 14.5px; background-image: none; }
h1, h2, h3 { font-family: Poppins, system-ui, sans-serif; font-weight: 600; color: #000; }
.brand strong { font-family: Poppins, system-ui, sans-serif; font-weight: 600; color: #fff; } /* sur la barre noire */
h1 { font-size: 1.7rem; }

/* Barre de navigation noire, liens en majuscules */
.site-header { background: #000; box-shadow: none; }
.main-nav a { color: #fff; text-transform: uppercase; font-size: .8rem; letter-spacing: .06em; border-radius: 0; }
.main-nav a:hover { background: transparent; color: var(--green-500); }
.main-nav a.active { background: transparent; color: var(--green-500); font-weight: 600; }
.main-nav a.admin-link { color: #d9d9d9; }
.main-nav a.admin-link.active { color: var(--green-500); }
.admin-nav-bar { background: #1a1a1a; border-top-color: #333; }
.brand small { opacity: .8; }

/* Cartes et tableaux : angles droits, traits fins */
.card, .stat, .table-wrap { border-radius: 0; box-shadow: none; border: 1px solid var(--line); }
.stat { border-top: 3px solid var(--green-500); }
.stat b { color: #000; }
h2::before { background: var(--green-500); }
th { background: #f6f6f6; color: #555; }

/* Boutons carrés, gris ardoise comme sur asgolfcdi.fr */
.btn, button { background: var(--green-700); border-color: var(--green-700); border-radius: 0; box-shadow: none;
               text-transform: uppercase; font-size: .82rem; letter-spacing: .04em; }
.btn:hover, button:hover { background: #000; border-color: #000; }
.btn-secondary { background: #fff; color: var(--green-700); border-color: #c9ccd0; }
.btn-secondary:hover { background: #f2f2f2; color: #000; }
.badge, .chip, .strokes, .rank { border-radius: 0; }
.team-picker, .team-pick { border-radius: 0; }
.rank { border-radius: 50%; }
input, select, textarea { border-radius: 0; }
.match-card { border-left: 4px solid var(--green-500); }
.notice { border-left-color: var(--green-500); }

/* Calendrier : le vert reste le repère « disponible » — le saumon du thème servirait
   de contresens à côté du rouge « indisponible » */
.cal-day.we.oui, button.cal-day.we.oui:hover { background: #479e6e; border-color: #479e6e; color: #fff; }
/* une date commune reste bleue, même si l'équipe est disponible ce jour-là */
.cal-day.we.oui.common, a.cal-day.we.oui.common, a.cal-day.we.oui.common:hover {
  background: var(--blue-500); border-color: var(--blue-500); color: #fff; }
.cal-swatch.oui { background: #479e6e; border-color: #479e6e; }
.cal-dow.we { color: #479e6e; }
.cal-day.we.wknd { border-color: #479e6e; }
.badge-ok { background: #e6f4ec; color: #1d6b45; }   /* résultat acquis : vert, comme sur les autres chartes */
.sa-pos { color: #1d6b45; }
.rank.q-principal { background: #1d6b45; }

/* =========================================================================
 * Lisibilité sur tablette et sur téléphone
 * Tout est enfermé dans des media queries « screen » : l'affichage sur
 * ordinateur (au-delà de 1024 px) et les impressions ne changent pas.
 * ========================================================================= */

/* ---- Tablette : la mise en page de l'ordinateur, simplement resserrée ---- */
@media screen and (max-width: 1024px) {
  .wrap { padding: 0 14px; }
  h1 { font-size: 1.45rem; margin-top: 1.1rem; }
  .brand-logo { height: 40px; }
  .brand strong { font-size: 1rem; }
  .header-inner { padding-top: 10px; }
  .main-nav a { padding: 6px 9px; font-size: .9rem; }
  .card { padding: 14px 15px; }
  .cal-grid { grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); }
  .credentials { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
  /* Les champs d'un formulaire restent assez larges pour être remplis au doigt */
  .form-row { grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); }
}

/* ---- Téléphone ---- */
@media screen and (max-width: 640px) {
  /* En-tête : logo, titre et navigation compacts, pour laisser la place au contenu */
  .brand-logo { height: 34px; }
  .brand strong { font-size: .95rem; }
  .brand small { font-size: .72rem; }
  .header-inner { gap: 8px; padding-top: 10px; padding-bottom: 6px; }
  .user-box { gap: 10px; font-size: .82rem; }
  .main-nav { gap: 2px; padding-bottom: 8px; }
  .main-nav a { padding: 5px 8px; font-size: .85rem; }
  .site-footer { padding-bottom: 24px; }
  .card { padding: 13px 13px; border-radius: 11px; }

  /* 16 px minimum dans les champs : en dessous, l'iPhone zoome à chaque saisie */
  input[type=text], input[type=password], input[type=email], input[type=tel],
  input[type=number], input[type=date], input[type=search], select, textarea { font-size: 16px; }
  /* Boutons : de quoi viser au doigt */
  .btn, button { padding: 10px 15px; }
  .btn-small { padding: 7px 12px; font-size: .85rem; }
  .actions { gap: 10px; }
  .sz-tools input[type="search"] { width: 100%; }

  /* Fiches « étiquette / valeur » : la valeur passe sous son étiquette */
  .kv { grid-template-columns: 1fr; gap: 0; }
  .kv dt { margin-top: 9px; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; }
  .kv > dt:first-child { margin-top: 0; }
  .kv dd { margin-bottom: 1px; }

  /* Classement : le nom des équipes gagne la place prise par la pastille de rang */
  .standings th.rank-col, .standings td.rank-col { width: 44px; }
  .standings .rank-cell .tie { left: calc(50% + 14px); }
  .standings td { padding: 8px 4px; font-size: .92rem; }
  .standings .st-pts { font-size: 1.05rem; }

  /* Tableaux trop larges pour un téléphone : chaque ligne devient une fiche */
  table.table-cards thead { display: none; }
  table.table-cards, table.table-cards tbody, table.table-cards tr, table.table-cards td { display: block; width: auto; }
  table.table-cards tr { padding: 10px 12px; border-bottom: 1px solid var(--line); }
  table.table-cards tr:last-child { border-bottom: none; }
  table.table-cards td { border: none; padding: 1px 0; }
  table.table-cards td:empty { display: none; }
  table.table-cards td[data-label]::before { content: attr(data-label) " · "; color: var(--muted);
      font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; }
  table.table-cards td.vs-second::before { content: "contre "; color: var(--muted); font-size: .82rem; }
  table.table-cards td.row-end { margin-top: 7px; }
  table.table-cards td.right { text-align: left; }
  table.table-cards td.num { text-align: left; }
  table.table-cards td.hide-mobile { padding-top: 2px; }
  /* une adresse e-mail reste lisible : la réduction de taille suffit sur ordinateur, pas ici */
  .mail { font-size: .85em; }

  /* Tableaux à élimination : colonnes plus étroites, le tableau se fait glisser du doigt */
  .bracket { gap: 12px; }
  .bracket-round { min-width: 176px; }
  .b-match { font-size: .8rem; }
  .b-match .b-team { padding: 5px 7px; }

  /* Disponibilités : cases plus hautes (on clique dedans) et légende resserrée */
  .cal-day { min-height: 48px; }
  .cal-legend { gap: 4px 12px; font-size: .8rem; }
  .cal-month { padding: 10px 9px 12px; }

  /* Accueil : le bandeau « À traiter » reste large et lisible */
  .todo-top h2 { font-size: 1.05rem; padding: 10px 13px; }
  .todo-top .todo-intro { padding: 10px 13px 0; }
  .todo-top .todo-items { padding: 10px 13px 14px; }
  .countdown { gap: 12px; }
  .cd-clock { padding: 6px 12px; }
}

/* Bouton inactif : il doit se voir au premier coup d'œil (publication des tableaux, par exemple).
   Placé en fin de feuille pour l'emporter sur les couleurs propres à chaque charte. */
.btn[disabled], .btn.disabled, button[disabled], button:disabled,
.btn[disabled]:hover, .btn.disabled:hover, button[disabled]:hover, button:disabled:hover {
  background: #e7eae8;
  border-color: #d2d9d4;
  color: #8d968f;
  cursor: not-allowed;
  box-shadow: none;
  opacity: 1;
}

/* Match supplémentaire d'une équipe inscrite après le tirage : sans enjeu pour son adversaire */
.badge-extra { background: #ece8f7; color: #574a86; }
tbody tr.extra td { background: #f1ecfc; }
tbody tr.extra:hover td { background: #efeafa; }
.match-card.extra { border-left-color: #7a6bb5; }
.extra-note { color: #574a86; }