:root{
  --bg:#f3f7ff;
  --bg-soft:#eef4ff;
  --surface:rgba(255,255,255,.82);
  --surface-solid:#ffffff;
  --surface-2:#f8fbff;
  --text:#11213d;
  --muted:#62718f;
  --line:#d8e2fb;
  --accent:#2667ff;
  --accent-2:#00b8d9;
  --accent-3:#7b61ff;
  --success:#10b981;
  --warn:#f59e0b;
  --danger:#ef4444;
  --shadow:0 18px 50px rgba(24,39,75,.12);
  --radius:22px;
  --radius-sm:14px;
}
body.dark{
  --bg:#09111f;
  --bg-soft:#0d1728;
  --surface:rgba(14,24,41,.84);
  --surface-solid:#0f1a2b;
  --surface-2:#111f35;
  --text:#ecf4ff;
  --muted:#9bb0cf;
  --line:#203250;
  --accent:#58a6ff;
  --accent-2:#34d3c9;
  --accent-3:#9b8cff;
  --shadow:0 22px 60px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:radial-gradient(circle at top left,rgba(38,103,255,.14),transparent 28%),radial-gradient(circle at top right,rgba(0,184,217,.16),transparent 24%),linear-gradient(180deg,var(--bg),var(--bg-soft));min-height:100vh}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
