/* Pilotage — charte Oraivia : coquille charbon chaud, actions or, données bleu nuit à reflets cyan et violet. */
:root {
  --fond:#0E0C0A; --coquille:#14110E; --surface:#1B1815; --trait:#2A2621;
  --nuit:#0F1626; --nuit-trait:#22324A; --cyan:#5CC8E8; --violet:#8B7CF6;
  --or:#C9A24F; --or-doux:#C9A24F22; --creme:#F2EDE3; --gris:#8E8896;
  --vert:#3FB68B; --rouge:#E0605A; --ambre:#E0A526;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--fond); color:var(--creme); font:15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif; font-variant-numeric:tabular-nums; }
a { color:var(--or); }
:focus-visible { outline:2px solid var(--cyan); outline-offset:2px; border-radius:6px; }

/* Coquille */
.coquille { display:grid; grid-template-columns:248px minmax(0, 1fr); min-height:100vh; }
.barre-laterale { background:var(--coquille); border-right:1px solid var(--trait); padding:18px 12px; display:flex; flex-direction:column; gap:14px; position:sticky; top:0; height:100vh; overflow-y:auto; }
.logo { display:flex; align-items:center; gap:10px; color:var(--creme); text-decoration:none; font-weight:650; font-size:16px; padding:2px 8px; }
.recherche { display:flex; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--trait); border-radius:10px; padding:0 10px; color:var(--gris); }
.recherche input { background:none; border:0; padding:9px 0; color:var(--creme); width:100%; font:inherit; }
.recherche input:focus { outline:none; }
.bascule-menu { position:absolute; opacity:0; pointer-events:none; }
.etiquette-menu { display:none; }
.groupe { display:flex; flex-direction:column; gap:1px; margin-bottom:10px; }
.groupe-titre { margin:6px 10px 4px; font-size:11px; letter-spacing:.06em; color:#6F6A63; font-weight:600; }
.groupe a, .lien-inactif { display:flex; align-items:center; gap:11px; padding:8px 10px; border-radius:9px; color:#B9B3AA; text-decoration:none; position:relative; }
.groupe a:hover { background:var(--surface); color:var(--creme); }
.groupe a[aria-current="page"] { background:var(--or-doux); color:var(--creme); }
.groupe a[aria-current="page"]::before { content:""; position:absolute; left:-12px; top:6px; bottom:6px; width:3px; border-radius:0 3px 3px 0; background:var(--or); }
.groupe a[aria-current="page"] .ic { color:var(--or); }
.lien-inactif { color:#5F5A54; cursor:default; }
.lien-inactif small { margin-left:auto; font-size:10px; border:1px solid #3A352F; border-radius:999px; padding:0 6px; color:#6F6A63; }
.sortie { margin-top:auto; }
.sortie button { display:flex; align-items:center; gap:11px; padding:8px 10px; }

/* Contenu */
.contenu { padding:28px 32px 64px; max-width:1320px; width:100%; min-width:0; }
.entete { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:22px; flex-wrap:wrap; }
h1 { font-size:26px; font-weight:680; margin:0; letter-spacing:-.01em; }
.sous-titre { color:var(--gris); margin:4px 0 0; }
h2 { font-size:15px; font-weight:620; margin:30px 0 12px; color:var(--creme); }
.vide, .aide { color:var(--gris); }
.bouton, button { display:inline-flex; align-items:center; gap:8px; background:var(--or); color:#171310; border:0; border-radius:9px; padding:9px 14px; font:inherit; font-weight:620; text-decoration:none; cursor:pointer; }
.bouton:hover, button:hover { filter:brightness(1.08); }
button.lien { background:none; color:var(--gris); font-weight:400; padding:0; }
button.secondaire { background:var(--surface); color:var(--creme); border:1px solid var(--trait); }
button.petit, .bouton.petit { padding:4px 10px; font-size:13px; }

/* Tuiles de données (bleu nuit) */
.grille-tuiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:14px; }
.tuile { background:linear-gradient(180deg, #111A2C, var(--nuit)); border:1px solid var(--nuit-trait); border-radius:14px; padding:16px 18px; box-shadow:inset 0 1px 0 #ffffff08, 0 0 0 1px #5CC8E80a; }
.tuile-titre { margin:0; font:600 11px/1.3 var(--mono); letter-spacing:.08em; color:#7FA7C9; text-transform:uppercase; }
.tuile-valeur { margin:8px 0 2px; font-size:26px; font-weight:680; color:var(--creme); }
.tuile-note { margin:0; color:#8196AE; font-size:13px; }
.tuile.large { grid-column:span 2; }
.panneau { background:linear-gradient(180deg, #111A2C, var(--nuit)); border:1px solid var(--nuit-trait); border-radius:14px; padding:18px; }
.objectif { display:flex; align-items:center; gap:24px; }
.objectif .montant { font-size:30px; font-weight:700; }
.rangee { display:grid; grid-template-columns:minmax(0, 2fr) minmax(0, 1fr); gap:14px; margin-top:14px; }
.courbe { width:100%; height:200px; display:block; }
.legende { list-style:none; padding:0; margin:12px 0 0; display:grid; gap:6px; font-size:13px; }
.legende li { display:flex; align-items:center; gap:8px; }
.legende .val { margin-left:auto; color:var(--gris); }
.barre { width:100%; height:6px; display:block; }

/* Mon matin */
.matin { display:grid; gap:8px; margin-bottom:22px; }
.tache { display:flex; align-items:center; gap:12px; background:var(--surface); border:1px solid var(--trait); border-radius:12px; padding:12px 14px; text-decoration:none; color:var(--creme); }
.tache .point { width:9px; height:9px; border-radius:50%; flex:none; }
.tache.rouge .point { background:var(--rouge); } .tache.ambre .point { background:var(--ambre); } .tache.vert .point { background:var(--vert); }
.tache .compte { margin-left:auto; font-weight:650; }

/* Tableaux */
.defile { overflow-x:auto; background:var(--surface); border:1px solid var(--trait); border-radius:14px; }
table { width:100%; border-collapse:collapse; }
th { text-align:left; color:#7E786F; font-weight:600; font-size:12px; letter-spacing:.03em; padding:12px 14px; border-bottom:1px solid var(--trait); white-space:nowrap; }
td { padding:11px 14px; border-bottom:1px solid #221F1B; vertical-align:middle; }
tr:last-child td { border-bottom:0; }
tbody tr:hover { background:#201C18; }
.nom-cellule { display:flex; align-items:center; gap:10px; }
.avatar { width:30px; height:30px; flex:none; border-radius:50%; display:inline-grid; place-items:center; background:radial-gradient(circle at 30% 30%, #E3C37A, #A9832F); color:#1A140B; font-size:12px; font-weight:700; }
.avatar.grand { width:42px; height:42px; font-size:15px; }

/* Pastilles de statut */
.pastille { display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px; border:1px solid #4A443D; color:#B9B3AA; white-space:nowrap; }
.p-a_livrer, .p-expire_bientot, .p-a_venir, .p-prospect { border-color:#E0A52666; color:var(--ambre); }
.p-actif, .p-livre, .p-paye, .p-active, .p-cliente { border-color:#3FB68B66; color:var(--vert); }
.p-revoque, .p-expire, .p-rembourse, .p-litige, .p-inactive { border-color:#E0605A66; color:var(--rouge); }
.p-vip, .p-membre { border-color:#8B7CF666; color:#B3A8FF; }

/* Filtres en boutons */
.barre-outils { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:14px; }
.barre-outils .champ-recherche { flex:1 1 260px; }
.filtres { display:flex; flex-wrap:wrap; gap:6px; }
.filtres a { padding:6px 12px; border-radius:9px; border:1px solid var(--trait); color:#B9B3AA; text-decoration:none; font-size:13px; font-weight:560; }
.filtres a[aria-current="page"] { border-color:var(--or); color:var(--or); background:var(--or-doux); }

/* Cartes (clientes, produits) */
.cartes { display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:14px; }
.carte { background:var(--surface); border:1px solid var(--trait); border-radius:14px; padding:16px; display:flex; flex-direction:column; gap:12px; color:var(--creme); text-decoration:none; }
a.carte:hover { border-color:#C9A24F88; }
.carte-tete { display:flex; align-items:center; gap:11px; }
.carte-tete .qui { min-width:0; }
.carte-tete .qui strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.carte-tete .qui span { color:var(--gris); font-size:13px; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.carte-tete .pastille { margin-left:auto; }
.chiffres { display:grid; grid-template-columns:1fr auto; gap:4px 12px; font-size:13px; color:var(--gris); }
.chiffres b { color:var(--creme); font-size:17px; font-weight:650; }
.carte-pied { display:flex; justify-content:space-between; color:var(--gris); font-size:12px; border-top:1px solid var(--trait); padding-top:10px; }
.carte-pied .ouvrir { color:var(--or); font-weight:600; }
.sante { width:9px; height:9px; border-radius:50%; display:inline-block; }
.sante.vert { background:var(--vert); } .sante.ambre { background:var(--ambre); } .sante.rouge { background:var(--rouge); }
.produit-tete { height:74px; border-radius:10px; display:grid; place-items:center; font-size:30px; font-weight:750; color:#ffffffd9; }
.produit-tete.t0 { background:linear-gradient(135deg, #1B3A4B, #245A73); } .produit-tete.t1 { background:linear-gradient(135deg, #34265E, #54408F); }
.produit-tete.t2 { background:linear-gradient(135deg, #4A3A16, #7A5E22); } .produit-tete.t3 { background:linear-gradient(135deg, #4B1F33, #7A3354); }
.badges { display:flex; gap:6px; flex-wrap:wrap; }

/* Formulaires */
form.grille { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:12px 14px; background:var(--surface); border:1px solid var(--trait); padding:16px; border-radius:14px; align-items:end; }
label { display:flex; flex-direction:column; gap:5px; font-size:13px; color:var(--gris); }
input, select, textarea { background:var(--fond); color:var(--creme); border:1px solid #37312B; border-radius:9px; padding:9px 10px; font:inherit; width:100%; }
textarea { min-height:12rem; font-family:var(--mono); font-size:13px; }
input[type="checkbox"] { width:16px; height:16px; accent-color:var(--or); }
form.en-ligne { display:inline-flex; gap:6px; align-items:center; margin:0; }
form.en-ligne select { width:auto; }
.alerte { border-left:3px solid var(--ambre); padding:10px 14px; background:var(--surface); border-radius:8px; }
.alerte.erreur { border-left-color:var(--rouge); }
.actions-groupees { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; color:var(--gris); font-size:13px; }

/* Connexion */
body.seul { display:grid; place-items:center; min-height:100vh; padding:16px; }
.carte-connexion { width:100%; max-width:380px; background:var(--surface); border:1px solid var(--trait); border-radius:16px; padding:28px; }
.carte-connexion .logo { color:var(--or); padding:0; margin:0 0 6px; }
.carte-connexion h1 { margin-bottom:18px; }
.carte-connexion form.grille { background:none; border:0; padding:0; grid-template-columns:1fr; }

/* Téléphone */
@media (max-width: 900px) {
  .coquille { grid-template-columns:minmax(0, 1fr); }
  .barre-laterale { position:static; height:auto; border-right:0; border-bottom:1px solid var(--trait); }
  .etiquette-menu { display:block; cursor:pointer; color:var(--creme); padding:9px 12px; border:1px solid var(--trait); border-radius:9px; }
  .bascule-menu:focus-visible + .etiquette-menu { outline:2px solid var(--cyan); outline-offset:2px; }
  .menu { display:none; }
  .bascule-menu:checked ~ .menu { display:block; }
  .sortie { margin-top:0; }
  .contenu { padding:20px 16px 48px; }
  .rangee { grid-template-columns:minmax(0, 1fr); }
  .tuile.large { grid-column:1 / -1; }
  .objectif { flex-direction:column; align-items:flex-start; }
  .grille-tuiles { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .tuile-valeur { font-size:20px; }
}
@media (prefers-reduced-motion: reduce) { * { transition:none !important; } }

/* Pages publiques (vitrine, merci, téléchargement) */
body.public { background:#F6F3EE; color:#1D1A16; }
body.public a { color:#8A6A22; }
.vitrine { max-width:980px; margin:0 auto; padding:28px 16px 56px; }
.logo-public a { color:#1D1A16; text-decoration:none; font-weight:700; letter-spacing:.02em; }
body.public h1 { font-size:30px; margin:18px 0 12px; }
body.public .carte { background:#fff; border-color:#E7E1D7; color:#1D1A16; }
body.public .aide, body.public .vide { color:#6F685F; }
.description { font-size:17px; line-height:1.65; max-width:62ch; }
.prix-public { font-size:28px; font-weight:700; margin:8px 0; }
form.achat { display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; margin:18px 0; }
body.public input, body.public select { background:#fff; color:#1D1A16; border-color:#D9D1C4; }
.pied-public { margin-top:48px; color:#8A837A; font-size:12px; border-top:1px solid #E7E1D7; padding-top:14px; }

/* Cartes produit (référence « Digital Products ») */
.marge-bas { margin-bottom:18px; }
.tuile-valeur small { font-size:14px; color:#8196AE; font-weight:500; }
.carte-produit .produit-tete { position:relative; text-decoration:none; }
.produit-tete .coin { position:absolute; top:8px; left:8px; font-size:10px; font-weight:650; letter-spacing:.04em; padding:2px 8px; border-radius:999px; background:#00000040; color:#E9F2FF; }
.produit-tete .coin.droite { left:auto; right:8px; }
.lien-titre { color:var(--creme); text-decoration:none; }
.extrait { margin:6px 0 0; color:var(--gris); font-size:13px; line-height:1.45; }
.prix-carte { font-size:20px; font-weight:700; }
button.bascule { background:none; color:var(--gris); font-weight:500; padding:0; gap:8px; font-size:12px; }
button.bascule .pouce { width:30px; height:17px; border-radius:999px; background:#37312B; position:relative; flex:none; }
button.bascule .pouce::after { content:""; position:absolute; top:2px; left:2px; width:13px; height:13px; border-radius:50%; background:#8E8896; }
button.bascule.allumee { color:var(--vert); }
button.bascule.allumee .pouce { background:#3FB68B55; }
button.bascule.allumee .pouce::after { left:15px; background:var(--vert); }
.bandeau-demo { margin:0 0 18px; padding:10px 14px; border-radius:10px; background:linear-gradient(90deg, #8B7CF633, #5CC8E833); border:1px solid #8B7CF666; color:#DCD6FF; font-weight:600; font-size:13px; }
.reservation { display:grid; gap:14px; margin-top:16px; }
.jour-rdv { border:1px solid #E7E1D7; border-radius:12px; padding:10px 12px; display:flex; flex-wrap:wrap; gap:8px; background:#fff; }
.jour-rdv legend { font-weight:650; padding:0 6px; }
.nav-semaines { display:flex; gap:18px; margin-top:10px; }
.creneau { flex-direction:row; align-items:center; gap:6px; border:1px solid #D9D1C4; border-radius:9px; padding:7px 11px; cursor:pointer; color:#1D1A16; font-size:14px; }
.creneau input { width:auto; accent-color:#8A6A22; }
.creneau:has(input:checked) { border-color:#8A6A22; background:#F3E9D2; }
.grille-publique { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; }
body.public label { color:#5B554D; }
.piege { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.plage { display:flex; gap:6px; align-items:center; color:var(--gris); }
