/* ============================================================
   thomasmr.fr — style principal
   Thème jour/nuit : auto (prefers-color-scheme) + bouton manuel
   ============================================================ */

/* ── Variables ──────────────────────────────────────────────── */
:root {
  --blue:       #003e6a;
  --blue-hover: #00325a;
  --blue-light: #e8f0f7;
  --bg:         #ffffff;
  --bg-card:    #f5f8fb;
  --text:       #1a1a1a;
  --muted:      #666666;
  --border:     #e0e0e0;
  --btn-bg:     #003e6a;
  --btn-text:   #ffffff;
  --btn-hover:  #00325a;
  --footer-bg:  #ffffff;
  --footer-text:#999999;
  --modal-bg:   #ffffff;
  --modal-text: #333333;
  --font: 'Montserrat', sans-serif;
  --max:  900px;
}
@media (prefers-color-scheme: dark) { :root {
  --bg:         #0f1117;
  --bg-card:    #1c2130;
  --blue:       #2c73a7;
  --blue-hover: #7ab3e0;
  --blue-light: #1a2840;
  --text:       #e8eaf0;
  --muted:      #8890a4;
  --border:     #2e3650;
  --btn-bg:     #2563a8;
  --btn-hover:  #2e74c0;
  --btn-text:   #ffffff;
  --footer-bg:  #0f1117;
  --footer-text:#5a6380;
  --modal-bg:   #1c2130;
  --modal-text: #d0d4e0;
}}
@media (prefers-color-scheme: dark) {
  .tri-question-text, #ecmo-question { color: #fff !important; }
  .alert { background: #2d2a0f !important; border-color: #7a6e1a !important; color: #f0e68c !important; }
  .note  { background: #0f2233 !important; border-color: #2a6496 !important; color: #aad4f0 !important; }
}

html.light #site-header img {
  filter: none;
}
html.dark #site-header img {
  filter: brightness(3.2) saturate(0.58);
}
html.dark {
  --bg:         #0f1117;
  --bg-card:    #1c2130;
  --blue:       #2c73a7;
  --blue-hover: #7ab3e0;
  --blue-light: #1a2840;
  --text:       #e8eaf0;
  --muted:      #8890a4;
  --border:     #2e3650;
  --btn-bg:     #2563a8;
  --btn-hover:  #2e74c0;
  --btn-text:   #ffffff;
  --footer-bg:  #0f1117;
  --footer-text:#5a6380;
  --modal-bg:   #1c2130;
  --modal-text: #d0d4e0;
}
html.dark .tri-question-text,
html.dark #ecmo-question {
  color: #fff !important;
}
html.dark .alert {
  background: #2d2a0f !important;
  border-color: #7a6e1a !important;
  color: #f0e68c !important;
}
html.dark .note {
  background: #0f2233 !important;
  border-color: #2a6496 !important;
  color: #aad4f0 !important;
}

html.light {
  --bg:         #ffffff;
  --bg-card:    #f5f8fb;
  --blue:       #003e6a;
  --blue-hover: #00325a;
  --blue-light: #e8f0f7;
  --text:       #1a1a1a;
  --muted:      #666666;
  --border:     #e0e0e0;
  --btn-bg:     #003e6a;
  --btn-text:   #ffffff;
  --btn-hover:  #00325a;
  --footer-bg:  #ffffff;
  --footer-text:#999999;
  --modal-bg:   #ffffff;
  --modal-text: #333333;
  --footer-bg:#ffffff; --footer-text:#999999; --modal-bg:#ffffff; --modal-text:#333333;
}

/* ── Reset ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  font-size: 0.8rem;
  font-weight: 400;
  color: var(--text);
  background: var(--bg);
  line-height: 1.6;
  transition: background .25s, color .25s;
}
a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--blue-hover); }
p, li { font-size: 0.8rem; font-weight: 400; margin-bottom: .5rem; }
ul, ol { padding-left: 1.25rem; margin-bottom: .75rem; }
strong { font-weight: 700; }
em { font-style: italic; }

/* ── H1 universel ───────────────────────────────────────────── */
h1 {
  font-family: var(--font) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  color: var(--blue) !important;
  background: none !important;
  margin: 0 0 1.5rem !important;
  padding: 0 !important;
  border-radius: 0 !important;
  text-align: center !important;
  line-height: 1.4 !important;
}