input,select,textarea{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:14px;background:var(--surface-solid);color:var(--text);outline:none;transition:.2s}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(38,103,255,.12)}
textarea{min-height:92px;resize:vertical}
.hidden{display:none!important}
.small{font-size:.85rem}
.muted{color:var(--muted)}
.preline{white-space:pre-line}
.full{grid-column:1/-1}
.grow{flex:1}
.skip-link{position:absolute;left:-999px;top:-999px}
.skip-link:focus{left:12px;top:12px;background:#000;color:#fff;padding:8px 12px;z-index:1000;border-radius:10px}
.glassy{backdrop-filter:blur(16px)}
.lift{box-shadow:var(--shadow)}
.logo{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-weight:800;font-size:1.35rem;box-shadow:0 14px 28px rgba(38,103,255,.28)}
.logo.small{width:46px;height:46px;font-size:1rem;border-radius:15px}
.logo.lagoon{background:linear-gradient(135deg,#2f6bff 0%, #00b8d9 45%, #25d39f 100%)}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;font-weight:800;color:var(--accent)}
.primary,.btn,nav button,.side #logout,.quote-actions button,.link-btn{border:none;border-radius:14px;padding:12px 16px;transition:.2s}
.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-weight:700;box-shadow:0 10px 24px rgba(38,103,255,.28)}
.primary:hover{transform:translateY(-1px);filter:saturate(1.08)}
.btn,.side #logout,nav button,.icon-btn,.link-btn{background:var(--surface-solid);color:var(--text);border:1px solid var(--line)}
.btn:hover,.icon-btn:hover,nav button:hover,.side #logout:hover{background:var(--surface-2)}
.icon-btn{width:42px;height:42px;border-radius:12px;display:grid;place-items:center}
.form-message{margin-top:10px;font-size:.92rem;color:var(--muted)}
.form-message.error{color:var(--danger)}
.success-text{color:var(--success)}
.loading{position:fixed;inset:0;display:grid;place-items:center;background:rgba(8,14,28,.35);z-index:90;color:#fff}
.loading span{width:52px;height:52px;border-radius:999px;border:5px solid rgba(255,255,255,.35);border-top-color:#fff;display:block;animation:spin 1s linear infinite;margin:0 auto 10px}
@keyframes spin{to{transform:rotate(360deg)}}
.toast{position:fixed;right:20px;bottom:20px;z-index:95;background:var(--text);color:#fff;padding:14px 18px;border-radius:14px;box-shadow:var(--shadow)}
.toast.error{background:var(--danger)}
#scrollProgress{position:fixed;top:0;left:0;height:4px;background:linear-gradient(90deg,var(--accent),var(--accent-2));width:0;z-index:99}

.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.login-card{width:min(100%,560px);background:var(--surface);border:1px solid rgba(255,255,255,.5);border-radius:32px;padding:30px}
.login-brand{display:flex;gap:16px;align-items:flex-start;margin-bottom:22px}
.login-brand h1{margin:.15rem 0 .35rem;font-size:2rem}
.login-brand p{margin:0;color:var(--muted)}
.login-form{display:grid;gap:14px}
.password-wrap{position:relative}
.password-wrap .eye{position:absolute;right:8px;top:7px;border:none;background:none;color:var(--muted);padding:10px}

.app{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100vh}
.side{background:rgba(255,255,255,.58);backdrop-filter:blur(18px);border-right:1px solid rgba(255,255,255,.35);padding:18px 16px;display:flex;flex-direction:column;gap:16px;position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:14px;padding:8px 6px}
.side nav{display:grid;gap:8px}
.side nav button{text-align:left;font-weight:700;background:transparent}
.side nav button.active{background:linear-gradient(135deg,rgba(38,103,255,.18),rgba(0,184,217,.14));border-color:rgba(38,103,255,.25);color:var(--accent)}
.userbox{padding:16px;border:1px solid var(--line);background:var(--surface);border-radius:18px;display:grid;gap:8px}

.main{padding:20px;display:grid;gap:18px;min-width:0}
.top{display:flex;justify-content:space-between;gap:16px;padding:18px 20px;border-radius:24px;border:1px solid rgba(255,255,255,.4);background:var(--surface)}
.sticky-top{position:sticky;top:14px;z-index:40}
.mobile-top{display:flex;gap:14px;align-items:center}
.mobile-top h1{margin:.1rem 0}.mobile-top p{margin:0;color:var(--muted)}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.search-wrap{position:relative;min-width:260px}
.search-results{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--surface-solid);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;padding:10px;z-index:20;max-height:320px;overflow:auto}
.hero-band{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:24px;border-radius:28px;background:linear-gradient(135deg,rgba(38,103,255,.1),rgba(0,184,217,.12),rgba(123,97,255,.08));border:1px solid rgba(38,103,255,.16)}
.hero-band h2{margin:.3rem 0 .5rem;font-size:1.8rem}
.hero-band p{margin:0;color:var(--muted)}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.metric{padding:18px;border-radius:22px;color:#fff;position:relative;overflow:hidden}
.metric::after{content:"";position:absolute;inset:auto -30px -30px auto;width:110px;height:110px;border-radius:50%;background:rgba(255,255,255,.16)}
.metric span{display:block;font-size:.85rem;opacity:.9}
.metric strong{display:block;margin-top:10px;font-size:2rem}
.metric-link{width:100%;border:0;text-align:left;font:inherit;cursor:pointer;appearance:none;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}
.metric-link:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(24,39,75,.16);filter:saturate(1.04)}
.metric-link:active{transform:translateY(0)}
.metric-link-hint{margin-top:9px;font-size:.74rem;font-weight:700;opacity:.78}
.dashboard-link-card{width:100%;border:1px solid transparent;text-align:left;font:inherit;color:inherit;cursor:pointer;appearance:none;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.dashboard-link-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 28%,var(--line));box-shadow:0 12px 28px rgba(24,39,75,.10)}
.dashboard-link-card:active{transform:translateY(0)}
.dashboard-link-hint{display:block;margin-top:7px;color:var(--accent);font-size:.72rem;font-weight:750}
.gradient-a{background:linear-gradient(135deg,#215cf0,#539dff)}
.gradient-b{background:linear-gradient(135deg,#00a6d6,#23d1b8)}
.gradient-c{background:linear-gradient(135deg,#7b61ff,#b05cff)}
.gradient-d{background:linear-gradient(135deg,#0f9f7a,#47c98b)}
.two{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.panel,.card,.mini-card,.day,.checkout,.company-preview,.quote-card,.quote-total-box{background:var(--surface);border:1px solid rgba(255,255,255,.45);border-radius:24px}
.panel{overflow:hidden}
.ph{padding:18px 20px;border-bottom:1px solid rgba(216,226,251,.6);display:flex;justify-content:space-between;align-items:center;gap:12px}
.ph h2{margin:0}.ph p{margin:3px 0 0;color:var(--muted)}
.pb{padding:18px 20px}
.card,.mini-card{padding:14px 16px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.stack-cards{display:grid;gap:10px}
.mini-card{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.table{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{padding:13px 12px;border-bottom:1px solid rgba(216,226,251,.7);text-align:left;vertical-align:top}
th{font-size:.86rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.cell-sub{display:block;margin-top:6px;color:var(--muted);font-size:.86rem}
.agenda{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
.day{padding:15px}.day h4{margin:0 0 12px}.event{background:rgba(38,103,255,.08);border:1px solid rgba(38,103,255,.12);border-radius:14px;padding:10px;margin-top:8px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.stacked-form,.row-actions{display:grid;gap:12px}
.row{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.form-actions{display:flex;gap:10px;flex-wrap:wrap}
.checkline{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:14px;border:1px dashed var(--line);background:rgba(38,103,255,.04)}
.checkline input{width:auto}
.zone-public-toggle{align-items:flex-start}
.zone-public-toggle input{margin-top:3px;flex:0 0 auto}
.zone-public-toggle span{display:grid;gap:4px}
.zone-public-toggle small{display:block;color:var(--muted);font-weight:400;line-height:1.35}
.qline{position:relative;align-items:start;padding:14px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.45)}
.qline span{display:none}
.quote-table button{margin-right:6px;margin-bottom:6px}
.helper-inline{margin-top:6px;font-size:.9rem;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.field-stack{display:grid}
.mode-chip{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:.82rem;font-weight:600;white-space:nowrap;flex:0 0 auto;overflow-wrap:normal!important;word-break:normal!important}
.mode-chip.quote{background:rgba(123,97,255,.10);color:var(--accent-3)}
.mode-chip.direct{background:rgba(38,103,255,.10);color:var(--accent)}
.price.soft{font-size:1.18rem;font-weight:650}
.card h3{margin:0 0 10px}
.card p{margin:0;color:var(--muted)}
.card .row + .row{margin-top:10px}

.badge{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;background:rgba(38,103,255,.12);color:var(--accent);font-weight:700;font-size:.86rem}
.badge.success{background:rgba(16,185,129,.14);color:var(--success)}
.badge.warn{background:rgba(245,158,11,.14);color:var(--warn)}
.badge.info{background:rgba(38,103,255,.12);color:var(--accent)}
.notice{padding:16px 18px;border-radius:18px;background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.22)}
.company-layout{display:grid;grid-template-columns:320px 1fr;gap:18px;align-items:start}
.company-preview{padding:18px;position:sticky;top:102px}
.company-logo-box{height:122px;border:1px dashed var(--line);border-radius:22px;background:linear-gradient(135deg,rgba(38,103,255,.04),rgba(0,184,217,.05));display:grid;place-items:center;margin:12px 0 16px;overflow:hidden}
.company-logo-box.large{height:92px;width:92px;border-radius:20px;margin:0}
.company-logo-box img{max-width:100%;max-height:100%;display:block}
.upload-field label{display:block;margin-bottom:8px;font-weight:700}
.footer{padding:10px 0 20px;text-align:center;color:var(--muted)}
.link-btn{background:none;border:none;color:var(--accent);padding:0}
.drawer{position:fixed;top:16px;right:16px;bottom:16px;width:min(100%,460px);background:var(--surface-solid);border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);z-index:50;overflow:auto}
.drawer-head{padding:18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.back-top,.contact-float{position:fixed;right:20px;bottom:20px;z-index:45;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;border:none;border-radius:999px;padding:14px 16px;box-shadow:var(--shadow)}
.back-top{bottom:86px;width:48px;height:48px;display:grid;place-items:center}
.cookie-banner{position:fixed;left:20px;right:20px;bottom:20px;background:var(--surface);backdrop-filter:blur(14px);padding:18px;border-radius:24px;border:1px solid rgba(255,255,255,.45);box-shadow:var(--shadow);display:flex;justify-content:space-between;gap:18px;z-index:60}
.cookie-banner p{margin:.35rem 0 0;color:var(--muted)}
.search-results .result{padding:10px 12px;border-radius:12px}
.search-results .result:hover{background:rgba(38,103,255,.08)}
.mobile-only{display:none}

/* Public booking */
.public-wrap{max-width:1240px;margin:0 auto;padding:22px}
.public-head{display:flex;gap:16px;align-items:flex-start;padding:20px;border-radius:28px;background:var(--surface);border:1px solid rgba(255,255,255,.45);box-shadow:var(--shadow)}
.sticky-public{position:sticky;top:14px;z-index:25}
.public-tools{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.public-search{margin:18px 0}
.public-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:16px;align-items:start}
.checkout{padding:20px;position:sticky;top:120px}
.checkout h2{margin:.35rem 0 1rem}
.checkout label{display:block;font-weight:700;margin-top:12px;margin-bottom:6px}
.checkout-hint{margin:8px 0 0;color:var(--muted)}
.option-list{display:grid;gap:8px}
.option-item{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}
.slots{display:flex;flex-wrap:wrap;gap:8px}
.slots button{border:1px solid var(--line);background:var(--surface-solid);padding:10px 12px;border-radius:12px}
.slots button.active{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;border-color:transparent}
.summary{margin:14px 0;padding:14px;border-radius:18px;background:rgba(38,103,255,.06);border:1px solid rgba(38,103,255,.12)}
.faq{margin-top:18px}
details{border:1px solid var(--line);border-radius:16px;padding:14px;background:rgba(255,255,255,.45)}
details+details{margin-top:10px}
summary{font-weight:700;cursor:pointer}

/* Public quote */
.quote-wrap{max-width:1100px;margin:0 auto;padding:24px}
.quote-shell{padding:22px;border-radius:32px;background:var(--surface);border:1px solid rgba(255,255,255,.46)}
.quote-top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px}
.quote-brand{display:flex;gap:14px;align-items:center}
.quote-brand h1{margin:.2rem 0}
.quote-head-grid,.quote-summary-grid,.quote-meta-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.quote-meta-grid{grid-template-columns:repeat(3,1fr);padding:16px 0;border-top:1px solid rgba(216,226,251,.7);border-bottom:1px solid rgba(216,226,251,.7);margin:14px 0 18px}
.quote-card{padding:16px}
.quote-lines-table{margin:16px 0}
.quote-total-box{padding:18px;display:grid;gap:10px}
.quote-total-box>div{display:flex;justify-content:space-between;gap:10px}
.grand-total{padding-top:10px;margin-top:8px;border-top:1px dashed var(--line);font-size:1.1rem}
.quote-acceptance{margin-top:18px;padding:18px;border-radius:24px;background:linear-gradient(135deg,rgba(38,103,255,.08),rgba(0,184,217,.08));border:1px solid rgba(38,103,255,.12)}
.no-print{display:block}

.accounting-export-box{display:grid;grid-template-columns:minmax(260px,1fr) 180px auto;gap:14px;align-items:end;padding:16px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg,rgba(38,103,255,.06),rgba(0,184,217,.05))}
.accounting-export-copy h3{margin:.2rem 0 .35rem}.accounting-export-copy p{margin:0}.accounting-actions{display:flex;grid-auto-flow:column;align-items:end}.accounting-month input{width:100%}
.panel-soft{padding:16px;border:1px solid var(--line);border-radius:20px;background:var(--soft)}
.sms-credit-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}
.sms-credit-summary>div{padding:12px;border-radius:14px;background:var(--surface)}
.sms-credit-summary small{display:block;color:var(--muted);margin-bottom:5px}.sms-credit-summary b{font-size:1.25rem}
.credit-positive{color:#147d64}.credit-negative{color:#b42318}
.sales-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sales-grid .card{background:rgba(255,255,255,.48)}
.price{font-weight:700;font-size:1.38rem;line-height:1.1;margin-top:10px}

@media (max-width:1100px){
  .metrics,.agenda,.quote-head-grid,.quote-summary-grid,.quote-meta-grid{grid-template-columns:repeat(2,1fr)}
  .two,.company-layout,.public-layout{grid-template-columns:1fr}
  .checkout,.company-preview{position:static}
}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .side{position:fixed;left:0;top:0;bottom:0;width:280px;z-index:70;transform:translateX(-105%);transition:.25s}
  .side.open{transform:none}
  .mobile-only{display:grid}
  .top{padding:16px;top:8px}
  .toolbar{justify-content:flex-start}
  .metrics,.agenda,.grid2,.quote-head-grid,.quote-summary-grid,.quote-meta-grid{grid-template-columns:1fr}
  .cookie-banner{left:12px;right:12px;bottom:12px;flex-direction:column}
  .public-head,.quote-top,.hero-band{flex-direction:column}
}
@media print{
  body{background:#fff}
  .no-print,.side,.top,.footer,.cookie-banner,.back-top,.contact-float,.hero-band .btn,.hero-band .primary{display:none!important}
  .app{display:block}
  .main,.quote-wrap,.public-wrap{padding:0}
  .panel,.quote-shell,.public-head,.checkout{box-shadow:none;border:1px solid #ddd;background:#fff}
}

/* ===== V9 Lagoon Pro ===== */
:root{--touch:46px;--company-accent:var(--accent)}
body{font-feature-settings:"tnum" 1,"ss01" 1}
button,.btn,.primary,input,select,textarea{min-height:var(--touch)}
button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 35%,transparent);outline-offset:2px}
.service-card{display:flex;flex-direction:column;gap:14px;min-height:250px;padding:18px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.service-card:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(24,39,75,.10);border-color:color-mix(in srgb,var(--accent) 28%,var(--line))}
.service-card.is-selected{border-color:color-mix(in srgb,var(--accent) 65%,var(--line));box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 12%,transparent),0 18px 36px rgba(24,39,75,.10)}
.service-card.is-selected [data-service]{background:color-mix(in srgb,var(--accent) 82%,#0b8f77);box-shadow:none}
.service-card-top{display:flex;gap:10px;justify-content:space-between;align-items:flex-start}
.service-card-top h3{margin:0;line-height:1.22}
.service-card p{flex:1;line-height:1.45}
.service-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.duration-chip{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:.84rem;font-weight:600}
.service-edit{width:100%}
.empty-state{display:grid;gap:6px;place-items:center;text-align:center;padding:34px;border:1px dashed var(--line);border-radius:20px;color:var(--muted)}
.edit-surface{padding:16px;border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));border-radius:20px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 5%,var(--surface-solid)),var(--surface-solid))}
.setup-card{display:grid;grid-template-columns:minmax(220px,1fr) minmax(180px,340px) auto;gap:18px;align-items:center;padding:18px 20px;border-radius:22px;background:var(--surface);border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line))}
.setup-card h3{margin:.2rem 0}.setup-card p{margin:0}
.setup-progress{height:10px;background:var(--surface-2);border-radius:999px;overflow:hidden;border:1px solid var(--line)}
.setup-progress>div{height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .3s ease;border-radius:inherit}
.preview-title,.public-title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.preview-title h3,.public-title-row h1{margin:.15rem 0}
.verified-badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 9px;background:rgba(16,185,129,.12);color:var(--success);font-weight:750;font-size:.78rem;border:1px solid rgba(16,185,129,.2)}
.verify-btn{border:1px solid var(--line);background:var(--surface-solid);color:var(--text);border-radius:12px;padding:8px 10px;min-height:38px}
.verify-btn.is-verified{background:rgba(16,185,129,.10);color:var(--success);border-color:rgba(16,185,129,.22)}
.brand-color-field{display:grid;gap:6px}.brand-color-field label{font-weight:700;font-size:.88rem}.brand-color-field input[type=color]{padding:5px;height:46px}

.modal-backdrop{position:fixed;inset:0;background:rgba(4,12,26,.48);backdrop-filter:blur(8px);z-index:100;display:grid;place-items:center;padding:18px}
.modal-card,.quick-sheet{width:min(100%,620px);background:var(--surface-solid);border:1px solid var(--line);border-radius:28px;box-shadow:0 30px 80px rgba(0,0,0,.3);padding:20px}
.quick-sheet{width:min(100%,540px)}
.sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}.sheet-head h2{margin:.2rem 0}
.sheet-handle{display:none;width:44px;height:5px;border-radius:999px;background:var(--line);margin:0 auto 12px}
.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.quick-grid button{display:grid;text-align:left;gap:5px;padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2);color:var(--text)}
.quick-grid button:hover{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--surface-2))}
.quick-grid small{color:var(--muted)}
.quick-fab{display:none;position:fixed;right:18px;bottom:92px;width:56px;height:56px;min-height:56px;border:none;border-radius:18px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-size:1.8rem;box-shadow:0 18px 36px rgba(38,103,255,.34);z-index:48}
.mobile-tabs{display:none}
.offline-banner{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:110;background:#172033;color:#fff;padding:11px 15px;border-radius:999px;box-shadow:var(--shadow);font-size:.88rem;max-width:calc(100% - 24px);text-align:center}
.public-brand-logo{width:58px;min-width:58px;height:58px}.public-brand-logo img{width:58px;height:58px;object-fit:contain;border-radius:16px;background:#fff;border:1px solid var(--line);padding:4px}
.change-panel{margin-top:14px;background:var(--surface-2)}.change-panel textarea{margin-top:12px}.action-space{margin-top:12px}.badge.neutral{background:rgba(100,116,139,.12);color:var(--muted)}

@media(max-width:860px){
  body{padding-bottom:82px}
  .main{padding:10px 10px 24px;gap:12px}
  .top{border-radius:18px;padding:12px;position:sticky;top:6px;flex-direction:column;align-items:stretch}
  .mobile-top{width:100%;min-width:0}
  .mobile-top>div{min-width:0}
  .mobile-top h1,.mobile-top p{overflow-wrap:anywhere}
  .top .toolbar{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .top .search-wrap,.top .search-wrap input{width:100%;min-width:0}
  .side{overflow-y:auto;overscroll-behavior:contain;padding-bottom:calc(18px + env(safe-area-inset-bottom))}
  .side nav{flex:0 0 auto}
  .side .userbox{flex:0 0 auto}
  .top .toolbar>.btn:not(#darkToggle),.top .toolbar>a,.top .toolbar>#quickClient{display:none}
  .search-wrap{min-width:0;width:100%}
  .hero-band{border-radius:22px;padding:18px}.hero-band h2{font-size:1.45rem}
  .hero-actions .btn:not(#heroQuick),.hero-actions a{display:none}
  .metrics{grid-template-columns:repeat(2,1fr);gap:10px}.metric{padding:15px;border-radius:18px}.metric strong{font-size:1.5rem}
  .setup-card{grid-template-columns:1fr;gap:12px}
  .panel{border-radius:20px}.ph,.pb{padding:15px}
  .cards{grid-template-columns:1fr}
  .service-card{min-height:0}
  .table{margin-left:-4px;margin-right:-4px;padding-bottom:4px}.table table{min-width:680px}
  .agenda{display:flex;overflow:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.day{min-width:78vw;scroll-snap-align:start}
  .mobile-tabs{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));z-index:65;background:color-mix(in srgb,var(--surface-solid) 88%,transparent);backdrop-filter:blur(18px);border:1px solid var(--line);border-radius:22px;padding:6px;box-shadow:0 18px 50px rgba(10,23,48,.2)}
  .mobile-tabs button{display:grid;place-items:center;gap:1px;border:none;background:transparent;color:var(--muted);padding:7px 4px;min-height:52px;border-radius:15px}
  .mobile-tabs button span{font-size:1.05rem}.mobile-tabs button small{font-size:.68rem}.mobile-tabs button.active{background:color-mix(in srgb,var(--accent) 11%,var(--surface-solid));color:var(--accent);font-weight:750}
  .quick-fab{display:grid;place-items:center}
  .back-top{display:none!important}
  .quick-sheet{position:fixed;left:8px;right:8px;bottom:max(78px,calc(env(safe-area-inset-bottom) + 78px));width:auto;border-radius:26px;padding:14px 16px 18px}.sheet-handle{display:block}
  .modal-backdrop{align-items:end;padding:8px}.modal-card{border-radius:26px 26px 18px 18px;max-height:82vh;overflow:auto}
  .quick-grid{grid-template-columns:1fr 1fr}
  .cookie-banner{bottom:86px}
  .offline-banner{bottom:88px;border-radius:16px}
  .drawer{top:auto;left:8px;right:8px;bottom:84px;width:auto;max-height:78vh;border-radius:26px}
  .company-layout{gap:12px}.company-preview{display:none}
  .quote-actions{width:100%;display:flex;gap:8px;overflow:auto}.quote-actions .btn{white-space:nowrap}
  .quote-shell{padding:14px;border-radius:22px}.quote-wrap{padding:10px}
  .quote-meta-grid{grid-template-columns:1fr}.quote-summary-grid{grid-template-columns:1fr}
  .public-wrap{padding:10px}.public-head{border-radius:20px;padding:14px}.public-tools{width:100%;overflow:auto}.public-tools .btn{white-space:nowrap}.checkout{padding:16px}
}
@media(max-width:480px){
  .top .toolbar{grid-template-columns:minmax(0,1fr) auto}
  .search-wrap input{font-size:16px}
  .metrics{grid-template-columns:1fr 1fr}.metric span{font-size:.76rem}.metric strong{font-size:1.28rem}
  .quick-grid{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .hero-actions{width:100%}.hero-actions button{width:100%}
}
.tenant-switcher{width:auto;min-width:180px;max-width:260px;font-weight:700;background:var(--surface-solid)}
@media(max-width:860px){.tenant-switcher{grid-column:1/-1;width:100%;max-width:none}}

/* ===== V001 retained foundations ===== */
.top-gap{margin-top:16px}
.info-notice{background:rgba(38,103,255,.08);border-color:rgba(38,103,255,.18)}
.public-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.open-status,.rating-summary{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:.82rem;font-weight:700}
.open-status.is-open{background:rgba(16,185,129,.13);color:var(--success)}
.open-status.is-closed{background:rgba(98,113,143,.12);color:var(--muted)}
.rating-summary{background:rgba(245,158,11,.12);color:#b56a00}
.public-showcase{margin:18px 0;padding:20px;border-radius:28px;background:var(--surface);border:1px solid rgba(255,255,255,.45);box-shadow:var(--shadow)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:12px;margin-bottom:14px}
.section-heading h2{margin:.2rem 0 0}
.public-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;overflow:auto}
.public-gallery figure{margin:0;min-width:180px;border-radius:18px;overflow:hidden;background:var(--surface-2);border:1px solid var(--line)}
.public-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.public-gallery figcaption{padding:9px 10px;color:var(--muted);font-size:.85rem}
.public-staff{display:flex;align-items:center;gap:12px}
.staff-avatar{width:48px;height:48px;border-radius:16px;color:#fff;display:grid;place-items:center;font-weight:800;flex:0 0 auto}
.review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.review-card{padding:16px;border-radius:18px;background:var(--surface-2);border:1px solid var(--line)}
.review-card p{margin:.65rem 0}.stars{color:#e59500;letter-spacing:.04em}
.waitlist-callout,.client-hub-callout{margin:14px 0;padding:14px;border-radius:18px;background:rgba(123,97,255,.08);border:1px solid rgba(123,97,255,.18)}
.waitlist-callout p,.client-hub-callout p{margin:.35rem 0 .75rem;color:var(--muted)}
.gallery-admin{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.gallery-admin-item{margin:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--surface-2)}
.gallery-admin-item img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.gallery-admin-item figcaption{padding:10px}.gallery-admin-item button{margin:0 10px 10px}
.review-admin,.audit-item,.hub-row{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line)}
.review-admin p{margin:.4rem 0}.audit-item{display:grid}.audit-item span,.audit-item small,.hub-row small{color:var(--muted);display:block;margin-top:4px}
.staff-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px}.staff-dot{width:14px;height:48px;border-radius:999px}
.checkline.compact{padding:9px 12px;font-size:.88rem}.qline{grid-template-columns:1.4fr .55fr .8fr 1fr auto}
.quote-option-select{display:flex;align-items:flex-start;gap:9px}.quote-option-select input{width:auto;margin-top:4px}.quote-option-select small{display:inline-flex;margin-left:6px;padding:2px 7px;border-radius:999px;background:rgba(123,97,255,.1);color:var(--accent-3)}
.optional-quote-line{background:rgba(123,97,255,.035)}
.client-hub-wrap{max-width:1080px;margin:0 auto;padding:22px;display:grid;gap:16px}.client-hub-head{display:flex;gap:16px;align-items:center;padding:20px;border-radius:28px;background:var(--surface);border:1px solid rgba(255,255,255,.45)}.client-welcome{margin:0}.hub-row{text-decoration:none;color:inherit;align-items:center}.hub-row:hover{background:rgba(38,103,255,.035)}

@media (max-width:900px){
  .public-gallery{grid-template-columns:repeat(2,minmax(180px,1fr))}
  .gallery-admin{grid-template-columns:1fr}
  .qline{grid-template-columns:1fr 1fr}.qline .desc,.qline .checkline{grid-column:1/-1}
}
@media (max-width:600px){
  .public-wrap,.quote-wrap,.client-hub-wrap{padding:10px}
  .public-head,.client-hub-head{border-radius:22px;padding:14px}
  .public-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px}.public-gallery figure{min-width:78%;scroll-snap-align:start}
  .public-tools .btn{padding:10px 12px}
  .checkout{padding:16px}
  .review-grid{grid-template-columns:1fr}
  .staff-card{grid-template-columns:auto 1fr}.staff-card button{grid-column:1/-1}
  .hub-row{display:grid}.hub-row>div:last-child{text-align:left}
}

.hub-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
@media(max-width:680px){.hub-actions{justify-content:flex-start;width:100%}.hub-row{align-items:flex-start}}

/* V001 Communications */
.comm-provider-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px}.provider-card{padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--card)}.provider-card .provider-state{display:flex;align-items:center;gap:8px;margin-top:8px}.status-dot{width:10px;height:10px;border-radius:50%;background:#94a3b8}.status-dot.ok{background:#16a34a}.status-dot.warn{background:#f59e0b}.compact-metrics{grid-template-columns:repeat(4,minmax(0,1fr));margin:14px 0}.comm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.comm-events{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.comm-events>div{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card)}.comm-events label{font-size:.88rem;display:flex;align-items:center;gap:5px}.template-details{border:1px solid var(--line);border-radius:16px;padding:14px;background:var(--card)}.template-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.template-grid label{font-weight:700}.template-grid textarea{display:block;width:100%;min-height:95px;margin-top:7px}.comm-test-grid{margin:18px 0}.comm-test-grid .card{display:grid;gap:10px}.section-title{margin-top:6px}.section-title h3{margin-bottom:3px}.notice.subtle{background:color-mix(in srgb,var(--accent) 7%,transparent);border-color:color-mix(in srgb,var(--accent) 20%,var(--line));font-size:.9rem}.badge.failed{background:rgba(220,38,38,.12);color:#b91c1c}.badge.queued{background:rgba(245,158,11,.14);color:#b45309}.badge.delivered{background:rgba(22,163,74,.13);color:#15803d}
@media(max-width:800px){.comm-provider-grid,.compact-metrics,.comm-grid,.comm-events,.template-grid{grid-template-columns:1fr}.comm-events>div{grid-template-columns:1fr auto auto}.comm-test-grid{grid-template-columns:1fr}.table{overflow-x:auto;-webkit-overflow-scrolling:touch}.comm-provider-grid{gap:10px}}

/* V001 - abonnements, quotas et fonctions verrouillées */
.plan-badge{display:inline-flex;align-items:center;gap:6px;width:max-content;padding:5px 9px;border-radius:999px;background:rgba(38,103,255,.12);color:var(--accent);font-weight:800;font-size:.76rem;text-transform:uppercase;letter-spacing:.04em}
.plan-banner{margin:14px 0;padding:12px 16px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(135deg,rgba(38,103,255,.09),rgba(0,169,184,.08));color:var(--text)}
.plan-banner strong{color:var(--accent)}
.plan-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0;padding:14px;border:1px solid var(--line);border-radius:20px;background:var(--panel)}
.plan-overview .plan-stat{padding:10px 12px;border-radius:14px;background:var(--soft);min-height:76px}
.plan-overview .plan-stat small{display:block;color:var(--muted);margin-bottom:4px}
.plan-overview .plan-stat b{font-size:1.05rem}
.plan-locked{opacity:.58;position:relative}
.side nav button.plan-locked::after{content:'🔒';float:right;font-size:.82rem}
.plan-lock-card{padding:16px;border:1px dashed var(--line);border-radius:16px;background:var(--soft);color:var(--muted)}
[data-plan-control].plan-disabled{opacity:.48;filter:grayscale(.2)}
[data-plan-control].plan-disabled input,[data-plan-control].plan-disabled textarea,[data-plan-control].plan-disabled select,[data-plan-control].plan-disabled button{pointer-events:none}
.quota-bar{height:7px;border-radius:999px;background:var(--line);overflow:hidden;margin-top:7px}.quota-bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:999px}
.plan-admin-controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.plan-admin-controls select{min-width:110px}.credit-chip{display:inline-flex;padding:4px 8px;border-radius:999px;background:var(--soft);font-size:.78rem;color:var(--muted)}
.user-status{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:.78rem;font-weight:700}.user-status.active{background:rgba(20,125,100,.12);color:#147d64}.user-status.off{background:rgba(100,116,139,.12);color:var(--muted)}
@media(max-width:900px){.plan-overview{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.plan-overview{grid-template-columns:1fr 1fr;padding:10px;gap:8px}.plan-overview .plan-stat{padding:9px}.plan-banner{margin:10px 0;font-size:.9rem}}

/* ===== V001 UX & mobile hardening ===== */
html,body{width:100%;max-width:100%;overflow-x:hidden}
.public-wrap,.public-head,.public-showcase,.public-layout,.panel,.checkout,.client-hub-wrap,.quote-wrap{min-width:0;max-width:100%}
.quota-notice{margin-top:5px;color:var(--danger,#dc2626);font-size:.85rem;font-weight:700}
.quota-disabled{opacity:.55;cursor:not-allowed}
.access-state{display:inline-flex;margin-top:7px;padding:4px 8px;border-radius:999px;background:var(--soft);color:var(--muted);font-size:.76rem;font-weight:700}
.access-state.linked{background:rgba(20,125,100,.12);color:#147d64}
.staff-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.gallery-admin-item{position:relative}
.gallery-admin-item.is-private{opacity:.72}
.gallery-status{position:absolute;z-index:2;top:9px;left:9px;padding:5px 8px;border-radius:999px;background:rgba(15,23,42,.84);color:#fff;font-size:.74rem;font-weight:800;backdrop-filter:blur(5px)}
.gallery-admin-item.is-public .gallery-status{background:rgba(20,125,100,.88)}
.gallery-actions{display:flex;gap:7px;flex-wrap:wrap;padding:0 10px 10px}
.gallery-admin-item button{margin:0}
.form-message.info{color:var(--muted);background:var(--soft);border:1px solid var(--line);padding:8px 10px;border-radius:12px;margin-top:8px}

/* Galerie publique responsive validée sur iPhone 11, généralisée iOS/Android */
.public-gallery{width:100%;max-width:100%}
.public-gallery figure{max-width:100%}
.public-gallery img{display:block;width:100%;max-width:100%;height:auto;object-fit:cover}

@media(max-width:900px){
  .staff-actions{grid-column:1/-1;justify-content:flex-start}
}
@media(max-width:600px){
  body{overflow-x:hidden}
  .public-showcase{padding:14px;overflow:hidden}
  .public-gallery{display:flex;width:100%;max-width:100%;gap:10px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;padding-bottom:4px}
  .public-gallery figure{flex:0 0 84%;width:84%;min-width:0;max-width:84%;scroll-snap-align:start}
  .public-gallery img{width:100%;max-width:100%;aspect-ratio:4/3;height:auto;object-fit:cover}
  .gallery-admin{grid-template-columns:1fr}
  .gallery-actions .btn{flex:1 1 140px}
  .modal-card{max-width:calc(100vw - 20px);max-height:calc(100vh - 20px);overflow:auto}
  input,select,textarea,button{max-width:100%}
}
@media(max-width:390px){
  .public-gallery figure{flex-basis:88%;width:88%;max-width:88%}
  .plan-overview{grid-template-columns:1fr}
  .metrics{grid-template-columns:1fr}
}

/* V001 - Super Admin live presence */
.presence-live-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:12px;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2)}
.presence-live-head h3{margin:.15rem 0 .25rem}.presence-live-head p{margin:0}
.presence-feed{display:grid;gap:8px;margin-bottom:18px}
.presence-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.presence-row small{display:block;color:var(--muted);margin-top:3px}
.presence-dot{width:10px;height:10px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px rgba(16,185,129,.12);flex:0 0 auto}
.presence-dot.offline{background:var(--muted);box-shadow:0 0 0 4px rgba(100,116,139,.12)}
@media(max-width:600px){.presence-live-head{align-items:stretch;flex-direction:column}.presence-live-head .btn{width:100%}}

/* V001 - product updates */
.updates-btn{position:relative;white-space:nowrap}
.updates-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:5px;border-radius:999px;background:var(--company-accent,#2667ff);color:#fff;font-size:.72rem;font-weight:700}
.update-card{max-width:520px}
.update-list{display:grid;gap:10px;margin:14px 0 18px;padding-left:22px}
.update-list li{line-height:1.45}
.update-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}
@media(max-width:600px){.updates-btn{font-size:0;padding:10px}.updates-btn:before{content:'N';font-size:.9rem;font-weight:800}.updates-badge{font-size:.68rem}.update-card{margin:14px}}

/* V001 - visible update card on dashboard */
.updates-home-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}
.updates-home-card h3{margin:.15rem 0 .25rem}.updates-home-card p{margin:0}
@media(max-width:600px){.updates-home-card{align-items:stretch;flex-direction:column}.updates-home-card .btn{width:100%}}

/* V001 - persistent Super Admin activity notifications */
.live-activity-panel{position:fixed;right:18px;top:92px;z-index:130;width:min(420px,calc(100vw - 28px));max-height:70vh;overflow:auto;background:var(--surface-solid);border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.24);padding:14px}
.live-activity-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.live-activity-head small{display:block;color:var(--muted);margin-top:2px}
.live-notice{display:grid;gap:3px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;margin-top:8px;background:var(--surface)}
.live-notice.online{border-left:4px solid var(--success)}
.live-notice.offline{border-left:4px solid var(--danger)}
.live-notice span,.live-notice small{color:var(--muted)}
@media(max-width:600px){.live-activity-panel{top:74px;right:10px;width:calc(100vw - 20px)}}

/* V001 - persistent per-user notifications */
.account-notice{display:grid;gap:4px;padding:11px 12px;border:1px solid var(--line);border-left:4px solid var(--company-accent,#2667ff);border-radius:12px;margin-top:8px;background:var(--surface)}
.account-notice.read{opacity:.72;border-left-color:var(--muted)}
.account-notice span,.account-notice small{color:var(--muted)}

/* V001 - Emoji picker */
.emoji-toggle{font-size:1rem;min-width:44px}
.emoji-panel{position:fixed;right:18px;top:92px;z-index:145;width:min(360px,calc(100vw - 28px));background:var(--surface-solid);border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.24);padding:12px}
.emoji-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;max-height:280px;overflow:auto;padding:4px 0 8px}
.emoji-choice{display:grid;place-items:center;min-width:36px;min-height:36px;padding:4px;border:1px solid transparent;border-radius:10px;background:var(--surface-2);font-size:1.25rem;cursor:pointer}
.emoji-choice:hover,.emoji-choice:focus-visible{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--surface-2))}
@media(max-width:600px){.emoji-panel{top:74px;right:10px;width:calc(100vw - 20px)}.emoji-grid{grid-template-columns:repeat(7,1fr)}}

/* V001 - agenda multi-échelle */
.calendar-panel{overflow:visible}
.calendar-head{align-items:flex-start;flex-wrap:wrap}
.calendar-view-switch{display:flex;gap:8px;flex-wrap:wrap}
.agenda-view-btn.active{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;border-color:transparent;box-shadow:0 10px 24px rgba(38,103,255,.18)}
.calendar-toolbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 92%,transparent)}
.calendar-nav{display:flex;gap:8px;align-items:center}.calendar-title{margin:0;text-align:center;text-transform:capitalize}
.calendar-jump{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.86rem}.calendar-jump input{width:auto;min-width:150px}
.calendar-body{overflow:hidden}
.calendar-scroll{overflow-x:auto;overscroll-behavior-inline:contain;padding-bottom:4px}
.calendar-years{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.calendar-year-card{border:1px solid var(--line);border-radius:18px;padding:14px;background:var(--surface)}
.calendar-year-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.calendar-year-head h3{margin:0;font-size:1.35rem}.calendar-year-head span{color:var(--muted);font-size:.85rem}
.year-months{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.year-month{border:1px solid var(--line);background:var(--surface-2);border-radius:11px;padding:8px 6px;display:grid;gap:2px;cursor:pointer;color:inherit}.year-month span{font-size:.75rem;color:var(--muted)}.year-month b{font-size:.9rem}.year-month:hover{border-color:var(--accent)}
.calendar-month-grid{min-width:760px}.calendar-weekdays,.calendar-month-days{display:grid;grid-template-columns:repeat(7,1fr)}.calendar-weekdays span{padding:8px 10px;text-align:center;color:var(--muted);font-size:.82rem;font-weight:700}
.month-day{min-height:132px;text-align:left;border:1px solid var(--line);background:var(--surface);color:inherit;padding:8px;cursor:pointer;overflow:hidden}.month-day:hover{background:var(--surface-2)}.month-day.outside{opacity:.48}.month-day.today{box-shadow:inset 0 0 0 2px var(--accent)}.month-day-num{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:999px;font-weight:750}.month-day.today .month-day-num{background:var(--accent);color:#fff}
.month-events{display:grid;gap:4px;margin-top:5px}.cal-event{display:grid;gap:2px;padding:8px 9px;border-radius:11px;background:color-mix(in srgb,var(--accent) 9%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 17%,var(--line))}.cal-event b{font-size:.82rem}.cal-event span,.cal-event small{font-size:.76rem;color:var(--muted)}.cal-event.compact{padding:5px 6px}.cal-event.compact span,.cal-event.compact small{display:none}.more-events{color:var(--accent);padding-left:4px}
.calendar-week-grid{display:grid;grid-template-columns:repeat(7,minmax(180px,1fr));gap:9px;min-width:1260px}.week-day{border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden;min-height:300px}.week-day.today{box-shadow:inset 0 0 0 2px var(--accent)}.week-day-head{width:100%;border:0;border-bottom:1px solid var(--line);background:var(--surface-2);color:inherit;padding:12px;text-align:left;display:flex;justify-content:space-between;cursor:pointer}.week-events{padding:9px;display:grid;gap:7px}.empty-slot{color:var(--muted);font-size:.82rem}
.calendar-day{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface)}.hour-row{display:grid;grid-template-columns:76px 1fr;min-height:68px;border-bottom:1px solid var(--line)}.hour-row:last-child{border-bottom:0}.hour-row time{padding:12px;color:var(--muted);font-size:.82rem;text-align:right;border-right:1px solid var(--line)}.hour-events{padding:7px 10px;display:grid;gap:7px;align-content:start}.hour-empty{min-height:42px}
@media(max-width:900px){.calendar-toolbar{grid-template-columns:1fr;align-items:stretch}.calendar-title{text-align:left;order:-1}.calendar-jump{justify-content:space-between}.calendar-jump input{flex:1;min-width:0}.calendar-view-switch{width:100%;display:grid;grid-template-columns:repeat(2,1fr)}.agenda-view-btn{width:100%}}
@media(max-width:600px){.calendar-head{padding:14px}.calendar-toolbar{padding:12px 14px}.calendar-body{padding:12px 0}.calendar-years{padding:0 12px;grid-template-columns:1fr}.calendar-month-grid{min-width:700px;padding:0 12px}.calendar-week-grid{padding:0 12px}.calendar-day{margin:0 12px}.month-day{min-height:112px}.hour-row{grid-template-columns:58px 1fr}.calendar-view-switch{gap:6px}.agenda-view-btn{font-size:.8rem;padding:9px 6px}}

/* Persistent notification access on phones and tablets. */
.toolbar-notices{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
@media(max-width:860px){
  .top .toolbar-notices{grid-column:1 / -1;justify-content:flex-start}
  .toolbar-notices>.btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:44px;flex:1 1 auto;padding:9px 10px;font-size:.8rem}
  .toolbar-notices>.updates-btn:before{content:none}
  .toolbar-notices .updates-badge{flex-shrink:0;margin-left:2px}
}


/* ===== V001 mobile portrait hardening 2026-10-03 ===== */
/* Toutes les fonctions restent accessibles en portrait. Les contenus réellement
   larges défilent dans leur propre zone, jamais au niveau de la page entière. */
@media (max-width:600px){
  .main{
    width:100%;
    max-width:100vw;
    min-width:0;
    padding:10px;
    overflow-x:hidden;
  }

  .top{
    width:100%;
    min-width:0;
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    padding:12px;
  }

  .mobile-top,
  .mobile-top>div,
  .toolbar,
  .toolbar-notices,
  section,
  .panel,
  .ph,
  .pb{
    min-width:0;
    max-width:100%;
  }

  .toolbar{
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:stretch;
    justify-content:stretch;
  }

  .toolbar>.search-wrap,
  .toolbar>.tenant-switcher,
  .toolbar>.toolbar-notices{
    grid-column:1/-1;
    width:100%;
    min-width:0;
  }

  .toolbar>.btn,
  .toolbar>.primary,
  .toolbar>a.btn{
    width:100%;
    min-width:0;
    white-space:normal;
  }

  .toolbar-notices{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
  }

  .toolbar-notices>.btn{
    width:100%;
    min-width:0;
    padding:9px 6px;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .ph{
    align-items:stretch;
    flex-direction:column;
    padding:14px;
  }

  .ph>.row-actions,
  .row-actions{
    width:100%;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }

  .ph>.row-actions>.btn,
  .ph>.row-actions>.primary,
  .row-actions>.btn,
  .row-actions>.primary{
    flex:1 1 140px;
    min-width:0;
  }

  .pb{padding:14px}

  .table{
    width:100%;
    max-width:100%;
    overflow-x:auto;
    overflow-y:visible;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }

  .table table{
    width:max-content;
    min-width:100%;
  }

  /* Agenda */
  .calendar-panel{
    width:100%;
    max-width:100%;
    overflow:hidden;
  }

  .calendar-head{
    width:100%;
    padding:14px;
  }

  .calendar-view-switch{
    width:100%;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .calendar-toolbar{
    width:100%;
    grid-template-columns:1fr;
    gap:10px;
    padding:12px 14px;
  }

  .calendar-nav{
    width:100%;
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 44px;
  }

  .calendar-nav .btn{
    width:100%;
    min-width:0;
  }

  .calendar-jump{
    width:100%;
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:8px;
  }

  .calendar-jump input{
    width:100%;
    min-width:0;
  }

  .calendar-body{
    width:100%;
    max-width:100%;
    overflow-x:auto;
    overflow-y:visible;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    padding:12px 0;
  }

  .calendar-scroll{
    width:100%;
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .calendar-month-grid{
    min-width:640px;
    padding:0 10px;
  }

  .calendar-week-grid{
    min-width:980px;
    padding:0 10px;
  }

  .calendar-years{padding:0 10px}

  .calendar-day{
    width:calc(100% - 20px);
    margin:0 10px;
  }

  /* Communications */
  #tab-communications .panel{
    width:100%;
    max-width:100%;
    overflow:hidden;
  }

  #tab-communications .ph{
    gap:12px;
  }

  #tab-communications .ph .row-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  #tab-communications .ph .row-actions .btn{
    width:100%;
  }

  .comm-provider-grid,
  .compact-metrics,
  .comm-grid,
  .comm-events,
  .template-grid,
  .comm-test-grid{
    width:100%;
    max-width:100%;
    grid-template-columns:1fr;
  }

  .comm-events>div{
    min-width:0;
    grid-template-columns:1fr;
    align-items:stretch;
  }

  .comm-events>div>b{
    overflow-wrap:anywhere;
  }

  .comm-events>div>label{
    width:100%;
    min-height:44px;
    justify-content:flex-start;
    padding:6px 0;
  }

  .template-grid label,
  .template-grid textarea{
    min-width:0;
    max-width:100%;
  }
}

@media (max-width:390px){
  .toolbar,
  .toolbar-notices{
    grid-template-columns:1fr;
  }

  .calendar-view-switch{
    grid-template-columns:1fr;
  }

  .calendar-month-grid{
    min-width:560px;
  }
}


/* ===== V001 security mobile + silent background UX 2026-10-03 ===== */
@media(max-width:600px){
  #tab-security{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:hidden;
  }

  #tab-security .two,
  #tab-security .panel,
  #tab-security .ph,
  #tab-security .pb,
  #tab-security form,
  #tab-security .stacked-form,
  #tab-security #auditList,
  #userAccessPanel{
    width:100%;
    max-width:100%;
    min-width:0;
  }

  #tab-security .two{
    grid-template-columns:minmax(0,1fr);
  }

  #tab-security .ph>div,
  #tab-security .audit-item{
    min-width:0;
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:break-word;
  }

  #passwordForm input,
  #passwordForm button{
    width:100%;
    max-width:100%;
    min-width:0;
  }

  #passwordForm button{
    white-space:normal;
  }

  #userAccessPanel .table{
    width:100%;
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }

  #userAccessPanel .table table{
    width:max-content;
    min-width:100%;
  }
}


