/* IQOS / GlowSketch visual system. Presentation only; existing grids and routes stay intact. */
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url("./hanken-grotesk-400.ttf") format("truetype")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url("./hanken-grotesk-500.ttf") format("truetype")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url("./hanken-grotesk-600.ttf") format("truetype")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url("./hanken-grotesk-700.ttf") format("truetype")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:800;font-display:swap;src:url("./hanken-grotesk-800.ttf") format("truetype")}

html[data-iqos-theme="glow"]{
  color-scheme:light;
  --iq-font:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif;
  --iq-bg:#f5f5f7;--iq-surface:#fff;--iq-soft:#fafafb;--iq-ink:#1d1d1f;
  --iq-muted:#6e6e73;--iq-faint:#707076;--iq-line:rgba(0,0,0,.09);--iq-hair:rgba(0,0,0,.055);
  --iq-hover:rgba(0,0,0,.035);--iq-selected:rgba(0,0,0,.065);
  --iq-blue:#0879e5;--iq-green:#16833b;--iq-red:#c72f27;--iq-amber:#9c6200;
  --iq-radius:14px;--iq-control-radius:9px;
  --iq-shadow:0 1px 3px rgba(0,0,0,.045),0 0 0 .5px rgba(0,0,0,.025);
  --iq-overlay-shadow:0 18px 60px rgba(0,0,0,.14),0 0 0 1px rgba(0,0,0,.04);
  --iq-focus:0 0 0 3px rgba(10,132,255,.16);
}
html[data-iqos-theme="glow"] body{
  font-family:var(--iq-font);background:var(--iq-bg);color:var(--iq-ink);
  font-size:15px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
html[data-iqos-theme="glow"] :where(button,input,select,textarea){font-family:var(--iq-font)}
html[data-iqos-theme="glow"] :where(button,a,input,select,textarea,summary):focus-visible{
  outline:2px solid var(--iq-blue);outline-offset:3px;
}
html[data-iqos-theme="glow"] :where(button,a,summary){transition:background-color .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease}
html[data-iqos-theme="glow"] :where(button,input,select,textarea):disabled{cursor:not-allowed}
html[data-iqos-theme="glow"] :where(code,pre,kbd,samp){font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
html[data-iqos-theme="glow"] :where(table,.tabular-nums,[class*="metric"],.num){font-variant-numeric:tabular-nums}
html[data-iqos-theme="glow"] ::selection{background:#dcecff;color:#1d1d1f}
html[data-iqos-theme="glow"] ::-webkit-scrollbar{width:7px;height:7px}
html[data-iqos-theme="glow"] ::-webkit-scrollbar-track{background:transparent}
html[data-iqos-theme="glow"] ::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15);border-radius:99px}
html[data-iqos-theme="glow"] ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.25)}

/* Host shell: preserve sidebar width, header position and page content widths. */
body[data-iqos-surface="host"] #root{font-family:var(--iq-font);color:var(--iq-ink)}
body[data-iqos-surface="host"] #root :where([class~="font-sans"]){font-family:var(--iq-font)!important}
body[data-iqos-surface="host"] #root :where([class~="bg-[#fbfbfd]"],[class~="bg-[#F7F8FA]"],[class~="bg-[#f9fafb]"],[class~="bg-[#f5f5f7]"]){background-color:var(--iq-bg)!important}
body[data-iqos-surface="host"] #root>div{background-color:var(--iq-bg)}
body[data-iqos-surface="host"] #root aside[class~="fixed"]{
  background:var(--iq-bg)!important;border-right-color:var(--iq-hair)!important;
}
body[data-iqos-surface="host"] #root header[class*="sticky"],
body[data-iqos-surface="host"] #root header[class*="fixed"]{
  background:rgba(245,245,247,.9)!important;backdrop-filter:blur(20px) saturate(1.5);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);border-color:var(--iq-hair)!important;
}
body[data-iqos-surface="host"] #root :where(header) :where(input){background:rgba(255,255,255,.8)!important}

