/* ============================================================
 * MX-Pass Dashboard Club — styles
 * Aligné sur design_handoff_club_pilote/theme.jsx
 *
 * Palette  : bg #f2ece0, card #faf7f0, ink #1a1208, muted #8a7a66,
 *            mud #b5724a (CTA), mudDeep #9a5d39, forest #3d6b28,
 *            deep #2d4a1e, danger #dc2626, success #16a34a
 * Headline : "Barlow Condensed" italic 900 uppercase, letter-spacing négatif
 * Body     : Inter
 *
 * Toutes les règles scopées sous .mxpass-dashboard pour ne pas
 * pollluer le thème Kadence.
 * ============================================================ */

/* ============================================================
 * Page-level overrides : neutralise Kadence (et thèmes similaires)
 * pour que le dashboard se comporte comme une vraie page d'app.
 *
 * Le crème déborde edge-to-edge du viewport ; le hero "Tableau de
 * bord Club" est masqué (notre topbar le remplace) ; les containers
 * du thème perdent leurs paddings/max-width.
 * ============================================================ */
body.mxpass-dashboard-page {
  background: #f2ece0 !important;
}
body.mxpass-dashboard-page .entry-hero,
body.mxpass-dashboard-page .entry-hero-container-inner,
body.mxpass-dashboard-page .entry-header,
body.mxpass-dashboard-page header.entry-header,
body.mxpass-dashboard-page .entry-title,
body.mxpass-dashboard-page .entry-title-wrap,
body.mxpass-dashboard-page .kadence-title-element,
body.mxpass-dashboard-page .page-header,
body.mxpass-dashboard-page .page-title {
  display: none !important;
}
body.mxpass-dashboard-page .site-container,
body.mxpass-dashboard-page .content-container,
body.mxpass-dashboard-page .content-area,
body.mxpass-dashboard-page main.site-main,
body.mxpass-dashboard-page .site-main,
body.mxpass-dashboard-page .site-content,
body.mxpass-dashboard-page .site-content-wrap,
body.mxpass-dashboard-page .entry-content,
body.mxpass-dashboard-page article.post,
body.mxpass-dashboard-page article.page,
body.mxpass-dashboard-page .wp-site-blocks,
body.mxpass-dashboard-page .content-area > .site-main,
body.mxpass-dashboard-page #primary,
body.mxpass-dashboard-page #content {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}

.mxpass-dashboard {
  --bg: #f2ece0;
  --surface: #e8e0d0;
  --card: #faf7f0;
  --ink: #1a1208;
  --muted: #8a7a66;
  --muted-strong: #6e5f4c; /* texte secondaire < 14px — contraste WCAG AA, cf. RN Terrain.mutedStrong */
  --light: #b5a892;
  --mud: #b5724a;
  --mud-deep: #9a5d39;
  --forest: #3d6b28;
  --deep: #2d4a1e;
  --danger: #dc2626;
  --success: #16a34a;
  --border: rgba(26,18,8,0.08);
  --border-strong: rgba(26,18,8,0.14);
  --ff-head: "Barlow Condensed", "Barlow", "Arial Narrow", sans-serif;
  --ff-body: Inter, system-ui, -apple-system, sans-serif;

  font-family: var(--ff-body);
  color: var(--ink);
  background: transparent;
  padding: .5rem 1.5rem 3rem;
  max-width: 1280px;
  margin: 0 auto;
}
@media (min-width: 1024px) {
  .mxpass-dashboard { padding: .8rem 2.5rem 4rem; }
}
.mxpass-dashboard *, .mxpass-dashboard *::before, .mxpass-dashboard *::after { box-sizing: border-box; }
.mxpass-dashboard a { color: var(--mud); }

/* ----- Top bar : titre du club + logout (pas de duplicat de header WP) ----- */
.mxpd-topbar {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
  padding: 0 0 .35rem; margin-bottom: .35rem;
  border-bottom: 1px solid var(--border-strong);
}
.mxpd-title {
  font-family: var(--ff-head);
  font-weight: 900; font-style: italic; text-transform: uppercase;
  font-size: clamp(1.6rem, 3.2vw, 2.4rem);
  line-height: .98; letter-spacing: -0.8px;
  color: var(--ink);
  margin: 0;
}
.mxpd-title__eyebrow {
  display: block; font-family: var(--ff-body); font-weight: 700;
  font-size: 14px; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--muted-strong); font-style: normal;
  margin: 0 0 .1rem;
}
.mxpd-title { margin: 0 !important; padding: 0 !important; }
.mxpd-topbar__actions {
  display: flex; align-items: center; gap: 1.2rem;
}
.mxpd-logout,
.mxpd-passwordbtn {
  background: transparent; border: none; padding: .6rem .2rem;
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .5px; font-size: 15px;
  color: var(--mud); cursor: pointer;
  min-height: 44px;
}
.mxpd-logout:hover,
.mxpd-passwordbtn:hover { color: var(--mud-deep); text-decoration: underline; }
.mxpd-passwordbtn { color: var(--muted-strong); }

/* ----- Horizontal tabs -----
   Refonte senior (2026-07-13) : pills pleines au lieu d'un simple souligné
   — beaucoup plus visible/tapable, l'onglet actif ne doit pas pouvoir être
   manqué. Taille de police doublée par rapport à la version précédente. */
