#myroqya-app{--bg:#f6f8fb;--card:#ffffff;--ink:#1a2233;--muted:#64748b;--accent:#2f7fc1;--accent2:#5aa9e0;--gold:#2f7fc1;--line:#e2e8f0;--danger:#c0392b;--rgb:47,127,193;--on:#ffffff;--field:#ffffff}
#myroqya-app *{box-sizing:border-box}

#myroqya-app .wrap{max-width:480px;margin:0 auto;padding:16px 16px 40px}
#myroqya-app header{text-align:center;padding:12px 0 8px}
#myroqya-app .logo{font-family:inherit;letter-spacing:.2em;font-size:22px;color:var(--accent);font-weight:700}
#myroqya-app .logo span{color:var(--ink)}
#myroqya-app .sub{color:var(--muted);font-size:13px;margin-top:2px}
#myroqya-app .bar{display:flex;gap:6px;margin:14px 0}
#myroqya-app .bar i{flex:1;height:4px;border-radius:2px;background:var(--line)}
#myroqya-app .bar i.on{background:var(--accent)}
#myroqya-app h2{font-size:20px;margin:8px 0 14px;font-weight:600}
#myroqya-app .back{background:none;border:0;color:var(--muted);font-size:14px;padding:8px 0;cursor:pointer}
#myroqya-app .opt{display:block;width:100%;text-align:left;background:var(--card);border:1.5px solid var(--line);border-radius:14px;padding:16px;margin-bottom:10px;font:inherit;color:inherit;cursor:pointer;min-height:56px}
#myroqya-app .opt:hover,#myroqya-app .opt.sel{border-color:var(--accent)}
#myroqya-app .opt small{display:block;color:var(--muted);font-size:13px}
#myroqya-app .opt b{font-size:16px}
#myroqya-app .row{display:flex;justify-content:space-between;align-items:center;gap:8px}
#myroqya-app .cal{background:var(--card);border-radius:14px;padding:8px;max-width:100%;overflow:hidden;border:1px solid var(--line)}
#myroqya-app .cal-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
#myroqya-app .cal-h button{background:none;border:0;font-size:22px;color:var(--accent);width:44px;height:44px;cursor:pointer}
#myroqya-app .grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;text-align:center}
#myroqya-app .grid .dow{font-size:12px;color:var(--muted);padding:4px 0}
#myroqya-app .d{aspect-ratio:1;width:100%;min-width:0;min-height:0;padding:0;margin:0;box-sizing:border-box;line-height:1;font-size:16px;border:0;border-radius:10px;background:none;font:inherit;color:var(--muted);opacity:.4}
#myroqya-app .d.av{background:rgba(47,127,193,.12);color:var(--ink);opacity:1;font-weight:600;cursor:pointer}
#myroqya-app .d.sel{background:var(--accent);color:#fff}
#myroqya-app .slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
#myroqya-app .slot{padding:14px 0;min-width:0;margin:0;text-align:center;border:1.5px solid var(--line);background:var(--card);border-radius:12px;font:inherit;color:inherit;cursor:pointer}
#myroqya-app .slot.sel{background:var(--accent);color:#fff;border-color:var(--accent)}
#myroqya-app label{display:block;font-size:14px;margin:12px 0 4px;color:var(--muted)}
#myroqya-app input,#myroqya-app textarea{width:100%;padding:14px;border-radius:12px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font:inherit}
#myroqya-app input.err{border-color:var(--danger)}
#myroqya-app .btn{display:block;width:100%;margin-top:18px;padding:16px;border:0;border-radius:6px;background:var(--accent);color:#fff;font:inherit;font-weight:600;cursor:pointer}
#myroqya-app .btn:disabled{opacity:.4;cursor:not-allowed}
#myroqya-app .price{font-size:26px;font-weight:700;color:var(--accent)}
#myroqya-app .pill{display:inline-block;font-size:12px;background:rgba(47,127,193,.12);color:var(--gold);padding:2px 8px;border-radius:99px;margin-bottom:6px}
#myroqya-app .sum{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:14px;font-size:14px}
#myroqya-app .sum div{display:flex;justify-content:space-between;padding:3px 0}
#myroqya-app .note{font-size:12px;color:var(--muted);margin-top:12px;text-align:center}
#myroqya-app .timer{font-size:13px;color:var(--gold);text-align:center;margin-bottom:8px}
#myroqya-app .ok{text-align:center;padding:20px 0}
#myroqya-app .ok .tick{width:64px;height:64px;border-radius:50%;background:var(--accent);color:#fff;font-size:34px;line-height:64px;margin:0 auto 12px}
#myroqya-app .demo{background:#fff3cd;color:#664d03;font-size:12px;padding:6px 10px;border-radius:8px;text-align:center;margin-top:10px}
#myroqya-app{max-width:520px;margin:0 auto;padding:16px;color:var(--ink);background:var(--bg);border-radius:16px;font-family:system-ui,-apple-system,sans-serif;line-height:1.45}
#myroqya-app .muted{color:var(--muted);font-size:13px}
#myroqya-app .btn.ghost{background:none;color:var(--danger);border:1.5px solid var(--danger)}

#myroqya-app .mark{display:block;margin:0 auto 4px;mix-blend-mode:multiply;filter:brightness(1.03)}