/* A single navigation rhythm; hierarchy is indicated by indentation, not different fonts. */
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav :where(button,summary){
  font-family:var(--iq-font)!important;font-size:13.5px!important;line-height:20px!important;
  font-weight:600!important;letter-spacing:-.01em!important;
  min-height:40px;border-radius:9px!important;text-align:left;
}
body[data-iqos-surface="host"] #root aside[class~="fixed"] button[class~="w-full"]{
  font-family:var(--iq-font)!important;font-size:13.5px!important;line-height:20px!important;
  font-weight:600!important;letter-spacing:-.01em!important;min-height:40px;border-radius:9px!important;
}
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav button{
  padding-top:9px!important;padding-bottom:9px!important;
}
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav :where(button,summary):not(:disabled):hover{background:var(--iq-hover)!important}
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav :where(button)[class~="bg-gray-100"],
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav button[aria-current="page"]{
  background:var(--iq-selected)!important;color:var(--iq-ink)!important;box-shadow:none!important;
}
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav :where(button)>svg{width:16px;height:16px;flex-shrink:0;stroke-width:1.75}
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav button:disabled{color:#a1a1a6!important}
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav button :where(span[class*="rounded-full"]){font-size:11px!important;font-weight:600;line-height:16px}
body[data-iqos-surface="host"] #root .iqos-nav-group{margin:0!important}
body[data-iqos-surface="host"] #root aside[class~="fixed"] nav .iqos-nav-heading{
  min-height:40px;height:40px;padding:0 12px;border-bottom:1px solid var(--iq-hair);
  color:var(--iq-muted);font-size:10.5px!important;font-weight:800!important;letter-spacing:.085em!important;
  border-radius:0!important;text-transform:uppercase;
}
body[data-iqos-surface="host"] #root .iqos-nav-heading>.iqos-nav-chevron{width:13px;height:13px;color:var(--iq-faint)}
body[data-iqos-surface="host"] #root .iqos-ticketing-link{
  display:flex;align-items:center;gap:12px;width:100%;padding:9px 12px;
  color:#48484a;border:0;background:transparent;margin-bottom:5px;
}
body[data-iqos-surface="host"] #root .iqos-ticketing-link svg{color:#8e8e93}
body[data-iqos-surface="host"] #root .iqos-ticketing-link[aria-current="page"] svg{color:var(--iq-ink)}

/* Host typography: dense operational tables keep their columns and information. */
body[data-iqos-surface="host"] #root :where(h1):not(#cctv-root *){
  font-size:clamp(26px,2.1vw,31px);font-weight:800;line-height:1.15;letter-spacing:-.04em;color:var(--iq-ink);
}
body[data-iqos-surface="host"] #root :where(h2):not(#cctv-root *){font-weight:700;letter-spacing:-.025em;line-height:1.3}
body[data-iqos-surface="host"] #root :where(h3,h4):not(#cctv-root *){font-weight:700;letter-spacing:-.015em}
body[data-iqos-surface="host"] #root :where(h1+p):not(#cctv-root *){font-size:13.5px;color:var(--iq-muted);line-height:1.5}
body[data-iqos-surface="host"] #root :where([class~="text-gray-500"],[class~="text-gray-600"],[class~="text-[#86868b]"],[class~="text-[#7C8799]"],[class~="text-[#4B5563]"]){color:var(--iq-muted)!important}
body[data-iqos-surface="host"] #root :where([class~="text-gray-400"],[class~="text-[#b0b0b5]"],[class~="text-[#9b9ba0]"],[class~="text-[#8B95A7]"],[class~="text-[#B6BEC9]"],[class~="text-[#c0c5cc]"]){color:var(--iq-faint)!important}
body[data-iqos-surface="host"] #root :where([class~="text-gray-700"],[class~="text-gray-800"],[class~="text-gray-900"],[class~="text-[#111827]"]){color:var(--iq-ink)!important}
body[data-iqos-surface="host"] #root :where([class~="text-[9px]"],[class~="text-[10px]"]):not(#cctv-root *){font-size:11px}
body[data-iqos-surface="host"] #root :where([class~="text-[26px]"],[class~="text-[28px]"],[class~="text-[32px]"],[class~="text-3xl"]):not(#cctv-root *){font-weight:700;letter-spacing:-.035em;font-variant-numeric:tabular-nums}