.mxpd-tabs {
  display: flex; gap: .5rem; overflow-x: auto; flex-wrap: wrap;
  margin: 0 0 1.2rem; padding: .4rem;
  background: var(--surface);
  border-radius: 14px;
  scrollbar-width: thin;
}
.mxpass-dashboard .mxpd-tab,
.mxpd-tab {
  flex-shrink: 0;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 1rem 1.6rem;
  border-radius: 10px;
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .3px; font-size: 17px;
  color: var(--muted-strong); cursor: pointer;
  border-bottom: none !important;
  margin-bottom: 0;
  transition: color .15s, background-color .15s;
}
.mxpass-dashboard .mxpd-tab:hover,
.mxpd-tab:hover {
  background: rgba(181,114,74,.1) !important;
  background-color: rgba(181,114,74,.1) !important;
  box-shadow: none !important;
  color: var(--mud) !important;
}
.mxpass-dashboard .mxpd-tab.is-active,
.mxpd-tab.is-active {
  background: var(--mud) !important;
  background-color: var(--mud) !important;
  color: #fff !important;
}
@media (max-width: 600px) {
  .mxpd-tab { padding: .85rem 1.1rem; font-size: 15px; }
}

/* ----- Section ----- */
.mxpd-section__eyebrow {
  font-family: var(--ff-body); font-weight: 700;
  font-size: 14px; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--muted-strong); margin-bottom: .4rem;
}
.mxpd-section__title {
  font-family: var(--ff-head);
  font-weight: 900; font-style: italic; text-transform: uppercase;
  color: var(--ink); margin: 0 0 .3rem;
  font-size: 1.7rem; line-height: 1; letter-spacing: -0.4px;
}
.mxpd-section__intro { color: var(--muted-strong); font-size: 1.05rem; line-height: 1.5; margin: 0 0 1.5rem; }

/* ----- Form (grid 2 colonnes) -----
   Refonte senior (2026-07-13) : labels + valeurs saisies nettement plus
   grandes (16px→18px), champs plus hauts pour rester faciles à toucher. */
.mxpd-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem 1.5rem; }
@media (max-width: 720px) { .mxpd-form { grid-template-columns: 1fr; } }
.mxpd-form label {
  display: block; font-size: 15px; letter-spacing: 1px; text-transform: uppercase;
  font-weight: 700; color: var(--muted-strong); margin-bottom: .5rem;
}
.mxpd-form input[type=text], .mxpd-form input[type=email], .mxpd-form input[type=url], .mxpd-form textarea {
  width: 100%; margin-top: .35rem; padding: .9rem 1rem;
  border: 1.5px solid var(--border-strong); border-radius: 10px;
  font-size: 17px; background: var(--card); color: var(--ink);
  font-family: var(--ff-body); letter-spacing: normal; text-transform: none; font-weight: 400;
}
.mxpd-form input:focus, .mxpd-form textarea:focus {
  outline: none; border-color: var(--mud); box-shadow: 0 0 0 3px rgba(181,114,74,.18);
}
.mxpd-form textarea { min-height: 100px; resize: vertical; }

/* ----- Date + heure (remplace l'ancien <input type="datetime-local">) ── */
.mxpd-dt-field { display: flex; gap: .6rem; margin-top: .35rem; flex-wrap: wrap; }
.mxpd-dt-field input[type=date],
.mxpd-dt-field input[type=time] {
  padding: .9rem 1rem;
  border: 1.5px solid var(--border-strong); border-radius: 10px;
  font-size: 17px; background: var(--card); color: var(--ink);
  font-family: var(--ff-body); font-weight: 500;
  min-height: 52px;
}
.mxpd-dt-field input[type=date] { flex: 1.4; min-width: 160px; }
.mxpd-dt-field input[type=time] { flex: 1; min-width: 110px; }
.mxpd-dt-field input:focus {
  outline: none; border-color: var(--mud); box-shadow: 0 0 0 3px rgba(181,114,74,.18);
}
.mxpd-form__row--full { grid-column: 1 / -1; }
.mxpd-form__actions {
  grid-column: 1 / -1; display: flex; gap: 1rem; align-items: center;
  margin-top: .8rem; padding-top: 1rem; border-top: 1px solid var(--border);
}

/* ----- Buttons (style app : Barlow Condensed italic uppercase) ----- */
.mxpd-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  height: 52px; padding: 0 1.8rem; border: none; border-radius: 12px;
  background: var(--mud); color: #fff;
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .5px; font-size: 16px;
  cursor: pointer; transition: background .15s, transform .05s;
}
.mxpd-btn:hover:not(:disabled) { background: var(--mud-deep); }
.mxpd-btn:active:not(:disabled) { transform: translateY(1px); }
.mxpd-btn:disabled { opacity: .5; cursor: not-allowed; }
.mxpd-btn--ghost {
  background: transparent; color: var(--mud); border: 1.5px solid var(--mud);
}
.mxpd-btn--ghost:hover:not(:disabled) { background: rgba(181,114,74,.08); color: var(--mud); }

/* ----- Status message ----- */
.mxpd-msg { font-size: 1rem; min-height: 1.2em; font-family: var(--ff-body); font-weight: 600; }
.mxpd-msg--err { color: var(--danger); font-weight: 600; }
.mxpd-msg--ok  { color: var(--success); font-weight: 600; }