/* H2 */
h2 {
  font-family: var(--font) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  color: var(--blue) !important;
  background: none !important;
  margin: 1.25rem 0 .5rem !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

h3 {
  font-size: .9rem !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  color: var(--blue) !important;
  margin: 1rem 0 .4rem !important;
}

/* ── Tableaux ───────────────────────────────────────────────── */
table { width: 100%; border-collapse: collapse; margin: 1rem 0; }
th, td { padding: .5rem .75rem; border: 1px solid var(--border); font-size: 0.75rem; }
th { background: var(--bg-card); font-weight: 400; text-transform: uppercase; font-size: .8rem; letter-spacing: .05em; color: var(--blue); }

/* ── Header ─────────────────────────────────────────────────── */
#site-header {
  display: flex; align-items: center; justify-content: center;
  padding: 1.75rem 1.25rem 1.5rem; position: relative;
}
#site-header a { display: inline-block; }
#site-header img { width: clamp(72px, 20vw, 140px); height: clamp(72px, 20vw, 140px); display: block; }

/* Bouton jour/nuit */
#theme-toggle {
  position: absolute; right: 1.25rem; top: 50%; transform: translateY(-50%);
  background: none; border: none; cursor: pointer;
  padding: .35rem; font-size: 1.1rem; line-height: 1;
  color: var(--muted); transition: color .2s; border-radius: 50%;
}
#theme-toggle:hover { color: var(--blue); }

/* ── Contenu ────────────────────────────────────────────────── */
#main { max-width: var(--max); width: 100%; margin: 0 auto; padding: 2rem 1.25rem 5rem; }

/* Lien retour */
.back-link {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .8rem; font-weight: 400; letter-spacing: .08em;
  text-transform: uppercase; color: var(--muted); margin-bottom: 1.5rem;
}
.back-link::before { content: '←'; }
.back-link:hover { color: var(--text); }

/* ── Boutons navigation ─────────────────────────────────────── */
.btn-grid { display: flex; flex-direction: column; gap: .5rem; margin-top: 1rem; }

/* ── Style bouton universel ─────────────────────────────────── */
.btn-nav,
.calc-card button,
.calc-card .copy-button,
.calc-card .btn-row button,
.calc-card .buttons button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: .75rem 1rem !important;
  margin: 1rem 0 0 !important;
  background: var(--btn-bg) !important;
  color: var(--btn-text) !important;
  border: none !important;
  outline: none !important;
  border-radius: 2px !important;
  font-family: var(--font) !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  line-height: 1.35 !important;
  cursor: pointer !important;
  transition: background .15s !important;
  -webkit-tap-highlight-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}
.btn-nav:hover,
.calc-card button:hover,
.calc-card .copy-button:hover,
.calc-card .btn-row button:hover,
.calc-card .buttons button:hover {
  background: var(--btn-hover) !important;
  color: var(--btn-text) !important;
}