/* ===== V001 user management controls 2026-10-03 ===== */
.user-edit-danger{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border:1px solid color-mix(in srgb,var(--danger) 35%,var(--line));border-radius:16px;background:color-mix(in srgb,var(--danger) 6%,var(--surface-solid))}
.user-edit-danger small{display:block;margin-top:4px;color:var(--muted);max-width:420px}
.danger-btn{border-color:color-mix(in srgb,var(--danger) 45%,var(--line));color:var(--danger);background:color-mix(in srgb,var(--danger) 5%,var(--surface-solid))}
.danger-btn:hover{background:color-mix(in srgb,var(--danger) 10%,var(--surface-2))}
#userEditEmail[readonly]{opacity:.78;cursor:not-allowed}
@media(max-width:600px){
  .user-edit-danger{align-items:stretch;flex-direction:column}
  .user-edit-danger .danger-btn{width:100%}
}


/* ===== V001 addon readability 2026-10-03 ===== */
.addon-copy{min-width:0;display:flex;flex-direction:column;gap:7px}
.addon-copy>b{display:block;line-height:1.3}
.addon-meta{display:block;line-height:1.45;color:var(--muted)}
@media(max-width:600px){
  .addon-card{gap:16px}
  .addon-copy{gap:8px}
  .addon-meta{font-size:.92rem}
}