/* ----- Image upload card ----- */
.mxpd-upload {
  display: flex; align-items: center; gap: 1rem; padding: .85rem;
  background: var(--card); border: 1px dashed var(--border-strong); border-radius: 10px;
}
.mxpd-upload__preview {
  width: 120px; height: 72px; object-fit: cover; border-radius: 6px;
  background: var(--surface); border: 1px solid var(--border);
}
.mxpd-upload__preview--logo { width: 72px; height: 72px; }
.mxpd-upload__body { flex: 1; min-width: 0; }
.mxpd-upload input[type=file] {
  font-size: .82rem; font-family: var(--ff-body); margin: 0;
}
.mxpd-upload__hint { font-size: .875rem; color: var(--muted-strong); margin-top: .3rem; }
.mxpd-upload__clear {
  display: inline-block; margin-top: .35rem;
  background: transparent; border: none; padding: 0;
  font-family: var(--ff-body); font-size: .8rem;
  color: var(--danger); text-decoration: underline; cursor: pointer;
}
.mxpd-upload__clear:hover { color: #991b1b; }

/* ----- Login (mêmes tokens que dashboard, look unifié) ----- */
.mxpd-login { display: flex; justify-content: center; padding: .5rem 0 1.5rem; }
.mxpd-login__card {
  width: 100%; max-width: 420px; padding: 2rem;
  background: var(--card); border: 1px solid var(--border-strong); border-radius: 12px;
}
.mxpd-login__title {
  font-family: var(--ff-head); font-weight: 900; font-style: italic; text-transform: uppercase;
  color: var(--ink); margin: 0 0 .3rem;
  font-size: 2rem; line-height: 1; letter-spacing: -0.5px;
}
.mxpd-login__intro { font-size: 1.05rem; color: var(--muted-strong); margin: 0 0 1.4rem; line-height: 1.5; }
.mxpd-login label {
  display: block; font-size: 15px; letter-spacing: 1px; text-transform: uppercase;
  font-weight: 700; color: var(--muted-strong); margin-bottom: .6rem;
}
.mxpd-login input[type=email], .mxpd-login input[type=password] {
  width: 100%; margin-top: .35rem; padding: .9rem 1rem;
  border: 1.5px solid var(--border-strong); border-radius: 10px;
  font-size: 17px; background: #fff; color: var(--ink);
  font-family: var(--ff-body); letter-spacing: normal; text-transform: none; font-weight: 400;
}
.mxpd-login input:focus { outline: none; border-color: var(--mud); box-shadow: 0 0 0 3px rgba(181,114,74,.18); }
.mxpd-login button[type=submit] {
  width: 100%; margin-top: .4rem;
  height: 54px; border: none; border-radius: 12px;
  background: var(--mud); color: #fff;
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .5px; font-size: 17px;
  cursor: pointer; transition: background .15s;
}
.mxpd-login button[type=submit]:hover:not(:disabled) { background: var(--mud-deep); }
.mxpd-login button[type=submit]:disabled { opacity: .5; cursor: not-allowed; }
.mxpd-login__forgot {
  display: block; margin-top: 1rem; text-align: center; width: 100%;
  background: none; border: none; cursor: pointer;
  font-family: var(--ff-body); font-size: 1rem; color: var(--muted-strong);
  text-decoration: underline;
  min-height: 44px;
}

/* Bloc "Premier accès ? / Activer le dashboard" sous le form de login */
.mxpd-login__activation {
  margin-top: 1.5rem; padding-top: 1.2rem;
  border-top: 1px solid var(--border);
  text-align: center;
}
.mxpd-login__activation-eyebrow {
  font-family: var(--ff-body); font-weight: 700;
  font-size: 14px; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--muted-strong); margin: 0 0 .4rem;
}
.mxpd-login__activation-text {
  font-size: 1rem; color: var(--ink); margin: 0; line-height: 1.5;
}
.mxpd-login__activation-link {
  display: inline-block; margin-top: .5rem;
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .5px; font-size: 15px;
  color: var(--mud); text-decoration: none;
  border-bottom: 2px solid var(--mud);
  padding-bottom: 1px;
}
.mxpd-login__activation-link:hover {
  color: var(--mud-deep); border-bottom-color: var(--mud-deep);
}

/* ----- Stub / Loading ----- */
.mxpd-stub {
  padding: 3rem 1.5rem; background: var(--card); border: 1px solid var(--border);
  border-radius: 10px; text-align: center; color: var(--muted-strong); font-style: italic;
}
.mxpd-loading { padding: 2rem; text-align: center; color: var(--muted-strong); font-size: .95rem; }

/* ============================================================
 * Onglet TERRAINS — liste + éditeur + map
 * ============================================================ */
.mxpd-toolbar {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; margin: 0 0 1.5rem;
}

/* ----- Grid de cards ----- */
.mxpd-terrains-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
}
.mxpd-terrain-card {
  display: flex; flex-direction: column; gap: 0;
  background: var(--card); border: 1px solid var(--border-strong);
  border-radius: 12px; overflow: hidden; cursor: pointer;
  text-align: left; padding: 0; font-family: inherit;
  transition: border-color .15s, transform .08s, box-shadow .15s;
}
.mxpd-terrain-card:hover {
  border-color: var(--mud); transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(45,74,30,.12);
}
.mxpd-terrain-card__thumb {
  height: 120px; background: var(--surface) center/cover no-repeat;
  display: flex; align-items: center; justify-content: center;
  color: var(--mud); font-size: 2rem;
}
.mxpd-terrain-card__body { padding: .85rem 1rem 1rem; }
.mxpd-terrain-card__title {
  font-family: var(--ff-head); font-weight: 900; font-style: italic;
  text-transform: uppercase; color: var(--ink); font-size: 1.2rem;
  line-height: 1.1; letter-spacing: -0.3px; margin-bottom: .4rem;
}
.mxpd-terrain-card__meta {
  display: flex; gap: .4rem; flex-wrap: wrap; align-items: center;
  font-size: .875rem; color: var(--muted-strong);
}

