/* booking.css — propriétaire : reservations (ordre de chargement = ordre de la cascade, voir index.html) */
/* Booking sheet */
.daychip{flex-direction:column;height:64px;width:64px;padding:0;justify-content:center;gap:0;border-radius:16px 16px 6px 6px;line-height:1.1}
.daychip small{font-size:11px;font-weight:600;color:var(--c-ink-3)}
.daychip b{font-family:var(--font-display);font-size:20px}
.daychip[aria-pressed="true"] small{color:var(--c-line)}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.cal .dw{font-size:11px;font-weight:700;color:var(--c-ink-3);padding:4px 0}
.cal button{height:44px;border-radius:10px;font-weight:600;font-variant-numeric:tabular-nums;position:relative}
.cal button:hover{background:var(--c-sunken)}
.cal button[disabled]{color:var(--c-ink-3);opacity:.45;cursor:default;background:none}
.cal button.in{background:var(--c-primary-soft);color:var(--c-on-primary-soft);border-radius:0}
.cal button.edge{background:var(--c-ink);color:var(--c-bg);border-radius:10px}
.cal button .today{position:absolute;bottom:5px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--c-primary)}
.stepper{display:inline-flex;align-items:center;gap:4px;background:var(--c-sunken);border-radius:var(--r-md);padding:4px}
.stepper button{width:44px;height:44px;border-radius:10px;display:grid;place-items:center}
.stepper button:hover{background:var(--c-surface)}
.stepper output{min-width:76px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.addr{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r-md);background:var(--c-sunken)}
.addr .ic{color:var(--c-primary)}
.recap{margin-top:20px;border-radius:var(--r-lg);background:var(--c-bg);padding:14px 16px;display:grid;gap:8px}
.recap .l{display:flex;justify-content:space-between;gap:12px;font-size:var(--fs-sm);color:var(--c-ink-2);font-variant-numeric:tabular-nums}
.recap .l s{color:var(--c-ink-3)}
.recap .tot{display:flex;justify-content:space-between;align-items:baseline;border-top:1px dashed var(--c-line-strong);padding-top:10px;font-weight:700}
.recap .tot .lek-p b{font-size:var(--fs-2xl)}
.recap .note{display:flex;gap:6px;align-items:flex-start;font-size:var(--fs-xs);color:var(--c-ink-2);font-weight:600}
.recap .note .ic{width:14px;height:14px;color:var(--c-primary);margin-top:1px}
textarea.input,.input{width:100%;min-height:52px;border-radius:var(--r-sm);background:var(--c-sunken);border:1.5px solid transparent;padding:12px 14px;font-size:16px;outline:none;transition:border-color var(--dur-fast),background var(--dur-fast);resize:none}
.input::placeholder{color:var(--c-ink-2)}
.input:focus{border:2px solid var(--c-primary);background:var(--c-surface);padding:11.5px 13.5px}
.help{font-size:var(--fs-xs);color:var(--c-ink-2);margin-top:6px;font-weight:600}

/* ============================ Sent / success ============================ */
.success{min-height:100%;display:flex;flex-direction:column;padding:24px var(--gutter) 24px;text-align:center;align-items:center}
.success .facade-big{width:220px;height:170px;margin-top:24px}
.success .facade-big svg,.hero-facade svg{width:100%;height:100%;display:block}
.success h1{margin-top:20px}
.success .lead{margin-top:8px;color:var(--c-ink-2);max-width:300px}
.steps{list-style:none;text-align:left;width:100%;margin-top:24px;display:grid;gap:0;background:var(--c-surface);border-radius:var(--r-lg);padding:6px 16px;box-shadow:var(--sh-1)}
.steps li{display:flex;gap:12px;padding:12px 0;align-items:flex-start;font-size:var(--fs-sm)}
.steps li+li{border-top:1px solid var(--c-line)}
.steps .n{width:26px;height:26px;border-radius:9px 9px 3px 3px;background:var(--c-primary-soft);color:var(--c-on-primary-soft);display:grid;place-items:center;font-family:var(--font-display);font-weight:700;flex:none;font-size:13px}
.install-card{display:flex;gap:12px;align-items:center;text-align:left;width:100%;margin-top:16px;padding:14px;border-radius:var(--r-lg);background:var(--c-mimoza-soft);color:var(--c-ink)}
.install-card .appicon{width:48px;height:48px;border-radius:12px}
.install-card .appicon .logo-e{font-size:32px}
.success .actions{width:100%;display:grid;gap:10px;margin-top:auto;padding-top:24px}

