/* ==========================================================================
   QuieTag theme — shared by every app page.
   Load LAST in <head> (after the page's own <style>) so it wins the cascade.
   Same identity as quietag.com: navy ground, warm paper ink, one orange accent.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Schibsted+Grotesk:wght@400;500;600;700;800&display=swap');

:root{
  --qt-bg:#0E1120;
  --qt-surface:#151A2E;
  --qt-surface-2:#1B2140;
  --qt-line:#2A3050;
  --qt-ink:#F2F1EC;
  --qt-ink-2:#9AA0BA;
  --qt-ink-3:#7F87A6;
  --qt-accent:#F2761F;          /* orange used as text / borders / focus */
  --qt-accent-soft:rgba(242,118,31,.12);
  --qt-accent-line:rgba(242,118,31,.35);
  --qt-fill:#F2761F;            /* orange used as a button / badge background */
  --qt-fill-hover:#FF8A3A;
  --qt-accent-ink:#0E1120;      /* text on top of --qt-fill */
  --qt-ok:#5FD3A8;   --qt-ok-soft:rgba(95,211,168,.14);   --qt-ok-strong:rgba(95,211,168,.24);
  --qt-err:#FF8F86;  --qt-err-soft:rgba(229,83,75,.14);  --qt-err-strong:rgba(229,83,75,.24); --qt-err-line:#E5534B;
  --qt-warn:#F5B455; --qt-warn-soft:rgba(245,180,85,.14);
  --qt-info:#9DB0FF; --qt-info-soft:rgba(124,150,255,.15);
  --qt-header:rgba(14,17,32,.85);
  --qt-glow:rgba(242,118,31,.10);
  --qt-shadow:0 10px 30px rgba(0,0,0,.28);
  --qt-shadow-lg:0 20px 50px rgba(0,0,0,.45);
  --qt-hover-row:rgba(255,255,255,.02);
  --qt-sans:'Schibsted Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --qt-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  color-scheme:dark;
}
/* ---- light theme: warm paper ground, same navy ink, darker orange for text ---- */
@media (prefers-color-scheme:light){
  :root:not([data-qt-theme="dark"]){ 
    --qt-bg:#F6F4EE; --qt-surface:#FFFFFF; --qt-surface-2:#F0EDE4; --qt-line:#E1DDD1;
    --qt-ink:#0E1120; --qt-ink-2:#566079; --qt-ink-3:#6F7792;
    --qt-accent:#C4530A; --qt-accent-soft:rgba(242,118,31,.12); --qt-accent-line:rgba(196,83,10,.4);
    --qt-fill:#F2761F; --qt-fill-hover:#E5650D; --qt-accent-ink:#0E1120;
    --qt-ok:#0B7A57; --qt-ok-soft:rgba(11,122,87,.10); --qt-ok-strong:rgba(11,122,87,.18);
    --qt-err:#B42318; --qt-err-soft:rgba(217,45,32,.08); --qt-err-strong:rgba(217,45,32,.16); --qt-err-line:#D92D20;
    --qt-warn:#8A5A00; --qt-warn-soft:rgba(200,130,0,.12);
    --qt-info:#3D4FC4; --qt-info-soft:rgba(61,79,196,.10);
    --qt-header:rgba(246,244,238,.88); --qt-glow:rgba(242,118,31,.12);
    --qt-shadow:0 8px 24px rgba(14,17,32,.07); --qt-shadow-lg:0 20px 50px rgba(14,17,32,.14);
    --qt-hover-row:rgba(14,17,32,.03);
    color-scheme:light;
 }
}
:root[data-qt-theme="light"]{ 
    --qt-bg:#F6F4EE; --qt-surface:#FFFFFF; --qt-surface-2:#F0EDE4; --qt-line:#E1DDD1;
    --qt-ink:#0E1120; --qt-ink-2:#566079; --qt-ink-3:#6F7792;
    --qt-accent:#C4530A; --qt-accent-soft:rgba(242,118,31,.12); --qt-accent-line:rgba(196,83,10,.4);
    --qt-fill:#F2761F; --qt-fill-hover:#E5650D; --qt-accent-ink:#0E1120;
    --qt-ok:#0B7A57; --qt-ok-soft:rgba(11,122,87,.10); --qt-ok-strong:rgba(11,122,87,.18);
    --qt-err:#B42318; --qt-err-soft:rgba(217,45,32,.08); --qt-err-strong:rgba(217,45,32,.16); --qt-err-line:#D92D20;
    --qt-warn:#8A5A00; --qt-warn-soft:rgba(200,130,0,.12);
    --qt-info:#3D4FC4; --qt-info-soft:rgba(61,79,196,.10);
    --qt-header:rgba(246,244,238,.88); --qt-glow:rgba(242,118,31,.12);
    --qt-shadow:0 8px 24px rgba(14,17,32,.07); --qt-shadow-lg:0 20px 50px rgba(14,17,32,.14);
    --qt-hover-row:rgba(14,17,32,.03);
    color-scheme:light;
 }