.mxpd-pill {
  display: inline-block; padding: 2px 8px; border-radius: 999px;
  background: var(--surface) !important; color: var(--ink) !important;
  font-family: var(--ff-body); font-weight: 700; font-size: 9.5px;
  letter-spacing: .3px; text-transform: uppercase;
}
.mxpd-pill--ok   { background: rgba(22,163,74,.15) !important; color: #166534 !important; }
.mxpd-pill--warn { background: rgba(220,38,38,.12) !important; color: var(--danger) !important; }
/* Variant action (bouton cliquable) : utilisé pour « Présences » / « Confirmer ».
   Sépare volontairement du badge décoratif .mxpd-pill (9.5px) — ceci est un
   vrai bouton d'action fréquent, pas une étiquette. */
button.mxpd-pill.mxpd-pill--act,
.mxpd-pill--act {
  background: var(--mud) !important; color: #fff !important;
  border: none; cursor: pointer; font-family: var(--ff-body);
  padding: 10px 16px; font-size: 14px !important; font-weight: 700;
  min-height: 40px;
}
button.mxpd-pill.mxpd-pill--act:hover:not(:disabled) {
  background: var(--mud-deep) !important;
}
button.mxpd-pill.mxpd-pill--act:disabled { opacity: .6; cursor: wait; }

/* ─── Modal Présences (check-in club côté web) — refonte design ──── */
/* IMPORTANT : le modal est appendé à document.body (hors scope
   .mxpass-dashboard), donc les var(--xxx) ne résolvent PAS ici.
   On utilise les valeurs directes pour toutes les couleurs. */
.mxpd-presences-backdrop {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0, 0, 0, 0.12);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  animation: mxpd-fade-in .18s ease-out;
}
@keyframes mxpd-fade-in { from { opacity: 0 } to { opacity: 1 } }

.mxpd-presences-sheet {
  background: #faf7f0 !important; /* card opaque — sinon transparent vu */
  color: #1a1208;
  border-radius: 20px;
  max-width: 540px; width: 100%; max-height: 85vh;
  display: flex; flex-direction: column;
  border: 1px solid rgba(26,18,8,0.14);
  box-shadow: 0 24px 48px rgba(0,0,0,0.22), 0 4px 12px rgba(0,0,0,0.10);
  overflow: hidden;
  animation: mxpd-slide-up .22s cubic-bezier(.16,1,.3,1);
  font-family: Inter, system-ui, -apple-system, sans-serif;
}
@keyframes mxpd-slide-up {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* Tous les enfants du modal : valeurs directes, pas de var(--xxx)
   (hors scope .mxpass-dashboard). */
.mxpd-presences-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 22px 24px 18px; border-bottom: 1px solid rgba(26,18,8,0.08);
  gap: 12px;
  background: linear-gradient(180deg, rgba(181,114,74,.04) 0%, transparent 100%);
}
.mxpd-presences-title {
  font-family: "Barlow Condensed", "Barlow", "Arial Narrow", sans-serif;
  font-weight: 900; font-style: italic;
  text-transform: uppercase; color: #1a1208 !important;
  font-size: 1.7rem; line-height: 1; letter-spacing: -0.6px;
  padding-right: 6px;
}
.mxpd-presences-date {
  color: #6e5f4c !important; font-size: 1.05rem;
  margin-top: 6px; font-weight: 500;
}
.mxpd-presences-counter {
  display: inline-block;
  margin-top: 10px; padding: 6px 14px;
  background: #b5724a !important; color: #fff !important;
  border-radius: 999px;
  font-size: .9rem; font-weight: 800; letter-spacing: .4px;
  text-transform: uppercase;
}
.mxpd-presences-close {
  width: 44px; height: 44px; border-radius: 999px;
  background: rgba(0,0,0,.04) !important; border: none; cursor: pointer;
  font-size: 1.15rem; color: #6e5f4c !important; padding: 0;
  line-height: 1; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: background .15s, color .15s;
}
.mxpd-presences-close:hover {
  background: rgba(0,0,0,.08) !important; color: #1a1208 !important;
}
.mxpd-presences-body {
  flex: 1; overflow-y: auto; padding: 6px 0 8px;
  background: #faf7f0;
}
.mxpd-presences-loading {
  padding: 30px 18px; text-align: center;
  color: #6e5f4c !important; font-size: .95rem;
}
.mxpd-presences-empty {
  padding: 40px 18px; text-align: center;
  color: #6e5f4c !important; font-size: .95rem;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
}
.mxpd-presences-empty-emoji { font-size: 2.4rem; }

.mxpd-presences-row {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 24px;
  border-bottom: 1px solid rgba(26,18,8,0.08);
  transition: background .12s;
}
.mxpd-presences-row:hover { background: rgba(0,0,0,.015); }
.mxpd-presences-row:last-child { border-bottom: none; }
.mxpd-presences-avatar {
  width: 48px; height: 48px; border-radius: 999px;
  background: #e8e0d0; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: "Barlow Condensed", "Barlow", sans-serif;
  font-weight: 900; font-style: italic;
  color: #b5724a; font-size: 1.15rem;
  overflow: hidden;
  border: 1.5px solid rgba(26,18,8,0.14);
}
.mxpd-presences-avatar img { width: 100%; height: 100%; object-fit: cover; }
.mxpd-presences-name {
  flex: 1; min-width: 0;
  color: #1a1208 !important; font-weight: 700; font-size: 1.1rem;
}
.mxpd-presences-status {
  display: inline-flex; align-items: center;
  padding: 8px 14px; border-radius: 999px;
  font-size: .9rem; font-weight: 700; letter-spacing: .3px;
  text-transform: uppercase;
  min-height: 36px;
}
.mxpd-presences-status--ok {
  background: rgba(22,163,74,.15) !important; color: #166534 !important;
}
.mxpd-presences-status--cancel {
  background: rgba(220,38,38,.10) !important; color: #dc2626 !important;
}
button.mxpd-presences-status--clickable {
  border: none; cursor: pointer;
  font-family: Inter, system-ui, -apple-system, sans-serif;
  transition: background .15s, color .15s, text-decoration-color .15s;
  text-decoration: line-through transparent;
}
button.mxpd-presences-status--clickable:hover:not(:disabled) {
  background: rgba(220,38,38,.12) !important; color: #dc2626 !important;
  text-decoration: line-through #dc2626;
}
button.mxpd-presences-status--clickable:disabled { opacity: .6; cursor: wait; }
.mxpd-presences-confirm {
  border: none; cursor: pointer; padding: 10px 18px; border-radius: 999px;
  background: #b5724a !important; color: #fff !important;
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-weight: 700; font-size: .95rem;
  letter-spacing: .2px; transition: background .15s, transform .08s;
  min-height: 44px;
}
.mxpd-presences-confirm:hover:not(:disabled) {
  background: #9a5d39 !important; transform: translateY(-1px);
}
.mxpd-presences-confirm:active:not(:disabled) { transform: translateY(0); }
.mxpd-presences-confirm:disabled { opacity: .6; cursor: wait; }