/* Unified cards for dashboard, sales, leads, performance, fleet, reports, admin and KB. */
body[data-iqos-surface="host"] #root :where(div,section,article,aside,form)[class~="bg-white"][class*="rounded-"]:not(#cctv-root *){
  background:var(--iq-surface)!important;border-radius:var(--iq-radius)!important;
  border-color:var(--iq-hair)!important;box-shadow:var(--iq-shadow)!important;
}
body[data-iqos-surface="host"] #root :where([class~="border-gray-100"],[class~="border-gray-200"],[class~="border-black/[0.05]"],[class~="border-black/[0.06]"],[class~="border-[#F0F0F2]"],[class~="border-[#E2E7EE]"],[class~="border-[#E5EAF0]"]):not(#cctv-root *){border-color:var(--iq-hair)!important}
body[data-iqos-surface="host"] #root :where([class~="bg-gray-50"],[class~="bg-[#F4F5F7]"],[class~="bg-[#F0F0F2]"]):not(#cctv-root *){background-color:var(--iq-soft)!important}
body[data-iqos-surface="host"] #root :where(div,section)[class~="bg-[#1d1d1f]"]:not(#cctv-root *){background:#252527!important;box-shadow:var(--iq-shadow);border-radius:var(--iq-radius)}
body[data-iqos-surface="host"] #root :where(div,section)[class~="bg-gradient-to-br"]:not(#cctv-root *){box-shadow:var(--iq-shadow);border-radius:var(--iq-radius)}

/* Forms, settings controls, toolbar filters, menus and dialog surfaces. */
body[data-iqos-surface="host"] #root :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),select,textarea):not(#cctv-root *){
  font-family:var(--iq-font);border-color:var(--iq-line);border-radius:var(--iq-control-radius);
  color:var(--iq-ink);background-color:var(--iq-surface);box-shadow:none;
}
body[data-iqos-surface="host"] #root :where(input,select,textarea):not(#cctv-root *):focus{
  border-color:#80baff;box-shadow:var(--iq-focus);outline:none;
}
body[data-iqos-surface="host"] #root :where(input,textarea)::placeholder{color:var(--iq-faint);opacity:1}
body[data-iqos-surface="host"] #root :where(input[type="checkbox"],input[type="radio"]){accent-color:var(--iq-ink)}
body[data-iqos-surface="host"] #root :where(button)[class*="rounded-"]:not(#cctv-root *):not([class~="rounded-full"]){border-radius:var(--iq-control-radius);font-weight:600}
body[data-iqos-surface="host"] #root :where(button)[class~="bg-[#1d1d1f]"]:not(#cctv-root *){background:var(--iq-ink)!important;color:#fff!important;box-shadow:0 1px 2px #0001}
body[data-iqos-surface="host"] #root :where(button)[class~="bg-[#1d1d1f]"]:not(#cctv-root *):hover{background:#353537!important}
body[data-iqos-surface="host"] #root :where(button)[class~="bg-white"]:not(#cctv-root *){background:var(--iq-surface);border-color:var(--iq-line)}
body[data-iqos-surface="host"] #root :where(button)[class~="bg-white"]:not(#cctv-root *):not(:disabled):hover{background:var(--iq-soft)}
body[data-iqos-surface="host"] #root :where([role="dialog"],[class~="shadow-xl"],[class~="shadow-2xl"])[class~="bg-white"]:not(#cctv-root *){border-radius:18px!important;box-shadow:var(--iq-overlay-shadow)!important}
body[data-iqos-surface="host"] #root :where([role="menu"]){border-radius:12px;box-shadow:var(--iq-overlay-shadow);border-color:var(--iq-hair)}

/* Tables and activity lists: appearance only, no changed table layout or column order. */
body[data-iqos-surface="host"] #root :where(table):not(#cctv-root *){font-family:var(--iq-font);font-variant-numeric:tabular-nums}
body[data-iqos-surface="host"] #root :where(thead):not(#cctv-root *){background:var(--iq-soft)!important;color:var(--iq-muted)}
body[data-iqos-surface="host"] #root :where(th):not(#cctv-root *){
  background:var(--iq-soft)!important;font-size:10.5px!important;font-weight:700!important;
  letter-spacing:.045em;text-transform:uppercase;color:var(--iq-muted)!important;border-color:var(--iq-hair)!important;
}
body[data-iqos-surface="host"] #root :where(td):not(#cctv-root *){border-color:var(--iq-hair);font-size:13px;line-height:1.5}
body[data-iqos-surface="host"] #root :where(tbody tr):not(#cctv-root *):hover{background:var(--iq-hover)!important}
body[data-iqos-surface="host"] #root :where([class~="divide-gray-100"],[class~="divide-gray-200"])>:not([hidden])~:not([hidden]){border-color:var(--iq-hair)}