/* ===== V001 security desktop UX + complete user editor 2026-10-03 ===== */
.security-overview{align-items:start}
.security-password-panel{align-self:start}
.security-audit-panel{align-self:start;min-height:0}
.audit-scroll{max-height:310px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding-right:12px}
.audit-scroll .audit-item:first-child{padding-top:2px}
.audit-scroll .audit-item:last-child{border-bottom:0}
#userEditForm select,#userEditForm input{width:100%}
#userEditPriceWrap{margin-top:2px}
#userEditEmail:not([readonly]){background:var(--surface-solid)}
#userEditEmail[readonly]{opacity:.72;cursor:not-allowed}
@media(max-width:900px){.audit-scroll{max-height:280px}}
@media(max-width:600px){.audit-scroll{max-height:240px}}


/* ===== V001 client portal recovery 2026-10-03 ===== */
.client-access-modal{max-width:560px}
#publicClientSpace{white-space:nowrap}
.client-access-modal .muted{line-height:1.5}
@media(max-width:600px){
  .public-tools{flex-wrap:wrap}
  #publicClientSpace{order:-1;flex:1 1 100%;width:100%}
  .client-access-modal .grid2{grid-template-columns:1fr}
}


/* ===== V001 zone readability 2026-10-03 ===== */
.zone-card .addon-copy{flex:1}
.zone-card .addon-meta{margin-top:1px}
@media(max-width:600px){
  .zone-card{align-items:flex-start}
  .zone-card .addon-copy{padding-top:2px}
  .zone-card .addon-meta{line-height:1.5}
  .zone-card>[data-zone-edit]{flex:0 0 auto}
}


/* ===== V001 agenda mobile vertical-only 2026-10-03 ===== */
/* Sur téléphone, l'agenda s'adapte à la largeur disponible. Aucun mode ne
   nécessite un balayage horizontal : le défilement utile reste vertical. */
@media (max-width:760px){
  .calendar-body,
  .calendar-scroll{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:hidden;
    overscroll-behavior-x:none;
    touch-action:pan-y;
  }

  /* Vue mois : les 7 jours tiennent dans la largeur du téléphone. */
  .calendar-month-grid{
    width:100%;
    max-width:100%;
    min-width:0;
    padding:0 8px;
  }
  .calendar-weekdays,
  .calendar-month-days{
    width:100%;
    min-width:0;
    grid-template-columns:repeat(7,minmax(0,1fr));
  }
  .calendar-weekdays span{
    min-width:0;
    padding:6px 1px;
    font-size:.68rem;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .month-day{
    min-width:0;
    min-height:82px;
    padding:4px 2px;
  }
  .month-day-num{
    width:24px;
    height:24px;
    font-size:.78rem;
  }
  .month-events{
    min-width:0;
    gap:2px;
    margin-top:2px;
  }
  .cal-event.compact{
    min-width:0;
    padding:3px 2px;
    border-radius:6px;
    overflow:hidden;
  }
  .cal-event.compact b{
    display:block;
    min-width:0;
    max-width:100%;
    font-size:.58rem;
    line-height:1.15;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .more-events{
    display:block;
    min-width:0;
    padding-left:1px;
    font-size:.58rem;
    line-height:1.15;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  /* Vue semaine : une journée par ligne, donc lecture naturelle de haut en bas. */
  .calendar-week-grid{
    width:100%;
    max-width:100%;
    min-width:0;
    grid-template-columns:1fr;
    gap:9px;
    padding:0 10px;
  }
  .week-day{
    min-width:0;
    min-height:0;
  }
  .week-day-head{
    min-width:0;
    padding:10px 12px;
  }
  .week-events{
    min-width:0;
    padding:8px;
  }
  .week-events .cal-event{
    min-width:0;
    overflow:hidden;
  }
  .week-events .cal-event b,
  .week-events .cal-event span,
  .week-events .cal-event small{
    overflow-wrap:anywhere;
  }

  /* Vue jour : pleine largeur, uniquement verticale. */
  .calendar-day{
    width:auto;
    max-width:calc(100% - 20px);
    min-width:0;
    margin:0 10px;
  }
  .hour-row{
    min-width:0;
    grid-template-columns:52px minmax(0,1fr);
  }
  .hour-row time{
    min-width:0;
    padding:10px 6px;
    font-size:.75rem;
  }
  .hour-events{
    min-width:0;
    padding:7px;
  }
  .hour-events .cal-event{
    min-width:0;
    overflow:hidden;
  }

  /* Vue années : cartes empilées et mois internes fluides. */
  .calendar-years{
    width:100%;
    max-width:100%;
    min-width:0;
    grid-template-columns:1fr;
    padding:0 10px;
  }
  .calendar-year-card{
    min-width:0;
  }
  .year-months{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .year-month{
    min-width:0;
  }
}


/* ===== V001 communications mobile + concurrent login UX 2026-10-03 ===== */
.login-security-note{
  padding:14px 15px;
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  border-radius:16px;
  background:color-mix(in srgb,var(--accent) 7%,var(--surface-solid));
}
.login-security-note b{display:block;margin-bottom:5px}
.login-security-note p{margin:0;color:var(--muted);line-height:1.45}

#commStats.compact-metrics .metric{
  min-width:0;
  min-height:0;
  padding:14px 15px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface-2);
  color:var(--text);
  overflow:hidden;
}
#commStats.compact-metrics .metric::after{display:none}
#commStats.compact-metrics .metric span{
  color:var(--muted);
  opacity:1;
  overflow-wrap:anywhere;
}
#commStats.compact-metrics .metric strong{
  margin-top:5px;
  color:var(--text);
  font-size:1.45rem;
}

#tab-communications,
#tab-communications .panel,
#tab-communications .pb,
#tab-communications form,
#tab-communications .comm-provider-grid,
#tab-communications .comm-grid,
#tab-communications .comm-events,
#tab-communications .template-grid{
  min-width:0;
  max-width:100%;
}
#tab-communications .section-title p{
  white-space:normal;
  overflow-wrap:anywhere;
}
#tab-communications .comm-events input[type="checkbox"],
#tab-communications .checkline input[type="checkbox"]{
  width:22px;
  height:22px;
  min-width:22px;
  max-width:22px;
  min-height:22px;
  padding:0;
  margin:0;
  flex:0 0 22px;
  accent-color:var(--accent);
}
#tab-communications .comm-events label{
  min-width:0;
  white-space:normal;
  overflow:hidden;
}

@media(max-width:760px){
  #tab-communications{
    width:100%;
    overflow-x:hidden;
  }
  #tab-communications .pb{
    width:100%;
    overflow:hidden;
    padding-bottom:118px;
  }
  #tab-communications .comm-provider-grid,
  #tab-communications .comm-grid,
  #tab-communications .template-grid,
  #tab-communications .comm-test-grid{
    grid-template-columns:minmax(0,1fr);
  }
  #commStats.compact-metrics{
    width:100%;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin:12px 0 16px;
  }
  #commStats.compact-metrics .metric{
    padding:12px;
    border-radius:14px;
  }
  #commStats.compact-metrics .metric strong{
    font-size:1.25rem;
  }
  #tab-communications .comm-events{
    width:100%;
    grid-template-columns:minmax(0,1fr);
    gap:10px;
  }
  #tab-communications .comm-events>div{
    width:100%;
    min-width:0;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:center;
    gap:8px;
    padding:12px;
  }
  #tab-communications .comm-events>div>b{
    grid-column:1/-1;
    min-width:0;
    overflow-wrap:anywhere;
  }
  #tab-communications .comm-events>div>label{
    width:100%;
    min-width:0;
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:8px;
    padding:8px 10px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--surface-2);
    font-size:.84rem;
    overflow:visible;
  }
  #tab-communications .comm-grid>.checkline{
    width:100%;
    min-width:0;
    min-height:52px;
  }
  #tab-communications input:not([type="checkbox"]),
  #tab-communications select,
  #tab-communications textarea,
  #tab-communications button{
    min-width:0;
    max-width:100%;
  }
  #tab-communications .table{
    width:100%;
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
}


/* ===== V001 iPhone side menu scroll 2026-10-04 ===== */
@media(max-width:860px){
  /* Safari iOS: use the real visual viewport and keep the account actions reachable.
     Only the navigation list scrolls; the brand and logout area stay anchored. */
  .side{
    top:0;
    bottom:auto;
    height:100dvh;
    max-height:100dvh;
    width:min(86vw,320px);
    overflow:hidden;
    padding-top:max(12px,env(safe-area-inset-top));
    padding-bottom:max(12px,env(safe-area-inset-bottom));
  }
  .side .brand{
    flex:0 0 auto;
  }
  .side nav{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    touch-action:pan-y;
    padding-bottom:10px;
  }
  .side .grow{
    display:none;
  }
  .side .userbox{
    flex:0 0 auto;
    margin-top:8px;
    position:relative;
    z-index:2;
    background:color-mix(in srgb,var(--surface-solid) 94%,transparent);
    backdrop-filter:blur(14px);
  }
  .side #logout{
    min-height:46px;
  }
}
@supports not (height:100dvh){
  @media(max-width:860px){
    .side{height:100vh;max-height:100vh}
  }
}


/* ===== V001 mobile user access cards + quote form 2026-10-04 ===== */
@media(max-width:860px){
  #tab-quotes .ph{
    align-items:stretch;
    flex-direction:column;
  }
  #tab-quotes #newQuoteBtn{
    width:100%;
  }
  #quoteForm{
    scroll-margin-top:110px;
  }

  /* User access table becomes readable cards on mobile.
     Every field and action is visible without horizontal panning. */
  #userAccessPanel .pb{
    overflow:visible;
  }
  #userAccessPanel .table{
    overflow:visible;
    margin-left:0;
    margin-right:0;
    padding:0;
    width:100%;
    max-width:100%;
  }
  #userAccessPanel .table table{
    min-width:0;
    width:100%;
    display:block;
  }
  #userAccessPanel thead{
    display:none;
  }
  #userAccessPanel tbody{
    display:grid;
    gap:12px;
    width:100%;
  }
  #userAccessPanel tbody tr{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:12px;
    width:100%;
    max-width:100%;
    padding:14px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface-2);
  }
  #userAccessPanel tbody td{
    display:grid;
    gap:4px;
    min-width:0;
    padding:0;
    border:0;
    overflow-wrap:anywhere;
  }
  #userAccessPanel tbody td::before{
    display:block;
    color:var(--muted);
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
  }
  #userAccessPanel tbody td:nth-child(1){
    grid-column:1/-1;
  }
  #userAccessPanel tbody td:nth-child(1)::before{content:"Utilisateur"}
  #userAccessPanel tbody td:nth-child(2)::before{content:"Rôle"}
  #userAccessPanel tbody td:nth-child(3)::before{content:"Connexion"}
  #userAccessPanel tbody td:nth-child(4)::before{content:"Tarifs"}
  #userAccessPanel tbody td:nth-child(5)::before{content:"Compte"}
  #userAccessPanel tbody td:nth-child(6){
    grid-column:1/-1;
  }
  #userAccessPanel tbody td:nth-child(6)::before{content:"Actions"}
  #userAccessPanel .user-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    width:100%;
  }
  #userAccessPanel .user-actions .btn{
    flex:1 1 130px;
    min-width:0;
  }
  #userAccessPanel .checkline.compact{
    min-width:0;
    width:fit-content;
    max-width:100%;
  }
}
@media(max-width:430px){
  #userAccessPanel tbody tr{
    grid-template-columns:1fr;
  }
  #userAccessPanel tbody td,
  #userAccessPanel tbody td:nth-child(1),
  #userAccessPanel tbody td:nth-child(6){
    grid-column:1;
  }
}


/* ===== V001 full professional quotes + client RIDET 2026-10-04 ===== */
.quote-editor{
  padding:18px;
  border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));
  border-radius:20px;
  background:var(--surface-2);
  margin-bottom:18px;
}
.quote-editor .field-stack{display:grid;gap:7px;min-width:0}
.quote-editor .field-stack>label,.quote-editor label.field-stack{font-weight:750}
.quote-line-editor{
  display:grid;
  grid-template-columns:minmax(220px,2fr) 90px 100px 150px 110px minmax(190px,1fr) auto;
  gap:9px;
  align-items:center;
  padding:10px 0;
  border-bottom:1px solid var(--line);
}
.quote-line-editor>*{min-width:0}
.quote-line-desc{min-width:0}
.quote-editor-actions{margin-top:14px;flex-wrap:wrap}