/* ----- Form section divider ----- */
.mxpd-form__section {
  font-family: var(--ff-head); font-weight: 900; font-style: italic;
  text-transform: uppercase; letter-spacing: -0.2px; color: var(--ink);
  font-size: 1.05rem; margin: 1rem 0 .2rem;
  padding-top: 1rem; border-top: 1px solid var(--border);
}
.mxpd-form__section:first-of-type { border-top: none; padding-top: 0; margin-top: 0; }

/* ----- Select ----- */
.mxpd-form select {
  width: 100%; margin-top: .35rem; padding: .9rem 1rem;
  border: 1.5px solid var(--border-strong); border-radius: 10px;
  font-size: 17px; background: var(--card); color: var(--ink);
  font-family: var(--ff-body); letter-spacing: normal; text-transform: none; font-weight: 400;
}
.mxpd-form select:focus { outline: none; border-color: var(--mud); box-shadow: 0 0 0 3px rgba(181,114,74,.18); }

/* ----- Checkbox grid (services) ----- */
.mxpd-checks-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: .6rem;
}
.mxpd-check {
  display: flex; align-items: center; gap: .6rem;
  padding: .8rem .9rem; background: var(--card); border: 1px solid var(--border);
  border-radius: 10px; cursor: pointer;
  font-size: 1rem !important; font-weight: 600 !important;
  text-transform: none !important; letter-spacing: normal !important;
  color: var(--ink) !important;
  margin: 0 !important;
}
.mxpd-check input { margin: 0; width: 20px; height: 20px; }

/* ----- Map toolbar ----- */
.mxpd-map-toolbar {
  display: flex; gap: 1rem; flex-wrap: wrap; align-items: stretch;
  margin-bottom: .75rem;
}
.mxpd-map-toolbar__modes {
  display: flex; gap: .5rem; flex-wrap: wrap;
}
.mxpd-map-mode {
  display: flex; flex-direction: column; align-items: flex-start;
  background: var(--card); border: 1.5px solid var(--border-strong);
  border-radius: 10px; padding: .55rem .8rem;
  cursor: pointer; font-family: var(--ff-body); color: var(--ink);
  transition: border-color .15s, background .15s;
}
.mxpd-map-mode:hover { border-color: var(--mud); }
.mxpd-map-mode.is-active { border-color: var(--mud); background: rgba(181,114,74,.08); }
.mxpd-map-mode strong {
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .3px; font-size: 12px;
}
.mxpd-map-mode small { font-size: 11px; color: var(--muted); margin-top: 2px; }
.mxpd-map-toolbar__actions {
  display: flex; gap: .4rem; flex-wrap: wrap; align-items: center;
  margin-left: auto;
}
.mxpd-map-toolbar__actions .mxpd-btn { height: 48px; padding: 0 1.1rem; font-size: 14px; }
.mxpd-map-toolbar__actions .mxpd-btn:disabled {
  opacity: .4; cursor: not-allowed; pointer-events: none;
}

/* Status bar : compteur points + longueur + badge "boucle fermée" */
.mxpd-map-status {
  display: flex; align-items: center; gap: .4rem;
  padding: .55rem .9rem;
  background: var(--card); border: 1.5px solid var(--border-strong);
  border-radius: 10px;
  font-family: var(--ff-body); font-size: 13px; color: var(--ink);
}
.mxpd-map-status strong {
  font-family: var(--ff-head); font-weight: 900; font-style: italic;
  font-size: 16px; color: var(--mud); letter-spacing: -0.3px;
}
.mxpd-map-status__sep {
  color: var(--muted); margin: 0 .2rem;
}
.mxpd-map-status__closed {
  color: var(--forest); font-weight: 600; font-size: 12px;
  display: none;
}

/* ----- Map ----- */
.mxpd-map {
  height: 480px; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--border-strong); background: var(--surface);
}
@media (max-width: 720px) { .mxpd-map { height: 360px; } }
.mxpd-map-hint {
  font-size: .875rem; color: var(--muted-strong); margin: .6rem 0 0;
}

.mxpd-btn--danger {
  color: var(--danger); border-color: var(--danger);
}
.mxpd-btn--danger:hover:not(:disabled) {
  background: rgba(220,38,38,.08); color: var(--danger);
}

/* ============================================================
 * Onglet PLANNING — rows
 * ============================================================ */