/* ============================ Bookings ============================ */
.bk{display:flex;gap:12px;align-items:center;background:var(--c-surface);border-radius:var(--r-lg);padding:12px;box-shadow:var(--sh-1);cursor:pointer;position:relative;transition:transform var(--dur-instant);animation:rise var(--dur-base) var(--ease-out) both}
.bk:active{transform:scale(.985)}
.bk .thumb{width:56px;flex:none}
.bk .thumb .pic{border-radius:14px 14px 4px 4px}
.bk .thumb .pic .pic-ic{width:60%;height:60%}
.bk .grow b{font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bk .grow .t-sm{color:var(--c-ink-2)}
.bk .st{margin-top:6px}
.bk .unread{position:absolute;top:10px;right:12px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--c-shega);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center}
.bk-acts{display:flex;gap:8px;margin-top:10px}
.bk-wrap{background:var(--c-surface);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:12px;animation:rise var(--dur-base) var(--ease-out) both;transition:opacity var(--dur-base),transform var(--dur-base) var(--ease-out)}
.bk-wrap .bk{box-shadow:none;padding:0;animation:none}
.bk-wrap.out{opacity:0;transform:translateX(40px)}
.group-h{padding:20px var(--gutter) 8px;font-size:var(--fs-sm);font-weight:700;color:var(--c-ink-2);display:flex;gap:8px;align-items:center}
.group-h .cnt{font-size:var(--fs-xs);background:var(--c-sunken);padding:1px 7px;border-radius:999px}
.review-cta{display:flex;gap:12px;align-items:center;margin:12px var(--gutter) 0;padding:14px;border-radius:var(--r-lg);background:var(--c-mimoza-soft)}
.review-cta .ic{color:var(--c-mimoza-text)}