#myroqya-app .info{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:12px}
#myroqya-app .chk{display:flex;gap:12px;align-items:flex-start;padding:12px 4px;border-top:1px solid var(--line);cursor:pointer;line-height:1.4}
#myroqya-app .info .chk:first-of-type{border-top:0}
#myroqya-app .chk input{flex:0 0 22px;width:22px;height:22px;margin:1px 0 0;accent-color:var(--accent)}
#myroqya-app .notice{border-radius:14px;padding:14px;margin-bottom:12px;font-size:14px}
#myroqya-app .notice p,#myroqya-app .notice ul{margin:6px 0 0}
#myroqya-app .notice.warn{background:#fff7e0;border:1px solid #f0d78a;color:#5c4a12}
#myroqya-app .notice.stop{background:#fdecec;border:1px solid #f1b8b8;color:#6b1f1f}
#myroqya-app .notice.stop .chk{border-top:1px solid #f1b8b8;margin-top:8px}

/* ---- v2 : étapes, fiche rendez-vous, cartes de confiance ---- */
#myroqya-app{max-width:980px}
#myroqya-app .steps{list-style:none;display:flex;gap:8px;margin:14px 0 18px;padding:0;justify-content:center;flex-wrap:wrap}
#myroqya-app .steps li{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border:1px solid var(--line);border-radius:99px;color:var(--muted);font-size:14px;background:var(--card)}
#myroqya-app .steps li b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--line);font-size:12px}
#myroqya-app .steps li.on{border-color:var(--accent);color:var(--ink)}
#myroqya-app .steps li.on b,#myroqya-app .steps li.done b{background:var(--accent);border-color:var(--accent);color:#fff}
@media (max-width:640px){#myroqya-app .steps li:not(.on) span{display:none}#myroqya-app .steps li:not(.on){padding:6px}}
#myroqya-app .layout{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
#myroqya-app .layout .ticket{order:2}
@media (min-width:900px){#myroqya-app .layout{grid-template-columns:minmax(0,1fr) 320px;align-items:start}#myroqya-app .layout .ticket{position:sticky;top:24px}}
#myroqya-app .ticket{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px;border-top:4px solid var(--accent)}
#myroqya-app .ticket small{letter-spacing:.14em;color:var(--accent);font-weight:700;font-size:12px}
#myroqya-app .ticket h3{margin:6px 0 2px;font-size:20px}
#myroqya-app .ticket .when{margin:10px 0;color:var(--accent);font-weight:600}
#myroqya-app .ticket .rows{border-top:1px dashed var(--line);margin-top:12px;padding-top:10px}
#myroqya-app .ticket .rows div{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:14px}
#myroqya-app .ticket .rows div:first-child b{font-size:18px}
#myroqya-app .badge{display:inline-block;background:#fdecc8;color:#7a5200;font-size:11px;font-weight:700;letter-spacing:.08em;padding:3px 9px;border-radius:99px;vertical-align:middle}
#myroqya-app .trust{display:grid;gap:10px;margin:14px 0}
#myroqya-app .trust div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px}
#myroqya-app .trust p{margin:4px 0 0;font-size:13px;color:var(--muted)}

/* ---- v3 : thème sombre / turquoise ---- */
#myroqya-app{border:1px solid rgba(var(--rgb),.22);border-radius:24px;padding:24px 20px 32px;background:radial-gradient(900px 360px at 50% -8%,rgba(var(--rgb),.13),transparent),var(--bg);box-shadow:0 0 90px rgba(var(--rgb),.07)}
#myroqya-app .mark{background:#fff;border-radius:50%;padding:8px;mix-blend-mode:normal;filter:none;width:72px;height:72px}
#myroqya-app .logo{color:var(--accent)}
#myroqya-app .logo span{color:var(--ink)}
#myroqya-app h1.hero,#myroqya-app h2,#myroqya-app .ticket h3,#myroqya-app .price{font-family:'Arial Narrow','Roboto Condensed','Helvetica Neue Condensed',Arial,sans-serif;text-transform:uppercase;letter-spacing:.01em;font-weight:800}
#myroqya-app h1.hero{font-size:clamp(34px,8vw,56px);line-height:1;margin:14px 0 10px;color:var(--ink)}
#myroqya-app h1.hero em{font-style:normal;background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}
#myroqya-app .sub{max-width:560px;margin:0 auto;font-size:15px}
#myroqya-app header{padding-bottom:6px}
#myroqya-app h2{font-size:26px}
#myroqya-app .btn{background:var(--accent);color:var(--on);border-radius:999px;font-weight:700;font-size:17px;padding:17px;box-shadow:0 8px 28px rgba(var(--rgb),.25)}
#myroqya-app .btn:disabled{opacity:.3;box-shadow:none}
#myroqya-app .opt,#myroqya-app .cal,#myroqya-app .info,#myroqya-app .ticket,#myroqya-app .trust div,#myroqya-app .sum{border-radius:20px}
#myroqya-app .opt:hover,#myroqya-app .opt.sel{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 0 24px rgba(var(--rgb),.12)}
#myroqya-app .pill{background:rgba(var(--rgb),.12);color:var(--accent)}
#myroqya-app .d.av{background:rgba(var(--rgb),.12);color:var(--ink)}
#myroqya-app .d.sel{background:var(--accent);color:var(--on)}
#myroqya-app .slot{border-radius:14px}
#myroqya-app .slot.sel{background:var(--accent);color:var(--on);border-color:var(--accent)}
#myroqya-app input,#myroqya-app textarea{background:var(--field);color:var(--ink);border-radius:14px}
#myroqya-app input:focus,#myroqya-app textarea:focus{outline:2px solid var(--accent);border-color:var(--accent)}
#myroqya-app .steps li{background:var(--card)}
#myroqya-app .steps li.on b,#myroqya-app .steps li.done b{color:var(--on)}
#myroqya-app .ticket{background:linear-gradient(160deg,rgba(var(--rgb),.16) 0%,var(--card) 60%);border-top:0;border-color:rgba(var(--rgb),.3)}
#myroqya-app .ticket .when{color:var(--accent)}
#myroqya-app .badge{background:#ffcf4a;color:#3a2a00}
#myroqya-app .notice.warn{background:rgba(255,193,7,.08);border-color:#6b5311;color:#ffd66b}
#myroqya-app .notice.stop{background:rgba(255,107,107,.08);border-color:#6b2b2b;color:#ffb3b3}
#myroqya-app .notice.stop .chk{border-top-color:#6b2b2b}
#myroqya-app .back,#myroqya-app .muted,#myroqya-app .note{color:var(--muted)}

/* ---- v4 : informations en cartes ---- */
#myroqya-app .cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px;margin-bottom:12px}
#myroqya-app .card{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px}
#myroqya-app .card .ic{flex:0 0 44px;height:44px;border-radius:14px;background:rgba(var(--rgb),.12);display:grid;place-items:center;font-size:22px}
#myroqya-app .card .tx{min-width:0}
#myroqya-app .card p{margin:0;line-height:1.4}
#myroqya-app .card.must{grid-column:1/-1;border:2px solid #ffcf4a;background:linear-gradient(120deg,rgba(255,207,74,.12),var(--card) 70%)}
#myroqya-app .card.must .ic{background:rgba(255,207,74,.2)}
#myroqya-app .card.must .badge{margin-bottom:6px}
#myroqya-app .card.must .chk{border-top:1px dashed #6b5311;margin-top:10px;padding:10px 0 0}
#myroqya-app .card.pay{grid-column:1/-1}
#myroqya-app .card.pay p{margin-top:6px}
#myroqya-app .amt{color:var(--accent);white-space:nowrap}

/* ---- v5 : cas non pris en charge, sans rouge sur rouge ---- */
#myroqya-app .card.stop{margin-bottom:12px;border-left:4px solid #ff6b6b}
#myroqya-app .card.stop .ic{background:rgba(255,107,107,.16)}
#myroqya-app .card.stop ul{margin:6px 0 0;padding-left:18px;color:var(--muted)}
#myroqya-app .card.stop .chk{border-top:1px solid var(--line);margin-top:10px;padding:10px 0 0}

/* ---- v6 : cartes compactes, détail au toucher ---- */
#myroqya-app .cards{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px}
#myroqya-app .card{padding:12px 14px;align-items:center;position:relative}
#myroqya-app .card .t{font-weight:600;line-height:1.3}
#myroqya-app .card .dt{display:none;margin-top:6px;color:var(--muted);font-size:14px}
#myroqya-app .card.open .dt,#myroqya-app .card.must .dt{display:block}
#myroqya-app .card.more{cursor:pointer;padding-right:34px}
#myroqya-app .card.more::after{content:'+';position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--accent);font-size:20px;font-weight:700}
#myroqya-app .card.more.open::after{content:'\2212'}
#myroqya-app .chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
#myroqya-app .chip{background:rgba(var(--rgb),.1);border:1px solid rgba(var(--rgb),.25);border-radius:99px;padding:4px 10px;font-size:13px}
#myroqya-app .chip b{color:var(--accent)}
#myroqya-app .card .tx{flex:1 1 auto;min-width:0;width:100%}

/* ---- v7 : ville en grand titre ---- */
#myroqya-app h2.city{font-size:clamp(38px,8vw,60px);line-height:1;margin:6px 0 6px;color:var(--ink)}
#myroqya-app .place{display:inline-block;margin:0 0 18px;padding:6px 14px;border-radius:99px;background:rgba(var(--rgb),.1);border:1px solid rgba(var(--rgb),.25);color:var(--accent);font-size:15px;font-weight:600}
#myroqya-app h3.know{margin:0 0 12px;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
#myroqya-app .card .sb{color:var(--muted);font-size:14px;margin-top:2px}

/* ---- v8 : palette claire (couleurs du site) ---- */
#myroqya-app{box-shadow:0 10px 40px rgba(26,34,51,.08)}
#myroqya-app .mark{background:none;border-radius:0;padding:0;mix-blend-mode:multiply;filter:brightness(1.03)}
#myroqya-app .card.must .chk{border-top-color:#e0c36a}
#myroqya-app .card.stop{border-left-color:#d9534f}

/* ---- v9 : cas non pris en charge bien visible, en bas ---- */
#myroqya-app .card.stop{display:flex;background:var(--card);border:2px solid #d9534f;border-left-width:8px;border-radius:18px;padding:18px;margin:12px 0;align-items:flex-start;box-shadow:0 4px 18px rgba(217,83,79,.12)}
#myroqya-app .card.stop .ic{background:#d9534f;color:#fff;width:48px;height:48px;flex-basis:48px;font-size:24px}
#myroqya-app .card.stop .st{font-family:'Arial Narrow','Roboto Condensed',Arial,sans-serif;text-transform:uppercase;font-weight:800;font-size:22px;letter-spacing:.01em;margin:0;color:var(--ink)}
#myroqya-app .card.stop .why{margin:4px 0 8px;color:var(--muted);font-size:14px}
#myroqya-app .card.stop ul{margin:0;padding-left:20px;color:var(--ink);font-size:16px;font-weight:600;line-height:1.5}
#myroqya-app .card.stop li::marker{color:#d9534f}
#myroqya-app .card.stop .chk{border-top:1px solid var(--line);margin-top:12px;padding:12px 0 0;font-weight:600}
#myroqya-app .card.must{margin-top:10px}
/* ---- v10 : icône lisible (rouge sur fond clair, pas sur fond rouge) ---- */
#myroqya-app .card.stop .ic{background:#fff;border:2px solid #d9534f;color:inherit;width:52px;height:52px;flex-basis:52px;font-size:28px}
/* ---- v11 : cases à cocher bien visibles ---- */
#myroqya-app .card .chk{font-weight:800;font-size:16px;color:var(--ink);align-items:center;cursor:pointer}
#myroqya-app .card .chk span{font-weight:800}
#myroqya-app .card .chk input{flex:0 0 28px;width:28px;height:28px;margin:0;border-radius:6px;accent-color:var(--accent)}
#myroqya-app .card.stop .chk input{accent-color:#d9534f}
#myroqya-app .card .chk:has(input:checked){color:var(--accent)}
#myroqya-app .card.stop .chk:has(input:checked){color:#b02a26}

/* ---- v12 : calendrier compact, en-tête réduit après la 1re étape ---- */
#myroqya-app .d{aspect-ratio:auto;height:52px;font-size:17px;border-radius:12px}
#myroqya-app .grid{gap:6px}
#myroqya-app header.compact{display:flex;align-items:center;justify-content:center;gap:10px;padding:0 0 4px}
#myroqya-app header.compact .mark{width:44px;height:44px;margin:0}
#myroqya-app header.compact .logo{font-size:20px}
#myroqya-app .steps{margin:10px 0 16px}

/* ---- v13 : calendrier lisible + horaires à droite ---- */
#myroqya-app .dtgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin-bottom:6px}
@media (min-width:760px){#myroqya-app .dtgrid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:start}}
@media (min-width:900px){#myroqya-app .layout.solo{grid-template-columns:minmax(0,1fr)}}
#myroqya-app .cal{padding:18px}
#myroqya-app .cal-h b{font-size:22px;text-transform:capitalize}
#myroqya-app .cal-h button{font-size:30px;width:52px;height:52px}
#myroqya-app .grid .dow{font-size:15px;font-weight:800;color:var(--muted);padding:6px 0}
#myroqya-app .d{height:58px;font-size:21px}
#myroqya-app .d.av{font-weight:800;background:rgba(var(--rgb),.14);border:1.5px solid rgba(var(--rgb),.35)}
#myroqya-app .d.sel{border-color:var(--accent)}
#myroqya-app .slotpanel{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px}
#myroqya-app .slotpanel h3{margin:0 0 14px;font-size:19px;text-transform:capitalize}
#myroqya-app .slotpanel .slots{margin:0;grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
#myroqya-app .slot{font-size:21px;font-weight:800;min-height:60px;padding:0}
#myroqya-app .slotpanel.empty{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;min-height:220px;border-style:dashed;color:var(--muted)}
#myroqya-app .slotpanel.empty p{font-size:21px;font-weight:800;margin:0 0 6px;color:var(--ink)}
#myroqya-app .slotpanel.empty .arr{color:var(--accent)}
@media (max-width:759px){#myroqya-app .slotpanel.empty{min-height:0;padding:14px}#myroqya-app .slotpanel.empty .arr{display:none}}
#myroqya-app .d.av.sel{background:var(--accent);color:var(--on);border-color:var(--accent)}
#myroqya-app .slotpanel h3{text-transform:none}

/* ---- v14 : formulaire (adresse, WhatsApp) ---- */
#myroqya-app label small{font-weight:400;color:var(--muted);margin-left:6px}
#myroqya-app label.wa{display:flex;gap:12px;align-items:flex-start;margin:10px 0 4px;padding:12px 14px;border:1.5px solid rgba(var(--rgb),.35);background:rgba(var(--rgb),.07);border-radius:14px;color:var(--ink);font-size:14px;line-height:1.45;cursor:pointer}
#myroqya-app label.wa input{flex:0 0 24px;width:24px;height:24px;margin:1px 0 0;accent-color:var(--accent)}
#myroqya-app label.wa b{font-weight:800}
#myroqya-app input.err,#myroqya-app textarea.err{border-color:var(--danger);box-shadow:0 0 0 3px rgba(192,57,43,.15)}
#myroqya-app input,#myroqya-app textarea{font-size:16px}

/* ---- v15 : intitulé « prochaines séances », autre ville ---- */
#myroqya-app p.lead{margin:-6px 0 14px;color:var(--muted);font-size:15px}
#myroqya-app .other{margin-top:16px;padding:18px;border:1.5px dashed rgba(var(--rgb),.5);border-radius:18px;background:rgba(var(--rgb),.06)}
#myroqya-app .other b{font-size:17px}
#myroqya-app .other p{margin:6px 0 12px;color:var(--muted);font-size:14px}
#myroqya-app a.btn.alt{display:block;text-align:center;text-decoration:none;margin-top:0}

/* ---- v16 : carte « à régler sur place », variantes plus chaleureuses (A, B, C) ---- */
#myroqya-app[data-pay] .card.pay{background:#fffaf0;border-color:#f0dfb8}
#myroqya-app[data-pay] .card.pay .ic{background:#fbecc8}
#myroqya-app[data-pay] .card.pay .t{font-size:18px}
#myroqya-app[data-pay] .card.pay .sb{font-size:15px}
#myroqya-app[data-pay] .chip{background:#fff;border:1px solid #ecd49a;color:#5b4210;font-size:15px;padding:6px 14px}
#myroqya-app[data-pay] .chip b{color:#9a6b12}
/* A : arrondie et douce */
#myroqya-app[data-pay="a"] .card.pay .t,#myroqya-app[data-pay="a"] .card.pay .sb,#myroqya-app[data-pay="a"] .chip{font-family:ui-rounded,'SF Pro Rounded','Avenir Next Rounded','Avenir Next','Nunito','Trebuchet MS',system-ui,sans-serif}
#myroqya-app[data-pay="a"] .card.pay .t{font-weight:800}
/* B : élégante (empattement) */
#myroqya-app[data-pay="b"] .card.pay .t,#myroqya-app[data-pay="b"] .card.pay .sb,#myroqya-app[data-pay="b"] .chip{font-family:Georgia,'Palatino Linotype','Book Antiqua',serif}
#myroqya-app[data-pay="b"] .card.pay .t{font-weight:700;font-size:19px}
#myroqya-app[data-pay="b"] .card.pay .sb{font-style:italic}
/* C : ton chaud, pastilles pleines */
#myroqya-app[data-pay="c"] .card.pay{background:#fff3dc;border-color:#e8c987}
#myroqya-app[data-pay="c"] .card.pay .t{color:#6b4a12;font-weight:800}
#myroqya-app[data-pay="c"] .card.pay .sb{color:#8a6a2c}
#myroqya-app[data-pay="c"] .chip{background:#f6d994;border-color:#e0b95e;color:#4d3407;font-weight:700}
#myroqya-app[data-pay="c"] .chip b{color:#4d3407}

/* ---- v17 : écran « horaires » sur téléphone ---- */
#myroqya-app .dayhead{margin:2px 0 14px}
#myroqya-app .dayhead b{display:block;font-family:'Arial Narrow','Roboto Condensed',Arial,sans-serif;font-size:30px;font-weight:800;text-transform:uppercase;line-height:1.05;color:var(--ink)}
#myroqya-app .dayhead span{color:var(--muted);font-size:17px}
#myroqya-app .slotlist{display:grid;gap:10px}
#myroqya-app .slotrow{width:100%;min-height:64px;margin:0;border:2px solid rgba(var(--rgb),.45);background:var(--card);color:var(--accent);border-radius:16px;font:inherit;font-size:24px;font-weight:800;cursor:pointer}
#myroqya-app .slotrow:active{background:var(--accent);color:var(--on)}

#myroqya-app label small.opt{display:inline-block;background:rgba(var(--rgb),.12);color:var(--accent);border-radius:99px;padding:1px 9px;font-size:12px;font-weight:700;margin-left:8px}

@media (max-width:759px){#myroqya-app .slotpanel.empty{display:none}#myroqya-app #next{display:none}}

/* ---- v18 : encadré WhatsApp, étiquette « facultatif » ---- */
#myroqya-app .wa-note{margin:10px 0 4px;padding:12px 14px;border-radius:14px;background:rgba(var(--rgb),.1);border:1px solid rgba(var(--rgb),.3);color:var(--ink);font-size:14px;line-height:1.5}
#myroqya-app label small.optional{display:inline-block;background:rgba(var(--rgb),.12);color:var(--accent);border-radius:99px;padding:1px 9px;font-size:12px;font-weight:700;margin-left:8px}

/* ---- v19 : typographie arrondie et fluide (fini les capitales condensées) ---- */
#myroqya-app{--font:ui-rounded,'SF Pro Rounded','Avenir Next Rounded','Avenir Next','Nunito','Quicksand','Segoe UI','Trebuchet MS',system-ui,-apple-system,sans-serif}
#myroqya-app,#myroqya-app button,#myroqya-app input,#myroqya-app textarea{font-family:var(--font)}
#myroqya-app h1.hero,#myroqya-app h2,#myroqya-app h2.city,#myroqya-app .ticket h3,#myroqya-app .price,#myroqya-app .dayhead b,#myroqya-app .card.stop .st,#myroqya-app .slotpanel.empty p,#myroqya-app .card .t{font-family:var(--font);text-transform:none;letter-spacing:0;font-weight:700}
#myroqya-app h1.hero{font-size:clamp(30px,7vw,46px);line-height:1.12;font-weight:800}
#myroqya-app h2{font-size:26px;line-height:1.2}
#myroqya-app h2.city{font-size:clamp(32px,7vw,46px);line-height:1.1;font-weight:800}
#myroqya-app .dayhead b{font-size:28px;font-weight:800;text-transform:capitalize}
#myroqya-app .card.stop .st{font-size:21px;font-weight:800}
#myroqya-app h3.know{text-transform:none;letter-spacing:0;font-size:17px;font-weight:700;color:var(--muted)}
#myroqya-app .ticket small{text-transform:none;letter-spacing:.02em;font-size:13px}
#myroqya-app .logo{letter-spacing:.14em}

/* ---- v20 : compte à rebours encadré ---- */
#myroqya-app .timer{text-align:center;margin:0 0 14px}
#myroqya-app .timer span{display:inline-block;padding:7px 16px;border-radius:12px;background:rgba(var(--rgb),.1);border:1px solid rgba(var(--rgb),.3);color:var(--ink);font-size:14px}
#myroqya-app .timer b{color:var(--accent);font-weight:800}

/* ---- v21 : thème « bleu nuit doux » (data-theme="night"), le clair reste disponible ---- */
#myroqya-app[data-theme="night"]{--bg:#0a1424;--card:#111f36;--ink:#eaf1fb;--muted:#9db0c9;--accent:#4f9cf0;--accent2:#8ec3fa;--gold:#4f9cf0;--line:#1e3354;--danger:#ff8a80;--rgb:79,156,240;--on:#06101f;--field:#08121f;border-color:rgba(var(--rgb),.25);box-shadow:0 10px 50px rgba(0,0,0,.35);background:radial-gradient(900px 360px at 50% -8%,rgba(var(--rgb),.14),transparent),var(--bg)}
#myroqya-app[data-theme="night"] .mark{background:#fff;border-radius:50%;padding:7px;mix-blend-mode:normal;filter:none}
#myroqya-app[data-theme="night"] header.compact .mark{padding:5px}
#myroqya-app[data-theme="night"] .card.pay,#myroqya-app[data-theme="night"][data-pay="c"] .card.pay{background:rgba(212,176,98,.12);border-color:#7a6130}
#myroqya-app[data-theme="night"][data-pay="c"] .card.pay .ic,#myroqya-app[data-theme="night"] .card.pay .ic{background:rgba(212,176,98,.22)}
#myroqya-app[data-theme="night"][data-pay="c"] .card.pay .t{color:#f1d99a}
#myroqya-app[data-theme="night"][data-pay="c"] .card.pay .sb{color:#cdb77f}
#myroqya-app[data-theme="night"][data-pay] .chip,#myroqya-app[data-theme="night"][data-pay="c"] .chip{background:rgba(212,176,98,.22);border-color:#9a7a38;color:#fbe9b5}
#myroqya-app[data-theme="night"][data-pay="c"] .chip b,#myroqya-app[data-theme="night"][data-pay] .chip b{color:#fbe9b5}
#myroqya-app[data-theme="night"] .card.must .chk{border-top-color:#7a6130}
#myroqya-app[data-theme="night"] .card.must{background:linear-gradient(120deg,rgba(255,207,74,.14),var(--card) 70%)}
#myroqya-app[data-theme="night"] .card.stop{box-shadow:0 4px 18px rgba(0,0,0,.25);border-color:#e0605a}
#myroqya-app[data-theme="night"] .card.stop .chk:has(input:checked),#myroqya-app[data-theme="night"] .card .chk:has(input:checked){color:var(--accent2)}
#myroqya-app[data-theme="night"] .ticket{border-color:rgba(var(--rgb),.3)}
#myroqya-app[data-theme="night"] input.err,#myroqya-app[data-theme="night"] textarea.err{box-shadow:0 0 0 3px rgba(255,138,128,.2)}

/* ---- v22 : titres lisibles sur fond sombre (le thème du site imposait sa couleur sombre aux h2/h3) ---- */
#myroqya-app h1,#myroqya-app h2,#myroqya-app h3,#myroqya-app h4{color:var(--ink)}
#myroqya-app h3.know{color:var(--muted)}
#myroqya-app h1.hero em{color:transparent}

/* ---- v23 : libellés des cases en graisse normale ---- */
#myroqya-app .card .chk,#myroqya-app .card .chk span,#myroqya-app .card.stop .chk{font-weight:500;font-size:16px}
#myroqya-app .card.stop .st{font-weight:700}

/* ---- v24 : carte « à régler sur place » plus sobre (moins de jaune, titre allégé) ---- */
#myroqya-app .card.pay .t{font-weight:600}
#myroqya-app .card.pay .chip{font-weight:500}
#myroqya-app .card.pay .chip b{font-weight:700}
#myroqya-app[data-theme="night"] .card.pay,#myroqya-app[data-theme="night"][data-pay="c"] .card.pay{background:var(--card);border-color:rgba(255,255,255,.14)}
#myroqya-app[data-theme="night"] .card.pay .ic,#myroqya-app[data-theme="night"][data-pay="c"] .card.pay .ic{background:rgba(255,255,255,.08)}
#myroqya-app[data-theme="night"][data-pay="c"] .card.pay .t{color:var(--ink)}
#myroqya-app[data-theme="night"][data-pay="c"] .card.pay .sb{color:var(--muted)}
#myroqya-app[data-theme="night"][data-pay] .chip,#myroqya-app[data-theme="night"][data-pay="c"] .chip{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:var(--ink)}
#myroqya-app[data-theme="night"][data-pay] .chip b,#myroqya-app[data-theme="night"][data-pay="c"] .chip b{color:#e9d9ae}

/* ---- v25 : titre de la carte « à régler sur place » au même poids que les autres titres de cartes ---- */
#myroqya-app[data-pay] .card.pay .t,#myroqya-app[data-pay="a"] .card.pay .t,#myroqya-app[data-pay="b"] .card.pay .t,#myroqya-app[data-pay="c"] .card.pay .t{font-weight:700;font-size:17px;letter-spacing:0}
#myroqya-app[data-pay] .card.pay .sb{font-weight:400;font-size:15px}
#myroqya-app[data-pay] .chip,#myroqya-app[data-pay="c"] .chip{font-weight:400;font-size:15px}
#myroqya-app[data-pay] .chip b,#myroqya-app[data-pay="c"] .chip b{font-weight:600}

/* ---- v26 : calendrier plus aéré (fini les « numéros de loto ») ---- */
#myroqya-app .cal{padding:14px}
#myroqya-app .cal-h{gap:4px;margin-bottom:12px}
#myroqya-app .cal-h b{flex:1;text-align:center;white-space:nowrap;font-size:20px}
#myroqya-app .cal-h button{width:44px;height:44px;font-size:26px;flex:0 0 44px}
#myroqya-app .grid{gap:8px 6px}
#myroqya-app .grid .dow{font-size:13px;font-weight:600;letter-spacing:.04em;opacity:.8;padding:2px 0 6px}
#myroqya-app .d{height:46px;font-size:18px;font-weight:600;border-radius:14px;opacity:.28}
#myroqya-app .d.av{font-weight:700;opacity:1;background:rgba(var(--rgb),.14);border:1px solid rgba(var(--rgb),.4)}
@media (max-width:759px){#myroqya-app{padding-left:12px;padding-right:12px}#myroqya-app .cal{padding:12px 8px}#myroqya-app .grid{gap:8px 4px}}

/* v27 : date et horaires en blanc, carte « cas non pris en charge » plus discrète */
#myroqya-app .dayhead span{color:var(--ink);font-size:20px;font-weight:600}
#myroqya-app .slotrow{color:var(--ink)}
#myroqya-app .slotrow:active{color:var(--on)}
#myroqya-app[data-theme="night"] .slot{color:var(--ink)}
#myroqya-app[data-theme="night"] .slot.sel{color:var(--on)}
#myroqya-app .card.stop{padding:14px}
#myroqya-app .card.stop .ic{width:40px;height:40px;flex-basis:40px;font-size:22px}
#myroqya-app .card.stop .st{font-size:17px;font-weight:700}
#myroqya-app .card.stop .why{font-size:12.5px;margin:2px 0 6px}
#myroqya-app .card.stop ul{font-size:14px;font-weight:400;line-height:1.45;color:var(--muted)}
#myroqya-app .card.stop .chk,#myroqya-app .card.stop .chk span{font-size:15px}
/* v28 : étape « ville » — lieu et prochaine date en blanc, plus grands */
#myroqya-app button.opt small{color:var(--ink);font-size:16px;font-weight:500;margin-top:4px;line-height:1.35}
#myroqya-app button.opt b{font-size:19px}
#myroqya-app button.opt small .nx{color:var(--muted)}
#myroqya-app button.opt small .nd{color:var(--ink);font-weight:700}

/* v29 : confirmation, paiement, réservation — retours du client */
#myroqya-app .ok .sum{font-size:17px}
#myroqya-app .ok .sum b{font-size:18px}
#myroqya-app .ok .sum div{padding:5px 0}
#myroqya-app .ok{padding:14px 0 0}
#myroqya-app .ok .muted:last-child{margin-bottom:0}
#myroqya-app .ticket .tnote{margin:14px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
/* paiement : deux formules de nuances différentes, informations plus discrètes */
#myroqya-app .opt[data-f="full"]{background:rgba(var(--rgb),.13);border-color:rgba(var(--rgb),.45)}
#myroqya-app .opt[data-f="deposit"]{background:rgba(95,199,199,.10);border-color:rgba(95,199,199,.38)}
#myroqya-app .opt[data-f="deposit"] .pill{background:rgba(95,199,199,.16);color:#8fdcdc}
#myroqya-app .opt[data-f="deposit"] .price{color:#8fdcdc}
#myroqya-app .opt[data-f].sel{box-shadow:0 0 0 2px var(--accent)}
#myroqya-app .opt[data-f="deposit"].sel{box-shadow:0 0 0 2px #8fdcdc}
#myroqya-app .trust div{background:var(--field);border:1px solid transparent;border-left:3px solid var(--line);border-radius:12px}
#myroqya-app .trust b{font-weight:600;font-size:15px}
/* ville absente de la liste : nuance chaude pour la distinguer des villes */
#myroqya-app .other{background:rgba(224,168,46,.07);border-color:rgba(224,168,46,.5)}
#myroqya-app .other b{color:#f0cf86}
#myroqya-app .ok .sum div:first-child{flex-direction:column;align-items:flex-start;gap:2px;padding-bottom:9px;margin-bottom:4px;border-bottom:1px solid var(--line)}
#myroqya-app .ok .sum div:first-child span{font-size:14px;color:var(--muted)}
#myroqya-app .ok .sum div:first-child b{font-size:21px;line-height:1.25;text-align:left}
/* v30 : plus d'air avant « Votre ville n'est pas dans la liste ? » */
#myroqya-app .other{margin-top:34px}

/* v31 : date en grand sous la ville, à l'étape « Bon à savoir » */
#myroqya-app .nextdate{margin:10px 0 4px;display:flex;flex-direction:column;gap:2px}
#myroqya-app .nextdate span{font-size:14px;color:var(--muted)}
#myroqya-app .nextdate b{font-size:24px;line-height:1.2;font-weight:800;color:var(--ink)}
#myroqya-app .nextdate b::first-letter{text-transform:uppercase}

/* v32 : détail du traitement en plus — une ligne par traitement, plus aéré */
#myroqya-app .card.pay .dt .pl{display:block;line-height:1.55}
#myroqya-app .card.pay .dt .pl + .pl{margin-top:12px}

/* v33 : l'acompte est mis en avant */
#myroqya-app .opt[data-f="deposit"]{background:rgba(95,199,199,.17);border:2px solid rgba(95,199,199,.7);box-shadow:0 0 26px rgba(95,199,199,.20)}
#myroqya-app .opt[data-f="deposit"] .price{font-size:1.1em}
#myroqya-app .opt[data-f="deposit"].sel{box-shadow:0 0 0 2px #8fdcdc,0 0 30px rgba(95,199,199,.30)}
#myroqya-app .pill.rec{background:#8fdcdc;color:#06242a;font-weight:700}

/* v34 : l'acompte ressort davantage, le paiement complet reste sobre */
#myroqya-app .opt[data-f="full"]{background:rgba(var(--rgb),.07);border:1.5px solid rgba(var(--rgb),.30)}
#myroqya-app .opt[data-f="full"] .price{font-size:1em;opacity:.9}
#myroqya-app .opt[data-f="deposit"]{background:rgba(95,199,199,.24);border:2.5px solid #8fdcdc;box-shadow:0 0 0 4px rgba(95,199,199,.14),0 10px 32px rgba(95,199,199,.30);padding-top:20px;padding-bottom:20px}
#myroqya-app .opt[data-f="deposit"] b{font-size:19px}
#myroqya-app .opt[data-f="deposit"] .price{font-size:1.25em}

/* v35 : même taille de prix pour les deux formules, plus d'air avant les informations */
#myroqya-app .opt[data-f="full"] .price,#myroqya-app .opt[data-f="deposit"] .price{font-size:1.2em;opacity:1}
#myroqya-app .opt[data-f="full"] .price{color:var(--accent)}
#myroqya-app .trust{margin-top:34px;gap:14px}
/* v36 : bouton WhatsApp aux couleurs de WhatsApp */
#myroqya-app .other .btn{background:#25D366;color:#06240f;box-shadow:0 6px 18px rgba(37,211,102,.28)}
#myroqya-app .other .btn:hover{background:#1fbd5a}

/* v37 : paiement sur la page (Stripe intégré) */
#myroqya-app .payembed{margin:18px 0 6px;border-radius:20px;overflow:hidden;background:#fff;min-height:60px}
#myroqya-app .payembed:empty{display:none}
#myroqya-app .payembed .payload{padding:22px;margin:0;color:#5d6b82;text-align:center;font-size:15px}

/* v38 : champs carte aux couleurs du site (Stripe Elements) */
#myroqya-app .payembed{background:transparent;border-radius:0;overflow:visible;margin:20px 0 8px}
#myroqya-app .cf{margin:0 0 14px}
#myroqya-app .cf label{display:block;margin:0 0 6px;font-weight:600;font-size:14px;color:var(--muted)}
#myroqya-app .cf-box{background:var(--field);border:1.5px solid var(--line);border-radius:14px;padding:17px 16px;min-height:56px;transition:border-color .15s,box-shadow .15s}
#myroqya-app .cf-box.StripeElement--focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--rgb),.2)}
#myroqya-app .cf-box.StripeElement--invalid{border-color:#e0605a}
#myroqya-app .cf2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#myroqya-app .cf-err{min-height:20px;margin:0 0 8px;color:#ff8a80;font-size:14px}
#myroqya-app .cf-note{margin:10px 0 0;text-align:center;font-size:13px;color:var(--muted)}

/* v39 : début de page allégé, villes mises en avant */
#myroqya-app header:not(.compact){padding-bottom:4px}
#myroqya-app h1.hero{margin-bottom:10px}
#myroqya-app .steps{margin-top:6px;margin-bottom:12px}
#myroqya-app button.opt b{font-size:25px;line-height:1.15;letter-spacing:-.2px}
#myroqya-app button.opt{padding:20px 20px;border:1.5px solid rgba(var(--rgb),.55);background:linear-gradient(135deg,rgba(var(--rgb),.14),rgba(var(--rgb),.04));box-shadow:0 0 0 1px rgba(var(--rgb),.18),0 10px 30px rgba(var(--rgb),.22)}
#myroqya-app button.opt:hover,#myroqya-app button.opt:active{border-color:var(--accent2);box-shadow:0 0 0 2px rgba(var(--rgb),.5),0 12px 36px rgba(var(--rgb),.35)}

#myroqya-app .opt .price{white-space:nowrap}