/* ---------- ground ---------- */
html body{
  font-family:var(--qt-sans);
  color:var(--qt-ink);
  background-color:var(--qt-bg);
  background-image:radial-gradient(60% 40% at 50% 0%,var(--qt-glow),transparent 70%);
  background-repeat:no-repeat;
  -webkit-font-smoothing:antialiased;
}html ::selection{background:var(--qt-fill);color:var(--qt-accent-ink)}html a{color:var(--qt-accent)}/* ---------- wordmark ---------- */
html .qt-tag{color:var(--qt-accent)}html button .qt-tag,
html .submit-btn .qt-tag,
html .send-btn .qt-tag,
html .download-btn .qt-tag,
html .go-dashboard-btn .qt-tag,
html .call-now-btn .qt-tag,
html .generate-btn .qt-tag,
html .save-btn .qt-tag{color:inherit}/* ---------- header ---------- */
html .header{
  background:var(--qt-header);
  color:var(--qt-ink);
  border-bottom:1px solid var(--qt-line);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}html .header h1,
html .card h1{
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--qt-ink);
}html .header h1::before,
html .card h1::before{
  content:"";display:inline-block;vertical-align:-4px;margin-right:9px;width:19px;height:22px;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='8 4 48 56'%3E%3Cpath d='M12 8h40v26c0 11-8 18-20 23C20 52 12 45 12 34z' fill='none' stroke='%23F2761F' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E");
}html .header{position:relative;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px}html .header p{display:none}html .qt-tagline{
  display:block;font-family:var(--qt-mono);
  font-size:10px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--qt-ink-2);opacity:1;margin-top:3px;
}html .qt-page-title{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;gap:10px;white-space:nowrap;
  font-weight:700;font-size:16px;letter-spacing:-.01em;color:var(--qt-ink);
}html .qt-pill{
  font-family:var(--qt-mono);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--qt-accent);background:var(--qt-accent-soft);border:1px solid var(--qt-accent-line);
  border-radius:999px;padding:3px 9px;
}
@media (max-width:1040px){html .qt-page-title{
    position:static;transform:none;order:10;flex:0 0 100%;
    padding-top:8px;border-top:1px solid var(--qt-line);font-size:15px;white-space:normal;
  }
}html .logout-link,
html .logout-btn{
  color:var(--qt-ink-2);opacity:1;
  border:1px solid var(--qt-line);background:transparent;
}html .logout-link:hover,
html .logout-btn:hover{color:var(--qt-ink);border-color:var(--qt-accent);background:var(--qt-accent-soft)}html .privacy-badge{
  background:var(--qt-accent-soft);color:var(--qt-accent);
  border:1px solid var(--qt-accent-line);
  font-family:var(--qt-mono);letter-spacing:.06em;text-transform:uppercase;
}/* ---------- EN / FR toggle (injected by i18n.js) ---------- */
html .hn-lang{border:1px solid var(--qt-line)}html .hn-lang button{color:var(--qt-ink-2);opacity:1;font-family:var(--qt-mono);letter-spacing:.08em}html .hn-lang button:hover{color:var(--qt-ink)}html .hn-lang button.on{background:var(--qt-fill);color:var(--qt-accent-ink)}html .hn-lang button:focus-visible{outline:2px solid var(--qt-accent)}/* ---------- surfaces ---------- */
html .card,
html .vehicle-card,
html .message-section,
html .qr-card,
html .instructions,
html .section,
html .notif-item,
html .empty-note{
  background:var(--qt-surface);
  border:1px solid var(--qt-line);
  box-shadow:var(--qt-shadow);
  color:var(--qt-ink);
}html .empty-note{box-shadow:none;color:var(--qt-ink-2)}html .card h2,
html .vehicle-info h2,
html .qr-card h2,
html .instructions h3,
html .section h2,
html .status-screen h2,
html .vehicle-name,
html .notif-group-title,
html .notif-scenario{color:var(--qt-ink)}html .card h2,
html .qr-card h2,
html .status-screen h2,
html .section h2{letter-spacing:-.01em}html .card>p,
html .card>p.subtitle,
html .qr-card p,
html .step p,
html .vehicle-info p,
html .vehicle-type,
html .status-screen p,
html .success-screen p,
html .section>p.subtitle,
html .notif-meta,
html .privacy-note,
html .call-note,
html .call-now-hint,
html .checkbox-sub,
html .hint,
html .edit-form .hint{color:var(--qt-ink-2)}html .divider{color:var(--qt-ink-3)}html .divider::before,
html .divider::after{background:var(--qt-line)}html .vehicle-code,
html .notif-time,
html .notif-group-code,
html .loading,
html .loading-note,
html .thread-empty,
html .vehicle-plate{color:var(--qt-ink-3)}html .vehicle-plate{color:var(--qt-ink-2)}html .section-title{
  font-family:var(--qt-mono);font-weight:500;font-size:11.5px;
  letter-spacing:.14em;color:var(--qt-ink-2);
}/* ---------- forms ---------- */
html label,
html .generate-row label,
html .edit-form label{color:var(--qt-ink-2)}html input,
html select,
html textarea,
html .message-section textarea,
html .edit-form input,
html .edit-form select,
html .generate-row input,
html .search-input,
html .reply-input,
html .row-actions select,
html .phone-input{
  background:var(--qt-bg);
  color:var(--qt-ink);
  border:1.5px solid var(--qt-line);
  font-family:var(--qt-sans);
}html input::placeholder,
html textarea::placeholder{color:var(--qt-ink-3)}html .phone-input{font-family:var(--qt-mono);color:var(--qt-ink);background:var(--qt-bg);border-color:var(--qt-accent)}html .phone-input::placeholder{color:var(--qt-ink-3)}html input:focus,
html select:focus,
html textarea:focus,
html .message-section textarea:focus,
html .edit-form input:focus,
html .edit-form select:focus,
html .reply-input:focus,
html .phone-input:focus{
  outline:none;border-color:var(--qt-accent);
  box-shadow:0 0 0 3px var(--qt-accent-soft);
}html input:-webkit-autofill{
  -webkit-box-shadow:0 0 0 40px var(--qt-bg) inset;
  -webkit-text-fill-color:var(--qt-ink);caret-color:var(--qt-ink);
}html input[type=checkbox]{accent-color:var(--qt-accent)}html .error-box{background:var(--qt-err-soft);border:1.5px solid var(--qt-err-line);color:var(--qt-err)}html .switch-link{color:var(--qt-ink-2)}html .switch-link a{color:var(--qt-accent)}/* ---------- primary buttons ---------- */
html .submit-btn,
html .send-btn,
html .generate-btn,
html .save-btn,
html .reply-send-btn,
html .download-btn,
html .go-dashboard-btn,
html .call-now-btn{
  background:var(--qt-fill);color:var(--qt-accent-ink);
  font-family:var(--qt-sans);font-weight:700;letter-spacing:-.005em;
}html .submit-btn:hover,
html .send-btn:hover,
html .generate-btn:hover,
html .save-btn:hover,
html .download-btn:hover,
html .go-dashboard-btn:hover{background:var(--qt-fill-hover)}html .submit-btn:disabled,
html .send-btn:disabled,
html .generate-btn:disabled,
html .save-btn:disabled,
html .reply-send-btn:disabled{
  background:var(--qt-line);color:var(--qt-ink-3);
}html .emergency-send-btn{background:var(--qt-err-line);color:#fff;font-family:var(--qt-sans);font-weight:700}/* ---------- secondary buttons ---------- */
html .print-btn,
html .add-btn,
html .cancel-btn,
html .action-btn.edit{
  background:transparent;color:var(--qt-ink);
  border:1.5px solid var(--qt-line);font-family:var(--qt-sans);
}html .print-btn:hover,
html .cancel-btn:hover,
html .action-btn.edit:hover{border-color:var(--qt-accent);background:var(--qt-accent-soft)}html .add-btn{border:1.5px dashed var(--qt-accent);color:var(--qt-accent);background:transparent}html .add-btn:hover{background:var(--qt-accent-soft)}html .action-btn.deactivate{background:var(--qt-err-soft);color:var(--qt-err)}html .action-btn.deactivate:hover{background:var(--qt-err-strong)}html .action-btn.activate{background:var(--qt-ok-soft);color:var(--qt-ok)}html .action-btn.activate:hover{background:var(--qt-ok-strong)}html .delete-link,
html .close-session-link{color:var(--qt-err)}/* ---------- scan page ---------- */
html .vehicle-icon{background:var(--qt-accent-soft)}html .type-badge{background:var(--qt-accent-soft);color:var(--qt-accent);font-family:var(--qt-mono);letter-spacing:.08em}html .plate-badge{background:transparent;color:var(--qt-ink);border:1.5px solid var(--qt-ink-2);font-family:var(--qt-mono)}html .scenario-btn{background:var(--qt-surface);border:1.5px solid var(--qt-line);color:var(--qt-ink)}html .scenario-btn:hover{border-color:var(--qt-accent);background:var(--qt-surface-2)}html .scenario-btn.selected{border-color:var(--qt-accent);background:var(--qt-accent-soft);box-shadow:0 0 0 3px var(--qt-accent-soft)}html .scenario-btn.emergency.selected{background:var(--qt-err-soft);border-color:var(--qt-err-line);box-shadow:0 0 0 3px var(--qt-err-soft)}html .scenario-label{color:var(--qt-ink)}html .add-msg-link{color:var(--qt-accent)}html .pref-btn{background:var(--qt-bg);color:var(--qt-ink-2);border:2px solid transparent}html .pref-btn.active{background:var(--qt-accent-soft);color:var(--qt-accent);border-color:var(--qt-accent)}html .pref-btn.selected-muted{background:var(--qt-surface-2);color:var(--qt-ink-3);border-color:var(--qt-line)}html .soon-badge{background:var(--qt-surface-2);color:var(--qt-ink-2);font-family:var(--qt-mono)}html .checkbox-row{color:var(--qt-ink)}html .scan-card-check,
html .message-section .checkbox-row,
html .container>.checkbox-row{background:var(--qt-bg);border-color:var(--qt-line)}html .checkbox-row.checked{background:var(--qt-accent-soft);border-color:var(--qt-accent)}html .checkbox-box{border-color:var(--qt-ink-3);color:var(--qt-accent-ink)}html .checkbox-box.checked{background:var(--qt-fill);border-color:var(--qt-fill)}html .checkbox-label{color:var(--qt-ink)}html .edit-form .checkbox-row,
html .edit-form .checkbox-row label,
html .checkbox-row label{color:var(--qt-ink-2);background:transparent;border:0}html .success-screen h2{color:var(--qt-accent)}html .session-info{background:var(--qt-accent-soft);color:var(--qt-ink);border:1px solid var(--qt-accent-line)}html .emergency-callout{background:var(--qt-err-soft);border-color:var(--qt-err-line);color:var(--qt-err)}/* ---------- onboarding / success ---------- */
html .type-btn{background:var(--qt-bg);border:1.5px solid var(--qt-line);color:var(--qt-ink)}html .type-btn:hover{border-color:var(--qt-accent);background:var(--qt-accent-soft)}html .success-detail{background:var(--qt-accent-soft);border:1.5px solid var(--qt-accent-line);color:var(--qt-ink)}html .success-detail strong{color:var(--qt-accent)}/* ---------- qr pages ---------- */
html #qr-image{background:#fff;border:3px solid var(--qt-accent)}html .scan-url{background:var(--qt-bg);color:var(--qt-ink-2);border:1px solid var(--qt-line);font-family:var(--qt-mono)}html .serial-display{background:var(--qt-bg);color:var(--qt-accent);border:1px solid var(--qt-line);font-family:var(--qt-mono)}html .badge{background:var(--qt-accent-soft);color:var(--qt-accent);border:1px solid var(--qt-accent-line);font-family:var(--qt-mono);letter-spacing:.12em}html .step-num{background:var(--qt-fill);color:var(--qt-accent-ink);font-weight:700}html .warning-note{background:var(--qt-warn-soft);border:1.5px solid var(--qt-warn);color:var(--qt-warn)}html .error-note{color:var(--qt-err)}/* ---------- dashboard ---------- */
html .status-pill.active,
html .session-status.active,
html .pill.active,
html .pill.kind-vehicle{background:var(--qt-ok-soft);color:var(--qt-ok)}html .status-pill.deactivated,
html .session-status.expired,
html .pill.unregistered{background:var(--qt-surface-2);color:var(--qt-ink-2)}html .status-pill,
html .session-status,
html .pill{font-family:var(--qt-mono);letter-spacing:.06em}html .pill.deactivated{background:var(--qt-warn-soft);color:var(--qt-warn)}html .pill.retired{background:var(--qt-err-soft);color:var(--qt-err)}html .pill.kind-item{background:var(--qt-info-soft);color:var(--qt-info)}html .notif-item{box-shadow:none}html .notif-item:hover{border-color:var(--qt-accent)}html .notif-expand-hint{color:var(--qt-accent)}html .thread-wrap{border-top:1px solid var(--qt-line)}html .thread-msg.bystander{background:var(--qt-surface-2);color:var(--qt-ink)}html .thread-msg.owner{background:var(--qt-fill);color:var(--qt-accent-ink);font-weight:500}/* ---------- admin ---------- */
html .stat-card{background:var(--qt-bg);border:1px solid var(--qt-line)}html .stat-card .num{color:var(--qt-accent);font-family:var(--qt-mono);font-weight:500}html .stat-card .label{color:var(--qt-ink-2);font-family:var(--qt-mono);letter-spacing:.1em}html .new-stickers-box{background:var(--qt-accent-soft);border:1.5px solid var(--qt-accent-line);color:var(--qt-ink)}html .tab-btn{background:var(--qt-bg);color:var(--qt-ink-2);border:1px solid var(--qt-line);font-family:var(--qt-sans)}html .tab-btn.active{background:var(--qt-fill);color:var(--qt-accent-ink);border-color:var(--qt-fill)}html .tab-btn:hover:not(.active){background:var(--qt-surface-2);color:var(--qt-ink)}html table{color:var(--qt-ink)}html th,
html td{border-bottom:1px solid var(--qt-line)}html th{color:var(--qt-ink-2);font-family:var(--qt-mono);font-weight:500;letter-spacing:.1em}html tbody tr:hover td{background:var(--qt-hover-row)}html .qr-link{color:var(--qt-accent)}html .row-actions button{background:var(--qt-surface-2);color:var(--qt-ink);border:1px solid var(--qt-line)}html .row-actions button:hover{background:var(--qt-fill);color:var(--qt-accent-ink);border-color:var(--qt-fill)}/* ---------- admin login (dark card on dark page) ---------- */
html body>.card:only-child{box-shadow:var(--qt-shadow-lg)}html body>.card:only-child p{color:var(--qt-ink-2)}/* ---------- scrollbars ---------- */
html *{scrollbar-color:var(--qt-line) transparent}/* ---------- light/dark toggle (injected by quietag-theme.js) ---------- */
html .qt-theme-btn{
  flex:0 0 auto;width:32px;height:32px;border-radius:999px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;padding:0;
  background:transparent;border:1px solid var(--qt-line);color:var(--qt-ink-2);
}html .qt-theme-btn:hover{color:var(--qt-ink);border-color:var(--qt-accent);background:var(--qt-accent-soft)}html .qt-theme-btn:focus-visible{outline:2px solid var(--qt-accent);outline-offset:2px}html .qt-theme-btn svg{width:16px;height:16px;display:block}html .qt-theme-btn .qt-sun{display:none}:root[data-qt-resolved="dark"] .qt-theme-btn .qt-sun{display:block}:root[data-qt-resolved="dark"] .qt-theme-btn .qt-moon{display:none}html .qt-theme-group{display:flex;align-items:center;gap:8px;flex-shrink:0}html .qt-theme-fixed{position:fixed;top:12px;right:12px;z-index:50}