:root {
  --kaki: #2E3A32;
  --kaki-soft: #3A4A3F;
  --gold: #C9A24B;
  --cream: #F3F0E7;
  --cream-2: #EBE6D8;
  --muted: #8A8F82;
  --danger: #B0524B;
  --line: #EBE6D8;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; height: 100%; }
body {
  background: var(--cream); color: var(--kaki);
  font-family: 'Jost', system-ui, sans-serif;
  font-size: 16px; line-height: 1.45;
}
#app { max-width: 460px; margin: 0 auto; min-height: 100%; position: relative; }
.display { font-family: 'Cormorant Garamond', serif; font-weight: 600; letter-spacing: -.5px; }
.eyebrow { text-transform: uppercase; letter-spacing: 3px; font-size: 11px; color: var(--gold); font-weight: 500; }

/* Boot */
.boot { position: fixed; inset: 0; background: var(--kaki); display: flex; align-items: center; justify-content: center; }
.mono {
  width: 76px; height: 76px; border-radius: 76px; background: var(--kaki);
  border: 1.5px solid var(--gold); display: flex; align-items: center; justify-content: center;
  font-family: 'Cormorant Garamond', serif; color: var(--gold); font-size: 38px; font-weight: 600;
}
.mono.sm { width: 40px; height: 40px; font-size: 20px; border-width: 1.5px; }

/* Layout */
.header { background: var(--kaki); color: var(--cream); padding: 18px 20px 22px;
  border-bottom-left-radius: 22px; border-bottom-right-radius: 22px;
  display: flex; align-items: center; gap: 14px; padding-top: max(18px, env(safe-area-inset-top)); }
.header .title { font-size: 24px; }
.header .back { background: none; border: none; color: var(--cream); font-size: 30px; line-height: 1; padding: 0 4px 0 0; }
.pad { padding: 20px 18px; }
.pad-btm { padding-bottom: 130px; }

/* Buttons */
button { font-family: inherit; cursor: pointer; }
.btn { width: 100%; padding: 17px; border-radius: 15px; border: none;
  background: var(--gold); color: var(--kaki); font-size: 17px; font-weight: 600; }
.btn:disabled { background: var(--cream-2); color: #A8A599; }
.btn-ghost { background: transparent; border: 1.5px solid var(--line); color: var(--kaki-soft); }
.btn-outline-light { background: transparent; border: 1.5px solid #5A6A5F; color: var(--cream); }

/* Inputs */
label.fld { font-size: 13px; color: #C9C6BB; margin: 0 0 6px; display: block; }
input.fld { width: 100%; padding: 16px 18px; border-radius: 14px; border: none; font-size: 16px;
  background: var(--cream); color: var(--kaki); margin-bottom: 14px; }

/* Cards & chips */
.card { background: #fff; border: 1.5px solid var(--line); border-radius: 18px; padding: 20px 22px; }
.chip { padding: 12px 16px; border-radius: 13px; font-size: 15px; font-weight: 500;
  border: 1.5px solid var(--line); background: #fff; color: var(--kaki); white-space: nowrap; }
.chip.active { border: 2px solid var(--gold); }
.chip:disabled { background: var(--cream-2); color: #B5B2A6; opacity: .6; }

.day { min-width: 66px; padding: 12px 8px; border-radius: 15px; text-align: center;
  border: 1.5px solid var(--line); background: #fff; color: var(--kaki); }
.day.active { border: none; background: var(--kaki); color: var(--cream); }
.slot { padding: 12px 4px; border-radius: 13px; text-align: center; border: 1.5px solid var(--line); background: #fff; }
.slot.active { border: 2px solid var(--gold); }
.slot:disabled { background: var(--cream-2); opacity: .65; }

.row { display: flex; gap: 10px; }
.row.scroll { overflow-x: auto; padding-bottom: 6px; }
.grid3 { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.slot-status { font-size: 10.5px; line-height: 1.2; margin-top: 2px; min-height: 25px; display:flex; align-items:center; justify-content:center; }
.stack { display: flex; flex-direction: column; gap: 10px; }
.mt { margin-top: 24px; }
.center { text-align: center; }
.muted { color: var(--muted); }
.gold { color: var(--gold); }

.actline { display: flex; align-items: center; gap: 14px; padding: 15px 18px; border-radius: 14px;
  border: 1.5px solid var(--line); background: #fff; color: var(--kaki); font-size: 16px; font-weight: 500; width: 100%; text-align: left; }
.actline.active { border: 2px solid var(--gold); }

/* Fixed CTA */
.cta-bar { position: fixed; bottom: 0; left: 0; right: 0; max-width: 460px; margin: 0 auto; padding: 16px;
  padding-bottom: max(16px, env(safe-area-inset-bottom));
  background: linear-gradient(to top, var(--cream) 72%, transparent); }

/* Toast */
.toast { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); background: var(--kaki);
  color: var(--cream); padding: 12px 20px; border-radius: 12px; font-size: 15px; max-width: 420px;
  text-align: center; box-shadow: 0 8px 30px rgba(0,0,0,.25); z-index: 50; }

/* Home big buttons */
.big { width: 100%; text-align: left; padding: 20px 22px; border-radius: 18px; border: 1.5px solid var(--line);
  background: #fff; color: var(--kaki); margin-bottom: 14px; display: flex; justify-content: space-between; align-items: center; }
.big.primary { border: none; background: var(--gold); }
.big .lbl { font-size: 22px; display: block; }
.big .sub { font-size: 14px; color: var(--muted); }
.big.primary .sub { color: var(--kaki-soft); }

/* Install hint */
.install { margin: 0 18px 16px; background: var(--kaki-soft); color: var(--cream); border-radius: 14px;
  padding: 14px 16px; font-size: 14px; display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.install button { background: var(--gold); border: none; color: var(--kaki); font-weight: 600; padding: 8px 14px; border-radius: 10px; }

.spinner { width: 22px; height: 22px; border: 3px solid var(--cream-2); border-top-color: var(--gold);
  border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spinner { animation: none; } }


/* Admin */
.admin-entry { border: 1.5px solid var(--gold); }
.admin-pad { padding-bottom: 48px; }
.admin-title { font-size: 28px; margin: 4px 0 14px; }
.admin-section { margin-top: 28px; }
.admin-card { margin-bottom: 10px; }
.admin-card-head { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.admin-card-head .display { font-size:22px; }
.admin-card-head strong { font-size:13px; color:var(--gold); }
.admin-note { margin-top:8px; font-size:13px; color:var(--muted); }
.admin-row { background:#fff; border:1.5px solid var(--line); border-radius:13px; padding:13px 15px; margin-bottom:8px; display:flex; justify-content:space-between; gap:14px; align-items:center; font-size:14px; }
.admin-row strong { text-align:right; }
.admin-row small { display:block; color:var(--muted); margin-top:3px; }
.admin-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px; }
.admin-form-grid label,.admin-label { display:block; font-size:12px; color:var(--muted); }
.admin-form-grid input,.admin-label input { display:block; width:100%; margin-top:5px; padding:13px 12px; border:1.5px solid var(--line); border-radius:12px; background:#fff; color:var(--kaki); font:inherit; }
.admin-label { margin-bottom:12px; }
.admin-list { margin-top:16px; }
.badge { background:var(--cream-2); color:var(--kaki-soft); border-radius:999px; padding:5px 9px; font-size:11px; font-weight:600; white-space:nowrap; }
.mini-danger { border:none; background:#F7E8E6; color:var(--danger); border-radius:9px; padding:7px 9px; font-size:12px; }


/* Admin V6 — occupation par créneau & horaires éditables */
.occ-table { background:#fff; border:1.5px solid var(--line); border-radius:18px; overflow:hidden; }
.occ-head,.occ-line { display:grid; grid-template-columns:68px 1fr 1fr; align-items:stretch; }
.occ-head { background:var(--kaki); color:var(--cream); font-size:12px; font-weight:600; }
.occ-head span { padding:11px 8px; text-align:center; }
.occ-line { border-top:1px solid var(--line); min-height:52px; }
.occ-line>strong { display:flex; align-items:center; justify-content:center; font-family:'Cormorant Garamond',serif; font-size:18px; }
.occ-line>span { border-left:1px solid var(--line); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:7px 5px; text-align:center; }
.occ-line small { display:block; color:var(--muted); font-size:10px; line-height:1.15; margin-top:2px; }
.occ-full { color:var(--danger); }
.occ-warn { color:var(--gold); }
.occ-class { display:inline-block; background:var(--gold); color:var(--kaki); border-radius:999px; padding:3px 7px; font-size:10px; font-weight:700; }
.occ-empty { color:var(--muted); }
.hours-day { background:#fff; border:1.5px solid var(--line); border-radius:15px; padding:14px 16px; margin-bottom:9px; }
.hours-day-title { font-size:20px; margin-bottom:6px; }
.hour-range { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:6px 0; border-top:1px solid var(--line); }
.hour-range:first-of-type { border-top:none; }
.hours-add { margin-top:14px; }
.admin-select { width:100%; display:block; margin-top:5px; padding:13px 12px; border:1.5px solid var(--line); border-radius:12px; background:#fff; color:var(--kaki); font:inherit; }


/* Admin V7 — navigation par date et détail des adhérents */
.admin-date-card { background:#fff; border:1.5px solid var(--line); border-radius:16px; padding:12px; margin-bottom:8px; }
.admin-date-nav { display:grid; grid-template-columns:42px 1fr 42px; gap:8px; align-items:center; text-align:center; }
.admin-date-nav strong { display:block; font-family:'Cormorant Garamond',serif; font-size:20px; }
.admin-date-nav small { display:block; color:var(--muted); font-size:11px; margin-top:2px; }
.date-nav-btn { width:42px; height:42px; border-radius:12px; border:1.5px solid var(--line); background:var(--cream); color:var(--kaki); font-size:26px; line-height:1; }
.admin-date-tools { display:grid; grid-template-columns:1fr auto auto; gap:8px; margin-top:10px; }
.admin-date-tools input { min-width:0; width:100%; padding:11px; border:1.5px solid var(--line); border-radius:12px; background:#fff; color:var(--kaki); font:inherit; }
.occ-click { width:100%; min-height:51px; border:0; background:transparent; color:inherit; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:7px 5px; }
.occ-click:active { background:var(--cream-2); }
.occ-line>span { padding:0; }
.admin-modal { position:fixed; inset:0; z-index:100; background:rgba(21,29,24,.62); display:flex; align-items:flex-end; justify-content:center; padding:16px; }
.admin-modal-card { width:min(440px,100%); max-height:78vh; overflow:auto; background:var(--cream); border-radius:22px; padding:20px; box-shadow:0 18px 60px rgba(0,0,0,.28); padding-bottom:max(20px,env(safe-area-inset-bottom)); }
.admin-modal-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.admin-modal-head h3 { margin:2px 0 12px; font-size:26px; }
.modal-close { width:38px; height:38px; border:1.5px solid var(--line); border-radius:50%; background:#fff; color:var(--kaki); font-size:24px; line-height:1; }
.course-alert { display:flex; align-items:center; gap:10px; background:#F0E2B8; border-radius:12px; padding:10px 12px; margin:4px 0 12px; }
.course-alert strong { font-size:11px; background:var(--gold); border-radius:999px; padding:4px 7px; }
.course-alert span { font-size:13px; }
.member-item { background:#fff; border:1.5px solid var(--line); border-radius:13px; padding:12px 14px; margin-top:8px; }
.member-item strong { display:block; font-size:15px; }
.member-item small { color:var(--muted); display:block; margin-top:3px; }
@media (max-width:390px){ .admin-date-tools{grid-template-columns:1fr 1fr;} .admin-date-tools input{grid-column:1/-1;} }


/* V9 — cours réservables */
.course-list { display:flex; flex-direction:column; gap:10px; }
.course-card { background:#fff; border:1.5px solid var(--gold); border-radius:17px; padding:16px; }
.course-card.mine { background:#F5EDDA; }
.course-card-top { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.course-card-top .display { display:block; font-size:22px; line-height:1.08; margin-top:2px; }
.course-kicker { display:block; color:var(--kaki-soft); font-size:10px; text-transform:uppercase; letter-spacing:2px; font-weight:600; }
.course-cap { min-width:48px; text-align:center; border-radius:999px; padding:5px 8px; background:var(--gold); color:var(--kaki); font-size:12px; font-weight:700; }
.course-cap.full { background:#F1DEDB; color:var(--danger); }
.course-meta { color:var(--muted); font-size:13px; margin:10px 0 12px; }
.course-book-btn { width:100%; border:0; border-radius:12px; padding:12px; background:var(--kaki); color:var(--cream); font-size:14px; font-weight:600; }
.course-book-btn:disabled { background:var(--cream-2); color:var(--muted); }


/* V9 — polish des cartes de cours */
.course-list { margin-bottom: 4px; }
.course-card { box-shadow: 0 4px 16px rgba(32,49,39,.05); }
.course-card-top > div { min-width: 0; }
.course-card-top .display { color: var(--kaki); margin-top: 4px; }
.course-kicker { color: var(--gold-dark, #9b741f); }
.course-cap { flex: 0 0 auto; }
.course-meta { line-height: 1.45; }
.course-book-btn { cursor: pointer; transition: transform .08s ease, opacity .15s ease; }
.course-book-btn:active:not(:disabled) { transform: scale(.99); }
@media (max-width:390px) {
  .course-card { padding: 14px; }
  .course-card-top .display { font-size: 21px; }
  .course-meta { font-size: 12.5px; }
}


/* V11 — correction robuste du flux de récupération mot de passe */
.admin-subtitle { margin:14px 0 4px; color:var(--kaki); font-weight:700; font-size:13px; }
.admin-course-row { align-items:center; }
.admin-course-row > span:first-child { min-width:0; }
.admin-course-row > span:first-child strong { display:block; }
.admin-course-row small { display:block; color:var(--muted); margin-top:4px; font-size:11px; }
.admin-actions { display:flex; gap:6px; align-items:center; flex:0 0 auto; }
.mini-edit { border:1px solid var(--gold); background:#fff; color:var(--kaki); border-radius:9px; padding:7px 9px; font-size:11px; font-weight:600; }
.btn-secondary { background:var(--kaki); color:var(--cream); }
@media (max-width:420px){ .admin-course-row{align-items:flex-start;gap:10px}.admin-actions{flex-direction:column;align-items:stretch}.mini-edit,.admin-actions .mini-danger{width:76px;} }

.admin-modal-actions{margin-top:16px}.btn-danger{background:#8b3f36!important;color:#fff!important}.admin-list{margin-top:12px}


/* V13 — fermeture rapide depuis le planning */
.quick-close-card{background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:13px;margin:10px 0 14px}.quick-close-title{font-family:'Cormorant Garamond',serif;font-size:19px;margin-bottom:9px}.quick-close-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.quick-close-grid button{border:1.5px solid #d6b04a;background:#fff;color:var(--kaki);border-radius:12px;padding:11px 9px;font:600 13px 'Jost',sans-serif;text-align:left}.quick-close-grid button small{display:block;font-size:10px;font-weight:400;color:var(--muted);margin-top:3px;line-height:1.25}.quick-close-grid .quick-close-day{grid-column:1/-1;background:#8b3f36;border-color:#8b3f36;color:#fff;text-align:center}.quick-close-grid .quick-close-day small{color:#f7e9e6}.quick-close-grid button:active{transform:scale(.99)}


/* V14 - Gestion des adhérents */
.member-search-card{display:grid;grid-template-columns:minmax(0,1fr) 120px auto;gap:8px;background:#fff;border:1.5px solid var(--line);border-radius:15px;padding:10px;margin-bottom:8px}.member-search-card input{min-width:0;width:100%;padding:12px;border:1.5px solid var(--line);border-radius:11px;background:#fff;color:var(--kaki);font:inherit}.member-search-card .admin-select{margin-top:0;padding:11px}.member-admin-list{margin-top:12px}.member-admin-row{width:100%;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:13px 14px;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--kaki);text-align:left;font:inherit}.member-admin-row strong{display:block;font-size:15px}.member-admin-row small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.member-admin-side{flex:0 0 auto;text-align:right}.member-status{display:inline-block;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:700}.member-status.active,.member-status-active{color:#2f6d45}.member-status.active{background:#e8f4eb}.member-status.inactive,.member-status-inactive{color:#8b3f36}.member-status.inactive{background:#f6e8e5}.member-profile-card{background:#fff;border:1.5px solid var(--line);border-radius:15px;padding:13px 14px;display:grid;gap:10px}.member-profile-card>div{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:9px;border-bottom:1px solid var(--line)}.member-profile-card>div:last-child{border-bottom:0;padding-bottom:0}.member-profile-card span{font-size:11px;color:var(--muted)}.member-profile-card strong{font-size:13px;text-align:right;word-break:break-word}@media(max-width:480px){.member-search-card{grid-template-columns:1fr 1fr}.member-search-card input{grid-column:1/-1}.member-search-card .chip{width:100%}.member-admin-row{align-items:flex-start}.member-admin-side{min-width:70px}}
