/* Container unifié (v4.0.15) : 1400px partout (dashboard, settings, header, footer) */
.wrap{max-width:1400px;margin:0 auto;padding:0 var(--sp-6);box-sizing:border-box;}

/*
 * POA 2026 — Shared Styles
 * Included by: inscription.php, edit.php, dashboard.php, settings.php, programme.php, mentions-legales.php
 * Source de vérité : refonte design v3.5.70 (boutons Inter 13px sentence case, radius 6px).
 * Composants mutualisés : form (fieldset, section-title, req, hero-desc), day-block, toggle-switch,
 * file-input, artiste-block. Les pages ne doivent PAS re-déclarer ces sélecteurs localement.
 */

/* === CSS Custom Properties === */
:root {
  --accent:#B23A2A; --accent-dark:#902818; --accent-ring:rgba(178,58,42,.25); --accent-soft:rgba(178,58,42,.05); --accent-mid:rgba(178,58,42,.08);
  --radius-card:10px; --radius-badge:6px; --radius-dialog:10px;
  --overlay:rgba(17,17,16,.4); --overlay-strong:rgba(17,17,16,.85);
  --ink:#1A1917; --ink-soft:#6E6C66; --ink-faint:#76746D;
  --surface:#FFFFFF; --surface-muted:#FAFAF9; --line:#DDDBD3; --line-soft:#E8E6DF;
  --bg:#F7F6F3;--green-bg:#E6F4EA;--green:#1B7A3D;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:72px; --sp-10:80px; --sp-12:96px;
  --font:'Inter',system-ui,-apple-system,sans-serif;
  --font-mono:'IBM Plex Mono',monospace;
  --font-display:'Space Grotesk',sans-serif;
}

/* === Reset === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{font-family:var(--font);font-size:var(--size-p,15px);line-height:1.6;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;}

/* === Typography === */
h1,h2,h3{font-family:var(--font-display);font-weight:700;line-height:1.2;color:var(--ink);}
h1{font-size:clamp(28px,5vw,40px);letter-spacing:-.02em;}
h2{font-size:20px;letter-spacing:-.01em;margin:var(--sp-7) 0 var(--sp-4);}
h3{font-size:16px;margin:var(--sp-5) 0 var(--sp-3);}

/* === Sticky footer === */
html,body{height:100%;}
.wrap{min-height:100vh;display:flex;flex-direction:column;}
footer{margin-top:auto;}
.signature{font-family:var(--font-mono);font-size:11px;color:var(--ink-soft);padding:var(--sp-4) 0 var(--sp-3);text-align:center;}
.signature a{color:var(--ink-soft);}

/* === Common form elements === */
label{display:block;font-family:var(--font);font-size:13px;font-weight:500;letter-spacing:.01em;text-transform:none;color:var(--ink-soft);margin-bottom:var(--sp-1);}
.field, .panel-field{margin-bottom:var(--sp-3);}
.field label{display:block;font-family:var(--font);font-size:13px;font-weight:500;letter-spacing:.01em;text-transform:none;color:var(--ink-soft);margin-bottom:var(--sp-1);}
.section-title{margin:0 0 var(--sp-5);font-family:var(--font-display);font-weight:600;font-size:var(--size-h3,21px);line-height:1.25;letter-spacing:-.005em;color:var(--ink);}
fieldset{border:none;margin:0;padding:var(--sp-7) 0;border-top:1px solid var(--line);}
fieldset:first-of-type{border-top:none;padding-top:0;}
.req{display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--accent);margin-left:5px;vertical-align:middle;}
.hero-desc{font-size:15px;line-height:1.6;color:var(--ink-soft);margin:var(--sp-3) 0 0;max-width:44ch;}

input, textarea, select{font-family:var(--font);font-size:15px;color:var(--ink);background:var(--surface);border:1px solid var(--line);padding:8px var(--sp-3);width:100%;transition:border-color .12s ease,box-shadow .12s ease;}
input:focus, textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);}
input:hover, textarea:hover{border-color:#C7C4B8;}
::placeholder{color:var(--ink-faint);}
input[type=date],input[type=time]{accent-color:var(--accent);}
/* Dropdowns (select) — flèche DESSINÉE : appearance:none retire la flèche native ;
   sans remplacement, le select ne ressemble plus à un select (direction 2026-08-07).
   Règle centralisée : profite à TOUS les selects (programme, settings, edit). */
select{
  -webkit-appearance:none;appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5' fill='none' stroke='%236E6C66' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:12px;
  padding-right:32px;
}
select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);}
/* Sélecteurs compacts de la barre de filtres (programme) — même flèche, gabarit serré */
select.filter-select{font-family:var(--font-mono);font-size:13px;letter-spacing:.02em;padding:8px 32px 8px var(--sp-3);border-radius:0;}
/* Sélecteurs compacts de réglages (settings) — même flèche, taille réduite.
   PAS de background en shorthand ici : il écraserait la flèche de la règle select. */
