/* Zero2Win — charte sombre / or */
:root{--bg:#0b0e14;--surface:#131824;--border:#2a3346;--ink:#f2eee4;--muted:#9aa3b5;--gold:#d4af37;--blue:#6b9cf5;--err:#e5736b;--ok:#6fcf97}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 "Spline Sans",system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}
a{color:var(--blue)}
h1{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.6rem;margin:0 0 1rem}
.top{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}
.brand{font-family:Fraunces,Georgia,serif;font-size:1.3rem;color:var(--ink);text-decoration:none}
.brand span{color:var(--gold)}
.top nav{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.top nav a,.link{color:var(--ink);text-decoration:none;font-size:.95rem}
.top nav a:hover,.link:hover{color:var(--gold)}
.lang{border:1px solid var(--border);border-radius:6px;padding:.1rem .5rem;color:var(--muted)!important}
main{flex:1;padding:2rem 1rem;width:100%;max-width:960px;margin:0 auto}
.card{max-width:420px;margin:0 auto;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.75rem}
.card.wide{max-width:720px}
label{display:block;margin:1rem 0 .3rem;font-size:.9rem;color:var(--muted)}
input[type=email],input[type=password],input[type=text]{width:100%;background:var(--bg);color:var(--ink);border:1px solid var(--border);border-radius:8px;padding:.7rem .8rem;font:inherit}
input:focus{outline:2px solid var(--gold);outline-offset:1px}
.pw{position:relative}.pw input{padding-right:5.5rem}
.pw button{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);font-size:.85rem;color:var(--muted)}
.check{display:flex;gap:.6rem;align-items:flex-start;color:var(--ink);font-size:.9rem;margin-top:1.2rem}
.check input{margin-top:.25rem}
.btn{margin-top:1.4rem;width:100%;background:var(--gold);color:#0b0e14;border:0;border-radius:8px;padding:.8rem;font:600 1rem "Spline Sans",sans-serif;cursor:pointer}
.btn:hover{filter:brightness(1.08)}.btn.ghost{background:transparent;color:var(--gold);border:1px solid var(--gold)}
.link{background:none;border:0;padding:0;cursor:pointer;font:inherit}
form.inline{display:inline}
.alt{text-align:center;color:var(--muted);font-size:.9rem;margin:1rem 0 0}
.hint{color:var(--muted);font-size:.85rem;margin:.5rem 0 0}
.flash{border-radius:8px;padding:.7rem .9rem;margin:0 0 1rem;font-size:.92rem;border:1px solid}
.flash.err{color:var(--err);border-color:var(--err);background:rgba(229,115,107,.08)}
.flash.ok{color:var(--ok);border-color:var(--ok);background:rgba(111,207,151,.08)}
main>.flash{max-width:420px;margin:0 auto 1rem}
.badge{font-size:.75rem;border-radius:99px;padding:.1rem .5rem;margin-left:.4rem}.badge.ok{color:var(--ok);border:1px solid var(--ok)}
dt{color:var(--muted);font-size:.85rem}dd{margin:0 0 1rem}
footer{text-align:center;color:var(--muted);font-size:.85rem;padding:1.5rem}
footer a{color:var(--muted)}
/* ── Étape 2 : abonnement et forfaits ── */
h2{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.3rem;margin:0 0 1rem}
h3{font-size:1rem;margin:1.6rem 0 .6rem;color:var(--muted);font-weight:600}
.card+.card{margin-top:1.25rem}
.muted{color:var(--muted)}
.center{text-align:center}
.grid2{display:grid;grid-template-columns:max-content 1fr;gap:.35rem 1.25rem;align-items:baseline}
.grid2 dd{margin:0}
.badge.err{color:var(--err);border:1px solid var(--err)}
.badge.muted{color:var(--muted);border:1px solid var(--border)}
.badge.info{color:var(--blue);border:1px solid var(--blue)}
.badge:first-child{margin-left:0}
.btn:disabled{opacity:.45;cursor:not-allowed;filter:none}
.soon{font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;border:1px solid currentColor;border-radius:99px;padding:0 .4rem;margin-left:.3rem;vertical-align:middle}
.actions{display:flex;gap:.75rem;flex-wrap:wrap}
.actions .btn{flex:1 1 200px;text-align:center;text-decoration:none;display:inline-block}
.history{list-style:none;margin:0;padding:0}
.history li{display:flex;flex-wrap:wrap;gap:.3rem .8rem;align-items:center;padding:.6rem 0;border-top:1px solid var(--border);font-size:.92rem}
.history li:last-child{border-bottom:1px solid var(--border)}
.flash.info{color:var(--blue);border-color:var(--blue);background:rgba(107,156,245,.08)}
.plans-head{max-width:720px;margin:0 auto 1.5rem;text-align:center}
.plans-head .flash{text-align:left}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
.plan{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.5rem;display:flex;flex-direction:column}
.plan h2{margin-bottom:.4rem}
.plan .muted{flex:1;font-size:.92rem;margin:.2rem 0 0}
.plan .btn{display:block;text-align:center;text-decoration:none}
.plan.featured{border-color:var(--gold)}
.price{font-family:Fraunces,Georgia,serif;font-size:1.9rem;color:var(--gold);margin:0}
.ribbon{position:absolute;top:-.7rem;right:1rem;background:var(--gold);color:#0b0e14;font-size:.72rem;font-weight:600;border-radius:99px;padding:.15rem .6rem}
/* ── Étape 5 : codes promo (membre) et espace admin ── */
input[type=number],input[type=date],input[type=search],select,textarea{width:100%;background:var(--bg);color:var(--ink);border:1px solid var(--border);border-radius:8px;padding:.6rem .7rem;font:inherit;color-scheme:dark}
select:focus,textarea:focus{outline:2px solid var(--gold);outline-offset:1px}
input[readonly]{color:var(--muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.btn.small{width:auto;margin-top:.8rem;padding:.55rem 1rem;font-size:.92rem}
.btn.danger{background:transparent;color:var(--err);border:1px solid var(--err)}
.btn.danger:hover{background:rgba(229,115,107,.1)}
a.btn{display:inline-block;text-decoration:none;text-align:center}
.danger-link{color:var(--err)!important;font-size:.88rem}
.was{color:var(--muted);font-size:1.1rem;margin-right:.3rem}
.promo{margin-top:1.5rem}
.promo-form{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.promo-form input{flex:1 1 220px;text-transform:uppercase;letter-spacing:.05em}
.promo-form .btn{margin-top:0}
.promo .flash{margin:1rem 0 .5rem}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em;color:var(--gold)}
main.admin{max-width:1200px}
main.admin>.flash{max-width:none}
.adm-nav{display:flex;gap:.3rem 1.2rem;flex-wrap:wrap;align-items:center;border-bottom:1px solid var(--border);padding:0 0 .8rem;margin:0 0 1.5rem}
.adm-nav a{color:var(--muted);text-decoration:none;font-weight:500}
.adm-nav a:hover,.adm-nav a[aria-current]{color:var(--gold)}
.adm-lock{margin-left:auto}.adm-lock .link{color:var(--muted);font-size:.9rem}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.25rem 1.4rem;margin:0 0 1.25rem;min-width:0}
.panel h2{font-size:1.15rem;margin-bottom:.8rem}
.panel h3:first-child{margin-top:0}
.count{font:500 .8rem "Spline Sans",sans-serif;color:var(--muted);border:1px solid var(--border);border-radius:99px;padding:.05rem .5rem;vertical-align:middle;margin-left:.3rem}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.75rem}
.kpi{border:1px solid var(--border);border-radius:10px;padding:.8rem .9rem;display:flex;flex-direction:column;gap:.15rem}
.kpi-v{font-family:Fraunces,Georgia,serif;font-size:1.45rem;color:var(--ink)}
.kpi-v a{color:inherit;text-decoration:none}.kpi-v a:hover{color:var(--gold)}
.kpi-l{color:var(--muted);font-size:.82rem}
.tbl{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl table{width:100%;border-collapse:collapse;font-size:.9rem}
.tbl th{text-align:left;color:var(--muted);font-weight:500;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;padding:.5rem .6rem;border-bottom:1px solid var(--border);white-space:nowrap}
.tbl td{padding:.55rem .6rem;border-bottom:1px solid var(--border);vertical-align:top}
.tbl tbody tr:hover{background:rgba(255,255,255,.02)}
.tbl a{text-decoration:none}
.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}
.meta{color:var(--muted);font-size:.82rem;max-width:360px;word-break:break-word}
.small{font-size:.82rem}
.filters{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin:0 0 1.2rem}
.filters input[type=search]{flex:1 1 260px;width:auto}
.filters select,.filters input[type=date]{width:auto}
.filters .btn{margin-top:0}
.filters label.sm{margin:0}
.pager{display:flex;gap:1rem;justify-content:center;align-items:center;margin:1rem 0;color:var(--muted)}
.pager a{border:1px solid var(--border);border-radius:8px;padding:.3rem .8rem;text-decoration:none}
.crumbs{margin:0 0 .6rem;font-size:.9rem}.crumbs a{color:var(--muted);text-decoration:none}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:0 1.25rem}
.cols3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0 1.25rem}
.stackform{margin:0 0 1rem}
.stackform+.stackform{border-top:1px solid var(--border);padding-top:.4rem}
label.sm{font-size:.82rem;margin:.7rem 0 .25rem}
.row{display:flex;gap:.6rem;flex-wrap:wrap}.row>*{flex:1 1 150px;min-width:0}
.check.sm{margin-top:.7rem;font-size:.88rem;color:var(--muted)}
.acts{display:flex;gap:.6rem;flex-wrap:wrap;align-items:flex-end;margin:0 0 .6rem}
.acts form{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.chips{list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.chips li{border:1px solid var(--border);border-radius:99px;padding:.2rem .7rem;font-size:.85rem}
.plans-pick{border:0;padding:0;margin:.4rem 0 0}
.plans-pick legend{padding:0;color:var(--muted)}
.plans-pick .check{display:inline-flex;margin-right:1rem}
details.sub{margin-top:1rem}details.sub summary{cursor:pointer;color:var(--gold)}
.danger-zone{border-color:rgba(229,115,107,.45)}
.danger-zone h2{color:var(--err)}
.ver{font-variant-numeric:tabular-nums}
@media (max-width:600px){.panel{padding:1rem}.cols{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,1fr)}}
/* ── v1.6.0 : pages légales, bandeau cookies, « Mes données » ── */
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem 1.1rem}
footer .ver{display:block;margin-top:.4rem}
/* v1.7.0 : marges latérales (et zones sûres des écrans à encoche), hauteur bornée à l'écran,
   bouton « Compris » toujours visible (collé en bas du bandeau si le texte défile). */
.cookie-note{position:fixed;left:max(1rem,env(safe-area-inset-left));right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,calc(env(safe-area-inset-bottom) + .75rem));z-index:50;box-sizing:border-box;max-width:560px;max-height:calc(100vh - 2rem);max-height:calc(100dvh - 2rem);overflow-y:auto;margin:0 auto;display:flex;gap:.8rem 1rem;align-items:center;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:.8rem 1rem;box-shadow:0 8px 30px rgba(0,0,0,.45);font-size:.9rem}
.cookie-note p{flex:1 1 260px;min-width:0;margin:0;color:var(--ink);overflow-wrap:anywhere}
.cookie-note .btn{margin-top:0;flex:0 0 auto;position:sticky;bottom:0;min-height:44px}
/* v1.7.1 : espace réservé en bas tant que le bandeau est affiché, pour qu'il ne masque jamais la fin
   des pages longues. --cookie-h = hauteur réelle du bandeau (mesurée par app.js ; 7rem par défaut, 12rem sur mobile).
   La classe .has-cookie-note est posée par le serveur (navigateurs sans :has) ; :has() couvre le reste. */