/* Detail + timeline */
.tl{list-style:none;padding:4px var(--gutter) 0;display:grid}
.tl li{position:relative;display:flex;gap:14px;padding-bottom:18px}
.tl li::before{content:"";position:absolute;left:11px;top:24px;bottom:2px;width:2px;background:var(--c-line)}
.tl li.done::before{background:var(--c-primary)}
.tl li:last-child::before{display:none}
.tl .dot{width:24px;height:24px;border-radius:8px 8px 3px 3px;flex:none;display:grid;place-items:center;background:var(--c-surface);box-shadow:inset 0 0 0 2px var(--c-line);position:relative;z-index:1}
.tl li.done .dot{background:var(--c-primary);color:var(--c-on-primary);box-shadow:none}
.tl li.cur .dot{background:var(--c-mimoza);box-shadow:none;color:var(--c-on-mimoza)}
.tl li.cur .dot::after{content:"";position:absolute;inset:-5px;border-radius:11px 11px 5px 5px;border:2px solid var(--c-mimoza);opacity:.5;animation:halo2 1.6s var(--ease-out) infinite}
@keyframes halo2{0%{transform:scale(.9);opacity:.6}100%{transform:scale(1.25);opacity:0}}
.tl .dot .ic{width:14px;height:14px;stroke-width:3}
.tl b{font-weight:600;display:block;line-height:24px}
.tl .t-sm{color:var(--c-ink-2)}
.tl li.todo b{color:var(--c-ink-3);font-weight:600}
.info{margin:8px var(--gutter) 0}
.info .row+.row{margin-top:10px}
.info .row>.ic{color:var(--c-ink-3)}
.mask-note{display:flex;gap:6px;align-items:center;font-size:var(--fs-xs);font-weight:600;color:var(--c-ink-3);margin-top:2px}
.mask-note .ic{width:13px;height:13px}
.chat{margin:24px var(--gutter) 0}
.chat-h{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.chat-h h2{font-family:var(--font-display);font-weight:700;font-size:var(--fs-xl);flex:1}
.locked{position:relative;border-radius:var(--r-window);border:2px dashed var(--c-line-strong);padding:22px 18px;text-align:center;overflow:hidden}
.locked .ghost{display:grid;gap:8px;margin-bottom:16px;opacity:.6}
.locked .ghost i{display:block;height:30px;border-radius:14px;background:var(--c-skeleton);width:62%}
.locked .ghost i:nth-child(2){justify-self:end;width:48%}
.locked .ghost i:nth-child(3){width:38%}
.locked .lk{width:48px;height:48px;border-radius:16px 16px 6px 6px;background:var(--c-sunken);display:grid;place-items:center;margin:0 auto 10px}
.locked p{font-weight:600}
.msgs{display:flex;flex-direction:column;gap:6px}
.bub{max-width:80%;padding:10px 14px;border-radius:18px;font-size:var(--fs-base);line-height:1.4;animation:rise var(--dur-base) var(--ease-out) both}
.bub small{display:block;font-size:11px;margin-top:2px;opacity:.7;font-variant-numeric:tabular-nums}
.bub.them{align-self:flex-start;background:var(--c-surface);box-shadow:inset 0 0 0 1px var(--c-line);border-bottom-left-radius:6px}
.bub.me{align-self:flex-end;background:var(--c-primary);color:var(--c-on-primary);border-bottom-right-radius:6px}
.bub.sys{align-self:center;background:var(--c-primary-soft);color:var(--c-on-primary-soft);font-size:var(--fs-xs);font-weight:600;border-radius:999px;padding:6px 12px}
.typing{align-self:flex-start;display:flex;gap:4px;padding:14px 16px;border-radius:18px;background:var(--c-surface);box-shadow:inset 0 0 0 1px var(--c-line)}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--c-ink-3);animation:dots 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dots{0%,60%,100%{opacity:.3}30%{opacity:1}}
.safe{display:flex;gap:8px;align-items:center;padding:10px 12px;border-radius:var(--r-md);background:var(--c-mimoza-soft);color:var(--c-ink);font-size:var(--fs-xs);font-weight:600;margin-bottom:12px}
.safe .ic{width:16px;height:16px;color:var(--c-mimoza-text)}
.composer{position:sticky;bottom:0;display:flex;gap:8px;align-items:flex-end;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));background:var(--c-bg);border-top:1px solid var(--c-line);margin-top:16px;z-index:5}
.composer .input{min-height:48px;border-radius:24px;padding:12px 16px}
.composer .input:focus{padding:11.5px 15.5px}
.send{width:48px;height:48px;border-radius:50%;background:var(--c-primary);color:var(--c-on-primary);display:grid;place-items:center;flex:none;transition:transform var(--dur-instant)}
.send:active{transform:scale(.92)}
.readonly{text-align:center;font-size:var(--fs-xs);color:var(--c-ink-3);font-weight:600;padding:12px}
.demo{display:flex;gap:8px;align-items:center;justify-content:center;width:calc(100% - 32px);margin:16px var(--gutter) 0;min-height:44px;border-radius:var(--r-md);border:1.5px dashed var(--c-jargavan);color:var(--c-jargavan);font-size:var(--fs-sm);font-weight:700}
.demo .ic{width:16px;height:16px}
.handover{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.handover button{display:flex;gap:8px;align-items:center;justify-content:center;min-height:48px;border-radius:var(--r-md);background:var(--c-surface);box-shadow:inset 0 0 0 1px var(--c-line);font-size:var(--fs-sm);font-weight:600}
.handover button.ok{background:var(--c-primary-soft);color:var(--c-on-primary-soft);box-shadow:none}
.danger-link{display:flex;gap:6px;align-items:center;color:var(--c-ink-2);font-size:var(--fs-sm);font-weight:600;min-height:44px}

/* Stars input */
.stars-in{display:flex;justify-content:center;gap:6px;margin-top:8px}
.stars-in button{width:48px;height:48px;display:grid;place-items:center}
.stars-in .ic{width:40px;height:40px;stroke:var(--c-line-strong);stroke-width:1.5;transition:transform var(--dur-base) var(--ease-spring)}
.stars-in button.on .ic{fill:var(--c-mimoza);stroke:var(--c-mimoza-text);transform:scale(1.08)}
.stars-lbl{text-align:center;font-weight:600;color:var(--c-ink-2);min-height:24px;margin-top:6px}