/* OUI / NON / DOUTE */
.btn-nav.oui, button.oui { background: #27ae60 !important; color: #fff !important; }
.btn-nav.oui:hover, button.oui:hover { background: #219a52 !important; }
.btn-nav.non, button.non { background: #c0392b !important; color: #fff !important; }
.btn-nav.non:hover, button.non:hover { background: #a93226 !important; }
button.doute { background: #e67e22 !important; color: #fff !important; }
button.doute:hover { background: #ca6f1e !important; }

/* OUI/NON côte à côte */
.tri-yesno, .calc-card .buttons, .calc-card .btn-row {
  display: flex !important; flex-direction: row !important;
  gap: .5rem !important; margin-top: 1rem !important; width: 100% !important;
}
.tri-yesno button, .calc-card .buttons button, .calc-card .btn-row button {
  flex: 1 !important; margin: 0 !important;
}

/* ── Selects ────────────────────────────────────────────────── */
select, .calc-card select {
  width: 100% !important;
  padding: .55rem .75rem !important;
  border: 1px solid var(--border) !important;
  border-radius: 2px !important;
  font-family: var(--font) !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  color: var(--text) !important;
  background-color: var(--bg) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23888'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right .75rem center !important;
  padding-right: 2rem !important;
  transition: border-color .15s !important;
}
select:focus, .calc-card select:focus { outline: none !important; border-color: var(--blue) !important; }

/* ── Labels ─────────────────────────────────────────────────── */
label, .calc-card label {
  display: block !important;
  font-size: .85rem !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  color: var(--text) !important;
  margin: 1rem 0 .3rem !important;
}

/* ── Bloc résultat universel ────────────────────────────────── */
.calc-card .result {
  margin-top: 1rem !important;
  padding: 1rem !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: .06em !important;
  text-align: left !important;
  border: 1px solid var(--border) !important;
  border-radius: 2px !important;
}
.result b { text-transform: uppercase; }


.tri-result-card, #ecmo-result {
  margin-top: 1rem !important;
  padding: 1rem !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  text-align: center !important;
  border-radius: 2px !important;
}

/* Résultats prescription douleur (t0/t60) — neutre */
#t0, #t60 {
  margin: 0 !important; padding: 0 !important;
  background: transparent !important; border: none !important;
  font-size: 0.9rem !important; text-transform: none !important;
  text-align: left !important; letter-spacing: 0 !important;
}

/* Classes couleur Tri ARM */
.tri-result-card { border: 1px solid transparent !important; }
.tri-result-card.niveau-P0   { background: #fad7d5 !important; border-color: #e8928d !important; }
.tri-result-card.niveau-P1   { background: #fde0de !important; border-color: #f0a8a4 !important; }
.tri-result-card.niveau-P2MRU{ background: #fdebd0 !important; border-color: #f0bc78 !important; }
.tri-result-card.niveau-P2MRG{ background: #fdf6d0 !important; border-color: #e8d878 !important; }
.tri-result-card.niveau-P3   { background: #d5f0e0 !important; border-color: #82c99a !important; }
.tri-result-card.niveau-P4   { background: #d0e8f8 !important; border-color: #78b4e0 !important; }
.tri-result-niveau { font-size: 0.9rem !important; font-weight: 400 !important; text-transform: uppercase !important; letter-spacing: .1em !important; }
.tri-result-niveau.niveau-P0   { color: #7b241c !important; }
.tri-result-niveau.niveau-P1   { color: #922b21 !important; }
.tri-result-niveau.niveau-P2MRU{ color: #935116 !important; }
.tri-result-niveau.niveau-P2MRG{ color: #7d6608 !important; }
.tri-result-niveau.niveau-P3   { color: #1e6b40 !important; }
.tri-result-niveau.niveau-P4   { color: #1a5276 !important; }

/* Question Tri ARM / ECMO */
.tri-question-text, #ecmo-question {
  font-size: 0.9rem !important; font-weight: 400 !important;
  text-transform: uppercase !important; letter-spacing: .1em !important;
  color: var(--blue) !important; text-align: center !important;
  margin: .75rem 0 !important; line-height: 1.5 !important;
}

/* ── Zone de clic (calculateur FR) ─────────────────────────── */
.click-zone {
  margin: 1rem 0; padding: 2rem 1rem;
  border: 2px dashed var(--blue); border-radius: 4px;
  text-align: center; font-size: 0.9rem; font-weight: 400;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--blue); cursor: pointer;
  user-select: none; -webkit-user-select: none; transition: background .1s;
}
.click-zone:active, .click-zone.flash { background: var(--blue-light); }

/* ── Checklist items ────────────────────────────────────────── */
.checklist-item {
  margin: 0 0 .4rem 0 !important; padding: .6rem .75rem !important;
  display: flex !important; align-items: center !important; gap: .75rem !important;
  border-radius: 2px !important; border: 1px solid var(--border) !important;
  background: var(--bg-card) !important;
  transition: background .15s, border-color .15s !important; cursor: pointer !important;
}
.checklist-item:hover { border-color: var(--blue) !important; background: var(--blue-light) !important; }
.checklist-item.checked { background: #d5f0e0 !important; border-color: #82c99a !important; }
.checklist-item.checked label { text-decoration: line-through !important; color: #1e6b40 !important; }
.checklist-item input[type="checkbox"] {
  width: 18px !important; height: 18px !important; flex-shrink: 0 !important;
  accent-color: var(--blue) !important; cursor: pointer !important; margin: 0 !important;
}
.checklist-item label {
  font-size: 0.8rem !important; font-weight: 400 !important;
  text-transform: none !important; letter-spacing: 0 !important;
  cursor: pointer !important; line-height: 1.4 !important;
  color: var(--text) !important; margin: 0 !important; flex: 1 !important;
}

/* ── Blocs douleur urgence ──────────────────────────────────── */
.columns { display: flex !important; flex-direction: column !important; gap: .75rem !important; margin: 1rem 0 !important; }
.col { background: var(--bg-card) !important; border: none !important; border-left: 3px solid var(--blue) !important; padding: .75rem !important; font-size: 0.75rem !important; font-weight: 400 !important; text-transform: none !important; line-height: 1.5 !important; }
.alert { margin: .75rem 0 !important; padding: .75rem !important; background: #fdf6d0 !important; border: 1px solid #e8d878 !important; text-align: center !important; font-size: 0.8rem !important; text-transform: none !important; }
.note  { margin: .75rem 0 !important; padding: .75rem !important; background: #d0e8f8 !important; border: 1px solid #78b4e0 !important; text-align: center !important; font-size: 0.8rem !important; text-transform: none !important; }

/* ── Source ─────────────────────────────────────────────────── */
.source, .source-note, .calc-card .source, .checklist .source {
  margin-top: 1.5rem !important; padding-top: .75rem !important;
  border-top: 1px solid var(--border) !important;
  font-size: .6rem !important; font-weight: 400 !important;
  color: var(--muted) !important; text-transform: none !important;
  line-height: 1.5 !important; text-align: left !important; background: transparent !important;
}

/* ── Mode sombre ────────────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
  button.oui   { background: #219a52 !important; }
  button.non   { background: #a93226 !important; }
  button.doute { background: #ca6f1e !important; }
}
html.dark button.oui   { background: #219a52 !important; }
html.dark button.non   { background: #a93226 !important; }
html.dark button.doute { background: #ca6f1e !important; }

/* ── Footer fixe ────────────────────────────────────────────── */
#site-footer {
  position: fixed; bottom: 0; left: 0; right: 0;
  border-top: 1px solid var(--border); padding: .6rem 1.25rem;
  text-align: center; font-size: .7rem; font-weight: 400;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--footer-text); background: var(--footer-bg);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: .5rem; z-index: 50; transition: background .25s, border-color .25s;
}
#site-footer a { color: var(--footer-text); }
#site-footer a:hover { color: var(--blue); }
#site-footer .sep { opacity: .35; }
#site-footer button {
  background: none; border: none; font-family: var(--font);
  font-size: .7rem; font-weight: 400; letter-spacing: .08em;
  text-transform: uppercase; color: var(--footer-text); cursor: pointer; padding: 0;
}
#site-footer button:hover { color: var(--blue); }

/* ── Modales ────────────────────────────────────────────────── */
.modal-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,.55); z-index: 1000;
  align-items: center; justify-content: center; padding: 1rem;
}
.modal-overlay.open { display: flex; }
.modal-box {
  background: var(--modal-bg); width: 100%; max-width: 640px;
  max-height: 85vh; overflow-y: auto; padding: 2rem; position: relative;
  border-top: 3px solid var(--blue); transition: background .25s;
}
.modal-box h2 { font-size: .9rem; font-weight: 400; text-transform: uppercase; letter-spacing: .1em; color: var(--blue); margin-bottom: 1.25rem; background: none !important; color: var(--blue) !important; padding: 0 !important; }
.modal-box p  { font-size: 0.9rem; color: var(--modal-text); line-height: 1.65; margin-bottom: .75rem; }
.modal-close  { position: absolute; top: 1rem; right: 1.25rem; background: none; border: none; font-size: 1.4rem; cursor: pointer; color: var(--muted); line-height: 1; }
.modal-close:hover { color: var(--text); }
.modal-box label { display: block; font-size: .8rem; font-weight: 400; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .4rem; color: var(--text); background: none !important; padding: 0 !important; }
.modal-box textarea {
  width: 100%; min-height: 90px; padding: .6rem .75rem;
  border: 1px solid var(--border); border-radius: 2px; font-family: var(--font);
  font-size: 0.9rem; resize: vertical; margin-bottom: .75rem;
  background: var(--bg); color: var(--text); transition: background .25s, color .25s;
}
.modal-box textarea:focus { outline: none; border-color: var(--blue); }
.modal-box .btn-send {
  display: inline-block; padding: .6rem 1.5rem;
  background: var(--btn-bg); color: var(--btn-text); border: none;
  border-radius: 2px; font-family: var(--font); font-size: 0.9rem;
  font-weight: 400; letter-spacing: .08em; text-transform: uppercase;
  cursor: pointer; transition: background .15s;
}
.modal-box .btn-send:hover { background: var(--btn-hover); }
.modal-success { display: none; font-size: 0.9rem; color: var(--blue); font-weight: 400; padding: .5rem 0; }


/* ── Bannière cookies ───────────────────────────────────── */
#cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 200;
  background: var(--modal-bg);
  border-top: 3px solid var(--blue);
  padding: .75rem 1.25rem;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  transition: background .25s;
}
#cookie-text {
  flex: 1 1 auto;
  font-size: .78rem;
  color: var(--text);
  line-height: 1.4;
}
#cookie-text p  { margin: 0 0 .15rem; font-size: .78rem; }
#cookie-text a  { color: var(--blue); font-size: .78rem; text-decoration: underline; }
#cookie-btns {
  display: flex;
  gap: .5rem;
  flex-shrink: 0;
}
#cookie-accept,
#cookie-refuse {
  padding: .45rem 1rem !important;
  width: auto !important;
  font-size: .72rem !important;
  font-weight: 400 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  border: none !important;
  border-radius: 2px !important;
  cursor: pointer !important;
  font-family: var(--font) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
}
#cookie-accept { background: #27ae60 !important; color: #fff !important; }
#cookie-accept:hover { background: #219a52 !important; }
#cookie-refuse { background: #c0392b !important; color: #fff !important; }
#cookie-refuse:hover { background: #a93226 !important; }

@media (max-width: 600px) {
  #cookie-banner {
    flex-wrap: wrap;
    padding: .65rem 1rem;
  }
  #cookie-text { flex: 1 1 100%; }
  #cookie-btns { width: 100%; }
  #cookie-accept, #cookie-refuse { flex: 1 !important; }
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 600px) {
  #main { padding: 1.5rem 1rem 4rem; }
  #site-footer .sep,
  #site-footer a,
  #site-footer button:not([data-modal="modal-warning"]) { display: none; }
}


/* ============================================================
   Styles compilés depuis les pages
   ============================================================ */

/* ── Cartes Leaflet (DAE + DZ) ───────────────────────────── */
#map {
  width: 100%; height: 60vh; min-height: 320px;
  border-radius: 2px; border: 1px solid var(--border);
  margin: .75rem 0; z-index: 1;
}
#map-status { font-size: .78rem; color: var(--muted); text-align: center; margin: .4rem 0; min-height: 1.2rem; }
#map-controls { display: flex; gap: .5rem; margin-bottom: .75rem; }
#map-search { position: relative; display: flex; flex-direction: column; gap: .5rem; margin-bottom: .5rem; }
#search-row { display: flex; gap: .5rem; width: 100%; }
#search-input {
  flex: 1; min-width: 0; padding: .65rem .75rem;
  border: 1px solid var(--border); border-radius: 2px;
  font-family: var(--font); font-size: .88rem;
  background: var(--bg); color: var(--text);
  outline: none; transition: border-color .15s;
}
#search-input:focus { border-color: var(--blue); }
#btn-search { flex-shrink: 0; width: auto !important; padding: .65rem 1rem !important; font-size: .78rem !important; margin: 0 !important; }
#btn-locate { width: 100% !important; margin: 0 !important; }
#search-results {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 1000;
  background: var(--bg); border: 1px solid var(--border); border-radius: 2px;
  max-height: 200px; overflow-y: auto; display: none;
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
}
.search-result-item { padding: .6rem .75rem; font-size: .82rem; cursor: pointer; border-bottom: 1px solid var(--border); line-height: 1.4; color: var(--text); }
.search-result-item:last-child { border-bottom: none; }
.search-result-item:hover { background: var(--bg-card); }
.leaflet-popup-content-wrapper { border-radius: 2px !important; font-family: 'Montserrat', sans-serif !important; font-size: .8rem !important; }
.dae-popup-title, .dz-title { font-size: .83rem; font-weight: 700; color: var(--blue); margin-bottom: .3rem; text-transform: uppercase; letter-spacing: .04em; }
.dae-popup-row, .dz-row { font-size: .76rem; margin: .15rem 0; line-height: 1.4; }
.dae-ok { color: #1e6b40; } .dae-warn { color: #935116; } .dae-ko { color: #922b21; }
.badge { display: inline-block; padding: .1rem .35rem; color: #fff; border-radius: 2px; font-size: .62rem; margin-left: .25rem; vertical-align: middle; }
.badge-nuit { background: #003e6a; } .badge-terrasse { background: #935116; } .badge-ferme { background: #922b21; }
#legend { display: flex; flex-wrap: wrap; gap: .3rem .6rem; margin: .5rem 0; }
.leg { display: flex; align-items: center; gap: .3rem; font-size: .72rem; color: var(--text); }
#filters { display: flex; flex-direction: column; gap: .4rem; margin-bottom: .75rem; }
.check-row { display: flex; flex-direction: column; gap: .15rem; padding: .4rem .75rem; background: var(--bg-card); border: 1px solid var(--border); border-radius: 2px; }
.chk-label, .type-chk-label { display: flex !important; align-items: center !important; text-transform: none !important; letter-spacing: normal !important; margin: 0 !important; font-size: .88rem !important; cursor: pointer; color: var(--text); user-select: none; }
.chk-label { gap: .6rem; padding: .5rem .75rem; transition: background .15s; }
.chk-label input[type=checkbox], .type-chk-label input[type=checkbox] { width: 15px; height: 15px; cursor: pointer; accent-color: var(--blue); flex-shrink: 0; margin: 0; }
#types-toggle { display: flex; align-items: center; gap: .4rem; font-size: .88rem; font-weight: 400; cursor: pointer; color: var(--blue); background: none; border: none; padding: .5rem 0; font-family: var(--font); text-decoration: underline; text-underline-offset: 3px; width: 100%; }
#types-panel { display: none; flex-direction: column; gap: .3rem; padding: .4rem .75rem; margin-top: .1rem; background: var(--bg-card); border: 1px solid var(--border); border-radius: 2px; }
#types-panel.open { display: flex; }
.type-chk-label { gap: .6rem; padding: .5rem .75rem; transition: opacity .15s; }
.type-chk-label:has(input:not(:checked)) { opacity: .45; }
.type-dot { flex-shrink: 0; }
#btn-reset { width: 100% !important; margin: .1rem 0 0 !important; }

/* ── Formulaires demande accès ───────────────────────────── */
.form-group { margin-bottom: 1.25rem; }
    .form-group label {
      display: block !important;
      font-size: .78rem !important;
      font-weight: 400 !important;
      text-transform: uppercase !important;
      letter-spacing: .06em !important;
      color: var(--muted) !important;
      margin-bottom: .35rem !important;
    }
    .form-group input[type="text"],
    .form-group input[type="email"],
    .form-group select {
      width: 100%;
      padding: .65rem .75rem;
      border: 1px solid var(--border);
      border-radius: 2px;
      font-family: var(--font);
      font-size: .88rem;
      background: var(--bg);
      color: var(--text);
      outline: none;
      transition: border-color .15s;
      appearance: none;
    }
    .form-group input:focus,
    .form-group select:focus { border-color: var(--blue); }
    .form-group input.error,
    .form-group select.error { border-color: #c0392b; }
    .form-hint {
      font-size: .72rem;
      color: var(--muted);
      margin-top: .25rem;
    }
    .honor-row {
      display: flex !important;
      align-items: flex-start !important;
      gap: .6rem;
      padding: .75rem;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 2px;
      margin-bottom: 1.25rem;
      cursor: pointer;
    }
    .honor-row input[type="checkbox"] {
      width: 15px; height: 15px;
      flex-shrink: 0; margin-top: .1rem;
      accent-color: var(--blue); cursor: pointer;
    }
    .honor-row span {
      margin-left: 4px;
      font-size: .82rem;
      line-height: 1.5;
      color: var(--text);
      text-transform: none;
      letter-spacing: normal;
    }
    .honor-row.error { border-color: #c0392b; }
    #form-error {
      display: none;
      padding: .6rem .75rem;
      background: #fdf0f0;
      border: 1px solid #e8a0a0;
      border-radius: 2px;
      font-size: .8rem;
      color: #922b21;
      margin-bottom: 1rem;
    }
    html.dark #form-error {
      background: #2d0f0f;
      border-color: #7a2020;
      color: #f0aaaa;
    }
    #form-success {
      display: none;
      text-align: center;
      padding: 2rem 1rem;
    }
    #form-success .check-icon {
      font-size: 2.5rem;
      margin-bottom: 1rem;
    }
    .intro-box {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-left: 3px solid var(--blue);
      border-radius: 2px;
      padding: .85rem 1rem;
      margin-bottom: 1.75rem;
      font-size: .82rem;
      line-height: 1.6;
      color: var(--text);
    }
/* ── Textarea copiable DRM ──────────────────────────────────── */
textarea[readonly] {
  width: 100% !important;
  min-height: 8rem !important;
  padding: .65rem .75rem !important;
  border: 1px solid var(--border) !important;
  border-radius: 2px !important;
  font-family: var(--font) !important;
  font-size: .82rem !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  background: var(--bg-card) !important;
  color: var(--text) !important;
  resize: vertical !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  box-sizing: border-box !important;
}
/* ── Recherche rapide ───────────────────────────────────────── */
#search-toggle {
  position: absolute; left: 1.25rem; top: 50%; transform: translateY(-50%);
  background: none; border: none; cursor: pointer;
  padding: .35rem; font-size: 1.1rem; line-height: 1;
  color: var(--muted); transition: color .2s; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
#search-toggle:hover { color: var(--blue); }
#search-box {
  padding: 0 !important;
  max-width: 560px !important;
  overflow: hidden !important;
}
#search-input-row {
  display: flex; align-items: center; gap: .75rem;
  padding: .85rem 1rem; border-bottom: 1px solid var(--border);
}
#search-input-row svg { flex-shrink: 0; color: var(--muted); }
#search-field {
  flex: 1; border: none; background: none; outline: none;
  font-family: var(--font); font-size: .95rem; color: var(--text);
}
#search-field::placeholder { color: var(--muted); }
#search-input-row .modal-close {
  position: static !important; flex-shrink: 0;
  font-size: 1.2rem; line-height: 1; padding: .2rem .4rem;
}
#search-results-list { display: none; max-height: 360px; overflow-y: auto; }
#search-results-list .search-result-item {
  display: block; padding: .75rem 1rem;
  font-size: .88rem; color: var(--text); text-decoration: none;
  border-bottom: 1px solid var(--border); transition: background .12s;
  text-transform: none; letter-spacing: normal;
}
#search-results-list .search-result-item:last-child { border-bottom: none; }
#search-results-list .search-result-item:hover { background: var(--blue-light); color: var(--blue); }
.search-empty { padding: 1rem; font-size: .85rem; color: var(--muted); text-align: center; }