select.select-compact{font-size:12px;width:auto;min-width:150px;}

/* === Buttons === */
.btn{font-family:var(--font);font-size:13px;font-weight:500;letter-spacing:.01em;text-transform:none;padding:12px var(--sp-4);white-space:nowrap;cursor:pointer;border:1px solid var(--line-soft);background:transparent;color:var(--ink-soft);border-radius:6px;transition:all .12s ease;text-decoration:none;display:inline-flex;align-items:center;gap:6px;justify-content:center;}
.btn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}
.ghost-btn{font-family:var(--font);font-size:13px;color:var(--ink-soft);background:none;border:1px solid var(--line-soft);padding:12px var(--sp-4);cursor:pointer;border-radius:6px;transition:all .12s ease;display:inline-flex;align-items:center;gap:6px;justify-content:center;}
.ghost-btn:hover{color:var(--accent);border-color:var(--accent);}
.primary{background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent);font-family:var(--font);font-size:13px;font-weight:500;letter-spacing:.02em;text-transform:none;padding:12px var(--sp-5);cursor:pointer;border-radius:6px;transition:all .12s ease;display:inline-flex;align-items:center;gap:6px;justify-content:center;}
.primary:hover{background:var(--accent-dark);}
.primary:disabled{opacity:.5;cursor:not-allowed;}
.remove-btn{font-family:var(--font);font-size:10px;color:var(--ink-soft);background:none;border:1px solid var(--line-soft);padding:2px 10px;cursor:pointer;border-radius:6px;transition:all .12s ease;}
.remove-btn:hover{color:var(--accent);border-color:var(--accent);}
/* Boutons de header unifiés : même hauteur (44px) partout (dashboard/settings/inscription) */
.site-header-actions .btn,
.site-header-actions .header-btn{
  height:44px;box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;
  padding:0 var(--sp-4);font-size:13px;line-height:1;
  text-decoration:none;
}
/* Header unifié v4.0.12 : titre + navigation sur une ligne, séparés du contenu */
.site-header{
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);
  padding:var(--sp-3) 0;margin-bottom:var(--sp-6);border-bottom:1px solid var(--line-soft);
  flex-wrap:wrap;
}
.site-header-title{margin:0;font-family:var(--font-display);font-size:18px;letter-spacing:-.005em;}
.site-header-sep{color:var(--ink-faint);font-weight:400;}
.site-header-actions{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;}
.site-header-divider{width:1px;height:20px;background:var(--line-soft);flex:none;margin:0 var(--sp-1);}
.site-header-user{font-size:12px;color:var(--ink-faint);font-family:var(--font-mono);white-space:nowrap;}
/* Labels longs ↔ courts (v4.0.46, R14) : le label court est masqué par
   défaut, les media queries mobiles basculent (ex : "Site public" → "Site").
   .lbl a une règle de base explicite (pattern complet). */
.lbl{display:inline;}
.lbl-short{display:none;}
.site-header-actions .header-nav-item{
  height:44px;box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;
  padding:0 var(--sp-3);font-size:13px;font-weight:500;color:var(--ink-soft);
  text-decoration:none;border-radius:6px;transition:all .12s ease;white-space:nowrap;
}
.site-header-actions .header-nav-item:hover{color:var(--accent);background:var(--accent-soft);}
.site-header-actions .header-nav-item.is-active{color:var(--accent);background:var(--accent-soft);cursor:default;font-weight:600;}

/* === Layout helpers === */
.row2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5);}

/* === Admin panels (settings.php + dashboard.php) === */
.panel-section{margin-bottom:var(--sp-4);padding:var(--sp-6);background:var(--surface);border:none;border-radius:10px;}
.panel-section:last-of-type{margin-bottom:0;}
.panel-section-title{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin:0 0 var(--sp-3);display:flex;align-items:center;gap:var(--sp-2);}
.panel-section-title::before{content:'';display:block;width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0;}
.panel-field:last-child{margin-bottom:0;}
.panel-label{display:block;font-family:var(--font);font-size:12px;font-weight:500;letter-spacing:.01em;text-transform:none;color:var(--ink-soft);margin-bottom:var(--sp-1);}