/* Embedded security workspace: preserve canvas, labels, colours, geometry and tool locations. */
body[data-iqos-surface="host"] #cctv-root{font-family:var(--iq-font);color:var(--iq-ink)}
body[data-iqos-surface="host"] #cctv-root .cctv-page-heading h1{font-family:var(--iq-font);font-size:18px;font-weight:800;letter-spacing:-.025em}
body[data-iqos-surface="host"] #cctv-root :where(.cctv-toolbar,.cctv-settings>section,.cctv-level-tile){
  border-color:var(--iq-line)!important;border-radius:12px!important;background:var(--iq-surface)!important;box-shadow:var(--iq-shadow);
}
body[data-iqos-surface="host"] #cctv-root :where(.cctv-settings>section>header,.cctv-settings>section>h2){border-color:var(--iq-hair);font-weight:700}
body[data-iqos-surface="host"] #cctv-root :where(input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),select,textarea){
  font-family:var(--iq-font)!important;border-color:var(--iq-line)!important;border-radius:7px!important;
}
body[data-iqos-surface="host"] #cctv-root :where(input,select,textarea):focus-visible{outline:2px solid var(--iq-blue)!important;outline-offset:2px}
body[data-iqos-surface="host"] #cctv-root .cctv-level-tile.is-active{border-color:var(--iq-ink)!important;background:#f0f0f2!important}
body[data-iqos-surface="host"] #cctv-root :where(button[class~="bg-emerald-600"],button[class~="bg-gray-900"]){background:var(--iq-ink)!important;color:white!important;border-radius:8px!important;font-weight:700}
body[data-iqos-surface="host"] #cctv-root :where(button[class~="bg-emerald-600"],button[class~="bg-gray-900"]):not(:disabled):hover{background:#353537!important}
body[data-iqos-surface="host"] #cctv-root [role="dialog"]{font-family:var(--iq-font);border:1px solid var(--iq-hair);border-radius:18px!important;box-shadow:var(--iq-overlay-shadow)!important}
body[data-iqos-surface="host"] #cctv-root [role="dialog"] :where(div[class~="border"]){border-color:var(--iq-hair)!important;border-radius:10px}
body[data-iqos-surface="host"] #cctv-root [role="dialog"] :where(button,input,textarea,select){font-size:13px}
body[data-iqos-surface="host"] #cctv-root .cctv-team-status{font-family:var(--iq-font);color:var(--iq-muted)}
body[data-iqos-surface="host"] #cctv-root :where(.leaflet-control,.leaflet-popup-content){font-family:var(--iq-font)}
body[data-iqos-surface="host"] #cctv-root .leaflet-control-zoom{border-color:var(--iq-line);border-radius:9px;box-shadow:var(--iq-shadow);overflow:hidden}