body.has-cookie-note,body:has(.cookie-note){padding-bottom:calc(var(--cookie-h,7rem) + 2rem)}
@media (max-width:480px){body.has-cookie-note,body:has(.cookie-note){padding-bottom:calc(var(--cookie-h,12rem) + 2rem)}}
@media (max-width:480px){.cookie-note{flex-direction:column;align-items:stretch;padding:.8rem .9rem}.cookie-note p{flex:0 1 auto}.cookie-note .btn{width:100%}}
.legal{max-width:760px;margin:0 auto;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.75rem clamp(1rem,4vw,2.25rem);line-height:1.6}
.legal h2{font-size:1.15rem;margin:2rem 0 .6rem;scroll-margin-top:1rem}
.legal h3{color:var(--ink);margin:1.2rem 0 .4rem}
.legal p,.legal li{color:#d9d5cb}
.legal ul{padding-left:1.2rem}
.legal li+li{margin-top:.3rem}
.legal .lede{color:var(--muted);font-size:.9rem;margin:0 0 1.2rem}
.legal .toc{columns:2 240px;font-size:.9rem;margin:0 0 1rem;padding-left:1.2rem}
.legal .callout{border:1px solid var(--gold);border-radius:10px;padding:.9rem 1.1rem;background:rgba(212,175,55,.06);margin:1rem 0}
.legal .callout p:first-child{margin-top:0}.legal .callout p:last-child{margin-bottom:0}
.legal .tbl{margin:.5rem 0 1rem}
.legal .tbl td,.legal .tbl th{font-size:.88rem}
.legal .foot-note{color:var(--muted);font-size:.85rem;border-top:1px solid var(--border);margin-top:2rem;padding-top:1rem}
.data-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-top:1rem;align-items:start}
.data-actions form{border:1px solid var(--border);border-radius:10px;padding:1rem 1.1rem}
.data-actions h3{margin-top:0;color:var(--ink)}
.data-actions .danger-zone{border-color:rgba(229,115,107,.5)}
/* ── v1.7.0 : paiement en ligne ── */
.pay-note{max-width:640px;margin-left:auto;margin-right:auto}
.plan form[data-checkout]{margin:0}
.buy-row{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.4rem}
.buy-row form{margin:0;flex:1 1 220px}
.buy-row .btn{width:100%}
.pay-table td .small,.tbl .small{font-size:.8rem}
details.refund{margin-top:.4rem}details.refund summary{font-size:.82rem}
details.refund .stackform{min-width:220px}
/* Bandeau « MODE TEST » (STRIPE_MODE=test) : visible sur toutes les pages, sans style inline (CSP). */
.test-banner{margin:0;padding:.45rem max(1rem,env(safe-area-inset-left));text-align:center;font-size:.85rem;line-height:1.4;background:#5a3d00;color:#ffe9b0;border-bottom:1px solid #b07d12}
.test-banner strong{letter-spacing:.06em;margin-right:.35rem;color:#fff}

/* ── v1.7.1 : indicateur TPS/TVQ « petit fournisseur » (admin → Revenus) ── */
.tax-meter h2{margin-top:0}
.tax-total{margin:.2rem 0 .5rem;font-size:1.05rem}
.tax-total strong{font-family:Fraunces,Georgia,serif;font-size:1.45rem}
.tax-meter .meter{display:block;width:100%;height:10px;border:1px solid var(--border);border-radius:5px;background:var(--bg);overflow:hidden;-webkit-appearance:none;appearance:none;color:var(--ok)}
.tax-meter .meter::-webkit-progress-bar{background:var(--bg)}
.tax-meter .meter::-webkit-progress-value{background:var(--ok)}
.tax-meter .meter::-moz-progress-bar{background:var(--ok)}
.tax-meter.warn{border-color:var(--gold)}.tax-meter.warn .tax-msg{color:var(--gold)}
.tax-meter.warn .meter::-webkit-progress-value{background:var(--gold)}.tax-meter.warn .meter::-moz-progress-bar{background:var(--gold)}
.tax-meter.over{border-color:var(--err)}.tax-meter.over .tax-msg{color:var(--err);font-weight:600}
.tax-meter.over .meter::-webkit-progress-value{background:var(--err)}.tax-meter.over .meter::-moz-progress-bar{background:var(--err)}
.tax-msg{color:var(--gold)}
.tax-meter.over{border-color:var(--err)}.tax-meter.over .meter span{background:var(--err)}.tax-meter.over .tax-msg{color:var(--err);font-weight:600}
.tax-msg{margin:.4rem 0 0}
/* v1.8.1 — page « Mes outils » (réutilise .plans / .plan / .ribbon / .badge) */
.top nav a[aria-current]{color:var(--gold)}
.tool-state{margin:.9rem 0 0}
.plan.off{opacity:.7}
.tool-list .badge{margin-left:0}
.plans-head .for-tool{color:var(--gold);margin:.4rem 0 0}

/* ── v1.8.4 : mode bêta (bandeau, invitation, commentaires, admin) ── */
.beta-banner{margin:0;padding:.4rem max(1rem,env(safe-area-inset-left));text-align:center;font-size:.85rem;line-height:1.4;background:#10233f;color:#cfe0ff;border-bottom:1px solid #2c4f86}
.beta-banner strong{letter-spacing:.06em;margin-right:.35rem;color:#fff}
.beta-banner a{color:var(--gold);margin-left:.35rem}
.beta-points{margin:.6rem 0 0;padding-left:1.2rem;line-height:1.55}
.beta-points li{margin:.25rem 0}
.beta-note{border:1px solid #2c4f86;background:#10233f;border-radius:10px;padding:.8rem 1rem;margin:0 0 1rem;font-size:.92rem}
.beta-note p{margin:0}
.beta-note .hint{margin-top:.6rem}
.beta-inv .btn{display:block}
.copy-row{margin:0 0 .8rem}
.copy-field{display:flex;gap:.5rem;align-items:center}
.copy-field input{flex:1 1 auto;min-width:0;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.85rem}
.copy-field .btn{margin-top:0;white-space:nowrap}
.fb-item{padding:1rem 1.2rem}
.fb-meta{margin:0 0 .5rem;color:var(--muted)}
.fb-msg{margin:0;white-space:normal;overflow-wrap:anywhere}
.fb-ua{margin:.4rem 0 0}
.fb-actions{display:flex;gap:.5rem;flex-wrap:wrap}
textarea{resize:vertical;min-height:8rem}