.quote-document{
  max-width:1080px;
  margin:0 auto;
  background:#fff;
  color:#172033;
  border-color:#d6dbe5;
}
.quote-document .quote-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) 310px;
  align-items:start;
  gap:24px;
}
.quote-document .quote-brand{display:flex;align-items:flex-start;gap:16px;min-width:0}
.quote-company-meta{display:grid;gap:2px;margin:.4rem 0 0;line-height:1.35}
.quote-reference-box{border:1px solid #5b616b;display:grid;background:#fff}
.quote-reference-box>strong{text-align:center;padding:7px;border-bottom:1px solid #5b616b;font-size:1rem}
.quote-reference-box>div{display:grid;grid-template-columns:1fr 1fr}
.quote-reference-box>div>span,.quote-reference-box>div>b{padding:6px 8px;text-align:center;border-right:1px solid #5b616b}
.quote-reference-box>div>*:last-child{border-right:0}
.quote-reference-box>div:nth-of-type(1){background:#ececec;border-bottom:1px solid #5b616b}
.quote-actions{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}

.quote-client-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,38%);
  gap:24px;
  margin:20px 0 12px;
  align-items:start;
}
.quote-subject-block{padding-top:12px;font-size:1rem}
.quote-client-box{border:1px solid #5b616b;padding:16px;min-height:120px;text-align:center}
.quote-client-box h3{margin:0 0 10px;text-transform:uppercase}
.quote-client-box p{margin:4px 0;line-height:1.35}
.quote-reference-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 18px;margin:10px 0 14px}
.quote-reference-meta>div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dotted #c3c8d0;padding:5px 0}
.quote-reference-meta span{color:#4d5664}

.quote-classic-table{width:100%;border-collapse:collapse;min-width:760px}
.quote-classic-table th,.quote-classic-table td{border:1px solid #616873;padding:8px 7px;vertical-align:top}
.quote-classic-table th{background:#ececec;text-align:center;font-size:.86rem}
.quote-classic-table td:first-child{width:44%;white-space:pre-line}
.quote-classic-table td:not(:first-child){text-align:right}
.quote-classic-table td:nth-child(3){text-align:center}
.quote-classic-table .quote-option-select{align-items:flex-start}

.quote-bottom-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:end;margin-top:14px}
.quote-legal-note{min-height:22px;margin:0 0 8px}
.quote-tax-table{border-collapse:collapse;width:min(100%,390px)}
.quote-tax-table th,.quote-tax-table td{border:1px solid #616873;padding:6px 10px;text-align:center}
.quote-tax-table th{background:#ececec}
.classic-totals{padding:0;gap:0;border:0;background:transparent}
.classic-totals>div{padding:5px 8px;border-bottom:1px solid #616873}
.classic-totals .grand-total{border-top:2px solid #172033;font-weight:850;font-size:1.05rem}
.quote-amount-words{display:grid;gap:7px;margin-top:18px}
.quote-amount-words strong{font-size:.92rem}
.quote-extra-notes{margin-top:16px;line-height:1.45;font-size:.9rem}
.quote-extra-notes p:empty{display:none}

#drawer .client-summary{padding:10px 12px;border-radius:14px;background:var(--surface-2);margin-bottom:12px}

@media(max-width:860px){
  #tab-quotes .pb{overflow:hidden}
  .quote-editor{padding:12px}
  .quote-line-editor{
    grid-template-columns:repeat(2,minmax(0,1fr));
    padding:12px;
    margin-bottom:10px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--surface-solid);
  }
  .quote-line-editor .quote-line-desc{grid-column:1/-1}
  .quote-line-editor .checkline{grid-column:1/-1}
  .quote-line-editor .qremove{grid-column:1/-1;width:100%}
  .quote-editor-actions{display:grid;grid-template-columns:1fr}
  .quote-editor-actions>*{width:100%;margin:0!important}

  .quote-document{padding:14px;border-radius:18px}
  .quote-document .quote-top{grid-template-columns:1fr}
  .quote-reference-box{width:100%}
  .quote-actions{grid-column:1}
  .quote-client-row{grid-template-columns:1fr;gap:12px}
  .quote-client-box{text-align:left}
  .quote-reference-meta{grid-template-columns:1fr}
  .quote-reference-meta>div{align-items:flex-start}
  .quote-lines-table{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .quote-bottom-grid{grid-template-columns:1fr}
  .quote-tax-table{width:100%}
}

@media print{
  @page{size:A4 portrait;margin:10mm}
  body.quote-public{padding:0!important;background:#fff!important}
  .quote-wrap{max-width:none!important;padding:0!important}
  .quote-document{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    box-shadow:none!important;
    border-radius:0!important;
    background:#fff!important;
    color:#111!important;
    font-size:10.5pt;
  }
  .quote-document .quote-top{grid-template-columns:minmax(0,1fr) 72mm;gap:8mm}
  .quote-document .company-logo-box.large{width:32mm;height:25mm}
  .quote-document .quote-client-row{grid-template-columns:minmax(0,1fr) 72mm;gap:8mm;margin:6mm 0 3mm}
  .quote-document .quote-reference-meta{font-size:9pt;gap:1mm 7mm;margin:2mm 0 3mm}
  .quote-lines-table{overflow:visible!important}
  .quote-classic-table{min-width:0!important;font-size:8.5pt}
  .quote-classic-table th,.quote-classic-table td{padding:2.2mm 1.5mm}
  .quote-classic-table tbody tr{break-inside:avoid}
  .quote-bottom-grid{grid-template-columns:minmax(0,1fr) 70mm;gap:8mm;margin-top:4mm}
  .quote-amount-words{margin-top:5mm}
  .quote-extra-notes{margin-top:5mm;font-size:8.5pt}
}


/* Catalogue dans le devis : selects contenus même sur un écran étroit. */
.quote-catalog{margin-bottom:1rem}.quote-catalog .field-stack{min-width:0}.quote-catalog select,#quoteZone{width:100%;min-width:0;max-width:100%}

/* ===== V001 scheduling + mobile UX + motion/accessibility 2026-10-04 ===== */
img,video,canvas,svg{max-width:100%;height:auto}
button,a,input,select,textarea{touch-action:manipulation}
:where(button,a,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid color-mix(in srgb,var(--accent) 72%,white);
  outline-offset:2px;
}
.availability-panel{overflow:hidden}
.availability-head{align-items:flex-start;gap:14px}
.availability-week{display:grid;gap:10px}
.availability-day{
  display:grid;
  grid-template-columns:150px minmax(0,1fr) auto;
  gap:12px;
  align-items:start;
  padding:12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface-2);
}
.availability-day-name{display:grid;gap:4px}
.availability-day-name span{font-size:.78rem;font-weight:800}
.availability-day-name .is-open{color:var(--success)}
.availability-day-name .is-closed{color:var(--muted)}
.availability-ranges{display:grid;gap:8px;min-width:0}
.availability-range{
  display:grid;
  grid-template-columns:minmax(108px,160px) auto minmax(108px,160px) 44px;
  gap:8px;
  align-items:center;
}
.availability-range input{min-width:0;width:100%}
.availability-remove-range{min-width:44px;min-height:44px}
.availability-add-range{white-space:nowrap}
.availability-settings{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-top:16px;
}
.availability-settings label{display:grid;gap:6px;font-weight:750}
.availability-settings label small{font-weight:500;color:var(--muted)}
.availability-exceptions{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.availability-exception-form{
  display:grid;
  grid-template-columns:150px 190px minmax(170px,1fr) 135px 135px minmax(180px,1fr) auto;
  gap:9px;
  align-items:center;
}
.availability-exception-form>*{min-width:0}
.availability-exception-list{display:grid;gap:8px;margin-top:12px}
.availability-exception-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 44px;
  gap:10px;
  align-items:center;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface-2);
}
.availability-exception-item>div{display:grid;gap:3px;min-width:0}
.availability-exception-item span{font-size:.84rem;color:var(--muted)}
.availability-exception-item .badge{color:inherit}
.availability-sync-note{margin-top:16px}

.booking-calendar-actions{
  margin-top:14px;
  padding:14px;
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  border-radius:16px;
  background:color-mix(in srgb,var(--accent) 7%,var(--surface-solid));
  display:grid;
  gap:10px;
}
.booking-calendar-actions>div:first-child{display:grid;gap:4px}
.booking-calendar-actions span{font-size:.88rem;color:var(--muted)}

.quote-mobile-summary{display:none}
@media(max-width:720px){
  body.quote-public{padding-bottom:env(safe-area-inset-bottom);overflow-x:hidden}
  .quote-wrap{padding:10px;max-width:100%}
  .quote-document{padding:12px}
  .quote-mobile-summary{
    display:grid;
    gap:12px;
    min-height:min(610px,calc(100svh - 30px));
    align-content:start;
    border-radius:20px;
    background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 10%,#fff),#fff 55%);
  }
  .quote-mobile-head{display:flex;justify-content:space-between;gap:12px;align-items:start}
  .quote-mobile-head>div{display:grid;gap:3px}
  .quote-mobile-head strong{font-size:.92rem}
  .quote-mobile-summary h1{font-size:clamp(1.35rem,6vw,1.8rem);margin:4px 0 0;line-height:1.1}
  .quote-mobile-subject{font-size:1rem;line-height:1.35;margin:0;color:#475569}
  .quote-mobile-client{display:grid;gap:3px;padding:10px 0;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}
  .quote-mobile-client span,.quote-mobile-meta{font-size:.82rem;color:#64748b}
  .quote-mobile-total{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:end;
    padding:17px 16px;
    border-radius:18px;
    background:#172033;
    color:#fff;
  }
  .quote-mobile-total span{font-size:.88rem}
  .quote-mobile-total strong{font-size:clamp(1.7rem,9vw,2.45rem);line-height:1}
  .quote-mobile-meta{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
  .quote-mobile-actions{display:grid;gap:9px;margin-top:auto}
  .quote-mobile-actions .primary,.quote-mobile-actions .btn{width:100%;min-height:48px;display:flex;align-items:center;justify-content:center}
  .quote-mobile-actions .link-btn{min-height:44px}
  body.quote-public:not(.show-full-quote) .quote-document>.quote-top,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-client-row,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-reference-meta,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-lines-table,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-bottom-grid,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-amount-words,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-extra-notes{display:none}
  body.quote-public.show-full-quote .quote-document>.quote-top{margin-top:16px}
  .quote-lines-table{overflow:visible}
  .quote-classic-table{min-width:0;width:100%;display:block}
  .quote-classic-table thead{display:none}
  .quote-classic-table tbody{display:grid;gap:10px}
  .quote-classic-table tr{display:grid;border:1px solid #d9dee7;border-radius:14px;overflow:hidden;background:#fff}
  .quote-classic-table td,
  .quote-classic-table td:first-child,
  .quote-classic-table td:not(:first-child){
    width:auto!important;
    display:grid;
    grid-template-columns:minmax(96px,35%) minmax(0,1fr);
    gap:10px;
    text-align:right;
    border:0;
    border-bottom:1px solid #edf0f4;
    padding:8px 10px;
    white-space:normal;
  }
  .quote-classic-table td:last-child{border-bottom:0}
  .quote-classic-table td:first-child{text-align:left;grid-template-columns:1fr;padding:11px 10px;font-weight:750;background:#f7f9fc}
  .quote-classic-table td:not(:first-child)::before{content:attr(data-label);text-align:left;color:#64748b;font-size:.78rem;font-weight:700}
  #quoteAcceptance{margin-top:12px}
}
@media(max-width:860px){
  .availability-day{grid-template-columns:1fr}
  .availability-add-range{width:100%}
  .availability-settings{grid-template-columns:repeat(2,minmax(0,1fr))}
  .availability-exception-form{grid-template-columns:repeat(2,minmax(0,1fr))}
  .availability-exception-form #availabilityExceptionLabel,
  .availability-exception-form button{grid-column:1/-1}
}
@media(max-width:480px){
  .availability-settings{grid-template-columns:1fr}
  .availability-exception-form{grid-template-columns:1fr}
  .availability-exception-form>*{grid-column:1!important;width:100%}
  .availability-range{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) 44px}
  .availability-range span{font-size:.8rem}
  .availability-head .row-actions{width:100%;display:grid;grid-template-columns:1fr}
  .availability-head .row-actions>*{width:100%}
  .booking-calendar-actions .row-actions{display:grid;grid-template-columns:1fr}
  .booking-calendar-actions .row-actions>*{width:100%}
}

@supports (view-transition-name: root){
  ::view-transition-old(root){animation:resa-fade-out .12s ease both}
  ::view-transition-new(root){animation:resa-fade-in .18s ease both}
  @keyframes resa-fade-out{to{opacity:.72;transform:translateY(-2px)}}
  @keyframes resa-fade-in{from{opacity:.72;transform:translateY(4px)}}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  ::view-transition-old(root),::view-transition-new(root){animation:none!important}
}
@media print{
  .quote-mobile-summary{display:none!important}
  body.quote-public:not(.show-full-quote) .quote-document>.quote-top,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-client-row,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-reference-meta,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-lines-table,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-bottom-grid,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-amount-words,
  body.quote-public:not(.show-full-quote) .quote-document>.quote-extra-notes{display:grid}
  .quote-lines-table{display:block!important}
}


/* ===== Quality pass 2026-10-04: touch, dialogs, accessibility ===== */
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
:target{scroll-margin-top:88px}
.modal-backdrop{overscroll-behavior:contain}
.modal-card{
  max-height:min(92dvh,900px);
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
@media (hover:hover) and (pointer:fine){
  .primary:hover,.btn:hover,.icon-btn:hover,.link-btn:hover{transform:translateY(-1px)}
}
.primary:active,.btn:active,.icon-btn:active,.link-btn:active{transform:translateY(1px) scale(.99)}
@media (pointer:coarse){
  button,.btn,.primary,.link-btn,a.btn,a.primary{min-height:44px}
  input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  select{min-height:44px}
  textarea{min-height:96px}
}
@supports(height:100dvh){
  .modal-backdrop{min-height:100dvh}
  @media(max-width:720px){
    .modal-card{max-height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
  }
}
@media(prefers-reduced-motion:reduce){
  .primary:active,.btn:active,.icon-btn:active,.link-btn:active{transform:none!important}
}


/* ===== Intégrations NC : recherche d’adresse officielle ===== */
.location-field{position:relative;min-width:0;display:grid;gap:5px}
.location-field>input[data-location-autocomplete]{width:100%;min-width:0}
.location-field>small{font-size:.76rem;color:var(--muted);line-height:1.35}
.location-suggestions{
  position:absolute;
  z-index:120;
  top:calc(100% + 5px);
  left:0;
  right:0;
  max-height:min(320px,45dvh);
  overflow:auto;
  overscroll-behavior:contain;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface-solid);
  box-shadow:0 18px 45px rgba(15,23,42,.18);
  padding:6px;
}
.location-suggestion{
  width:100%;
  min-height:48px;
  display:grid;
  gap:2px;
  align-content:center;
  text-align:left;
  padding:9px 11px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--text);
}
.location-suggestion:hover,.location-suggestion:focus-visible{background:var(--surface-2)}
.location-suggestion b{font-size:.9rem;line-height:1.25}
.location-suggestion small,.location-empty{font-size:.76rem;color:var(--muted);line-height:1.3}
.location-empty{padding:12px}
@media(max-width:720px){
  .location-suggestions{position:fixed;left:12px;right:12px;top:auto;bottom:calc(12px + env(safe-area-inset-bottom));max-height:min(52dvh,430px);border-radius:18px}
}


.integration-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.integration-card{min-width:0;padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2);display:grid;gap:12px;align-content:start}
.integration-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.integration-card-head>div{min-width:0}.integration-card h3{margin:0 0 3px}.integration-card p{margin:0;color:var(--muted);line-height:1.45}
.integration-card small{color:var(--muted);overflow-wrap:anywhere}.integration-actions{display:flex;gap:8px;flex-wrap:wrap}
.integration-pill{display:inline-flex;align-items:center;min-height:30px;padding:5px 9px;border-radius:999px;border:1px solid var(--line);font-size:.75rem;font-weight:700;white-space:nowrap}
.integration-pill.success{background:rgba(33,150,83,.10);color:#19713f;border-color:rgba(33,150,83,.24)}
.integration-pill.warn{background:rgba(245,158,11,.10);color:#9a6500;border-color:rgba(245,158,11,.28)}
.integration-pill.neutral{background:var(--surface);color:var(--muted)}
.integration-help{margin-top:14px}
.integration-status{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.integration-status span{display:inline-flex;align-items:center;min-height:32px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);font-size:.76rem;color:var(--muted);line-height:1.2}
@media(max-width:720px){.integration-grid{grid-template-columns:1fr}.integration-card{padding:14px}.integration-actions{display:grid;grid-template-columns:1fr}.integration-actions>*{width:100%;text-align:center}}
@media(max-width:480px){.integration-status{display:grid;grid-template-columns:1fr 1fr}.integration-status span{border-radius:12px}.service-card-top h3{min-width:0;flex:1}.mode-chip{font-size:.74rem;padding:6px 9px}}


/* ===== Responsive global 2026-10-04 : portrait, paysage, iOS, Android ===== */
:where(.main,.panel,.pb,.ph,.cards,.card,.grid2,.two,.row,.row-actions,.form-actions,.table,table,tbody,tr,td,th,form,fieldset,details){
  min-width:0;
}
:where(.main,.panel,.card,.pb,.ph,.table,form,fieldset,details,input,select,textarea,button,.btn,.primary){
  max-width:100%;
}
:where(td,th,.card,.panel,.cell-sub,.muted,p,span,b,strong,small,label){
  overflow-wrap:anywhere;
}
img,video,canvas,svg{max-width:100%;height:auto}

@media(max-width:980px){
  body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }
  body:not(.public):not(.quote-public):not(.client-hub-body){
    padding-bottom:calc(82px + env(safe-area-inset-bottom));
  }
  .app{grid-template-columns:minmax(0,1fr);width:100%;max-width:100%}
  .main{
    width:100%;
    max-width:100%;
    min-width:0;
    padding:10px max(10px,env(safe-area-inset-right)) 24px max(10px,env(safe-area-inset-left));
    gap:12px;
    overflow-x:hidden;
  }
  .side{
    position:fixed;
    inset:0 auto 0 0;
    width:min(86vw,320px);
    height:100dvh;
    z-index:70;
    transform:translateX(-105%);
    transition:transform .22s ease;
    overflow:hidden;
    padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom));
  }
  .side.open{transform:none}
  .side nav{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
  .side .grow{display:none}
  .side .userbox{flex:0 0 auto}
  .mobile-only{display:grid}
  .mobile-tabs{
    position:fixed;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    left:max(8px,env(safe-area-inset-left));
    right:max(8px,env(safe-area-inset-right));
    bottom:max(8px,env(safe-area-inset-bottom));
    z-index:65;
    width:auto;
    max-width:none;
    background:color-mix(in srgb,var(--surface-solid) 90%,transparent);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border:1px solid var(--line);
    border-radius:22px;
    padding:6px;
    box-shadow:0 18px 50px rgba(10,23,48,.2);
  }
  .mobile-tabs button{
    min-width:0;
    min-height:52px;
    padding:7px 3px;
    border:0;
    display:grid;
    place-items:center;
    gap:1px;
    background:transparent;
    color:var(--muted);
    border-radius:15px;
  }
  .mobile-tabs button span{font-size:1.05rem}
  .mobile-tabs button small{font-size:.68rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mobile-tabs button.active{background:color-mix(in srgb,var(--accent) 11%,var(--surface-solid));color:var(--accent);font-weight:750}
  .quick-fab{display:grid;place-items:center;right:max(14px,env(safe-area-inset-right));bottom:calc(88px + env(safe-area-inset-bottom))}
  .back-top{display:none!important}

  .top{
    width:100%;
    max-width:100%;
    padding:12px;
    border-radius:18px;
    top:max(6px,env(safe-area-inset-top));
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .mobile-top,.mobile-top>div{width:100%;min-width:0}
  .mobile-top h1{font-size:clamp(1.45rem,6vw,2rem);line-height:1.05}
  .mobile-top p{font-size:.88rem}
  .top .toolbar{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .top .search-wrap,.top .search-wrap input{width:100%;min-width:0}
  .top .toolbar>.btn:not(#darkToggle),.top .toolbar>a,.top .toolbar>#quickClient{display:none}

  .hero-band,.public-head,.quote-top,.ph{min-width:0}
  .panel{width:100%;max-width:100%;border-radius:20px;overflow:hidden}
  .ph,.pb{padding:14px}
  .ph{align-items:flex-start;flex-wrap:wrap}
  .ph>.row-actions{width:100%}
  .row-actions,.form-actions{grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr))}
  .row-actions>*,
  .form-actions>*{min-width:0}
  .grid2,.two,.company-layout,.public-layout{grid-template-columns:minmax(0,1fr)}
  .cards{grid-template-columns:minmax(0,1fr)}
  .card,.mini-card{width:100%;max-width:100%}
  .service-card{min-height:0}
  .drawer{
    left:max(8px,env(safe-area-inset-left));
    right:max(8px,env(safe-area-inset-right));
    top:auto;
    bottom:calc(82px + env(safe-area-inset-bottom));
    width:auto;
    max-width:none;
    max-height:min(78dvh,720px);
    border-radius:26px;
  }
  .modal-backdrop{align-items:end;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}
  .modal-card,.quick-sheet{width:100%;max-width:100%;max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border-radius:26px 26px 18px 18px}
  .quick-sheet{position:fixed;left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:calc(78px + env(safe-area-inset-bottom));width:auto}
  .cookie-banner{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:calc(86px + env(safe-area-inset-bottom));flex-direction:column}
  .offline-banner{bottom:calc(88px + env(safe-area-inset-bottom))}
  input,select,textarea{font-size:16px}

  /* Tous les tableaux de gestion deviennent des cartes verticales.
     Aucun glissement horizontal n'est nécessaire sur téléphone. */
  .main .table{width:100%;max-width:100%;margin:0;padding:0;overflow:visible}
  .main .table table.responsive-cards{
    display:block;
    width:100%;
    min-width:0!important;
    max-width:100%;
    border-collapse:separate;
  }
  .main .table table.responsive-cards thead{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    clip-path:inset(50%);
    white-space:nowrap;
  }
  .main .table table.responsive-cards tbody{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    width:100%;
  }
  .main .table table.responsive-cards tbody tr{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    width:100%;
    min-width:0;
    padding:10px 12px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--surface-solid);
    box-shadow:0 6px 18px rgba(24,39,75,.045);
  }
  .main .table table.responsive-cards tbody td{
    display:grid;
    grid-template-columns:minmax(88px,32%) minmax(0,1fr);
    align-items:start;
    gap:10px;
    width:100%!important;
    min-width:0!important;
    padding:8px 0;
    border:0;
    border-bottom:1px solid color-mix(in srgb,var(--line) 72%,transparent);
    text-align:left!important;
    white-space:normal!important;
  }
  .main .table table.responsive-cards tbody td:last-child{border-bottom:0}
  .main .table table.responsive-cards tbody td::before{
    content:attr(data-label);
    color:var(--muted);
    font-size:.72rem;
    line-height:1.25;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.045em;
  }
  .main .table table.responsive-cards tbody td[colspan]{
    display:block;
    padding:15px 2px;
    text-align:center!important;
    color:var(--muted);
  }
  .main .table table.responsive-cards tbody td[colspan]::before{content:none}
  .main .table table.responsive-cards .responsive-actions,
  .main .table table.responsive-cards td[data-label="Action"],
  .main .table table.responsive-cards td[data-label="Actions"]{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:8px;
    padding-top:10px;
  }
  .main .table table.responsive-cards .responsive-actions::before,
  .main .table table.responsive-cards td[data-label="Action"]::before,
  .main .table table.responsive-cards td[data-label="Actions"]::before{
    grid-column:1/-1;
  }
  .main .table table.responsive-cards .responsive-actions>*,
  .main .table table.responsive-cards td[data-label="Action"]>*,
  .main .table table.responsive-cards td[data-label="Actions"]>*{
    width:100%;
    min-width:0;
    margin:0!important;
    justify-content:center;
    text-align:center;
  }
  .main .table table.responsive-cards .responsive-controls{
    grid-template-columns:minmax(0,1fr);
  }
  .main .table table.responsive-cards .responsive-controls::before{grid-column:1/-1}
  .main .table table.responsive-cards .plan-admin-controls{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(110px,.55fr);
    gap:8px;
  }
  .main .table table.responsive-cards .plan-admin-controls>*{width:100%!important;max-width:none!important;min-width:0}

  /* Le devis d'administration ne doit plus se comporter comme un tableau desktop miniature. */
  #tab-quotes .ph{flex-direction:column;align-items:stretch}
  #tab-quotes #newQuoteBtn{width:100%}
  #tab-quotes .quote-table{overflow:visible}
  #quotesBody td[data-label="Action"]{align-items:stretch}
  #quotesBody td[data-label="Action"] .primary{order:-1}
  #quoteForm{scroll-margin-top:100px}

  /* Les formulaires et sous-panneaux suivent la largeur réellement disponible. */
  .availability-settings,
  .availability-exception-form,
  .comm-grid,
  .template-grid,
  .comm-provider-grid,
  .comm-test-grid,
  .plan-overview{
    grid-template-columns:minmax(0,1fr);
  }
  .availability-range{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) 44px}
  .availability-head .row-actions{grid-template-columns:minmax(0,1fr)}
  .availability-head .row-actions>*{width:100%}
}

@media(max-width:520px){
  .main{padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}
  .ph,.pb{padding:12px}
  .panel{border-radius:18px}
  .mobile-tabs{left:max(5px,env(safe-area-inset-left));right:max(5px,env(safe-area-inset-right));padding:5px;border-radius:20px}
  .mobile-tabs button{min-height:50px}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .metric{padding:13px}
  .main .table table.responsive-cards tbody td{grid-template-columns:minmax(76px,30%) minmax(0,1fr);gap:8px}
  .main .table table.responsive-cards .responsive-actions,
  .main .table table.responsive-cards td[data-label="Action"],
  .main .table table.responsive-cards td[data-label="Actions"]{grid-template-columns:repeat(2,minmax(0,1fr))}
  .main .table table.responsive-cards .responsive-actions>*,
  .main .table table.responsive-cards td[data-label="Action"]>*,
  .main .table table.responsive-cards td[data-label="Actions"]>*{padding-left:8px;padding-right:8px;font-size:.9rem}
  .plan-overview{grid-template-columns:minmax(0,1fr)}
}

@media(max-width:360px){
  .mobile-tabs button small{font-size:.62rem}
  .main .table table.responsive-cards tbody td{grid-template-columns:minmax(68px,29%) minmax(0,1fr)}
  .main .table table.responsive-cards .responsive-actions,
  .main .table table.responsive-cards td[data-label="Action"],
  .main .table table.responsive-cards td[data-label="Actions"]{grid-template-columns:minmax(0,1fr)}
}

/* Téléphones en paysage : on exploite la largeur au lieu d'allonger inutilement la page. */
@media(max-width:980px) and (orientation:landscape) and (max-height:600px){
  body:not(.public):not(.quote-public):not(.client-hub-body){padding-bottom:calc(66px + env(safe-area-inset-bottom))}
  .main{
    padding-top:7px;
    padding-bottom:14px;
    gap:9px;
  }
  .top{
    position:relative;
    top:auto;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(250px,.75fr);
    align-items:center;
    padding:9px 11px;
  }
  .mobile-top p{display:none}
  .mobile-top h1{font-size:1.35rem}
  .top .toolbar{grid-template-columns:minmax(0,1fr) auto}
  .mobile-tabs{
    padding:3px 5px;
    border-radius:17px;
    bottom:max(4px,env(safe-area-inset-bottom));
  }
  .mobile-tabs button{min-height:44px;padding:3px}
  .mobile-tabs button span{font-size:.95rem}
  .mobile-tabs button small{font-size:.61rem}
  .quick-fab{width:48px;height:48px;min-height:48px;bottom:calc(68px + env(safe-area-inset-bottom))}
  .drawer{bottom:calc(64px + env(safe-area-inset-bottom));max-height:calc(100dvh - 76px)}
  .metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid2>.full{grid-column:1/-1}
  .main .table table.responsive-cards tbody{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  #tab-quotes .quote-table tbody,
  #tab-invoices .table tbody,
  #tab-requests .table tbody{grid-template-columns:repeat(2,minmax(0,1fr))}
  .modal-card,.quick-sheet{max-height:calc(100dvh - 12px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
}

/* Petites tablettes et grands téléphones en paysage restent en navigation tactile. */
@media(min-width:861px) and (max-width:980px){
  .top .toolbar>.btn:not(#darkToggle),.top .toolbar>a,.top .toolbar>#quickClient{display:none}
}

@media(max-width:1100px){.public-layout.has-selection .checkout{order:-1}}
@media(max-width:720px){
  .contact-float{width:52px;height:52px;min-height:52px;padding:0;border-radius:50%;font-size:0;display:grid;place-items:center;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}
  .contact-float::before{content:"✉";font-size:1.2rem;line-height:1}
  .checkout{scroll-margin-top:12px}
}

/* ===== Densité adaptative mobile 2026-10-04 =====
   On s'adapte au viewport réel (largeur, hauteur, orientation), pas au nom du téléphone. */
.update-card.updates-center{width:min(760px,100%);max-width:760px}
.update-feed{display:grid;gap:10px;margin:12px 0 16px;padding:0;max-height:min(62dvh,620px);overflow:auto;overscroll-behavior:contain}
.update-entry{display:grid;gap:8px;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2)}
.update-entry.is-new{border-color:color-mix(in srgb,var(--accent) 38%,var(--line));background:color-mix(in srgb,var(--accent) 5%,var(--surface-2))}
.update-entry-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.update-entry-head>div{min-width:0}.update-entry h3{margin:3px 0 0;font-size:1rem;line-height:1.25}
.update-entry time{flex:0 0 auto;color:var(--muted);font-size:.74rem}
.update-entry ul{margin:2px 0 0;padding-left:20px;display:grid;gap:5px}
.update-entry li{line-height:1.35}
.update-status{display:inline-flex;padding:3px 7px;border-radius:999px;background:var(--surface-solid);border:1px solid var(--line);font-size:.67rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.update-entry.is-new .update-status{background:color-mix(in srgb,var(--accent) 12%,var(--surface-solid));color:var(--accent);border-color:color-mix(in srgb,var(--accent) 24%,var(--line))}

@media(max-width:720px){
  /* Administration : moins de chrome, davantage de contenu utile. */
  button,.btn,.primary,.link-btn,a.btn,a.primary{min-height:44px}
  input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),select{min-height:44px;padding-top:7px;padding-bottom:7px}
  textarea{min-height:72px;padding-top:8px;padding-bottom:8px}
  .main{padding:7px max(7px,env(safe-area-inset-right)) 18px max(7px,env(safe-area-inset-left));gap:9px}
  .top{padding:9px 10px;border-radius:15px;gap:7px}
  .mobile-top{gap:9px}
  .mobile-top h1{font-size:clamp(1.22rem,5.2vw,1.55rem)}
  .mobile-top p{font-size:.79rem;line-height:1.25}
  .hero-band{padding:13px;border-radius:18px;gap:10px}
  .hero-band h2{font-size:clamp(1.25rem,5.2vw,1.55rem);margin:.15rem 0 .3rem}
  .hero-band p{font-size:.84rem;line-height:1.3}
  .panel{border-radius:16px}
  .ph,.pb{padding:10px 11px}
  .ph{gap:8px}.ph h2{font-size:1.04rem}.ph p{font-size:.78rem;line-height:1.25}
  .cards,.stack-cards,.two,.grid2{gap:8px}
  .card,.mini-card{padding:10px 11px;border-radius:15px}
  .metric{padding:10px 11px;border-radius:15px}
  .metric span{font-size:.72rem}.metric strong{font-size:clamp(1.25rem,5.6vw,1.55rem);margin-top:5px}
  .notice{padding:10px 11px;border-radius:14px}
  .form-actions,.row-actions{gap:7px}
  .mobile-tabs{padding:4px;left:max(5px,env(safe-area-inset-left));right:max(5px,env(safe-area-inset-right));border-radius:18px}
  .mobile-tabs button{min-height:46px;padding:4px 2px;border-radius:13px}
  .mobile-tabs button span{font-size:.95rem}.mobile-tabs button small{font-size:.62rem}
  .quick-fab{width:48px;height:48px;min-height:48px;bottom:calc(72px + env(safe-area-inset-bottom))}

  /* Page publique : les cartes cessent de manger la moitié d'un écran. */
  .public-wrap{padding:8px max(8px,env(safe-area-inset-right)) 18px max(8px,env(safe-area-inset-left))}
  .public-head{padding:11px 12px;border-radius:18px;gap:10px;box-shadow:0 8px 24px rgba(24,39,75,.08)}
  .public-brand-logo .logo,.public-brand-logo img{max-width:48px;max-height:48px}
  .public-title-row h1{font-size:clamp(1.2rem,5.4vw,1.55rem);line-height:1.08}
  .public-head p{font-size:.82rem;line-height:1.3}
  .public-meta{gap:5px;font-size:.76rem}
  .public-tools{gap:6px}
  .public-search{margin:9px 0}
  .public-search input{min-height:44px}
  .public-layout{gap:9px}
  #publicServices.cards{gap:8px}
  .service-card{gap:8px!important;padding:11px 12px!important;border-radius:16px!important;min-height:0!important}
  .service-card-top{gap:7px}
  .service-card-top h3{font-size:clamp(1rem,4.5vw,1.16rem);line-height:1.18}
  .service-card p{font-size:.83rem;line-height:1.32;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .service-meta{gap:7px}
  .price.soft{font-size:1.02rem}
  .duration-chip,.mode-chip{font-size:.72rem;padding:5px 8px}
  .service-card [data-service]{min-height:44px;padding:8px 10px;font-size:.91rem}
  .checkout{padding:11px 12px;border-radius:17px}
  .checkout h2{font-size:1.12rem;margin:.1rem 0 .55rem}
  .checkout label{margin-top:8px;margin-bottom:4px;font-size:.85rem}
  .checkout input,.checkout select,.checkout textarea{padding-top:8px;padding-bottom:8px}
  .summary{margin:8px 0;padding:10px;border-radius:14px;font-size:.84rem}
  .summary>div{gap:7px}
  .option-list{gap:6px}
  .option-choice,.option-item{padding:8px 9px;border-radius:12px}
  .slots{gap:6px}
  .slots button{padding:7px 9px;min-height:44px;font-size:.84rem}
  .contact-float{width:46px;height:46px;min-height:46px}

  .updates-home-card{padding:10px 11px;border-radius:15px;gap:8px}
  .updates-home-card h3{font-size:1rem}
  .updates-home-card p{font-size:.78rem}
  .update-card.updates-center{margin:6px;max-height:calc(100dvh - 12px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:13px}
  .update-feed{gap:7px;margin:8px 0 10px;max-height:min(66dvh,600px)}
  .update-entry{padding:9px 10px;border-radius:13px;gap:6px}
  .update-entry h3{font-size:.92rem}
  .update-entry li{font-size:.8rem;line-height:1.28}
  .update-entry-head{gap:7px}
  .update-entry time{font-size:.68rem}
}

@media(max-width:430px){
  .main{padding-left:max(6px,env(safe-area-inset-left));padding-right:max(6px,env(safe-area-inset-right))}
  .ph,.pb{padding:9px}
  .cards,.stack-cards{gap:7px}
  .public-wrap{padding-left:max(6px,env(safe-area-inset-left));padding-right:max(6px,env(safe-area-inset-right))}
  .public-head{padding:9px 10px;border-radius:16px}
  .service-card{padding:10px!important;gap:7px!important}
  .service-card p{-webkit-line-clamp:2}
  .service-meta{flex-wrap:nowrap}
  .duration-chip{white-space:nowrap}
  .checkout{padding:10px}
  .metrics{gap:6px}
  .metric{padding:9px}
}

@media(max-width:360px){
  .main,.public-wrap{padding-left:max(5px,env(safe-area-inset-left));padding-right:max(5px,env(safe-area-inset-right))}
  .top{padding:8px}
  .ph,.pb{padding:8px}
  .panel,.service-card,.card,.mini-card{border-radius:14px}
  .service-card{padding:9px!important}
  .service-card-top h3{font-size:.98rem}
  .service-card p{font-size:.78rem}
  .mode-chip,.duration-chip{font-size:.67rem;padding:4px 6px}
  .price.soft{font-size:.96rem}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mobile-tabs button{min-height:44px}
}

/* Écrans courts : on réduit encore la hauteur perdue, utile sur iPhone SE et en navigateur avec barres visibles. */
@media(max-width:720px) and (max-height:740px){
  .top{position:relative;top:auto}
  .hero-band{padding:10px}
  .hero-band p,.mobile-top p{display:none}
  .ph,.pb{padding:8px 9px}
  .service-card{padding:9px 10px!important}
  .service-card p{-webkit-line-clamp:1}
  .checkout{padding:9px 10px}
  .updates-home-card{padding:8px 9px}
}

/* Paysage téléphone : utiliser la largeur au lieu d'empiler une colonne interminable. */
@media(max-width:980px) and (orientation:landscape) and (max-height:600px){
  .public-wrap{padding:6px max(7px,env(safe-area-inset-right)) 10px max(7px,env(safe-area-inset-left))}
  .public-head{padding:8px 10px}
  .public-search{margin:6px 0}
  #publicServices.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .service-card{padding:9px 10px!important;gap:6px!important}
  .service-card p{-webkit-line-clamp:1}
}


@media(max-width:900px){.accounting-export-box{grid-template-columns:1fr 1fr}.accounting-export-copy{grid-column:1/-1}.accounting-actions{grid-column:1/-1;display:flex;flex-wrap:wrap}}
@media(max-width:520px){.accounting-export-box{grid-template-columns:1fr;padding:12px}.accounting-export-copy,.accounting-actions{grid-column:auto}.accounting-actions>*{width:100%}.sms-credit-summary{grid-template-columns:1fr}}

.vehicle-price-editor{padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--soft)}
.vehicle-prices-summary{display:block;margin-top:8px;line-height:1.45}
.vehicle-model-list{display:grid;gap:12px;margin-top:14px}
.vehicle-make-group{display:grid;grid-template-columns:140px 1fr;gap:10px;align-items:start;padding-top:10px;border-top:1px solid var(--line)}
.vehicle-model-chips{display:flex;flex-wrap:wrap;gap:8px}
.vehicle-model-chip{display:flex;gap:6px;align-items:center;padding:7px 9px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.vehicle-model-chip select{min-width:130px}
.vehicle-selector-panel{display:grid;grid-template-columns:minmax(220px,1fr) minmax(320px,1.2fr);gap:18px;align-items:center;margin:14px 0;padding:18px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.vehicle-selector-panel h2{margin:.2rem 0 .4rem}
.vehicle-selector-panel p{margin:0}
.vehicle-selector-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:end}
.vehicle-class-result{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:14px;background:var(--soft);border:1px solid var(--line)}
.vehicle-class-result span{color:var(--muted)}.vehicle-class-result b{font-size:1.05rem}
.quote-appointment-panel{margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--soft)}
.quote-appointment-panel h3{margin:.25rem 0 .4rem}
.quote-appointment-panel .slots{margin:10px 0}
.quote-appointment-confirmed{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:14px 0;padding:14px;border-radius:16px;background:var(--soft);border:1px solid var(--line)}

@media(max-width:760px){
  .vehicle-selector-panel{grid-template-columns:1fr;padding:14px}
  .vehicle-selector-fields{grid-template-columns:1fr}
  .vehicle-class-result{grid-column:auto}
  .vehicle-make-group{grid-template-columns:1fr}
  .vehicle-model-chip{width:100%;flex-wrap:wrap}
  .vehicle-model-chip select{flex:1;min-width:0}
  .quote-appointment-confirmed{align-items:flex-start;flex-direction:column}
}

.quote-slot-proposal{padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--soft)}
.quote-slot-proposal .section-title{margin-top:0}
.quote-proposed-slot{display:grid;gap:4px;margin:12px 0}
.quote-proposed-slot span{font-weight:700}
.quote-proposed-slot small{color:var(--muted)}
.vehicle-model-name{font-weight:700;min-width:110px}
.vehicle-model-chip{align-items:center}
.vehicle-model-chip select[data-vehicle-energy]{min-width:150px}
@media(max-width:760px){
  .quote-slot-proposal{padding:12px}
  .vehicle-model-name{width:100%;min-width:0}
  .vehicle-model-chip select[data-vehicle-energy]{min-width:0;flex:1 1 160px}
}

.vehicle-other-fields{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;border:1px dashed var(--line);border-radius:14px;background:var(--soft)}
.vehicle-other-fields .full{grid-column:1/-1;margin:0}
.quote-preference{margin:12px 0;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--soft)}
.quote-preference summary{cursor:pointer;font-weight:700}
.quote-preference[open] summary{margin-bottom:10px}
.quote-preference .slots{margin:8px 0}
@media(max-width:760px){.vehicle-other-fields{grid-template-columns:1fr}}

/* Audit 2026: readable service titles and explicit destructive selection. */
.public .service-card-top{display:flex;flex-wrap:wrap;align-items:flex-start}
.public .service-card-top h3{flex:1 1 140px;min-width:0;word-break:normal;overflow-wrap:normal;hyphens:auto}
.public .mode-chip{flex:0 0 auto;white-space:nowrap;max-width:100%}
.data-manager{padding:18px 0;border-bottom:1px solid var(--line);margin-bottom:22px}
.data-delete-toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:14px 0}
.data-delete-list{max-height:420px;overflow:auto;border:1px solid var(--line);border-radius:12px}
.data-delete-row{display:flex;align-items:center;gap:12px;padding:12px;border-bottom:1px solid var(--line);min-height:48px}
.data-delete-row input,.data-delete-toolbar input,#deleteRelatedWrap input{width:auto;flex:none}
.data-delete-row span{min-width:0;overflow-wrap:anywhere}.data-delete-row small{display:block;opacity:.75}
.delete-dialog{background:var(--panel,#fff);color:var(--text,#18202c);border:1px solid var(--line);border-radius:18px;padding:24px;width:min(600px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto}
.delete-dialog::backdrop{background:rgba(0,0,0,.55)}.delete-dialog label{display:block;margin:14px 0}
.delete-dialog input:not([type=checkbox]){width:100%}.btn.danger{color:#b42318;border-color:#b42318}
@media(max-width:600px){.data-delete-toolbar{gap:8px}.delete-dialog{padding:16px}}

.privacy-notice{max-width:850px;margin:24px auto;padding:24px;line-height:1.65}.privacy-notice p{overflow-wrap:anywhere}.public-footer a{margin:0 12px}


/* Journal global Super Admin : compact, lisible et exploitable sur mobile. */
.audit-global-controls{margin-bottom:12px}
.audit-global-controls .data-delete-toolbar{margin:0}
.audit-pager{justify-content:space-between}
.audit-evidence{margin:8px 0;font-size:.9em}
.audit-evidence summary{cursor:pointer;font-weight:600}
.audit-evidence ul{margin:8px 0 0;padding-left:20px;max-height:180px;overflow:auto}
.audit-evidence li{margin:4px 0;overflow-wrap:anywhere}
@media(max-width:600px){
  .audit-pager{justify-content:center}
  .audit-pager span{flex:1 1 100%;text-align:center;order:-1}
}


/* Rapports & exports */
.reports-hero{overflow:visible}
.report-filter-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;align-items:end}
.report-type-field{grid-column:span 2}
.report-filter-actions{display:flex;gap:8px;align-items:end}
.report-metrics{margin:14px 0;grid-template-columns:repeat(5,minmax(0,1fr))}
.report-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}
.report-chart{min-height:230px;display:flex;align-items:center;justify-content:center}
.report-chart svg{width:100%;height:auto;max-height:260px;overflow:visible}
.report-chart svg line{stroke:var(--line);stroke-width:1}
.report-chart svg polyline{fill:none;stroke:var(--brand);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.report-chart svg circle{fill:var(--brand);stroke:var(--panel);stroke-width:2}
.report-chart svg text{font-size:12px;fill:var(--muted)}
.report-bars{display:grid;gap:12px}
.report-bar-row{display:grid;gap:5px}
.report-bar-label{display:flex;justify-content:space-between;gap:12px;font-size:.88rem}
.report-bar-label span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.report-bar-track{height:9px;border-radius:999px;background:var(--soft);overflow:hidden}
.report-bar-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--brand),#6d8dff)}
.report-funnel{display:grid;gap:9px}
.funnel-step{display:grid;grid-template-columns:minmax(120px,1fr) 2fr;gap:10px;align-items:center;font-size:.88rem}
.funnel-step>div{min-width:50px;padding:8px 10px;border-radius:8px;background:linear-gradient(90deg,var(--brand),#6d8dff);color:#fff;text-align:right}
.reports-lower{align-items:start;margin-bottom:14px}
.report-export-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.report-columns{border-top:1px solid var(--line);padding-top:10px}
.report-columns summary{cursor:pointer;font-weight:700}
.report-column-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:10px}
.report-column{display:flex;gap:8px;align-items:flex-start;padding:8px 9px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}
.report-column input{margin-top:2px}
.report-column:has(input:disabled){opacity:.68}
.report-schedule-list{margin-top:12px}
.report-schedule-card{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}
.report-schedule-card>div:first-child{display:grid;gap:3px;min-width:0}
.report-schedule-card small{color:var(--muted);overflow-wrap:anywhere}
.report-schedule-card.is-disabled{opacity:.62}
.report-preview-table{max-height:560px;overflow:auto}
.report-preview-table thead{position:sticky;top:0;z-index:2}
.report-preview-table th{background:var(--panel)}
@media(max-width:1180px){
  .report-filter-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .report-type-field{grid-column:span 2}
  .report-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:800px){
  .report-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .report-type-field{grid-column:1/-1}
  .report-filter-actions{grid-column:1/-1}
  .report-charts{grid-template-columns:1fr}
  .report-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .report-column-grid{grid-template-columns:1fr}
  .report-schedule-card{align-items:flex-start;flex-direction:column}
  .report-schedule-card .row-actions{width:100%}
}
@media(max-width:520px){
  .report-filter-grid{grid-template-columns:1fr 1fr;gap:8px}
  .report-filter-grid .field-stack{min-width:0}
  .report-filter-grid input,.report-filter-grid select{width:100%;min-width:0}
  .report-metrics{grid-template-columns:1fr 1fr;gap:8px}
  .report-metrics .metric{padding:11px}
  .report-metrics .metric strong{font-size:1.05rem}
  .report-chart{min-height:180px}
  .funnel-step{grid-template-columns:105px 1fr}
  .report-export-actions>*{flex:1 1 calc(50% - 6px)}
  .reports-lower.two{grid-template-columns:1fr}
}


/* ===== V001 viewport adaptatif toutes tailles 2026-10-05 =====
   Le viewport, et non le modèle d'appareil, décide de la densité.
   La zone compte/déconnexion reste toujours visible ; seul le menu central défile. */
.app{
  grid-template-columns:clamp(244px,18vw,280px) minmax(0,1fr);
  min-height:100vh;
  min-height:100dvh;
}
.side{
  height:100vh;
  height:100dvh;
  max-height:100dvh;
  min-height:0;
  overflow:hidden;
  gap:12px;
  padding:14px;
}
.side .brand{flex:0 0 auto;min-width:0}
.side nav{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  padding-right:2px;
}
.side nav::-webkit-scrollbar{width:6px}
.side nav::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--muted) 34%,transparent);border-radius:999px}
.side nav button{width:100%;min-width:0}
.side .grow{display:none}
.side .userbox{
  flex:0 0 auto;
  min-width:0;
  margin-top:0;
  padding:13px;
  gap:6px;
  position:relative;
  z-index:2;
  background:color-mix(in srgb,var(--surface-solid) 94%,transparent);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.side .userbox>*{min-width:0;max-width:100%}
.side .userbox b,.side .userbox small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side #logout{width:100%;flex:0 0 auto}

/* Ordinateurs portables, zoom navigateur et fenêtres non maximisées. */
@media(min-width:981px) and (max-width:1399px){
  .app{grid-template-columns:clamp(236px,18vw,258px) minmax(0,1fr)}
  .main{padding:16px;gap:14px}
  .top{padding:15px 17px}
  .search-wrap{min-width:min(240px,24vw)}
}
@media(min-width:981px) and (max-height:820px){
  .side{padding:9px 11px;gap:7px}
  .side .brand{padding:3px 4px;gap:10px}
  .side .logo.small{width:38px;height:38px;border-radius:12px}
  .side nav{gap:5px}
  .side nav button{min-height:40px;padding:7px 10px;border-radius:12px;font-size:.91rem}
  .side .userbox{padding:10px 11px;gap:4px;border-radius:15px}
  .side #logout{min-height:40px;padding:7px 10px;border-radius:12px}
  .main{padding:12px 14px;gap:12px}
  .top{padding:12px 14px;border-radius:19px}
  .hero-band{padding:18px 20px;border-radius:22px}
  .hero-band h2{font-size:1.55rem}
  .metric{padding:14px 15px;border-radius:18px}
  .metric strong{font-size:1.65rem;margin-top:7px}
  .ph,.pb{padding:15px 17px}
}
@media(min-width:981px) and (max-height:650px){
  .side{padding-top:7px;padding-bottom:7px}
  .side .brand small{display:none}
  .side nav button{min-height:36px;padding:5px 9px;font-size:.86rem}
  .side .userbox{padding:8px 10px}
  .side #logout{min-height:36px;padding:5px 9px}
  .main{padding-top:9px;gap:9px}
  .top{position:relative;top:auto}
  .hero-band{padding:14px 16px}
  .hero-band h2{font-size:1.4rem}
  .hero-band p{font-size:.86rem}
}

/* La navigation tactile utilise la même structure : marque et compte fixes, menu défilable. */
@media(max-width:980px){
  .app{grid-template-columns:minmax(0,1fr)}
  .side{
    width:min(86vw,320px);
    height:100vh;
    height:100dvh;
    max-height:100dvh;
    min-height:0;
    padding-top:max(12px,env(safe-area-inset-top));
    padding-bottom:max(12px,env(safe-area-inset-bottom));
  }
  .side nav{flex:1 1 auto;min-height:0;overflow-y:auto}
  .side .userbox{flex:0 0 auto}
}

/* Les écrans très étroits gardent les actions essentielles lisibles sans élargir la page. */
@media(max-width:420px){
  .side{width:min(92vw,320px)}
  .side nav button{min-height:44px;padding:8px 10px}
  .side .userbox{padding:10px}
}


/* Facturation : brouillon éditable puis édition finale */
.invoice-editor-card{width:min(1080px,calc(100vw - 24px));max-height:min(92vh,920px);overflow:auto}
.invoice-lines-table{overflow-x:auto}
.invoice-lines-table table{min-width:820px}
.invoice-lines-table input{min-width:0;width:100%}
.invoice-lines-table .inv-desc{min-width:260px}
.invoice-lines-table .inv-qty,.invoice-lines-table .inv-unit{min-width:80px}
.invoice-lines-table .inv-price,.invoice-lines-table .inv-discount{min-width:100px}
.invoice-editor-totals{display:grid;gap:8px;justify-content:end;margin-top:12px}
.invoice-editor-totals>div{display:flex;gap:24px;justify-content:space-between;min-width:260px}
.invoice-editor-totals .invoice-total-main{font-size:1.08rem;padding-top:8px;border-top:1px solid var(--line)}
.invoice-editor-actions{position:sticky;bottom:0;background:var(--card);padding:10px 0 2px;z-index:2}
.compact-action{margin-top:6px;font-size:.78rem;padding:5px 8px}
@media(max-width:680px){
  .invoice-editor-card{width:calc(100vw - 10px);max-height:96vh;padding:14px}
  .invoice-editor-actions{display:grid;grid-template-columns:1fr 1fr}
  .invoice-editor-actions>*{width:100%}
}


/* Onboarding Excel entreprise */
.onboarding-import-panel{grid-column:1/-1;margin-top:18px}
.onboarding-import-actions{display:grid;grid-template-columns:auto minmax(220px,1fr) minmax(220px,280px) auto auto;gap:10px;align-items:center}
.onboarding-preview{display:grid;gap:12px;margin-top:14px}
.onboarding-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.onboarding-count{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--card)}
.onboarding-count b,.onboarding-count small{display:block}
.onboarding-count strong{display:block;font-size:1.35rem;margin:4px 0}
.onboarding-history{margin-top:16px}
.onboarding-history-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:10px 0;border-top:1px solid var(--line)}
.onboarding-history-row div small,.onboarding-history-row>small{display:block;color:var(--muted)}
.category-chip{display:inline-block;margin-top:2px;padding:3px 8px;border-radius:999px;background:var(--soft);color:var(--muted);font-size:.75rem}
@media(max-width:900px){
  .onboarding-import-actions{grid-template-columns:1fr 1fr}
  .onboarding-import-actions>*{width:100%}
}
@media(max-width:560px){
  .onboarding-import-actions{grid-template-columns:1fr}
  .onboarding-summary{grid-template-columns:1fr 1fr}
}


/* ===== Prestations & catalogue : densité responsive automatique 2026-10-05 ===== */
.service-admin-card{
  padding:0!important;
  gap:0!important;
  min-height:0!important;
  overflow:hidden;
}
.service-admin-card>summary{list-style:none}
.service-admin-card>summary::-webkit-details-marker{display:none}
.service-card-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:13px 14px;
  cursor:pointer;
  user-select:none;
}
.service-summary-copy{min-width:0;flex:1;display:grid;gap:7px}
.service-title-line{display:flex;align-items:flex-start;justify-content:space-between;gap:9px;min-width:0}
.service-title-line h3{min-width:0;margin:0;font-size:1rem;line-height:1.18;overflow-wrap:normal;word-break:normal}
.service-summary-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.service-summary-meta .price{font-size:1rem;line-height:1}
.service-summary-meta .category-chip{margin:0}
.service-expand{flex:0 0 auto;width:28px;height:28px;display:grid;place-items:center;border-radius:999px;background:var(--soft);color:var(--muted);font-size:1rem;transition:transform .18s ease}
.service-admin-card[open] .service-expand{transform:rotate(180deg)}
.service-card-details{display:grid;gap:9px;padding:0 14px 13px;border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
.service-card-details .service-description{padding-top:10px;font-size:.86rem;line-height:1.35}
.service-card-details .vehicle-prices-summary{margin:0}
.service-card-details .service-edit{width:auto;justify-self:start;min-height:38px;padding:7px 14px}

.vehicle-model-list{gap:7px}
.vehicle-make-group{
  display:block;
  padding:0;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:var(--surface);
}
.vehicle-make-group>summary{list-style:none}
.vehicle-make-group>summary::-webkit-details-marker{display:none}
.vehicle-make-summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  cursor:pointer;
  user-select:none;
  background:color-mix(in srgb,var(--surface) 92%,var(--soft));
}
.vehicle-make-name{font-weight:800;min-width:0}
.vehicle-count{font-size:.76rem;color:var(--muted);white-space:nowrap}
.vehicle-chevron{width:26px;height:26px;border-radius:999px;background:var(--soft);display:grid;place-items:center;color:var(--muted);transition:transform .18s ease}
.vehicle-make-group[open] .vehicle-chevron{transform:rotate(180deg)}
.vehicle-make-group .vehicle-model-chips{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
  gap:7px;
  padding:8px;
  border-top:1px solid var(--line);
}
.vehicle-model-chip{
  width:100%;
  display:grid;
  grid-template-columns:minmax(110px,.75fr) minmax(120px,1fr) minmax(145px,1.1fr) auto;
  gap:7px;
  align-items:end;
  padding:8px 9px;
  border-radius:11px;
}
.vehicle-model-chip .vehicle-model-name{align-self:center}
.vehicle-compact-field{min-width:0;display:grid;gap:3px}
.vehicle-compact-field>span{font-size:.67rem;line-height:1.1;color:var(--muted);font-weight:750;text-transform:uppercase;letter-spacing:.035em}
.vehicle-model-chip select{width:100%;min-width:0!important;min-height:38px;padding-top:6px;padding-bottom:6px}
.vehicle-save{min-height:38px;align-self:end;white-space:nowrap}
#vehicleCatalogAdmin .section-title{margin-bottom:10px}
#vehicleModelForm{gap:8px}

@media(min-width:761px){
  #servicesGrid{grid-template-columns:repeat(auto-fit,minmax(285px,1fr))}
}

@media(max-width:760px){
  #tab-services>.ph{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:8px 10px;
  }
  #tab-services>.ph>div{min-width:0}
  #tab-services>.ph p{margin-top:2px}
  #tab-services #addServiceBtn{
    width:auto;
    min-width:0;
    min-height:42px;
    padding:8px 13px;
    white-space:nowrap;
  }
  #tab-services>.pb{
    padding-bottom:calc(96px + env(safe-area-inset-bottom));
  }
  #servicesGrid{
    grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));
    gap:8px;
  }
  .service-card-summary{padding:10px 11px;gap:7px}
  .service-summary-copy{gap:6px}
  .service-title-line{gap:7px}
  .service-title-line h3{font-size:clamp(.96rem,4.35vw,1.08rem)}
  .service-summary-meta{gap:6px}
  .service-summary-meta .price{font-size:.96rem}
  .service-summary-meta .category-chip{font-size:.68rem;padding:2px 6px}
  .service-summary-meta .duration-chip,.service-title-line .mode-chip{font-size:.68rem;padding:4px 7px}
  .service-expand{width:25px;height:25px;font-size:.9rem}
  .service-card-details{padding:0 11px 10px;gap:7px}
  .service-card-details .service-description{
    padding-top:8px;
    font-size:.79rem;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }
  .service-card-details .vehicle-prices-summary{font-size:.76rem;line-height:1.35}
  .service-card-details .service-edit{min-height:36px;padding:6px 12px;font-size:.84rem}

  #vehicleCatalogAdmin{padding:11px;border-radius:16px}
  #vehicleCatalogAdmin .section-title h3{font-size:1.05rem;margin-bottom:4px}
  #vehicleCatalogAdmin .section-title p{
    font-size:.8rem;
    line-height:1.3;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }
  #vehicleModelForm{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    margin-bottom:8px;
  }
  #vehicleModelForm>*{min-width:0}
  #vehicleModelForm button{grid-column:1/-1;min-height:40px}
  .vehicle-model-list{margin-top:8px;gap:6px}
  .vehicle-make-summary{padding:9px 10px}
  .vehicle-make-name{font-size:.94rem}
  .vehicle-count{font-size:.7rem}
  .vehicle-make-group .vehicle-model-chips{
    grid-template-columns:minmax(0,1fr);
    gap:6px;
    padding:6px;
  }
  .vehicle-model-chip{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:
      "name save"
      "class energy";
    gap:6px 7px;
    padding:8px;
  }
  .vehicle-model-chip .vehicle-model-name{grid-area:name;font-size:.9rem;align-self:center}
  .vehicle-model-chip .vehicle-save{grid-area:save;justify-self:end;min-height:34px;padding:5px 8px;font-size:.76rem}
  .vehicle-model-chip .vehicle-compact-field:first-of-type{grid-area:class}
  .vehicle-model-chip .vehicle-compact-field:nth-of-type(2){grid-area:energy}
  .vehicle-model-chip select{min-height:38px;font-size:.86rem;padding:6px 8px}
}

@media(max-width:380px){
  #vehicleModelForm{grid-template-columns:minmax(0,1fr)}
  #vehicleModelForm button{grid-column:auto}
  .vehicle-model-chip{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "name save"
      "class class"
      "energy energy";
  }
  .service-title-line{align-items:center}
  .service-title-line .mode-chip{max-width:90px}
}

@media(max-width:980px) and (orientation:landscape) and (max-height:600px){
  #servicesGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #tab-services>.pb{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  #vehicleModelForm{grid-template-columns:repeat(4,minmax(0,1fr))}
  #vehicleModelForm button{grid-column:auto}
}


/* ===== Activité, multi-prestations et options publiques 2026-10-05 ===== */
.live-activity-head{
  position:sticky;
  top:-14px;
  z-index:2;
  margin:-14px -14px 10px;
  padding:14px;
  background:color-mix(in srgb,var(--surface-solid) 96%,transparent);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid color-mix(in srgb,var(--line) 72%,transparent);
}
.live-activity-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.live-activity-actions .btn{min-height:38px;padding:7px 10px}

.service-selection-setting{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,320px);
  gap:14px;
  align-items:center;
  margin-bottom:12px;
  padding:12px 14px;
  border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line));
  border-radius:16px;
  background:color-mix(in srgb,var(--accent) 5%,var(--surface));
}
.service-selection-setting>div{display:grid;gap:4px;min-width:0}
.service-selection-setting small{color:var(--muted);line-height:1.35}
.service-selection-setting .compact-field{margin:0}
.service-selection-setting .compact-field>span{font-size:.74rem;color:var(--muted);font-weight:750;text-transform:uppercase;letter-spacing:.04em}
.service-selection-setting select{min-height:42px;padding-top:7px;padding-bottom:7px}