/* IQTicketing has its own document. Load this same stylesheet inside that document. */
html[data-iqos-theme="glow"]:has(body[data-iqos-surface="ticketing"]){
  --line:var(--iq-hair);--muted:var(--iq-muted);--blue:var(--iq-ink);--ink:var(--iq-ink);
}
body[data-iqos-surface="ticketing"]{font-size:13px!important;line-height:1.5;background:var(--iq-bg)!important;color:var(--iq-ink)!important}
body[data-iqos-surface="ticketing"] :where(h1,h2,h3,h4){color:var(--iq-ink);letter-spacing:-.025em}
body[data-iqos-surface="ticketing"] .brand h1{font-size:23px;font-weight:800;letter-spacing:-.035em}
body[data-iqos-surface="ticketing"] .section-heading h2{font-size:28px;font-weight:800;letter-spacing:-.035em;line-height:1.2}
body[data-iqos-surface="ticketing"] :where(.masthead,.view-nav,.workspace-tabs){border-color:var(--iq-hair);background:var(--iq-bg)}
body[data-iqos-surface="ticketing"] .masthead{background:rgba(245,245,247,.9)}
body[data-iqos-surface="ticketing"] .brand-mark{background:var(--iq-ink);color:#fff;border-color:transparent;box-shadow:inset 0 0 0 1px #fff1;transform:none;border-radius:11px}
body[data-iqos-surface="ticketing"] :where(.brand p,.section-heading p,.list-heading p,.help,.ticket-heading p,.integration-purpose){color:var(--iq-muted);font-size:12.5px}
body[data-iqos-surface="ticketing"] :where(button,input,select,textarea){font-family:var(--iq-font);border-color:var(--iq-line);border-radius:var(--iq-control-radius);color:var(--iq-ink)}
body[data-iqos-surface="ticketing"] button{font-weight:600;background:var(--iq-surface);box-shadow:none}
body[data-iqos-surface="ticketing"] button:not(:disabled):hover{background:var(--iq-soft);border-color:rgba(0,0,0,.17)}
body[data-iqos-surface="ticketing"] :where(.primary,.composer-footer button.primary){background:var(--iq-ink);color:#fff;border-color:var(--iq-ink);box-shadow:0 1px 2px #0001}
body[data-iqos-surface="ticketing"] .primary:not(:disabled):hover{background:#353537;border-color:#353537;color:#fff}
body[data-iqos-surface="ticketing"] :where(input,textarea,select):focus{border-color:#80baff;box-shadow:var(--iq-focus);outline:none}
body[data-iqos-surface="ticketing"] input[type="checkbox"]{accent-color:var(--iq-ink)}
body[data-iqos-surface="ticketing"] :where(.icon-button,.text-button,.ticket-tab button,.subject){background:transparent}
body[data-iqos-surface="ticketing"] :where(a,.text-button,.file-picker,.email-link){color:var(--iq-blue)!important}
body[data-iqos-surface="ticketing"] :where(.danger-text){color:var(--iq-red)!important}
body[data-iqos-surface="ticketing"] :where(.workspace-tab,.ticket-tab){background:transparent;border-radius:9px 9px 0 0;color:var(--iq-muted);font-size:12.5px}
body[data-iqos-surface="ticketing"] :where(.workspace-tab.active,.ticket-tab.active){background:var(--iq-surface);border-color:var(--iq-line);color:var(--iq-ink)}
body[data-iqos-surface="ticketing"] .view-nav button{background:transparent;color:var(--iq-muted);font-size:13px;font-weight:600;border-radius:0}
body[data-iqos-surface="ticketing"] .view-nav button.active{color:var(--iq-ink);border-bottom-color:var(--iq-ink)}
body[data-iqos-surface="ticketing"] .view-nav button:not(:disabled):hover{background:var(--iq-hover)}
body[data-iqos-surface="ticketing"] .view-nav button span,
body[data-iqos-surface="ticketing"] .view-nav button.active span{background:var(--iq-selected);color:var(--iq-muted);border-radius:99px;font-size:11px}
body[data-iqos-surface="ticketing"] .eyebrow{font-size:10.5px;font-weight:800;letter-spacing:.075em;color:var(--iq-faint)}
body[data-iqos-surface="ticketing"] .segmented{background:var(--iq-selected);border-color:transparent;border-radius:9px}
body[data-iqos-surface="ticketing"] .segmented button{background:transparent;color:var(--iq-muted);border-radius:7px;font-size:12px}
body[data-iqos-surface="ticketing"] .segmented button.active{background:#fff;color:var(--iq-ink);box-shadow:0 1px 3px #0002}

/* Ticket tiles and queues. Keep six metrics, current columns, filters and table actions. */
body[data-iqos-surface="ticketing"] :where(.metric,.ticket-list,.settings-intro,.mailbox-card,.mailbox-form,.mailbox-empty,.setup-card){
  background:var(--iq-surface);border-color:var(--iq-hair);border-radius:var(--iq-radius);box-shadow:var(--iq-shadow);
}
body[data-iqos-surface="ticketing"] .metric-top{font-size:11.5px;font-weight:700;color:var(--iq-muted)}
body[data-iqos-surface="ticketing"] .metric-top svg{color:var(--iq-faint)}
body[data-iqos-surface="ticketing"] .metric.green svg{color:var(--iq-green)}
body[data-iqos-surface="ticketing"] .metric.amber svg{color:var(--iq-amber)}
body[data-iqos-surface="ticketing"] .metric.red svg{color:var(--iq-red)}
body[data-iqos-surface="ticketing"] .metric strong{font-size:28px;font-weight:700;letter-spacing:-.035em;color:var(--iq-ink)}
body[data-iqos-surface="ticketing"] .metric.red strong{color:var(--iq-red)}
body[data-iqos-surface="ticketing"] .metric small{font-size:11.5px;color:var(--iq-faint)}
body[data-iqos-surface="ticketing"] :where(.count,.assignee i,.avatar){background:#eeeef1;color:var(--iq-muted)}
body[data-iqos-surface="ticketing"] .count{border-radius:99px;font-size:11.5px}
body[data-iqos-surface="ticketing"] :where(.search,.filters){background:var(--iq-soft);border-color:var(--iq-hair);color:var(--iq-muted)}
body[data-iqos-surface="ticketing"] .search{border-radius:9px}
body[data-iqos-surface="ticketing"] .search input{background:transparent;border:0;box-shadow:none;font-size:12.5px}
body[data-iqos-surface="ticketing"] :where(.filter.active,.bulk-bar){background:#eef4fb;color:#34536f;border-color:#dfeaf7}
body[data-iqos-surface="ticketing"] :where(.list-tools button,.list-tools select,.filters label,.filters select,.bulk-bar button,.bulk-bar select){font-size:12px}
body[data-iqos-surface="ticketing"] table{font-size:13px;font-variant-numeric:tabular-nums}
body[data-iqos-surface="ticketing"] th{background:#fbfbfc;color:var(--iq-muted);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.045em;border-color:var(--iq-hair)}
body[data-iqos-surface="ticketing"] td{color:var(--iq-muted);font-size:12.5px;border-color:var(--iq-hair)}
body[data-iqos-surface="ticketing"] tr:hover td{background:rgba(0,0,0,.018)}
body[data-iqos-surface="ticketing"] tr.selected td{background:#f0f4fa}
body[data-iqos-surface="ticketing"] :where(td .org,.subject strong){color:var(--iq-ink);font-weight:600;font-size:13px}
body[data-iqos-surface="ticketing"] :where(.requester,.ticket-number,.table-footer){font-size:11px;color:var(--iq-faint)}
body[data-iqos-surface="ticketing"] :where(.status,.sla){border-radius:99px;font-size:11px;font-weight:600}
body[data-iqos-surface="ticketing"] .status{background:#eeeef1;color:var(--iq-muted)}
body[data-iqos-surface="ticketing"] .status.new{background:#fff3df;color:var(--iq-amber)}
body[data-iqos-surface="ticketing"] .status.open{background:#e9f3ff;color:#0668c9}
body[data-iqos-surface="ticketing"] .sla{background:#eaf7ee;color:var(--iq-green)}
body[data-iqos-surface="ticketing"] .sla.overdue{background:#ffedeb;color:var(--iq-red)}

/* Ticket detail, reply editor, attachments and requester information. */
body[data-iqos-surface="ticketing"] :where(.ticket-heading,.ticket-fields,.requester-profile,.conversation){background:var(--iq-surface);border-color:var(--iq-hair)}
body[data-iqos-surface="ticketing"] .ticket-heading h2{font-size:23px;line-height:1.3;letter-spacing:-.03em}
body[data-iqos-surface="ticketing"] :where(.ticket-fields h3,.profile-heading h3,.list-heading h3){font-size:16px;font-weight:700}
body[data-iqos-surface="ticketing"] .conversation-tabs{background:var(--iq-surface);border-color:var(--iq-hair)}
body[data-iqos-surface="ticketing"] .conversation-tabs button{background:transparent;color:var(--iq-muted);font-size:13px;border-radius:0}
body[data-iqos-surface="ticketing"] .conversation-tabs button.active{color:var(--iq-ink);border-bottom-color:var(--iq-ink)}
body[data-iqos-surface="ticketing"] .ticket-heading-actions button.active{background:var(--iq-selected);color:var(--iq-ink);border-color:var(--iq-line)}
body[data-iqos-surface="ticketing"] .tag-list>span{background:var(--iq-selected);color:var(--iq-muted);border-radius:7px}
body[data-iqos-surface="ticketing"] :where(.ticket-fields label,.requester-profile label,.mailbox-form label){font-size:12px;font-weight:600;color:var(--iq-muted)}
body[data-iqos-surface="ticketing"] :where(.messages,.readonly-person,.sla-detail,.message-body){background:var(--iq-soft);border-color:var(--iq-hair)}
body[data-iqos-surface="ticketing"] .message-body{font-size:13px;line-height:1.65;color:var(--iq-ink);border-radius:12px}
body[data-iqos-surface="ticketing"] .message.outbound .message-body{background:#eef4fb;border-color:#e2ebf6}
body[data-iqos-surface="ticketing"] .message.note .message-body{background:#fff8e9;border-color:#f3e8c9}
body[data-iqos-surface="ticketing"] :where(.message-meta,.message-meta time,.ticket-kicker,.profile-heading p,.requester-profile small){color:var(--iq-muted);font-size:11.5px}
body[data-iqos-surface="ticketing"] .composer{background:var(--iq-surface);border-color:var(--iq-line);border-radius:12px;box-shadow:var(--iq-shadow)}
body[data-iqos-surface="ticketing"] .composer.internal{border-color:#e8d5a5}
body[data-iqos-surface="ticketing"] :where(.composer-top,.composer-footer,.composer-recipients,.reply-attachments){background:var(--iq-soft);border-color:var(--iq-hair);color:var(--iq-muted)}
body[data-iqos-surface="ticketing"] :where(.composer textarea,.composer [contenteditable="true"]){font-family:var(--iq-font);font-size:13px;line-height:1.65;color:var(--iq-ink);background:var(--iq-surface)}
body[data-iqos-surface="ticketing"] :where(.composer-top button,.composer-footer button,.reply-attachments label){font-size:12px}
body[data-iqos-surface="ticketing"] :where(.attachment,.tag,.folder-label){border-color:var(--iq-line);border-radius:7px;font-size:11.5px}

/* Mailboxes, settings, creation dialogs, setup/error/empty/loading states. */
body[data-iqos-surface="ticketing"] :where(.server-columns>section,.empty-icon,.setup-icon){background:var(--iq-soft);border-color:var(--iq-hair);color:var(--iq-muted);box-shadow:none;border-radius:12px}
body[data-iqos-surface="ticketing"] :where(.mailbox-facts,.mailbox-switches,.field-divider){border-color:var(--iq-hair)}
body[data-iqos-surface="ticketing"] :where(.mailbox-facts strong,.mailbox-switches strong,.mailbox-card h3){color:var(--iq-ink);font-weight:600}
body[data-iqos-surface="ticketing"] :where(.mailbox-facts span,.mailbox-switches small,.mailbox-form footer>span,.settings-intro p,.mailbox-card>p){color:var(--iq-muted);font-size:12px}
body[data-iqos-surface="ticketing"] :where(.empty p,.empty h3,.mailbox-empty p){color:var(--iq-muted)}
body[data-iqos-surface="ticketing"] .empty h3{color:var(--iq-ink);font-weight:700}
body[data-iqos-surface="ticketing"] .empty p{font-size:13px}
body[data-iqos-surface="ticketing"] .modal-backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px)}
body[data-iqos-surface="ticketing"] .modal{border-radius:18px;box-shadow:var(--iq-overlay-shadow);border:1px solid var(--iq-hair)}
body[data-iqos-surface="ticketing"] .modal h2{font-size:24px;font-weight:800;letter-spacing:-.035em}
body[data-iqos-surface="ticketing"] .modal>p{color:var(--iq-muted);font-size:13px}
body[data-iqos-surface="ticketing"] .modal label{color:var(--iq-muted);font-size:12px}
body[data-iqos-surface="ticketing"] .toast{background:rgba(29,29,31,.96);color:#fff;border-radius:11px;box-shadow:0 10px 35px #0003;font-size:13px}
body[data-iqos-surface="ticketing"] .banner{border-radius:10px;border-color:#efe1c2;background:#fff7e8;color:#765017}
body[data-iqos-surface="ticketing"] .banner.error{background:#fff0ee;border-color:#f4d7d2;color:var(--iq-red)}
body[data-iqos-surface="ticketing"] .banner.success{background:#ecf8ef;border-color:#d2e9d9;color:var(--iq-green)}
body[data-iqos-surface="ticketing"] .connection.online{color:var(--iq-green)}

@media(max-width:760px){
  body[data-iqos-surface="host"] #root :where(h1):not(#cctv-root *){font-size:26px}
  body[data-iqos-surface="ticketing"] .section-heading h2{font-size:24px}
  body[data-iqos-surface="ticketing"] .ticket-heading h2{font-size:20px}
  body[data-iqos-surface="ticketing"] .view-nav button{font-size:12px}
  body[data-iqos-surface="ticketing"] .metric strong{font-size:25px}
  body[data-iqos-surface="ticketing"] .metric small{font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  html[data-iqos-theme="glow"] :where(button,a,summary,input,select,textarea){transition:none!important}
}