/* ===== Soirées dansantes Bordeaux ===== */
:root {
  --fond: #fbf7f4;
  --carte: #ffffff;
  --texte: #23181f;
  --doux: #6f6168;
  --ligne: #eadfe1;
  --accent: #c2185b;
  --accent-fonce: #8e0f42;
  --or: #f2a541;
  --ok: #2e7d4f;
  --erreur: #b3261e;
  --info: #1e5aa8;
  --rayon: 12px;
  --ombre: 0 2px 10px rgba(60, 20, 40, .08);
  /* couleurs par danse */
  --salsa: #e53935;
  --bachata: #c2185b;
  --kizomba: #6a1b9a;
  --sbk: #ef6c00;
  --zouk: #00897b;
  --rock: #3949ab;
  --wcs: #0277bd;
  --autre: #6d4c41;
  --mix: #ad1457;
  --kompa: #2e7d32;
  --forro: #c77800;
  --tango: #212121;
  --swing: #5e35b1;
  --salon: #7b1fa2;
  --country: #8d6e63;
  --folk: #558b2f;
  --afro: #d84315;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--fond); color: var(--texte);
  font: 16px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
a { color: var(--accent); }
a:hover { color: var(--accent-fonce); }
img { max-width: 100%; height: auto; }
h1, h2, h3 { line-height: 1.2; }
h1 { font-size: clamp(1.6rem, 3.5vw, 2.3rem); margin: .4em 0 .5em; }
h2 { font-size: 1.35rem; }

.conteneur { max-width: 1240px; margin: 0 auto; padding: 0 18px; }
.etroit { max-width: 760px; margin-left: auto; margin-right: auto; }
.petit { font-size: .88rem; color: var(--doux); }
.discret { color: var(--doux); }
.cache { position: absolute !important; left: -9999px !important; }
.masquee { display: none; }

/* ---- En-tête ---- */
.entete { background: linear-gradient(90deg, #2a0f1f, #5a1236 55%, #8e0f42); color: #fff; }
.entete-inner { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; min-height: 64px; }
.logo { color: #fff; text-decoration: none; font-weight: 800; font-size: 1.15rem; }
.logo span { color: var(--or); }
.logo:hover { color: #fff; }
.nav { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.nav a { color: #fff; text-decoration: none; }
.nav a.discret { color: #e8cdd9; }

/* ---- Boutons ---- */
.btn {
  display: inline-block; border: 0; cursor: pointer; text-decoration: none;
  background: var(--accent); color: #fff !important; font-weight: 600; font-size: 1rem;
  padding: .7em 1.2em; border-radius: 999px; transition: background .15s, transform .15s;
}
.btn:hover { background: var(--accent-fonce); transform: translateY(-1px); }
.btn-petit { padding: .45em .95em; font-size: .9rem; }
.entete .btn { background: var(--or); color: #2a0f1f !important; }
.btn-ghost { background: transparent; color: var(--accent) !important; border: 2px solid var(--accent); }
.btn-ghost:hover { background: var(--accent); color: #fff !important; }
.btn-danger { background: var(--erreur); }
.lien-btn { background: none; border: 0; color: var(--accent); text-decoration: underline; cursor: pointer; padding: 0; font: inherit; font-size: .9rem; }

/* ---- Alertes ---- */
.alerte { padding: 12px 16px; border-radius: var(--rayon); margin: 16px 0; border-left: 5px solid; background: #fff; }
.alerte.ok { border-color: var(--ok); background: #eef8f1; }
.alerte.erreur { border-color: var(--erreur); background: #fdeeed; }
.alerte.info { border-color: var(--info); background: #edf3fc; }

/* ---- Accueil ---- */
.hero { padding: 26px 0 6px; }
.hero p { color: var(--doux); max-width: 780px; margin-top: 0; }
.filtres { display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-end; margin: 12px 0 18px; }
.filtres label { display: flex; flex-direction: column; font-size: .85rem; color: var(--doux); font-weight: 600; }
select, input, textarea {
  font: inherit; padding: .6em .75em; border: 1px solid #d8c9cf; border-radius: 9px; background: #fff; color: var(--texte);
}
select:focus, input:focus, textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: transparent; }

.onglets { display: inline-flex; background: #fff; border: 1px solid var(--ligne); border-radius: 999px; padding: 4px; margin-bottom: 10px; }
.onglet { border: 0; background: none; padding: .45em 1.1em; border-radius: 999px; cursor: pointer; font: inherit; font-weight: 600; color: var(--doux); }
.onglet.actif { background: var(--accent); color: #fff; }

/* ---- Calendrier ---- */
.cal-nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 10px 0; }
.cal-nav h2 { margin: 0; text-transform: capitalize; }
.cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.cal-entete { text-align: center; font-weight: 700; color: var(--doux); font-size: .85rem; padding: 4px 0; }
.cal-jour { background: var(--carte); border: 1px solid var(--ligne); border-radius: 10px; min-height: 110px; padding: 6px; display: flex; flex-direction: column; gap: 4px; }
.cal-jour.vide { background: transparent; border: 0; }
.cal-jour.passe { opacity: .55; }
.cal-jour.auj { border: 2px solid var(--accent); }
.cal-num { font-weight: 700; font-size: .9rem; }
.jour-nom { display: none; }
.puce {
  display: block; text-decoration: none; color: #fff; border-radius: 7px; padding: 4px 6px; font-size: .76rem; line-height: 1.25;
  background: var(--autre); overflow: hidden;
}
.puce:hover { color: #fff; filter: brightness(1.1); }
.puce-h { font-weight: 800; margin-right: 3px; }
.puce-t { font-weight: 600; }
.puce-c, .puce-a { display: block; opacity: .9; font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.puce.mien { outline: 3px solid var(--or); }
.d-salsa { background: var(--salsa); } .d-bachata { background: var(--bachata); } .d-kizomba { background: var(--kizomba); }
.d-sbk { background: var(--sbk); } .d-zouk { background: var(--zouk); } .d-rock { background: var(--rock); }
.d-wcs { background: var(--wcs); } .d-autre { background: var(--autre); }
.d-kompa { background: var(--kompa); } .d-forro { background: var(--forro); } .d-tango { background: var(--tango); }
.d-swing { background: var(--swing); } .d-salon { background: var(--salon); } .d-country { background: var(--country); }
.d-folk { background: var(--folk); } .d-afro { background: var(--afro); } .d-mix { background: linear-gradient(135deg, var(--salsa), var(--bachata) 50%, var(--kizomba)); }

/* ---- Liste / agenda ---- */
.titre-liste { margin-top: 6px; }
.agenda-jour { margin: 22px 0 8px; font-size: 1.05rem; color: var(--accent-fonce); border-bottom: 2px solid var(--ligne); padding-bottom: 4px; }
.agenda-groupe { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
.carte { display: flex; gap: 12px; background: var(--carte) !important; border-radius: var(--rayon); box-shadow: var(--ombre); text-decoration: none; color: var(--texte); overflow: hidden; border: 1px solid var(--ligne); }
.carte:hover { color: var(--texte); box-shadow: 0 6px 18px rgba(60, 20, 40, .14); }
.carte-visuel { width: 96px; flex: 0 0 96px; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: .82rem; letter-spacing: .03em; }
.carte.d-salsa .carte-visuel:not([style]) { background: var(--salsa); }
.carte.d-bachata .carte-visuel:not([style]) { background: var(--bachata); }
.carte.d-kizomba .carte-visuel:not([style]) { background: var(--kizomba); }
.carte.d-sbk .carte-visuel:not([style]) { background: var(--sbk); }
.carte.d-zouk .carte-visuel:not([style]) { background: var(--zouk); }
.carte.d-rock .carte-visuel:not([style]) { background: var(--rock); }
.carte.d-wcs .carte-visuel:not([style]) { background: var(--wcs); }
.carte.d-autre .carte-visuel:not([style]) { background: var(--autre); }
.carte.d-mix .carte-visuel:not([style]) { background: var(--mix); }
.carte.d-kompa .carte-visuel:not([style]) { background: var(--kompa); }
.carte.d-forro .carte-visuel:not([style]) { background: var(--forro); }
.carte.d-tango .carte-visuel:not([style]) { background: var(--tango); }
.carte.d-swing .carte-visuel:not([style]) { background: var(--swing); }
.carte.d-salon .carte-visuel:not([style]) { background: var(--salon); }
.carte.d-country .carte-visuel:not([style]) { background: var(--country); }
.carte.d-folk .carte-visuel:not([style]) { background: var(--folk); }
.carte.d-afro .carte-visuel:not([style]) { background: var(--afro); }
.carte-corps { padding: 10px 12px 10px 0; min-width: 0; }
.carte-h { font-weight: 800; color: var(--accent); font-size: .9rem; }
.carte-t { font-weight: 700; }
.carte-l, .carte-d { font-size: .86rem; color: var(--doux); }
.vide-msg { color: var(--doux); font-style: italic; }

.encart { background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); padding: 22px; margin: 36px 0; box-shadow: var(--ombre); }

/* ---- Fiche soirée ---- */
.fil { font-size: .88rem; color: var(--doux); margin-top: 16px; }
.fiche { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 28px; background: #fff; border-radius: var(--rayon); padding: 22px; box-shadow: var(--ombre); margin-bottom: 22px; }
.fiche-visuel { border-radius: 10px; overflow: hidden; min-height: 220px; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 1.4rem; text-align: center; padding: 0; }
.fiche-visuel img { width: 100%; display: block; }
.fiche h1 { margin-top: 0; }
.fiche-liste { list-style: none; padding: 0; margin: 0 0 18px; }
.fiche-liste li { padding: 6px 0; border-bottom: 1px dashed var(--ligne); }
.fiche-desc { white-space: normal; }

/* ---- Formulaires ---- */
.formulaire { display: flex; flex-direction: column; gap: 14px; background: #fff; padding: 22px; border-radius: var(--rayon); box-shadow: var(--ombre); }
.formulaire label { display: flex; flex-direction: column; gap: 5px; font-weight: 600; font-size: .93rem; }
.formulaire label.case { flex-direction: row; align-items: flex-start; gap: 8px; font-weight: 400; }
.formulaire label.case input { margin-top: 4px; }
.formulaire fieldset { border: 1px solid var(--ligne); border-radius: 10px; padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; margin: 0; }
.formulaire legend { font-weight: 800; color: var(--accent-fonce); padding: 0 6px; }
.ligne2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ligne3 { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 12px; }
.danses { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 4px 12px; }
.danses .label { grid-column: 1 / -1; font-weight: 600; font-size: .93rem; }
.aide { font-weight: 400; font-size: .84rem; color: var(--doux); margin: 0; }
.apercu { max-width: 220px; border-radius: 8px; }
.actions { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.form-suppr { margin: 18px 0 30px; text-align: right; }

/* ---- Planning ---- */
.planning-tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; flex-wrap: wrap; }
.planning-tete p { color: var(--doux); max-width: 760px; }
.legende { display: flex; gap: 14px; flex-wrap: wrap; font-size: .85rem; }
.puce-leg { padding: 3px 9px; border-radius: 6px; background: #eadfe1; }
.puce-leg.mien { outline: 3px solid var(--or); background: #fff; }
.table-scroll { overflow-x: auto; }
.tableau { width: 100%; border-collapse: collapse; background: #fff; border-radius: var(--rayon); overflow: hidden; box-shadow: var(--ombre); font-size: .9rem; }
.tableau th, .tableau td { padding: 8px 10px; border-bottom: 1px solid var(--ligne); text-align: left; vertical-align: top; }
.tableau th { background: #f4ebee; font-size: .82rem; text-transform: uppercase; letter-spacing: .02em; }
.tableau tr.passe td { opacity: .55; }
.tableau tr.mien td { background: #fff8ec; }
.mes-soirees li { margin-bottom: 6px; }
.badge { display: inline-block; background: #fdeeed; color: var(--erreur); border-radius: 6px; padding: 1px 7px; font-size: .78rem; }

/* ---- Fenêtre modale ---- */
.modal { position: fixed; inset: 0; background: rgba(30, 10, 20, .55); display: flex; align-items: center; justify-content: center; padding: 16px; z-index: 50; }
.modal[hidden] { display: none; }
.modal-boite { background: #fff; border-radius: 16px; max-width: 560px; width: 100%; padding: 24px; box-shadow: 0 20px 60px rgba(0, 0, 0, .3); border-top: 6px solid var(--or); }
.modal-boite h2 { margin-top: 0; }
.modal-boite ul { padding-left: 18px; }
.modal-boite li { margin-bottom: 8px; }

/* ---- Pied ---- */
.pied { margin-top: 50px; background: #2a0f1f; color: #e8cdd9; padding: 24px 0; font-size: .9rem; }
.pied a { color: var(--or); }

/* ---- Admin ---- */
.admin-nav { display: flex; gap: 14px; flex-wrap: wrap; margin: 16px 0; }
.admin-nav a { font-weight: 600; }
.stat { display: inline-block; background: #fff; border: 1px solid var(--ligne); border-radius: 10px; padding: 8px 14px; margin: 0 8px 8px 0; }
code.jeton { background: #f4ebee; padding: 6px 10px; border-radius: 6px; word-break: break-all; display: inline-block; }

/* ---- Mobile ---- */
@media (max-width: 760px) {
  .cal { grid-template-columns: 1fr; }
  .cal-entete, .cal-jour.vide, .cal-jour:not(.plein) { display: none; }
  .cal-jour { min-height: 0; }
  .jour-nom { display: inline; text-transform: capitalize; }
  .puce { font-size: .9rem; padding: 7px 9px; }
  .puce-c, .puce-a { font-size: .8rem; }
  .fiche { grid-template-columns: 1fr; padding: 14px; }
  .ligne2, .ligne3 { grid-template-columns: 1fr; }
  .formulaire { padding: 16px; }
}

/* ---- V2 : espace danseur, partage ---- */
.puce.favori { box-shadow: 0 0 0 3px #f2a541 inset; }
.puce-fav { color: #ffe08a; font-weight: 800; margin-right: 2px; }
.badge-fav { display: inline-block; background: #fff4dc; color: #8a5a00; border-radius: 6px; padding: 0 6px; font-size: .75rem; font-weight: 700; }
.actions-soiree { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 6px 0 14px; }
.actions-soiree form { margin: 0; }
.btn-ok { background: var(--ok); }
.btn-ok:hover { background: #22603c; }
.partage-soiree { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding-top: 12px; border-top: 1px dashed var(--ligne); }
.bloc-perso { background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); padding: 16px 20px; margin: 18px 0; box-shadow: var(--ombre); }
.bloc-perso h2 { margin-top: 0; }
.copie { display: flex; gap: 8px; flex-wrap: wrap; }
.copie input { flex: 1 1 280px; min-width: 0; }
.encart-danseur { border-top: 5px solid var(--or); }
.copie-ok { background: var(--ok) !important; color: #fff !important; }

/* ---- V6 : « J'y vais » en un clic ---- */
.puce-bloc, .carte-bloc { position: relative; }
.puce-bloc .puce { padding-right: 26px; }
.carte-bloc .carte { height: 100%; }
.carte-bloc .carte-corps { padding-right: 44px; }
.fav-form { position: absolute; top: 3px; right: 3px; margin: 0; }
.fav-form.fav-grand { top: 10px; right: 10px; }
.btn-fav {
  width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
  background: rgba(255, 255, 255, .92); color: #8e0f42; font-size: 15px; line-height: 22px; text-align: center;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
}
.fav-grand .btn-fav { width: 34px; height: 34px; font-size: 20px; line-height: 34px; border: 1px solid var(--ligne); }
.btn-fav:hover, .btn-fav:focus-visible { background: #fff4dc; outline: 2px solid #f2a541; }
.btn-fav.actif { background: #f2a541; color: #fff; }
.btn-fav:disabled { opacity: .6; cursor: wait; }
.badge-fav[hidden] { display: none; }