/* === Form components (mutualisés : inscription.php + edit.php + dashboard.php + shared.js) === */
.day-rows{display:flex;flex-direction:column;gap:var(--sp-3);margin-top:var(--sp-4);}
.day-block{display:flex;flex-direction:column;gap:4px;padding:var(--sp-6);margin-bottom:var(--sp-3);background:var(--surface);border:none;border-radius:10px;}
.day-block:first-child{margin-top:0;}
.day-name{font-family:var(--font-mono);font-size:11px;font-weight:500;color:var(--accent);letter-spacing:.04em;text-transform:uppercase;padding-bottom:var(--sp-4);}
.day-toggle{display:flex;align-items:center;gap:6px;font-size:14px;line-height:18px;cursor:pointer;padding-left:var(--sp-3);}
.day-toggle .toggle-switch{flex:none;align-self:center;}
.day-toggle-full{font-weight:500;color:var(--ink);margin-top:2px;}
.day-toggle input[type=time]{width:62px;padding:4px 0;font-size:14px;height:30px;line-height:1;border:1px solid var(--line);font-family:var(--font);text-align:center;background:var(--surface);vertical-align:middle;border-radius:2px;transition:border-color .12s ease,box-shadow .12s ease;accent-color:var(--accent);}
.day-toggle input[type=time]::selection{background:var(--accent);color:#fff;}
.day-toggle input[type=time]:focus{outline:none;box-shadow:0 0 0 2px var(--accent);}
.day-toggle input[type=time]:disabled{opacity:.35;pointer-events:none;}
.day-toggle input[type=time]:enabled{border-color:var(--accent);}
.time-hint{font-family:var(--font-mono);font-size:11px;line-height:1.3;letter-spacing:.02em;color:var(--accent);display:inline-flex;align-items:center;gap:4px;white-space:nowrap;margin-left:var(--sp-2);}
.time-hint[hidden]{display:none;}
.day-toggle input[type=time]::-webkit-calendar-picker-indicator{display:none;}

.toggle-switch{--ts-w:38px;--ts-h:22px;--ts-thumb:16px;--ts-gap:3px;position:relative;display:inline-block;width:var(--ts-w);height:var(--ts-h);flex:none;vertical-align:middle;}
.toggle-switch input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer;z-index:1;width:100%;height:100%;}
.toggle-track{position:absolute;inset:0;background:var(--line);border-radius:calc(var(--ts-h)/2);transition:background .15s ease;}
.toggle-thumb{position:absolute;top:var(--ts-gap);left:var(--ts-gap);width:var(--ts-thumb);height:var(--ts-thumb);border-radius:50%;background:var(--surface);transition:transform .15s ease;}
.toggle-switch input:checked ~ .toggle-track{background:var(--accent);}
.toggle-switch input:checked ~ .toggle-track .toggle-thumb{transform:translateX(calc(var(--ts-w) - var(--ts-thumb) - 2*var(--ts-gap)));}
.toggle-switch input:focus-visible ~ .toggle-track{outline:2px solid var(--accent);outline-offset:2px;}
/* Variante compacte (créneaux jours formulaire/édition/dashboard) */
.toggle-switch--sm{--ts-w:32px;--ts-h:18px;--ts-thumb:14px;--ts-gap:2px;}

input[type=file]{font-family:var(--font-mono);font-size:10px;color:var(--ink-faint);}
input[type=file]::file-selector-button{font-family:var(--font-mono);font-size:10px;padding:4px 10px;cursor:pointer;border:1px solid var(--accent);background:transparent;color:var(--accent);transition:all .12s ease;margin-right:8px;}
input[type=file]::file-selector-button:hover{background:var(--accent);color:#fff;}

.artiste-block{background:var(--surface);border:none;padding:var(--sp-6);margin-bottom:var(--sp-3);position:relative;border-radius:10px;}
.artiste-block:last-of-type{margin-bottom:var(--sp-3);}
.artiste-block-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-4);}
.artiste-block-num{font-family:var(--font-mono);font-size:11px;font-weight:500;color:var(--accent);letter-spacing:.04em;text-transform:uppercase;}
.artiste-block-remove{font-family:var(--font-mono);font-size:10px;padding:2px 8px;cursor:pointer;border:1px solid var(--line);background:var(--surface);color:var(--ink-faint);transition:all .12s ease;}
.artiste-block-remove:hover{border-color:var(--accent);color:var(--accent);}