.mxpd-subhead {
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: -0.2px; color: var(--muted-strong);
  font-size: 1rem; margin: 1.4rem 0 .6rem;
}
.mxpd-rows { display: flex; flex-direction: column; gap: .5rem; }
.mxpd-rows--past { opacity: .65; }
.mxpd-row {
  display: flex; align-items: center; gap: 1rem;
  padding: .85rem 1rem; background: var(--card);
  border: 1px solid var(--border-strong); border-radius: 10px;
  text-align: left; cursor: pointer; font-family: inherit;
  transition: border-color .15s, transform .08s;
}
.mxpd-row:hover { border-color: var(--mud); transform: translateX(2px); }
.mxpd-row--draft { border-left: 3px solid var(--danger); }
.mxpd-row__main { flex: 1; min-width: 0; }
.mxpd-row__title {
  font-family: var(--ff-head); font-weight: 900; font-style: italic;
  text-transform: uppercase; color: var(--ink) !important; font-size: 1.05rem;
  line-height: 1.1; letter-spacing: -0.2px; margin-bottom: .25rem;
}
/* !important sur color: les thèmes WP (Kadence, certains dark themes)
   imposaient parfois color: white sur les éléments génériques → date/heure
   illisibles (blanc sur fond cream). On force la couleur muted ici. */
.mxpd-row__meta { color: var(--muted-strong) !important; font-size: .9rem; }
.mxpd-row__side {
  display: flex; gap: .35rem; flex-wrap: wrap; align-items: center;
  flex-shrink: 0; justify-content: flex-end;
}
@media (max-width: 640px) {
  .mxpd-row { flex-direction: column; align-items: flex-start; }
  .mxpd-row__side { justify-content: flex-start; }
}

/* ============================================================
 * Onglet EVENTS — cards
 * ============================================================ */
.mxpd-events-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
}
.mxpd-events-grid--past { opacity: .65; }
.mxpd-event-card {
  display: flex; flex-direction: column;
  background: var(--card); border: 1px solid var(--border-strong);
  border-radius: 12px; overflow: hidden; cursor: pointer;
  text-align: left; padding: 0; font-family: inherit;
  transition: border-color .15s, transform .08s, box-shadow .15s;
}
.mxpd-event-card:hover {
  border-color: var(--mud); transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(45,74,30,.12);
}
.mxpd-event-card__cover {
  height: 140px; background: var(--surface) center/cover no-repeat;
}
.mxpd-event-card__body { padding: .85rem 1rem 1rem; }
.mxpd-event-card__date {
  font-family: var(--ff-body); font-weight: 700; font-size: 13px;
  letter-spacing: 1.2px; text-transform: uppercase; color: var(--mud);
  margin-bottom: .3rem;
}
.mxpd-event-card__title {
  font-family: var(--ff-head); font-weight: 900; font-style: italic;
  text-transform: uppercase; color: var(--ink); font-size: 1.2rem;
  line-height: 1.1; letter-spacing: -0.2px; margin-bottom: .5rem;
}
.mxpd-event-card__meta {
  display: flex; gap: .35rem; flex-wrap: wrap;
}

/* ============================================================
 * Programme repeater
 * ============================================================ */
.mxpd-prog { display: flex; flex-direction: column; gap: .4rem; }
.mxpd-prog__row {
  display: grid; grid-template-columns: 90px 1fr 1fr auto auto;
  gap: .5rem; align-items: center;
  padding: .5rem; background: var(--card); border: 1px solid var(--border);
  border-radius: 8px;
}
@media (max-width: 720px) {
  .mxpd-prog__row { grid-template-columns: 80px 1fr; }
  .mxpd-prog__row > :nth-child(n+3) { grid-column: 1 / -1; }
}
.mxpd-prog__row input[type=text] {
  width: 100%; padding: .45rem .6rem; border: 1px solid var(--border-strong);
  border-radius: 6px; font-size: .9rem; font-family: var(--ff-body);
  background: #fff; color: var(--ink); margin: 0;
  letter-spacing: normal; text-transform: none; font-weight: 400;
}
.mxpd-prog__row input:focus { outline: none; border-color: var(--mud); }
.mxpd-prog__del {
  background: transparent; border: none; cursor: pointer;
  color: var(--danger); font-size: 1.4rem; padding: 0 .4rem; line-height: 1;
}
.mxpd-prog__del:hover { color: #991b1b; }

/* Hint box (info bleue claire dans le form) */
.mxpd-hint {
  background: rgba(181,114,74,.08); border-left: 3px solid var(--mud);
  padding: .85rem 1rem; border-radius: 8px;
  font-size: 1rem; color: var(--ink); margin: 0; line-height: 1.5;
}

/* ============================================================
 * Onglet PHOTOS — sub-tabs + galerie
 * ============================================================ */
.mxpd-subtabs {
  display: flex; gap: .3rem; flex-wrap: wrap; margin-bottom: 1rem;
  padding: .3rem; background: var(--card); border-radius: 10px;
  border: 1px solid var(--border-strong);
}
.mxpd-subtab {
  background: transparent; border: none; cursor: pointer;
  padding: .8rem 1.1rem; border-radius: 8px;
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .3px; font-size: 14px;
  color: var(--muted-strong); transition: background .15s, color .15s;
  min-height: 44px;
}
.mxpd-subtab:hover { color: var(--ink); background: rgba(181,114,74,.06); }
.mxpd-subtab.is-active { background: var(--mud); color: #fff; }

.mxpd-gallery-wrap { margin-top: 1rem; }
.mxpd-gallery {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: .8rem;
}
.mxpd-gal__item {
  position: relative; background: var(--card); border: 1px solid var(--border-strong);
  border-radius: 10px; overflow: hidden;
}
.mxpd-gal__img {
  width: 100%; aspect-ratio: 4/3; background: var(--surface) center/cover no-repeat;
}
.mxpd-gal__controls {
  display: flex; gap: 2px; padding: 4px; background: rgba(26,18,8,.92);
}
.mxpd-gal__btn {
  flex: 1; background: transparent; border: none; cursor: pointer;
  color: #f2ece0; padding: 14px 6px; font-size: 14px; border-radius: 4px;
  transition: background .15s;
}
.mxpd-gal__btn:hover { background: rgba(255,255,255,.15); }
.mxpd-gal__btn--danger:hover { background: rgba(220,38,38,.45); }

/* Lightbox */
.mxpd-lightbox {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.85); display: flex; align-items: center; justify-content: center;
  padding: 2rem; cursor: zoom-out;
}
.mxpd-lightbox img {
  max-width: 100%; max-height: 100%; object-fit: contain;
  border-radius: 8px; box-shadow: 0 12px 60px rgba(0,0,0,.6);
}
.mxpd-lightbox__close {
  position: absolute; top: 20px; right: 24px;
  background: transparent; border: none; color: #fff;
  font-size: 2.4rem; line-height: 1; cursor: pointer; padding: 8px 16px;
}

/* ============================================================
 * Onglet BROADCAST
 * ============================================================ */
.mxpd-form--broadcast textarea { min-height: 130px; }
.mxpd-row--readonly { cursor: default; }
.mxpd-row--readonly:hover { border-color: var(--border-strong); transform: none; }

/* ============================================================
 * Onglet STATS — KPI cards + contribs
 * ============================================================ */
.mxpd-kpis {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem; margin-bottom: 1.5rem;
}
.mxpd-kpi {
  padding: 1.4rem 1.2rem;
  background: var(--card); border: 1px solid var(--border-strong);
  border-radius: 12px; text-align: left;
  position: relative; overflow: hidden;
}
.mxpd-kpi::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--mud);
}
.mxpd-kpi__value {
  font-family: var(--ff-head); font-weight: 900; font-style: italic;
  font-size: 3rem; line-height: 1; color: var(--ink);
  letter-spacing: -1px;
}
.mxpd-kpi__label {
  margin-top: .4rem;
  font-family: var(--ff-body); font-weight: 700;
  font-size: 15px; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--muted-strong);
}