.option-choice{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr) auto;
  grid-template-areas:
    "check copy price"
    ". quantity quantity";
  align-items:start;
  gap:6px 10px;
  margin:0!important;
  padding:10px 11px!important;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface-2);
  cursor:pointer;
  font-weight:400!important;
}
.option-check{
  grid-area:check;
  width:22px!important;
  height:22px!important;
  min-height:22px!important;
  padding:0!important;
  margin:1px 0 0!important;
  border-radius:6px!important;
  flex:none;
  accent-color:var(--accent);
}
.option-copy{
  grid-area:copy;
  display:grid;
  gap:3px;
  min-width:0;
  line-height:1.25;
}
.option-copy b{font-size:.92rem;line-height:1.25}
.option-copy small{
  display:block;
  color:var(--muted);
  font-size:.78rem;
  line-height:1.3;
  font-weight:500;
}
.option-price{
  grid-area:price;
  align-self:start;
  white-space:nowrap;
  font-size:.88rem;
  line-height:1.25;
  font-weight:800;
  color:var(--text);
}
.option-quantity{
  grid-area:quantity;
  display:grid;
  grid-template-columns:auto minmax(70px,100px);
  align-items:center;
  justify-content:end;
  gap:7px;
  color:var(--muted);
}
.option-quantity small{font-size:.72rem}
.option-qty{
  width:88px!important;
  min-height:36px!important;
  padding:5px 8px!important;
  margin:0!important;
}

@media(max-width:760px){
  .service-selection-setting{
    grid-template-columns:minmax(0,1fr);
    gap:8px;
    padding:10px 11px;
  }
  .service-selection-setting small{font-size:.78rem}
  .live-activity-panel{
    max-height:calc(100dvh - 94px - env(safe-area-inset-bottom));
  }
}

@media(max-width:430px){
  .live-activity-head{
    align-items:flex-start;
    gap:8px;
  }
  .live-activity-actions{gap:5px}
  .live-activity-actions .btn{min-height:36px;padding:6px 8px;font-size:.78rem}
  .option-choice{
    grid-template-columns:22px minmax(0,1fr);
    grid-template-areas:
      "check copy"
      ". price"
      ". quantity";
    gap:5px 8px;
    padding:9px!important;
  }
  .option-price{justify-self:start;font-size:.82rem}
  .option-quantity{justify-content:start}
}