/* === Dialog modal (shared: dashboard + settings + inscription) === */
.dialog-overlay{position:fixed;inset:0;z-index:3000;background:var(--overlay);display:flex;align-items:center;justify-content:center;padding:var(--sp-6);backdrop-filter:blur(var(--overlay-blur));-webkit-backdrop-filter:blur(var(--overlay-blur));}
.dialog-overlay[hidden]{display:none;}
.dialog-card{background:var(--surface);max-width:440px;width:100%;padding:var(--sp-6);border-radius:var(--radius-dialog);box-shadow:var(--shadow-dialog);border:var(--border-dialog);scrollbar-width:none;}
.dialog-card::-webkit-scrollbar{display:none;width:0;height:0;}
.dialog-msg{font-size:14px;line-height:1.5;margin:0 0 var(--sp-4);}
.dialog-input{width:100%;padding:8px var(--sp-3);font-size:14px;font-family:var(--font);border:1px solid var(--line);background:var(--surface);color:var(--ink);margin-bottom:var(--sp-3);box-sizing:border-box;}
.dialog-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);}
.dialog-error{color:var(--accent);font-size:12px;margin:0 0 var(--sp-3);}
.dialog-btns{display:flex;gap:var(--sp-3);justify-content:flex-end;}
.dialog-btns .btn{min-width:80px;text-align:center;}
.dialog-btns .primary-btn{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);}
.dialog-btns .primary-btn:hover{background:var(--accent-dark);}

/* === Error / Success messages === */
.error-msg{display:none;color:var(--accent);font-size:13px;margin-top:var(--sp-4);}
.confirm{text-align:center;padding:var(--sp-8) 0;}
.confirm h2{color:var(--accent);}

/* === Responsive mobile === */
/* Header mobile (v4.0.46, R3 Option A) : appliqué jusqu'à 700px pour
   couvrir la zone grise 561-700 (contenu admin déjà mobile à 700px).
   Mail + séparateur masqués ; croix Quitter en haut à droite (44×44) ;
   4 items sur UNE ligne, icône au-dessus du label, min-height 64px,
   flex:1 1 0 + min-width:0 (R2). */
@media (max-width:940px){
  /* v4.1.35 : header mobile DÉPLACÉ de 700 → 940 (expertise : rupture
     mesurée ~890-940px — titre 202 + 4 items 443 + logout 44 + email
     130-181 + gaps ; au-delà, wrap désordonné = « les alignements ne
     matchent pas »). 940 = langage commun du site (programme.php). */
  .site-header{flex-direction:column;align-items:stretch;gap:var(--sp-2);position:relative;}
  .site-header-title{min-height:44px;display:flex;align-items:center;padding-right:48px;}
  .site-header-actions{width:100%;gap:2px;}
  .site-header-divider{display:none;}
  .site-header-user{display:none;}
  .site-header-actions .header-nav-item{flex:1 1 0;min-width:0;flex-direction:column;justify-content:center;align-items:center;font-size:13px;padding:6px 2px;min-height:64px;display:flex;gap:2px;box-sizing:border-box;text-align:center;line-height:1.2;}
  .site-header-actions .header-nav-item i{font-size:22px;padding:4px 8px 10px;}
  .site-header-actions .header-btn{position:absolute;top:var(--sp-3);right:0;height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;padding:0;font-size:18px;}
}
/* v4.1.35 : filet — email très long ne casse jamais la ligne desktop */
.site-header-user{max-width:200px;overflow:hidden;text-overflow:ellipsis;}
@media (max-width:560px){
  body,input,textarea,select{font-size:16px;}
  .row2{grid-template-columns:1fr;}
  /* Wrap mobile (v4.0.33) : marge 20px au lieu de 24px — aère le contenu */
  .wrap{padding:0 20px;}
  /* v4.1.35 : day-toggle CENTRALISÉ ici (retiré de dashboard.php 700 et
     edit.php 560). Filet : ne se déclenche qu'à ≤360 réellement
     (« Journée complète » = 329px mesuré) → aucune régression 361-560. */
  .day-toggle{flex-wrap:wrap;gap:2px;}
  .day-toggle input[type=time]{width:56px;}
}