.mxpd-row--contrib { align-items: flex-start; }
.mxpd-row--contrib .mxpd-row__side { flex-direction: column; gap: .4rem; align-items: stretch; }
.mxpd-row--contrib .mxpd-btn { height: 48px; padding: 0 1rem; font-size: 13px; }

/* ── Hours editor (7 jours × plages HH:MM) ────────────────────────────── */
.mxpd-hours-wrap { display: flex; flex-direction: column; gap: .5rem; }
.mxpd-hours-lbl {
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: 1.2px; font-size: 15px;
  color: var(--muted-strong);
}
.mxpd-hours-editor {
  background: var(--card);
  border: 1px solid var(--border-strong);
  border-radius: 14px;
  padding: 1rem;
  display: flex; flex-direction: column; gap: 1rem;
}

/* Quick-presets bar (Lun-Ven / Week-end / Tous / Vider) */
.mxpd-hours-presets {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
  padding: .35rem .25rem .85rem;
  border-bottom: 1px solid var(--border-strong);
}
.mxpd-hours-presets__count {
  font-family: var(--ff-body); font-size: 15px; color: var(--muted-strong);
}
.mxpd-hours-presets__count strong {
  color: var(--mud); font-weight: 800; font-family: var(--ff-head);
  font-style: italic; font-size: 18px; margin-right: 2px;
}
.mxpd-hours-presets__btns {
  display: flex; gap: .4rem; flex-wrap: wrap;
}
.mxpd-hours-preset {
  background: var(--bg);
  border: 1px solid var(--border-strong);
  color: var(--ink);
  padding: 10px 16px;
  border-radius: 999px;
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .3px; font-size: 13px;
  cursor: pointer;
  transition: all .15s ease;
  min-height: 44px;
}
.mxpd-hours-preset:hover {
  background: var(--mud); color: #fff; border-color: var(--mud);
}
.mxpd-hours-preset--ghost {
  color: var(--muted-strong); border-style: dashed;
}
.mxpd-hours-preset--ghost:hover {
  background: rgba(0,0,0,.05); color: var(--ink);
  border-color: var(--muted); border-style: solid;
}

/* Jours en cards */
.mxpd-hours-days {
  display: flex; flex-direction: column; gap: .5rem;
}
.mxpd-hours-day {
  display: flex; flex-direction: column; gap: .6rem;
  padding: .85rem 1rem;
  background: var(--bg);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  transition: all .18s ease;
}
.mxpd-hours-day:not(.is-closed) {
  background: #fff;
  border-color: rgba(181, 114, 74, .35);
  box-shadow: 0 2px 10px -4px rgba(181, 114, 74, .15);
}
.mxpd-hours-day.is-closed { opacity: .7; }
.mxpd-hours-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: .8rem;
}
.mxpd-hours-day-lbl {
  font-family: var(--ff-head); font-weight: 800; font-style: italic;
  text-transform: uppercase; letter-spacing: .3px;
  font-size: 15px; color: var(--ink);
}
.mxpd-hours-day.is-closed .mxpd-hours-day-lbl { color: var(--muted-strong); }
.mxpd-hours-day-right {
  display: flex; align-items: center; gap: .65rem;
}

/* Badge état (Ouvert/Fermé) */
.mxpd-hours-state {
  font-family: var(--ff-body); font-weight: 700;
  font-size: 13px; letter-spacing: .4px; text-transform: uppercase;
  color: var(--muted-strong);
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(0,0,0,.04);
}
.mxpd-hours-state.is-open {
  color: var(--forest);
  background: rgba(61, 107, 40, .12);
}

/* Switch iOS-like */
.mxpd-hours-switch {
  position: relative;
  display: inline-block;
  width: 38px; height: 22px;
  cursor: pointer;
  flex-shrink: 0;
}
.mxpd-hours-switch input[type=checkbox] {
  position: absolute; opacity: 0; width: 0; height: 0;
}
.mxpd-hours-switch__slider {
  position: absolute; inset: 0;
  background: #d4ccba;
  border-radius: 999px;
  transition: background-color .18s ease;
}
.mxpd-hours-switch__slider::before {
  content: ''; position: absolute;
  width: 16px; height: 16px;
  left: 3px; top: 3px;
  background: #fff;
  border-radius: 50%;
  transition: transform .18s ease;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.mxpd-hours-switch input[type=checkbox]:checked + .mxpd-hours-switch__slider {
  background: var(--mud);
}
.mxpd-hours-switch input[type=checkbox]:checked + .mxpd-hours-switch__slider::before {
  transform: translateX(16px);
}
.mxpd-hours-switch input[type=checkbox]:focus-visible + .mxpd-hours-switch__slider {
  outline: 2px solid var(--mud); outline-offset: 2px;
}

/* Bouton "Copier ↓" */
.mxpd-hours-copy {
  background: rgba(181, 114, 74, .10);
  color: var(--mud);
  border: none;
  padding: 5px 12px;
  border-radius: 999px;
  font-family: var(--ff-body);
  font-size: 11px; font-weight: 700;
  letter-spacing: .2px;
  cursor: pointer;
  transition: background-color .15s ease;
}
.mxpd-hours-copy:hover { background: rgba(181, 114, 74, .22); }

/* Plages horaires */
.mxpd-hours-ranges {
  display: flex; flex-direction: column; gap: .5rem;
  padding-top: .15rem;
}
.mxpd-hours-range {
  display: flex; align-items: center;
  gap: .6rem;
  padding: .35rem .55rem;
  background: var(--bg);
  border-radius: 8px;
}
.mxpd-hours-range input[type=time] {
  padding: 10px 12px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  font-size: 16px;
  font-family: var(--ff-body); font-weight: 600;
  color: var(--ink);
  background: #fff;
  min-width: 110px;
  min-height: 44px;
}
.mxpd-hours-range input[type=time]:focus {
  outline: none; border-color: var(--mud);
  box-shadow: 0 0 0 3px rgba(181, 114, 74, .18);
}
.mxpd-hours-dash {
  color: var(--muted); font-weight: 700; font-size: 14px;
}
.mxpd-hours-remove {
  background: transparent;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  width: 26px; height: 26px;
  font-size: 12px;
  color: var(--muted);
  cursor: pointer;
  margin-left: auto;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s ease;
}
.mxpd-hours-remove:hover {
  color: #fff; background: var(--muted); border-color: var(--muted);
}
.mxpd-hours-add {
  background: none;
  border: 1px dashed var(--border-strong);
  color: var(--mud);
  font-family: var(--ff-body); font-weight: 700;
  font-size: 14px;
  padding: 10px 14px;
  border-radius: 8px;
  cursor: pointer;
  align-self: flex-start;
  transition: all .15s ease;
  min-height: 44px;
}
.mxpd-hours-add:hover {
  background: rgba(181, 114, 74, .08);
  border-color: var(--mud);
  border-style: solid;
}

/* Hint cliquable quand le jour est fermé : remplace l'ancien texte
   "Fermé" italique gris (redondant avec le badge + switch). */
.mxpd-hours-open-hint {
  background: transparent;
  border: 1px dashed var(--border-strong);
  color: var(--muted-strong);
  font-family: var(--ff-body); font-weight: 600;
  font-size: 13px;
  padding: 8px 12px;
  border-radius: 8px;
  cursor: pointer;
  align-self: flex-start;
  transition: all .15s ease;
}
.mxpd-hours-open-hint:hover {
  background: rgba(181, 114, 74, .08);
  border-color: var(--mud);
  color: var(--mud);
  border-style: solid;
}

/* Responsive : sur mobile, presets + jours s'empilent et toggle reste à droite */
@media (max-width: 600px) {
  .mxpd-hours-presets { flex-direction: column; align-items: flex-start; }
  .mxpd-hours-presets__btns { width: 100%; }
  .mxpd-hours-preset { flex: 1; min-width: 0; text-align: center; }
}

/* ── Licence requise : liste à choix fixes (remplace le texte libre) ──── */
.mxpd-radio-group { display: flex; flex-direction: column; gap: .5rem; }
.mxpd-radio-row {
  display: flex; align-items: center; gap: .8rem;
  padding: .9rem 1rem; border-radius: 10px;
  border: 1.5px solid var(--border-strong); background: var(--card);
  cursor: pointer; font-size: 16px; color: var(--ink);
  min-height: 48px;
}
.mxpd-radio-row.is-on { border-color: var(--mud); background: rgba(181, 114, 74, .08); font-weight: 600; }
.mxpd-radio-row input[type="radio"] { accent-color: var(--mud); width: 20px; height: 20px; flex-shrink: 0; }

/* ── Catégories événement : chips à cocher (remplace la saisie CSV) ───── */
.mxpd-chip-group { display: flex; flex-wrap: wrap; gap: .5rem; }
.mxpd-chip-toggle {
  padding: 12px 18px; border-radius: 999px;
  border: 1.5px solid var(--border-strong); background: var(--card);
  font-family: var(--ff-body); font-weight: 600; font-size: 15px;
  color: var(--muted-strong); cursor: pointer; transition: all .15s ease;
  min-height: 44px;
}
.mxpd-chip-toggle.is-on { border-color: var(--mud); background: var(--mud); color: #fff; }

/* ── Emplacement événement : mini-carte à un point (remplace lat/lng en texte libre) ── */
.mxpd-event-map { height: 320px; border-radius: 10px; overflow: hidden; border: 1px solid var(--border-strong); margin-top: .5rem; }