body.requester-portal-mode .sidebar,body.requester-portal-mode .topbar,body.requester-portal-mode .side-toolbar { display:none; }
body.requester-portal-mode .main-content { width:100%; }
body.requester-portal-mode .view-container { max-width:none; padding:0; }
body.requester-portal-mode #requesterPortalView { margin:0; min-height:100vh; }
body.requester-portal-mode .requester-portal-shell { min-height:100vh; }
.service-domain-row .request-type-select { flex:1; min-width:0; padding:0; background:none; color:inherit; font:inherit; font-weight:700; text-align:left; }.service-domain-row:has(.custom-field-edit) > span { flex:1; min-width:0; }
.sla-settings-panel { margin-top:8px; }.sla-settings-panel .back-to-tickets { margin-bottom:20px; }.sla-settings-grid { display:grid; grid-template-columns:1.35fr 1fr; gap:16px; max-width:1180px; align-items:start; }.sla-settings-card { padding:20px; }.sla-targets-card { grid-row:span 2; }.sla-settings-card h3 { margin:0 0 6px; color:var(--ink); font:700 15px Inter, sans-serif; }.sla-settings-card > label { display:block; margin-top:13px; color:var(--ink-2); font-size:11.5px; font-weight:800; }.sla-settings-card select,.sla-settings-card input:not([type="checkbox"]),.sla-settings-card textarea { width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; font-size:12px; outline:none; }.sla-settings-card .sla-check-option { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid #e1e7e1; border-radius:6px; background:var(--hover-bg-subtle); }.sla-check-option input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.sla-targets-card td input { min-width:130px; }.sla-settings-card .save-button { margin-top:18px; }.sla-settings-card .tableWrap td { padding:10px; }@media (max-width:900px){.sla-settings-grid{grid-template-columns:1fr}.sla-targets-card{grid-row:auto}}[data-theme="dark"] .sla-settings-card label,[data-theme="dark"] .sla-settings-card h3{color:var(--ink)}[data-theme="dark"] .sla-settings-card select,[data-theme="dark"] .sla-settings-card input:not([type="checkbox"]),[data-theme="dark"] .sla-settings-card textarea{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .sla-settings-card .sla-check-option{background:var(--surface-2);border-color:var(--line)}
.sla-policy-register { max-width:1180px; margin-bottom:16px; }.sla-policy-register td b { color:var(--ink); font-size:12px; }.sla-policy-active { display:inline-flex; align-items:center; gap:7px; color:var(--ink-2); font-size:11px; font-weight:700; }.sla-policy-active input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }
.sla-policy-actions { display:flex; align-items:center; gap:10px; }.sla-policy-actions .create-button { min-height:34px; padding:7px 10px; }.sla-policy-edit { padding:5px 8px; border:1px solid #cbd8cf; border-radius:5px; background:var(--surface); color:var(--spruce-dark); font-size:10px; font-weight:800; }.sla-policy-modal { max-width:540px; }.sla-policy-modal label { display:block; margin-top:16px; color:var(--ink-2); font-size:12px; font-weight:700; }.sla-policy-modal input:not([type="checkbox"]),.sla-policy-modal textarea { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; }.sla-policy-modal .sla-check-option { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid #e1e7e1; border-radius:6px; background:var(--hover-bg-subtle); }.sla-policy-modal .sla-check-option input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.sla-policy-modal .save-button { margin-top:20px; }[data-theme="dark"] .sla-policy-modal label{color:var(--ink)}[data-theme="dark"] .sla-policy-modal input:not([type="checkbox"]),[data-theme="dark"] .sla-policy-modal textarea{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .sla-policy-modal .sla-check-option{background:var(--surface-2);border-color:var(--line)}
.holiday-calendar-panel td small { display:block; margin-top:3px; color:var(--muted); font-size:10px; }.holiday-year-button { min-height:34px; min-width:64px; }.holiday-import-button { min-height:34px; }.holiday-row-actions { display:flex; gap:6px; justify-content:flex-end; }.holiday-empty { padding:22px 10px; color:var(--muted); text-align:center; }.sla-holiday-note { margin:14px 0 0; color:var(--muted); font-size:11px; }.sla-holiday-note .text-button { padding:0; font-weight:700; }@media (max-width:760px){.holiday-calendar-panel .panel-heading{flex-wrap:wrap;gap:10px}.holiday-calendar-panel .sla-policy-actions{flex-wrap:wrap}}
.workspace-ticket-count { margin:4px 0 0; color:var(--muted); font-size:11px; font-weight:600; }.assign-to-me-button { display:inline-block; margin-top:6px; padding:0; font-size:11px; font-weight:700; }.assign-to-me-button[hidden] { display:none; }
.nav-item[hidden] { display:none; }
#detailBreach.breached-text { color:var(--terra); }
.modal input.field-invalid,.modal textarea.field-invalid { border-color:var(--terra); box-shadow:0 0 0 3px var(--terra-pale); }
.sso-status-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }.sso-status-row h3 { margin:0; }.sso-status { padding:4px 10px; border-radius:999px; background:var(--terra-pale); color:var(--terra); font-size:11px; font-weight:700; }.sso-status.connected { background:var(--spruce-pale); color:var(--spruce); }.sso-status-problem { margin:14px 0 0; padding:10px 12px; border-radius:6px; background:var(--saffron-pale); color:var(--ink); font-size:12px; }.sso-details { display:grid; gap:0; margin:16px 0 0; }.sso-details > div { display:grid; grid-template-columns:190px 1fr; gap:12px; padding:11px 0; border-top:1px solid var(--line); }.sso-details dt { color:var(--muted); font-size:11.5px; font-weight:700; }.sso-details dd { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0; color:var(--ink); font-size:12px; overflow-wrap:anywhere; }.sso-details code, .sso-note code { padding:2px 6px; border-radius:4px; background:var(--paper); font-size:11.5px; }.sso-details .outline-button { min-height:28px; padding:0 10px; font-size:11px; }.sso-note { margin:14px 0 0; color:var(--muted); font-size:11.5px; }@media (max-width:700px){.sso-details > div{grid-template-columns:1fr;gap:4px}}
.sso-details input { width:min(420px,100%); min-height:36px; padding:0 11px; border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink); font:inherit; font-size:12px; }.sso-details input:disabled { background:var(--paper); color:var(--muted); }.sso-details small { flex-basis:100%; color:var(--muted); font-size:11px; }.sso-details dt label { font:inherit; color:inherit; }.sso-check-result { margin:14px 0 0; padding:10px 12px; border-radius:6px; background:var(--paper); font-size:12px; }.sso-check-result[data-tone="success"] { background:var(--spruce-pale); color:var(--spruce-dark); }.sso-check-result[data-tone="error"] { background:var(--terra-pale); color:var(--ink); }.sso-actions [hidden] { display:none; }
#ssoSettingsPanel .sso-actions { justify-content:flex-end; flex-direction:row-reverse; flex-wrap:wrap; }
.sla-action-config { margin-top:18px; padding:15px; border:1px solid #dfe6df; border-radius:7px; background:var(--hover-bg-subtle); }.sla-action-config h3 { margin:0 0 5px; color:var(--ink); font:700 14px Inter, sans-serif; }.sla-action-config label { margin-top:12px; }.sla-policy-modal select { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; }[data-theme="dark"] .sla-action-config{background:var(--surface-2);border-color:var(--line)}[data-theme="dark"] .sla-action-config h3{color:var(--ink)}[data-theme="dark"] .sla-policy-modal select{background:var(--surface);border-color:var(--line);color:var(--ink)}
.sla-policy-modal select[multiple] { min-height:112px; padding:5px; }.sla-policy-modal select[multiple] option { padding:7px 8px; border-radius:4px; }
.custom-states-settings-panel { margin-top:8px; }.custom-states-settings-panel .back-to-tickets { margin-bottom:20px; }.custom-states-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; max-width:1180px; }.custom-states-card { padding:20px; }.custom-states-card .panel-heading { margin-bottom:14px; }.custom-states-card .outline-button { min-height:32px; padding:6px 9px; font-size:11px; }.custom-state-list { display:grid; gap:7px; }.custom-state-row { display:flex; align-items:center; gap:8px; padding:10px 11px; border:1px solid #e2e8e2; border-radius:6px; background:var(--surface); color:#35433a; font-size:12px; }.custom-state-row span { flex:1; min-width:0; font-weight:700; }.custom-state-row button { background:none; font-size:11px; font-weight:700; }.custom-state-row button[data-edit-state] { color:var(--spruce); }.custom-state-row button[data-delete-state] { color:var(--terra); }.custom-state-modal { max-width:430px; }.custom-state-modal label { display:block; margin-top:16px; color:var(--ink-2); font-size:12px; font-weight:700; }.custom-state-modal input { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; }.custom-state-modal .save-button { margin-top:20px; }@media (max-width:900px){.custom-states-grid{grid-template-columns:1fr}}[data-theme="dark"] .custom-states-card,.custom-states-card{ }[data-theme="dark"] .custom-state-row{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .custom-state-modal label{color:var(--ink)}[data-theme="dark"] .custom-state-modal input{background:var(--surface);border-color:var(--line);color:var(--ink)}
.notification-settings-panel { margin-top:8px; }.notification-settings-panel .back-to-tickets { margin-bottom:20px; }.notification-rules-panel { max-width:1280px; }.notification-rules-panel td b,.notification-rules-panel td small { display:block; }.notification-rules-panel td b { color:var(--ink); font-size:12px; }.notification-rules-panel td small { margin-top:3px; color:var(--muted); font-size:10px; }.notification-rule-active { display:inline-flex; align-items:center; gap:7px; color:var(--ink-2); font-size:11px; font-weight:700; }.notification-rule-active input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.notification-rule-edit,.notification-rule-delete { padding:5px 8px; background:none; font-size:10px; font-weight:800; }.notification-rule-edit { color:var(--spruce); }.notification-rule-delete { color:var(--terra); }.notification-rule-modal { max-width:560px; }.notification-rule-modal label { display:block; margin-top:15px; color:var(--ink-2); font-size:12px; font-weight:700; }.notification-rule-modal input:not([type="checkbox"]),.notification-rule-modal select,.notification-rule-modal textarea { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; }.notification-channel-options { display:flex; gap:8px; margin-top:6px; }.notification-channel-options label { display:flex; align-items:center; gap:7px; margin:0; padding:9px 11px; border:1px solid var(--line); border-radius:6px; background:var(--hover-bg-subtle); }.notification-channel-options input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.notification-rule-modal .save-button { margin-top:20px; }[data-theme="dark"] .notification-rule-modal label{color:var(--ink)}[data-theme="dark"] .notification-rule-modal input:not([type="checkbox"]),[data-theme="dark"] .notification-rule-modal select,[data-theme="dark"] .notification-rule-modal textarea{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .notification-channel-options label{background:var(--surface-2);border-color:var(--line)}[data-theme="dark"] .notification-rule-active{color:var(--ink)}
.notification-rules-scopes { display:grid; gap:16px; }.notification-rule-empty { padding:18px !important; color:var(--muted) !important; text-align:center; }
.notification-recipient-picker { display:grid; gap:7px; margin-top:15px; color:var(--ink-2); font-size:12px; font-weight:700; }.notification-recipient-picker input[type="search"] { width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; }.notification-recipient-picker > div { display:grid; max-height:175px; overflow:auto; border:1px solid var(--line); border-radius:6px; }.notification-recipient-picker > div > label { display:flex; align-items:center; gap:9px; margin:0; padding:9px 10px; border-top:1px solid #edf0eb; background:var(--surface); }.notification-recipient-picker > div > label:first-child { border-top:0; }.notification-recipient-picker > div > label:hover { background:#f1f4f1; }.notification-recipient-picker input[type="checkbox"] { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.notification-recipient-picker b,.notification-recipient-picker small { display:block; }.notification-recipient-picker b { font-size:12px; }.notification-recipient-picker small { margin-top:2px; color:var(--muted); font-size:10px; }[data-theme="dark"] .notification-recipient-picker{color:var(--ink)}[data-theme="dark"] .notification-recipient-picker input[type="search"],[data-theme="dark"] .notification-recipient-picker > div{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .notification-recipient-picker > div > label{background:var(--surface);border-color:var(--line)}
.service-domain-card .custom-field-composer { display:grid !important; grid-template-columns:minmax(220px,1fr) minmax(190px,.8fr) auto !important; align-items:start; }.service-domain-card .custom-field-composer #newCustomFieldLabelInput { display:block; width:100% !important; min-width:220px !important; }@media (max-width:800px){.service-domain-card .custom-field-composer{grid-template-columns:1fr !important}.service-domain-card .custom-field-composer #newCustomFieldLabelInput{min-width:0 !important}}
.edit-service-domain-modal { max-width:500px; }.edit-service-domain-modal label { display:block; margin-top:16px; color:var(--ink-2); font-size:12px; font-weight:700; }.edit-service-domain-modal input:not([type="checkbox"]),.edit-service-domain-modal select,.edit-service-domain-modal textarea { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; outline:none; }.edit-service-domain-modal .email-settings-option { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--hover-bg-subtle); }.edit-service-domain-modal .email-settings-option input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.edit-service-domain-modal .save-button { margin-top:22px; }[data-theme="dark"] .edit-service-domain-modal label{color:var(--ink)}[data-theme="dark"] .edit-service-domain-modal input:not([type="checkbox"]),[data-theme="dark"] .edit-service-domain-modal select,[data-theme="dark"] .edit-service-domain-modal textarea{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .edit-service-domain-modal .email-settings-option{background:var(--surface-2);border-color:var(--line)}
.view > .page-heading > div > .eyebrow,.view > .page-heading > div > .subheading { display:none; }
.modal-backdrop .modal-kicker { display:block; }
.column-toolbar { position:relative; order:5; }
.columns-button { height:34px; padding:0 11px; border:1px solid #dfe2dc; border-radius:5px; background:var(--surface); color:#4d70df; font-size:12px; }
.columns-button span { color:#9da69f; padding-left:7px; }
.columns-menu { position:absolute; top:calc(100% + 7px); right:0; z-index:20; display:none; width:220px; padding:12px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 14px 30px rgba(39,51,47,.16); }
.column-toolbar.open .columns-menu { display:block; }
.columns-menu-title { display:block; padding-bottom:9px; border-bottom:1px solid var(--line); color:var(--muted); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; }
.column-options { display:grid; gap:4px; margin-top:8px; }
.column-option { display:flex; align-items:center; gap:8px; padding:7px 5px; color:var(--ink-2); cursor:pointer; font-size:11px; }
.column-option:hover { background:var(--accent-hover); border-radius:4px; }
.column-option input { accent-color:var(--spruce); width:14px; height:14px; margin:0; }
:root { --hover-bg:#eef4ef; --hover-bg-subtle:#f7faf6; --paper:#f8f7f2; --surface:#fffefa; --line:#e5e6de; --ink:#27332f; --muted:#78827a; --spruce:#356b5d; --spruce-dark:#244d43; --spruce-pale:#e3efe8; --saffron:#dba744; --saffron-pale:#f8edcc; --terra:#c96d55; --terra-pale:#f7e4de; --shadow:0 12px 35px rgba(44,57,51,.06); }
* { box-sizing:border-box; } body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter, sans-serif; font-size:14px; transition:background .2s ease,color .2s ease; } button,input,select,textarea { font:inherit; } button { border:0; cursor:pointer; color:inherit; } .app-shell { display:flex; min-height:100vh; }
.sidebar { width:252px; background:#eff1e9; border-right:1px solid #e1e4da; padding:27px 16px 18px; display:flex; flex-direction:column; flex-shrink:0; } .brand-lockup { display:flex; gap:13px; align-items:center; padding:0 10px 28px; } .brand-mark { width:58px; height:58px; overflow:hidden; border:1px solid #dfe4dc; border-radius:9px; background:#fff; display:grid; place-items:center; } .brand-mark img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; } .brand-lockup strong { display:block; font:800 19px Inter, sans-serif; letter-spacing:-.5px; } .brand-lockup strong span { color:var(--terra); } .brand-lockup small { color:var(--muted); font-size:10px; letter-spacing:.3px; }
.workspace-switcher { display:flex; align-items:center; gap:9px; width:100%; background:var(--surface); padding:9px; border:1px solid #e0e4da; border-radius:8px; text-align:left; margin-bottom:26px; } .workspace-copy { flex:1; min-width:0; } .workspace-copy b,.profile-row b { display:block; font-size:12px; } .workspace-copy small,.profile-row small { display:block; color:var(--muted); font-size:10px; margin-top:2px; } .chevron,.more { color:var(--muted); font-size:17px; } .avatar { display:grid; place-items:center; flex:0 0 auto; width:29px; height:29px; font-size:10px; font-weight:700; border-radius:50%; } .avatar-spruce { background:#cde2d8; color:var(--spruce-dark); } .avatar-saffron { background:#f8df9a; color:#886516; } .avatar-terracotta { background:#f0c7b9; color:#873d2f; }
.workspace-menu { display:none; position:absolute; top:91px; left:16px; right:16px; z-index:12; padding:5px; border:1px solid #dfe4da; border-radius:7px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }.workspace-menu.open { display:grid; }.workspace-option { display:flex; align-items:center; gap:8px; width:100%; padding:9px 8px; border-radius:5px; background:none; color:var(--ink-2); font-size:11px; text-align:left; }.workspace-option:hover,.workspace-option.active { background:var(--spruce-pale); color:var(--spruce-dark); font-weight:700; }.workspace-option-mark { display:grid; place-items:center; width:14px; color:var(--spruce); font-weight:700; }
.nav-label { color:#9aa39b; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:1.1px; padding:0 10px; margin:0 0 8px; } .nav-label-spaced { margin-top:27px; } .nav-item { width:100%; display:flex; align-items:center; gap:11px; background:none; border-radius:7px; text-align:left; padding:10px; color:#66736a; margin:2px 0; font-size:13px; } .nav-item:hover,.nav-item.active { background:#dfeae2; color:var(--spruce-dark); font-weight:700; } .nav-icon { display:inline-grid; place-items:center; width:18px; font-size:17px; color:#78857c; } .active .nav-icon { color:var(--spruce); } .nav-count { margin-left:auto; font-size:11px; color:#8b958d; background:#e4e7df; padding:2px 7px; border-radius:10px; } .nav-count.warm { color:#966e12; background:#f7e8b9; } .nav-count.terracotta { color:#a34c39; background:#f2d3ca; } .nav-status { width:6px; height:6px; border-radius:50%; background:var(--saffron); margin-left:auto; } .sidebar-bottom { margin-top:auto; } .health-card { display:flex; align-items:center; gap:9px; background:#e2ece2; border:1px solid #d3e3d4; border-radius:7px; padding:10px; margin-bottom:14px; } .health-card b { display:block; font-size:10px; } .health-card small { display:block; font-size:9px; color:#738076; margin-top:3px; } .pulse { width:7px; height:7px; border-radius:50%; background:#5e9c65; box-shadow:0 0 0 4px #cae4cf; margin-left:2px; } .profile-row { border-top:1px solid #dfe2d9; margin-top:14px; padding:17px 8px 0; display:flex; align-items:center; gap:9px; } .profile-row div { flex:1; }
.main-content { flex:1; min-width:0; } .topbar { height:76px; display:flex; justify-content:space-between; align-items:center; padding:0 42px; border-bottom:1px solid var(--line); background:rgba(248,247,242,.9); } .breadcrumbs { display:flex; gap:10px; align-items:center; color:#a0a79e; font-size:12px; } .breadcrumbs strong { color:#505d55; } .top-actions { display:flex; align-items:center; gap:14px; } .icon-button { background:none; font-size:23px; color:#67736b; position:relative; } .notification i { position:absolute; height:5px; width:5px; border-radius:50%; top:1px; right:1px; background:var(--terra); } .create-button,.save-button { color:white; background:var(--spruce); border-radius:6px; padding:11px 15px; font-weight:700; font-size:12px; box-shadow:0 4px 9px rgba(53,107,93,.16); } .create-button:hover,.save-button:hover { background:var(--spruce-dark); } .create-button span { font-size:17px; line-height:10px; margin-right:5px; font-weight:400; } .mobile-menu { display:none; background:none; font-size:20px; }
.view-container { max-width:1430px; padding:38px 42px 60px; margin:auto; } .view { display:none; animation:fadeUp .35s ease both; } .view.active-view { display:block; } @keyframes fadeUp { from{opacity:0;transform:translateY(7px)} to{opacity:1;transform:none} } .page-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:30px; } .page-heading h1 { font:700 31px Inter, sans-serif; letter-spacing:-1.2px; margin:5px 0 5px; } .heading-dot { color:var(--terra); } .eyebrow { color:var(--spruce); text-transform:uppercase; font-size:10px; letter-spacing:1.3px; font-weight:700; margin:0; } .subheading { color:var(--muted); margin:0; font-size:13px; } .heading-actions { display:flex; gap:9px; } .quiet-button,.outline-button { color:#57645b; background:var(--surface); border:1px solid var(--line); border-radius:5px; padding:9px 12px; font-size:12px; } .quiet-button span { color:#a2aaa1; padding-left:10px; } .outline-button { background:transparent; } .outline-button:first-letter { color:var(--spruce); } .outline-button:hover,.quiet-button:hover { border-color:#bdccc1; color:var(--spruce-dark); }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:16px; } .metric-card,.panel { background:var(--surface); border:1px solid var(--line); border-radius:7px; box-shadow:var(--shadow); } .metric-card { padding:17px 18px; min-height:143px; } .metric-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; } .metric-icon { display:grid; place-items:center; width:29px; height:29px; border-radius:6px; font-size:15px; } .icon-spruce { color:var(--spruce); background:var(--spruce-pale); } .icon-saffron { color:#997321; background:var(--saffron-pale); } .icon-terracotta { color:var(--terra); background:var(--terra-pale); } .icon-ink { color:#596b5e; background:#e9ece6; } .trend { font-size:10px; font-weight:700; } .trend.up { color:#4c8b67; } .trend.down { color:var(--terra); } .metric-card p { margin:0 0 5px; font-size:11px; color:var(--muted); } .metric-card > strong { font:700 25px Inter, sans-serif; letter-spacing:-1px; } .metric-card strong em { font:500 12px Inter, sans-serif; color:#9ba39c; letter-spacing:0; } .metric-card small { display:block; margin-top:7px; color:#9ba39c; font-size:10px; }
.dashboard-grid { display:grid; grid-template-columns:1.65fr 1fr; gap:16px; margin-bottom:16px; } .panel { padding:19px; } .panel-heading { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:24px; } .panel-heading h2 { font:700 15px Inter, sans-serif; margin:0 0 5px; } .panel-heading p { color:#9aa39b; margin:0; font-size:11px; } .more-button { background:none; color:#9aa39b; letter-spacing:2px; } .legend { display:flex; gap:14px; font-size:10px; color:#8a958d; padding-top:2px; } .legend span { display:flex; align-items:center; gap:5px; } .legend-dot { width:7px; height:7px; border-radius:50%; } .incoming { background:var(--spruce); } .resolved { background:var(--saffron); } .chart-wrap { height:210px; display:flex; padding-top:8px; } .y-labels { display:flex; flex-direction:column; justify-content:space-between; color:#abb1a9; font-size:10px; padding:0 12px 23px 0; } .chart { flex:1; position:relative; border-bottom:1px solid #e8e9e2; } .grid-line { position:absolute; left:0; right:0; border-top:1px dashed #e9ebe4; } .line-1 { top:0; } .line-2 { top:25%; } .line-3 { top:50%; } .line-4 { top:75%; } .chart-bars { display:flex; align-items:flex-end; justify-content:space-around; height:100%; position:relative; z-index:1; padding:0 6px; } .bar-group { height:100%; display:flex; align-items:flex-end; gap:5px; position:relative; width:16%; } .bar { width:11px; border-radius:3px 3px 0 0; display:block; } .incoming-bar { background:var(--spruce); } .resolved-bar { background:#edc976; } .bar-group.current .incoming-bar { background:var(--terra); } .bar-group small { position:absolute; bottom:-23px; left:50%; transform:translateX(-50%); white-space:nowrap; color:#a2aaa2; font-size:9px; } .donut-wrap { display:flex; align-items:center; gap:25px; padding:12px 4px 7px; } .donut { flex:0 0 135px; height:135px; border-radius:50%; background:conic-gradient(var(--terra) 0 6.3%, var(--saffron) 6.3% 31.3%, #80a994 31.3% 81.3%, #c4dacb 81.3%); display:grid; place-items:center; position:relative; } .donut:after { content:""; position:absolute; width:88px; height:88px; border-radius:50%; background:var(--surface); } .donut-center { z-index:1; text-align:center; } .donut-center strong { display:block; font:700 24px Inter, sans-serif; } .donut-center small { color:#9da69e; font-size:10px; } .priority-legend { width:100%; } .priority-legend div { display:grid; grid-template-columns:10px 1fr auto; gap:7px; align-items:center; border-bottom:1px solid #eff0ea; padding:8px 0; } .priority-legend div:last-child { border:0; } .priority-dot { width:7px; height:7px; border-radius:50%; } .priority-legend b { font-size:11px; font-weight:500; } .priority-legend strong { font-size:11px; } .priority-legend small { grid-column:2; color:#9da69e; font-size:9px; margin-top:-5px; }.critical{background:var(--terra)}.high{background:var(--saffron)}.medium{background:#80a994}.low{background:#c4dacb}
.lower-grid { display:grid; grid-template-columns:1.65fr 1fr; gap:16px; } .text-button { background:none; color:var(--spruce); font-size:11px; } .text-button span { padding-left:4px; font-size:16px; } .activity-list { margin-top:-6px; } .activity-item { display:flex; align-items:center; gap:10px; border-top:1px solid var(--line); padding:13px 0; } .activity-item:first-child { border-top:0; } .activity-avatar { width:27px; height:27px; display:grid; place-items:center; border-radius:50%; font-size:9px; font-weight:700; flex:0 0 auto; } .activity-item div { flex:1; min-width:0; } .activity-item p { margin:0 0 4px; font-size:11px; } .activity-item a { color:var(--spruce); font-weight:700; } .activity-item small { color:var(--muted); font-size:10px; } .activity-item time { color:#a6ada7; font-size:9px; align-self:flex-start; white-space:nowrap; } .attention-count { color:#a24f3e; background:var(--terra-pale); width:24px; height:24px; display:grid; place-items:center; border-radius:50%; font-size:11px; font-weight:700; } .attention-list { margin-top:2px; } .attention-item { width:100%; display:flex; align-items:center; gap:10px; padding:12px 0; background:none; border-top:1px solid var(--line); text-align:left; font-size:11px; } .attention-item:first-child { border-top:0; } .attention-item span:nth-child(2) { flex:1; color:#778279; }.attention-item b{color:var(--ink)} .attention-item > span:last-child { color:#9aa49b; font-size:16px; } .attention-symbol { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; font-size:13px; }.saffron-symbol{background:var(--saffron-pale);color:#a0761b}.terra-symbol{background:var(--terra-pale);color:var(--terra)}.spruce-symbol{background:var(--spruce-pale);color:var(--spruce)}
.ticket-toolbar { display:flex; justify-content:space-between; align-items:center; margin:-5px 0 16px; } .tabs { display:flex; gap:4px; } .tab { color:#89938b; background:none; padding:10px 13px; font-size:12px; border-bottom:2px solid transparent; } .tab.active { color:var(--spruce-dark); border-color:var(--spruce); font-weight:700; } .tab b { margin-left:5px; font-size:10px; background:var(--line); padding:2px 5px; border-radius:8px; } .toolbar-actions { display:flex; gap:8px; } .ticket-panel { overflow:hidden; padding:0; } .ticket-table-head,.ticket-row { display:grid; grid-template-columns:28px 2.2fr 1.2fr 1.2fr .8fr .9fr .75fr; align-items:center; gap:10px; padding:14px 18px; } .ticket-table-head { background:#f7f8f3; color:#9aa39b; font-size:10px; text-transform:uppercase; letter-spacing:.7px; } .ticket-row { border-top:1px solid var(--line); font-size:11px; } .ticket-row:hover { background:#fbfcf8; } .checkbox { width:14px; height:14px; border:1px solid #cdd4cc; border-radius:3px; } .ticket-title { display:block; color:var(--ink); font-weight:700; font-size:12px; margin-bottom:4px; } .ticket-id { color:var(--spruce); font-size:10px; } .requester,.updated { color:#8b968d; } .assignee { display:flex; align-items:center; gap:6px; } .mini-avatar { width:22px; height:22px; display:grid; place-items:center; border-radius:50%; font-size:8px; font-weight:700; } .pill { display:inline-block; border-radius:12px; padding:4px 8px; font-size:9px; font-weight:700; width:max-content; } .pill.high { background:var(--saffron-pale); color:#986d12; }.pill.medium{background:#e4eee7;color:var(--spruce)}.pill.critical{background:var(--terra-pale);color:#a44a39}.status { display:inline-flex; align-items:center; gap:5px; color:#64836d; font-size:10px; }.status:before { content:""; width:6px; height:6px; border-radius:50%; background:#78a47d; }.status.pending { color:#a47824; }.status.pending:before { background:var(--saffron); }
.knowledge-hero { background:var(--spruce); color:white; border-radius:7px; padding:28px 30px; margin-bottom:20px; display:flex; justify-content:space-between; align-items:center; background-image:linear-gradient(112deg, rgba(36,77,67,.2), transparent 70%); } .hero-icon { color:#f0c96d; font-size:28px; }.knowledge-hero h2 { font:700 23px Inter, sans-serif; margin:12px 0 5px; }.knowledge-hero p { margin:0; color:#c6ddd0; font-size:12px; }.knowledge-search { width:330px; background:var(--surface); color:var(--muted); padding:12px 14px; border-radius:5px; display:flex; gap:8px; }.knowledge-search input { border:0; outline:0; width:100%; color:var(--ink); background:none; font-size:12px; }.article-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.article-card { background:var(--surface); border:1px solid var(--line); border-radius:7px; padding:20px; min-height:170px; }.article-tag { display:inline-block; padding:5px 8px; border-radius:4px; font-size:9px; font-weight:700; }.tag-spruce{background:var(--spruce-pale);color:var(--spruce)}.tag-saffron{background:var(--saffron-pale);color:#986d12}.tag-terra{background:var(--terra-pale);color:#a04b3a}.article-card h3 { font:700 15px Inter, sans-serif; line-height:1.25; margin:16px 0 8px; }.article-card p { color:#89938b; font-size:11px; line-height:1.5; margin:0 0 22px; }.article-card small { color:#9ca69d; font-size:10px; }.article-card small span { color:var(--saffron); padding:0 4px; }
.knowledge-loading,.knowledge-empty-state { grid-column:1 / -1; min-height:170px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.knowledge-loading { gap:10px; color:var(--muted); }
.knowledge-loading .search-spinner { display:block; }
.knowledge-empty-state h2 { margin:10px 0 6px; font:700 17px Inter, sans-serif; }
.knowledge-empty-state p { margin:0; color:var(--muted); font-size:12px; }
.empty-state { min-height:320px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }.empty-icon { width:55px; height:55px; display:grid; place-items:center; background:var(--spruce-pale); color:var(--spruce); border-radius:50%; font-size:27px; margin-bottom:15px; }.empty-state h2 { font:700 19px Inter, sans-serif; margin:0 0 7px; }.empty-state p { color:#929d95; font-size:12px; margin:0 0 22px; }.automation-layout { display:grid; grid-template-columns:310px 1fr; gap:16px; align-items:start; }.automation-live { background:var(--spruce-pale); color:var(--spruce); padding:5px 8px; border-radius:12px; font-size:9px; font-weight:700; }.automation-live i { display:inline-block; width:5px; height:5px; border-radius:50%; background:#609d72; margin-right:4px; }.rule-list { padding:19px 0 7px; }.rule-list .panel-heading { padding:0 19px; }.rule-row { width:100%; display:flex; align-items:center; text-align:left; background:none; border-top:1px solid var(--line); padding:13px 19px; gap:9px; }.rule-row:hover,.rule-row.active { background:var(--accent-hover); }.rule-icon { width:29px; height:29px; display:grid; place-items:center; border-radius:6px; font-size:14px; }.spruce-rule{background:var(--spruce-pale);color:var(--spruce)}.saffron-rule{background:var(--saffron-pale);color:#9a731e}.terra-rule{background:var(--terra-pale);color:var(--terra)}.ink-rule{background:#e9ece6;color:#596b5e}.rule-row > span:nth-child(2){flex:1}.rule-row b{display:block;font-size:11px}.rule-row small{display:block;color:#98a199;font-size:9px;margin-top:3px}.rule-arrow{color:#9da69f;font-size:16px}.rule-builder { padding:24px; }.builder-header { display:flex; justify-content:space-between; padding-bottom:21px; border-bottom:1px solid var(--line); }.builder-kicker { text-transform:uppercase; color:var(--spruce); font-weight:700; font-size:9px; letter-spacing:1px; }.builder-header h2 { font:700 19px Inter, sans-serif; margin:6px 0 0; }.switch { display:block; width:36px; height:20px; padding:3px; border-radius:12px; background:#cad0c9; }.switch.active{background:var(--spruce)}.switch i{display:block;width:14px;height:14px;background:#fff;border-radius:50%;margin-left:0}.switch.active i{margin-left:16px}.builder-section { padding:22px 0; border-bottom:1px solid var(--line); }.builder-section label { display:flex; justify-content:space-between; margin-bottom:10px; font-weight:700; font-size:11px; }.builder-section label small { color:#a1aaa2; font-weight:400; }.condition-row,.action-row { display:flex; gap:7px; }.condition-row select:first-child{flex:1.3}.condition-row select,.action-row select { flex:1; min-width:0; border:1px solid var(--line); background:var(--surface); border-radius:4px; padding:9px; outline:0; color:#58655d; font-size:11px; }.remove-condition { background:var(--terra-pale); color:var(--terra); width:31px; border-radius:4px; font-size:18px; }.add-condition { background:none; color:var(--spruce); font-size:11px; margin-top:13px; }.action-number { width:28px; height:31px; display:grid; place-items:center; background:#eef3ed; color:var(--spruce); border-radius:4px; font-size:11px; font-weight:700; }.builder-footer { display:flex; justify-content:space-between; align-items:center; padding-top:20px; color:#a0a9a1; font-size:10px; }.toast { position:fixed; right:24px; bottom:24px; background:var(--ink); color:white; border-radius:6px; padding:12px 16px; display:flex; align-items:center; gap:9px; box-shadow:0 10px 35px rgba(0,0,0,.18); transform:translateY(100px); opacity:0; transition:.3s; z-index:20; }.toast.show { transform:none; opacity:1; }.toast span { color:#b5d99d; }.toast p { margin:0; font-size:12px; }.modal-backdrop { position:fixed; inset:0; background:rgba(39,51,47,.3); display:none; place-items:center; z-index:10; padding:20px; }.modal-backdrop.open{display:grid}.modal{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:8px;width:min(510px,100%);padding:28px;box-shadow:0 20px 60px rgba(39,51,47,.2)}.modal-close{position:absolute;right:15px;top:12px;background:none;color:#9aa49b;font-size:22px}.modal-kicker{color:var(--spruce);font-size:10px;text-transform:uppercase;font-weight:700;letter-spacing:1px}.modal h2{font:700 22px Inter, sans-serif;margin:8px 0 5px}.modal > p{color:#8a958d;font-size:12px;margin:0 0 20px}.modal label{display:block;color:#617067;font-size:11px;font-weight:700;margin-top:14px}.modal input,.modal textarea,.modal select{display:block;width:100%;border:1px solid var(--line);background:var(--surface);border-radius:4px;padding:10px;margin-top:6px;outline:none;color:var(--ink);font-size:12px}.modal textarea{height:85px;resize:vertical}.modal-two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.full-width{width:100%;margin-top:20px}
@media (max-width:1050px){.sidebar{width:220px}.topbar,.view-container{padding-left:25px;padding-right:25px}.dashboard-grid,.lower-grid{grid-template-columns:1fr}.metric-grid{grid-template-columns:repeat(2,1fr)}.donut-wrap{justify-content:center}.automation-layout{grid-template-columns:1fr}.rule-list{display:none}}
@media (min-width:1051px){.view-container{width:100%;max-width:1760px;margin-left:0;margin-right:auto;padding-left:42px;padding-right:42px}.ticket-page-heading,.page-heading{max-width:none}.dashboard-grid,.lower-grid{grid-template-columns:minmax(0,1.65fr) minmax(360px,1fr)}}
@media (min-width:1051px){html,body{max-width:100%}.main-content{min-width:0;width:calc(100% - 252px);overflow-x:hidden}.topbar{width:100%;padding-left:42px;padding-right:42px;box-sizing:border-box;overflow:visible}.top-actions{flex:0 0 auto;white-space:nowrap}.top-actions .icon-button{display:grid;place-items:center;min-width:34px;min-height:34px}.view-container{box-sizing:border-box;overflow:visible}.dashboard-grid,.lower-grid,.metric-grid{min-width:0}.panel{min-width:0}}
@media (min-width:1441px){.view-container{max-width:1760px}}
@media (min-width:1051px) and (max-width:1440px){.sidebar{width:240px}.main-content{width:calc(100% - 240px)}.topbar{padding-left:30px;padding-right:30px}.view-container{padding:30px 30px 50px;max-width:none}.page-heading h1{font-size:29px}.metric-card{padding:15px}.panel{padding:17px}}
@media (min-width:701px) and (max-width:1050px){.sidebar{width:220px}.main-content{width:calc(100% - 220px)}.topbar,.view-container{padding-left:25px;padding-right:25px}.view-container{padding-top:30px}.ticket-panel{overflow-x:auto}}
@media (max-width:700px){.sidebar{position:fixed;left:-260px;top:0;bottom:0;z-index:5;transition:.25s}.sidebar.open{left:0}.topbar{height:62px;padding:0 16px}.mobile-menu{display:block}.breadcrumbs{display:none}.top-actions{gap:8px}.create-button{padding:10px}.view-container{padding:26px 16px 45px}.page-heading{align-items:flex-start;flex-direction:column;margin-bottom:23px}.page-heading h1{font-size:27px}.heading-actions{width:100%}.heading-actions button{flex:1}.metric-grid{gap:9px}.metric-card{padding:13px;min-height:133px}.metric-card > strong{font-size:21px}.metric-card small{font-size:9px}.panel{padding:15px}.chart-wrap{height:180px}.legend{gap:7px}.donut-wrap{gap:14px}.donut{flex-basis:110px;height:110px}.donut:after{width:72px;height:72px}.ticket-toolbar{align-items:flex-start;flex-direction:column;gap:10px}.tabs{max-width:100%;overflow:auto}.ticket-table-head{display:none}.ticket-row{grid-template-columns:25px 1.5fr 1fr;gap:8px;padding:13px}.ticket-row > span:nth-child(3),.ticket-row > span:nth-child(4),.ticket-row > span:nth-child(5),.ticket-row > span:nth-child(6),.ticket-row > span:nth-child(7){display:none}.knowledge-hero{display:block;padding:23px}.knowledge-search{width:100%;margin-top:22px}.article-grid{grid-template-columns:1fr}.condition-row,.action-row{flex-wrap:wrap}.condition-row select,.action-row select{min-width:calc(50% - 5px)}.builder-footer{gap:15px;align-items:flex-start;flex-direction:column}.modal{padding:23px}.modal-two-col{grid-template-columns:1fr}.change-state-panel{align-items:flex-start;flex-direction:column}.change-state-panel label{align-items:flex-start;flex-direction:column;gap:6px;margin-left:0;width:100%}.change-state-panel select{width:100%}}
.change-state-panel { display:none; align-items:center; justify-content:space-between; gap:20px; }.change-state-panel.visible { display:flex; }.change-state-panel h2 { font:700 18px Inter, sans-serif; margin:6px 0 4px; }.change-state-panel p { color:#929d95; font-size:11px; margin:0; }.change-state-panel label { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:11px; font-weight:700; margin-left:auto; }.change-state-panel select { border:1px solid var(--line); background:var(--surface); border-radius:4px; padding:10px; color:#58655d; font-size:11px; }
@media (max-width:700px){.ticket-page-heading{align-items:flex-start;flex-direction:column}.ticket-page-actions{width:100%;justify-content:flex-end}.ticket-search.focused{position:absolute;left:16px;right:16px;width:auto}.ticket-filters{display:flex;overflow-x:auto;padding-bottom:3px}.ticket-filters button{min-width:130px}.ticket-meta-row{margin-top:-8px}.ticket-panel{margin-left:-16px;margin-right:-16px}.ticket-table-head,.ticket-row{min-width:1050px}}
.ticket-table-head,.ticket-row { width:1205px !important; min-width:1205px !important; grid-template-columns:70px 115px 100px 135px 30px 260px 110px 110px 85px 150px !important; grid-auto-flow:initial !important; }.ticket-table-head > span,.ticket-row > span { min-width:0 !important; max-width:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ticket-title-cell { min-width:0 !important; overflow:visible !important; white-space:normal !important; }.ticket-title-cell .ticket-title { display:block; overflow:visible; white-space:normal; line-height:1.35; }.ticket-title-cell .ticket-requester { white-space:normal; }.requester-cell { overflow:visible !important; text-overflow:clip !important; white-space:normal !important; }.ticket-row { min-height:64px; }
.ticket-panel { background:var(--surface); }.ticket-table-head { background:var(--surface); }.ticket-row { background:var(--surface); }
.ticket-panel { width:100%; min-width:100%; background:var(--surface); }.ticket-table-head,.ticket-row { width:100% !important; min-width:100% !important; }
.ticket-panel { background:var(--surface) !important; }
@media (max-width:700px) { .ticket-table-head,.ticket-row { width:1205px !important; min-width:1205px !important; } }
.ticket-row { cursor:pointer; }.ticket-detail-backdrop { position:fixed; inset:0; z-index:15; display:none; overflow:auto; background:#fff; }.ticket-detail-backdrop.open { display:block; animation:fadeUp .25s ease both; }.ticket-detail { min-height:100vh; background:#fff; color:#17202d; padding:28px 4.2vw 70px; }.detail-header { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; max-width:1240px; margin:0 auto 35px; }.back-to-tickets { display:block; padding:0; margin-bottom:27px; background:none; color:#4d70df; font-size:12px; font-weight:700; }.detail-header .eyebrow { color:#7f8993; }.detail-header .eyebrow span { color:#4d70df; }.detail-header h1 { font:700 34px Inter, sans-serif; letter-spacing:-1.2px; margin:8px 0 0; }.detail-actions { display:flex; gap:9px; }.detail-actions .outline-button { font-size:16px; padding:9px 14px; }.detail-body { max-width:1240px; display:grid; grid-template-columns:minmax(0,760px) 280px; gap:65px; margin:0 auto; }.detail-grid { display:grid; grid-template-columns:1fr 1fr; column-gap:35px; row-gap:23px; }.detail-grid label { position:relative; display:block; color:#68727d; font-size:12px; }.detail-grid label > input,.detail-grid label > select,.detail-grid label > textarea { display:block; width:100%; margin-top:8px; border:1px solid #dfe3e7; background:#fff; border-radius:5px; padding:11px 12px; outline:none; color:#17202d; font-size:14px; }.detail-grid label > input:focus,.detail-grid label > select:focus,.detail-grid label > textarea:focus { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; }.required { color:#ca4e4e; font-weight:500; }.full-detail-field { grid-column:1 / -1; }.detail-grid textarea { height:178px; resize:vertical; line-height:1.5; }.editor-tools { position:absolute; left:1px; right:1px; bottom:1px; display:flex; gap:8px; align-items:center; height:43px; padding:0 9px; background:#f6f7f8; border-radius:0 0 4px 4px; }.editor-tools button { width:28px; height:28px; border:1px solid #dfe3e7; border-radius:5px; background:#fff; color:#4d70df; }.editor-tools span { margin-left:auto; color:#a2a6aa; font-size:16px; }.detail-sidebar { display:flex; flex-direction:column; gap:18px; }.detail-side-card { border-top:2px solid #e1e4e7; padding-top:14px; }.detail-side-card h2 { font:700 15px Inter, sans-serif; margin:0 0 13px; }.detail-side-card > div { display:flex; justify-content:space-between; align-items:center; gap:14px; border-top:1px solid #edf0f1; padding:12px 0; color:#7d8790; font-size:11px; }.detail-side-card > div b { color:#34404c; text-align:right; font-weight:500; }.activity-note { justify-content:flex-start !important; }.activity-note p { margin:0; color:#34404c; line-height:1.4; }.activity-note small { display:block; color:#99a1a8; margin-top:3px; }.activity-note .avatar { width:27px; height:27px; }.ticket-detail .pill { font-style:normal; }.ticket-detail .pill.high { background:#f8edcc; color:#986d12; }.ticket-detail .pill.medium { background:#e4eee7; color:var(--spruce); }.ticket-detail .pill.critical { background:#f7e4de; color:#a44a39; }
@media (max-width:800px){.ticket-detail{padding:20px 18px 45px}.detail-header{align-items:flex-start;flex-direction:column;margin-bottom:27px}.detail-header h1{font-size:27px}.detail-actions{width:100%;justify-content:flex-end}.detail-body{display:block}.detail-sidebar{margin-top:30px}.detail-grid{grid-template-columns:1fr;gap:19px}.full-detail-field{grid-column:auto}}
.comments-panel { max-width:1240px; margin:55px auto 0; }.detail-tabs { display:flex; gap:47px; border-bottom:1px solid #dfe3e7; overflow-x:auto; }.detail-tabs button { position:relative; flex:0 0 auto; padding:0 0 16px; background:none; color:#68727d; font-size:14px; text-transform:uppercase; letter-spacing:.2px; }.detail-tabs button.active { color:#17202d; }.detail-tabs button.active:after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:4px; background:#4d70df; }.comment-history { padding:24px 0 8px 40px; }.comment-item { display:flex; align-items:flex-start; gap:12px; margin-bottom:17px; color:#34404c; font-size:12px; }.comment-item p { margin:3px 0 3px; }.comment-item small { color:#98a1a8; font-size:10px; }.comment-avatar { display:grid; place-items:center; width:31px; height:31px; flex:0 0 auto; border-radius:50%; font-size:10px; font-weight:700; }.comment-composer { display:flex; gap:18px; align-items:flex-start; }.comment-composer > .comment-avatar { width:50px; height:50px; font-size:15px; }.composer-card { flex:1; border:1px solid #d8dde2; border-radius:6px; overflow:hidden; background:#fff; }.comment-editor { min-height:165px; padding:18px; outline:none; color:#27332f; font-size:13px; line-height:1.55; }.comment-editor:empty:before { content:attr(data-placeholder); color:#a7afb5; }.editor-toolbar { display:flex; align-items:center; gap:8px; padding:11px 14px; border-top:1px solid #edf0f2; background:#f4f5f6; }.editor-toolbar button { min-width:28px; height:29px; border:0; background:none; color:#6c7277; font-size:19px; cursor:pointer; }.editor-toolbar button:hover { color:#4d70df; }.toolbar-divider { width:1px; height:31px; background:#d9dee2; margin:0 4px; }.composer-footer { display:flex; align-items:center; gap:10px; padding:12px 14px; border-top:1px solid #e7eaec; background:#f4f5f6; }.comment-visibility { display:flex; align-items:center; gap:5px; min-width:0; }.visibility-toggle { padding:7px 8px; border:0; border-radius:4px; background:transparent; color:#4d70df; font-size:12px; white-space:nowrap; }.visibility-toggle.active { background:#fff; box-shadow:0 1px 3px rgba(39,51,47,.1); }.visibility-toggle.public.active { color:var(--spruce); }.visibility-toggle span { color:#869097; }.cc-label { color:#737e86; font-size:11px; margin-left:7px; }.comment-visibility input { width:115px; border:0; border-bottom:1px solid #d4dadd; background:transparent; outline:none; padding:6px 3px; font-size:11px; }.attach-button { margin-left:auto; border:1px solid #d6dce0; border-radius:5px; background:#fff; padding:8px 10px; color:#4d70df; font-size:11px; white-space:nowrap; }.post-button { border:0; border-radius:5px; background:#b4b8bc; color:#fff; padding:9px 25px; font-size:12px; font-weight:700; }.post-button:hover { background:var(--spruce); }.comment-item.posted { border-left:3px solid var(--spruce); padding-left:10px; }.comment-item.posted.private { border-left-color:var(--saffron); }.posted-copy { margin:6px 0; color:#58646c; line-height:1.45; white-space:pre-wrap; }
.view-size-control { display:flex; align-items:center; gap:6px; margin-left:auto; color:#7f8a83; font-size:11px; }.view-size-control select { border:1px solid var(--line); border-radius:4px; background:var(--surface); color:var(--spruce-dark); padding:5px 22px 5px 7px; font-size:11px; outline:none; }
.view-manager,.view-editor { display:none; position:absolute; z-index:8; width:330px; padding:20px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 16px 35px rgba(39,51,47,.16); }.view-manager.open,.view-editor.open { display:block; }.view-manager { top:104px; left:42px; }.view-editor { top:104px; right:42px; width:min(520px,calc(100% - 84px)); }.view-manager-header,.view-editor-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:15px; border-bottom:1px solid var(--line); }.view-manager h2,.view-editor h2 { font:700 18px Inter, sans-serif; margin:6px 0 4px; }.view-manager p { margin:0; color:#8b968d; font-size:11px; }.view-manager-close,.view-editor-close { background:none; color:#8d9790; font-size:20px; }.saved-view-list { display:grid; gap:4px; margin:13px 0; }.saved-view { display:flex; align-items:center; justify-content:space-between; width:100%; padding:11px 9px; border-radius:5px; background:none; text-align:left; }.saved-view:hover { background:var(--accent-hover); }.saved-view span { color:var(--ink-2); font-size:12px; font-weight:700; }.saved-view small { color:#929c95; font-size:10px; }.new-view-button,.add-view-condition { background:none; color:var(--spruce); font-size:11px; padding:8px 0 0; }.view-editor > label { display:block; margin:18px 0 12px; color:var(--muted); font-size:11px; font-weight:700; }.view-editor > label input { display:block; width:100%; margin-top:6px; padding:10px; border:1px solid var(--line); border-radius:4px; outline:none; }.view-condition-list { display:grid; gap:8px; }.view-condition-row { display:flex; align-items:center; gap:7px; }.view-condition-row select { flex:1; min-width:0; padding:9px; border:1px solid var(--line); border-radius:4px; background:var(--surface); color:var(--ink-2); font-size:11px; }.view-condition-row span { color:#9aa49d; font-size:11px; }.remove-view-condition { width:27px; height:30px; border-radius:4px; background:var(--terra-pale); color:var(--terra); font-size:16px; }.view-editor-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:20px; padding-top:15px; border-top:1px solid var(--line); }
.related-panel { display:none; margin-top:24px; }.related-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding-bottom:20px; border-bottom:1px solid #e1e5e8; }.related-heading h2 { font:700 19px Inter, sans-serif; margin:6px 0 4px; color:#27333f; }.related-heading p { margin:0; color:#7e8992; font-size:12px; }.related-count { padding:7px 10px; border-radius:14px; background:var(--spruce-pale); color:var(--spruce); font-size:11px; font-weight:700; white-space:nowrap; }.related-columns { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:23px; }.related-columns > div { min-width:0; }.related-columns h3 { color:#68727d; font-size:11px; text-transform:uppercase; letter-spacing:.7px; margin:0 0 10px; }.related-ticket { display:flex; align-items:center; gap:12px; justify-content:space-between; padding:13px 12px; margin-bottom:8px; border:1px solid #e1e5e8; border-radius:6px; background:#fff; }.related-ticket > div { min-width:0; }.related-ticket a { display:block; color:#4d70df; font-size:10px; font-weight:700; margin-bottom:4px; }.related-ticket b { display:block; overflow:hidden; color:#34404c; font-size:12px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }.related-ticket small { display:block; color:#98a1a8; font-size:10px; margin-top:4px; }.confirm-related { display:grid; place-items:center; flex:0 0 auto; width:30px; height:30px; border:1px solid #cbd9d2; border-radius:5px; background:var(--spruce-pale); color:var(--spruce); font-size:17px; }.confirm-related:hover { background:var(--spruce); color:#fff; }.related-ticket.confirmed { border-left:3px solid var(--spruce); }.confirmed-mark { color:var(--spruce); font-size:18px; }.related-empty { padding:22px 13px; border:1px dashed #d6dde0; border-radius:6px; color:#98a1a8; font-size:11px; text-align:center; }
.detail-action-panel { display:none; align-items:center; gap:16px; margin-top:24px; padding:22px; border:1px solid #e1e5e8; border-radius:6px; background:#fbfcfc; }.detail-action-icon { display:grid; place-items:center; flex:0 0 auto; width:42px; height:42px; border-radius:50%; background:var(--spruce-pale); color:var(--spruce); font-size:21px; }.audit-icon { background:var(--saffron-pale); color:#9a731e; }.detail-action-panel h2 { font:700 17px Inter, sans-serif; margin:5px 0; color:#27333f; }.detail-action-panel p { margin:0; color:#7e8992; font-size:12px; }.task-status,.audit-time { margin-left:auto; color:var(--spruce); background:var(--spruce-pale); border-radius:13px; padding:6px 9px; font-size:10px; font-weight:700; white-space:nowrap; }.audit-time { color:#8d6c22; background:var(--saffron-pale); font-weight:500; }
.audit-log-heading { display:flex; align-items:flex-start; justify-content:flex-start; width:100%; }.audit-log-heading h2 { margin:0; font:700 24px Inter, sans-serif; letter-spacing:-.5px; color:#27333f; }.audit-log { width:100%; margin-top:20px; border-top:1px solid #e5e9eb; }.audit-event { position:relative; display:flex; gap:12px; padding:16px 0; border-bottom:1px solid #e5e9eb; }.audit-event-marker { display:grid; place-items:center; flex:0 0 auto; width:28px; height:28px; border-radius:50%; background:#e5edf0; color:#4d70df; font-size:10px; font-weight:700; }.audit-event-marker.system { background:#e8ece9; color:#60716a; }.audit-event-marker.automation { background:var(--saffron-pale); color:#96701c; font-size:14px; }.audit-event-content { min-width:0; }.audit-event-content time { display:block; color:#65717a; font-size:11px; font-weight:600; margin-bottom:5px; }.audit-event-content p { margin:0; color:#27333f; font-size:12px; line-height:1.5; }.audit-event-content p b { color:#17202d; }
.audit-panel { flex-direction:column; align-items:stretch; text-align:left; }.audit-panel .audit-log-heading,.audit-panel .audit-log { flex:0 0 auto; width:100%; }.audit-panel .audit-event-content { text-align:left; }
.audit-event-detail { max-width:760px; margin-top:8px; padding:10px 12px; border-left:3px solid #dce6e2; background:#f7f9f8; color:#5e6b73; font-size:11px; line-height:1.65; }.audit-event-marker.automation + .audit-event-content .audit-event-detail { border-left-color:#efdaa0; background:#fffaf0; }.audit-event-source { display:block; margin-top:9px; color:#9aa4aa; font-size:10px; letter-spacing:.1px; }
.detail-grid select,.modal select { appearance:none; -webkit-appearance:none; background-color:#fff; background-image:linear-gradient(45deg, transparent 50%, #7e8a84 50%),linear-gradient(135deg, #7e8a84 50%, transparent 50%); background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%; background-size:5px 5px,5px 5px; background-repeat:no-repeat; cursor:pointer; }.detail-grid select { min-height:40px; }.detail-grid label:nth-child(2) select { border-radius:18px; background-color:#e6edf0; border-color:#e6edf0; color:#34434d; font-weight:600; padding-left:13px; }.detail-grid select:hover,.modal select:hover { border-color:#aec0cb; }.detail-grid select:focus,.modal select:focus { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; outline:none; }.detail-grid option,.modal option { background:#fff; color:#27333f; padding:8px; }
.state-field { z-index:4; }.custom-state-dropdown { position:relative; margin-top:8px; }.state-dropdown-trigger { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:40px; padding:0 13px; border:1px solid #e6edf0; border-radius:18px; background:#e6edf0; color:#34434d; font-size:14px; font-weight:600; text-align:left; }.state-dropdown-trigger:after { content:'⌄'; color:#687881; font-size:16px; }.custom-state-dropdown.open .state-dropdown-trigger { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; }.state-dropdown-menu { position:absolute; top:calc(100% + 6px); left:0; right:0; display:none; padding:5px; border:1px solid #d9e0e4; border-radius:7px; background:#fff; box-shadow:0 12px 25px rgba(39,51,47,.16); z-index:20; }.custom-state-dropdown.open .state-dropdown-menu { display:block; }.state-dropdown-option { display:block; width:100%; padding:9px 10px; border-radius:4px; background:#fff; color:#34434d; font-size:12px; text-align:left; }.state-dropdown-option:hover,.state-dropdown-option:focus { background:var(--spruce-pale); color:var(--spruce-dark); outline:none; }
.ticket-filters { grid-template-columns:repeat(7, minmax(0, 1fr)); }.ticket-filters .filter-select { position:relative; display:flex; align-items:center; justify-content:space-between; min-width:0; padding:12px 13px; border:0; border-radius:7px; background:#f1f2f1; color:#4d5651; font-size:12px; text-align:left; }.ticket-filters .filter-select span { color:#4d5651; }.filter-select select { appearance:none; position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; }.filter-select:after { content:'⌄'; color:#a5aca6; font-size:16px; }.ticket-table-head,.ticket-row { min-width:1250px; grid-template-columns:1fr 1fr 1.15fr 1.25fr 30px 2.4fr 1.25fr 1.15fr .9fr 1.1fr; }.ticket-table-head span:nth-child(8),.ticket-row > span:nth-child(8) { display:block; }
.ticket-filters .filter-select.has-custom-select { padding:0; }.ticket-filters .filter-select.has-custom-select > span { display:none; }.custom-select-wrapper { position:relative; width:100%; }.custom-select-trigger { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:40px; padding:10px 13px; border:1px solid var(--line); border-radius:5px; background:#fff; color:var(--ink-2); font-size:12px; text-align:left; }.ticket-filters .custom-select-wrapper { width:100%; flex:1; }.ticket-filters .custom-select-trigger { min-height:0; padding:12px 13px; border:0; border-radius:7px; background:#f1f2f1; }.view-size-control .custom-select-wrapper { width:auto; min-width:72px; }.view-size-control .custom-select-trigger { min-height:28px; padding:5px 8px; border:1px solid var(--line); border-radius:5px; background:var(--surface); color:var(--spruce-dark); font-size:11px; }.custom-select-trigger:after { content:'⌄'; margin-left:12px; color:#a5aca6; font-size:16px; }.custom-select-wrapper.open .custom-select-trigger { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; }.custom-select-menu { position:absolute; top:calc(100% + 6px); left:0; right:0; display:none; min-width:100%; max-height:260px; overflow-y:auto; padding:5px; border:1px solid #d9e0e4; border-radius:7px; background:#fff; box-shadow:0 12px 25px rgba(39,51,47,.16); z-index:30; }.custom-select-wrapper.open .custom-select-menu { display:block; }.custom-select-option { display:block; width:100%; padding:9px 10px; border:0; border-radius:4px; background:#fff; color:#34434d; font-size:12px; text-align:left; white-space:nowrap; }.custom-select-option:hover,.custom-select-option:focus { background:var(--spruce-pale); color:var(--spruce-dark); outline:none; }
@media (max-width:800px){.comments-panel{margin-top:38px}.detail-tabs{gap:23px}.detail-tabs button{font-size:11px}.comment-history{padding-left:0}.comment-composer{gap:9px}.comment-composer>.comment-avatar{width:34px;height:34px;font-size:10px}.composer-footer{align-items:flex-start;flex-wrap:wrap}.comment-visibility{width:100%;flex-wrap:wrap}.comment-visibility input{flex:1}.attach-button{margin-left:0}.post-button{margin-left:auto}}
.custom-select-option { display:flex; align-items:center; gap:9px; width:100%; padding:9px 10px; border:0; border-radius:4px; background:#fff; color:#34434d; font-size:12px; text-align:left; white-space:nowrap; }.custom-select-option:hover,.custom-select-option:focus { background:var(--spruce-pale); color:var(--spruce-dark); outline:none; }.dropdown-check { display:grid; place-items:center; flex:0 0 auto; width:15px; height:15px; border:1px solid #c9d2cc; border-radius:3px; background:#fff; }.custom-select-option.is-selected .dropdown-check { border-color:var(--spruce); background:var(--spruce); }.custom-select-option.is-selected .dropdown-check:after { content:'✓'; color:#fff; font-size:11px; font-weight:700; }.custom-select-option.is-selected { color:var(--spruce-dark); font-weight:600; }
.custom-select-option.is-selected .dropdown-check:after { content:""; display:block; width:7px; height:4px; border-left:2px solid #fff; border-bottom:2px solid #fff; transform:rotate(-45deg) translate(1px,-1px); }
.custom-select-search { display:block; width:100%; margin:2px 0 5px; padding:8px 9px; border:1px solid #dfe4df; border-radius:4px; background:#fbfcfa; color:#34434d; font-size:11px; outline:none; }.custom-select-search:focus { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; }.custom-select-search::placeholder { color:#9aa49d; }
.custom-select-trigger:after { content:""; display:block; width:6px; height:6px; margin-left:12px; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:rotate(45deg) translateY(-2px); }
.state-field .state-dropdown-trigger:after { content:""; display:block; width:6px; height:6px; margin-left:auto; border-right:1.5px solid #687881; border-bottom:1.5px solid #687881; transform:rotate(45deg) translateY(-2px); font-size:0; }
.ticket-filters .filter-select.has-custom-select:after { content:none !important; display:none !important; }.ticket-filters .custom-select-trigger:after { content:"" !important; display:block !important; width:6px; height:6px; margin-left:auto; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:rotate(45deg) translateY(-2px); }
.custom-select-trigger,.custom-select-option { text-align:left !important; justify-content:flex-start !important; }.custom-select-trigger:after { margin-left:auto; }.workspace-option,.saved-view,.view-condition-row select { text-align:left; }
.ticket-filters .custom-select-option { justify-content:flex-start !important; text-align:left !important; gap:9px; }.ticket-filters .custom-select-option > span:last-child { margin-left:0 !important; text-align:left !important; }
.custom-select-menu .custom-select-option { justify-content:flex-start !important; text-align:left !important; gap:9px; }.custom-select-menu .custom-select-option > span:last-child { margin-left:0 !important; text-align:left !important; }
.ticket-table-head,.ticket-row { width:max-content; grid-auto-flow:column; }.ticket-table-head > span,.ticket-row > span { min-width:0; white-space:nowrap; }.ticket-table-head [data-column-key] { cursor:pointer !important; }
.ticket-table-head,.ticket-row { width:1205px; min-width:1205px; grid-template-columns:70px 115px 100px 135px 30px 260px 110px 110px 85px 150px; grid-auto-flow:initial; }.ticket-table-head > span,.ticket-row > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.custom-select-menu { left:0; right:auto; width:max-content; min-width:100%; max-width:min(300px,calc(100vw - 32px)); overflow-x:hidden; }.ticket-filters .custom-select-menu { min-width:220px; }.custom-select-option { min-width:100%; white-space:normal; }
.custom-select-wrapper.open .custom-select-trigger:after { transform:rotate(225deg) translate(-1px,-1px); }
.ticket-filters .filter-select.has-custom-select:after { display:none; }
.ticket-table-head [data-column-key] { position:relative; cursor:grab; user-select:none; touch-action:none; }.ticket-table-head [data-column-key]:active { cursor:grabbing; }.column-drag-handle { display:inline-block; margin-left:5px; color:#aab2ac; font-size:10px; font-style:normal; opacity:.65; }.ticket-table-head [data-column-key]:hover { color:var(--spruce-dark); background:#f0f4f0; }.ticket-table-head .dragging-column { opacity:.4; }.ticket-table-head .drag-over-column { outline:2px solid var(--spruce); outline-offset:-2px; background:#e9f1eb; }.ticket-table-head .selected-column { outline:2px solid var(--saffron); outline-offset:-2px; background:var(--saffron-pale); color:#80651f; }
.ticket-page-heading { padding-bottom:2px; }.ticket-page-heading .eyebrow { font-size:9px; letter-spacing:1.5px; }.ticket-page-heading h1 { font-size:30px; color:var(--ink); }.ticket-meta-row { min-height:28px; align-items:center; padding:0 1px 13px; border-bottom:1px solid #e2e5df; }.ticket-meta-row .edit-view-button { letter-spacing:.7px; }.ticket-meta-row > span { color:#b0b7b1; }.view-size-control { margin-left:auto; }
.sidebar { position:sticky; top:0; height:100vh; align-self:flex-start; }
.profile-row > div { flex:1 1 auto; min-width:0; }.profile-row b { white-space:normal; overflow-wrap:anywhere; line-height:1.25; }.profile-row .more { flex:0 0 auto; margin-left:4px; }
.profile-menu { position:relative; }.profile-more-button { flex:0 0 auto; min-width:30px; min-height:30px; padding:0; border-radius:5px; background:transparent; color:var(--muted); font-size:16px; letter-spacing:1px; }.profile-more-button:hover,.profile-menu.open .profile-more-button { background:#e1e9e2; color:var(--spruce-dark); }.profile-menu-dropdown { display:none; position:absolute; right:0; bottom:calc(100% + 8px); z-index:20; width:184px; padding:5px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }.profile-menu.open .profile-menu-dropdown { display:grid; }.profile-menu-dropdown button { width:100%; padding:9px 10px; border-radius:5px; background:transparent; color:var(--ink-2); font-size:12px; text-align:left; }.profile-menu-dropdown button:hover { background:var(--spruce-pale); color:var(--spruce-dark); }
.global-search-panel { position:fixed; inset:0; z-index:40; display:none; padding-top:76px; background:rgba(39,51,47,.2); }.global-search-panel.open { display:block; }.global-search-box { display:flex; align-items:center; gap:10px; width:min(680px,calc(100% - 32px)); margin:0 auto; padding:12px 14px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 14px 35px rgba(39,51,47,.18); }.global-search-box > span { color:var(--spruce); font-size:22px; }.global-search-box input { flex:1; min-width:0; border:0; outline:0; background:none; color:var(--ink); font-size:13px; }.global-search-close { background:none; color:#89948c; font-size:21px; }.global-search-results { width:min(680px,calc(100% - 32px)); max-height:430px; overflow-y:auto; margin:8px auto 0; padding:6px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 14px 35px rgba(39,51,47,.18); }.global-result { display:grid; grid-template-columns:75px 1fr 20px; gap:10px; align-items:center; width:100%; padding:12px 10px; border:0; border-radius:5px; background:none; color:var(--ink); text-align:left; }.global-result:hover { background:var(--accent-hover); }.global-result-number { color:var(--spruce); font-size:10px; font-weight:700; }.global-result b,.global-result small { display:block; }.global-result b { font-size:12px; }.global-result small { color:#89948c; font-size:10px; margin-top:4px; }.global-result > span:last-child { color:#9aa49d; font-size:17px; }.global-empty { padding:20px; margin:0; color:#8d9890; font-size:12px; text-align:center; }
.range-picker { position:relative; }.range-menu { position:absolute; top:calc(100% + 6px); right:0; z-index:20; display:none; width:190px; padding:5px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }.range-picker.open .range-menu { display:grid; }.range-option { display:flex; align-items:center; justify-content:space-between; width:100%; padding:9px 10px; border:0; border-radius:4px; background:none; color:var(--ink-2); font-size:11px; text-align:left; }.range-option:hover,.range-option.active { background:#eaf2ec; color:var(--spruce-dark); font-weight:700; }.range-option span { color:var(--spruce); font-weight:700; }
.range-picker .quiet-button { display:flex; align-items:center; justify-content:space-between; min-width:148px; min-height:34px; padding:0 11px; border-color:#d2dbd3; border-radius:5px; background:#fff; color:#355f52; box-shadow:0 1px 1px rgba(39,51,47,.04); font-weight:700; }
.range-picker .quiet-button:hover { border-color:#a5b6a9; background:#fbfdfb; color:var(--spruce-dark); }
.range-picker .quiet-button span { display:block; width:7px; height:7px; padding:0; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); color:transparent; font-size:0; transform:rotate(45deg) translateY(-2px); }
.range-picker.open .quiet-button { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
.range-picker.open .quiet-button span { transform:rotate(225deg) translate(-1px,-1px); }
.range-picker .range-menu { min-width:220px; padding:6px; border-color:var(--line-strong); box-shadow:0 16px 30px rgba(33,48,40,.17), 0 2px 6px rgba(33,48,40,.08); }
.range-picker .range-option { min-height:34px; border-radius:5px; font-size:12px; font-weight:500; }
[data-theme="dark"] .range-picker .quiet-button { border-color:var(--ink-2); background:var(--surface-2); color:var(--ink); }
[data-theme="dark"] .range-picker .quiet-button:hover { background:var(--hover-bg); }
.volume-panel .chart-wrap { height:238px; padding-bottom:25px; }.volume-panel .bar-group small { bottom:-17px; }
@media (max-width:700px) { .volume-panel .chart-wrap { height:208px; } }
.view-size-control { margin-left:0; }.ticket-page-actions .view-size-control { order:4; }
.settings-layout { display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:980px; }.settings-group { padding:0; overflow:hidden; }.settings-group-heading { display:flex; align-items:flex-start; gap:12px; padding:22px 20px; border-bottom:1px solid var(--line); }.settings-icon { display:grid; place-items:center; flex:0 0 auto; width:34px; height:34px; border-radius:7px; font-size:16px; }.settings-group-heading h2 { font:700 16px Inter, sans-serif; margin:1px 0 5px; }.settings-group-heading p { margin:0; color:#929d95; font-size:11px; line-height:1.4; }.settings-items { padding:5px 0; }.settings-items button { display:flex; align-items:center; justify-content:space-between; width:100%; padding:13px 20px; background:none; color:var(--ink-2); font-size:12px; text-align:left; }.settings-items button:hover { background:var(--accent-hover); color:var(--spruce-dark); }.settings-items button span { color:#a1aaa3; font-size:16px; }
.workspace-category-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; max-width:100%; margin-bottom:16px; }.workspace-category-card { min-height:170px; overflow:hidden; padding:0; border:1px solid var(--line); border-radius:8px; background:var(--surface); box-shadow:0 4px 14px rgba(44,57,51,.04); }.workspace-category-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; min-height:88px; padding:20px 18px 16px; border-bottom:1px solid var(--line); }.workspace-category-heading h2 { margin:0 0 4px; color:var(--ink); font:700 17px Inter, sans-serif; }.workspace-category-heading p { margin:0; color:var(--muted); font-size:12px; }.workspace-category-heading strong { display:grid; place-items:center; flex:0 0 auto; min-width:34px; height:34px; padding:0 8px; border-radius:50%; background:#eef2f5; color:#38567e; font:700 17px Inter, sans-serif; }.workspace-summary-link { display:grid; grid-template-columns:10px minmax(0,1fr) 18px; align-items:center; gap:10px; width:100%; min-height:80px; padding:14px 18px; background:none; color:var(--ink); text-align:left; }.workspace-summary-link:hover { background:#f7faf6; }.workspace-summary-dot { width:9px; height:9px; border-radius:50%; background:#5b8caf; }.workspace-summary-link span:nth-child(2) { min-width:0; }.workspace-summary-link b,.workspace-summary-link small { display:block; }.workspace-summary-link b { overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.workspace-summary-link small { margin-top:4px; overflow:hidden; color:var(--muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.workspace-summary-link i { color:var(--muted); font-size:18px; font-style:normal; }.workspace-empty-copy { display:flex; align-items:center; justify-content:center; min-height:80px; margin:0; color:#8d9890; font-size:12px; }.workspace-queue-panel { max-width:1180px; }.workspace-ticket-size { margin:0; }.workspace-ticket-size .custom-select-wrapper { min-width:62px; }.workspace-ticket-size .custom-select-trigger { min-height:32px; padding:7px 8px; font-size:11px; }.workspace-queue-panel td b { color:var(--ink); font-size:12px; }.workspace-queue-panel .ticket-state-chip { width:auto; min-width:105px; max-width:145px; }.workspace-queue-panel tr { cursor:pointer; }@media (max-width:700px){.workspace-category-grid{grid-template-columns:1fr}}[data-theme="dark"] .workspace-category-card{background:var(--surface);border-color:var(--line)}[data-theme="dark"] .workspace-category-heading strong{background:#2b3850;color:#c8d6ee}[data-theme="dark"] .workspace-summary-link:hover{background:#232d23}
.problem-register { max-width:1180px; }.problem-register td:first-child b { display:block; color:var(--spruce); font-size:10px; }.problem-outage-title { display:block; margin-top:3px; color:var(--ink); font-size:12px; font-weight:700; }.problem-status { display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700; }.problem-status:before { content:""; width:7px; height:7px; border-radius:50%; background:#d5a33c; }.problem-status.resolved:before { background:#55966d; }.problem-status.mitigated:before { background:#5b8caf; }.problem-status.investigating:before { background:#c96d55; }
.outage-notification-panel { max-width:1180px; margin-top:16px; }.outage-notification-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px; }.outage-notification-grid label { display:block; color:var(--ink-2); font-size:12px; font-weight:700; }.outage-notification-grid .full-width { grid-column:1 / -1; }.outage-notification-grid input,.outage-notification-grid select,.outage-notification-grid textarea { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; font-size:12px; outline:none; }.outage-notification-grid input:focus,.outage-notification-grid select:focus,.outage-notification-grid textarea:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }.outage-notification-list { display:grid; gap:7px; margin-top:18px; }.outage-notification-list > div { display:grid; gap:3px; padding:11px 12px; border-left:3px solid var(--spruce); background:#f7faf7; color:#4b5a50; font-size:11px; }.outage-notification-list b { color:var(--ink); }.outage-notification-list small { color:var(--muted); }@media (max-width:700px){.outage-notification-grid{grid-template-columns:1fr}}[data-theme="dark"] .outage-notification-grid label{color:var(--ink)}[data-theme="dark"] .outage-notification-grid input,[data-theme="dark"] .outage-notification-grid select,[data-theme="dark"] .outage-notification-grid textarea{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .outage-notification-list > div{background:var(--surface-2)}
.rule-number { flex:0 0 58px; color:#a0aaa2; font:700 9px Inter, sans-serif; letter-spacing:.4px; }.rule-copy { flex:1; min-width:0; }.rule-copy b,.rule-copy small,.rule-copy em { display:block; }.rule-copy small { color:#8d9990; font-size:9px; margin-top:3px; }.rule-copy em { color:#52665b; font-size:10px; font-style:normal; line-height:1.35; margin-top:5px; }.rule-row { align-items:flex-start; }.rule-row .rule-icon { margin-top:1px; }
.ticket-detail-backdrop { left:252px; }
@media (max-width:1050px) and (min-width:701px) {.ticket-detail-backdrop { left:220px; }}
@media (max-width:700px) {.sidebar { position:fixed; height:auto; align-self:auto; }.ticket-detail-backdrop { left:0; }}
.side-toolbar { position:fixed; right:18px; bottom:22px; z-index:25; display:flex; flex-direction:column; gap:10px; }
.side-tool-button { display:flex; flex-direction:column; align-items:center; gap:4px; width:58px; padding:12px 6px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink-2); box-shadow:0 10px 24px rgba(44,57,51,.12); }
.side-tool-button:hover { border-color:var(--spruce); color:var(--spruce-dark); }
.side-tool-icon { position:relative; font-size:19px; }
.side-tool-label { font-size:9px; font-weight:700; letter-spacing:.3px; }
.side-tool-dot { position:absolute; top:-3px; right:-6px; width:8px; height:8px; border-radius:50%; background:#5e9c65; box-shadow:0 0 0 2px var(--surface); }
.side-tool-dot.has-issue { background:var(--terra); }
.side-panel-backdrop { position:fixed; inset:0; z-index:30; display:none; background:rgba(39,51,47,.28); }
.side-panel-backdrop.open { display:block; animation:fadeUp .2s ease both; }
.side-panel { position:absolute; top:0; right:0; bottom:0; width:min(380px,100%); display:flex; flex-direction:column; background:var(--surface); box-shadow:-14px 0 35px rgba(39,51,47,.18); }
.side-panel-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:20px; border-bottom:1px solid var(--line); }
.side-panel-title { display:flex; gap:11px; align-items:flex-start; }
.side-panel-icon { display:grid; place-items:center; flex:0 0 auto; width:34px; height:34px; border-radius:8px; font-size:16px; }
.side-panel-header strong { display:block; font:700 15px Inter, sans-serif; }
.side-panel-header small { display:block; color:var(--muted); font-size:11px; margin-top:3px; }
.side-panel-close { background:none; color:#8d9790; font-size:20px; line-height:1; }
.ai-chat-messages { flex:1; overflow-y:auto; padding:18px 20px; display:flex; flex-direction:column; gap:12px; }
.ai-chat-message { display:flex; gap:9px; align-items:flex-start; }
.ai-chat-message.user { flex-direction:row-reverse; }
.ai-chat-avatar { display:grid; place-items:center; flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--spruce-pale); color:var(--spruce-dark); font-size:9px; font-weight:700; }
.ai-chat-message.user .ai-chat-avatar { background:var(--spruce-pale); color:var(--spruce-dark); }
.ai-chat-bubble { max-width:78%; padding:10px 12px; border-radius:10px; background:#f1f3ee; color:#354039; font-size:12.5px; line-height:1.5; }
.ai-chat-message.user .ai-chat-bubble { background:var(--spruce); color:#fff; }
.ai-chat-composer { display:flex; gap:8px; padding:14px 16px; border-top:1px solid var(--line); }
.ai-chat-composer input { flex:1; min-width:0; padding:10px 12px; border:1px solid var(--line); border-radius:6px; outline:none; }
.ai-chat-composer input:focus { border-color:var(--spruce); }
.ai-chat-composer button { padding:10px 15px; border-radius:6px; background:var(--spruce); color:#fff; font-weight:700; font-size:12px; }
.ai-chat-composer button:hover { background:var(--spruce-dark); }
.clipboard-history { flex:1; overflow-y:auto; padding:14px; display:grid; align-content:start; gap:8px; }.clipboard-history-item { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:start; width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink-2); text-align:left; }.clipboard-history-item:hover { border-color:var(--accent-border); background:var(--accent-hover); }.clipboard-history-copy { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:3; font-size:12px; line-height:1.45; white-space:pre-wrap; }.clipboard-history-item small { color:#8a968d; font-size:10px; white-space:nowrap; }.clipboard-empty { display:grid; gap:5px; padding:28px 16px; color:#839087; text-align:center; }.clipboard-empty b { color:var(--ink-2); font-size:12px; }.clipboard-empty span { font-size:11px; line-height:1.45; }.clipboard-panel-footer { padding:14px 20px; border-top:1px solid var(--line); }.clipboard-panel-footer button { width:100%; padding:10px; border:1px solid #d6e0d7; border-radius:6px; background:none; color:#637066; font-size:12px; font-weight:700; }.clipboard-panel-footer button:hover { border-color:#b8cbbb; color:var(--spruce-dark); }[data-theme="dark"] .clipboard-history-item { border-color:var(--line); background:var(--surface); color:var(--ink); }[data-theme="dark"] .clipboard-history-item:hover { background:var(--hover-bg); }[data-theme="dark"] .clipboard-empty b { color:var(--ink); }
.clipboard-tool-menu { position:relative; }.clipboard-compact-panel { position:absolute; right:0; bottom:calc(100% + 8px); z-index:40; display:none; width:340px; max-height:420px; overflow-y:auto; padding:7px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 14px 30px rgba(39,51,47,.18); }.clipboard-tool-menu.open .clipboard-compact-panel { display:block; }.clipboard-compact-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:5px 5px 8px; border-bottom:1px solid #e5ece5; color:var(--ink-2); font-size:11px; font-weight:800; text-transform:uppercase; }.clipboard-compact-heading button { padding:4px 5px; background:none; color:var(--terra); font-size:10px; font-weight:700; }.clipboard-compact-item { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:start; padding:9px 5px; border-bottom:1px solid #edf1ed; }.clipboard-compact-item:last-child { border-bottom:0; }.clipboard-compact-copy { overflow-wrap:anywhere; color:var(--ink-2); font-size:11px; line-height:1.45; white-space:pre-wrap; }.clipboard-compact-item button { align-self:center; padding:5px 7px; border:1px solid #cbd9d2; border-radius:4px; background:#fff; color:var(--spruce-dark); font-size:10px; font-weight:700; }.clipboard-compact-item button:hover { border-color:var(--accent-border); background:var(--accent-hover); }.clipboard-compact-empty { margin:0; padding:18px 8px; color:#839087; font-size:11px; text-align:center; }[data-theme="dark"] .clipboard-compact-panel { border-color:var(--line); background:var(--surface); }.clipboard-compact-copy { color:var(--ink); }[data-theme="dark"] .clipboard-compact-heading { border-color:var(--line); }[data-theme="dark"] .clipboard-compact-item { border-color:var(--line); }[data-theme="dark"] .clipboard-compact-item button { border-color:var(--line); background:var(--surface); color:var(--spruce-dark); }
.clipboard-compact-notice { margin:7px 3px 2px; padding-top:8px; border-top:1px solid #e5ece5; color:#839087; font-size:10px; line-height:1.4; }[data-theme="dark"] .clipboard-compact-notice { border-color:var(--line); color:var(--muted); }
.status-list { flex:1; overflow-y:auto; padding:8px 20px; }
.status-row { display:flex; align-items:center; gap:10px; padding:13px 0; border-top:1px solid var(--line); }
.status-row:first-child { border-top:0; }
.status-indicator { flex:0 0 auto; width:9px; height:9px; border-radius:50%; background:#5e9c65; box-shadow:0 0 0 3px #cae4cf; }
.status-indicator.issue { background:var(--terra); box-shadow:0 0 0 3px var(--terra-pale); }
.status-indicator.checking { background:#c8ccc4; box-shadow:0 0 0 3px #eceeea; animation:statusPulse 1.1s ease-in-out infinite; }
@keyframes statusPulse { 50% { opacity:.4; } }
.status-row-body { flex:1; min-width:0; }
.status-row-body a { color:var(--ink); font-weight:700; font-size:12.5px; text-decoration:none; }
.status-row-body a:hover { color:var(--spruce-dark); text-decoration:underline; }
.status-row-note { display:block; color:#96a099; font-size:10px; margin-top:2px; }
.status-row-state { flex:0 0 auto; font-size:11px; font-weight:700; color:#4c8b67; }
.status-row-state.issue { color:var(--terra); }
.status-row-state.checking { color:#96a099; font-weight:500; }
.status-refresh-button { margin:10px 20px 18px; padding:11px; border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink-2); font-size:12px; font-weight:700; }
.status-refresh-button:hover { border-color:var(--spruce); color:var(--spruce-dark); }
@media (max-width:700px) { .side-toolbar { right:10px; bottom:14px; gap:8px; } .side-tool-button { width:50px; padding:9px 4px; } }
.ticket-page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:10px; }.ticket-page-heading h1 { font:700 28px Inter, sans-serif; letter-spacing:-1px; margin:5px 0 0; cursor:pointer; }.ticket-page-heading h1:hover { color:var(--spruce-dark); }.ticket-title-line { display:flex; align-items:center; gap:12px; }.title-menu,.title-more { background:none; color:#68746d; font-size:18px; }.title-more { letter-spacing:2px; font-size:14px; color:#879189; }.ticket-page-actions { display:flex; align-items:center; gap:7px; }.square-action,.help-action { width:34px; height:34px; display:grid; place-items:center; border:1px solid #dfe2dc; border-radius:5px; background:var(--surface); color:#4d70df; font-size:23px; }.help-action { color:#4d70df; font-weight:700; font-size:16px; }.action-menu { height:34px; padding:0 12px; border:1px solid #dfe2dc; border-radius:5px; background:var(--surface); color:#4d70df; font-size:12px; }.action-menu span { color:#a6aaa7; padding-left:8px; }.ticket-search { width:0; overflow:hidden; opacity:0; display:flex; align-items:center; gap:7px; height:34px; padding:0; border:1px solid transparent; border-radius:5px; background:var(--surface); transition:.2s; }.ticket-search.focused,.ticket-search:focus-within { width:220px; opacity:1; padding:0 10px; border-color:#dfe2dc; }.search-glyph { color:#4d70df; font-size:21px; }.ticket-search input { width:100%; min-width:0; border:0; outline:0; background:none; color:var(--ink); font-size:11px; }.search-spinner { display:none; width:13px; height:13px; border:2px solid #d8e0f9; border-top-color:#4d70df; border-radius:50%; }.search-spinner.loading { display:block; animation:spin .7s linear infinite; } @keyframes spin { to { transform:rotate(360deg); } }.ticket-meta-row { display:flex; align-items:center; gap:8px; color:#9aa39b; font-size:11px; margin:0 0 17px; }.edit-view-button { padding:0; color:#4d70df; background:none; font-size:11px; font-weight:700; letter-spacing:.5px; }.ticket-filters { display:grid; grid-template-columns:1.05fr 1fr 1.1fr 1.1fr 1fr 1.1fr .9fr 1.15fr; gap:10px; margin-bottom:14px; }.ticket-filters button { display:flex; justify-content:space-between; align-items:center; min-width:0; background:#f1f2f1; border-radius:7px; padding:12px 13px; text-align:left; color:#4d5651; font-size:12px; }.ticket-filters button span { color:#a5aca6; font-size:16px; }.ticket-panel { border-radius:0; box-shadow:none; background:transparent; border:0; overflow-x:auto; }.ticket-table-head,.ticket-row { min-width:1050px; grid-template-columns:1fr 1fr 1.15fr 1.25fr 30px 2.6fr .9fr 1.1fr 1.1fr; }.ticket-table-head { background:transparent; border-top:2px solid #dfe1de; border-bottom:2px solid #dfe1de; padding:13px 14px; color:#4e5651; letter-spacing:.4px; }.ticket-row { padding:20px 14px; background:var(--surface); border-bottom:1px solid #dfe1de; }.ticket-row:hover { background:var(--surface); }.ticket-number { color:#4e5752; font-size:12px; }.sla-count,.next-breach,.table-muted { color:#616c64; font-size:12px; }.sla-count.breached,.breached-text { color:var(--terra); font-weight:700; }.visibility-heading,.visibility-icon { color:#9aa19d; text-align:center; }.ticket-requester { display:block; color:#858e87; font-size:11px; margin-top:5px; font-weight:400; }.ticket-title { color:#4d70df; font-weight:500; font-size:13px; margin:0; }.status { white-space:nowrap; background:#e4e9ec; border-radius:14px; padding:7px 11px; width:max-content; }.status.pending { background:#fbefc5; color:#88742e; }.status:before { display:none; }

/* ---------- Dark theme ---------- */
:root[data-theme="dark"] { --hover-bg:#26332a; --hover-bg-subtle:#232d23; --paper:#141713; --surface:var(--surface); --line:#3d4639; --ink:#f4f7f1; --muted:#c2cbbf; --spruce:#6fb692; --spruce-dark:#b7e7c9; --spruce-pale:#243a30; --saffron:#e8c164; --saffron-pale:#3c331d; --terra:#e2907a; --terra-pale:#3d2820; --shadow:0 12px 35px rgba(0,0,0,.45); }
[data-theme="dark"] body { background:var(--paper); color:var(--ink); }
[data-theme="dark"] .sidebar { background:#181b16; border-right-color:var(--line); }
[data-theme="dark"] .topbar { background:rgba(20,23,19,.9); border-bottom-color:var(--line); }
[data-theme="dark"] .workspace-switcher,[data-theme="dark"] .workspace-menu,[data-theme="dark"] .knowledge-search { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .health-card { background:#22301f; border-color:#324a2c; }
[data-theme="dark"] .nav-item:hover,[data-theme="dark"] .nav-item.active { background:var(--hover-bg); }
[data-theme="dark"] .theme-toggle { color:#e8c164; }
[data-theme="dark"] .icon-button,[data-theme="dark"] .quiet-button,[data-theme="dark"] .outline-button,[data-theme="dark"] .square-action,[data-theme="dark"] .help-action,[data-theme="dark"] .action-menu,[data-theme="dark"] .columns-button { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .filter-select,[data-theme="dark"] .custom-select-trigger,[data-theme="dark"] .view-size-control select { background:var(--surface-2); color:var(--ink); }
[data-theme="dark"] .custom-select-menu,[data-theme="dark"] .custom-select-option,[data-theme="dark"] .state-dropdown-menu,[data-theme="dark"] .state-dropdown-option,[data-theme="dark"] .state-dropdown-trigger { background:var(--surface); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .custom-select-option:hover,[data-theme="dark"] .state-dropdown-option:hover { background:var(--hover-bg); }
[data-theme="dark"] .ticket-table-head { background:var(--surface); color:var(--muted); }
[data-theme="dark"] .ticket-row:hover { background:#20251d; }
[data-theme="dark"] .modal-backdrop,[data-theme="dark"] .global-search-panel { background:rgba(0,0,0,.55); }
[data-theme="dark"] .modal,[data-theme="dark"] .global-search-box,[data-theme="dark"] .global-search-results { background:var(--surface); color:var(--ink); }
[data-theme="dark"] .modal input,[data-theme="dark"] .modal select,[data-theme="dark"] .modal textarea,[data-theme="dark"] .modal option { background:var(--surface-2); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .ticket-detail-backdrop,[data-theme="dark"] .ticket-detail { background:#151813; color:var(--ink); }
[data-theme="dark"] .detail-grid label > input,[data-theme="dark"] .detail-grid label > select,[data-theme="dark"] .detail-grid label > textarea,[data-theme="dark"] .detail-grid option { background:var(--surface); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .detail-side-card,[data-theme="dark"] .composer-card,[data-theme="dark"] .related-ticket,[data-theme="dark"] .editor-toolbar,[data-theme="dark"] .composer-footer { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .comment-editor { color:var(--ink); }
[data-theme="dark"] .audit-event-detail { background:var(--surface); color:var(--muted); }
[data-theme="dark"] .article-card,[data-theme="dark"] .settings-group,[data-theme="dark"] .rule-builder,[data-theme="dark"] .rule-list,[data-theme="dark"] .empty-state { background:var(--surface); }
[data-theme="dark"] .switch { background:#333a30; } [data-theme="dark"] .switch i { background:#e9ece5; }
[data-theme="dark"] .side-panel,[data-theme="dark"] .ai-chat-bubble { background:var(--surface); color:var(--ink); }
[data-theme="dark"] .ai-chat-bubble { background:var(--surface-2); }
[data-theme="dark"] .ai-chat-composer input { background:var(--surface); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .toast { background:var(--surface); color:var(--ink); }

/* ---------- Ticketing-standard typography (ServiceNow/Zendesk-style legibility) ---------- */
:root { --font-ui: 'Inter', Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; }
body { font-family:var(--font-ui) !important; font-size:14px !important; line-height:1.5 !important; -webkit-font-smoothing:antialiased; }
.ticket-table-head { font-size:12px !important; font-weight:700 !important; letter-spacing:.4px !important; }
.ticket-row { font-size:13px !important; line-height:1.5 !important; }
.ticket-title,.ticket-title-cell .ticket-title { font-size:14px !important; font-weight:700 !important; line-height:1.4 !important; }
.ticket-requester,.ticket-title-cell .ticket-requester { font-size:12.5px !important; }
.ticket-number,.sla-count,.next-breach,.table-muted,.requester-cell,.timestamp-cell { font-size:13px !important; }
.pill { font-size:11px !important; padding:5px 9px !important; }
.status { font-size:12px !important; }
.ticket-meta-row,.ticket-filters .filter-select,.ticket-filters .custom-select-trigger,.action-menu,.help-action,.columns-button,.view-size-control { font-size:12.5px !important; }
.ticket-page-heading h1,.ticket-detail h1 { letter-spacing:-.6px !important; }
.detail-grid label { font-size:13px !important; }
.detail-grid label > input,.detail-grid label > select,.detail-grid label > textarea { font-size:14px !important; line-height:1.5 !important; }
.comment-editor,.comment-item p,.comment-item small { font-size:14px !important; line-height:1.55 !important; }
.audit-event-content p { font-size:13px !important; line-height:1.55 !important; }
.article-card h3 { font-size:15px !important; } .article-card p { font-size:12.5px !important; line-height:1.55 !important; }
@media (max-width:700px) { .ticket-row { font-size:13px !important; } }

/* ---------- Tickets: tab bar + Service Catalog builder ---------- */
.ticket-view-tabs { display:flex; gap:4px; margin:2px 0 16px; border-bottom:1px solid var(--line); }
.ticket-view-tab { padding:10px 4px; margin-right:22px; background:none; color:#89938b; font-size:13px; font-weight:600; border-bottom:2px solid transparent; }
.ticket-view-tab:hover { color:var(--spruce-dark); }
.ticket-view-tab.active { color:var(--spruce-dark); border-color:var(--spruce); font-weight:700; }
.ticket-tab-panel { display:none; }
.ticket-tab-panel.active-ticket-tab { display:block; }
.catalog-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:18px; }
.catalog-heading h2 { font:700 20px Inter, sans-serif; margin:0 0 6px; }
.catalog-heading p { margin:0; color:var(--muted); font-size:12.5px; }
.catalog-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.catalog-card { display:flex; flex-direction:column; }
.catalog-card h3 { display:flex; align-items:center; gap:8px; }
.catalog-card-fields { margin:0 0 16px; color:var(--muted); font-size:11px; }
.catalog-card-actions { display:flex; gap:14px; margin-top:auto; }
.catalog-card-actions button { background:none; color:var(--spruce); font-size:11.5px; font-weight:700; }
.catalog-card-actions .delete-catalog-item { color:var(--terra); }
.catalog-card-actions button:hover { text-decoration:underline; }
.catalog-card { cursor:pointer; }.catalog-card:focus-visible { outline:3px solid var(--spruce); outline-offset:2px; }.catalog-request-modal { width:min(680px,calc(100vw - 40px)); max-height:calc(100vh - 32px); overflow-y:auto; }.catalog-request-modal > p { margin:0 0 18px; color:var(--muted); font-size:13px; line-height:1.5; }.catalog-request-fields { display:grid; gap:14px; margin:18px 0; }.catalog-request-fields label { display:grid; gap:6px; color:var(--ink-2); font-size:12px; font-weight:700; }.catalog-request-fields input,.catalog-request-fields select,.catalog-request-fields textarea { width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; font-size:13px; }.catalog-request-checkbox { display:flex !important; align-items:center; gap:8px !important; }.catalog-request-checkbox input { width:16px !important; height:16px; margin:0; accent-color:var(--spruce); }[data-theme="dark"] .catalog-request-fields input,[data-theme="dark"] .catalog-request-fields select,[data-theme="dark"] .catalog-request-fields textarea { background:var(--surface); border-color:var(--line); color:var(--ink); }
.catalog-modal { width:min(920px,calc(100vw - 40px)); max-width:none; max-height:calc(100vh - 32px); overflow-y:auto; }
.catalog-fields-builder { margin:20px 0 6px; }
.catalog-fields-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.catalog-fields-header span { color:var(--muted); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; }
.catalog-field-list { display:grid; gap:8px; max-height:none; overflow:visible; }
.catalog-field-row { display:flex; align-items:center; gap:7px; padding:9px; border:1px solid var(--line); border-radius:6px; background:var(--surface); }
.catalog-field-row input,.catalog-field-row select { padding:8px; border:1px solid var(--line); border-radius:4px; background:#fff; font-size:11.5px; }
.field-label-input { flex:1 1 145px; min-width:145px; }
.catalog-field-row .custom-select-wrapper { flex:0 1 160px; width:auto; min-width:130px; }
.catalog-field-row .field-type-select { width:100%; }
.catalog-field-row .custom-select-menu { top:calc(100% + 6px); bottom:auto; }
.catalog-modal:has(.catalog-field-row .custom-select-wrapper.open) { overflow-y:visible; }
.field-options-input { flex:1 1 145px; min-width:145px; }
.field-required-toggle { display:flex; align-items:center; gap:5px; flex:0 0 auto; color:var(--muted); font-size:11px; white-space:nowrap; }
.remove-field-button { flex:0 0 auto; width:27px; height:27px; border-radius:4px; background:var(--terra-pale); color:var(--terra); font-size:14px; }
.catalog-field-empty { color:var(--muted); font-size:11.5px; padding:6px 2px; }
@media (max-width:1300px) { .catalog-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:900px) { .catalog-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:700px) { .catalog-grid { grid-template-columns:1fr; } .catalog-field-row { flex-wrap:wrap; } }
[data-theme="dark"] .catalog-field-row { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .catalog-field-row input,[data-theme="dark"] .catalog-field-row select { background:var(--surface-2); color:var(--ink); border-color:var(--line); }

/* ---------- Service Catalog: screenshot-matched layout ---------- */
.catalog-heading { align-items:flex-start; }
.catalog-heading h2 { font:800 26px Inter, sans-serif; margin:6px 0 8px; letter-spacing:-.6px; }
.catalog-subtitle { margin:0; color:var(--muted); font-size:13px; max-width:640px; line-height:1.5; }
.catalog-search-panel { display:flex; flex-direction:column; gap:10px; margin-bottom:18px; }
.catalog-search-panel > label { color:var(--ink-2); font-size:12px; font-weight:700; }
.catalog-search-row { display:flex; gap:10px; }
.catalog-search-row input { flex:1; min-width:0; padding:12px 14px; border:1px solid var(--line); border-radius:6px; background:#fff; font-size:13px; outline:none; }
.catalog-search-row input:focus { border-color:var(--spruce); }
.catalog-search-row .save-button { flex:0 0 auto; padding:0 22px; }
.catalog-card { gap:2px; }
.catalog-card-icon { display:grid; place-items:center; width:34px; height:34px; margin-bottom:14px; border-radius:8px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:16px; font-weight:700; }
.catalog-card h3 { font:700 15px Inter, sans-serif; margin:0 0 6px; }
.catalog-card p { margin:0 0 16px; color:var(--muted); font-size:12px; line-height:1.5; }
.catalog-card-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; margin-bottom:12px; }
.catalog-tag { padding:4px 8px; border-radius:4px; background:#eef1ec; color:#57645c; font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; }
[data-theme="dark"] .catalog-search-row input { background:var(--surface); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .catalog-tag { background:var(--surface-2); color:var(--muted); }

/* ---------- Ticket detail: autosave status indicator ---------- */
.detail-save-status { display:flex; align-items:center; gap:7px; padding:9px 14px; border-radius:16px; background:var(--accent-hover); color:#3c7a56; font-size:12px; font-weight:600; white-space:nowrap; }
.detail-save-status:not(.saving) { display:none !important; }
.detail-save-status:before { content:""; width:7px; height:7px; border-radius:50%; background:#4c8b67; }
.detail-save-status.saving { background:#f8edcc; color:#8d6c22; }
.detail-save-status.saving:before { background:#dba744; animation:statusPulse 1s ease-in-out infinite; }
[data-theme="dark"] .detail-save-status { background:var(--surface); color:var(--spruce); }
[data-theme="dark"] .detail-save-status.saving { background:#3c331d; color:#e8c164; }

/* ---------- Ticket detail: three-dot actions dropdown ---------- */
.detail-more-menu { position:relative; }
.detail-more-dropdown { position:absolute; top:calc(100% + 6px); left:0; z-index:20; display:none; min-width:190px; padding:6px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 14px 30px rgba(39,51,47,.16); }
.detail-more-menu.open .detail-more-dropdown { display:block; }
.detail-more-dropdown button { display:block; width:100%; padding:10px 11px; border:0; border-radius:5px; background:none; color:var(--ink-2); font-size:13px; text-align:left; }
.detail-more-dropdown button:hover { background:var(--accent-hover); color:var(--spruce-dark); }
[data-theme="dark"] .detail-more-dropdown { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .detail-more-dropdown button { color:var(--ink); }
[data-theme="dark"] .detail-more-dropdown button:hover { background:var(--hover-bg); }

/* ---------- Merge ticket modal ---------- */
#mergeTicketModal { z-index:25; }
.merge-modal { max-width:min(820px,92vw); width:100%; max-height:88vh; overflow-y:auto; display:flex; flex-direction:column; }
#bulkUpdateModal { z-index:25; }
.bulk-update-modal { max-width:min(820px,92vw); width:100%; max-height:88vh; overflow-y:auto; display:flex; flex-direction:column; }
.bulk-update-field-row { display:flex; gap:12px; margin:6px 0 18px; }
.bulk-update-field-row label { flex:1; min-width:0; color:var(--muted); font-size:12px; font-weight:700; }
.bulk-update-field-row select { display:block; width:100%; margin-top:6px; padding:10px 11px; border:1px solid var(--line); border-radius:5px; background:#fff; color:var(--ink-2); font-size:13px; outline:none; }
.bulk-update-field-row select:focus { border-color:var(--spruce); }
[data-theme="dark"] .bulk-update-field-row select { background:var(--surface); color:var(--ink); border-color:var(--line); }
.merge-modal h2 { display:flex; align-items:center; gap:6px; }
.merge-modal h2 span { color:var(--spruce); }
.merge-search { display:flex; align-items:center; gap:8px; margin:18px 0 12px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--surface); }
.merge-search .search-glyph { color:var(--spruce); font-size:18px; }
.merge-search input { flex:1; min-width:0; border:0; outline:0; background:none; font-size:13px; }
.merge-ticket-list { display:grid; grid-template-columns:repeat(2,1fr); align-content:start; gap:8px; max-height:min(56vh,620px); overflow-y:auto; margin-bottom:18px; }
@media (max-width:800px) { .merge-ticket-list { grid-template-columns:1fr; } }
.merge-ticket-row { display:flex; align-items:center; gap:11px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; cursor:pointer; }
.merge-ticket-row:hover { border-color:var(--spruce); }
.merge-ticket-row.selected { border-color:var(--spruce); background:var(--spruce-pale); }
.merge-ticket-row input[type="checkbox"] { width:16px; height:16px; accent-color:var(--spruce); flex:0 0 auto; }
.merge-ticket-row-body { flex:1; min-width:0; }
.merge-ticket-row-body b { display:block; font-size:12.5px; color:var(--ink); }
.merge-ticket-row-body small { display:block; color:var(--muted); font-size:11px; margin-top:2px; }
.merge-ticket-empty { grid-column:1 / -1; padding:20px; color:var(--muted); font-size:12px; text-align:center; }
.merge-group-label { grid-column:1 / -1; margin:4px 0 2px; color:var(--muted); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; }
.merge-recommended-tag { display:inline-block; margin-left:7px; padding:2px 7px; border-radius:10px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; vertical-align:middle; }
[data-theme="dark"] .merge-recommended-tag { background:var(--spruce-pale); color:var(--spruce); }
[data-theme="dark"] .merge-search { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .merge-ticket-row { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .merge-ticket-row.selected { background:var(--spruce-pale); }

/* ---------- Ticket history tab: all tickets from the same requester ---------- */
.requester-history-panel { display:none; margin-top:24px; }
.requester-details-panel { display:none; margin-top:24px; }.requester-details-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:20px; }.requester-details-grid article { padding:14px; border:1px solid #e1e5e8; border-radius:6px; background:#fbfcfc; }.requester-details-grid span,.requester-details-grid strong { display:block; }.requester-details-grid span { color:#8a9590; font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.requester-details-grid strong { margin-top:6px; color:#34404c; font-size:13px; }.requester-details-grid article:last-child { grid-column:span 2; }[data-theme="dark"] .requester-details-grid article { border-color:var(--line); background:var(--surface); }.requester-details-grid strong { color:var(--ink); }@media (max-width:700px){.requester-details-grid{grid-template-columns:1fr}.requester-details-grid article:last-child{grid-column:auto}}
.requester-history-search { display:flex; align-items:center; gap:8px; margin-top:20px; padding:11px 14px; border:1px solid #e1e5e8; border-radius:6px; background:#fbfcfc; }
.requester-history-search .search-glyph { color:#4d70df; font-size:19px; }
.requester-history-search input { flex:1; min-width:0; border:0; outline:0; background:none; color:#27333f; font-size:13px; }
.requester-history-list { display:grid; gap:8px; margin-top:15px; }
.requester-history-row { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding:13px 14px; border:1px solid #e1e5e8; border-radius:6px; background:#fff; text-align:left; }
.requester-history-row:hover { border-color:#c7d0d6; }
.requester-history-row.current { border-color:#4d70df; background:#f3f6ff; }
.requester-history-body b { display:block; color:#34404c; font-size:12.5px; font-weight:600; }
.requester-history-body small { display:block; color:#98a1a8; font-size:11px; margin-top:3px; }
[data-theme="dark"] .requester-history-row { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .requester-history-row.current { background:var(--spruce-pale); border-color:var(--spruce); }
[data-theme="dark"] .requester-history-body b { color:var(--ink); }
[data-theme="dark"] .requester-history-search { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .requester-history-search input { color:var(--ink); }

/* ---------- Control system refresh ---------- */
:root { --control-border:#cfd8d1; --control-hover:#b4c4b9; --control-focus:rgba(53,107,93,.18); }
.create-button,.save-button {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:38px;
	border:1px solid var(--spruce-dark);
	border-radius:6px;
	box-shadow:0 2px 0 rgba(20,54,45,.2), 0 6px 14px rgba(53,107,93,.16);
	letter-spacing:.01em;
	transition:transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.create-button:hover,.save-button:hover { transform:translateY(-1px); box-shadow:0 3px 0 rgba(20,54,45,.2), 0 9px 18px rgba(53,107,93,.2); }
.create-button:active,.save-button:active { transform:translateY(1px); box-shadow:0 1px 0 rgba(20,54,45,.2); }
.quiet-button,.outline-button,.action-menu,.columns-button,.square-action,.help-action {
	min-height:34px;
	border-color:var(--control-border);
	border-radius:6px;
	box-shadow:0 1px 0 rgba(39,51,47,.04);
	font-weight:600;
	transition:border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease;
}
.quiet-button:hover,.outline-button:hover,.action-menu:hover,.columns-button:hover,.square-action:hover,.help-action:hover {
	border-color:var(--control-hover);
	background:#f3f7f3;
	color:var(--spruce-dark);
}
.quiet-button:active,.outline-button:active,.action-menu:active,.columns-button:active,.square-action:active,.help-action:active { transform:translateY(1px); }
.workspace-switcher { border-color:var(--control-border); border-radius:6px; box-shadow:0 1px 0 rgba(39,51,47,.04); transition:border-color .16s ease, box-shadow .16s ease; }
.workspace-switcher:hover { border-color:var(--control-hover); box-shadow:0 5px 14px rgba(39,51,47,.08); }

select,
.custom-select-trigger,
.state-dropdown-trigger,
.ticket-filters .filter-select {
	border-color:var(--control-border);
	border-radius:6px;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
select { min-height:38px; padding-top:8px; padding-bottom:8px; }
select:hover,.custom-select-trigger:hover,.state-dropdown-trigger:hover,.ticket-filters .filter-select:hover { border-color:var(--control-hover); }
select:focus-visible,.custom-select-trigger:focus-visible,.state-dropdown-trigger:focus-visible,
.create-button:focus-visible,.save-button:focus-visible,.quiet-button:focus-visible,.outline-button:focus-visible,
.action-menu:focus-visible,.columns-button:focus-visible,.square-action:focus-visible,.workspace-switcher:focus-visible {
	outline:0;
	border-color:var(--spruce);
	box-shadow:0 0 0 3px var(--control-focus);
}
.ticket-filters .custom-select-trigger { border:1px solid #dde4de; background:#f4f6f3; font-weight:600; }
.ticket-filters .custom-select-wrapper.open .custom-select-trigger { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
.custom-select-menu,.state-dropdown-menu,.action-menu-dropdown,.columns-menu,.detail-more-dropdown,.range-menu {
	padding:6px;
	border-color:var(--line-strong);
	border-radius:7px;
	box-shadow:0 14px 28px rgba(33,48,40,.16), 0 2px 6px rgba(33,48,40,.08);
}
.custom-select-option,.state-dropdown-option,.action-menu-dropdown button,.detail-more-dropdown button,.range-option {
	min-height:34px;
	border-radius:5px;
	font-weight:500;
}
.custom-select-option:hover,.custom-select-option:focus,.state-dropdown-option:hover,.state-dropdown-option:focus,
.action-menu-dropdown button:hover,.detail-more-dropdown button:hover,.range-option:hover { background:var(--spruce-pale); color:var(--spruce-dark); }
.custom-select-option.is-selected,.range-option.active { background:var(--spruce-pale); color:var(--spruce-dark); font-weight:700; }
.custom-select-option.is-selected .dropdown-check { border-color:var(--spruce-dark); background:var(--spruce-dark); }

[data-theme="dark"] { --control-border:var(--ink-2); --control-hover:#6a7d6e; --control-focus:rgba(111,182,146,.23); }
[data-theme="dark"] .quiet-button:hover,[data-theme="dark"] .outline-button:hover,[data-theme="dark"] .action-menu:hover,[data-theme="dark"] .columns-button:hover,[data-theme="dark"] .square-action:hover,[data-theme="dark"] .help-action:hover { background:#283128; }
[data-theme="dark"] .ticket-filters .custom-select-trigger { border-color:var(--ink-2); background:#242c23; }

/* ---------- Tasks tab: create and track follow-up tasks for teammates ---------- */
.tasks-panel { display:none; margin-top:24px; }
.task-composer { display:grid; gap:12px; margin-top:20px; padding:16px; border:1px solid #e1e5e8; border-radius:8px; background:#fbfcfc; }
.task-description-label { color:#68727d; font-size:12px; font-weight:700; }
.task-composer textarea { width:100%; padding:11px 12px; border:1px solid #dfe3e7; border-radius:5px; outline:none; resize:vertical; font:inherit; color:#27333f; }
.task-composer textarea:focus { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; }
.task-composer-row { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; }
.task-composer-row label { display:block; flex:1; min-width:160px; color:#68727d; font-size:12px; }
.task-composer-row select,.task-composer-row input[type="date"] { display:block; width:100%; margin-top:6px; padding:9px 10px; border:1px solid #dfe3e7; border-radius:5px; outline:none; color:#27333f; font-size:13px; }
.task-composer-row .save-button { flex:0 0 auto; }
.task-list { display:grid; gap:8px; margin-top:16px; }
.task-row { display:flex; align-items:center; gap:12px; padding:13px 14px; border:1px solid #e1e5e8; border-radius:6px; background:#fff; }
.task-row.done { background:#f7f9f8; }
.task-check { flex:0 0 auto; width:22px; height:22px; border:1px solid #c9d2cc; border-radius:5px; background:#fff; color:#fff; font-size:13px; display:grid; place-items:center; }
.task-row.done .task-check { background:var(--spruce); border-color:var(--spruce); }
.task-row-body { flex:1; min-width:0; }
.task-row-body p { margin:0 0 4px; color:#27333f; font-size:13px; }
.task-row.done .task-row-body p { color:#8a958d; text-decoration:line-through; }
.task-row-body small { color:#8b968d; font-size:11px; }
.task-overdue { color:var(--terra); font-weight:700; }
.task-row-status { flex:0 0 auto; padding:5px 9px; border-radius:12px; background:var(--saffron-pale); color:#8d6c22; font-size:10px; font-weight:700; }
.task-row-status.done { background:var(--spruce-pale); color:var(--spruce-dark); }
.task-remove { flex:0 0 auto; background:none; color:#a7afb5; font-size:17px; }
.task-remove:hover { color:var(--terra); }
[data-theme="dark"] .task-composer { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .task-description-label { color:var(--ink); }
[data-theme="dark"] .task-composer textarea,[data-theme="dark"] .task-composer-row select,[data-theme="dark"] .task-composer-row input[type="date"] { background:var(--surface-2); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .task-row { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .task-row.done { background:#1b1f19; }
[data-theme="dark"] .task-row-body p { color:var(--ink); }
[data-theme="dark"] .task-check { background:var(--surface); border-color:var(--line); }

/* ---------- Ticket Actions dropdown: Update / Resolve / Export to Excel ---------- */
.action-menu-wrapper { position:relative; }
.action-menu-dropdown { position:absolute; top:calc(100% + 7px); left:0; z-index:20; display:none; min-width:180px; padding:6px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 14px 30px rgba(39,51,47,.16); }
.action-menu-wrapper.open .action-menu-dropdown { display:block; }
.action-menu-dropdown button { display:block; width:100%; padding:10px 11px; border:0; border-radius:5px; background:none; color:var(--ink-2); font-size:12.5px; text-align:left; }
.action-menu-dropdown button:hover { background:var(--accent-hover); color:var(--spruce-dark); }
[data-theme="dark"] .action-menu-dropdown { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .action-menu-dropdown button { color:var(--ink); }
[data-theme="dark"] .action-menu-dropdown button:hover { background:var(--hover-bg); }

/* ---------- Settings: Groups management (CRUD, membership, notifications) ---------- */
.groups-panel { margin-top:8px; }
.groups-panel .back-to-tickets { margin-bottom:20px; }
.account-settings-panel { margin-top:8px; }
.account-settings-panel .back-to-tickets { margin-bottom:20px; }
.account-settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; max-width:980px; }
.user-settings-panel { margin-top:8px; max-width:980px; }.user-settings-panel .back-to-tickets { margin-bottom:20px; }.user-settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:16px; }.user-settings-card { display:grid; gap:13px; min-width:0; }.user-settings-card .panel-heading { margin-bottom:0; }.user-settings-card label { display:grid; gap:6px; color:var(--ink-2); font-size:12px; font-weight:700; }.user-settings-card textarea,.user-settings-card input[type="date"] { width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; font-size:12px; resize:vertical; }.user-setting-toggle { display:flex !important; align-items:center; gap:8px !important; }.user-setting-toggle input { width:15px; height:15px; margin:0; accent-color:var(--spruce); }@media (max-width:800px){.user-settings-grid{grid-template-columns:1fr}}[data-theme="dark"] .user-settings-card textarea,[data-theme="dark"] .user-settings-card input[type="date"]{background:var(--surface);border-color:var(--line);color:var(--ink)}
.users-settings-panel { margin-top:8px; }
.users-settings-panel .back-to-tickets { margin-bottom:20px; }
.user-directory-panel { max-width:980px; }
.requester-directory-panel { max-width:980px; margin-top:16px; }
.login-history-settings-panel { margin-top:8px; }
.login-history-settings-panel .back-to-tickets { margin-bottom:20px; }
.login-history-directory-panel { max-width:1180px; }
.login-history-search { display:flex; align-items:center; gap:8px; width:min(330px,100%); padding:8px 10px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--spruce); }
.login-history-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--ink); font-size:12px; }
.login-history-empty { padding:26px !important; color:var(--muted) !important; text-align:center; }
.user-directory-actions { display:flex; align-items:center; gap:8px; }
.user-directory-actions .action-menu-dropdown { right:0; left:auto; }
.tableWrap td:has(.directory-row-edit) { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.directory-row-edit { flex:0 0 auto; padding:5px 8px; border:1px solid #cbd8cf; border-radius:5px; background:var(--surface); color:var(--spruce-dark); font-size:10px; font-weight:800; }
.directory-row-edit:hover { border-color:var(--spruce); background:var(--spruce-pale); }
.user-editor-modal { max-width:500px; }
.user-editor-modal > p { color:var(--muted); font-size:12px; }
.user-editor-modal label { display:block; margin-top:16px; color:var(--ink-2); font-size:12px; font-weight:700; }
.user-editor-modal input,.user-editor-modal select { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); outline:none; }
.user-editor-modal input:focus,.user-editor-modal select:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.user-editor-modal .save-button { margin-top:22px; }
.user-login-history { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.user-login-history > span { display:block; margin-bottom:8px; color:var(--ink-2); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.user-login-history > div { display:grid; gap:5px; }
.user-login-history > div > div { padding:8px 10px; border:1px solid #e5e9e4; border-radius:5px; background:var(--surface); color:#59665e; font-size:11px; line-height:1.45; }
.directory-ticket-history { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }.directory-ticket-history-heading { display:flex !important; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; }.directory-ticket-history-heading > span { color:var(--ink-2); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.directory-ticket-history-heading button { width:auto; padding:5px 8px; border:1px solid #cbd9d2; border-radius:4px; background:var(--surface); color:var(--spruce-dark); font-size:10px; font-weight:700; }.directory-ticket-history > div:last-child { display:grid; gap:6px; max-height:220px; overflow-y:auto; }.directory-ticket-history > div:last-child > button { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; padding:9px 10px; border:1px solid #e5e9e4; border-radius:5px; background:var(--surface); color:var(--ink-2); text-align:left; }.directory-ticket-history > div:last-child > button:hover { border-color:#b9cec0; background:var(--accent-hover); }.directory-ticket-history b,.directory-ticket-history small { display:block; }.directory-ticket-history b { font-size:11px; }.directory-ticket-history small { margin-top:3px; color:#8a9590; font-size:10px; }.directory-ticket-history em { flex:0 0 auto; color:var(--spruce-dark); font-size:10px; font-style:normal; font-weight:700; }.directory-ticket-history p { margin:0; padding:10px; color:var(--muted); font-size:11px; text-align:center; }[data-theme="dark"] .directory-ticket-history { border-color:var(--line); }[data-theme="dark"] .directory-ticket-history-heading > span { color:var(--ink); }[data-theme="dark"] .directory-ticket-history-heading button,[data-theme="dark"] .directory-ticket-history > div:last-child > button { border-color:var(--line); background:var(--surface); color:var(--ink); }
.user-role-badge { display:inline-flex; align-items:center; min-height:24px; padding:3px 8px; border-radius:12px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:10px; font-weight:800; }
.requester-access-badge { display:inline-flex; align-items:center; min-height:24px; padding:3px 8px; border-radius:12px; background:var(--saffron-pale); color:#8d6c22; font-size:10px; font-weight:800; }
.account-summary-card { display:flex; align-items:flex-start; gap:14px; padding:20px; }
.account-summary-card p { margin:0 0 6px; color:var(--muted); font-size:10.5px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; }
.account-summary-card h3 { margin:0 0 6px; color:var(--ink); font:700 17px Inter, sans-serif; }
.account-summary-card small { display:block; color:var(--muted); font-size:12px; line-height:1.5; }
.account-backup-card { grid-column:1 / -1; }
@media (max-width:800px){.account-settings-grid{grid-template-columns:1fr}.account-backup-card{grid-column:auto}}
[data-theme="dark"] .account-summary-card { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .user-role-badge { background:var(--spruce-pale); color:var(--spruce-dark); }
[data-theme="dark"] .requester-access-badge { background:#3c331d; color:#e8c164; }
[data-theme="dark"] .login-history-search { border-color:var(--line); background:var(--surface); }
[data-theme="dark"] .login-history-search input { color:var(--ink); }
[data-theme="dark"] .user-editor-modal input,[data-theme="dark"] .user-editor-modal select { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .user-editor-modal label { color:var(--ink); }
[data-theme="dark"] .user-login-history { border-color:var(--line); }
[data-theme="dark"] .user-login-history > span { color:var(--ink); }
[data-theme="dark"] .user-login-history > div > div { border-color:var(--line); background:var(--surface); color:var(--muted); }
[data-theme="dark"] .directory-row-edit { border-color:var(--ink-2); background:var(--surface); color:var(--spruce-dark); }
.organization-settings-panel { margin-top:8px; }
.service-domain-settings-panel { margin-top:8px; }.service-domain-settings-panel .back-to-tickets { margin-bottom:20px; }.service-domain-settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:1080px; }.service-domain-card { padding:20px; }.service-domain-composer { display:flex; gap:8px; margin-bottom:14px; }.service-domain-composer input { flex:1; min-width:0; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:12px; outline:none; }.service-domain-composer button { padding:10px 12px; border-radius:6px; background:var(--spruce); color:#fff; font-size:11px; font-weight:800; }.service-domain-list { display:grid; gap:6px; }.service-domain-row { display:flex; align-items:center; gap:7px; padding:9px 10px; border:1px solid #e2e8e2; border-radius:6px; background:var(--surface); color:var(--ink-2); font-size:12px; }.service-domain-row.active { border-color:var(--spruce); background:var(--spruce-pale); }.service-domain-select { flex:1; padding:0; background:none; color:inherit; font:inherit; font-weight:700; text-align:left; }.service-domain-row > span { flex:1; }.service-domain-edit,.request-type-edit { background:none; color:var(--spruce); font-size:11px; font-weight:700; }.service-domain-delete,.request-type-delete { background:none; color:var(--terra); font-size:11px; font-weight:700; }@media (max-width:800px){.service-domain-settings-grid{grid-template-columns:1fr}.service-domain-composer{flex-direction:column}.service-domain-composer button{width:100%}}[data-theme="dark"] .service-domain-composer input,[data-theme="dark"] .service-domain-row{background:var(--surface);border-color:var(--line);color:var(--ink)}
.organization-settings-panel .back-to-tickets { margin-bottom:20px; }
.sso-settings-panel { margin-top:8px; }
.sso-settings-panel .back-to-tickets { margin-bottom:20px; }
.roles-settings-panel { margin-top:8px; }
.roles-settings-panel .back-to-tickets { margin-bottom:20px; }
.email-settings-panel { margin-top:8px; }
.email-settings-panel .back-to-tickets { margin-bottom:20px; }
.email-settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:1180px; align-items:start; }
.email-settings-card { padding:20px; }
.email-identity-card { grid-column:1 / -1; }
.email-settings-card h3 { margin:0 0 14px; color:var(--ink); font:700 16px Inter, sans-serif; }
.email-settings-card p { margin:0 0 14px; color:var(--muted); font-size:12px; line-height:1.5; }
.email-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px; }
.email-form-grid label { display:block; color:var(--ink-2); font-size:11.5px; font-weight:800; }
.email-form-grid input,.email-form-grid select,.email-list-composer input { width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font-size:12.5px; outline:none; }
.email-form-grid input:focus,.email-form-grid select:focus,.email-list-composer input:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.email-list-composer { display:flex; gap:8px; margin-bottom:12px; }
.email-list-composer input { margin-top:0; }
.email-list-composer button { flex:0 0 auto; padding:10px 13px; border-radius:8px; background:var(--spruce); color:#fff; font-size:12px; font-weight:800; }
.email-rule-list { display:grid; gap:8px; }
.email-rule-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.email-rule-row span { color:var(--ink); font-size:12.5px; font-weight:700; }
.email-rule-row button { background:none; color:var(--terra); font-size:11.5px; font-weight:800; }
.email-rule-row button:hover { text-decoration:underline; }
@media (max-width:900px){.email-settings-grid,.email-form-grid{grid-template-columns:1fr}.email-identity-card{grid-column:auto}.email-list-composer{flex-direction:column}.email-list-composer button{width:100%;}}
[data-theme="dark"] .email-settings-card label { color:var(--ink); }
[data-theme="dark"] .email-form-grid input,[data-theme="dark"] .email-form-grid select,[data-theme="dark"] .email-list-composer input,[data-theme="dark"] .email-rule-row { background:var(--surface); border-color:var(--line); color:var(--ink); }
.roles-layout { display:grid; grid-template-columns:320px minmax(0,1fr); gap:16px; align-items:start; }
.role-list-panel,.permission-matrix-panel { padding:20px; }
.role-list { display:grid; gap:7px; margin-bottom:16px; }
.role-list-item { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; width:100%; padding:12px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); text-align:left; }
.role-list-item:hover,.role-list-item.active { border-color:var(--spruce); background:var(--spruce-pale); }
.role-list-item b,.role-list-item small { display:block; }
.role-list-item b { font-size:12.5px; }
.role-list-item small { margin-top:3px; color:var(--muted); font-size:11px; line-height:1.4; }
.role-list-item em { flex:0 0 auto; padding:4px 7px; border-radius:11px; background:var(--accent-hover); color:var(--spruce-dark); font-size:9px; font-style:normal; font-weight:800; text-transform:uppercase; }
.role-permission-actions { display:flex; align-items:center; gap:8px; }
.delete-role-button { min-height:38px; padding:0 12px; border:1px solid #e3b7aa; border-radius:6px; background:#fff; color:#a44a39; font-size:12px; font-weight:700; }
.delete-role-button:hover:not(:disabled) { border-color:var(--terra); background:var(--terra-pale); }
.delete-role-button:disabled { border-color:#e2e6e0; background:#f4f5f2; color:#a1aaa3; cursor:not-allowed; }
.role-create-box { display:grid; gap:8px; padding-top:14px; border-top:1px solid var(--line); }
.role-create-box input,.role-create-box textarea { width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font-size:12.5px; outline:none; }
.role-create-box button { padding:10px 13px; border-radius:8px; background:var(--spruce); color:#fff; font-size:12px; font-weight:800; }
.permission-matrix { overflow:auto; border:1px solid var(--line); border-radius:9px; }
.permission-row { display:grid; grid-template-columns:minmax(190px,1.3fr) repeat(4,minmax(95px,.55fr)); align-items:center; min-width:650px; border-top:1px solid var(--line); }
.permission-row:first-child { border-top:0; }
.permission-row > span:first-child { padding:12px 14px; color:var(--ink); font-size:12px; font-weight:800; }
.permission-header { background:#f7f8f3; }
.permission-header span { padding:11px 14px; color:#8b958d; font-size:10px; font-weight:900; letter-spacing:.5px; text-transform:uppercase; }
.permission-row label { display:flex; align-items:center; justify-content:center; gap:7px; min-height:43px; padding:10px; border-left:1px solid var(--line); color:var(--ink-2); font-size:11px; font-weight:800; text-transform:capitalize; }
.permission-row input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }
@media (max-width:1000px){.roles-layout{grid-template-columns:1fr}.permission-row{min-width:620px}}
[data-theme="dark"] .role-list-item,[data-theme="dark"] .role-create-box input,[data-theme="dark"] .role-create-box textarea,[data-theme="dark"] .permission-matrix { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .role-list-item:hover,[data-theme="dark"] .role-list-item.active { background:var(--spruce-pale); }
[data-theme="dark"] .delete-role-button { border-color:#744a40; background:#2a211e; color:#e2907a; }
[data-theme="dark"] .delete-role-button:disabled { border-color:#3e473e; background:var(--surface); color:#829083; }
[data-theme="dark"] .permission-header { background:var(--surface); }
[data-theme="dark"] .permission-header span { color:#d2dacd; }
[data-theme="dark"] .permission-row { border-top-color:var(--line); }
[data-theme="dark"] .permission-row label { border-left-color:var(--line); color:var(--ink); }
.sso-settings-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:16px; max-width:1180px; }
.sso-provider-card { padding:18px; cursor:pointer; transition:border-color .15s ease, transform .15s ease, background .15s ease; }
.sso-provider-card:hover,.sso-provider-card.active { border-color:var(--spruce); background:var(--spruce-pale); transform:translateY(-1px); }
.sso-provider-card h3 { margin:12px 0 7px; color:var(--ink); font:700 15px Inter, sans-serif; }
.sso-provider-card p { margin:0; color:var(--muted); font-size:12px; line-height:1.5; }
.sso-config-card { max-width:1180px; padding:20px; }
.sso-config-card h3 { margin:0 0 14px; color:var(--ink); font:700 16px Inter, sans-serif; }
.sso-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.sso-form-grid label { display:block; color:var(--ink-2); font-size:11.5px; font-weight:800; }
.sso-form-grid .sso-check-option { display:flex !important; flex-direction:row !important; align-items:center; gap:9px; padding:11px 12px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink-2); font-size:12.5px; font-weight:700; }
.sso-check-option input[type="checkbox"] { flex:0 0 auto; width:16px !important; height:16px; margin:0 !important; padding:0; accent-color:var(--spruce); }
.sso-check-option span { display:inline; flex:1; min-width:0; }
.sso-form-grid .fullWidth { grid-column:1 / -1; }
.sso-form-grid input,.sso-form-grid select { width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font-size:12.5px; outline:none; }
.sso-form-grid input:focus,.sso-form-grid select:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.sso-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }
.integration-connection-status { display:inline-flex; align-items:center; gap:6px; margin-right:auto; padding:7px 10px; border-radius:12px; background:var(--saffron-pale); color:#8d6c22; font-size:11px; font-weight:700; }
.integration-connection-status:before { content:""; width:6px; height:6px; border-radius:50%; background:var(--saffron); }
.integration-connection-status.connected { background:var(--spruce-pale); color:var(--spruce-dark); }
.integration-connection-status.connected:before { background:var(--spruce); }
.integration-domain-controller { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:11px 12px; border:1px solid #e4c983; border-radius:7px; background:#fff9ea; color:#80651f; font-size:12px; }
.integration-domain-controller span { font-weight:700; }
.integration-domain-controller strong { color:#8d6c22; font-size:12px; }
.integration-domain-controller.connected { border-color:#c5ddcc; background:var(--spruce-pale); color:var(--spruce-dark); }
.integration-domain-controller.connected strong { color:var(--spruce-dark); }
.directory-field-mappings { display:grid; grid-template-columns:1fr 1fr; gap:9px 14px; margin-top:6px; padding:16px; border:1px solid #e2e8e2; border-radius:7px; background:var(--surface); }
.directory-field-mappings > span { grid-column:1 / -1; color:var(--ink-2); font-size:12px; font-weight:800; }
.directory-field-mappings > p { grid-column:1 / -1; margin:-4px 0 3px; color:var(--muted); font-size:11px; }
.directory-field-mappings label { display:flex !important; align-items:center; justify-content:space-between; gap:10px; color:var(--ink-2) !important; font-size:11px !important; }
.directory-field-mappings label b { flex:1; }
.directory-field-mappings select { width:58%; margin:0 !important; padding:8px 10px !important; font-size:11px !important; }
@media (max-width:1050px){.sso-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.sso-form-grid{grid-template-columns:1fr}.sso-form-grid .fullWidth{grid-column:auto}}
@media (max-width:640px){.sso-settings-grid{grid-template-columns:1fr}.sso-actions{flex-direction:column}.sso-actions button{width:100%;}}
[data-theme="dark"] .sso-provider-card.active,[data-theme="dark"] .sso-provider-card:hover { background:var(--spruce-pale); border-color:var(--spruce); }
[data-theme="dark"] .sso-form-grid label { color:var(--ink); }
[data-theme="dark"] .sso-form-grid input,[data-theme="dark"] .sso-form-grid select { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .sso-form-grid .sso-check-option { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .integration-connection-status { background:#3c331d; color:#e8c164; }
[data-theme="dark"] .integration-connection-status.connected { background:var(--spruce-pale); color:var(--spruce-dark); }
[data-theme="dark"] .integration-domain-controller { border-color:#5e522d; background:#352f1d; color:#e8c164; }
[data-theme="dark"] .integration-domain-controller.connected { border-color:#35543f; background:var(--spruce-pale); color:var(--spruce-dark); }
[data-theme="dark"] .integration-domain-controller.connected strong { color:var(--spruce-dark); }
[data-theme="dark"] .directory-field-mappings { border-color:var(--line); background:var(--surface); }
[data-theme="dark"] .directory-field-mappings > span,[data-theme="dark"] .directory-field-mappings label { color:var(--ink) !important; }
.organization-settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:1180px; align-items:start; }
.organization-settings-card { padding:20px; }
.organization-timezone-card { grid-column:1 / -1; }
.organization-settings-card h3 { margin:0 0 14px; color:var(--ink); font:700 16px Inter, sans-serif; }
.organization-settings-card label { display:block; color:var(--ink-2); font-size:11.5px; font-weight:800; }
.organization-settings-card select,.organization-form-grid input { width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font-size:12.5px; outline:none; }
.organization-settings-card select:focus,.organization-form-grid input:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.organization-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.organization-form-grid button,.organization-timezone-card .save-button { padding:10px 13px; border-radius:8px; background:var(--spruce); color:#fff; font-size:12px; font-weight:800; }
.organization-list { display:grid; gap:8px; }
.organization-row { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:12px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.organization-row b { display:block; margin-bottom:3px; color:var(--ink); font-size:12.5px; }
.organization-row small { display:block; margin-top:2px; color:var(--muted); font-size:11px; line-height:1.4; }
.organization-row button { flex:0 0 auto; background:none; color:var(--terra); font-size:11.5px; font-weight:800; }
.organization-row button:hover { text-decoration:underline; }
@media (max-width:900px){.organization-settings-grid,.organization-form-grid{grid-template-columns:1fr}.organization-timezone-card{grid-column:auto}}
[data-theme="dark"] .organization-settings-card label { color:var(--ink); }
[data-theme="dark"] .organization-settings-card select,[data-theme="dark"] .organization-form-grid input,[data-theme="dark"] .organization-row { background:var(--surface); border-color:var(--line); color:var(--ink); }
.group-card { display:flex; flex-direction:column; }
.group-card h3 { font:700 15px Inter, sans-serif; margin:0 0 6px; }
.group-card p { margin:0 0 14px; color:var(--muted); font-size:12px; line-height:1.5; }
.group-card-meta { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }
.group-member-chip { padding:4px 8px; border-radius:12px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:10px; font-weight:700; }
.group-notification-summary { color:var(--muted); font-size:11px; margin:0 0 14px; }
.group-card-actions { display:flex; gap:14px; margin-top:auto; }
.group-card-actions button { background:none; color:var(--spruce); font-size:11.5px; font-weight:700; }
.group-card-actions .delete-group-item { color:var(--terra); }
.group-card-actions button:hover { text-decoration:underline; }
.group-modal { max-width:min(640px,92vw); width:100%; max-height:88vh; overflow-y:auto; padding:32px; border-radius:14px; }
.group-modal .modal-kicker { font-size:10.5px; letter-spacing:1.2px; }
.group-modal h2 { font-size:23px; letter-spacing:-.4px; margin:8px 0 6px; }
.group-modal > p { font-size:13.5px; line-height:1.55; margin-bottom:6px; color:#54615a; }
.group-modal label { font-size:12.5px; font-weight:700; color:#2b3630; margin-top:20px; }
.group-modal input,.group-modal textarea { font-size:14px; padding:12px 14px; border-radius:9px; border:1px solid var(--line); background:#fff; transition:border-color .15s ease, box-shadow .15s ease; }
.group-modal input:focus,.group-modal textarea:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.group-modal textarea { height:72px; line-height:1.5; }
.group-modal-section { margin:26px 0 8px; padding-top:22px; border-top:1px solid var(--line); }
.group-modal-section-label { display:block; margin-bottom:11px; color:var(--ink-2); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; }
.group-member-search { display:flex; align-items:center; gap:9px; margin-bottom:10px; padding:11px 13px; border:1px solid var(--line); border-radius:9px; background:var(--surface); transition:border-color .15s ease; }
.group-member-search:focus-within { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.group-member-search .search-glyph { color:var(--spruce); font-size:17px; }
.group-member-search input { flex:1; min-width:0; border:0; outline:0; background:none; font-size:13.5px; color:#27332f; padding:0; }
.group-member-list,.group-notification-list { display:flex; flex-direction:column; border:1px solid var(--line); border-radius:9px; overflow:hidden; }
.group-member-empty { padding:14px; color:var(--muted); font-size:12.5px; text-align:center; }
[data-theme="dark"] .group-member-search { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .group-member-search input { color:var(--ink); }
.group-member-option,.group-notification-option { display:flex; align-items:center; gap:10px; padding:12px 13px; border:0; border-top:1px solid var(--line); border-radius:0; background:var(--surface); font-size:13.5px; font-weight:500; color:#27332f; transition:background .15s ease; }
.group-member-option:first-child,.group-notification-option:first-child { border-top:0; }
.group-member-option:hover,.group-notification-option:hover { background:var(--spruce-pale); }
.group-member-option input[type="checkbox"],.group-notification-option input[type="checkbox"] { display:inline-block; width:16px; height:16px; margin:0; padding:0; flex:0 0 auto; accent-color:var(--spruce); }
.group-notification-option b { font-weight:600; }
.group-notification-option small { display:block; color:#5c6862; font-weight:400; font-size:11.5px; margin-top:3px; line-height:1.45; }
.group-modal .save-button.full-width { margin-top:26px; padding:13px; font-size:13px; border-radius:9px; }
[data-theme="dark"] .group-modal input,[data-theme="dark"] .group-modal textarea { background:var(--surface); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .group-modal > p { color:var(--muted); }
[data-theme="dark"] .group-modal label,[data-theme="dark"] .group-modal-section-label { color:var(--ink); }
[data-theme="dark"] .group-member-search input { color:var(--ink); }
[data-theme="dark"] .group-notification-option small { color:var(--muted); }
[data-theme="dark"] .group-modal-section { border-color:var(--line); }
[data-theme="dark"] .group-member-list,[data-theme="dark"] .group-notification-list { border-color:var(--line); }
[data-theme="dark"] .group-member-option,[data-theme="dark"] .group-notification-option { border-top-color:var(--line); }
[data-theme="dark"] .group-member-option,[data-theme="dark"] .group-notification-option { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .group-member-option:hover,[data-theme="dark"] .group-notification-option:hover { background:var(--spruce-pale); border-color:var(--spruce); }

/* ---------- Settings: Changes management ---------- */
.changes-settings-panel { margin-top:8px; }
.changes-settings-panel .back-to-tickets { margin-bottom:20px; }
.automations-settings-panel { margin-top:8px; }
.automations-settings-panel .back-to-tickets { margin-bottom:20px; }
.change-settings-grid { display:grid; grid-template-columns:1fr 1.15fr; gap:16px; align-items:start; }
.change-settings-card { padding:20px; }
.change-settings-card:nth-child(3) { grid-column:1; align-self:start; }
.change-settings-grid { display:block; max-width:1180px; }.change-settings-grid::after { content:""; display:block; clear:both; }.change-settings-card:nth-child(1) { float:left; width:calc(46% - 8px); }.change-settings-card:nth-child(2) { float:right; width:calc(54% - 8px); }.change-settings-card:nth-child(3) { clear:left; float:left; width:calc(46% - 8px); margin-top:16px; }@media (max-width:900px){.change-settings-card:nth-child(1),.change-settings-card:nth-child(2),.change-settings-card:nth-child(3){float:none;width:auto;margin-top:0}.change-settings-card:nth-child(3){margin-top:16px}}
.change-settings-card h3 { font:700 15px Inter, sans-serif; margin:0 0 6px; }
.change-settings-card p { margin:0 0 16px; color:var(--muted); font-size:12px; line-height:1.5; }
.change-settings-card label { display:block; margin-top:13px; color:var(--ink-2); font-size:11.5px; font-weight:800; }
.change-settings-card textarea,.change-setting-composer input { width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font-size:12.5px; outline:none; }
.change-settings-card textarea:focus,.change-setting-composer input:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.change-setting-list { display:grid; gap:7px; }
.change-setting-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.change-setting-row span { min-width:0; color:#2f3a34; font-size:12.5px; font-weight:700; }
.change-setting-row small { display:block; margin-top:2px; color:var(--muted); font-size:11px; font-weight:500; }
.change-setting-row button { flex:0 0 auto; background:none; color:var(--terra); font-size:11.5px; font-weight:800; }
.change-setting-row button:hover { text-decoration:underline; }
.change-setting-empty { margin:0; padding:12px; border:1px dashed var(--line); border-radius:8px; color:var(--muted); font-size:12px; }
.change-setting-composer { display:flex; gap:8px; margin-top:12px; }
.change-setting-composer input { margin-top:0; }
.change-setting-composer button,.change-settings-card .save-button { flex:0 0 auto; padding:10px 13px; border-radius:8px; background:var(--spruce); color:#fff; font-size:12px; font-weight:800; }
.change-setting-composer button:hover,.change-settings-card .save-button:hover { background:var(--spruce-dark); }
.change-approver-picker { display:grid; gap:7px; margin-top:6px; }.change-approver-picker > input { width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; font-size:12px; }.change-approver-picker > div { display:grid; max-height:190px; overflow:auto; border:1px solid var(--line); border-radius:6px; }.change-approver-picker label { display:flex !important; align-items:center; gap:9px; margin:0 !important; padding:9px 10px; border-top:1px solid #edf0eb; background:var(--surface); }.change-approver-picker label:first-child { border-top:0; }.change-approver-picker label:hover { background:#f1f4f1; }.change-approver-picker input[type="checkbox"] { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.change-approver-picker b,.change-approver-picker small { display:block; }.change-approver-picker b { font-size:12px; }.change-approver-picker small { margin-top:2px; color:var(--muted); font-size:10px; }[data-theme="dark"] .change-approver-picker > input,[data-theme="dark"] .change-approver-picker > div{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .change-approver-picker label{background:var(--surface);border-color:var(--line)}
.calendar-day.blackout-day { border-color:var(--terra); background:var(--terra-pale); }
.calendar-blackout-pill { display:block; width:100%; padding:3px 6px; border-radius:5px; background:var(--terra); color:#fff; font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; }
@media (max-width:900px){.change-settings-grid{grid-template-columns:1fr}.change-settings-card:nth-child(3){grid-column:auto}.change-setting-composer{flex-direction:column}.change-setting-composer button{width:100%;}}
[data-theme="dark"] .change-settings-card label,[data-theme="dark"] .change-setting-row span { color:var(--ink); }
[data-theme="dark"] .change-settings-card textarea,[data-theme="dark"] .change-setting-composer input,[data-theme="dark"] .change-setting-row { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .change-setting-empty { border-color:var(--line); }
[data-theme="dark"] .calendar-day.blackout-day { background:#3d2820; border-color:var(--terra); }
[data-theme="dark"] .group-member-chip { background:var(--spruce-pale); color:var(--spruce); }

/* ---------- Change Enablement workspace ---------- */
.pill.standard { background:var(--spruce-pale); color:var(--spruce-dark); }
.pill.low { background:var(--spruce-pale); color:var(--spruce-dark); }
.change-schedule-list { display:grid; gap:2px; margin-top:-4px; }
.change-schedule-header { display:grid; grid-template-columns:minmax(210px,1.6fr) minmax(100px,.8fr) minmax(125px,.9fr) 90px; gap:12px; padding:0 0 8px; color:#8b958d; font-size:10px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; }
.change-schedule-row { display:grid; grid-template-columns:minmax(210px,1.6fr) minmax(100px,.8fr) minmax(125px,.9fr) 90px; align-items:center; gap:12px; padding:13px 0; border-top:1px solid var(--line); cursor:pointer; transition:background .15s ease; }
.change-schedule-row:hover { background:var(--spruce-pale); margin:0 -10px; padding-left:10px; padding-right:10px; border-radius:6px; }
.change-schedule-header + .change-schedule-row { border-top:0; }
.change-schedule-row b { display:block; font-size:12.5px; color:var(--ink); }
.change-schedule-row small { display:block; color:var(--muted); font-size:10.5px; margin-top:3px; }
.change-schedule-owner { color:var(--ink-2); font-size:12px; font-weight:700; }
.change-schedule-row .change-state-badge { justify-self:start; }
.change-schedule-row .pill { justify-self:start; }
@media (max-width:900px){.change-schedule-header{display:none}.change-schedule-row{grid-template-columns:1fr auto}.change-schedule-owner,.change-schedule-row .change-state-badge{grid-column:1 / -1}.change-schedule-owner:before{content:"Owner: "; color:#8b958d; font-weight:800}.change-schedule-row .change-state-badge:before{content:"State: "; color:#8b958d}}
.change-route-list { display:grid; gap:2px; margin-top:-4px; }
.change-route-item { display:flex; align-items:flex-start; gap:11px; padding:11px 0; border-top:1px solid var(--line); }
.change-route-item:first-child { border-top:0; }
.change-route-dot { flex:0 0 auto; width:9px; height:9px; margin-top:5px; border-radius:50%; }
.dot-spruce { background:var(--spruce); }
.dot-saffron { background:var(--saffron); }
.dot-terra { background:var(--terra); }
.change-route-item b { display:block; font-size:12.5px; color:var(--ink); }
.change-route-item p { margin:2px 0 0; color:var(--muted); font-size:11px; }

.change-wizard-layout { display:grid; grid-template-columns:1fr 300px; gap:16px; align-items:start; }
.change-form-panel { padding:26px; }
.change-section { display:none; }
.change-section.active-change-section { display:block; animation:fadeUp .25s ease both; }
.change-section-header { margin-bottom:22px; }
.change-section-header h2 { font:700 20px Inter, sans-serif; margin:5px 0 6px; }
.change-field-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.change-field-grid.one-col { grid-template-columns:1fr; }
.change-field { display:block; color:var(--ink-2); font-size:12px; font-weight:600; }
.change-field.full-width { grid-column:1 / -1; }
.change-field input,.change-field select,.change-field textarea { display:block; width:100%; margin-top:7px; padding:11px 13px; border:1px solid var(--line); border-radius:7px; background:#fff; color:var(--ink); font-size:13.5px; outline:none; transition:border-color .15s ease, box-shadow .15s ease; }
.change-field input:focus,.change-field select:focus,.change-field textarea:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.change-field textarea { resize:vertical; line-height:1.5; }
.change-form-actions { display:flex; align-items:center; justify-content:space-between; margin-top:26px; padding-top:22px; border-top:1px solid var(--line); }
.change-action-right { display:flex; gap:10px; }
.change-review-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:18px; }
.change-review-card { padding:16px; border:1px solid var(--line); border-radius:9px; background:var(--surface); }
.change-review-card span { display:block; color:var(--muted); font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; margin-bottom:6px; }
.change-review-card strong { font:700 16px Inter, sans-serif; color:var(--ink); }
.change-summary-box { padding:16px; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--ink-2); font-size:12.5px; line-height:1.7; white-space:pre-line; margin-bottom:16px; }
.change-notice-box { padding:13px 15px; border:1px solid var(--saffron); border-radius:7px; background:var(--saffron-pale); color:#8d6c22; font-size:12px; line-height:1.5; }
.change-summary-sticky { position:sticky; top:20px; padding:22px; }
.change-summary-sticky h3 { font:700 18px Inter, sans-serif; margin:5px 0 18px; }
.change-risk-meter { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.change-risk-score { display:grid; place-items:center; flex:0 0 auto; width:56px; height:56px; border-radius:50%; background:var(--spruce-pale); color:var(--spruce-dark); font:800 21px Inter, sans-serif; }
.change-risk-level { font-weight:700; font-size:13.5px; color:var(--ink); }
.change-risk-text { color:var(--muted); font-size:11.5px; margin-top:2px; }
.change-summary-rule { height:1px; background:var(--line); margin:16px 0; }
.change-summary-line { display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-top:1px solid var(--line); font-size:12.5px; }
.change-summary-line:first-of-type { border-top:0; }
.change-summary-line span { color:var(--muted); }
.change-summary-line strong { color:var(--ink); }
.change-risk-meter.risk-medium .change-risk-score { background:var(--saffron-pale); color:#8d6c22; }
.change-risk-meter.risk-high .change-risk-score,.change-risk-meter.risk-emergency .change-risk-score { background:var(--terra-pale); color:var(--terra); }
.change-result-modal { max-width:min(620px,92vw); width:100%; }
.change-detail-modal { max-width:min(620px,92vw); width:100%; max-height:88vh; overflow-y:auto; }
.change-detail-tabs { display:flex; gap:22px; margin-top:18px; border-bottom:1px solid var(--line); }
.change-detail-tabs button { position:relative; padding:0 0 11px; background:none; color:#68746d; font-size:12.5px; font-weight:600; }
.change-detail-tabs button.active { color:var(--ink); }
.change-detail-tabs button.active:after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--spruce); }
.change-detail-tab-panel { display:none; padding-top:18px; }
.change-detail-tab-panel.active-change-detail-tab { display:block; }
.change-comment-list { display:grid; gap:14px; margin-bottom:16px; max-height:240px; overflow-y:auto; }
.change-comment-item { display:flex; gap:10px; }
.change-comment-item .comment-avatar { flex:0 0 auto; }
.change-comment-item p { margin:0; color:var(--ink); font-size:12.5px; line-height:1.5; }
.change-comment-item small { display:block; color:var(--muted); font-size:10.5px; margin-top:3px; }
.change-comment-empty { color:var(--muted); font-size:12px; text-align:center; padding:14px; }
.change-comment-composer { display:flex; gap:10px; align-items:flex-end; }
.change-comment-composer textarea { flex:1; min-width:0; padding:10px 12px; border:1px solid var(--line); border-radius:7px; background:#fff; color:var(--ink); font-size:12.5px; resize:vertical; outline:none; }
.change-comment-composer textarea:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--spruce-pale); }
.change-detail-tab-audit-empty { color:var(--muted); font-size:12px; text-align:center; padding:14px; }
[data-theme="dark"] .change-comment-composer textarea { background:var(--surface); color:var(--ink); border-color:var(--line); }
.change-detail-modal .change-review-grid { margin-top:20px; }
.change-detail-meta { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:18px 0; }
.change-detail-meta-item { padding:11px 13px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.change-detail-meta-item span { display:block; color:var(--muted); font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
.change-detail-meta-item strong { font-size:12.5px; color:var(--ink); }
.change-detail-section { margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.change-detail-section p { margin:0; color:var(--ink-2); font-size:12.5px; line-height:1.6; white-space:pre-wrap; }
[data-theme="dark"] .change-detail-meta-item { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .change-detail-section { border-color:var(--line); }
.change-result-payload { max-height:340px; overflow:auto; padding:14px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink-2); font-size:11.5px; line-height:1.6; white-space:pre-wrap; word-break:break-word; }
@media (max-width:1050px) { .change-wizard-layout { grid-template-columns:1fr; } .change-summary-sticky { position:static; } }
@media (max-width:700px) { .change-field-grid { grid-template-columns:1fr; } .change-review-grid { grid-template-columns:1fr; } .change-form-actions { flex-direction:column; align-items:stretch; gap:12px; } .change-action-right { flex-direction:column; } }
[data-theme="dark"] .change-schedule-row,[data-theme="dark"] .change-route-item,[data-theme="dark"] .change-summary-line { border-top-color:var(--line); }
[data-theme="dark"] .change-field input,[data-theme="dark"] .change-field select,[data-theme="dark"] .change-field textarea { background:var(--surface); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .change-review-card,[data-theme="dark"] .change-summary-box,[data-theme="dark"] .change-result-payload { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .change-risk-score { background:var(--spruce-pale); color:var(--spruce); }

/* ---------- Change Calendar: month grid view ---------- */
.calendar-month-heading { align-items:center; }
.calendar-nav { display:flex; align-items:center; gap:8px; }
.calendar-nav .outline-button { padding:8px 12px; font-size:11.5px; }
.calendar-weekday-row { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; margin:18px 0 8px; color:var(--muted); font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; text-align:center; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.calendar-day { min-height:96px; padding:8px; border:1px solid var(--line); border-radius:8px; background:var(--surface); display:flex; flex-direction:column; gap:5px; }
.calendar-day.other-month { background:transparent; border-color:var(--line); opacity:.5; }
.calendar-day.today { border-color:var(--spruce); box-shadow:0 0 0 1px var(--spruce); }
.calendar-day-number { font-size:11.5px; font-weight:700; color:var(--ink); }
.calendar-day.other-month .calendar-day-number { color:#a6b0a7; }
.calendar-event-pill { display:block; width:100%; padding:3px 6px; border:0; border-radius:5px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:10px; font-weight:600; text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.calendar-event-pill.pill-standard { background:var(--spruce-pale); color:var(--spruce-dark); }
.calendar-event-pill.pill-medium { background:#e4eee7; color:var(--spruce-dark); }
.calendar-event-pill.pill-high { background:var(--saffron-pale); color:#8d6c22; }
.calendar-event-pill.pill-critical { background:var(--terra-pale); color:var(--terra); }
.calendar-event-pill.pill-low { background:var(--spruce-pale); color:var(--spruce-dark); }
.calendar-event-pill:hover { filter:brightness(.95); }
@media (max-width:800px) { .calendar-day { min-height:70px; font-size:10px; } .calendar-weekday-row { font-size:9px; } }
[data-theme="dark"] .calendar-day { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .calendar-day.other-month { background:transparent; border-color:#282e26; }
[data-theme="dark"] .calendar-event-pill.pill-medium { background:var(--spruce-pale); color:var(--spruce); }

/* ---------- Approval Queue: pending changes with per-approver status ---------- */
.approval-queue-list { display:grid; gap:12px; }
.approval-queue-card { border:1px solid var(--line); border-radius:10px; padding:18px; background:var(--surface); }
.approval-queue-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; cursor:pointer; }
.approval-queue-header h3 { margin:0 0 5px; font:700 15px Inter, sans-serif; color:var(--ink); }
.approval-queue-header small { display:block; color:var(--muted); font-size:11px; }
.approval-queue-badges { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.approval-status-pill { padding:5px 10px; border-radius:12px; font-size:10.5px; font-weight:700; }
.approval-status-pill.pending { background:var(--saffron-pale); color:#8d6c22; }
.approval-status-pill.approved { background:var(--spruce-pale); color:var(--spruce-dark); }
.approver-list { display:grid; gap:2px; margin-top:14px; }
.approver-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-top:1px solid var(--line); }
.approver-row:first-child { border-top:0; }
.approver-row b { display:block; font-size:12.5px; color:var(--ink); }
.approver-row small { display:block; color:var(--muted); font-size:10.5px; margin-top:2px; }
.approver-status { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.approve-button { padding:7px 12px; border-radius:6px; background:var(--spruce); color:#fff; font-size:11px; font-weight:700; }
.approve-button:hover { background:var(--spruce-dark); }
[data-theme="dark"] .approval-queue-card { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .approver-row { border-top-color:var(--line); }

/* ---------- Clickable Awaiting Approval metric card ---------- */
.metric-card-clickable { cursor:pointer; transition:border-color .15s ease, transform .15s ease; }
.metric-card-clickable:hover { border-color:var(--spruce); transform:translateY(-1px); }
#awaitingApprovalCard:hover { border-color:var(--saffron); }

/* ---------- All Changes register: full change list with editable state ---------- */
.change-state-filter { display:flex; flex-direction:column; gap:6px; color:var(--ink-2); font-size:11.5px; font-weight:700; }
.change-state-filter select { padding:9px 11px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:12.5px; outline:none; }
.change-state-filter select:focus { border-color:var(--spruce); }
.change-register-list { display:grid; gap:2px; }
.change-register-header { display:grid; grid-template-columns:minmax(300px,1fr) 180px 140px 185px 100px; gap:16px; padding:0 10px 8px 13px; color:#8b958d; font-size:10px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; }
.change-register-row { display:grid; grid-template-columns:minmax(300px,1fr) 180px 140px 185px 100px; align-items:center; gap:16px; padding:13px 10px; border-top:1px solid var(--line); border-left:3px solid transparent; }
.change-register-header + .change-register-row { border-top:0; }
.change-register-main { min-width:0; cursor:pointer; }
.change-register-main b { display:block; font-size:12.5px; color:var(--ink); }
.change-register-main small { display:block; color:var(--muted); font-size:10.5px; margin-top:3px; }
.change-register-owner { color:var(--ink-2); font-size:12px; font-weight:700; }
.change-register-planned { color:var(--ink-2); font-size:12px; font-weight:600; }
.change-state-select { flex:0 0 auto; padding:8px 10px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:11.5px; outline:none; }
.change-register-row .custom-select-wrapper { width:180px; }
.change-register-row .custom-select-trigger { min-height:34px; padding:8px 10px; border-radius:6px; font-size:11.5px; }
.change-register-row .custom-select-menu { min-width:180px; }
.change-register-row.state-draft { border-left-color:#a6b0a7; }
.change-register-row.state-hold { border-left-color:var(--saffron); }
.change-register-row.state-waiting { border-left-color:var(--saffron); }
.change-register-row.state-progress { border-left-color:#4d70df; }
.change-register-row.state-approved { border-left-color:var(--spruce); }
.change-register-row.state-declined { border-left-color:var(--terra); }
.change-register-row.state-completed { border-left-color:var(--spruce); }
.change-register-row.state-incomplete { border-left-color:var(--terra); }
.change-detail-state-field { display:block; max-width:220px; margin-bottom:4px; color:var(--ink-2); font-size:12px; font-weight:600; }
.change-detail-state-field select { display:block; width:100%; margin-top:6px; padding:9px 11px; border:1px solid var(--line); border-radius:7px; background:#fff; color:var(--ink); font-size:12.5px; outline:none; }
[data-theme="dark"] .change-state-filter select,[data-theme="dark"] .change-state-select,[data-theme="dark"] .change-detail-state-field select { background:var(--surface); color:var(--ink); border-color:var(--line); }
[data-theme="dark"] .change-register-owner,[data-theme="dark"] .change-register-planned { color:var(--ink); }
[data-theme="dark"] .change-register-row { border-top-color:var(--line); }
@media (max-width:700px) { .change-register-header { display:none; } .change-register-row { grid-template-columns:1fr; } .change-register-row .custom-select-wrapper { width:100%; } .change-register-owner:before { content:"Owner: "; color:#8b958d; font-weight:800; } .change-register-planned:before { content:"Planned start: "; color:#8b958d; font-weight:800; } }

/* ---------- Overview: clickable priority legend & activity rows ---------- */
.priority-legend-clickable { cursor:pointer; border-radius:6px; transition:background .15s ease; }
.priority-legend-clickable:hover { background:var(--accent-hover); }
.activity-item[data-ticket-id], .activity-item[data-nav-view] { cursor:pointer; border-radius:6px; transition:background .15s ease; }
.activity-item[data-ticket-id]:hover, .activity-item[data-nav-view]:hover { background:var(--accent-hover); }

/* ---------- Ticket filters: keep custom menus visible ---------- */
.ticket-panel { overflow:visible !important; }

/* ---------- Customer satisfaction workspace ---------- */
.satisfaction-metrics { margin-bottom:16px; }
.satisfaction-layout { display:grid; grid-template-columns:1.45fr 1fr; gap:16px; margin-bottom:16px; }
.satisfaction-lower-grid { display:grid; grid-template-columns:1.45fr 1fr; gap:16px; }
.satisfaction-period { padding:5px 8px; border-radius:12px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:10px; font-weight:800; }
.satisfaction-chart { height:230px; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding:22px 4px 0; border-bottom:1px solid var(--line); }
.satisfaction-bar-group { flex:1; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:7px; color:var(--muted); font-size:10px; }
.satisfaction-bar { position:relative; width:100%; max-width:42px; min-height:40px; border-radius:8px 8px 3px 3px; background:linear-gradient(180deg, var(--spruce), #8fb99f); box-shadow:inset 0 1px 0 rgba(255,255,255,.28); }
.satisfaction-bar span { position:absolute; top:-20px; left:50%; transform:translateX(-50%); color:var(--ink); font-size:11px; font-weight:800; }
.satisfaction-bar-group small { color:var(--muted); font-weight:800; }
.satisfaction-bar-group em { color:#a6ada7; font-style:normal; font-size:9.5px; }
.satisfaction-driver-list { display:grid; gap:9px; }
.satisfaction-driver { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 13px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.satisfaction-driver span { color:var(--ink-2); font-size:12.5px; font-weight:700; }
.satisfaction-driver strong { display:grid; place-items:center; min-width:28px; height:24px; border-radius:12px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:11px; }
.satisfaction-feedback-list,.satisfaction-followup-list { display:grid; gap:8px; }
.satisfaction-feedback,.satisfaction-followup { width:100%; display:flex; align-items:flex-start; gap:12px; padding:13px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); text-align:left; transition:border-color .15s ease, background .15s ease; }
.satisfaction-feedback:hover,.satisfaction-followup:hover { border-color:var(--spruce); background:var(--accent-hover); }
.satisfaction-score { display:grid; place-items:center; flex:0 0 auto; width:34px; height:34px; border-radius:9px; background:var(--spruce-pale); color:var(--spruce-dark); font:800 15px Inter, sans-serif; }
.satisfaction-feedback.negative .satisfaction-score { background:var(--terra-pale); color:var(--terra); }
.satisfaction-feedback.mixed .satisfaction-score { background:var(--saffron-pale); color:#98701d; }
.satisfaction-feedback span:nth-child(2),.satisfaction-followup span:nth-child(2) { flex:1; min-width:0; }
.satisfaction-feedback b,.satisfaction-followup b { display:block; font-size:12.5px; }
.satisfaction-feedback small,.satisfaction-followup small { display:block; margin-top:3px; color:var(--muted); font-size:10.5px; }
.satisfaction-feedback em { display:block; margin-top:7px; color:var(--ink-2); font-size:12px; font-style:normal; line-height:1.45; }
.satisfaction-followup > span:last-child { align-self:center; color:#9aa49b; font-size:16px; }
@media (max-width:900px){.satisfaction-layout,.satisfaction-lower-grid{grid-template-columns:1fr}.satisfaction-chart{height:190px}}
[data-theme="dark"] .satisfaction-period,[data-theme="dark"] .satisfaction-driver strong,[data-theme="dark"] .satisfaction-score { background:var(--spruce-pale); color:var(--spruce); }
[data-theme="dark"] .satisfaction-driver,[data-theme="dark"] .satisfaction-feedback,[data-theme="dark"] .satisfaction-followup { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .satisfaction-driver span,[data-theme="dark"] .satisfaction-feedback em { color:var(--ink); }
[data-theme="dark"] .satisfaction-feedback:hover,[data-theme="dark"] .satisfaction-followup:hover { background:var(--spruce-pale); }

/* ---------- Customer Satisfaction: survey workspace ---------- */
#customerSatisfactionView .widePanel { padding:22px; }
#customerSatisfactionView .panel-heading .eyebrow { margin-bottom:4px; }
#customerSatisfactionView .metric-grid { grid-template-columns:repeat(5, minmax(0, 1fr)); }
.csat-heading-actions { display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.csat-date-range { display:flex; flex-direction:column; gap:6px; color:var(--ink-2); font-size:11px; font-weight:800; }
.csat-date-range select { min-width:180px; padding:9px 11px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); font-size:12px; outline:none; }
.csat-date-range .custom-select-wrapper { min-width:180px; }
.csat-date-range .custom-select-trigger { min-height:34px; padding:8px 10px; border-radius:7px; font-size:12px; }
.csat-date-range .custom-select-menu { min-width:190px; }
#csatOverviewPanel .dashboard-grid { grid-template-columns:1fr; }
.csat-admin-settings-panel { margin-top:8px; }
.csat-admin-settings-panel .back-to-tickets { margin-bottom:20px; }
.csat-admin-settings-panel .widePanel { padding:22px; }
.positiveText { color:var(--spruce-dark) !important; }
.negativeText { color:var(--terra) !important; }
.automationSummary { display:grid; gap:8px; margin-bottom:14px; }
.summaryLine { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 13px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.summaryLine span { color:#657069; font-size:12px; }
.summaryLine strong { color:var(--ink); font-size:12px; }
.noticeBox { padding:13px; border-left:3px solid var(--saffron); border-radius:8px; background:var(--saffron-pale); color:#6d551f; font-size:12px; line-height:1.5; }
.csat-field-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:18px; }
.csat-field-grid label,.questionComposer label,.csat-comment-field,.preview-question { display:flex; flex-direction:column; gap:7px; color:var(--ink-2); font-size:12px; font-weight:800; }
.csat-field-grid .fullWidth { grid-column:1 / -1; }
.csat-field-grid input,.csat-field-grid textarea,.csat-field-grid select,.questionComposer input,.questionComposer select,.filterRow input,.filterRow select,.preview-question textarea,.preview-question select,.csat-comment-field textarea { width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font-size:12.5px; outline:none; }
.inlineFields { display:flex; align-items:center; gap:8px; }
.inlineFields input { max-width:95px; }
.unitLabel { padding:10px 12px; border-radius:8px; background:#f1f4ef; color:#657069; font-size:12px; font-weight:800; }
.questionCard { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:16px; margin-bottom:10px; border:1px solid var(--line); border-radius:9px; background:var(--surface); }
.questionCard h3 { margin:6px 0 5px; color:var(--ink); font:700 14px Inter, sans-serif; }
.questionCard p { margin:0; color:var(--muted); font-size:12px; }
.questionTypeBadge { display:inline-block; width:max-content; padding:4px 7px; border-radius:10px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.4px; }
.questionCard button.remove-csat-question { color:var(--terra); background:none; font-size:11.5px; font-weight:800; }
.questionComposer { display:grid; grid-template-columns:minmax(240px,1fr) 160px auto auto; gap:10px; align-items:center; margin:16px 0; }
.questionComposer > label { flex-direction:row; align-items:center; font-size:12px; }
.questionComposer input[type="checkbox"] { width:16px; height:16px; accent-color:var(--spruce); }
.thumbPair { display:flex; gap:10px; flex-wrap:wrap; }
.thumbButton { display:flex; align-items:center; justify-content:center; gap:7px; min-width:96px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--ink-2); font-weight:800; }
.thumbButton.positive.selected,.thumbButton.positive.selectedStatic { border-color:var(--spruce); background:var(--spruce-pale); color:var(--spruce-dark); }
.thumbButton.negative.selected,.thumbButton.negative.selectedStatic { border-color:var(--terra); background:var(--terra-pale); color:var(--terra); }
.csat-response-list { display:grid; gap:8px; }
.csat-response-card { width:100%; display:grid; grid-template-columns:58px 1fr; gap:10px; padding:13px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); text-align:left; }
.csat-response-card:hover { border-color:var(--spruce); background:var(--accent-hover); }
.csat-response-card > span { grid-row:1 / span 3; align-self:start; padding:6px 8px; border-radius:10px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:10px; font-weight:800; text-align:center; }
.csat-response-card.red > span { background:var(--terra-pale); color:var(--terra); }
.csat-response-card b,.csat-response-card small,.csat-response-card em { display:block; }
.csat-response-card small { color:var(--muted); font-size:10.5px; margin-top:3px; }
.csat-response-card em { color:var(--ink-2); font-size:12px; font-style:normal; line-height:1.45; margin-top:6px; }
.responseHeader { gap:18px; }
.filterRow { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.filterRow input { width:250px; }
.tableWrap { width:100%; overflow:auto; }
.tableWrap table { width:100%; border-collapse:collapse; font-size:12px; }
.tableWrap th { padding:10px; border-bottom:1px solid var(--line); color:#8b958d; font-size:10px; text-transform:uppercase; letter-spacing:.5px; text-align:left; }
.tableWrap td { padding:12px 10px; border-bottom:1px solid var(--line); color:#445149; vertical-align:top; }
.tableWrap tbody tr { cursor:pointer; }
.tableWrap tbody tr:hover { background:var(--accent-hover); }
.csat-rating { display:inline-block; padding:4px 8px; border-radius:12px; font-size:10px; font-weight:800; }
.csat-rating.green { background:var(--spruce-pale); color:var(--spruce-dark); }
.csat-rating.red { background:var(--terra-pale); color:var(--terra); }
.technicianBars { display:grid; gap:13px; }
.technicianBar { display:grid; grid-template-columns:130px 1fr 44px; gap:12px; align-items:center; }
.technicianBar b,.technicianBar small { display:block; }
.technicianBar b { font-size:12px; }
.technicianBar small { margin-top:2px; color:var(--muted); font-size:10.5px; }
.technicianBar span { height:10px; border-radius:20px; background:var(--line); overflow:hidden; }
.technicianBar i { display:block; height:100%; border-radius:inherit; background:var(--spruce); }
.technicianBar strong { font-size:12px; color:var(--spruce-dark); }
.surveyPreviewShell { display:flex; justify-content:center; padding:20px; background:linear-gradient(135deg,var(--accent-hover),#fffaf0); border:1px solid var(--line); border-radius:10px; }
.surveyCard { width:min(620px,100%); padding:28px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow); }
.surveyBrand { color:var(--spruce-dark); font:800 13px Inter, sans-serif; margin-bottom:8px; }
.surveyCard h2 { margin:6px 0 8px; font:800 24px Inter, sans-serif; }
.surveyIntro { margin:0 0 18px; color:var(--muted); font-size:13px; line-height:1.5; }
.ratingFieldset { margin:0 0 16px; padding:0; border:0; }
.ratingFieldset legend { margin-bottom:10px; color:var(--ink-2); font-size:12.5px; font-weight:800; }
.dynamicSurveyQuestions { display:grid; gap:12px; margin:16px 0; }
.successMessage { margin-top:12px; padding:11px 12px; border-radius:8px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:12px; font-weight:800; }
@media (max-width:1200px){#customerSatisfactionView .metric-grid{grid-template-columns:repeat(3, minmax(0,1fr));}}
@media (max-width:900px){#customerSatisfactionView .metric-grid,.csat-field-grid,.questionComposer,#csatTechniciansPanel .dashboard-grid{grid-template-columns:1fr}.csat-heading-actions{width:100%;justify-content:flex-start}.filterRow{justify-content:flex-start}.filterRow input{width:100%}.technicianBar{grid-template-columns:1fr}.surveyPreviewShell{padding:12px}.surveyCard{padding:20px}}
[data-theme="dark"] .summaryLine,[data-theme="dark"] .questionCard,[data-theme="dark"] .csat-response-card,[data-theme="dark"] .surveyCard { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .csat-date-range,[data-theme="dark"] .csat-field-grid label,[data-theme="dark"] .questionComposer label,[data-theme="dark"] .csat-comment-field,[data-theme="dark"] .preview-question { color:var(--ink); }
[data-theme="dark"] .csat-date-range select,[data-theme="dark"] .csat-field-grid input,[data-theme="dark"] .csat-field-grid textarea,[data-theme="dark"] .csat-field-grid select,[data-theme="dark"] .questionComposer input,[data-theme="dark"] .questionComposer select,[data-theme="dark"] .filterRow input,[data-theme="dark"] .filterRow select,[data-theme="dark"] .preview-question textarea,[data-theme="dark"] .preview-question select,[data-theme="dark"] .csat-comment-field textarea,[data-theme="dark"] .thumbButton { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .tableWrap td { border-bottom-color:var(--line); color:var(--ink); }
[data-theme="dark"] .tableWrap tbody tr:hover,[data-theme="dark"] .csat-response-card:hover { background:var(--spruce-pale); }
[data-theme="dark"] .surveyPreviewShell { background:#171b15; }

/* ---------- Dark theme readability pass ---------- */
[data-theme="dark"] .subheading,
[data-theme="dark"] .brand-lockup small,
[data-theme="dark"] .workspace-copy small,
[data-theme="dark"] .profile-row small,
[data-theme="dark"] .nav-label,
[data-theme="dark"] .breadcrumbs,
[data-theme="dark"] .panel-heading p,
[data-theme="dark"] .metric-card p,
[data-theme="dark"] .metric-card small,
[data-theme="dark"] .activity-item small,
[data-theme="dark"] .activity-item time,
[data-theme="dark"] .article-card p,
[data-theme="dark"] .article-card small,
[data-theme="dark"] .empty-state p,
[data-theme="dark"] .settings-group-heading p,
[data-theme="dark"] .catalog-heading p,
[data-theme="dark"] .catalog-card p,
[data-theme="dark"] .change-schedule-row small,
[data-theme="dark"] .change-route-item p,
[data-theme="dark"] .change-review-card span,
[data-theme="dark"] .change-risk-text,
[data-theme="dark"] .change-summary-line span,
[data-theme="dark"] .change-comment-item small,
[data-theme="dark"] .change-detail-meta-item span,
[data-theme="dark"] .calendar-weekday-row,
[data-theme="dark"] .approval-queue-header small,
[data-theme="dark"] .approver-row small,
[data-theme="dark"] .change-register-main small,
[data-theme="dark"] .satisfaction-bar-group small,
[data-theme="dark"] .satisfaction-feedback small,
[data-theme="dark"] .satisfaction-followup small,
[data-theme="dark"] .csat-response-card small,
[data-theme="dark"] .surveyIntro,
[data-theme="dark"] .technicianBar small { color:var(--muted) !important; }
[data-theme="dark"] .breadcrumbs strong,
[data-theme="dark"] .settings-items button,
[data-theme="dark"] .summaryLine span,
[data-theme="dark"] .csat-date-range,
[data-theme="dark"] .csat-field-grid label,
[data-theme="dark"] .questionComposer label,
[data-theme="dark"] .csat-comment-field,
[data-theme="dark"] .preview-question,
[data-theme="dark"] .ratingFieldset legend,
[data-theme="dark"] .tableWrap td,
[data-theme="dark"] .satisfaction-driver span,
[data-theme="dark"] .satisfaction-feedback em,
[data-theme="dark"] .csat-response-card em,
[data-theme="dark"] .change-schedule-owner,
[data-theme="dark"] .change-register-owner,
[data-theme="dark"] .change-register-planned,
[data-theme="dark"] .change-setting-row span,
[data-theme="dark"] .group-modal label,
[data-theme="dark"] .group-modal-section-label,
[data-theme="dark"] .thumbButton { color:var(--ink) !important; }
[data-theme="dark"] .tableWrap th,
[data-theme="dark"] .change-schedule-header,
[data-theme="dark"] .change-register-header { color:#d2dacd !important; }

/* ---------- Dark theme: ticket title readability ---------- */
[data-theme="dark"] .ticket-page-heading h1,
[data-theme="dark"] .ticket-title-line,
[data-theme="dark"] .title-menu,
[data-theme="dark"] .title-more { color:var(--ink) !important; }
[data-theme="dark"] .ticket-page-heading h1:hover { color:var(--spruce-dark) !important; }

/* ---------- Dark theme: ticket readability ---------- */
[data-theme="dark"] .ticket-panel,
[data-theme="dark"] .ticket-table-head,
[data-theme="dark"] .ticket-row { background:var(--surface) !important; border-color:var(--line) !important; }
[data-theme="dark"] .ticket-table-head,
[data-theme="dark"] .ticket-table-head [data-column-key] { color:#d2dacd !important; }
[data-theme="dark"] .ticket-row { color:var(--ink) !important; border-top-color:var(--line) !important; }
[data-theme="dark"] .ticket-row:hover { background:var(--hover-bg) !important; }
[data-theme="dark"] .ticket-title,
[data-theme="dark"] .ticket-title-cell .ticket-title,
[data-theme="dark"] .ticket-number,
[data-theme="dark"] .requester-cell,
[data-theme="dark"] .timestamp-cell,
[data-theme="dark"] .sla-count,
[data-theme="dark"] .next-breach,
[data-theme="dark"] .table-muted,
[data-theme="dark"] .ticket-row > span { color:var(--ink) !important; }
[data-theme="dark"] .ticket-requester,
[data-theme="dark"] .ticket-title-cell .ticket-requester,
[data-theme="dark"] .ticket-meta-row,
[data-theme="dark"] .ticket-filters .filter-select,
[data-theme="dark"] .ticket-search input,
[data-theme="dark"] .columns-menu-title,
[data-theme="dark"] .column-option,
[data-theme="dark"] .related-ticket small,
[data-theme="dark"] .requester-history-body small,
[data-theme="dark"] .task-row-body small,
[data-theme="dark"] .detail-action-panel p,
[data-theme="dark"] .comment-item small,
[data-theme="dark"] .audit-event-source { color:var(--muted) !important; }
[data-theme="dark"] .ticket-id,
[data-theme="dark"] .activity-item a { color:var(--spruce-dark) !important; }
[data-theme="dark"] .status { color:var(--spruce-dark) !important; }
[data-theme="dark"] .status.pending { color:#f3d68d !important; }
[data-theme="dark"] .status { background:transparent !important; }
[data-theme="dark"] .pill.medium { background:var(--spruce-pale) !important; color:var(--spruce-dark) !important; }
[data-theme="dark"] .pill.high { background:#3c331d !important; color:#f3d68d !important; }
[data-theme="dark"] .pill.critical { background:#3d2820 !important; color:#f0a18d !important; }
[data-theme="dark"] .pill.low { background:var(--spruce-pale) !important; color:var(--spruce-dark) !important; }
[data-theme="dark"] .ticket-filters .custom-select-trigger,
[data-theme="dark"] .ticket-search,
[data-theme="dark"] .columns-menu,
[data-theme="dark"] .view-size-control .custom-select-trigger { background:var(--surface) !important; border-color:var(--line) !important; color:var(--ink) !important; }
[data-theme="dark"] .detail-grid label,
[data-theme="dark"] .detail-grid label b,
[data-theme="dark"] .related-heading h2,
[data-theme="dark"] #historyRequesterName,
[data-theme="dark"] .detail-side-card h2,
[data-theme="dark"] .detail-action-panel h2,
[data-theme="dark"] .comment-item,
[data-theme="dark"] .requester-history-body b,
[data-theme="dark"] .task-row-body p,
[data-theme="dark"] .audit-event-content,
[data-theme="dark"] .related-ticket { color:var(--ink) !important; }
[data-theme="dark"] .task-row,
[data-theme="dark"] .requester-history-row,
[data-theme="dark"] .merge-ticket-row,
[data-theme="dark"] .audit-event-detail { background:var(--surface) !important; border-color:var(--line) !important; }
[data-theme="dark"] .requester-history-search,
[data-theme="dark"] .task-composer,
[data-theme="dark"] .bulk-update-field-row select { background:var(--surface) !important; border-color:var(--line) !important; color:var(--ink) !important; }

/* ---------- Dark theme: comments editor readability ---------- */
[data-theme="dark"] .comments-panel { color:var(--ink) !important; }
[data-theme="dark"] .detail-tabs { border-bottom-color:var(--line) !important; }
[data-theme="dark"] .detail-tabs button { color:var(--muted) !important; }
[data-theme="dark"] .detail-tabs button.active { color:var(--ink) !important; }
[data-theme="dark"] .comment-history { color:var(--ink) !important; }
[data-theme="dark"] .comment-item { color:var(--ink) !important; }
[data-theme="dark"] .comment-item p,
[data-theme="dark"] .comment-item p b { color:var(--ink) !important; }
[data-theme="dark"] .comment-item small { color:var(--muted) !important; }
[data-theme="dark"] .composer-card { background:var(--surface) !important; border-color:var(--line) !important; }
[data-theme="dark"] .comment-editor { background:var(--surface) !important; color:var(--ink) !important; caret-color:var(--spruce-dark); }
[data-theme="dark"] .comment-editor:empty:before { color:#d2dacd !important; }
[data-theme="dark"] .editor-toolbar,
[data-theme="dark"] .composer-footer { background:#181d16 !important; border-color:var(--line) !important; }
[data-theme="dark"] .editor-toolbar button,
[data-theme="dark"] .visibility-toggle,
[data-theme="dark"] .cc-label,
[data-theme="dark"] .attach-button { color:var(--muted) !important; }
[data-theme="dark"] .editor-toolbar button:hover,
[data-theme="dark"] .attach-button:hover { color:var(--spruce-dark) !important; }
[data-theme="dark"] .visibility-toggle.active,
[data-theme="dark"] .visibility-toggle.public.active { background:var(--spruce-pale) !important; color:var(--spruce-dark) !important; }
[data-theme="dark"] #commentCc { background:var(--surface) !important; border-color:var(--line) !important; color:var(--ink) !important; }
[data-theme="dark"] #commentCc::placeholder { color:var(--muted) !important; }

/* ---------- Remove number input spinner arrows ---------- */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
input[type="number"] { appearance:textfield; -moz-appearance:textfield; }

/* ---------- Remove native scrollbar arrow buttons ---------- */
*::-webkit-scrollbar { width:10px; height:10px; }
*::-webkit-scrollbar-button { width:0; height:0; display:none; }
*::-webkit-scrollbar-track { background:transparent; }
*::-webkit-scrollbar-thumb { border:2px solid transparent; border-radius:999px; background:#c7d0c8; background-clip:content-box; }
*::-webkit-scrollbar-thumb:hover { background:#9fac9f; background-clip:content-box; }
[data-theme="dark"] *::-webkit-scrollbar-thumb { background:#526050; background-clip:content-box; }
[data-theme="dark"] *::-webkit-scrollbar-thumb:hover { background:#70806d; background-clip:content-box; }

/* ---------- Ticket comments: primary post action ---------- */
.post-button { background:var(--spruce) !important; color:#fff !important; }
.post-button:hover { background:var(--spruce-dark) !important; }
[data-theme="dark"] .post-button { background:var(--spruce) !important; color:#fff !important; }
[data-theme="dark"] .post-button:hover { background:var(--spruce-dark) !important; color:#fff !important; }

/* ---------- Ticket detail: hide description toolbar buttons ---------- */
.detail-grid .editor-tools { display:none !important; }

/* ---------- Ticket detail: remove Incident origin row ---------- */
#detailOrigin { display:none !important; }
#detailOrigin:has(+ *) { display:none !important; }
#detailOrigin:is(b) { display:none !important; }
#detailOrigin:is(b) { visibility:hidden !important; }
#detailOrigin:is(b)::before { content:none !important; }
#detailOrigin:is(b)::after { content:none !important; }
.detail-side-card div:has(#detailOrigin) { display:none !important; }

/* ---------- Overview: My Tasks widget ---------- */
.my-tasks-panel { min-height:220px; }
.overview-my-tasks-list { display:grid; gap:8px; margin-top:-4px; }
.overview-my-task { width:100%; display:flex; align-items:center; gap:10px; padding:12px 0; border-top:1px solid var(--line); background:none; color:var(--ink); text-align:left; }
.overview-my-task:first-child { border-top:0; }
.overview-my-task:hover { background:var(--accent-hover); margin:0 -10px; padding-left:10px; padding-right:10px; border-radius:6px; }
.overview-my-task span:nth-child(2) { flex:1; min-width:0; }
.overview-my-task b { display:block; overflow:hidden; color:var(--ink); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.overview-my-task small { display:block; overflow:hidden; margin-top:3px; color:var(--muted); font-size:10.5px; text-overflow:ellipsis; white-space:nowrap; }
.overview-my-task > span:last-child { color:#9aa49b; font-size:16px; }
[data-theme="dark"] .overview-my-task { border-top-color:var(--line); color:var(--ink); }
[data-theme="dark"] .overview-my-task:hover { background:var(--hover-bg); }
[data-theme="dark"] .overview-my-task small { color:var(--muted); }

/* ---------- Ticket view editor: multi-state selector ---------- */
.state-multi-select { position:relative; flex:1; min-width:0; }
.state-multi-trigger { display:flex; align-items:center; justify-content:space-between; width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:4px; background:var(--surface); color:var(--ink-2); font-size:11px; text-align:left; }
.state-multi-trigger:after { content:""; display:block; width:6px; height:6px; margin-left:10px; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:rotate(45deg) translateY(-2px); }
.state-multi-select.open .state-multi-trigger { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; }
.state-multi-select.open .state-multi-trigger:after { transform:rotate(225deg) translate(-1px,-1px); }
.state-multi-menu { position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:35; display:none; max-height:230px; overflow-y:auto; padding:6px; border:1px solid #d9e0e4; border-radius:7px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }
.state-multi-select.open .state-multi-menu { display:grid; gap:2px; }
.state-multi-menu label { display:flex; align-items:center; gap:8px; padding:8px 9px; border-radius:5px; color:#34434d; font-size:12px; font-weight:600; cursor:pointer; }
.state-multi-menu label:hover { background:var(--spruce-pale); color:var(--spruce-dark); }
.state-multi-menu input { width:14px; height:14px; margin:0; accent-color:var(--spruce); }
[data-theme="dark"] .state-multi-trigger { background:var(--surface); border-color:var(--line); color:var(--ink); }
[data-theme="dark"] .state-multi-menu { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .state-multi-menu label { color:var(--ink); }
[data-theme="dark"] .state-multi-menu label:hover { background:var(--hover-bg); color:var(--spruce-dark); }

/* ---------- Ticket filter bar: multi-state selector ---------- */
.ticket-filters .filter-select.has-state-multi-select { padding:0; }
.ticket-filters .filter-select.has-state-multi-select > span { display:none; }
.ticket-state-multi-select { position:relative; width:100%; flex:1; min-width:0; }
.ticket-state-multi-trigger { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:0; padding:12px 13px; border:0; border-radius:7px; background:#f1f2f1; color:var(--ink-2); font-size:12px; text-align:left; }
.ticket-state-multi-trigger:after { content:""; display:block; width:6px; height:6px; margin-left:auto; border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:rotate(45deg) translateY(-2px); }
.ticket-state-multi-select.open .ticket-state-multi-trigger { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; }
.ticket-state-multi-select.open .ticket-state-multi-trigger:after { transform:rotate(225deg) translate(-1px,-1px); }
.ticket-state-multi-menu { position:absolute; top:calc(100% + 6px); left:0; z-index:35; display:none; width:max-content; min-width:220px; max-width:min(300px,calc(100vw - 32px)); max-height:260px; overflow-y:auto; padding:6px; border:1px solid #d9e0e4; border-radius:7px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }
.ticket-state-multi-select.open .ticket-state-multi-menu { display:block; }
.ticket-state-multi-search { width:100%; margin:0 0 5px; padding:8px 9px; border:1px solid #dfe4df; border-radius:4px; background:#fbfcfa; color:#34434d; font-size:11px; outline:none; }
.ticket-state-options { display:grid; gap:2px; }
.ticket-state-options label { display:flex; align-items:center; gap:8px; padding:8px 9px; border-radius:5px; color:#34434d; font-size:12px; font-weight:600; cursor:pointer; }
.ticket-state-options label:hover { background:var(--spruce-pale); color:var(--spruce-dark); }
.ticket-state-options input { width:14px; height:14px; margin:0; accent-color:var(--spruce); }
[data-theme="dark"] .ticket-state-multi-trigger { background:var(--surface); color:var(--ink); }
[data-theme="dark"] .ticket-state-multi-menu { background:var(--surface); border-color:var(--line); }
[data-theme="dark"] .ticket-state-multi-search { background:var(--surface); border-color:var(--line); color:var(--ink); }

/* ---------- Ticket filter controls ---------- */
.ticket-filters {
	gap:8px;
	padding:10px;
	margin-bottom:16px;
	border:1px solid #e1e6e0;
	border-radius:8px;
	background:#f7f8f5;
}
.ticket-filters .filter-select.has-state-multi-select {
	display:block;
	min-width:0;
	padding:0;
	border:0;
	border-radius:6px;
	background:transparent;
	box-shadow:none;
}
.ticket-filters .filter-select.has-state-multi-select:after { content:none !important; display:none !important; }
.ticket-filters .filter-select.has-state-multi-select > span {
	display:block;
	margin:0 0 5px 2px;
	color:#69756d;
	font-size:9px;
	font-weight:800;
	letter-spacing:.06em;
	line-height:1;
	text-transform:uppercase;
}
.ticket-state-multi-trigger {
	min-height:36px;
	padding:8px 11px;
	border:1px solid #d5ddd6;
	border-radius:6px;
	background:#fff;
	color:var(--ink-2);
	font-size:12px;
	font-weight:600;
	box-shadow:0 1px 1px rgba(39,51,47,.04);
	transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.ticket-state-multi-trigger:hover { border-color:#9eafa3; background:#fcfdfb; }
.ticket-state-multi-trigger:after { width:7px; height:7px; border-color:var(--muted); }
.ticket-state-multi-select.open .ticket-state-multi-trigger {
	border-color:var(--spruce);
	background:#fbfdfb;
	box-shadow:0 0 0 3px var(--control-focus);
}
.ticket-state-multi-menu {
	top:calc(100% + 7px);
	min-width:250px;
	padding:7px;
	border-color:var(--line-strong);
	border-radius:7px;
	box-shadow:0 16px 30px rgba(33,48,40,.17), 0 2px 6px rgba(33,48,40,.08);
}
.ticket-state-multi-search { min-height:34px; padding:8px 10px; border-radius:5px; }
.ticket-state-options { display:grid; gap:2px; }
.ticket-state-options label {
	display:flex;
	align-items:center;
	gap:8px;
	min-height:34px;
	padding:7px 8px;
	border-radius:5px;
	color:#415047;
	font-size:12px;
	font-weight:500;
}
.ticket-state-options label:hover { background:var(--spruce-pale); color:var(--spruce-dark); }
.ticket-state-options input { width:15px; height:15px; margin:0; accent-color:var(--spruce); }
[data-theme="dark"] .ticket-filters { border-color:#3c493e; background:#1b221b; }
[data-theme="dark"] .ticket-filters .filter-select.has-state-multi-select > span { color:#afbab0; }
[data-theme="dark"] .ticket-state-multi-trigger { border-color:#4b584d; background:var(--surface-2); color:var(--ink); box-shadow:none; }
[data-theme="dark"] .ticket-state-multi-trigger:hover,[data-theme="dark"] .ticket-state-multi-select.open .ticket-state-multi-trigger { background:var(--hover-bg); }
[data-theme="dark"] .ticket-state-options label { color:var(--ink); }
[data-theme="dark"] .ticket-state-options label:hover { background:var(--hover-bg); }

/* ---------- Ticket action toolbar ---------- */
.ticket-page-actions {
	gap:5px;
	padding:5px;
	border:1px solid #e0e5df;
	border-radius:8px;
	background:#f7f8f5;
	box-shadow:0 1px 1px rgba(39,51,47,.03);
}
.ticket-page-actions .square-action,
.ticket-page-actions .action-menu,
.ticket-page-actions .columns-button,
.ticket-page-actions .view-size-control .custom-select-trigger {
	min-height:34px;
	border-color:#d2dbd3;
	border-radius:5px;
	background:#fff;
	box-shadow:0 1px 1px rgba(39,51,47,.04);
}
.ticket-page-actions .square-action {
	width:34px;
	border-color:var(--spruce);
	background:var(--spruce);
	color:#fff;
	font-size:22px;
	font-weight:500;
	box-shadow:0 2px 0 rgba(20,54,45,.2);
}
.ticket-page-actions .square-action { order:1; }
.ticket-page-actions .view-size-control { order:2; }
.ticket-page-actions .action-menu-wrapper { order:3; }
.ticket-page-actions .column-toolbar { order:4; }
.ticket-page-actions .square-action:hover { border-color:var(--spruce-dark); background:var(--spruce-dark); color:#fff; }
.ticket-page-actions .action-menu,
.ticket-page-actions .columns-button { padding:0 11px; color:#355f52; font-weight:700; }
.ticket-page-actions .action-menu:hover,
.ticket-page-actions .columns-button:hover,
.ticket-page-actions .view-size-control .custom-select-trigger:hover { border-color:#a5b6a9; background:#fbfdfb; color:var(--spruce-dark); }
.ticket-page-actions .action-menu span,
.ticket-page-actions .columns-button span { padding-left:7px; color:#738178; }
.ticket-page-actions .view-size-control {
	gap:6px;
	margin:0 3px;
	color:#69756d;
	font-size:10px !important;
	font-weight:800;
	letter-spacing:.05em;
	text-transform:uppercase;
}
.ticket-page-actions .view-size-control .custom-select-wrapper { min-width:70px; }
.ticket-page-actions .view-size-control .custom-select-trigger {
	min-height:34px;
	padding:8px 9px;
	color:#3e5145;
	font-size:12px;
	font-weight:700;
}
.ticket-page-actions .action-menu-dropdown,
.ticket-page-actions .columns-menu { margin-top:2px; }
[data-theme="dark"] .ticket-page-actions { border-color:#3b493d; background:#1b221b; }
[data-theme="dark"] .ticket-page-actions { border-color:#3b493d; background:#1b221b; }
[data-theme="dark"] .ticket-page-actions .square-action { border-color:var(--spruce); background:var(--spruce); color:#122019; }
[data-theme="dark"] .ticket-page-actions .action-menu,
[data-theme="dark"] .ticket-page-actions .columns-button,
[data-theme="dark"] .ticket-page-actions .view-size-control .custom-select-trigger { border-color:var(--ink-2); background:var(--surface-2); color:var(--ink); }
[data-theme="dark"] .ticket-page-actions .view-size-control { color:#aeb9af; }

/* Keep wide ticket tables inside their panel surface. */
.ticket-panel { overflow-x:auto; overflow-y:hidden; }
.ticket-tab-panel .ticket-panel { overflow-x:auto !important; overflow-y:hidden !important; }
.ticket-table-head { background:var(--surface) !important; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.ticket-row .status { width:100%; min-width:0; max-width:100%; white-space:normal; overflow-wrap:anywhere; line-height:1.3; }
.ticket-row .ticket-state-chip { display:flex; align-items:flex-start; gap:7px; min-height:30px; padding:6px 8px; border:1px solid #cfe0d4; border-radius:5px; background:#f2f8f3; color:var(--spruce); font-size:10px !important; font-weight:800; line-height:1.25; }
.ticket-row .ticket-state-chip:before { content:none; }
.ticket-row .ticket-state-chip > i { flex:0 0 7px; width:7px; height:7px; margin-top:3px; border-radius:50%; background:#55966d; }
.ticket-row .ticket-state-chip > span { min-width:0; }
.ticket-row .ticket-state-chip.state-new,.ticket-row .ticket-state-chip.state-assigned,.ticket-row .ticket-state-chip.state-working,.ticket-row .ticket-state-chip.state-approved { border-color:#cddce9; background:#f0f6fa; color:#35627d; }
.ticket-row .ticket-state-chip.state-new > i,.ticket-row .ticket-state-chip.state-assigned > i,.ticket-row .ticket-state-chip.state-working > i,.ticket-row .ticket-state-chip.state-approved > i { background:#5b8caf; }
.ticket-row .ticket-state-chip.state-pending-customer,.ticket-row .ticket-state-chip.state-pending-escalation,.ticket-row .ticket-state-chip.state-waiting-for-approval { border-color:#ead9a6; background:#fff9e8; color:#8d6c22; }
.ticket-row .ticket-state-chip.state-pending-customer > i,.ticket-row .ticket-state-chip.state-pending-escalation > i,.ticket-row .ticket-state-chip.state-waiting-for-approval > i { background:#d5a33c; }
.ticket-row .ticket-state-chip.state-onsite-required { border-color:#e9c8bc; background:#fff4f0; color:#a44a39; }
.ticket-row .ticket-state-chip.state-onsite-required > i { background:#c96d55; }
.ticket-row .ticket-state-chip.state-resolved,.ticket-row .ticket-state-chip.state-closed { border-color:#d9dfdb; background:#f4f6f4; color:#627068; }
.ticket-row .ticket-state-chip.state-resolved > i,.ticket-row .ticket-state-chip.state-closed > i { background:#86948b; }
[data-theme="dark"] .ticket-row .ticket-state-chip { border-color:#3d5b47; background:#223329; color:var(--spruce-dark); }
[data-theme="dark"] .ticket-row .ticket-state-chip.state-new,[data-theme="dark"] .ticket-row .ticket-state-chip.state-assigned,[data-theme="dark"] .ticket-row .ticket-state-chip.state-working,[data-theme="dark"] .ticket-row .ticket-state-chip.state-approved { border-color:#38576b; background:#202f39; color:#b6d9ec; }
[data-theme="dark"] .ticket-row .ticket-state-chip.state-pending-customer,[data-theme="dark"] .ticket-row .ticket-state-chip.state-pending-escalation,[data-theme="dark"] .ticket-row .ticket-state-chip.state-waiting-for-approval { border-color:#64552c; background:#352f1d; color:#e8c164; }
[data-theme="dark"] .ticket-row .ticket-state-chip.state-onsite-required { border-color:#70433a; background:#39251f; color:#e2907a; }

/* ---------- Tickets workspace refresh ---------- */
#ticketsView .ticket-page-heading { align-items:center; min-height:54px; margin-bottom:6px; padding-bottom:12px; border-bottom:1px solid var(--line); }
#ticketsView .ticket-page-heading h1 { color:#25372e; font-size:30px; }
#ticketsView .ticket-title-line { gap:8px; }
#ticketsView .title-menu { display:grid; place-items:center; width:28px; height:28px; border:1px solid transparent; border-radius:5px; color:var(--muted); font-size:16px; }
#ticketsView .title-menu:hover { border-color:#cdd8d0; background:#f1f5f1; color:var(--spruce-dark); }
#ticketsView .ticket-view-selector { display:flex; align-items:center; gap:22px; min-height:52px; padding:10px 16px; border:1px solid #dde4de; border-radius:6px; background:#f4f6f3; color:#25372e; font:700 28px Inter, sans-serif; text-align:left; }.ticket-view-selector span { display:grid; place-items:center; width:18px; height:18px; color:transparent; font-size:0; }.ticket-view-selector span:after { content:""; width:7px; height:7px; border-right:1.8px solid var(--muted); border-bottom:1.8px solid var(--muted); transform:rotate(45deg) translate(-1px,-1px); }.ticket-view-selector:hover { border-color:var(--control-hover); color:var(--spruce-dark); }.ticket-view-selector[aria-expanded="true"] { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }.ticket-view-selector[aria-expanded="true"] span:after { transform:rotate(225deg) translate(-1px,-1px); }[data-theme="dark"] #ticketsView .ticket-view-selector { border-color:var(--ink-2); background:#242c23; color:var(--ink); }
#ticketsView .ticket-view-tabs { gap:20px; margin:0 0 12px; padding:0 2px; border-bottom-color:#dfe5df; }
#ticketsView .ticket-view-tab { position:relative; min-height:42px; margin:0; padding:12px 2px 10px; color:#78857d; font-size:12px; }
#ticketsView .ticket-view-tab.active { color:var(--spruce-dark); }
#ticketsView .ticket-view-tab.active:after { height:3px; border-radius:3px 3px 0 0; }
#ticketsView .ticket-meta-row { min-height:35px; margin:0 0 10px; padding:0 3px 10px; border-bottom:0; color:#95a097; font-size:11px; }
#ticketsView .edit-view-button { padding:5px 0; color:var(--spruce); font-size:10px; letter-spacing:.08em; }
#ticketsView .ticket-filters { margin-bottom:14px; border-color:#dfe6df; box-shadow:0 4px 12px rgba(44,57,51,.035); }
#ticketsView .ticket-panel { border-color:#dbe2db; border-radius:8px; box-shadow:0 8px 22px rgba(44,57,51,.055); }
#ticketsView .ticket-table-head { min-height:48px; padding-top:12px; padding-bottom:12px; background:#f4f7f3 !important; border-top:0; border-bottom-color:#dce4dc; color:#66746b; font-size:10px !important; font-weight:800 !important; letter-spacing:.06em !important; }
#ticketsView .ticket-table-head > [data-column-key] { background:#f4f7f3; }
#ticketsView .ticket-row { min-height:72px; padding-top:12px; padding-bottom:12px; border-top-color:#e5ebe5; background:var(--surface); transition:background .16s ease, box-shadow .16s ease; }
#ticketsView .ticket-row:hover { position:relative; z-index:1; background:#f7faf6; box-shadow:inset 3px 0 0 var(--spruce), 0 3px 10px rgba(44,57,51,.05); }
#requesterPortalView { margin:-38px -42px -60px; min-height:calc(100vh - 76px); background:var(--paper); }.requester-portal-shell { min-height:calc(100vh - 76px); color:var(--ink); }.requester-portal-header { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:72px; padding:0 42px; border-bottom:1px solid #dde5dd; background:var(--surface); }.requester-portal-brand,.requester-portal-user { display:flex; align-items:center; gap:10px; }.requester-portal-brand > span:last-child,.requester-portal-user > span:nth-child(2) { display:grid; gap:2px; }.requester-portal-brand b { font:800 18px Inter, sans-serif; }.requester-portal-brand small,.requester-portal-user small { color:#7a877d; font-size:10px; }.requester-portal-mark { display:grid; place-items:center; width:34px; height:34px; border-radius:7px; background:var(--spruce); color:#fff; font:800 18px Inter, sans-serif; }.requester-portal-user b { font-size:12px; }.requester-portal-user .quiet-button { margin-left:8px; }.requester-portal-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.85fr); gap:42px; align-items:center; padding:46px 42px 34px; background:var(--spruce-pale); }.requester-portal-hero h1 { margin:7px 0 8px; font:700 34px Inter, sans-serif; letter-spacing:0; }.requester-portal-hero p:not(.eyebrow) { max-width:520px; margin:0; color:#56675b; font-size:14px; line-height:1.55; }.requester-portal-search { position:relative; display:flex; align-items:center; gap:10px; padding:13px 15px; border:1px solid #bfd2c3; border-radius:7px; background:var(--surface); box-shadow:0 9px 20px rgba(44,57,51,.08); }.requester-portal-search > span { color:var(--spruce); font-size:21px; }.requester-portal-search input { flex:1; min-width:0; border:0; outline:0; background:none; color:var(--ink); font-size:13px; }.requester-portal-search > div { position:absolute; top:calc(100% + 7px); right:0; left:0; z-index:30; overflow:hidden; border:1px solid #cddbcf; border-radius:7px; background:var(--surface); box-shadow:0 16px 30px rgba(39,51,47,.16); }.requester-portal-search > div button { display:grid; grid-template-columns:22px 1fr; column-gap:9px; width:100%; padding:10px 12px; background:none; color:var(--ink); text-align:left; }.requester-portal-search > div button:hover { background:var(--accent-hover); }.requester-portal-search > div button > span { grid-row:span 2; color:var(--spruce); }.requester-portal-search > div b,.requester-portal-search > div small { display:block; }.requester-portal-search > div b { font-size:12px; }.requester-portal-search > div small { margin-top:2px; color:var(--muted); font-size:10px; }.requester-portal-search > div p { margin:0; padding:13px; color:var(--muted); font-size:12px; }.requester-portal-nav { display:flex; gap:26px; padding:0 42px; border-bottom:1px solid var(--line); background:var(--surface); }.requester-portal-nav button { position:relative; min-height:48px; padding:0 2px; background:none; color:var(--muted); font-size:12px; font-weight:700; }.requester-portal-nav button.active { color:var(--spruce-dark); }.requester-portal-nav button.active:after { content:""; position:absolute; right:0; bottom:0; left:0; height:3px; border-radius:3px 3px 0 0; background:var(--spruce); }.requester-portal-main { max-width:1320px; margin:0 auto; padding:30px 42px 60px; }.requester-portal-panel { display:none; }.requester-portal-panel.active { display:block; }.requester-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:28px; }.requester-summary-grid article { padding:18px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }.requester-summary-grid span,.requester-summary-grid small { display:block; }.requester-summary-grid span { color:#728077; font-size:11px; font-weight:700; }.requester-summary-grid strong { display:block; margin:7px 0 4px; color:#25372e; font:700 26px Inter, sans-serif; }.requester-summary-grid small { color:#8a968d; font-size:10px; }.requester-portal-section { margin-top:28px; }.requester-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:14px; }.requester-section-heading h2 { margin:0 0 4px; font:700 19px Inter, sans-serif; }.requester-section-heading p { margin:0; color:var(--muted); font-size:12px; }.requester-section-heading .outline-button { padding:8px 10px; font-size:11px; }.requester-service-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.requester-service-grid.full { grid-template-columns:repeat(3,minmax(0,1fr)); }.requester-service-card { display:grid; grid-template-columns:34px minmax(0,1fr) 18px; gap:10px; align-items:start; min-height:145px; padding:16px; border:1px solid #dce6dc; border-radius:7px; background:var(--surface); color:var(--ink); text-align:left; }.requester-service-card:hover { border-color:var(--accent-border); background:#fbfefb; box-shadow:0 6px 15px rgba(44,57,51,.07); }.requester-service-card > span:nth-child(2) { min-width:0; }.requester-service-card b,.requester-service-card small { display:block; }.requester-service-card b { margin-top:2px; font:700 14px Inter, sans-serif; }.requester-service-card small { margin-top:7px; color:var(--muted); font-size:11px; line-height:1.45; }.requester-service-card i { padding-top:3px; color:#7d8b80; font-size:17px; font-style:normal; }.requester-service-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:7px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:16px; font-weight:700; }.requester-portal-two-column { display:grid; grid-template-columns:1.45fr 1fr; gap:22px; }.requester-request-list { display:grid; gap:8px; }.requester-request-list.full { max-width:900px; }.requester-request-row { display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%; padding:13px 14px; border:1px solid #dce6dc; border-radius:7px; background:var(--surface); color:var(--ink); text-align:left; }.requester-request-row:hover { border-color:var(--accent-border); background:#fbfefb; }.requester-request-copy { min-width:0; }.requester-request-copy b,.requester-request-copy small { display:block; }.requester-request-copy b { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.requester-request-copy small { margin-top:4px; color:#839087; font-size:10px; }.requester-request-row .ticket-state-chip { flex:0 0 auto; max-width:150px; }.requester-notice-section { padding:18px; border:1px solid #dce6dc; border-radius:7px; background:var(--surface); }.requester-notice { display:grid; grid-template-columns:8px minmax(0,1fr); gap:10px; padding:11px 0; border-top:1px solid #edf1ed; }.requester-notice:first-child { padding-top:0; border-top:0; }.requester-notice-dot { width:8px; height:8px; margin-top:5px; border-radius:50%; background:var(--saffron); }.requester-notice b,.requester-notice p,.requester-notice small { display:block; }.requester-notice b { font-size:11px; }.requester-notice p { margin:4px 0; color:var(--ink-2); font-size:11px; line-height:1.4; }.requester-notice small { color:#8a968d; font-size:10px; }.requester-knowledge-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.requester-knowledge-card { padding:17px; border:1px solid #dce6dc; border-radius:7px; background:var(--surface); }.requester-knowledge-card h3 { margin:11px 0 7px; font:700 15px Inter, sans-serif; }.requester-knowledge-card p { margin:0 0 14px; color:var(--muted); font-size:12px; line-height:1.5; }.requester-knowledge-card small { color:#8a968d; font-size:10px; }.requester-empty { margin:0; padding:22px; border:1px dashed #cddbcf; border-radius:7px; color:var(--muted); font-size:12px; text-align:center; }[data-theme="dark"] #requesterPortalView { background:#151b15; }.requester-portal-view [class*="requester-"] { border-color:var(--line); }.requester-portal-view .requester-portal-header,.requester-portal-view .requester-portal-nav,.requester-portal-view .requester-summary-grid article,.requester-portal-view .requester-service-card,.requester-portal-view .requester-request-row,.requester-portal-view .requester-notice-section,.requester-portal-view .requester-knowledge-card { background:var(--surface); color:var(--ink); }.requester-portal-view .requester-portal-hero { background:#223329; }.requester-portal-view .requester-portal-hero h1 { color:var(--ink); }.requester-portal-view .requester-portal-hero p:not(.eyebrow),.requester-portal-view .requester-section-heading p,.requester-portal-view .requester-service-card small,.requester-portal-view .requester-knowledge-card p { color:var(--muted); }@media (max-width:1050px){#requesterPortalView{margin:-30px -25px -50px}.requester-portal-header,.requester-portal-hero,.requester-portal-nav{padding-left:25px;padding-right:25px}.requester-portal-main{padding-left:25px;padding-right:25px}.requester-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.requester-service-grid.full,.requester-knowledge-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:700px){#requesterPortalView{margin:-38px -16px -60px}.requester-portal-header{align-items:flex-start; flex-direction:column; padding:16px}.requester-portal-user{width:100%; justify-content:space-between}.requester-portal-hero{grid-template-columns:1fr;gap:22px;padding:30px 16px}.requester-portal-hero h1{font-size:28px}.requester-portal-nav{gap:17px;overflow-x:auto;padding:0 16px}.requester-portal-main{padding:22px 16px 44px}.requester-summary-grid,.requester-service-grid,.requester-service-grid.full,.requester-portal-two-column,.requester-knowledge-grid{grid-template-columns:1fr}.requester-section-heading{align-items:flex-start;flex-direction:column}.requester-request-row{align-items:flex-start;flex-direction:column}.requester-request-row .ticket-state-chip{max-width:none}}
#overviewView .lower-grid { grid-template-columns:minmax(0,1fr); }
body.requester-portal-mode .sidebar,body.requester-portal-mode .topbar,body.requester-portal-mode .side-toolbar { display:none !important; }
body.requester-portal-mode .main-content { width:100% !important; }
[data-theme="light"] #requesterPortalView .requester-portal-hero,:root:not([data-theme]) #requesterPortalView .requester-portal-hero { background:var(--spruce-pale) !important; }[data-theme="light"] #requesterPortalView .requester-portal-hero h1,:root:not([data-theme]) #requesterPortalView .requester-portal-hero h1 { color:var(--ink) !important; }[data-theme="light"] #requesterPortalView .requester-portal-hero p:not(.eyebrow),:root:not([data-theme]) #requesterPortalView .requester-portal-hero p:not(.eyebrow) { color:#43584a !important; }[data-theme="light"] #requesterPortalView .requester-portal-hero .eyebrow,:root:not([data-theme]) #requesterPortalView .requester-portal-hero .eyebrow { color:#245747 !important; }
[data-theme="dark"] #requesterPortalView .requester-portal-hero { background:var(--spruce-pale) !important; }[data-theme="dark"] #requesterPortalView .requester-portal-hero h1 { color:#f4f7f1 !important; }[data-theme="dark"] #requesterPortalView .requester-portal-hero p:not(.eyebrow) { color:#d2ddd3 !important; }[data-theme="dark"] #requesterPortalView .requester-portal-hero .eyebrow { color:var(--spruce) !important; }
.agent-profile-menu { position:relative; }.agent-profile-button { display:flex; align-items:center; gap:8px; min-height:40px; padding:4px 8px; border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink-2); text-align:left; }.agent-profile-button > span:nth-child(2) { display:grid; gap:2px; min-width:0; }.agent-profile-button b { font-size:12px; }.agent-profile-button small { color:#7a877d; font-size:10px; }.agent-profile-chevron { color:#87948a; font-size:15px; }.agent-profile-button:hover,.agent-profile-menu.open .agent-profile-button { border-color:var(--accent-border); background:#f6faf6; }.agent-profile-dropdown { position:absolute; top:calc(100% + 7px); right:0; z-index:40; display:none; width:190px; padding:5px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }.agent-profile-menu.open .agent-profile-dropdown { display:grid; }.agent-profile-menu.open .agent-profile-chevron { transform:rotate(180deg); }.agent-profile-dropdown button { width:100%; padding:9px 10px; border-radius:5px; background:none; color:var(--ink-2); font-size:12px; text-align:left; }.agent-profile-dropdown button:hover { background:var(--spruce-pale); color:var(--spruce-dark); }[data-theme="dark"] .agent-profile-button,[data-theme="dark"] .agent-profile-dropdown { border-color:var(--line); background:var(--surface); color:var(--ink); }[data-theme="dark"] .agent-profile-dropdown button { color:var(--ink); }[data-theme="dark"] .agent-profile-dropdown button:hover { background:var(--hover-bg); }@media (max-width:700px){.agent-profile-button > span:nth-child(2),.agent-profile-chevron{display:none}.agent-profile-button{padding:4px;min-height:34px}}
.privacy-policy-modal { width:min(780px,calc(100vw - 32px)); max-height:calc(100vh - 32px); overflow-y:auto; }.privacy-policy-modal h2 { margin:7px 0 2px; font:700 26px Inter, sans-serif; }.privacy-effective { margin:0 0 18px; color:var(--muted); font-size:11px; }.privacy-policy-content { display:grid; gap:17px; }.privacy-policy-content section { padding-top:15px; border-top:1px solid var(--line); }.privacy-policy-content h3 { margin:0 0 6px; color:#345343; font:700 14px Inter, sans-serif; }.privacy-policy-content p { margin:0; color:#5c6861; font-size:12px; line-height:1.6; }.privacy-policy-content .outline-button { margin-top:10px; font-size:11px; }[data-theme="dark"] .privacy-policy-content h3 { color:var(--spruce-dark); }[data-theme="dark"] .privacy-policy-content p { color:var(--muted); }
.legal-documentation-modal { width:min(560px,calc(100vw - 32px)); }.legal-documentation-modal h2 { margin:7px 0 5px; font:700 26px Inter, sans-serif; }.legal-documentation-modal > p { margin:0; color:var(--muted); font-size:12px; line-height:1.55; }.legal-document-list { display:grid; gap:8px; margin-top:22px; }.legal-document-list button { display:flex; align-items:center; justify-content:space-between; gap:18px; width:100%; padding:14px 15px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); text-align:left; }.legal-document-list button:hover { border-color:#9eb9a4; background:#f3f8f3; }.legal-document-list span { display:grid; gap:4px; }.legal-document-list b { font-size:13px; }.legal-document-list small { color:var(--muted); font-size:10.5px; line-height:1.4; }.legal-document-list i { color:var(--spruce); font-size:18px; font-style:normal; }[data-theme="dark"] .legal-document-list button:hover { border-color:#4a6b55; background:var(--hover-bg); }
.requester-summary-card-action { position:relative; padding:18px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); text-align:left; }.requester-summary-card-action:hover { border-color:var(--accent-border); background:#fbfefb; }.requester-summary-card-action span,.requester-summary-card-action small { display:block; }.requester-summary-card-action span { color:#728077; font-size:11px; font-weight:700; }.requester-summary-card-action strong { display:block; margin:7px 0 4px; color:#25372e; font:700 26px Inter, sans-serif; }.requester-summary-card-action small { color:#8a968d; font-size:10px; }.requester-summary-card-action i { position:absolute; top:18px; right:18px; color:#7b897f; font-size:18px; font-style:normal; }[data-theme="dark"] .requester-summary-card-action { border-color:var(--line); background:var(--surface); color:var(--ink); }[data-theme="dark"] .requester-summary-card-action strong { color:var(--ink); }
.knowledge-article-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; }.knowledge-visibility { display:flex; align-items:center; gap:5px; }.knowledge-visibility select { width:auto; padding:4px 6px; border:1px solid #d5dfd6; border-radius:4px; background:#fff; color:var(--ink-2); font-size:10px; }.visibility-badge { padding:3px 6px; border-radius:9px; font-size:9px; font-weight:800; text-transform:uppercase; }.visibility-badge.public { background:var(--spruce-pale); color:#245747; }.visibility-badge.internal { background:#f1eee5; color:#786438; }.knowledge-public-permission { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:10px 12px; padding:12px 14px; border:1px solid #cfe0d4; border-radius:7px; background:#f4faf5; }.knowledge-public-permission b,.knowledge-public-permission small { display:block; }.knowledge-public-permission b { color:#345343; font-size:12px; }.knowledge-public-permission small { max-width:470px; margin-top:3px; color:var(--muted); font-size:10.5px; line-height:1.4; }.knowledge-publish-toggle { display:flex; align-items:center; gap:8px; flex:0 0 auto; padding:7px 9px; border:1px solid #bcd3c2; border-radius:5px; background:#fff; color:#2f6848; font-size:11px; font-weight:800; white-space:nowrap; }.knowledge-publish-toggle input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.knowledge-publish-toggle span { text-transform:none; }[data-theme="dark"] .knowledge-visibility select { border-color:var(--line); background:var(--surface); color:var(--ink); }[data-theme="dark"] .knowledge-public-permission { border-color:#3d5b47; background:#203026; }[data-theme="dark"] .knowledge-public-permission b { color:var(--spruce-dark); }[data-theme="dark"] .knowledge-public-permission small { color:var(--muted); }[data-theme="dark"] .knowledge-publish-toggle { border-color:#4a6b55; background:var(--surface); color:var(--spruce-dark); }
.requester-theme-button,.requester-profile-button { border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink-2); }.requester-theme-button { display:grid; place-items:center; width:34px; height:34px; font-size:17px; }.requester-profile-button { display:flex; align-items:center; gap:8px; padding:5px 8px; text-align:left; }.requester-profile-button > span:nth-child(2) { display:grid; gap:2px; }.requester-profile-chevron { color:#87948a; font-size:15px; }.requester-theme-button:hover,.requester-profile-button:hover { border-color:var(--accent-border); background:#f6faf6; }.requester-portal-settings-modal { width:min(620px,calc(100vw - 32px)); max-height:calc(100vh - 32px); overflow-y:auto; }.requester-portal-settings-modal > p { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }.portal-settings-section { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }.portal-settings-section h3 { margin:0 0 12px; font:700 14px Inter, sans-serif; }.portal-settings-section label:not(.portal-settings-toggle) { display:block; margin-top:12px; color:var(--ink-2); font-size:12px; font-weight:700; }.portal-settings-section input:not([type="checkbox"]),.portal-settings-section select { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; }.portal-settings-toggle { display:flex; align-items:center; gap:8px; margin-top:11px; color:#4d5d52; font-size:12px; font-weight:600; }.portal-settings-toggle input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.portal-settings-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:24px; }.portal-settings-actions .outline-button { margin-right:auto; }.requester-portal-settings-modal .save-button { margin:0; }[data-theme="dark"] .requester-theme-button,[data-theme="dark"] .requester-profile-button,[data-theme="dark"] .portal-settings-section input:not([type="checkbox"]),[data-theme="dark"] .portal-settings-section select { border-color:var(--line); background:var(--surface); color:var(--ink); }[data-theme="dark"] .portal-settings-section label:not(.portal-settings-toggle),[data-theme="dark"] .portal-settings-section h3 { color:var(--ink); }
.portal-notification-intro { margin:-5px 0 11px !important; color:#7a877d !important; font-size:11px !important; }.portal-notification-list { display:grid; overflow:hidden; border:1px solid var(--line); border-radius:7px; background:var(--surface); }.portal-notification-option { display:flex !important; align-items:center; justify-content:space-between; gap:18px; margin:0 !important; padding:13px 14px; border-top:1px solid #e6ece6; color:var(--ink) !important; cursor:pointer; }.portal-notification-option:first-child { border-top:0; }.portal-notification-option:hover { background:#f3f8f3; }.portal-notification-option > span { display:grid; gap:3px; min-width:0; }.portal-notification-option b { font-size:12px; }.portal-notification-option small { color:#7a877d; font-size:10.5px; line-height:1.35; }.portal-notification-option input { appearance:none; position:relative; display:block; box-sizing:border-box; flex:0 0 auto; width:34px !important; height:20px !important; margin:0 !important; border:1px solid #b8c7ba; border-radius:12px; background:#dce5dc; cursor:pointer; }.portal-notification-option input:after { content:""; position:absolute; top:2px; left:2px; width:14px; height:14px; margin:0; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(39,51,47,.2); transition:transform .15s ease; }.portal-notification-option input:checked { border-color:var(--spruce); background:var(--spruce); }.portal-notification-option input:checked:after { transform:translateX(14px); }[data-theme="dark"] .portal-notification-list { border-color:var(--line); background:var(--surface); }[data-theme="dark"] .portal-notification-option { border-color:var(--line); }[data-theme="dark"] .portal-notification-option:hover { background:var(--hover-bg); }[data-theme="dark"] .portal-notification-option small,.portal-notification-intro { color:var(--muted); }
.portal-settings-actions { align-items:center; padding-top:4px; }.portal-settings-actions .outline-button,.portal-settings-actions .save-button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 16px; border-radius:6px; font-size:12px; }.portal-settings-actions .outline-button { border-color:#c8d6ca; background:var(--surface); color:#486052; font-weight:700; }.portal-settings-actions .outline-button:hover { border-color:#94b39a; background:#f3f8f3; color:var(--spruce-dark); }.portal-settings-actions .save-button { min-width:126px; box-shadow:0 7px 16px rgba(53,107,93,.2); }.portal-settings-actions .save-button:hover { transform:translateY(-1px); box-shadow:0 10px 20px rgba(53,107,93,.25); }[data-theme="dark"] .portal-settings-actions .outline-button { border-color:var(--line); background:var(--surface); color:var(--ink); }@media (max-width:520px){.portal-settings-actions{flex-direction:column;align-items:stretch}.portal-settings-actions .outline-button{margin-right:0}.portal-settings-actions .outline-button,.portal-settings-actions .save-button{width:100%}}
.requester-notice { display:grid !important; grid-template-columns:8px minmax(0,1fr) 16px !important; align-items:start; width:100%; background:none !important; color:var(--ink); text-align:left; }.requester-notice:hover p { color:var(--spruce-dark); text-decoration:underline; text-underline-offset:2px; }.requester-notice i { align-self:center; color:#849086; font-size:16px; font-style:normal; }
.requester-profile-menu { position:relative; }.requester-profile-dropdown { position:absolute; top:calc(100% + 7px); right:0; z-index:40; display:none; width:190px; padding:5px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }.requester-profile-menu.open .requester-profile-dropdown { display:grid; }.requester-profile-menu.open .requester-profile-chevron { transform:rotate(180deg); }.requester-profile-dropdown button { width:100%; padding:9px 10px; border-radius:5px; background:none; color:var(--ink-2); font-size:12px; text-align:left; }.requester-profile-dropdown button:hover { background:var(--spruce-pale); color:var(--spruce-dark); }[data-theme="dark"] .requester-profile-dropdown { border-color:var(--line); background:var(--surface); }[data-theme="dark"] .requester-profile-dropdown button { color:var(--ink); }[data-theme="dark"] .requester-profile-dropdown button:hover { background:var(--hover-bg); }
#ticketDetailModal .comment-item { display:grid; grid-template-columns:31px minmax(0,1fr); align-items:start; column-gap:12px; }
#ticketDetailModal .comment-item > div { min-width:0; }
#ticketDetailModal .comment-item.posted { border-left:0; padding-left:0; }
#ticketDetailModal .comment-item.posted.private { border-left-color:transparent; }
.ticket-lifecycle-card { border-top-color:#cbd9d2; }.ticket-lifecycle-card h2 { margin-bottom:16px; font:700 16px Inter, sans-serif; }.ticket-lifecycle-card .ticket-lifecycle-list { display:grid !important; gap:0; }.ticket-lifecycle-card .ticket-lifecycle-list > div { display:grid; width:100%; gap:6px; padding:14px 0; border-top:1px solid #edf0eb; }.ticket-lifecycle-card .ticket-lifecycle-list > div:first-child { padding-top:2px; border-top:0; }.ticket-lifecycle-list > div > span { color:var(--muted); font-size:12px; font-weight:800; letter-spacing:.02em; }.ticket-lifecycle-list strong { color:var(--ink-2); font-size:13px; font-weight:700; text-align:left; }.ticket-lifecycle-list time { display:flex !important; align-items:baseline; flex-wrap:wrap; gap:8px; }.ticket-lifecycle-list time > span { color:var(--ink-2); font-size:13px; font-weight:700; }.ticket-lifecycle-list time small { color:#8a9590; font-size:12px; font-weight:500; }[data-theme="dark"] .ticket-lifecycle-list strong,[data-theme="dark"] .ticket-lifecycle-list time > span { color:var(--ink); }
.custom-state-color { display:flex; align-items:center; gap:6px; margin-left:auto; cursor:pointer; }.custom-state-color input { position:absolute; width:1px; height:1px; opacity:0; }.custom-state-color i { display:block; width:22px; height:22px; border:2px solid #fff; border-radius:50%; box-shadow:0 0 0 1px #c8d2cb; }.custom-state-color:focus-within i { box-shadow:0 0 0 3px var(--spruce-pale),0 0 0 1px var(--spruce); }
.ticket-detail .state-dropdown-trigger,.ticket-detail .state-dropdown-option { display:flex; align-items:center; gap:8px; }.ticket-detail .state-dropdown-trigger > i,.ticket-detail .state-dropdown-option > i { flex:0 0 8px; width:8px; height:8px; border-radius:50%; background:#55966d; }.ticket-detail .state-dropdown-trigger.state-new,.ticket-detail .state-dropdown-trigger.state-assigned,.ticket-detail .state-dropdown-trigger.state-working,.ticket-detail .state-dropdown-trigger.state-approved,.ticket-detail .state-dropdown-option.state-new,.ticket-detail .state-dropdown-option.state-assigned,.ticket-detail .state-dropdown-option.state-working,.ticket-detail .state-dropdown-option.state-approved { border-color:#cddce9; background:#f0f6fa; color:#35627d; }.ticket-detail .state-dropdown-trigger.state-new > i,.ticket-detail .state-dropdown-trigger.state-assigned > i,.ticket-detail .state-dropdown-trigger.state-working > i,.ticket-detail .state-dropdown-trigger.state-approved > i,.ticket-detail .state-dropdown-option.state-new > i,.ticket-detail .state-dropdown-option.state-assigned > i,.ticket-detail .state-dropdown-option.state-working > i,.ticket-detail .state-dropdown-option.state-approved > i { background:#5b8caf; }.ticket-detail .state-dropdown-trigger.state-pending-customer,.ticket-detail .state-dropdown-trigger.state-pending-escalation,.ticket-detail .state-dropdown-trigger.state-waiting-for-approval,.ticket-detail .state-dropdown-option.state-pending-customer,.ticket-detail .state-dropdown-option.state-pending-escalation,.ticket-detail .state-dropdown-option.state-waiting-for-approval { border-color:#ead9a6; background:#fff9e8; color:#8d6c22; }.ticket-detail .state-dropdown-trigger.state-pending-customer > i,.ticket-detail .state-dropdown-trigger.state-pending-escalation > i,.ticket-detail .state-dropdown-trigger.state-waiting-for-approval > i,.ticket-detail .state-dropdown-option.state-pending-customer > i,.ticket-detail .state-dropdown-option.state-pending-escalation > i,.ticket-detail .state-dropdown-option.state-waiting-for-approval > i { background:#d5a33c; }.ticket-detail .state-dropdown-trigger.state-onsite-required,.ticket-detail .state-dropdown-option.state-onsite-required { border-color:#e9c8bc; background:#fff4f0; color:#a44a39; }.ticket-detail .state-dropdown-trigger.state-onsite-required > i,.ticket-detail .state-dropdown-option.state-onsite-required > i { background:#c96d55; }.ticket-detail .state-dropdown-trigger.state-resolved,.ticket-detail .state-dropdown-trigger.state-closed,.ticket-detail .state-dropdown-option.state-resolved,.ticket-detail .state-dropdown-option.state-closed { border-color:#d9dfdb; background:#f4f6f4; color:#627068; }.ticket-detail .state-dropdown-trigger.state-resolved > i,.ticket-detail .state-dropdown-trigger.state-closed > i,.ticket-detail .state-dropdown-option.state-resolved > i,.ticket-detail .state-dropdown-option.state-closed > i { background:#86948b; }
.ticket-detail .state-dropdown-trigger.state-new,.ticket-detail .state-dropdown-trigger.state-assigned,.ticket-detail .state-dropdown-trigger.state-working,.ticket-detail .state-dropdown-trigger.state-approved { border-color:#cddce9 !important; background:#f0f6fa !important; }
.ticket-detail .state-dropdown-trigger.state-pending-customer,.ticket-detail .state-dropdown-trigger.state-pending-escalation,.ticket-detail .state-dropdown-trigger.state-waiting-for-approval { border-color:#ead9a6 !important; background:#fff9e8 !important; }
.ticket-detail .state-dropdown-trigger.state-onsite-required { border-color:#e9c8bc !important; background:#fff4f0 !important; }
.ticket-detail .state-dropdown-trigger.state-resolved,.ticket-detail .state-dropdown-trigger.state-closed { border-color:#d9dfdb !important; background:#f4f6f4 !important; }
#ticketDetailModal .detail-cc-field { position:relative; display:block; color:#68727d; font-size:13px; }
.ticket-detail .detail-grid label:has(#detailRequester) { position:relative; }.detail-requester-picker { position:absolute; top:calc(100% + 6px); right:0; left:0; z-index:25; overflow:hidden; border:1px solid var(--line); border-radius:6px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }.detail-requester-picker button { display:grid; grid-template-columns:26px 1fr; column-gap:8px; align-items:center; width:100%; padding:9px 10px; background:none; color:var(--ink); text-align:left; }.detail-requester-picker button:hover { background:var(--accent-hover); }.detail-requester-picker button > span { display:grid; grid-row:span 2; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--spruce-pale); color:var(--spruce-dark); font-size:9px; font-weight:800; }.detail-requester-picker b { font-size:12px; }.detail-requester-picker small { color:var(--muted); font-size:10px; }[data-theme="dark"] .detail-requester-picker { border-color:var(--line); }
.ticket-cc-picker { position:relative; display:flex; flex-wrap:wrap; gap:6px; min-height:44px; margin-top:8px; padding:6px 8px; border:1px solid #dfe3e7; border-radius:5px; background:#fff; }.ticket-cc-picker:focus-within { border-color:#5878ef; box-shadow:0 0 0 2px #e2e8ff; }.ticket-cc-chips { display:flex; flex-wrap:wrap; gap:5px; }.ticket-cc-chips span { display:inline-flex; align-items:center; gap:5px; padding:4px 7px; border-radius:4px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:11px; font-weight:700; }.ticket-cc-chips button { padding:0; background:none; color:inherit; font-size:15px; line-height:1; }.ticket-cc-picker input { flex:1 1 120px; min-width:120px; border:0; outline:0; background:transparent; color:var(--ink); font:inherit; font-size:13px; }.ticket-cc-results { position:absolute; top:calc(100% + 6px); right:0; left:0; z-index:25; overflow:hidden; border:1px solid var(--line); border-radius:6px; background:var(--surface); box-shadow:0 12px 25px rgba(39,51,47,.16); }.ticket-cc-results button { display:grid; grid-template-columns:26px 1fr; column-gap:8px; align-items:center; width:100%; padding:9px 10px; background:none; color:var(--ink); text-align:left; }.ticket-cc-results button:hover { background:var(--accent-hover); }.ticket-cc-results button > span { display:grid; grid-row:span 2; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--spruce-pale); color:var(--spruce-dark); font-size:9px; font-weight:800; }.ticket-cc-results b { font-size:12px; }.ticket-cc-results small { color:var(--muted); font-size:10px; }[data-theme="dark"] .ticket-cc-picker { background:var(--surface); border-color:var(--line); }.ticket-cc-picker input { color:var(--ink); }.ticket-cc-results { border-color:var(--line); }
#ticketDetailModal .editor-toolbar { flex-wrap:wrap; gap:5px; }
#ticketDetailModal .editor-toolbar button { position:relative; display:grid; place-items:center; min-width:30px; padding:0 4px; font-size:16px; }
#ticketDetailModal .editor-toolbar button sup { font-size:8px; line-height:1; }
#ticketDetailModal .editor-toolbar button[data-tooltip]:hover:after,#ticketDetailModal .editor-toolbar button[data-tooltip]:focus-visible:after { content:attr(data-tooltip); position:absolute; bottom:calc(100% + 8px); left:50%; z-index:40; width:max-content; max-width:180px; padding:6px 8px; border-radius:4px; background:#27332f; color:#fff; font:600 11px Inter, sans-serif; transform:translateX(-50%); white-space:nowrap; }
#ticketsView .ticket-number { display:inline-flex; align-items:center; justify-content:center; min-width:42px; padding:4px 6px; border-radius:4px; background:#eef3ef; color:#4b6255; font-size:11px; font-weight:800; }
#ticketsView .ticket-title { color:#2f6b5c; font-size:13px !important; font-weight:750 !important; line-height:1.35 !important; transition:color .16s ease; }
#ticketsView .ticket-row:hover .ticket-title { color:var(--spruce-dark); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
#ticketsView .ticket-requester { margin-top:3px; color:#909b93; font-size:11px !important; }
#ticketsView .table-muted,#ticketsView .requester-cell { color:#65736a; font-size:12px !important; }
#ticketsView .timestamp-cell { color:#78847c; font-size:11px !important; }
#ticketsView .pill { min-width:58px; padding:5px 8px !important; border-radius:5px; text-align:center; font-size:10px !important; font-style:normal; }
#ticketsView .pill.medium { background:#e7f0e9; color:var(--spruce); }
#ticketsView .pill.high { background:#fff2cb; color:#966e12; }
#ticketsView .pill.critical { background:#f9e5df; color:#a44a39; }
#ticketsView .status.ticket-state-chip { box-shadow:inset 0 1px 0 rgba(255,255,255,.58); }
[data-theme="dark"] #ticketsView .ticket-page-heading h1 { color:var(--ink); }
[data-theme="dark"] #ticketsView .title-menu:hover { border-color:var(--ink-2); background:var(--hover-bg); }
[data-theme="dark"] #ticketsView .ticket-table-head { background:#20281f !important; border-bottom-color:var(--line); color:#bcc7bc; }
[data-theme="dark"] #ticketsView .ticket-row { border-top-color:var(--line); background:var(--surface); }
[data-theme="dark"] #ticketsView .ticket-row:hover { background:#232d23; box-shadow:inset 3px 0 0 var(--spruce); }
[data-theme="dark"] #ticketsView .ticket-number { background:#263329; color:var(--spruce-dark); }
[data-theme="dark"] #ticketsView .ticket-title { color:var(--spruce); }
[data-theme="dark"] #ticketsView .table-muted,[data-theme="dark"] #ticketsView .requester-cell { color:#c2cbbf; }

/* ---------- Ticket detail dropdowns ---------- */
.ticket-detail .detail-grid .custom-select-wrapper { width:100%; }
.ticket-detail .detail-grid .custom-select-trigger,
.ticket-detail .state-dropdown-trigger,
.ticket-detail .task-composer-row .custom-select-trigger { min-height:36px; padding:8px 11px; border:1px solid #d5ddd6; border-radius:6px; background:#fff; color:var(--ink-2); box-shadow:0 1px 1px rgba(39,51,47,.04); font-size:12px; font-weight:600; }
.ticket-detail .detail-grid .custom-select-trigger:hover,
.ticket-detail .state-dropdown-trigger:hover { border-color:#9eafa3; background:#fcfdfb; }
.ticket-detail .detail-grid .custom-select-trigger:after,
.ticket-detail .state-dropdown-trigger:after { width:7px; height:7px; border-color:var(--muted); }
.ticket-detail .detail-grid .custom-select-wrapper.open .custom-select-trigger,
.ticket-detail .custom-state-dropdown.open .state-dropdown-trigger { border-color:var(--spruce); background:#fbfdfb; box-shadow:0 0 0 3px var(--control-focus); }
.ticket-detail .detail-grid .custom-select-menu,
.ticket-detail .state-dropdown-menu { top:calc(100% + 7px); padding:7px; border-color:var(--line-strong); border-radius:7px; box-shadow:0 16px 30px rgba(33,48,40,.17), 0 2px 6px rgba(33,48,40,.08); }
.ticket-detail .detail-grid .custom-select-search { min-height:34px; padding:8px 10px; border-radius:5px; }
.ticket-detail .detail-grid .custom-select-option,
.ticket-detail .state-dropdown-option { min-height:34px; padding:7px 8px; border-radius:5px; color:#415047; font-size:12px; font-weight:500; }
.ticket-detail .detail-grid .custom-select-option:hover,.ticket-detail .detail-grid .custom-select-option:focus,
.ticket-detail .state-dropdown-option:hover,.ticket-detail .state-dropdown-option:focus { background:var(--spruce-pale); color:var(--spruce-dark); }
.ticket-detail .detail-grid .custom-select-option.is-selected { background:var(--spruce-pale); color:var(--spruce-dark); font-weight:700; }
.ticket-detail .detail-grid .dropdown-check { width:15px; height:15px; }
.ticket-detail .detail-grid label:nth-child(2) .custom-select-trigger { border-radius:6px; background:#fff; border-color:#d5ddd6; color:var(--ink-2); font-weight:600; }
[data-theme="dark"] .ticket-detail .detail-grid .custom-select-trigger,
[data-theme="dark"] .ticket-detail .state-dropdown-trigger { border-color:var(--ink-2); background:var(--surface-2); color:var(--ink); box-shadow:none; }
[data-theme="dark"] .ticket-detail .detail-grid .custom-select-trigger:hover,
[data-theme="dark"] .ticket-detail .state-dropdown-trigger:hover,
[data-theme="dark"] .ticket-detail .detail-grid .custom-select-wrapper.open .custom-select-trigger,
[data-theme="dark"] .ticket-detail .custom-state-dropdown.open .state-dropdown-trigger { background:var(--hover-bg); }
[data-theme="dark"] .ticket-state-options label { color:var(--ink); }
[data-theme="dark"] .ticket-state-options label:hover { background:var(--hover-bg); color:var(--spruce-dark); }
.service-domain-composer select { padding:10px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:12px; }.service-domain-row small { display:block; margin-top:2px; color:var(--muted); font-size:10px; }.custom-field-edit { background:none; color:var(--spruce); font-size:11px; font-weight:700; }.custom-field-delete { background:none; color:var(--terra); font-size:11px; font-weight:700; }.ticket-custom-fields { margin-top:24px; padding:18px; border:1px solid #dfe6df; border-radius:7px; background:var(--hover-bg-subtle); }.ticket-custom-fields h2 { margin:0 0 13px; color:var(--ink); font:700 15px Inter, sans-serif; }.ticket-custom-fields > div { display:grid; gap:10px; }.ticket-custom-fields label { color:var(--ink-2); font-size:12px; font-weight:700; }.ticket-custom-fields input:not([type="checkbox"]) { display:block; width:100%; margin-top:6px; padding:9px 10px; border:1px solid var(--line); border-radius:5px; background:#fff; color:var(--ink); }.ticket-custom-fields input[type="checkbox"] { width:16px; height:16px; margin:0 7px 0 0; accent-color:var(--spruce); vertical-align:middle; }[data-theme="dark"] .ticket-custom-fields { border-color:var(--line); background:var(--surface-2); }[data-theme="dark"] .ticket-custom-fields h2,[data-theme="dark"] .ticket-custom-fields label { color:var(--ink); }[data-theme="dark"] .ticket-custom-fields input:not([type="checkbox"]) { background:var(--surface); border-color:var(--line); color:var(--ink); }
.service-domain-composer select { padding:10px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:12px; }.service-domain-row small { display:block; margin-top:2px; color:var(--muted); font-size:10px; }.custom-field-edit { background:none; color:var(--spruce); font-size:11px; font-weight:700; }.custom-field-delete { background:none; color:var(--terra); font-size:11px; font-weight:700; }.ticket-custom-fields { margin-top:24px; padding:18px; border:1px solid #dfe6df; border-radius:7px; background:var(--hover-bg-subtle); }.ticket-custom-fields h2 { margin:0 0 13px; color:var(--ink); font:700 15px Inter, sans-serif; }.ticket-custom-fields > div { display:grid; gap:10px; }.ticket-custom-fields label { color:var(--ink-2); font-size:12px; font-weight:700; }.ticket-custom-fields input:not([type="checkbox"]),.ticket-custom-fields select,.ticket-custom-fields textarea { display:block; width:100%; margin-top:6px; padding:9px 10px; border:1px solid var(--line); border-radius:5px; background:#fff; color:var(--ink); font:inherit; }.ticket-custom-fields input[type="checkbox"] { width:16px; height:16px; margin:0 7px 0 0; accent-color:var(--spruce); vertical-align:middle; }[data-theme="dark"] .ticket-custom-fields { border-color:var(--line); background:var(--surface-2); }[data-theme="dark"] .ticket-custom-fields h2,[data-theme="dark"] .ticket-custom-fields label { color:var(--ink); }[data-theme="dark"] .ticket-custom-fields input:not([type="checkbox"]),[data-theme="dark"] .ticket-custom-fields select,[data-theme="dark"] .ticket-custom-fields textarea { background:var(--surface); border-color:var(--line); color:var(--ink); }
.custom-field-request-type-label { display:block; margin:0 0 12px; color:var(--ink-2); font-size:11.5px; font-weight:800; }.custom-field-request-type-label select { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:12px; outline:none; }[data-theme="dark"] .custom-field-request-type-label { color:var(--ink); }[data-theme="dark"] .custom-field-request-type-label select { background:var(--surface); border-color:var(--line); color:var(--ink); }
.service-domain-settings-panel .custom-select-wrapper { width:100%; }.service-domain-settings-panel .custom-select-trigger { min-height:36px; padding:8px 11px; border:1px solid #d5ddd6; border-radius:6px; background:#fff; color:var(--ink-2); box-shadow:0 1px 1px rgba(39,51,47,.04); font-size:12px; font-weight:600; }.service-domain-settings-panel .custom-select-trigger:hover { border-color:#9eafa3; background:#fcfdfb; }.service-domain-settings-panel .custom-select-trigger:after { width:7px; height:7px; border-color:var(--muted); }.service-domain-settings-panel .custom-select-wrapper.open .custom-select-trigger { border-color:var(--spruce); background:#fbfdfb; box-shadow:0 0 0 3px var(--control-focus); }.service-domain-settings-panel .custom-select-menu { top:calc(100% + 7px); min-width:220px; padding:7px; border-color:var(--line-strong); border-radius:7px; box-shadow:0 16px 30px rgba(33,48,40,.17), 0 2px 6px rgba(33,48,40,.08); }.service-domain-settings-panel .custom-select-search { min-height:34px; padding:8px 10px; border-radius:5px; }.service-domain-settings-panel .custom-select-option { min-height:34px; padding:7px 8px; border-radius:5px; color:#415047; font-size:12px; font-weight:500; }.service-domain-settings-panel .custom-select-option:hover,.service-domain-settings-panel .custom-select-option:focus { background:var(--spruce-pale); color:var(--spruce-dark); }.service-domain-settings-panel .custom-select-option.is-selected { background:var(--spruce-pale); color:var(--spruce-dark); font-weight:700; }[data-theme="dark"] .service-domain-settings-panel .custom-select-trigger { border-color:var(--ink-2); background:var(--surface-2); color:var(--ink); box-shadow:none; }[data-theme="dark"] .service-domain-settings-panel .custom-select-trigger:hover,[data-theme="dark"] .service-domain-settings-panel .custom-select-wrapper.open .custom-select-trigger { background:var(--hover-bg); }
.service-domain-settings-panel .custom-select-option.is-selected { background:#f1f4f1; color:var(--ink-2); }.service-domain-settings-panel .custom-select-option.is-selected .dropdown-check { border-color:#7d8d82; background:#7d8d82; }[data-theme="dark"] .service-domain-settings-panel .custom-select-option.is-selected { background:#2a332a; color:var(--ink); }
.service-domain-settings-panel .custom-select-menu .custom-select-option { background:#fff !important; color:#38433d !important; }.service-domain-settings-panel .custom-select-menu .custom-select-option:hover,.service-domain-settings-panel .custom-select-menu .custom-select-option:focus { background:#f1f2f3 !important; color:#202925 !important; }.service-domain-settings-panel .custom-select-menu .custom-select-option.is-selected { background:#f1f2f3 !important; color:#202925 !important; }.service-domain-settings-panel .custom-select-menu .custom-select-option.is-selected .dropdown-check { border-color:#747b77 !important; background:#747b77 !important; }[data-theme="dark"] .service-domain-settings-panel .custom-select-menu .custom-select-option { background:var(--surface) !important; color:var(--ink) !important; }[data-theme="dark"] .service-domain-settings-panel .custom-select-menu .custom-select-option:hover,[data-theme="dark"] .service-domain-settings-panel .custom-select-menu .custom-select-option.is-selected { background:#303431 !important; color:var(--ink) !important; }
.service-domain-settings-panel .custom-select-menu .dropdown-check { display:none !important; }.service-domain-settings-panel .custom-select-menu .custom-select-option { display:block; padding-left:10px; }
.empty-state[hidden] { display:none !important; }
.active-rules-register { max-width:1320px; margin-bottom:16px; }.active-rules-register td b { color:var(--ink); font-size:12px; }.automation-scope { display:inline-flex; padding:4px 8px; border-radius:10px; background:#eef2f5; color:#38567e; font-size:10px; font-weight:800; }.automation-scope.problems { background:var(--terra-pale); color:#a44a39; }.automation-scope.changes { background:var(--saffron-pale); color:#8d6c22; }[data-theme="dark"] .automation-scope { background:#2b3850; color:#c8d6ee; }[data-theme="dark"] .automation-scope.problems { background:#39251f; color:#e2907a; }[data-theme="dark"] .automation-scope.changes { background:#352f1d; color:#e8c164; }
.automations-settings-panel.active-view { display:block !important; }
.automation-rule-active { display:inline-flex; align-items:center; gap:7px; color:var(--ink-2); font-size:11px; font-weight:700; }.automation-rule-active input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }.automation-rule-edit,.automation-rule-delete { padding:5px 8px; background:none; font-size:10px; font-weight:800; }.automation-rule-edit { color:var(--spruce); }.automation-rule-delete { color:var(--terra); }.automation-rule-modal { max-width:540px; }.automation-rule-modal label { display:block; margin-top:15px; color:var(--ink-2); font-size:12px; font-weight:700; }.automation-rule-modal input:not([type="checkbox"]),.automation-rule-modal select,.automation-rule-modal textarea { display:block; width:100%; margin-top:6px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit; }.automation-rule-modal .save-button { margin-top:20px; }[data-theme="dark"] .automation-rule-modal label{color:var(--ink)}[data-theme="dark"] .automation-rule-modal input:not([type="checkbox"]),[data-theme="dark"] .automation-rule-modal select,[data-theme="dark"] .automation-rule-modal textarea{background:var(--surface);border-color:var(--line);color:var(--ink)}[data-theme="dark"] .automation-rule-active{color:var(--ink)}
.automation-trigger-config { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:16px; padding:14px; border:1px solid #dfe6df; border-radius:7px; background:var(--hover-bg-subtle); }.automation-trigger-config h3 { grid-column:1 / -1; margin:0; color:var(--ink); font:700 14px Inter, sans-serif; }.automation-trigger-config label:last-child { grid-column:1 / -1; margin-top:0; }.automation-trigger-config label { margin-top:0; }[data-theme="dark"] .automation-trigger-config{background:var(--surface-2);border-color:var(--line)}[data-theme="dark"] .automation-trigger-config h3{color:var(--ink)}

/* ---------- Server integration: startup, sync status, requester ticket view, account access, audit ---------- */
html.app-loading .app-shell, html.app-loading .side-toolbar { visibility:hidden; }
.app-startup-status { position:fixed; inset:0; z-index:200; display:grid; place-content:center; gap:12px; background:var(--paper); color:var(--muted); font:500 14px var(--font-ui, Inter, sans-serif); text-align:center; }
html:not(.app-loading) .app-startup-status { display:none; }
.app-startup-status.error { color:var(--ink); }
.app-startup-status button { justify-self:center; min-height:36px; padding:0 16px; border:1px solid var(--control-border); border-radius:6px; background:var(--surface); color:var(--ink); font:600 13px inherit; cursor:pointer; }
.sync-banner { position:fixed; left:50%; bottom:calc(20px + env(safe-area-inset-bottom, 0px)); z-index:300; display:flex; align-items:center; gap:14px; width:min(640px, calc(100% - 32px)); padding:12px 14px; border:1px solid var(--saffron); border-radius:8px; background:var(--surface); box-shadow:var(--shadow); color:var(--ink); font-size:13px; transform:translateX(-50%); }
.sync-banner span { flex:1; }
.sync-banner button { flex:none; min-height:32px; padding:0 14px; border:0; border-radius:6px; background:var(--spruce); color:#fff; font-weight:700; cursor:pointer; }
.portal-ticket-modal { max-width:640px; }
.portal-ticket-modal h3 { margin:20px 0 10px; font-size:14px; }
.portal-ticket-meta { display:grid; grid-template-columns:repeat(auto-fit, minmax(130px, 1fr)); gap:10px; margin:14px 0; }
.portal-ticket-meta div { padding:10px; border:1px solid var(--line); border-radius:6px; }
.portal-ticket-meta dt { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.portal-ticket-meta dd { margin:3px 0 0; font-weight:600; }
.portal-ticket-description { white-space:pre-wrap; }
.portal-ticket-thread { display:grid; gap:10px; max-height:320px; margin-bottom:16px; overflow:auto; }
.portal-ticket-reply { padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--paper); }
.portal-ticket-reply.mine { border-color:var(--spruce-pale); background:var(--spruce-pale); }
.portal-ticket-reply header { display:flex; justify-content:space-between; gap:10px; font-size:12px; }
.portal-ticket-reply header small { color:var(--muted); }
.portal-ticket-reply p { margin:6px 0 0; white-space:pre-wrap; }
.posted-copy { white-space:pre-wrap; }
.account-access { display:grid; gap:10px; margin:6px 0 14px; padding:12px; border:1px solid var(--line); border-radius:7px; }
.account-access-heading { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; font-weight:700; font-size:13px; }
.account-access-heading small { color:var(--muted); font-weight:500; }
.account-access-actions { display:flex; flex-wrap:wrap; gap:8px; }
.account-access-secret { display:grid; gap:8px; padding:10px; border-radius:6px; background:var(--saffron-pale); color:var(--ink); font-size:12px; }
.account-access-secret p { margin:0; }
.account-access-secret code { font-size:15px; font-weight:700; letter-spacing:.04em; word-break:break-all; }
.account-access-secret button { justify-self:start; }
#verifyAuditButton { margin-top:10px; }
[data-theme="dark"] .ticket-detail .state-dropdown-trigger.state-new,[data-theme="dark"] .ticket-detail .state-dropdown-trigger.state-assigned,[data-theme="dark"] .ticket-detail .state-dropdown-trigger.state-working,[data-theme="dark"] .ticket-detail .state-dropdown-trigger.state-approved { border-color:#38576b !important; background:#1c2b35 !important; color:#cfe3f1; }

/* Dark-mode hover backgrounds for states that hardcode a light hover color. New hover styles should use
   var(--hover-bg) or var(--hover-bg-subtle) directly, which work in both themes. */
[data-theme="dark"] .notification-recipient-picker > div > label:hover,
[data-theme="dark"] .column-option:hover,
[data-theme="dark"] .workspace-option:hover,
[data-theme="dark"] .rule-row:hover,
[data-theme="dark"] .saved-view:hover,
[data-theme="dark"] .ticket-table-head [data-column-key]:hover,
[data-theme="dark"] .profile-more-button:hover,
[data-theme="dark"] .profile-menu-dropdown button:hover,
[data-theme="dark"] .global-result:hover,
[data-theme="dark"] .range-option:hover,
[data-theme="dark"] .settings-items button:hover,
[data-theme="dark"] .directory-ticket-history > div:last-child > button:hover,
[data-theme="dark"] .change-approver-picker label:hover,
[data-theme="dark"] .priority-legend-clickable:hover,
[data-theme="dark"] .activity-item[data-ticket-id]:hover,
[data-theme="dark"] .activity-item[data-nav-view]:hover,
[data-theme="dark"] .requester-portal-search > div button:hover,
[data-theme="dark"] .knowledge-editor-toolbar button:hover,
[data-theme="dark"] .detail-requester-picker button:hover,
[data-theme="dark"] .ticket-cc-results button:hover,
[data-theme="dark"] .ticket-detail .detail-grid .custom-select-option:hover,
[data-theme="dark"] .ticket-detail .state-dropdown-option:hover,
[data-theme="dark"] .service-domain-settings-panel .custom-select-option:hover { background:var(--hover-bg); }
[data-theme="dark"] .clipboard-compact-item button:hover,
[data-theme="dark"] .ticket-page-actions .action-menu:hover,
[data-theme="dark"] .ticket-page-actions .columns-button:hover,
[data-theme="dark"] .ticket-page-actions .view-size-control .custom-select-trigger:hover,
[data-theme="dark"] .requester-service-card:hover,
[data-theme="dark"] .requester-request-row:hover,
[data-theme="dark"] .agent-profile-button:hover,
[data-theme="dark"] .requester-summary-card-action:hover,
[data-theme="dark"] .requester-theme-button:hover,
[data-theme="dark"] .requester-profile-button:hover,
[data-theme="dark"] .portal-settings-actions .outline-button:hover { background:var(--hover-bg-subtle); border-color:#4a6b55; }

/* ---------- Dashboard ---------- */
/* Chart series colors validated for both themes (created = slot 1, resolved = slot 2); text never uses them. */
:root { --dash-created:#1a7f56; --dash-resolved:#dd8f00; }
:root[data-theme="dark"] { --dash-created:#2e9e70; --dash-resolved:#c98500; }
.dashboard-view .page-heading { margin-bottom:18px; }
.dashboard-view .subheading { margin:6px 0 0; color:var(--muted); font-size:12px; }
.dashboard-filters { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; margin-bottom:18px; }
.dashboard-filter { position:relative; display:grid; gap:5px; color:var(--muted); font-size:10.5px; font-weight:700; letter-spacing:.02em; }
.dashboard-range { min-width:170px; }
.dashboard-range select { min-height:36px; }
.dashboard-picker-trigger { display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:190px; min-height:36px; padding:0 11px; border:1px solid var(--control-border, #d2dbd3); border-radius:5px; background:var(--surface); color:var(--ink); font:600 12px var(--font-ui); }
.dashboard-picker-trigger span { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-picker-trigger i { color:var(--muted); font-style:normal; }
.dashboard-picker-menu { position:absolute; top:calc(100% + 6px); left:0; z-index:30; display:none; width:280px; padding:8px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:var(--shadow); color:var(--ink); font-weight:500; letter-spacing:0; }
.dashboard-picker.open .dashboard-picker-menu { display:block; }
.dashboard-picker-menu input[type="search"] { width:100%; min-height:32px; margin-bottom:6px; padding:0 9px; border:1px solid var(--line); border-radius:5px; background:var(--surface); color:var(--ink); font:inherit; font-size:12px; }
.dashboard-picker-options { max-height:240px; overflow-y:auto; }
.dashboard-picker-options label { display:flex; align-items:center; gap:8px; padding:7px 6px; border-radius:4px; font-size:12px; cursor:pointer; }
.dashboard-picker-options label[hidden] { display:none; }
.dashboard-picker-options label:hover { background:var(--hover-bg); }
.dashboard-picker-options input { accent-color:var(--spruce); }
.dashboard-picker-footer { display:flex; align-items:center; justify-content:space-between; margin-top:6px; padding-top:8px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; }
.dashboard-reset { align-self:center; margin-top:16px; }
.dashboard-reset[hidden] { display:none; }
.dashboard-kpis { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:12px; margin-bottom:16px; }
.dashboard-kpi { padding:16px 17px; border:1px solid var(--line); border-radius:7px; background:var(--surface); box-shadow:var(--shadow); }
.dashboard-kpi[role="button"] { cursor:pointer; }
.dashboard-kpi[role="button"]:hover, .dashboard-kpi[role="button"]:focus-visible { border-color:var(--spruce); outline:none; }
.dashboard-kpi p { display:flex; align-items:center; gap:6px; margin:0 0 8px; color:var(--muted); font-size:11px; font-weight:600; }
.dashboard-kpi strong { display:block; color:var(--ink); font:700 28px var(--font-ui); letter-spacing:-.5px; }
.dashboard-kpi div { margin-top:6px; color:var(--muted); font-size:10.5px; }
.dashboard-kpi small { font-size:10.5px; }
.dashboard-status-icon { display:inline-grid; place-items:center; width:16px; height:16px; border-radius:50%; font-size:10px; font-weight:800; }
.dashboard-kpi.status-critical .dashboard-status-icon { background:var(--terra); color:#fff; }
.dashboard-kpi.status-critical { border-color:var(--terra); }
.dashboard-kpi.status-good .dashboard-status-icon { background:var(--spruce-pale); color:var(--spruce); }
.dashboard-delta { font-weight:700; color:var(--muted); }
.dashboard-delta.good { color:var(--spruce); }
.dashboard-delta.bad { color:var(--terra); }
.dashboard-grid { display:grid; grid-template-columns:minmax(0, 1.65fr) minmax(0, 1fr); gap:16px; margin-bottom:16px; }
.dashboard-card { padding:18px 20px; }
.dashboard-card .panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.dashboard-card .panel-heading p { margin:4px 0 0; }
.dashboard-workload { margin-bottom:16px; }
.dashboard-chip-row { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.dashboard-chip { padding:5px 10px; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--muted); font-size:11px; font-weight:600; }
.dashboard-chip b { margin-left:3px; color:var(--ink); }
.dashboard-chip:hover { background:var(--hover-bg); }
.dashboard-chip.active { border-color:var(--spruce); background:var(--spruce-pale); color:var(--spruce-dark); }
.dashboard-attention-list, .dashboard-activity-list, .dashboard-bars { margin:0; padding:0; list-style:none; }
.dashboard-attention-list li + li, .dashboard-activity-list li + li { border-top:1px solid var(--line); }
.dashboard-attention-list button { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:6px 12px; width:100%; padding:10px 6px; border:0; border-radius:5px; background:none; color:var(--ink); text-align:left; }
.dashboard-attention-list button:hover, .dashboard-attention-list button:focus-visible { background:var(--hover-bg); outline:none; }
.dashboard-attention-main { display:flex; align-items:flex-start; gap:10px; min-width:0; }
.dashboard-attention-main b { display:block; overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-attention-main small { display:block; margin-top:3px; color:var(--muted); font-size:10.5px; }
.dashboard-due { grid-column:2; grid-row:1; align-self:center; color:var(--muted); font-size:10.5px; white-space:nowrap; }
.dashboard-reasons { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:5px; padding-left:52px; }
.dashboard-reason { display:inline-flex; align-items:center; gap:4px; padding:2px 7px; border-radius:4px; font-size:10.5px; font-weight:700; }
.dashboard-reason i { font-style:normal; }
.dashboard-reason.critical { background:var(--terra-pale); color:var(--ink); box-shadow:inset 3px 0 0 var(--terra); }
.dashboard-reason.critical i { color:var(--terra); }
.dashboard-reason.warning { background:var(--saffron-pale); color:var(--ink); box-shadow:inset 3px 0 0 var(--saffron); }
.dashboard-reason.info { background:var(--paper); color:var(--muted); }
.dashboard-more { margin-top:8px; }
.dashboard-empty { margin:14px 0 4px; color:var(--muted); font-size:12px; }
.dashboard-bars li button { display:grid; grid-template-columns:92px minmax(0, 1fr) 28px; align-items:center; gap:10px; width:100%; padding:9px 4px; border:0; border-radius:5px; background:none; color:var(--ink); text-align:left; }
.dashboard-bars li button:hover, .dashboard-bars li button:focus-visible { background:var(--hover-bg); outline:none; }
.dashboard-bar-label { color:var(--muted); font-size:11px; }
.dashboard-bar-track { display:block; height:10px; border-radius:0 4px 4px 0; }
.dashboard-bar { display:block; height:100%; border-radius:0 4px 4px 0; background:var(--dash-created); }
.dashboard-bar-value { font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; text-align:right; }
.dashboard-table { width:100%; border-collapse:collapse; font-size:12px; }
.dashboard-table th, .dashboard-table td { padding:10px 10px; border-bottom:1px solid var(--line); text-align:left; }
.dashboard-table thead th { color:var(--muted); font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.dashboard-table tbody th { color:var(--ink); font-size:12px; font-weight:700; letter-spacing:0; text-transform:none; }
.dashboard-table tbody tr[data-workload-agent] { cursor:pointer; }
.dashboard-table tbody tr[data-workload-agent]:hover, .dashboard-table tbody tr[data-workload-agent]:focus-visible { background:var(--hover-bg); outline:none; }
.dashboard-number { font-variant-numeric:tabular-nums; }
.dashboard-number.is-breached { color:var(--terra); font-weight:700; }
.dashboard-number.is-breached i { font-style:normal; }
.dashboard-zero, .dashboard-muted-cell { color:var(--muted); }
.dashboard-inline-bar { display:grid; grid-template-columns:minmax(60px, 140px) 28px; align-items:center; gap:8px; }
.dashboard-inline-bar b { font-variant-numeric:tabular-nums; }
.dashboard-unassigned-row th { color:var(--muted); font-style:italic; }
.dashboard-legend { display:flex; flex-wrap:wrap; gap:16px; margin-bottom:8px; color:var(--muted); font-size:11.5px; }
.dashboard-legend span { display:inline-flex; align-items:center; gap:6px; }
.dashboard-legend b { color:var(--ink); }
.dashboard-swatch { display:inline-block; width:10px; height:10px; border-radius:2px; }
.dashboard-swatch.created, .dashboard-key.created { background:var(--dash-created); }
.dashboard-swatch.resolved, .dashboard-key.resolved { background:var(--dash-resolved); }
.dashboard-chart { width:100%; min-height:220px; }
.dashboard-svg { display:block; overflow:visible; }
.dashboard-grid-line { stroke:var(--line); stroke-width:1; }
.dashboard-axis { fill:var(--muted); font-size:10px; font-variant-numeric:tabular-nums; }
.dashboard-column.created { fill:var(--dash-created); }
.dashboard-column.resolved { fill:var(--dash-resolved); }
.dashboard-hit { fill:transparent; cursor:default; outline:none; }
.dashboard-hit.hover { fill:var(--hover-bg); fill-opacity:.55; }
.dashboard-tooltip { position:fixed; z-index:60; min-width:130px; padding:8px 10px; border:1px solid var(--line); border-radius:6px; background:var(--surface); box-shadow:var(--shadow); color:var(--ink); font-size:11px; pointer-events:none; }
.dashboard-tooltip[hidden] { display:none; }
.dashboard-tooltip p { margin:0 0 5px; color:var(--muted); font-weight:600; }
.dashboard-tooltip div { display:flex; align-items:center; gap:7px; margin-top:3px; }
.dashboard-tooltip b { min-width:22px; font-size:12px; font-variant-numeric:tabular-nums; }
.dashboard-tooltip span { color:var(--muted); }
.dashboard-key { display:inline-block; width:12px; height:2px; border-radius:1px; }
.dashboard-activity-list button { display:grid; grid-template-columns:30px minmax(0, 1fr) auto; align-items:center; gap:10px; width:100%; padding:10px 4px; border:0; border-radius:5px; background:none; color:var(--ink); font-size:11.5px; text-align:left; }
.dashboard-activity-list button:hover, .dashboard-activity-list button:focus-visible { background:var(--hover-bg); outline:none; }
.dashboard-activity-list small { display:block; margin-top:3px; overflow:hidden; color:var(--muted); font-size:10.5px; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-activity-list time { color:var(--muted); font-size:10.5px; white-space:nowrap; }
@media (max-width:1200px) { .dashboard-kpis { grid-template-columns:repeat(3, minmax(0, 1fr)); } }
@media (max-width:900px) { .dashboard-grid { grid-template-columns:1fr; } .dashboard-kpis { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:560px) { .dashboard-kpis { grid-template-columns:1fr; } .dashboard-picker-trigger, .dashboard-range { min-width:0; width:100%; } .dashboard-filter { width:100%; } .dashboard-reasons { padding-left:0; } }
.dashboard-range .custom-select-trigger { min-height:36px; height:36px; }
.dashboard-activity-list .activity-avatar { background:var(--spruce-pale); color:var(--spruce-dark); }
[data-theme="dark"] .dashboard-table .dashboard-number.is-breached { color:var(--terra); }

/* ---------- Facilities workspace ---------- */
.facilities-nav { display:none; }
body.facilities-mode .facilities-nav { display:block; }
body.facilities-mode .primary-nav:not(.facilities-nav) { display:none; }
.facilities-view .page-heading { margin-bottom:18px; }
.facilities-view .eyebrow { margin:0 0 4px; }
.facilities-view .heading-actions { display:flex; gap:10px; align-items:center; }
.facilities-toolbar { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; margin-bottom:14px; }
.facilities-toolbar > input[type="search"] { flex:1 1 260px; max-width:420px; min-height:36px; padding:0 12px; border:1px solid var(--control-border, #d2dbd3); border-radius:5px; background:var(--surface); color:var(--ink); font:inherit; font-size:12px; }
.facilities-toolbar label { display:grid; gap:5px; min-width:170px; color:var(--muted); font-size:10.5px; font-weight:700; }
.facilities-toolbar .custom-select-trigger { min-height:36px; height:36px; }
.facilities-panel { padding:6px 12px 8px; }
.facilities-table { width:100%; border-collapse:collapse; font-size:12px; }
.facilities-table th, .facilities-table td { padding:11px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
.facilities-table thead th { color:var(--muted); font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.facilities-table tbody th { color:var(--ink); font-size:12px; font-weight:700; letter-spacing:0; text-transform:none; }
.facilities-table td small, .facilities-table td b + small { display:block; margin-top:3px; color:var(--muted); font-size:10.5px; }
.facilities-table tbody tr[data-facility-ticket], .facilities-table tbody tr[data-checklist] { cursor:pointer; }
.facilities-table tbody tr[data-facility-ticket]:hover, .facilities-table tbody tr[data-checklist]:hover, .facilities-table tbody tr:focus-visible { background:var(--hover-bg); outline:none; }
.facilities-empty { margin:12px 0; padding:8px 0; color:var(--muted); font-size:12px; }
td.facilities-empty { text-align:center; }
.facilities-missing { color:var(--terra); font-weight:700; }
.facilities-intro { margin:0 0 14px; color:var(--muted); font-size:12px; line-height:1.5; }
.facilities-count { margin:0 0 10px; color:var(--muted); font-size:11px; }
.facilities-label { display:block; margin-bottom:6px; color:var(--ink-2); font-size:12px; font-weight:700; }
[data-theme="dark"] .facilities-label { color:var(--ink); }
.vendor-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:14px; }
.vendor-card { padding:16px 18px; }
.vendor-card.inactive { opacity:.7; }
.vendor-card header { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:10px; }
.vendor-card h2 { margin:0 0 6px; color:var(--ink); font:700 15px Inter, sans-serif; }
.vendor-trade, .vendor-inactive { display:inline-block; margin-right:6px; padding:2px 8px; border-radius:999px; font-size:10.5px; font-weight:700; }
.vendor-trade { background:var(--spruce-pale); color:var(--spruce-dark); }
.vendor-inactive { background:var(--paper); color:var(--muted); }
.vendor-card dl { display:grid; gap:0; margin:0; }
.vendor-card dl > div { display:grid; grid-template-columns:92px 1fr; gap:10px; padding:7px 0; border-top:1px solid var(--line); font-size:12px; }
.vendor-card dt { color:var(--muted); font-size:11px; font-weight:700; }
.vendor-card dd { margin:0; color:var(--ink); overflow-wrap:anywhere; }
.vendor-card a { color:var(--spruce); font-weight:600; }
.vendor-areas dd { display:flex; flex-wrap:wrap; gap:5px; }
.vendor-area { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border:1px solid var(--line); border-radius:999px; background:var(--paper); color:var(--ink); font-size:11px; }
.vendor-area button { padding:0 2px; border:0; background:none; color:var(--muted); font-size:14px; line-height:1; }
.vendor-area-editor #vendorAreaList { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.vendor-area-add, .checklist-template-add { display:grid; grid-template-columns:1fr 110px auto; gap:8px; align-items:center; }
.checklist-template-add { grid-template-columns:180px 1fr auto; margin-top:12px; }
.facilities-modal { width:min(640px, calc(100vw - 32px)); max-height:calc(100vh - 48px); overflow-y:auto; }
.facilities-modal.wide { width:min(860px, calc(100vw - 32px)); }
.facilities-form { display:grid; grid-template-columns:1fr 1fr; gap:12px 16px; margin-top:14px; }
.facilities-form .full { grid-column:1 / -1; }
.facilities-form label { display:block; color:var(--ink-2); font-size:12px; font-weight:700; }
[data-theme="dark"] .facilities-form label, [data-theme="dark"] .checklist-notes { color:var(--ink); }
.facilities-form small { display:block; margin-top:5px; color:var(--muted); font-size:10.5px; font-weight:500; }
.facilities-modal input:not([type="checkbox"]):not([type="radio"]), .facilities-modal textarea, .facilities-modal select { display:block; width:100%; margin-top:6px; padding:9px 11px; border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink); font:inherit; font-size:12px; }
[data-theme="dark"] .facilities-modal input:not([type="checkbox"]):not([type="radio"]), [data-theme="dark"] .facilities-modal textarea { border-color:var(--line); background:var(--surface); }
.vendor-area-add input, .vendor-area-add select, .checklist-template-add input { margin-top:0 !important; }
.facilities-modal .sla-check-option { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--paper); font-weight:600; }
.facilities-modal .sla-check-option input { width:16px; height:16px; margin:0; accent-color:var(--spruce); }
.facilities-modal-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:18px; }
.danger-text { color:var(--terra) !important; margin-right:auto; }
.danger-text[hidden] { display:none; }
.facilities-updates { margin-top:18px; padding-top:14px; border-top:1px solid var(--line); }
.facilities-updates[hidden] { display:none; }
.facilities-updates h3 { margin:0 0 8px; color:var(--ink); font-size:13px; }
.facilities-update-list { margin:0 0 12px; padding:0; list-style:none; }
.facilities-update-list li { padding:8px 0; border-bottom:1px solid var(--line); font-size:12px; }
.facilities-update-list time { margin-left:8px; color:var(--muted); font-size:10.5px; }
.facilities-update-list p { margin:4px 0 0; color:var(--ink); white-space:pre-wrap; }
.checklist-summary { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:12px; margin-bottom:14px; }
.checklist-summary:empty { display:none; }
.checklist-stat { padding:14px 16px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }
.checklist-stat p { display:flex; align-items:center; gap:6px; margin:0 0 6px; color:var(--muted); font-size:11px; font-weight:600; }
.checklist-stat strong { color:var(--ink); font:700 22px var(--font-ui); }
.checklist-stat i, .checklist-status i { font-style:normal; font-weight:800; }
.checklist-stat.overdue i, .checklist-status.overdue { color:var(--terra); }
.checklist-stat.submitted i, .checklist-status.submitted { color:var(--spruce); }
.checklist-status { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; color:var(--muted); }
.checklist-status.in-progress { color:#9a6a00; }
[data-theme="dark"] .checklist-status.in-progress { color:var(--saffron); }
.checklist-site-picker { display:grid; gap:8px; margin-top:14px; }
.checklist-site-picker .sla-check-option span { display:grid; gap:2px; }
.checklist-site-picker small { color:var(--muted); font-size:10.5px; font-weight:500; }
.checklist-site-picker .disabled { opacity:.65; }
.checklist-template-list section { margin-top:12px; }
.checklist-template-list h3 { margin:0 0 6px; color:var(--ink); font-size:12px; }
.checklist-template-list ul { margin:0; padding:0; list-style:none; }
.checklist-template-list li { display:flex; justify-content:space-between; gap:10px; padding:7px 0; border-bottom:1px solid var(--line); color:var(--ink); font-size:12px; }
.checklist-template-list li button { border:0; background:none; color:var(--terra); font-size:11px; font-weight:700; }
.checklist-form fieldset { margin:14px 0 0; padding:0; border:0; }
.checklist-form legend { margin-bottom:6px; color:var(--ink); font:700 13px Inter, sans-serif; }
.checklist-item { display:grid; grid-template-columns:1fr auto; gap:8px 14px; align-items:center; padding:10px 12px; border:1px solid var(--line); border-radius:6px; margin-bottom:8px; }
.checklist-item.failed { border-color:var(--terra); box-shadow:inset 3px 0 0 var(--terra); }
.checklist-item p { margin:0; color:var(--ink); font-size:12.5px; }
.checklist-item .checklist-comment { grid-column:1 / -1; margin-top:0 !important; }
.checklist-choices { display:flex; gap:4px; }
.checklist-choices label { position:relative; }
.checklist-choices input { position:absolute; opacity:0; inset:0; }
.checklist-choices span { display:inline-block; min-width:56px; padding:6px 10px; border:1px solid var(--line); border-radius:5px; background:var(--surface); color:var(--muted); font-size:11.5px; font-weight:700; text-align:center; cursor:pointer; }
.checklist-choices input:focus-visible + span { outline:2px solid var(--spruce); outline-offset:1px; }
.checklist-choices .pass input:checked + span { border-color:var(--spruce); background:var(--spruce-pale); color:var(--spruce-dark); }
.checklist-choices .fail input:checked + span { border-color:var(--terra); background:var(--terra-pale); color:var(--ink); }
.checklist-choices .na input:checked + span { border-color:var(--muted); background:var(--paper); color:var(--ink); }
.checklist-choices input:disabled + span { cursor:default; }
.checklist-create-ticket, .checklist-ticket-link { grid-column:1 / -1; justify-self:start; margin:0; font-size:11.5px; }
.checklist-notes { display:block; margin-top:14px; color:var(--ink-2); font-size:12px; font-weight:700; }
.my-checklist-list { display:grid; gap:10px; }
.my-checklist-card { display:grid; gap:4px; width:100%; padding:14px 16px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); text-align:left; }
.my-checklist-card:hover, .my-checklist-card:focus-visible { background:var(--hover-bg); border-color:var(--spruce); outline:none; }
.my-checklist-card b { font-size:13px; }
.my-checklist-card small { color:var(--muted); font-size:11px; }
.workspace-checklist-panel { margin:16px 0; padding:18px 20px; }
.workspace-checklist-panel[hidden] { display:none; }
@media (max-width:900px) { .checklist-summary { grid-template-columns:repeat(2, minmax(0, 1fr)); } .facilities-form { grid-template-columns:1fr; } }
@media (max-width:560px) { .vendor-area-add, .checklist-template-add { grid-template-columns:1fr; } .checklist-item { grid-template-columns:1fr; } .facilities-toolbar label { min-width:0; width:100%; } }
.facilities-table .ticket-number { white-space:nowrap; }

/* ---------- Overview (design/overview.html), scoped to #overviewView ---------- */
#overviewView {
  --ov-surface: var(--surface); --ov-surface-2: var(--surface-2); --ov-border: var(--line); --ov-border-strong: var(--line-strong);
  --ov-ink: var(--ink); --ov-ink-2: var(--ink-2); --ov-ink-3: var(--muted);
  --ov-brand: var(--spruce); --ov-brand-hover: var(--spruce-dark); --ov-brand-ink: var(--brand-ink); --ov-brand-soft: var(--spruce-pale);
  --ov-good: #2b7a4b; --ov-good-soft: #e0efe5; --ov-bad: #b03e2c; --ov-bad-soft: #f7e3de; --ov-warn: #9a6210; --ov-warn-soft: #f7ebd3;
  --ov-p-critical: #b03e2c; --ov-p-high: #d27b2e; --ov-p-medium: #dfbb5e; --ov-p-low: #bcc2b8;
  --ov-shadow: 0 1px 2px rgba(31, 42, 36, .04), 0 2px 6px rgba(31, 42, 36, .04); --ov-shadow-pop: 0 8px 28px rgba(31, 42, 36, .14);
  --ov-radius: 12px;
  color: var(--ov-ink); font-family: Inter, var(--font-ui, system-ui), sans-serif; font-size: 14px; line-height: 1.45;
}
[data-theme="dark"] #overviewView {
  --ov-good: #74c592; --ov-good-soft: #1d3326; --ov-bad: #ec8a75; --ov-bad-soft: #3b231e; --ov-warn: #e2ab4f; --ov-warn-soft: #372b16;
  --ov-p-critical: #e8735d; --ov-p-high: #e99a55; --ov-p-medium: #e3c678; --ov-p-low: #6b736d;
  --ov-shadow: 0 1px 2px rgba(0,0,0,.3); --ov-shadow-pop: 0 10px 30px rgba(0,0,0,.5);
}
#overviewView button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-align: inherit; }
#overviewView :focus-visible { outline: 2px solid var(--ov-brand); outline-offset: 2px; border-radius: 6px; }
.ov-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ov-icon { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.ov-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ov-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
#overviewView h1 { margin: 0 0 6px; }
.ov-sub { color: var(--ov-ink-2); margin: 0; }
.ov-sub button { color: var(--ov-brand) !important; font-weight: 600 !important; }
.ov-sub button:hover { text-decoration: underline; }
.ov-seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 9px; background: var(--ov-surface-2); border: 1px solid var(--ov-border); }
.ov-seg button { padding: 5px 11px !important; border-radius: 6px; font-size: 12.5px !important; font-weight: 500; color: var(--ov-ink-2) !important; white-space: nowrap; }
.ov-seg button[aria-pressed="true"] { background: var(--ov-surface) !important; color: var(--ov-ink) !important; font-weight: 600; box-shadow: var(--ov-shadow); }
.ov-banner { display: flex; align-items: center; gap: 14px; padding: 12px 14px 12px 16px; margin-bottom: 20px; border-radius: var(--ov-radius); background: var(--ov-bad-soft); border: 1px solid color-mix(in srgb, var(--ov-bad) 30%, transparent); }
.ov-banner-icon { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: var(--ov-bad); color: #fff; flex: none; }
.ov-banner-icon .ov-icon { width: 18px; height: 18px; }
.ov-banner-body { flex: 1; min-width: 0; }
.ov-banner-title { font-weight: 600; }
.ov-tag { font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 5px; background: var(--ov-bad); color: #fff; margin-right: 6px; vertical-align: 1px; }
.ov-banner-meta { font-size: 12.5px; color: var(--ov-ink-2); }
.ov-icon-btn { width: 32px; height: 32px; display: grid !important; place-items: center; border-radius: 8px; color: var(--ov-ink-2) !important; }
.ov-icon-btn:hover { background: color-mix(in srgb, var(--ov-bad) 12%, transparent) !important; }
.ov-btn { display: inline-flex !important; align-items: center; gap: 7px; height: 36px; padding: 0 14px !important; border-radius: 9px; font-weight: 600; font-size: 13px; white-space: nowrap; }
.ov-btn-primary { background: var(--ov-brand) !important; color: var(--ov-brand-ink) !important; }
.ov-btn-primary:hover { background: var(--ov-brand-hover) !important; }
.ov-btn-ghost { border: 1px solid var(--ov-border) !important; background: var(--ov-surface) !important; }
.ov-btn-ghost:hover { border-color: var(--ov-border-strong) !important; }
.ov-btn-sm { height: 28px; padding: 0 10px !important; font-size: 12px; border-radius: 7px; }
.ov-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-bottom: 20px; }
.ov-card { position: relative; min-width: 0; background: var(--ov-surface); border: 1px solid var(--ov-border); border-radius: var(--ov-radius); box-shadow: var(--ov-shadow); }
.ov-kpi { padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; }
.ov-kpi-label { font-size: 12.5px; font-weight: 500; color: var(--ov-ink-2); display: flex; align-items: center; gap: 6px; }
.ov-kpi-row { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.ov-kpi-value { font-size: 28px; font-weight: 600; letter-spacing: -.02em; line-height: 1.15; }
.ov-kpi-value small { font-size: 13px; font-weight: 500; color: var(--ov-ink-3); letter-spacing: 0; }
.ov-delta { font-size: 12px; font-weight: 600; padding: 2px 7px; border-radius: 999px; white-space: nowrap; }
.ov-delta.good { color: var(--ov-good); background: var(--ov-good-soft); }
.ov-delta.bad { color: var(--ov-bad); background: var(--ov-bad-soft); }
.ov-delta.neutral { color: var(--ov-ink-3); background: var(--ov-surface-2); }
.ov-kpi-foot { font-size: 12.5px; color: var(--ov-ink-3); }
.ov-kpi-foot button { color: var(--ov-ink-2) !important; font-weight: 500; border-bottom: 1px dotted var(--ov-border-strong) !important; }
.ov-kpi-foot button:hover { color: var(--ov-brand) !important; border-color: var(--ov-brand) !important; }
.ov-hot { color: var(--ov-bad); font-weight: 600; }
.ov-warm { color: var(--ov-warn); font-weight: 600; }
.ov-info { display: inline-grid; place-items: center; width: 15px; height: 15px; border-radius: 50%; border: 1px solid var(--ov-border-strong); font-size: 10px; color: var(--ov-ink-3); cursor: help; }
.ov-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 14px; margin-bottom: 14px; }
.ov-grid-halves { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ov-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 18px 12px; flex-wrap: wrap; }
.ov-card-tools { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.ov-card-title { font: 600 15px Inter, var(--font-ui, system-ui), sans-serif !important; margin: 0 !important; color: var(--ov-ink); letter-spacing: 0 !important; }
.ov-card-sub { font-size: 12.5px; color: var(--ov-ink-3); margin: 2px 0 0; }
.ov-card-body { padding: 0 18px 18px; }
.ov-link { display: inline-flex !important; align-items: center; gap: 4px; font-size: 12.5px !important; font-weight: 600; color: var(--ov-brand) !important; white-space: nowrap; }
.ov-link:hover { text-decoration: underline; }
.ov-more { margin: 10px 18px 14px; }
.ov-tabs { display: flex; gap: 4px; padding: 0 18px; box-shadow: inset 0 -1px 0 var(--ov-border); overflow-x: auto; scrollbar-width: none; }
.ov-tab { padding: 8px 10px 10px !important; font-size: 13px !important; font-weight: 500; color: var(--ov-ink-3) !important; border-bottom: 2px solid transparent !important; white-space: nowrap; display: inline-flex !important; gap: 6px; align-items: center; }
.ov-tab:hover { color: var(--ov-ink) !important; }
.ov-tab[aria-selected="true"] { color: var(--ov-ink) !important; border-bottom-color: var(--ov-brand) !important; font-weight: 600; }
.ov-count { font-size: 11px; font-weight: 600; padding: 0 6px; border-radius: 999px; background: var(--ov-surface-2); color: var(--ov-ink-2); font-variant-numeric: tabular-nums; }
.ov-table-wrap { overflow-x: auto; }
.ov-table { width: 100%; border-collapse: collapse; }
.ov-table th { text-align: left; font-size: 11.5px; font-weight: 600; color: var(--ov-ink-3); text-transform: uppercase; letter-spacing: .06em; padding: 10px 12px; white-space: nowrap; background: none; border: 0; }
.ov-table td { padding: 11px 12px; border-top: 1px solid var(--ov-border); vertical-align: middle; color: var(--ov-ink); background: none; }
.ov-table th:first-child, .ov-table td:first-child { padding-left: 18px; }
.ov-table th:last-child, .ov-table td:last-child { padding-right: 18px; text-align: right; }
.ov-table tbody tr:hover { background: var(--ov-surface-2); }
.ov-col-ticket { width: 100%; max-width: 0; min-width: 200px; }
.ov-ticket-link { display: flex !important; gap: 6px; align-items: baseline; max-width: 100%; }
.ov-t-id { font-size: 12px; font-weight: 600; color: var(--ov-brand); font-variant-numeric: tabular-nums; flex: none; }
.ov-t-subj { font-weight: 500; color: var(--ov-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ov-ticket-link:hover .ov-t-subj { text-decoration: underline; }
.ov-t-meta { display: block; font-size: 12px; color: var(--ov-ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; padding: 2px 8px 2px 7px; border-radius: 999px; background: var(--ov-surface-2); color: var(--ov-ink-2); white-space: nowrap; }
.ov-pill i { width: 7px; height: 7px; border-radius: 50%; }
.ov-p-critical { background: var(--ov-p-critical); } .ov-p-high { background: var(--ov-p-high); } .ov-p-medium { background: var(--ov-p-medium); } .ov-p-low { background: var(--ov-p-low); }
.ov-sla { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 500; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ov-sla.breached { color: var(--ov-bad); font-weight: 600; } .ov-sla.risk { color: var(--ov-warn); font-weight: 600; } .ov-sla.ok { color: var(--ov-ink-2); }
.ov-assignee { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; white-space: nowrap; }
.ov-unassigned { color: var(--ov-ink-3); font-style: italic; font-size: 12.5px; }
.ov-empty { padding: 36px 18px !important; text-align: center !important; color: var(--ov-ink-3); list-style: none; }
.ov-avatar { width: 30px; height: 30px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11px; font-weight: 700; flex: none; }
.ov-avatar.sm { width: 24px; height: 24px; font-size: 9.5px; } .ov-avatar.xs { width: 22px; height: 22px; font-size: 9px; }
.ov-av-0 { background: #ecd9a4; color: #5b4510; } .ov-av-1 { background: #f0dcc6; color: #6a3f16; } .ov-av-2 { background: #d4e6dc; color: #22513c; } .ov-av-3 { background: #dcd9ef; color: #3b3670; } .ov-av-4 { background: #f1d5d5; color: #6d2c2c; }
[data-theme="dark"] .ov-av-0 { background: #4a3d1a; color: #f0d98f; } [data-theme="dark"] .ov-av-1 { background: #4a3321; color: #f3cfa9; } [data-theme="dark"] .ov-av-2 { background: #22402f; color: #a9dcbd; } [data-theme="dark"] .ov-av-3 { background: #34305a; color: #cbc5f5; } [data-theme="dark"] .ov-av-4 { background: #4d2626; color: #f3b9b9; }
.ov-stacked { display: flex; gap: 2px; height: 12px; margin: 4px 0 14px; }
.ov-stacked span { border-radius: 2px; min-width: 4px; }
.ov-stacked span:first-child { border-radius: 4px 2px 2px 4px; } .ov-stacked span:last-child { border-radius: 2px 4px 4px 2px; } .ov-stacked span:only-child { border-radius: 4px; }
.ov-brk-list, .ov-bar-list, .ov-feed, .ov-changes { list-style: none; margin: 0; padding: 0; }
.ov-brk-list button { display: grid !important; grid-template-columns: 10px 1fr auto 44px; align-items: center; gap: 10px; width: calc(100% + 16px); padding: 8px !important; margin: 0 -8px; border-radius: 8px; }
.ov-brk-list button:hover, .ov-bar-row:hover { background: var(--ov-surface-2) !important; }
.ov-sw { width: 10px; height: 10px; border-radius: 3px; }
.ov-n { font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.ov-pct { font-size: 12px; color: var(--ov-ink-3); text-align: right; font-variant-numeric: tabular-nums; }
.ov-bar-list { display: grid; gap: 4px; }
.ov-bar-row { display: grid !important; grid-template-columns: 150px 1fr 28px; align-items: center; gap: 10px; width: calc(100% + 12px); margin: 0 -6px; padding: 5px 6px !important; border-radius: 7px; font-size: 13px; }
.ov-lbl { color: var(--ov-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 8px; }
.ov-bar-track { display: block; height: 8px; border-radius: 4px; background: var(--ov-surface-2); overflow: hidden; }
.ov-bar-fill { display: block; height: 100%; border-radius: 4px; background: var(--dash-created); transition: width .4s ease; }
.ov-bar-fill.muted { background: var(--ov-p-low); }
.ov-you { font-size: 10.5px; font-weight: 700; padding: 0 5px; border-radius: 4px; background: var(--ov-brand-soft); color: var(--ov-brand); }
.ov-divider { height: 1px; background: var(--ov-border); margin: 16px 0; }
.ov-mini-title { font-size: 12px !important; font-weight: 600; color: var(--ov-ink-3); text-transform: uppercase; letter-spacing: .07em; margin: 0 0 10px !important; font-family: inherit !important; }
.ov-legend { display: flex; gap: 14px; font-size: 12.5px; color: var(--ov-ink-2); align-items: center; }
.ov-legend span { display: inline-flex; align-items: center; gap: 6px; }
.ov-legend i, .ov-tt-row i { width: 14px; height: 3px; border-radius: 2px; }
.ov-legend i.created, .ov-tt-row i.created { background: var(--dash-created); } .ov-legend i.resolved, .ov-tt-row i.resolved { background: var(--dash-resolved); }
.ov-chart-summary { display: flex; gap: 22px; flex-wrap: wrap; margin: 0 0 8px; }
.ov-chart-summary div { font-size: 12.5px; color: var(--ov-ink-3); }
.ov-chart-summary b { display: block; font-size: 18px; color: var(--ov-ink); font-weight: 600; }
.ov-chart-summary b.up { color: var(--ov-bad); } .ov-chart-summary b.down { color: var(--ov-good); }
.ov-chart { position: relative; min-height: 240px; }
.ov-chart[hidden] { display: none; }
.ov-chart svg { display: block; width: 100%; overflow: visible; }
.ov-grid-line { stroke: var(--ov-border); stroke-width: 1; }
.ov-axis-text { fill: var(--ov-ink-3); font-size: 11px; font-variant-numeric: tabular-nums; }
.ov-end-label { font-size: 11.5px; font-weight: 600; fill: var(--ov-ink-2); }
.ov-area { fill: var(--dash-created); opacity: .07; }
.ov-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.ov-line.created { stroke: var(--dash-created); } .ov-line.resolved { stroke: var(--dash-resolved); }
.ov-dot { stroke: var(--ov-surface); stroke-width: 2; } .ov-dot.created { fill: var(--dash-created); } .ov-dot.resolved { fill: var(--dash-resolved); }
.ov-hover-line { stroke: var(--ov-border-strong); stroke-width: 1; }
.ov-hit { outline: none; }
.ov-tooltip { position: absolute; pointer-events: none; z-index: 5; min-width: 160px; padding: 10px 12px; border-radius: 10px; background: var(--ov-surface); border: 1px solid var(--ov-border); box-shadow: var(--ov-shadow-pop); font-size: 12.5px; opacity: 0; transform: translateY(4px); transition: opacity .12s, transform .12s; }
.ov-tooltip.show { opacity: 1; transform: none; }
.ov-tt-title { font-weight: 600; margin-bottom: 6px; }
.ov-tt-row { display: flex; align-items: center; gap: 8px; }
.ov-tt-row b { margin-left: auto; font-variant-numeric: tabular-nums; }
.ov-tt-row.muted { color: var(--ov-ink-3); margin-top: 4px; }
.ov-data-table td, .ov-data-table th { padding: 7px 12px !important; font-variant-numeric: tabular-nums; }
.ov-data-table td:not(:first-child), .ov-data-table th:not(:first-child) { text-align: right; }
.ov-data-scroll { max-height: 300px; overflow: auto; border: 1px solid var(--ov-border); border-radius: 10px; }
.ov-feed li { display: grid; grid-template-columns: 30px 1fr; gap: 10px; padding: 10px 0; border-top: 1px solid var(--ov-border); }
.ov-feed li:first-child { border-top: 0; padding-top: 0; }
.ov-feed-body { min-width: 0; }
.ov-what { font-size: 13px; color: var(--ov-ink-2); }
.ov-what b { color: var(--ov-ink); font-weight: 600; }
.ov-inline-link { color: var(--ov-brand) !important; font-weight: 600; }
.ov-inline-link:hover { text-decoration: underline; }
.ov-detail { font-size: 12.5px; color: var(--ov-ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-feed time { font-size: 11.5px; color: var(--ov-ink-3); }
.ov-changes li { display: grid; grid-template-columns: 48px 1fr auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--ov-border); }
.ov-changes li:first-child { border-top: 0; padding-top: 0; }
.ov-changes li.ov-empty { display: block; }
.ov-cal { text-align: center; border: 1px solid var(--ov-border); border-radius: 9px; overflow: hidden; line-height: 1.1; }
.ov-cal span { display: block; font-size: 10px; font-weight: 700; text-transform: uppercase; padding: 3px 0; background: var(--ov-surface-2); color: var(--ov-ink-3); }
.ov-cal b { display: block; font-size: 17px; padding: 4px 0 5px; }
.ov-chg-main { min-width: 0; }
.ov-chg-title { font-weight: 500; font-size: 13.5px; }
.ov-chg-title:hover { color: var(--ov-brand) !important; text-decoration: underline; }
.ov-chg-meta { font-size: 12px; color: var(--ov-ink-3); }
.ov-status { font-size: 11.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.ov-status.approved { background: var(--ov-good-soft); color: var(--ov-good); }
.ov-status.pending { background: var(--ov-warn-soft); color: var(--ov-warn); }
.ov-status.progress { background: var(--ov-brand-soft); color: var(--ov-brand); }
.ov-status.scheduled { background: var(--ov-surface-2); color: var(--ov-ink-2); }
@media (max-width: 1200px) { .ov-grid, .ov-grid-halves { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 1100px) { .ov-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); } .ov-kpi { grid-column: span 2; } .ov-kpi:nth-child(n+4) { grid-column: span 3; } }
@media (max-width: 640px) {
  .ov-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ov-kpi, .ov-kpi:nth-child(n+4) { grid-column: span 1; } .ov-kpi:last-child { grid-column: span 2; }
  .ov-kpi-value { font-size: 24px; }
  #ovAttnTable th:nth-child(2), #ovAttnTable td:nth-child(2), #ovAttnTable th:nth-child(4), #ovAttnTable td:nth-child(4) { display: none; }
  .ov-col-ticket { min-width: 120px; }
  .ov-table th, .ov-table td { padding-left: 8px; padding-right: 8px; }
  .ov-banner { flex-wrap: wrap; align-items: flex-start; } .ov-banner-body { flex-basis: calc(100% - 100px); }
  .ov-bar-row { grid-template-columns: 110px 1fr 24px; }
}
@media (prefers-reduced-motion: reduce) { #overviewView * { transition: none !important; } }

/* =====================================================================================================
   Modern look (design/overview.html), applied app-wide. Kept last so it overrides earlier component styles.
   Colors are theme tokens; dark values are set under [data-theme="dark"], which the theme menu controls.
   ===================================================================================================== */
:root {
  --paper:#f6f4ee; --surface:#fffefa; --surface-2:#f2efe7; --line:#e7e2d7; --line-strong:#d5cfc1;
  --ink:#1f2a24; --ink-2:#4c5750; --muted:#69716a;
  --spruce:#2f5d4a; --spruce-dark:#264d3d; --spruce-pale:#e2ebe5; --brand-ink:#ffffff;
  --good:#2b7a4b; --good-soft:#e0efe5; --bad:#b03e2c; --bad-soft:#f7e3de;
  --shadow:0 1px 2px rgba(31,42,36,.04), 0 2px 6px rgba(31,42,36,.04); --shadow-pop:0 8px 28px rgba(31,42,36,.14);
  --control-border:#d5cfc1; --control-hover:#b9b2a2; --control-focus:rgba(47,93,74,.16);
  --hover-bg:#f2efe7; --hover-bg-subtle:#f7f5ef; --radius:12px;
  --font-ui:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
:root[data-theme="dark"] {
  --paper:#141715; --surface:#1c201e; --surface-2:#242926; --line:#2d3330; --line-strong:#3b433e;
  --ink:#eef1ec; --ink-2:#bcc3bd; --muted:#939b94;
  --spruce:#86bea2; --spruce-dark:#9dcbb4; --spruce-pale:#22322a; --brand-ink:#0f1a15;
  --good:#74c592; --good-soft:#1d3326; --bad:#ec8a75; --bad-soft:#3b231e;
  --shadow:0 1px 2px rgba(0,0,0,.3); --shadow-pop:0 10px 30px rgba(0,0,0,.5);
  --control-border:#3b433e; --control-hover:#4d5750; --control-focus:rgba(134,190,162,.22);
  --hover-bg:#242926; --hover-bg-subtle:#202422;
}
body { font-family:var(--font-ui); font-size:14px; line-height:1.45; -webkit-font-smoothing:antialiased; background:var(--paper); color:var(--ink); }
button, input, select, textarea { font-family:inherit; }
.app-shell :focus-visible, .modal :focus-visible { outline:2px solid var(--spruce); outline-offset:2px; }
.nav-svg { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }

/* ---- Sidebar ---- */
.sidebar, [data-theme="dark"] .sidebar { background:var(--surface); border-right:1px solid var(--line); padding:20px 14px; }
.brand-lockup { gap:10px; padding:4px 8px 16px; }
.brand-mark { width:34px; height:34px; border-radius:9px; background:var(--spruce); color:var(--brand-ink); font:600 16px var(--font-ui); }
.brand-lockup strong { font:600 15px var(--font-ui); letter-spacing:-.01em; color:var(--ink); }
.brand-lockup small { font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.workspace-switcher, [data-theme="dark"] .workspace-switcher { width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:none; margin-bottom:10px; }
.workspace-switcher:hover { border-color:var(--line-strong); }
.workspace-switcher .avatar { width:28px; height:28px; border-radius:7px; background:var(--spruce-pale); color:var(--spruce); font-size:11px; font-weight:700; }
.workspace-copy b { font-size:13px; font-weight:600; color:var(--ink); }
.sidebar .nav-label { font-size:10.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); padding:14px 10px 6px; margin:0; }
.sidebar .nav-item, [data-theme="dark"] .sidebar .nav-item { position:relative; gap:11px; padding:8px 10px; margin:1px 0; border-radius:8px; color:var(--ink-2); font-size:13.5px; font-weight:500; background:none; }
.sidebar .nav-item:hover, [data-theme="dark"] .sidebar .nav-item:hover { background:var(--surface-2); color:var(--ink); font-weight:500; }
.sidebar .nav-item.active, [data-theme="dark"] .sidebar .nav-item.active { background:var(--spruce-pale); color:var(--spruce); font-weight:600; }
.sidebar .nav-item.active::before { content:""; position:absolute; left:-14px; top:8px; bottom:8px; width:3px; border-radius:0 3px 3px 0; background:var(--spruce); }
.nav-text { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-bottom { border-top:1px solid var(--line); padding-top:12px; }

/* ---- Top bar ---- */
.topbar, [data-theme="dark"] .topbar { position:sticky; top:0; z-index:20; height:64px; padding:0 32px; gap:12px; background:color-mix(in srgb, var(--paper) 88%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.breadcrumbs { font-size:13px; color:var(--muted); white-space:nowrap; }
.breadcrumbs strong { color:var(--ink); font-weight:600; }
.top-actions { gap:8px; flex:1; justify-content:flex-end; }
.topbar-search { display:flex; align-items:center; gap:8px; flex:0 1 460px; min-width:0; margin-right:auto; margin-left:24px; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--muted); font-size:13px; text-align:left; cursor:text; }
.topbar-search:hover { border-color:var(--line-strong); }
.topbar-search span { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.topbar-search .nav-svg { width:15px; height:15px; }
.topbar-search kbd, .theme-choice kbd { padding:2px 6px; border:1px solid var(--line-strong); border-radius:5px; background:var(--surface-2); color:var(--muted); font:500 11px var(--font-ui); }
.agent-profile-button, [data-theme="dark"] .agent-profile-button { min-height:40px; padding:4px 8px 4px 4px; border:0; border-radius:10px; background:none; color:var(--ink); }
.agent-profile-button:hover { background:var(--surface-2); }
.agent-profile-button .avatar { width:30px; height:30px; }
.agent-profile-button b { font-size:13px; font-weight:600; color:var(--ink); }
.agent-profile-button small { font-size:11.5px; color:var(--muted); }
.agent-profile-dropdown, [data-theme="dark"] .agent-profile-dropdown { width:236px; padding:6px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }
.agent-profile-dropdown > button { padding:8px 10px; border-radius:8px; color:var(--ink-2); font-size:13px; text-align:left; background:none; }
.agent-profile-dropdown > button:hover { background:var(--surface-2); color:var(--ink); }
.menu-label { padding:6px 10px 4px; color:var(--muted); font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.menu-sep { height:1px; margin:6px 4px; background:var(--line); }
.theme-choice { display:flex; gap:2px; margin:2px 6px 4px; padding:3px; border:1px solid var(--line); border-radius:9px; background:var(--surface-2); }
.theme-choice button { flex:1; padding:5px 8px; border:0; border-radius:6px; background:none; color:var(--ink-2); font-size:12.5px; font-weight:500; }
.theme-choice button[aria-pressed="true"] { background:var(--surface); color:var(--ink); font-weight:600; box-shadow:var(--shadow); }

/* ---- Page frame and headings ---- */
.view-container { padding:28px 32px 72px; }
.page-heading h1, .ov-head h1, #overviewView h1 { font:600 26px/1.2 var(--font-ui); letter-spacing:-.02em; color:var(--ink); }
.detail-header h1 { font:600 28px/1.2 var(--font-ui); letter-spacing:-.02em; }
.eyebrow, .modal-kicker { color:var(--muted); font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.subheading { color:var(--ink-2); }
.panel-heading h2, .panel h2, .catalog-heading h2, .settings-group h2 { font-family:var(--font-ui); font-weight:600; letter-spacing:-.01em; color:var(--ink); }
.panel-heading h2 { font-size:15px; }
.panel-heading p, .catalog-heading p { color:var(--muted); font-size:12.5px; }

/* ---- Cards ---- */
.panel, .metric-card, [data-theme="dark"] .panel, [data-theme="dark"] .metric-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }

/* ---- Buttons ---- */
.create-button, .save-button, [data-theme="dark"] .create-button, [data-theme="dark"] .save-button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:0 14px; border:0; border-radius:9px; background:var(--spruce); color:var(--brand-ink); font-size:13px; font-weight:600; box-shadow:none; }
.create-button:hover, .save-button:hover, [data-theme="dark"] .create-button:hover, [data-theme="dark"] .save-button:hover { background:var(--spruce-dark); color:var(--brand-ink); }
.create-button span { font-size:16px; line-height:1; }
.outline-button, .quiet-button, .columns-button, .action-menu, [data-theme="dark"] .outline-button, [data-theme="dark"] .quiet-button { min-height:34px; padding:0 12px; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--ink); font-size:13px; font-weight:600; box-shadow:none; }
.outline-button:hover, .quiet-button:hover, .columns-button:hover, .action-menu:hover { border-color:var(--line-strong); background:var(--surface); color:var(--ink); }
.text-button { color:var(--spruce); font-weight:600; }
.sla-policy-edit { border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); font-size:11.5px; font-weight:600; }
.sla-policy-edit:hover { border-color:var(--line-strong); }

/* ---- Form fields ---- */
.view-container input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]), .view-container select, .view-container textarea,
.modal input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]), .modal select, .modal textarea { border-color:var(--control-border); border-radius:9px; background-color:var(--surface); color:var(--ink); }
.view-container input:focus, .view-container select:focus, .view-container textarea:focus, .modal input:focus, .modal select:focus, .modal textarea:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); outline:none; }
.custom-select-trigger, .ticket-state-multi-trigger, [data-theme="dark"] .ticket-state-multi-trigger { border-color:var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); }
.custom-select-trigger:hover, .ticket-state-multi-trigger:hover { border-color:var(--control-hover); }
.custom-select-menu, .ticket-state-multi-menu { border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }

/* ---- Tables ---- */
.tableWrap th { padding:10px 12px; border-bottom:1px solid var(--line); color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.tableWrap td { border-bottom-color:var(--line); }
.tableWrap tbody tr:hover { background:var(--surface-2); }
.ticket-table-head, #ticketsView .ticket-table-head { color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.06em; }

/* ---- Tabs ---- */
.ticket-view-tabs { gap:4px; box-shadow:inset 0 -1px 0 var(--line); border-bottom:0; }
.ticket-view-tab { padding:8px 10px 10px; border:0; border-bottom:2px solid transparent; border-radius:0; background:none; color:var(--muted); font-size:13px; font-weight:500; }
.ticket-view-tab:hover { color:var(--ink); background:none; }
.ticket-view-tab.active { color:var(--ink); border-bottom-color:var(--spruce); font-weight:600; background:none; }

/* ---- Modals, menus, toast ---- */
.modal-backdrop { background:rgba(20,23,21,.38); backdrop-filter:blur(2px); }
.modal, [data-theme="dark"] .modal { border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:var(--shadow-pop); }
.modal h2 { font-family:var(--font-ui); font-weight:600; letter-spacing:-.01em; }
.toast, [data-theme="dark"] .toast { border-radius:10px; background:var(--ink); color:var(--paper); font-weight:500; box-shadow:var(--shadow-pop); }
.global-search-box, [data-theme="dark"] .global-search-box { border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }
.global-search-results, [data-theme="dark"] .global-search-results { border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }

/* ---- Assistant button (replaces the two stacked floating buttons) ---- */
.side-toolbar { right:24px; bottom:24px; gap:8px; align-items:flex-end; }
.side-toolbar > .clipboard-tool-menu > .side-tool-button, .side-toolbar > #openAiChatButton { display:none !important; }
.side-toolbar > .clipboard-tool-menu { order:5; }
.assistant-fab { order:10; display:grid; place-items:center; width:48px; height:48px; border:0; border-radius:14px; background:var(--spruce); color:var(--brand-ink); box-shadow:var(--shadow-pop); cursor:pointer; }
.assistant-fab:hover { background:var(--spruce-dark); }
.assistant-fab .nav-svg { width:20px; height:20px; }
.assistant-menu { order:1; display:none; min-width:200px; padding:6px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }
.assistant-menu.open { display:grid; }
.assistant-menu button { display:flex; align-items:center; gap:10px; padding:8px 10px; border:0; border-radius:8px; background:none; color:var(--ink-2); font-size:13px; text-align:left; cursor:pointer; }
.assistant-menu button:hover { background:var(--surface-2); color:var(--ink); }
.assistant-menu .nav-svg { width:15px; height:15px; }

@media (max-width:900px) {
  .topbar-search { margin-left:8px; }
  .topbar-search span, .topbar-search kbd { display:none; }
  .topbar-search { flex:0 0 auto; }
}
@media (max-width:640px) {
  .topbar { padding:0 16px; }
  .view-container { padding:20px 16px 88px; }
  .page-heading h1, #overviewView h1 { font-size:21px; }
}
#ticketsView .ticket-table-head, [data-theme="dark"] #ticketsView .ticket-table-head { background:var(--surface-2) !important; border-bottom-color:var(--line); color:var(--muted); }
#ticketsView .ticket-table-head > [data-column-key], [data-theme="dark"] #ticketsView .ticket-table-head > [data-column-key] { background:transparent; }
#ticketsView .next-breach.breached-text, #ticketsView .sla-count.breached, [data-theme="dark"] #ticketsView .next-breach.breached-text, [data-theme="dark"] #ticketsView .sla-count.breached { color:var(--bad); }

/* ---------- New ticket drawer (new-ticket.js) ---------- */
#ticketModal {
  --nt-critical:#b03e2c; --nt-high:#d27b2e; --nt-medium:#c9a13f; --nt-low:#9aa196;
  position:fixed; inset:0; z-index:40; display:flex; justify-content:flex-end; background:rgba(20,23,21,0); visibility:hidden;
  transition:background .22s ease, visibility 0s linear .22s; font-family:var(--font-ui);
}
[data-theme="dark"] #ticketModal { --nt-critical:#e8735d; --nt-high:#e99a55; --nt-medium:#e3c678; --nt-low:#7d857f; }
#ticketModal.open { visibility:visible; background:rgba(20,23,21,.38); transition:background .22s ease; }
[data-theme="dark"] #ticketModal.open { background:rgba(0,0,0,.55); }
body.nt-drawer-open { overflow:hidden; }
.nt-drawer { position:relative; display:flex; flex-direction:column; width:min(600px,100%); height:100%; margin:0; background:var(--surface); border-left:1px solid var(--line); box-shadow:-18px 0 50px rgba(20,23,21,.16); transform:translateX(32px); opacity:0; transition:transform .24s cubic-bezier(.2,.8,.2,1), opacity .2s ease; color:var(--ink); }
#ticketModal.open .nt-drawer { transform:none; opacity:1; }
@media (prefers-reduced-motion: reduce) { #ticketModal, .nt-drawer { transition:none; } }
.nt-head { display:flex; align-items:center; gap:14px; padding:18px 22px; border-bottom:1px solid var(--line); }
.nt-head-text { flex:1; min-width:0; }
.nt-kicker { display:block; color:var(--muted); font-size:11.5px; font-weight:500; }
.nt-head h2 { margin:2px 0 0; font:600 19px/1.25 var(--font-ui); letter-spacing:-.01em; color:var(--ink); }
.nt-close { display:grid; place-items:center; width:34px; height:34px; border-radius:9px; background:transparent; color:var(--muted); flex:0 0 auto; }
.nt-close svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.nt-close:hover { background:var(--hover-bg); color:var(--ink); }
.nt-seg { display:inline-flex; padding:3px; gap:2px; background:var(--surface-2); border:1px solid var(--line); border-radius:10px; }
.nt-seg button { padding:6px 12px; border-radius:7px; background:transparent; color:var(--ink-2); font-size:12.5px; font-weight:500; }
.nt-seg button:hover { color:var(--ink); }
.nt-seg button[aria-checked="true"] { background:var(--surface); color:var(--ink); box-shadow:0 1px 2px rgba(20,23,21,.1), 0 0 0 1px var(--line); font-weight:600; }
.nt-body { flex:1; overflow-y:auto; padding:6px 22px 22px; overscroll-behavior:contain; }
.nt-section { padding:18px 0; border-bottom:1px solid var(--line); }
.nt-section:last-child { border-bottom:0; }
.nt-label { display:block; margin:0 0 8px; color:var(--ink); font-size:13px; font-weight:600; }
.nt-section .nt-label ~ .nt-label, #ntRequestTypeWrap .nt-label { margin-top:16px; }
.nt-label-row .nt-label { margin:0; }
.nt-label .required { color:var(--bad); font-weight:600; }
.nt-optional { margin-left:4px; color:var(--muted); font-size:11.5px; font-weight:400; }
.nt-label-row { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; }
#ticketModal input[type="text"], #ticketModal textarea {
  display:block; width:100%; margin:0; padding:10px 12px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink);
  font:400 14px/1.45 var(--font-ui); outline:none; transition:border-color .15s, box-shadow .15s;
}
#ticketModal input[type="text"]::placeholder, #ticketModal textarea::placeholder { color:var(--muted); opacity:.85; }
#ticketModal input[type="text"]:hover, #ticketModal textarea:hover { border-color:var(--control-hover); }
#ticketModal input[type="text"]:focus, #ticketModal textarea:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
#ticketModal textarea { min-height:112px; resize:vertical; }
#ticketModal .nt-subject { font-size:15px; font-weight:500; padding:11px 12px; }
#ticketModal .field-invalid, #ticketModal .field-invalid:focus { border-color:var(--bad); box-shadow:0 0 0 3px var(--bad-soft); }
.nt-error { display:flex; align-items:center; gap:6px; margin:7px 0 0; color:var(--bad); font-size:12.5px; }
.nt-error[hidden] { display:none; }
.nt-combo { position:relative; }
.nt-combo[hidden] { display:none; }
.nt-combo-icon { position:absolute; left:12px; top:50%; width:16px; height:16px; transform:translateY(-50%); fill:none; stroke:var(--muted); stroke-width:2; stroke-linecap:round; pointer-events:none; }
#ticketModal .nt-combo input { padding-left:36px; }
.nt-options { position:absolute; z-index:5; left:0; right:0; top:calc(100% + 6px); max-height:292px; overflow-y:auto; margin:0; padding:5px; list-style:none; background:var(--surface); border:1px solid var(--line); border-radius:11px; box-shadow:var(--shadow-pop); }
.nt-options[hidden] { display:none; }
.nt-options li[role="option"] { display:flex; align-items:center; gap:10px; padding:8px 9px; border-radius:8px; cursor:pointer; }
.nt-options li[role="option"]:hover, .nt-options li[aria-selected="true"] { background:var(--hover-bg); }
.nt-option-empty { padding:10px; color:var(--muted); font-size:12.5px; }
.nt-option-text { flex:1; min-width:0; }
.nt-option-text b, .nt-person-text b { display:block; font-size:13px; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nt-option-text small, .nt-person-text small { display:block; margin-top:1px; color:var(--muted); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nt-option-count { flex:0 0 auto; padding:2px 8px; border-radius:999px; background:var(--surface-2); color:var(--ink-2); font-size:11.5px; font-weight:500; }
.nt-avatar { display:grid; place-items:center; flex:0 0 auto; width:30px; height:30px; border-radius:50%; background:var(--spruce-pale); color:var(--spruce); font-size:11.5px; font-weight:600; }
.nt-avatar-new { background:var(--surface-2); color:var(--ink-2); font-size:16px; font-weight:400; }
.nt-avatar-lg { width:38px; height:38px; font-size:13px; }
.nt-person { display:flex; align-items:center; gap:12px; padding:11px 12px; border:1px solid var(--line); border-radius:11px; background:var(--surface-2); }
.nt-person[hidden] { display:none; }
.nt-person-text { flex:1; min-width:0; }
.nt-person-open { display:block; margin-top:5px; color:var(--ink-2); font-size:12px; }
.nt-link, .nt-inline-link { background:none; padding:0; white-space:nowrap; color:var(--spruce); font-size:12.5px; font-weight:600; cursor:pointer; }
.nt-link:hover, .nt-inline-link:hover { text-decoration:underline; text-underline-offset:2px; }
.nt-link[hidden] { display:none; }
.nt-inline-link { font-size:12px; font-weight:500; }
.nt-suggest { margin:12px 0 2px; padding:10px; border:1px solid var(--line); border-radius:11px; background:var(--surface-2); }
.nt-suggest[hidden] { display:none; }
.nt-suggest-group + .nt-suggest-group { margin-top:8px; padding-top:8px; border-top:1px solid var(--line); }
.nt-suggest-title { display:flex; align-items:center; gap:6px; margin:0 0 4px 4px; color:var(--muted); font-size:11.5px; font-weight:600; }
.nt-suggest-title svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.nt-suggest-item { display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:10px; width:100%; padding:7px 8px; border-radius:8px; background:transparent; text-align:left; color:var(--ink); }
.nt-suggest-item:hover { background:var(--surface); box-shadow:0 0 0 1px var(--line); }
.nt-suggest-id { grid-row:span 2; align-self:start; padding-top:1px; color:var(--muted); font-size:11.5px; font-variant-numeric:tabular-nums; }
.nt-suggest-name { font-size:13px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nt-suggest-meta { color:var(--muted); font-size:11.5px; }
.nt-chips { display:flex; flex-wrap:wrap; gap:7px; }
.nt-chip { padding:7px 13px; border:1px solid var(--control-border); border-radius:999px; background:var(--surface); color:var(--ink-2); font-size:13px; font-weight:500; transition:border-color .15s, background .15s; }
.nt-chips-sm .nt-chip { padding:5px 11px; font-size:12.5px; }
.nt-chip:hover { border-color:var(--control-hover); color:var(--ink); }
.nt-chip[aria-checked="true"] { border-color:var(--spruce); background:var(--spruce-pale); color:var(--spruce); font-weight:600; }
#ntRequestTypeWrap[hidden] { display:none; }
.nt-priority { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.nt-prio { display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:10px 11px; border:1px solid var(--control-border); border-radius:10px; background:var(--surface); text-align:left; color:var(--ink); transition:border-color .15s, box-shadow .15s, background .15s; }
.nt-prio:hover { border-color:var(--control-hover); }
.nt-prio-name { display:flex; align-items:center; gap:7px; font-size:13px; font-weight:600; }
.nt-prio-name i { width:8px; height:8px; border-radius:50%; background:var(--nt-medium); }
.nt-prio[data-priority="critical"] i { background:var(--nt-critical); }
.nt-prio[data-priority="high"] i { background:var(--nt-high); }
.nt-prio[data-priority="low"] i { background:var(--nt-low); }
.nt-prio small { color:var(--muted); font-size:11.5px; }
.nt-prio[aria-checked="true"] { border-color:var(--spruce); background:var(--spruce-pale); box-shadow:0 0 0 1px var(--spruce) inset; }
.nt-prio[data-priority="critical"][aria-checked="true"] { border-color:var(--nt-critical); background:var(--bad-soft); box-shadow:0 0 0 1px var(--nt-critical) inset; }
.nt-sla { display:flex; align-items:flex-start; gap:8px; margin:12px 0 0; color:var(--ink-2); font-size:12.5px; line-height:1.45; }
.nt-sla svg { flex:0 0 auto; width:15px; height:15px; margin-top:1px; fill:none; stroke:var(--muted); stroke-width:2; stroke-linecap:round; }
.nt-sla b { color:var(--ink); font-weight:600; }
.nt-sla em { color:var(--muted); font-style:normal; }
#ntAssignSection[hidden] { display:none; }
.nt-two { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.nt-field { display:block; color:var(--ink-2); font-size:12px; font-weight:500; }
.nt-field .custom-select-wrapper { margin-top:6px; }
.nt-field .custom-select-trigger { min-height:40px; padding:9px 12px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); font-size:13.5px; font-weight:400; }
.nt-field .custom-select-trigger:hover { border-color:var(--control-hover); }
.nt-field .custom-select-wrapper.open .custom-select-trigger { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
.nt-hint { margin:10px 0 0; color:var(--muted); font-size:12.5px; }
.nt-hint b { color:var(--ink-2); font-weight:600; }
.nt-foot { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 22px; border-top:1px solid var(--line); background:var(--surface); }
.nt-foot-left { display:flex; align-items:center; gap:14px; min-width:0; }
.nt-kbd-hint { color:var(--muted); font-size:12px; white-space:nowrap; }
.nt-kbd-hint kbd { display:inline-block; margin-right:3px; padding:1px 5px; border:1px solid var(--line-strong); border-bottom-width:2px; border-radius:5px; background:var(--surface-2); color:var(--ink-2); font:500 11px var(--font-ui); }
.nt-foot-actions { display:flex; gap:8px; }
.nt-btn { padding:9px 15px; border-radius:9px; font-size:13px; font-weight:600; white-space:nowrap; transition:background .15s, border-color .15s; }
.nt-btn-ghost { background:transparent; color:var(--ink-2); }
.nt-btn-ghost:hover { background:var(--hover-bg); color:var(--ink); }
.nt-btn-secondary { background:var(--surface); color:var(--ink); border:1px solid var(--control-border); }
.nt-btn-secondary:hover { border-color:var(--control-hover); background:var(--hover-bg-subtle); }
.nt-btn-primary { background:var(--spruce); color:var(--brand-ink); border:1px solid var(--spruce); }
.nt-btn-primary:hover { background:var(--spruce-dark); border-color:var(--spruce-dark); }
.nt-btn:disabled { opacity:.6; cursor:progress; }
#ticketModal :focus-visible { outline:2px solid var(--spruce); outline-offset:2px; }
#ticketModal input:focus-visible, #ticketModal textarea:focus-visible { outline:none; }
@media (max-width: 640px) {
  .nt-drawer { width:100%; border-left:0; }
  .nt-head { flex-wrap:wrap; padding:14px 16px; }
  .nt-head-text { flex-basis:calc(100% - 50px); }
  .nt-seg { order:3; }
  .nt-body { padding:0 16px 16px; }
  .nt-priority { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .nt-two { grid-template-columns:1fr; }
  .nt-foot { padding:12px 16px; }
  .nt-kbd-hint { display:none; }
  .nt-foot-actions { flex:1; justify-content:flex-end; }
  .nt-btn-ghost { display:none; }
}

/* ---------- Restyle step 2: per-page polish ---------- */
:root { --state-open:var(--spruce); --state-pending:#c08a2b; --state-onsite:#b8573f; --state-done:#9aa196; }
[data-theme="dark"] { --state-open:#86bea2; --state-pending:#e2ab4f; --state-onsite:#ec8a75; --state-done:#7d857f; }

/* Ticket detail: quiet eyebrow and back link, sentence-case tabs with a thin brand underline */
.detail-header .eyebrow, [data-theme="dark"] .detail-header .eyebrow { color:var(--muted); text-transform:none; letter-spacing:0; font-size:12.5px; font-weight:500; }
.detail-header .eyebrow span, [data-theme="dark"] .detail-header .eyebrow span { color:var(--ink-2); font-weight:600; }
.back-to-tickets, [data-theme="dark"] .back-to-tickets { color:var(--muted); font-size:12.5px; font-weight:500; }
.back-to-tickets:hover, [data-theme="dark"] .back-to-tickets:hover { color:var(--ink); }
.detail-tabs, [data-theme="dark"] .detail-tabs { gap:2px !important; border-bottom:1px solid var(--line) !important; }
.detail-tabs button, [data-theme="dark"] .detail-tabs button { padding:0 12px 11px !important; color:var(--muted) !important; font-size:13.5px !important; font-weight:500; text-transform:none !important; letter-spacing:0 !important; }
.detail-tabs button:hover, [data-theme="dark"] .detail-tabs button:hover { color:var(--ink) !important; }
.detail-tabs button.active, [data-theme="dark"] .detail-tabs button.active { color:var(--ink) !important; font-weight:600; }
.detail-tabs button.active:after, [data-theme="dark"] .detail-tabs button.active:after { left:8px; right:8px; height:2px; border-radius:2px 2px 0 0; background:var(--spruce) !important; }
.activity-note p, [data-theme="dark"] .activity-note p { color:var(--ink-2); }
.activity-note p b, [data-theme="dark"] .activity-note p b { color:var(--ink); }
.activity-note small, [data-theme="dark"] .activity-note small { color:var(--muted); }
.visibility-toggle, [data-theme="dark"] .visibility-toggle { color:var(--ink-2); }
.visibility-toggle.active { background:var(--surface); }
.attach-button, [data-theme="dark"] .attach-button { border-color:var(--control-border); background:var(--surface); color:var(--ink-2) !important; }
.attach-button:hover, [data-theme="dark"] .attach-button:hover { border-color:var(--control-hover); color:var(--ink) !important; }
.toolbar-divider, [data-theme="dark"] .toolbar-divider { background:var(--line) !important; }
.custom-state-dropdown.open .state-dropdown-trigger { border-color:var(--spruce) !important; box-shadow:0 0 0 3px var(--control-focus) !important; }
.state-field .state-dropdown-trigger:after { border-color:var(--muted); }

/* State: a coloured dot on a neutral control (admin-configured state colours still apply inline) */
html .ticket-detail .state-field .state-dropdown-trigger[class] { border-color:var(--control-border) !important; background:var(--surface) !important; color:var(--ink) !important; }
html .ticket-detail .state-field .state-dropdown-option[class] { border-color:transparent !important; background:transparent !important; color:var(--ink) !important; }
html .ticket-detail .state-field .state-dropdown-option[class]:hover { background:var(--hover-bg) !important; }
.ticket-detail .state-dropdown-trigger > span { color:var(--ink) !important; }
.ticket-row .ticket-state-chip, [data-theme="dark"] .ticket-row .ticket-state-chip { align-items:center; min-height:0; padding:4px 0; border-color:transparent; background:transparent; color:var(--ink-2); font-size:12.5px !important; font-weight:500; }
.ticket-row .ticket-state-chip > span { color:var(--ink-2) !important; }
.ticket-row .ticket-state-chip > i, .ticket-detail .state-dropdown-trigger > i, .ticket-detail .state-dropdown-option > i { margin-top:0; background:var(--state-open) !important; }
:is(.ticket-row .ticket-state-chip, .ticket-detail .state-dropdown-trigger, .ticket-detail .state-dropdown-option):is(.state-pending-customer, .state-pending-escalation, .state-waiting-for-approval, .state-on-hold) > i { background:var(--state-pending) !important; }
:is(.ticket-row .ticket-state-chip, .ticket-detail .state-dropdown-trigger, .ticket-detail .state-dropdown-option):is(.state-onsite-required) > i { background:var(--state-onsite) !important; }
:is(.ticket-row .ticket-state-chip, .ticket-detail .state-dropdown-trigger, .ticket-detail .state-dropdown-option):is(.state-resolved, .state-closed, .state-cancelled) > i { background:var(--state-done) !important; }
.ticket-row .ticket-state-chip:is(.state-new, .state-assigned, .state-working, .state-approved, .state-pending-customer, .state-pending-escalation, .state-waiting-for-approval, .state-onsite-required, .state-resolved, .state-closed),
[data-theme="dark"] .ticket-row .ticket-state-chip:is(.state-new, .state-assigned, .state-working, .state-approved, .state-pending-customer, .state-pending-escalation, .state-waiting-for-approval, .state-onsite-required, .state-resolved, .state-closed) { border-color:transparent; background:transparent; color:var(--ink-2); }

/* Tickets page: plain view title, unboxed toolbar and filters, plain ticket numbers */
#ticketsView .ticket-view-selector, [data-theme="dark"] #ticketsView .ticket-view-selector { gap:10px; min-height:0; margin-left:-8px; padding:4px 10px 4px 8px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--ink); font:600 26px/1.2 var(--font-ui); letter-spacing:-.015em; }
#ticketsView .ticket-view-selector:hover { border-color:var(--line); background:var(--surface); color:var(--ink); }
.ticket-view-selector span:after { border-color:var(--muted); }
#ticketsView .ticket-page-actions, [data-theme="dark"] #ticketsView .ticket-page-actions { border-color:transparent !important; background:transparent !important; box-shadow:none !important; }
.ticket-page-actions .view-size-control .custom-select-trigger:hover { border-color:var(--control-hover); background:var(--surface); color:var(--ink); }
.ticket-filters, [data-theme="dark"] .ticket-filters { border-color:transparent !important; background:transparent !important; box-shadow:none !important; padding-left:0 !important; padding-right:0 !important; }
.ticket-filters .filter-select > span, .ticket-filters .filter-select span, [data-theme="dark"] .ticket-filters .filter-select span { color:var(--muted); font-size:11.5px; font-weight:500; text-transform:none; letter-spacing:0; }
.ticket-filters .custom-select-trigger, [data-theme="dark"] .ticket-filters .custom-select-trigger { padding:9px 12px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); font-size:13px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ticket-filters .custom-select-trigger:hover { border-color:var(--control-hover); }
#ticketsView .ticket-number, [data-theme="dark"] #ticketsView .ticket-number { justify-content:flex-start; min-width:0; padding:0; background:none; color:var(--ink-2); font-size:12.5px; font-weight:600; font-variant-numeric:tabular-nums; }
.search-glyph, .requester-history-search .search-glyph { color:var(--muted); }

/* My Workspace: neutral counts and brand dots */
.workspace-category-heading strong, [data-theme="dark"] .workspace-category-heading strong { min-width:30px; height:30px; border-radius:999px; background:var(--surface-2); color:var(--ink); font:600 14px var(--font-ui); }
.workspace-summary-dot { background:var(--spruce); }

/* Knowledge base: a calm search card instead of the solid green banner; one visibility control per article */
#knowledgeView .knowledge-hero { gap:24px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); background-image:none; box-shadow:var(--shadow); color:var(--ink); }
#knowledgeView .knowledge-hero h2 { margin:0 0 4px; color:var(--ink); font:600 20px/1.3 var(--font-ui); letter-spacing:-.01em; }
#knowledgeView .knowledge-hero p { color:var(--muted); font-size:13px; }
#knowledgeView .hero-icon { display:none; }
#knowledgeView .knowledge-search, [data-theme="dark"] #knowledgeView .knowledge-search { align-items:center; border:1px solid var(--control-border); border-radius:10px; background:var(--surface); color:var(--muted); padding:10px 12px; }
#knowledgeView .knowledge-search:focus-within { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
#knowledgeView .knowledge-search input { font-size:13.5px; }
@media (min-width: 761px) { #knowledgeView .knowledge-search { width:min(400px, 45%); } }
.knowledge-visibility:has(select:not(:disabled)) .visibility-badge { display:none; }
.knowledge-visibility:has(select:disabled) .custom-select-wrapper { display:none; }
.visibility-badge { padding:3px 8px; border-radius:999px; font-size:11px; font-weight:600; text-transform:none; }
.visibility-badge.public, [data-theme="dark"] .visibility-badge.public { background:var(--spruce-pale); color:var(--spruce); }
.visibility-badge.internal, [data-theme="dark"] .visibility-badge.internal { background:var(--surface-2); color:var(--ink-2); }

/* Problems: status is a dot and a label, never a highlighted block */
.problem-status.resolved { background:none !important; }
.problem-status { font-weight:500; font-size:12.5px; color:var(--ink-2); }
.problem-status.mitigated:before { background:var(--state-open); }
.problem-status.resolved:before { background:var(--state-done); }

/* Buttons whose label sits in a span keep the normal button text size */
.create-button span#genericAction { margin:0; font-size:inherit; font-weight:inherit; line-height:inherit; }
[data-theme="dark"] .metric-icon.icon-ink { background:var(--surface-2); color:var(--ink-2); }

#ticketsView .ticket-filters .filter-select > span, [data-theme="dark"] #ticketsView .ticket-filters .filter-select > span { color:var(--muted) !important; font-size:11.5px !important; font-weight:500 !important; text-transform:none !important; letter-spacing:0 !important; }
#ticketsView .ticket-filters .filter-select, [data-theme="dark"] #ticketsView .ticket-filters .filter-select { background:transparent; }
#ticketsView .ticket-state-multi-trigger, [data-theme="dark"] #ticketsView .ticket-state-multi-trigger { gap:8px; padding:9px 12px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); font-size:13px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-shadow:none; }
#ticketsView .ticket-state-multi-trigger:hover { border-color:var(--control-hover); background:var(--surface); }
#ticketsView .ticket-state-multi-select.open .ticket-state-multi-trigger { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
#ticketsView .ticket-state-multi-trigger:after { flex:0 0 auto; border-color:var(--muted); }

html #ticketsView .ticket-row .ticket-state-chip[class], html .workspace-queue-panel .ticket-row .ticket-state-chip[class] { border:0 !important; background:transparent !important; box-shadow:none !important; }
html #ticketsView .ticket-row .next-breach.breached-text, html #ticketsView .ticket-row .sla-count.breached { color:var(--bad) !important; }

/* Admin Settings leftovers */
.custom-state-color i { background:var(--state-open); }
.automation-scope.tickets, [data-theme="dark"] .automation-scope.tickets { background:var(--spruce-pale); color:var(--spruce); }
[data-theme="dark"] .settings-icon.ink-rule { background:var(--surface-2); color:var(--ink-2); }
[data-theme="dark"] .role-list-item em { background:var(--surface-2); color:var(--ink-2); }
[data-theme="dark"] .unitLabel { background:var(--surface-2); color:var(--ink-2); border-color:var(--line); }

/* ---------- @mention picker and tags ---------- */
.mention-suggestions { position:fixed; z-index:60; width:300px; max-width:calc(100vw - 24px); padding:6px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); font-family:var(--font-ui); color:var(--ink); }
.mention-suggestions[hidden] { display:none; }
.mention-head { padding:6px 8px 6px; color:var(--muted); font-size:11.5px; font-weight:600; }
.mention-suggestions [role="option"] { display:flex; align-items:center; gap:10px; width:100%; padding:7px 8px; border-radius:8px; background:transparent; text-align:left; color:var(--ink); cursor:pointer; }
.mention-suggestions [role="option"][aria-selected="true"] { background:var(--hover-bg); }
.mention-avatar { display:grid; place-items:center; flex:0 0 auto; width:28px; height:28px; border-radius:50%; background:var(--spruce-pale); color:var(--spruce); font-size:11px; font-weight:600; }
.mention-text { flex:1; min-width:0; }
.mention-text b { display:block; overflow:hidden; font-size:13px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.mention-text small { display:block; overflow:hidden; margin-top:1px; color:var(--muted); font-size:11.5px; text-overflow:ellipsis; white-space:nowrap; }
.mention-empty { margin:0; padding:10px 8px 12px; color:var(--muted); font-size:12.5px; }
.mention-foot { display:flex; flex-wrap:wrap; gap:10px; margin-top:4px; padding:7px 8px 3px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; }
.mention-foot kbd { display:inline-block; min-width:16px; margin-right:2px; padding:0 4px; border:1px solid var(--line-strong); border-bottom-width:2px; border-radius:4px; background:var(--surface-2); color:var(--ink-2); font:500 10.5px/1.5 var(--font-ui); text-align:center; }
.mention-tag { display:inline-block; padding:0 5px; border-radius:5px; background:var(--spruce-pale); color:var(--spruce); font-weight:600; white-space:nowrap; }

/* ---------- Comment composer ---------- */
.composer-card, [data-theme="dark"] .composer-card { border:1px solid var(--control-border) !important; border-radius:12px; background:var(--surface) !important; transition:border-color .15s, box-shadow .15s; }
.composer-card:focus-within { border-color:var(--spruce) !important; box-shadow:0 0 0 3px var(--control-focus); }
.comment-composer .editor-toolbar, [data-theme="dark"] .comment-composer .editor-toolbar { border-color:var(--line) !important; background:var(--surface-2) !important; }
.comment-composer .editor-toolbar button, [data-theme="dark"] .comment-composer .editor-toolbar button { border-radius:6px; color:var(--ink-2) !important; }
.comment-composer .editor-toolbar button:hover, [data-theme="dark"] .comment-composer .editor-toolbar button:hover { background:var(--hover-bg) !important; color:var(--ink) !important; }
.comment-composer .composer-footer, [data-theme="dark"] .comment-composer .composer-footer { border-color:var(--line) !important; background:var(--surface) !important; }
.comment-composer .comment-visibility, [data-theme="dark"] .comment-composer .comment-visibility { padding:3px; gap:2px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2) !important; }
.comment-composer .visibility-toggle, [data-theme="dark"] .comment-composer .visibility-toggle { padding:6px 11px; border-radius:7px; background:transparent !important; box-shadow:none !important; color:var(--ink-2) !important; font-size:12.5px; font-weight:500; }
.comment-composer .visibility-toggle:hover { color:var(--ink) !important; }
.comment-composer .visibility-toggle.active, [data-theme="dark"] .comment-composer .visibility-toggle.active { background:var(--surface) !important; box-shadow:0 1px 2px rgba(20,23,21,.1), 0 0 0 1px var(--line) !important; color:var(--ink) !important; font-weight:600; }
.comment-composer .visibility-toggle span { color:var(--muted) !important; }
.comment-composer .attach-button { padding:8px 12px; border-radius:9px; font-size:12.5px; font-weight:500; }
.comment-composer .post-button { border-radius:9px; }
.comment-composer .vis-icon { width:14px; height:14px; margin-right:6px; vertical-align:-2px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.comment-composer .attach-button { display:inline-flex; align-items:center; }
.mention-foot { flex-wrap:nowrap; white-space:nowrap; }
.posted-copy, [data-theme="dark"] .posted-copy { color:var(--ink-2); }

/* ---------- Workspace separation ---------- */
#settingsLayout [hidden], #workspaceView [hidden] { display:none !important; }
body.facilities-mode #workspaceView .workspace-queue-panel:not(.facility-workspace-panel) { display:none; }
body:not(.facilities-mode) #facilityWorkspacePanel { display:none; }
.settings-scope-note { margin:6px 0 0; color:var(--muted); font-size:13px; }
.facilities-settings-panel .catalog-heading h2 { margin:0 0 4px; font:600 20px/1.3 var(--font-ui); }
.facilities-settings-panel .catalog-heading p { margin:0 0 18px; color:var(--muted); font-size:13px; }
.fac-settings-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px; align-items:start; }
.fac-settings-card { padding:20px; }
.fac-settings-card h3 { margin:0 0 4px; font:600 15px var(--font-ui); color:var(--ink); }
.fac-settings-card > p { margin:0 0 14px; color:var(--muted); font-size:12.5px; }
.fac-list { margin:0; padding:0; list-style:none; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.fac-list li { display:grid; grid-template-columns:minmax(0, 1fr) auto auto; align-items:center; gap:10px; padding:6px 8px 6px 6px; border-bottom:1px solid var(--line); background:var(--surface); }
.fac-list li:last-child { border-bottom:0; }
.fac-list input { width:100%; min-width:0; padding:7px 9px; border:1px solid transparent; border-radius:7px; background:transparent; color:var(--ink); font:500 13px var(--font-ui); outline:none; }
.fac-list input:hover { border-color:var(--line); }
.fac-list input:focus { border-color:var(--spruce); background:var(--surface); box-shadow:0 0 0 3px var(--control-focus); }
.fac-list small { color:var(--muted); font-size:11.5px; white-space:nowrap; }
.fac-list-tools { display:inline-flex; gap:2px; }
.fac-list-tools button { width:26px; height:26px; border-radius:6px; background:transparent; color:var(--muted); font-size:13px; }
.fac-list-tools button:hover:not(:disabled) { background:var(--hover-bg); color:var(--ink); }
.fac-list-tools button:disabled { opacity:.35; cursor:default; }
.fac-list-tools button[data-fac-remove]:hover { background:var(--bad-soft); color:var(--bad); }
.fac-list li.fac-list-locked { grid-template-columns:minmax(0, 1fr) auto; padding:10px 14px 10px 15px; background:var(--surface-2); }
.fac-list-locked .fac-list-name { color:var(--ink-2); font-size:13px; font-weight:500; }
.fac-list-locked em { color:var(--muted); font-size:11.5px; font-style:normal; }
.fac-list-empty { padding:12px; color:var(--muted); font-size:12.5px; }
.fac-list-add { display:flex; gap:8px; margin-top:10px; }
.fac-list-add input { flex:1; min-width:0; padding:8px 11px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); font:400 13px var(--font-ui); outline:none; }
.fac-list-add input:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
.fac-settings-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:18px; }
.fac-settings-actions .nt-error { margin:0 auto 0 0; }
@media (max-width: 900px) { .fac-settings-grid { grid-template-columns:1fr; } }
.fac-list li { grid-template-columns:minmax(0, 1fr) 150px auto; }
.fac-list small { text-align:right; overflow:hidden; text-overflow:ellipsis; }
html .facilities-table .ticket-state-chip[class] { display:inline-flex; align-items:center; gap:7px; min-height:0; padding:0; border:0 !important; background:transparent !important; box-shadow:none; color:var(--ink-2); font-size:12.5px !important; font-weight:500; white-space:nowrap; }
.facilities-table .ticket-state-chip > i { flex:0 0 7px; width:7px; height:7px; border-radius:50%; background:var(--state-open); }
.facilities-table .ticket-state-chip:is(.state-waiting-on-vendor, .state-scheduled) > i { background:var(--state-pending); }
.facilities-table .ticket-state-chip:is(.state-resolved, .state-closed) > i { background:var(--state-done); }
.facilities-table .ticket-state-chip > span { color:var(--ink-2); }

/* ---------- Reports (reports.js) ---------- */
/* Categorical series: the validated reference palette, stepped separately for each theme (checked against the
   app's card surfaces). One series uses the brand green. */
#reportsView { --rp-single:var(--spruce); --rp-s1:#2a78d6; --rp-s2:#eb6834; --rp-s3:#1baf7a; --rp-s4:#eda100; --rp-s5:#e87ba4; --rp-s6:#008300; }
[data-theme="dark"] #reportsView { --rp-single:var(--spruce); --rp-s1:#3987e5; --rp-s2:#d95926; --rp-s3:#199e70; --rp-s4:#c98500; --rp-s5:#d55181; --rp-s6:#008300; }
#reportsView .rp-sub { display:block !important; margin:6px 0 0; color:var(--muted); font-size:13px; }
#reportsView [hidden] { display:none !important; }
.rp-tabs { display:flex; gap:2px; margin:4px 0 14px; border-bottom:1px solid var(--line); }
.rp-tabs button { position:relative; padding:8px 12px 11px; background:none; color:var(--muted); font-size:13.5px; font-weight:500; }
.rp-tabs button:hover { color:var(--ink); }
.rp-tabs button[aria-selected="true"] { color:var(--ink); font-weight:600; }
.rp-tabs button[aria-selected="true"]:after { content:""; position:absolute; left:8px; right:8px; bottom:-1px; height:2px; border-radius:2px 2px 0 0; background:var(--spruce); }
.rp-count { margin-left:4px; padding:1px 7px; border-radius:999px; background:var(--surface-2); color:var(--ink-2); font-size:11.5px; }
.rp-count:empty { display:none; }
.rp-search { width:min(360px, 100%); margin-bottom:14px; padding:9px 12px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); font:400 13.5px var(--font-ui); outline:none; }
.rp-search:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
.rp-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(270px, 1fr)); gap:14px; }
.rp-tile { display:flex; flex-direction:column; gap:6px; min-height:176px; padding:16px 18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); text-align:left; color:var(--ink); transition:border-color .15s, box-shadow .15s, transform .15s; }
.rp-tile:hover { border-color:var(--line-strong); box-shadow:var(--shadow-pop); transform:translateY(-1px); }
.rp-tile-top { display:flex; align-items:center; gap:8px; margin-bottom:4px; }
.rp-tile-icon { display:grid; place-items:center; width:28px; height:28px; border-radius:8px; background:var(--spruce-pale); color:var(--spruce); }
.rp-tile-icon svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.rp-tile-topic { color:var(--muted); font-size:12px; font-weight:500; }
.rp-tile b { font-size:14.5px; font-weight:600; line-height:1.3; }
.rp-tile-desc { color:var(--muted); font-size:12.5px; line-height:1.45; }
.rp-tile-foot { display:flex; justify-content:space-between; gap:10px; margin-top:auto; padding-top:10px; border-top:1px solid var(--line); color:var(--muted); font-size:11.5px; }
.rp-tile-headline { overflow:hidden; color:var(--ink-2); font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.rp-empty { padding:28px 10px; color:var(--muted); font-size:13px; text-align:center; }
.rp-editor-head .back-to-tickets { margin-bottom:12px; }
.rp-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; }
.rp-title-block { flex:1; min-width:0; }
.rp-name, .rp-description { display:block; width:100%; margin:0; padding:2px 6px; border:1px solid transparent; border-radius:8px; background:transparent; color:var(--ink); outline:none; margin-left:-6px; }
.rp-name { font:600 24px/1.25 var(--font-ui); letter-spacing:-.015em; }
.rp-description { margin-top:2px; color:var(--ink-2); font:400 13.5px var(--font-ui); }
.rp-name:not([readonly]):hover, .rp-description:not([readonly]):hover { border-color:var(--line); }
.rp-name:not([readonly]):focus, .rp-description:not([readonly]):focus { border-color:var(--spruce); background:var(--surface); box-shadow:0 0 0 3px var(--control-focus); }
.rp-meta { margin:6px 0 0; color:var(--muted); font-size:12.5px; }
.rp-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.rp-actions .create-button, .rp-actions .outline-button { white-space:nowrap; }
.rp-danger:hover { border-color:var(--bad) !important; color:var(--bad) !important; }
.rp-body { display:grid; grid-template-columns:300px minmax(0, 1fr); gap:16px; align-items:start; }
.rp-builder { position:sticky; top:76px; max-height:calc(100vh - 96px); overflow-y:auto; padding:6px 16px 16px; }
.rp-builder section { padding:12px 0; border-bottom:1px solid var(--line); }
.rp-builder section:last-child { border-bottom:0; }
.rp-builder h3 { margin:0 0 8px; color:var(--ink); font:600 12.5px var(--font-ui); }
.rp-builder label { display:block; margin-bottom:9px; color:var(--ink-2); font-size:12px; font-weight:500; }
.rp-builder label > select, .rp-builder label > input, .rp-builder label > .custom-select-wrapper { margin-top:4px; }
.rp-builder input[type="date"], .rp-builder input[type="number"], .rp-builder input[type="text"] { width:100%; padding:7px 9px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--ink); font:400 13px var(--font-ui); outline:none; }
.rp-builder input:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
.rp-builder .custom-select-trigger { min-height:0; padding:7px 10px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--ink); font-size:13px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rp-builder .custom-select-trigger:disabled, .rp-builder select:disabled + .custom-select-trigger { opacity:.7; }
.rp-two { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.rp-check { display:flex !important; align-items:flex-start; gap:7px; font-weight:400 !important; }
.rp-hint { margin:0 0 8px; color:var(--muted); font-size:12px; line-height:1.45; }
.rp-readonly-note { margin:10px 0 2px; padding:9px 11px; border-radius:9px; background:var(--surface-2); color:var(--ink-2); font-size:12.5px; line-height:1.45; }
.rp-filter { display:grid; grid-template-columns:1fr; gap:5px; margin-bottom:9px; padding:9px; border:1px solid var(--line); border-radius:9px; background:var(--surface-2); position:relative; }
.rp-filter .rp-icon-button { position:absolute; top:4px; right:4px; }
.rp-filter > .custom-select-wrapper:first-child { padding-right:26px; }
.rp-icon-button { width:24px; height:24px; border-radius:6px; background:transparent; color:var(--muted); font-size:15px; }
.rp-icon-button:hover { background:var(--bad-soft); color:var(--bad); }
.rp-canvas { display:grid; gap:16px; min-width:0; }
.rp-card { padding:18px 20px; }
.rp-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; }
.rp-card-head h2 { margin:0; color:var(--ink); font:600 15px var(--font-ui); }
.rp-card-head p { margin:3px 0 0; color:var(--muted); font-size:12.5px; }
.rp-chart-switch { display:inline-flex; flex:0 0 auto; padding:3px; gap:2px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.rp-chart-switch button { padding:5px 11px; border-radius:7px; background:transparent; color:var(--ink-2); font-size:12.5px; font-weight:500; }
.rp-chart-switch button[aria-checked="true"] { background:var(--surface); box-shadow:0 1px 2px rgba(20,23,21,.1), 0 0 0 1px var(--line); color:var(--ink); font-weight:600; }
.rp-chart.rp-chart-hidden { display:none; }
.rp-bars { display:grid; gap:2px; }
.rp-bar-row { display:grid; grid-template-columns:minmax(90px, 30%) minmax(0, 1fr); align-items:center; gap:12px; padding:3px 6px; border-radius:8px; cursor:pointer; }
.rp-bar-row:hover, .rp-bar-row:focus-visible { background:var(--hover-bg); outline:none; }
.rp-bar-label { overflow:hidden; color:var(--ink-2); font-size:12.5px; text-align:right; text-overflow:ellipsis; white-space:nowrap; }
.rp-bar-values { display:grid; gap:3px; }
.rp-bar-track { display:flex; align-items:center; gap:2px; height:18px; }
.rp-bar-track.rp-thin { height:10px; }
.rp-seg { display:block; height:100%; min-width:2px; }
.rp-bar-track .rp-seg:first-child { border-top-left-radius:2px; border-bottom-left-radius:2px; }
.rp-bar-track .rp-seg:last-of-type { border-top-right-radius:4px; border-bottom-right-radius:4px; }
.rp-bar-track em { flex:0 0 auto; margin-left:6px; color:var(--ink-2); font-size:12px; font-style:normal; font-weight:600; font-variant-numeric:tabular-nums; }
.rp-svg { display:block; width:100%; height:auto; overflow:visible; }
.rp-grid { stroke:var(--line); stroke-width:1; }
.rp-axis { fill:var(--muted); font:11px var(--font-ui); }
.rp-line { fill:none; stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.rp-dot { stroke:var(--surface); stroke-width:2; }
.rp-col { cursor:pointer; }
.rp-col:hover { opacity:.85; }
.rp-hit { fill:transparent; cursor:pointer; }
.rp-hit:hover { fill:var(--hover-bg); opacity:.5; }
.rp-big-number { display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:18px 4px 8px; }
.rp-big-number b { color:var(--ink); font:600 44px/1 var(--font-ui); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.rp-big-number span { color:var(--muted); font-size:13px; }
.rp-legend { display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:12px; color:var(--ink-2); font-size:12.5px; }
.rp-legend:empty { display:none; }
.rp-legend span { display:inline-flex; align-items:center; gap:6px; }
.rp-legend i { width:10px; height:10px; border-radius:3px; }
.rp-table { width:100%; border-collapse:collapse; font-size:13px; }
.rp-table th { padding:8px 10px; border-bottom:1px solid var(--line); background:var(--surface-2); color:var(--muted); font-size:11.5px; font-weight:600; text-align:left; white-space:nowrap; }
.rp-table td { padding:9px 10px; border-bottom:1px solid var(--line); color:var(--ink); }
.rp-table tbody tr { cursor:pointer; }
.rp-table tbody tr:hover, .rp-table tbody tr:focus-visible { background:var(--hover-bg); outline:none; }
.rp-table .rp-num { text-align:right; font-variant-numeric:tabular-nums; }
.rp-table .rp-muted { color:var(--muted); }
.rp-rows td { max-width:320px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rp-drill-actions { display:flex; align-items:center; gap:12px; }
.rp-tooltip { position:fixed; z-index:70; max-width:260px; padding:7px 10px; border:1px solid var(--line); border-radius:9px; background:var(--surface); box-shadow:var(--shadow-pop); color:var(--ink); font:500 12px/1.45 var(--font-ui); pointer-events:none; }
@media (max-width: 1100px) { .rp-body { grid-template-columns:1fr; } .rp-builder { position:static; max-height:none; } }
@media (max-width: 640px) {
  .rp-title-row { flex-direction:column; }
  .rp-actions { justify-content:flex-start; }
  .rp-card-head { flex-direction:column; }
  .rp-bar-row { grid-template-columns:minmax(70px, 34%) minmax(0, 1fr); }
  .rp-name { font-size:20px; }
}
#reportsView input.rp-name, #reportsView input.rp-description { box-sizing:border-box; width:calc(100% + 6px); min-height:0; border:1px solid transparent !important; background:transparent !important; box-shadow:none !important; }
#reportsView input.rp-name { padding:2px 6px; font:600 24px/1.25 var(--font-ui); }
#reportsView input.rp-description { padding:2px 6px; font:400 13.5px/1.4 var(--font-ui); color:var(--ink-2); }
#reportsView input.rp-name:not([readonly]):hover, #reportsView input.rp-description:not([readonly]):hover { border-color:var(--line) !important; }
#reportsView input.rp-name:not([readonly]):focus, #reportsView input.rp-description:not([readonly]):focus { border-color:var(--spruce) !important; background:var(--surface) !important; box-shadow:0 0 0 3px var(--control-focus) !important; }
#reportsView input[readonly] { cursor:default; }
.rp-builder .custom-select-wrapper, .rp-builder .custom-select-trigger { box-sizing:border-box; width:100%; max-width:100%; min-width:0; }
.rp-filter { grid-template-columns:minmax(0, 1fr) auto; align-items:center; }
.rp-filter > .custom-select-wrapper, .rp-filter > input { grid-column:1; }
.rp-filter > .custom-select-wrapper:first-child { padding-right:0; }
.rp-filter .rp-icon-button { position:static; grid-column:2; grid-row:1; }
@media (max-width: 1100px) { .rp-builder { order:2; } }

/* Report library sections */
.rp-grid { display:block; }
.rp-grid-inner { display:grid; grid-template-columns:repeat(auto-fill, minmax(270px, 1fr)); gap:14px; }
.rp-section + .rp-section { margin-top:26px; }
.rp-section h2 { display:flex; align-items:center; gap:8px; margin:0 0 12px; color:var(--ink); font:600 15px var(--font-ui); }
.rp-section h2 span { padding:1px 8px; border-radius:999px; background:var(--surface-2); color:var(--ink-2); font-size:11.5px; font-weight:500; }

/* ---------- Workflow (workflow.js) ---------- */
.ticket-select-cell { display:flex; align-items:center; justify-content:center; }
.ticket-select-cell input { width:16px; height:16px; margin:0; accent-color:var(--spruce); cursor:pointer; }
#ticketsView .ticket-row.is-selected { background:var(--spruce-pale) !important; }
.selection-bar { position:sticky; top:72px; z-index:5; display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 12px; padding:10px 14px; border:1px solid var(--spruce); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }
.selection-bar[hidden] { display:none; }
.selection-bar b { margin-right:6px; color:var(--ink); font-size:13.5px; }
.selection-bar .outline-button { padding:7px 12px; font-size:12.5px; }
.selection-bar .nt-link { margin-left:auto; }
.wf-modal { width:min(520px, 100%); }
.wf-modal h3 { margin:14px 0 6px; font:600 13px var(--font-ui); color:var(--ink); }
.wf-modal h3 small { color:var(--muted); font-weight:400; }
.wf-hint { margin:6px 0 0; color:var(--muted); font-size:12.5px; line-height:1.45; }
.wf-check { display:flex !important; align-items:center; gap:8px; font-weight:500 !important; }
.wf-check input { width:auto !important; margin:0 !important; }
.wf-modal textarea { min-height:80px; }
.rule-editor { width:min(640px, 100%); }
.rule-row-edit { display:grid; grid-template-columns:1.1fr .8fr 1.2fr 26px; gap:6px; align-items:center; margin-bottom:6px; }
.rule-row-edit input, .rule-row-edit select { margin:0 !important; }
.rule-where { display:block; margin-top:2px; color:var(--muted); font-size:11.5px; font-weight:400; }
.automation-table td { vertical-align:top; font-size:13px; }
.automation-table td b { font-weight:600; }

/* Composer: owner note, files, templates and knowledge */
.composer-owner-note { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 8px 52px; padding:8px 12px; border-radius:9px; background:var(--surface-2); color:var(--ink-2); font-size:12.5px; }
.composer-owner-note[hidden] { display:none; }
.composer-files { display:flex; flex-wrap:wrap; gap:6px; padding:8px 12px; border-top:1px solid var(--line); }
.composer-files[hidden] { display:none; }
.file-chip { display:inline-flex; align-items:center; gap:6px; max-width:100%; padding:5px 9px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font-size:12.5px; text-decoration:none; }
.file-chip small { color:var(--muted); }
.file-chip img { width:40px; height:40px; border-radius:5px; object-fit:cover; }
.file-chip.uploading { opacity:.6; }
.file-chip button { background:none; color:var(--muted); font-size:14px; }
a.file-chip:hover { border-color:var(--control-hover); }
.comment-files { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.composer-inserts { display:flex; gap:6px; }
.composer-inserts .outline-button { padding:6px 10px; font-size:12.5px; border-radius:9px; }
.composer-picker { position:fixed; z-index:65; width:360px; max-height:370px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); font-family:var(--font-ui); }
.composer-picker[hidden] { display:none; }
.picker-head { padding:10px 10px 6px; border-bottom:1px solid var(--line); }
.picker-head b { display:block; margin:0 2px 6px; font-size:12.5px; color:var(--muted); font-weight:600; }
.picker-head input { width:100%; padding:7px 10px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--ink); font:400 13px var(--font-ui); outline:none; }
.picker-list { overflow-y:auto; padding:6px; }
.picker-list button { display:block; width:100%; padding:8px 9px; border-radius:8px; background:transparent; text-align:left; color:var(--ink); }
.picker-list button:hover:not(:disabled) { background:var(--hover-bg); }
.picker-list button:disabled { opacity:.5; cursor:not-allowed; }
.picker-list b { display:block; font-size:13px; font-weight:600; }
.picker-list small { display:block; margin-top:2px; overflow:hidden; color:var(--muted); font-size:11.5px; text-overflow:ellipsis; white-space:nowrap; }
.picker-empty { padding:12px; color:var(--muted); font-size:12.5px; }
.picker-manage { padding:8px 14px 10px; text-align:left; border-top:1px solid var(--line); }
.article-reader { width:min(720px, 100%); max-height:86vh; overflow-y:auto; }
.article-reader-summary { color:var(--ink-2); font-size:14px; }
.article-reader-body { color:var(--ink); font-size:14px; line-height:1.6; }
.article-reader-body ol, .article-reader-body ul { padding-left:22px; }
#knowledgeArticleGrid .article-card { cursor:pointer; }

/* Ticket detail: escalation, problem link, activity */
.escalation-banner { display:flex; align-items:flex-start; gap:12px; margin-bottom:16px; padding:12px 14px; border:1px solid color-mix(in srgb, var(--bad) 40%, var(--line)); border-radius:12px; background:var(--bad-soft); color:var(--ink); font-size:13px; }
.escalation-banner[hidden] { display:none; }
.escalation-banner p { margin:3px 0 0; color:var(--ink-2); }
.escalation-banner .outline-button { margin-left:auto; white-space:nowrap; }
.escalation-icon { display:grid; place-items:center; flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--bad); color:var(--surface); font-weight:700; }
.problem-link-card { margin-bottom:16px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2); }
.problem-link-card p { margin:4px 0 8px; font-size:13px; color:var(--ink-2); }
.problem-link-card small { color:var(--muted); }
.problem-link-row { display:flex; gap:8px; align-items:center; }
.problem-link-row > .custom-select-wrapper, .problem-link-row > input { flex:1; min-width:0; }
.problem-incidents { margin:14px 0; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.problem-incidents-head { display:flex; justify-content:space-between; margin-bottom:8px; font-size:13px; }
.problem-incidents-head span { color:var(--muted); }
.problem-incidents ul { margin:0 0 10px; padding:0; list-style:none; max-height:180px; overflow-y:auto; }
.problem-incidents li { display:flex; align-items:center; gap:6px; padding:5px 0; border-bottom:1px solid var(--line); font-size:12.5px; }
.problem-incidents li small { margin-left:auto; color:var(--muted); white-space:nowrap; }
.problem-incident-count { display:block; margin-top:2px; color:var(--muted); font-size:11.5px; font-weight:500; }

/* Notification bell */
.bell-wrap { position:relative; }
.bell-button { position:relative; display:grid; place-items:center; width:38px; height:38px; margin-right:8px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink-2); }
.bell-button:hover { background:var(--hover-bg); color:var(--ink); }
.bell-button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.bell-badge { position:absolute; top:-5px; right:-5px; min-width:18px; height:18px; padding:0 5px; border:2px solid var(--surface); border-radius:999px; background:var(--bad); color:#fff; font:700 10px/14px var(--font-ui); }
.bell-badge[hidden] { display:none; }
.bell-panel { position:absolute; right:8px; top:46px; z-index:60; width:380px; max-width:calc(100vw - 24px); border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }
.bell-panel[hidden] { display:none; }
.bell-head { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid var(--line); font-size:13.5px; }
.bell-list { max-height:420px; overflow-y:auto; padding:6px; }
.bell-item { display:flex; gap:10px; width:100%; padding:9px 8px; border-radius:9px; background:transparent; text-align:left; color:var(--ink-2); }
.bell-item:hover { background:var(--hover-bg); }
.bell-item.unread { color:var(--ink); }
.bell-item.unread .bell-text { font-weight:600; }
.bell-icon { display:grid; place-items:center; flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--surface-2); color:var(--ink-2); font-size:12px; font-weight:700; }
.bell-item.kind-breach .bell-icon { background:var(--bad-soft); color:var(--bad); }
.bell-item.kind-warning .bell-icon { background:#f7ebd3; color:#9a6210; }
[data-theme="dark"] .bell-item.kind-warning .bell-icon { background:#372b16; color:#e2ab4f; }
.bell-item.kind-assigned .bell-icon, .bell-item.kind-escalated .bell-icon { background:var(--spruce-pale); color:var(--spruce); }
.bell-text { display:block; font-size:13px; line-height:1.4; }
.bell-item small { display:block; margin-top:2px; color:var(--muted); font-size:11.5px; }
.bell-empty { padding:24px; color:var(--muted); font-size:13px; text-align:center; }

/* Reply templates */
.template-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:14px; }
.template-card { display:flex; flex-direction:column; justify-content:space-between; padding:16px 18px; }
.template-card h3 { margin:4px 0 8px; font:600 14.5px var(--font-ui); }
.template-card pre { margin:0; color:var(--ink-2); font:400 12.5px/1.5 var(--font-ui); white-space:pre-wrap; }
.template-actions { display:flex; gap:12px; margin-top:12px; }

/* Team performance */
.scorecard td.better { color:var(--good); font-weight:600; }
.scorecard td.worse { color:var(--bad); font-weight:600; }
.scorecard tr.team-row td { background:var(--surface-2); color:var(--ink-2); font-weight:600; }
.scorecard tbody tr[data-perf-agent] { cursor:pointer; }
.score-bar { display:inline-block; width:60px; height:8px; margin-right:8px; border-radius:4px; background:var(--surface-2); vertical-align:middle; overflow:hidden; }
.score-bar i { display:block; height:100%; border-radius:4px; background:var(--spruce); }
#performanceView .nt-seg { align-self:center; }

/* Team performance: manager view */
#performanceView { --rp-single:var(--spruce); --rp-s1:#2a78d6; --rp-s2:#eb6834; --rp-s3:#1baf7a; --rp-s4:#eda100; --rp-s5:#e87ba4; --rp-s6:#008300; }
[data-theme="dark"] #performanceView { --rp-single:var(--spruce); --rp-s1:#3987e5; --rp-s2:#d95926; --rp-s3:#199e70; --rp-s4:#c98500; --rp-s5:#d55181; --rp-s6:#008300; }
#performanceView .rp-sub { display:block; margin:6px 0 0; color:var(--muted); font-size:13px; }
#performanceView .rp-card { margin-bottom:14px; }
.perf-controls { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:10px; }
.perf-group { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:12.5px; font-weight:600; }
.perf-group select { min-height:34px; padding:0 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-weight:500; }
.perf-kpis { display:grid; grid-template-columns:repeat(auto-fit, minmax(128px, 1fr)); gap:10px; margin-bottom:18px; }
.perf-kpi { display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:13px 15px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:var(--shadow); color:var(--ink); text-align:left; }
.perf-kpi:hover, .perf-kpi:focus-visible { border-color:var(--spruce); outline:none; }
.perf-kpi span { color:var(--ink-2); font-size:12px; font-weight:500; }
.perf-kpi b { font:600 24px/1.15 var(--font-ui); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.perf-kpi small { color:var(--muted); font-size:11.5px; }
.perf-kpi.bad b { color:var(--bad); }
.perf-kpis-small .perf-kpi b { font-size:20px; }
.perf-charts { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.perf-charts .rp-card { margin-bottom:0; }
.perf-risk-filters { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.perf-risk-filters button { padding:6px 11px; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--ink-2); font-size:12.5px; }
.perf-risk-filters button b { margin-left:4px; color:var(--muted); font-weight:600; }
.perf-risk-filters button[aria-checked="true"] { border-color:var(--spruce); background:var(--spruce-pale); color:var(--spruce-dark); font-weight:600; }
.perf-tag { display:inline-block; margin:1px 0; padding:2px 7px; border-radius:999px; background:var(--surface-2); color:var(--ink-2); font-size:11px; font-weight:600; white-space:nowrap; }
.perf-tag-breached { background:var(--bad-soft); color:var(--bad); }
.perf-tag-due-soon { background:var(--saffron-pale); color:#8d6c22; }
.perf-tickets td.perf-title { max-width:260px; }
.perf-cell-link { padding:0; border-bottom:1px dotted currentColor; background:none; color:inherit; font:inherit; }
.perf-cell-link:hover, .perf-cell-link:focus-visible { color:var(--spruce); outline:none; }
.perf-empty { max-width:640px; padding:24px; }
.perf-empty h2 { margin:0 0 6px; font:600 16px var(--font-ui); }
.perf-empty p { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.vip-badge { display:inline-flex; align-items:center; margin-left:4px; padding:2px 6px; border-radius:999px; background:var(--saffron-pale); color:#8d6c22; font-size:10px; font-weight:800; letter-spacing:.03em; vertical-align:middle; }
.vip-check { margin-top:14px !important; }
.vip-check input { width:16px !important; height:16px; margin:2px 0 0 !important; flex:0 0 auto; accent-color:var(--spruce); }
.vip-check small { display:block; margin-top:2px; color:var(--muted); font-weight:400; }
[data-theme="dark"] .vip-badge, [data-theme="dark"] .perf-tag-due-soon { background:#3c331d; color:#e8c164; }
@media (max-width:900px) { .perf-charts { grid-template-columns:1fr; } .perf-controls { justify-content:flex-start; } #performanceView .page-heading { flex-direction:column; align-items:flex-start; } }

/* Requester portal survey */
.portal-survey { margin:14px 0; padding:14px; border:1px solid var(--spruce); border-radius:12px; background:var(--spruce-pale); }
.portal-survey[hidden] { display:none; }
.portal-survey p { margin:4px 0 10px; color:var(--ink-2); font-size:13px; }
.survey-choices { display:flex; gap:8px; margin-bottom:8px; }
.portal-survey textarea { width:100%; padding:8px 10px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); font:400 13px var(--font-ui); }

/* Audit timeline */
.audit-loading { color:var(--muted); font-size:13px; }
.ov-sub-label { display:inline-block; min-width:38px; margin-right:4px; color:var(--muted); font-size:11.5px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
.settings-extra-panel .catalog-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; }
.settings-extra-panel .catalog-heading h2 { margin:0 0 4px; font:600 20px var(--font-ui); }
.settings-extra-panel .catalog-heading p { margin:0; color:var(--muted); font-size:13px; max-width:640px; }

/* Phones: the ticket list becomes cards */
@media (max-width: 700px) {
  #ticketsView .ticket-table-head { display:none !important; }
  #ticketsView .ticket-row { display:flex !important; flex-wrap:wrap; gap:4px 10px; width:auto !important; min-width:0 !important; padding:12px !important; }
  #ticketsView .ticket-row > * { width:auto !important; }
  #ticketsView .ticket-row > [data-column-key] { display:none; }
  #ticketsView .ticket-panel { overflow-x:hidden; }
  .bell-panel { position:fixed; right:12px; top:60px; }
}
/* Workflow dialogs open from the ticket screen, so they sit above it. */
.modal-backdrop:has(> .wf-modal) { z-index:50; }
.bell-panel { overflow:hidden; }
.bell-item > span:last-child { flex:1; min-width:0; }
.bell-text { white-space:normal; overflow-wrap:anywhere; }
.scorecard td:nth-child(2) { white-space:nowrap; }
.wf-modal [hidden], .wf-modal label[hidden], .wf-modal section[hidden] { display:none !important; }

/* Report sharing and pinned reports */
.share-options { display:grid; gap:8px; margin:12px 0; }
.share-options label { display:flex !important; align-items:flex-start; gap:10px; margin:0 !important; padding:10px 12px; border:1px solid var(--line); border-radius:10px; cursor:pointer; }
.share-options label:has(input:checked) { border-color:var(--spruce); background:var(--spruce-pale); }
.share-options input { width:auto !important; margin:3px 0 0 !important; accent-color:var(--spruce); }
.share-options b { display:block; color:var(--ink); font-size:13.5px; }
.share-options small { display:block; margin-top:2px; color:var(--muted); font-size:12px; font-weight:400; }
.share-people { padding:10px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.share-people[hidden] { display:none; }
.share-chips { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.share-chip { display:inline-flex; align-items:center; gap:4px; padding:3px 4px 3px 10px; border-radius:999px; background:var(--spruce-pale); color:var(--spruce); font-size:12.5px; font-weight:600; }
.share-chip button { width:20px; height:20px; border-radius:50%; background:transparent; color:var(--spruce); }
.share-list { max-height:220px; overflow-y:auto; margin-top:6px; }
.share-list button { display:flex; align-items:center; gap:10px; width:100%; padding:7px 8px; border-radius:8px; background:transparent; text-align:left; color:var(--ink); }
.share-list button:hover { background:var(--hover-bg); }
.share-list b { display:block; font-size:13px; }
.share-list small { display:block; color:var(--muted); font-size:11.5px; }
.share-avatar { display:grid; place-items:center; flex:0 0 auto; width:28px; height:28px; border-radius:50%; background:var(--surface); color:var(--spruce); font-size:11px; font-weight:600; }
.share-agent-tools { display:flex; align-items:center; gap:10px; }
.share-agent-tools input { flex:1; min-width:0; }
.share-agent-tools .nt-link { flex:0 0 auto; white-space:nowrap; }
.share-agent-list { max-height:260px; }
.share-agent { display:flex !important; align-items:center; gap:10px; margin:0 !important; padding:7px 8px; border-radius:8px; cursor:pointer; color:var(--ink); }
.share-agent:hover { background:var(--hover-bg); }
.share-agent input { width:auto !important; margin:0 !important; accent-color:var(--spruce); }
.pinned-reports-panel { margin-top:16px; padding:18px 20px; }
.pinned-reports-panel[hidden], body.facilities-mode .pinned-reports-panel { display:none; }
.pinned-reports-panel .panel-heading { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:12px; }
.pinned-reports-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px; }
.pinned-report { display:flex; flex-direction:column; gap:6px; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); text-align:left; color:var(--ink); }
.pinned-report:hover { border-color:var(--line-strong); box-shadow:var(--shadow-pop); }
.pinned-report > b { font-size:14px; font-weight:600; }
.pinned-measure { color:var(--muted); font-size:11.5px; }
.pinned-big { margin:4px 0 0; font:600 26px var(--font-ui); }
.pinned-row { display:grid; grid-template-columns:minmax(0, 1fr) 70px auto; align-items:center; gap:8px; font-size:12.5px; }
.pinned-row span:first-child { overflow:hidden; color:var(--ink-2); text-overflow:ellipsis; white-space:nowrap; }
.pinned-bar { height:6px; border-radius:3px; background:var(--surface-2); overflow:hidden; }
.pinned-bar i { display:block; height:100%; border-radius:3px; background:var(--rp-single, var(--spruce)); }
.pinned-row b { font-variant-numeric:tabular-nums; }
.modal-backdrop:has(> .share-modal) { z-index:50; }

/* ---------- Outage banner (core.js): any problem in Investigating ---------- */
.outage-banner { position:sticky; top:64px; z-index:19; display:flex; align-items:flex-start; gap:12px; padding:10px 32px; background:var(--bad); color:#fff; font-size:13px; box-shadow:0 2px 8px rgba(0,0,0,.12); }
.outage-banner[hidden], body.requester-portal-mode .outage-banner { display:none; }
.outage-banner-icon { display:grid; place-items:center; flex:0 0 auto; width:22px; height:22px; border-radius:50%; background:#fff; color:var(--bad); font-weight:800; font-size:13px; }
.outage-banner-body { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px; min-width:0; line-height:22px; }
.outage-banner-body ul { display:contents; list-style:none; margin:0; padding:0; }
.outage-banner-body li { display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:6px; min-width:0; }
.outage-banner-body li span { opacity:.85; font-size:12px; }
.outage-banner button { padding:0; background:none; color:#fff; font:inherit; font-weight:600; text-decoration:underline; text-underline-offset:2px; cursor:pointer; text-align:left; }
.outage-banner button:hover { text-decoration-thickness:2px; }
.outage-banner .outage-banner-close { margin-left:auto; flex:0 0 auto; width:24px; height:24px; border-radius:50%; font-size:18px; line-height:22px; font-weight:400; text-align:center; text-decoration:none; }
.outage-banner .outage-banner-close:hover { background:rgba(255,255,255,.18); }
.outage-banner button:focus-visible { outline:2px solid #fff; outline-offset:2px; border-radius:2px; }
[data-theme="dark"] .outage-banner { background:#9a3324; }
[data-theme="dark"] .outage-banner-icon { color:#9a3324; }
@media (max-width:640px) { .outage-banner { padding:10px 16px; } }

/* ---------- Problem details: last updated + updates thread (core.js) ---------- */
.problem-detail-updated { margin:-4px 0 14px; color:var(--muted); font-size:12.5px; }
.problem-updates { margin-top:22px; padding-top:16px; border-top:1px solid var(--line); }
.problem-updates[hidden] { display:none; }
.problem-updates h3 { margin:0 0 10px; font-size:14px; color:var(--ink); }
.problem-update-composer { display:flex; align-items:flex-end; gap:10px; margin-top:12px; }
.problem-update-composer textarea { flex:1; min-width:0; }
.problem-update-composer button { flex:0 0 auto; }
.problem-update-list { display:grid; gap:10px; max-height:280px; overflow-y:auto; }
.problem-update { padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.problem-update header { display:flex; align-items:center; gap:8px; font-size:12.5px; }
.problem-update header .avatar { width:24px; height:24px; font-size:10px; }
.problem-update header b { color:var(--ink); }
.problem-update time { margin-left:auto; color:var(--muted); font-size:11.5px; }
.problem-update p { margin:6px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; color:var(--ink); }
@media (max-width:640px) { .problem-update-composer { flex-direction:column; align-items:stretch; } }

/* =====================================================================================================
   Ticket workspace (ticket-workspace.js): conversation first, fields in a sidebar, actions in the header
   ===================================================================================================== */
.ticket-detail.tw { --tw-warn:#8d6c22; --tw-warn-soft:#fbf0d2; --tw-note:#fdf6e3; --tw-note-line:#e6cf8a; --tw-info:#3552a8; --tw-info-soft:#e7edfb; padding:20px 32px 64px; }
[data-theme="dark"] .ticket-detail.tw { --tw-warn:#e8c164; --tw-warn-soft:#3c331d; --tw-note:#2a2619; --tw-note-line:#5c4f2a; --tw-info:#a9bcf2; --tw-info-soft:#232b40; }
.ticket-detail.tw [hidden], .tw .tw-hidden { display:none !important; }
.tw kbd { display:inline-block; min-width:18px; padding:1px 5px; border:1px solid var(--line-strong); border-bottom-width:2px; border-radius:5px; background:var(--surface-2); color:var(--ink-2); font:600 11px/1.4 var(--font-ui); text-align:center; }

/* Header */
.tw .detail-header { max-width:1320px; margin:0 auto 22px; align-items:flex-start; flex-wrap:wrap; gap:16px 24px; }
.tw .detail-header > div:first-child { flex:1 1 420px; min-width:0; }
.tw-nav { position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin-bottom:14px; }
.tw-nav .back-to-tickets { margin:0 !important; }
.tw-pager { display:inline-flex; align-items:center; gap:6px; color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.tw-pager button { display:grid; place-items:center; width:26px; height:26px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink-2); font-size:16px; line-height:1; }
.tw-pager button:hover:not(:disabled) { border-color:var(--control-hover); color:var(--ink); }
.tw-pager button:disabled { opacity:.4; cursor:default; }
.tw-shortcuts-button { display:inline-flex; align-items:center; gap:6px; padding:3px 6px; border-radius:6px; background:none; color:var(--muted); font-size:12px; }
.tw-shortcuts-button:hover { background:var(--hover-bg); color:var(--ink); }
.tw-shortcuts { position:absolute; top:calc(100% + 8px); left:0; z-index:30; width:min(320px, calc(100vw - 32px)); padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }
.tw-shortcuts-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; color:var(--ink); font-size:13.5px; }
.tw-shortcuts dl { margin:0; }
.tw-shortcuts dl div { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:5px 0; border-top:1px solid var(--line); }
.tw-shortcuts dt { flex:0 0 auto; }
.tw-shortcuts dd { margin:0; color:var(--ink-2); font-size:12.5px; text-align:right; }
.tw #detailTitle { margin:6px 0 0 -6px; padding:2px 6px; border-radius:8px; cursor:text; overflow-wrap:anywhere; }
.tw #detailTitle:hover, .tw #detailTitle:focus-visible { background:var(--hover-bg); outline:none; }
.tw .tw-title-input { display:block; width:100%; margin:6px 0 0 -6px; padding:2px 6px; border:1px solid var(--spruce); border-radius:8px; outline:none; background:var(--surface); color:var(--ink); box-shadow:0 0 0 3px var(--control-focus); font:600 28px/1.2 var(--font-ui); letter-spacing:-.02em; }
.tw-meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:10px; }
.tw-sla, .tw-presence { display:inline-flex; align-items:center; gap:7px; padding:4px 11px; border-radius:999px; font-size:12px; font-weight:600; line-height:1.4; }
.tw-sla:before, .tw-presence:before { content:""; flex:0 0 auto; width:7px; height:7px; border-radius:50%; background:currentColor; }
.tw-sla.tw-tone-ok { background:var(--good-soft); color:var(--good); }
.tw-sla.tw-tone-warn { background:var(--tw-warn-soft); color:var(--tw-warn); }
.tw-sla.tw-tone-bad { background:var(--bad-soft); color:var(--bad); }
.tw-sla.tw-tone-done, .tw-sla.tw-tone-none { background:var(--surface-2); color:var(--muted); }
.tw-presence { background:var(--tw-info-soft); color:var(--tw-info); }
.tw-presence.is-replying { background:var(--tw-warn-soft); color:var(--tw-warn); }
.tw-presence.is-replying:before { animation:statusPulse 1s ease-in-out infinite; }
.tw .detail-actions { flex:0 1 auto; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:8px; }
.tw-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.tw-actions .outline-button, .tw-actions .create-button { padding:8px 12px; border-radius:8px; font-size:12.5px; }
.tw .detail-save-status { flex-basis:100%; justify-content:flex-end; }
.tw .detail-save-status:not(.saving):not([hidden]) { display:flex !important; padding:0; background:transparent; color:var(--muted); font-weight:500; }
.tw .detail-save-status:not(.saving):before { background:var(--good); }

/* Two columns: the work on the left, the facts about the ticket on the right */
.tw .detail-body { max-width:1320px; grid-template-columns:minmax(0, 1fr) 320px; gap:32px; }
.tw .detail-main { display:flex; flex-direction:column; gap:16px; min-width:0; }
.tw .detail-main > .escalation-banner { margin-bottom:0; }
.tw .comments-panel { max-width:none; margin:4px 0 0 !important; }
.tw .detail-sidebar { gap:14px; min-width:0; }
.tw .detail-side-card { padding:14px 16px 16px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.tw .detail-side-card h2 { margin:0 0 12px; color:var(--ink); font-size:13.5px; font-weight:600; letter-spacing:0; }
.tw .tw-requester > div, .tw .tw-props > div { display:block; padding:0; border-top:0; color:inherit; font-size:inherit; }
.tw .detail-grid.tw-single, .tw .tw-props > .detail-grid.tw-single { display:grid; grid-template-columns:minmax(0, 1fr); row-gap:14px; column-gap:0; }
.tw .detail-grid.tw-single .full-detail-field { grid-column:auto; }
.tw .tw-props .ticket-custom-fields { display:grid; grid-template-columns:minmax(0, 1fr) !important; gap:14px; margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.tw .tw-sla-row b { text-align:right; }

/* Requester card */
.tw-requester-head { display:flex; align-items:center; gap:10px; }
.tw-requester-head .avatar { flex:0 0 auto; width:34px; height:34px; font-size:12px; }
.tw-requester-head > div { flex:1; min-width:0; }
.tw-requester-head b { display:block; overflow:hidden; color:var(--ink); font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.tw-requester-head small { display:block; color:var(--muted); font-size:12px; }
.tw-requester-info dl { display:grid; gap:6px; margin:12px 0 10px; font-size:12.5px; }
.tw-requester-info dl div { display:grid; grid-template-columns:64px minmax(0, 1fr); gap:8px; }
.tw-requester-info dt { color:var(--muted); }
.tw-requester-info dd { margin:0; color:var(--ink); overflow-wrap:anywhere; }
.tw-requester-info a { color:var(--spruce); }
.tw-muted { margin:10px 0; color:var(--muted); font-size:12.5px; }
.tw-requester .detail-grid label > input { margin-top:0; }

/* Description */
.tw-description { padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.tw-section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; }
.tw-section-head h2 { margin:0; color:var(--ink); font-size:13.5px; font-weight:600; }
.tw-description-text { max-height:320px; margin:0 -6px; padding:4px 6px; overflow:auto; border-radius:8px; color:var(--ink); font-size:14px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; cursor:text; }
.tw-description-text:hover, .tw-description-text:focus-visible { background:var(--hover-bg); outline:none; }
.tw-description-text.is-empty { color:var(--muted); font-style:italic; }
.tw-description .detail-grid label > textarea { margin-top:0; }

/* Suggestions: a related problem, then articles and similar tickets */
.tw-problem-suggest { padding:12px 14px; border:1px solid color-mix(in srgb, var(--bad) 35%, var(--line)); border-radius:12px; background:var(--bad-soft); color:var(--ink); font-size:13px; }
.tw-problem-suggest.is-linked { display:flex; align-items:center; gap:10px; border-color:var(--line); background:var(--surface-2); }
.tw-problem-suggest.is-linked p { flex:1; min-width:0; margin:0; }
.tw-problem-suggest small { color:var(--muted); font-size:12px; }
.tw-problem-head { display:flex; align-items:center; gap:8px; margin-bottom:4px; }
.tw-problem-icon { color:var(--bad); font-weight:700; }
.tw-problem-row { display:flex; align-items:center; gap:10px; padding:8px 0 2px; border-top:1px solid color-mix(in srgb, var(--bad) 18%, transparent); }
.tw-problem-head + .tw-problem-row { border-top:0; }
.tw-problem-row > div { flex:1; min-width:0; }
.tw-problem-row small { display:block; margin-top:2px; }
.tw-problem-row .create-button { padding:7px 14px; border-radius:8px; font-size:12.5px; }
.tw .tw-problem-suggest .nt-inline-link, .tw .tw-help .nt-inline-link { color:var(--ink); font-size:13px; font-weight:600; text-align:left; white-space:normal; }
.tw .tw-problem-suggest .nt-inline-link:hover, .tw .tw-help .nt-inline-link:hover { color:var(--spruce); text-decoration:underline; }
.tw-dismiss { display:grid; place-items:center; flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:transparent; color:var(--muted); font-size:17px; line-height:1; }
.tw-dismiss:hover { background:var(--hover-bg); color:var(--ink); }
.tw-help { display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:12px 28px; padding:12px 16px; border:1px dashed var(--line-strong); border-radius:12px; }
.tw-help h3 { margin:0 0 4px; color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.tw-help-row { display:grid; grid-template-columns:minmax(0, 1fr) auto; column-gap:10px; align-items:center; padding:5px 0; }
.tw-help-row small { grid-column:1; color:var(--muted); font-size:11.5px; }
.tw-help-row .nt-link { grid-column:2; grid-row:1 / span 2; }
.tw-help-row .nt-link:disabled { opacity:.45; cursor:not-allowed; }

/* Tabs: counts, and no stray scrollbar */
.tw .detail-tabs { overflow-y:hidden; scrollbar-width:none; }
.tw .detail-tabs::-webkit-scrollbar { display:none; }
.tw-tab-count { display:inline-block; min-width:18px; margin-left:6px; padding:0 6px; border-radius:999px; background:var(--surface-2); color:var(--muted); font-size:11px; font-weight:600; line-height:18px; text-align:center; }
.tw .detail-tabs button.active .tw-tab-count { background:var(--spruce-pale); color:var(--spruce); }

/* Private notes look different from replies, in the box and in the thread */
.tw .comment-composer.is-private .composer-card { border-color:var(--tw-note-line) !important; background:var(--tw-note) !important; }
.tw .comment-composer.is-private .comment-editor { background:var(--tw-note); }
.tw .comment-composer.is-private .editor-toolbar, .tw .comment-composer.is-private .composer-footer { background:color-mix(in srgb, var(--tw-note) 70%, var(--surface)) !important; border-color:var(--tw-note-line) !important; }
.tw .comment-item.posted.private { padding:8px 10px 8px 12px; border-radius:0 8px 8px 0; background:var(--tw-note); }

/* Post, and post-and-set-state */
.tw-post-group { position:relative; display:inline-flex; }
.tw .tw-post-group #postComment { border-radius:9px 0 0 9px; }
.tw .tw-post-group .tw-post-more { margin-left:1px; padding-left:10px; padding-right:10px; border-radius:0 9px 9px 0; }
.tw-post-menu { position:absolute; right:0; bottom:calc(100% + 6px); z-index:30; min-width:250px; padding:6px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:var(--shadow-pop); }
.tw-post-menu button { display:block; width:100%; padding:8px 10px; border-radius:7px; background:none; color:var(--ink); font-size:13px; text-align:left; }
.tw-post-menu button:hover, .tw-post-menu button:focus-visible { background:var(--hover-bg); outline:none; }

/* The ticket page opens below the top bar and the outage banner, which used to cover its first lines. */
.ticket-detail-backdrop { top:calc(64px + var(--outage-banner-h, 0px)); }
body.requester-portal-mode .ticket-detail-backdrop { top:0; }
.ticket-detail.tw { min-height:calc(100vh - 64px - var(--outage-banner-h, 0px)); }
html .ticket-detail.tw .tw-requester-head b { color:var(--ink); font-weight:600; text-align:left; }
/* Priority is now the second field, which an older rule styled for State; keep it like the others. */
[data-theme="dark"] .ticket-detail.tw .detail-grid label:nth-child(2) .custom-select-trigger { border-color:var(--ink-2); background:var(--surface-2); color:var(--ink); }
[data-theme="dark"] .ticket-detail.tw .detail-grid label:nth-child(2) .custom-select-trigger:hover { background:var(--hover-bg); }
/* An older rule spreads every block in a side card apart, which kept these rows from spanning the card. */
.tw .ticket-lifecycle-card .ticket-lifecycle-list { grid-template-columns:minmax(0, 1fr); justify-content:stretch; padding:0; border-top:0; }
.tw .ticket-lifecycle-list > .tw-sla-row b { color:var(--ink-2); font-size:13px; font-weight:700; text-align:left; }
[data-theme="dark"] .tw .ticket-lifecycle-list > .tw-sla-row b { color:var(--ink); }
.tw .ticket-lifecycle-list > .tw-sla-row b.breached-text { color:var(--bad); }
/* The header has the one "Assign to me"; the note above the reply box just explains what replying does. */
.tw .composer-owner-note [data-take-ticket] { display:none; }

@media (max-width:1100px) {
  .tw .detail-body { grid-template-columns:minmax(0, 1fr) 280px; gap:24px; }
}
@media (max-width:900px) {
  .ticket-detail.tw { padding:16px 20px 56px; }
  .tw .detail-body { display:flex; flex-direction:column; }
  .tw .detail-header > div:first-child { flex:1 1 auto; }
  .tw .detail-sidebar { margin-top:8px; }
  .tw .detail-actions, .tw-actions { justify-content:flex-start; }
  .tw .detail-save-status { justify-content:flex-start; }
}
@media (max-width:640px) {
  .ticket-detail.tw { padding:12px 16px 48px; }
  .tw #detailTitle, .tw .tw-title-input { font-size:22px; }
}

/* ---------- Ticket audit trail (server-integration.js) ---------- */
.audit-trail { display:grid; gap:14px; }
.audit-trail-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 20px; }
.audit-trail-head h3 { margin:0; color:var(--ink); font-size:15px; }
.audit-trail-head p { max-width:640px; margin:3px 0 0; color:var(--muted); font-size:12.5px; line-height:1.5; }
.audit-trail-tools { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.audit-filter { display:inline-flex; gap:2px; padding:3px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.audit-filter button { padding:5px 10px; border-radius:7px; background:transparent; color:var(--ink-2); font-size:12.5px; }
.audit-filter button span { margin-left:4px; color:var(--muted); font-variant-numeric:tabular-nums; }
.audit-filter button[aria-pressed="true"] { background:var(--surface); box-shadow:0 1px 2px rgba(20,23,21,.1), 0 0 0 1px var(--line); color:var(--ink); font-weight:600; }
.audit-integrity { margin:0; padding:9px 12px; border-radius:9px; font-size:12.5px; }
.audit-integrity.ok { background:var(--good-soft); color:var(--good); }
.audit-integrity.bad { background:var(--bad-soft); color:var(--bad); font-weight:600; }
.audit-trail .audit-events { display:grid; gap:0; margin:0; padding:0; list-style:none; }
.audit-trail .audit-event { display:block; padding:12px 0; border-bottom:1px solid var(--line); }
.audit-trail .audit-event:last-child { border-bottom:0; }
.audit-trail .audit-event.is-unverified { margin:0 -10px; padding:12px 10px; border-radius:8px; background:var(--bad-soft); }
.audit-event-head { display:flex; align-items:center; gap:10px; }
.audit-event-head p { margin:0; color:var(--ink-2); font-size:13.5px; line-height:1.4; }
.audit-event-head b { color:var(--ink); }
.audit-trail .audit-avatar { display:grid; place-items:center; flex:0 0 auto; width:28px; height:28px; border-radius:50%; background:var(--surface-2); color:var(--ink-2); font-size:11px; font-weight:600; }
.audit-trail .audit-view .audit-avatar { opacity:.75; }
.audit-role { padding:1px 7px; border-radius:999px; background:var(--surface-2); color:var(--muted); font-size:11px; font-weight:600; }
.audit-meta { margin:4px 0 0 38px; color:var(--muted); font-size:11.5px; font-variant-numeric:tabular-nums; }
.audit-hash { font-family:ui-monospace, SFMono-Regular, Consolas, monospace; }
.audit-ok { color:var(--good); font-weight:600; }
.audit-bad { color:var(--bad); font-weight:700; }
.audit-rows { display:grid; gap:0; margin:8px 0 0 38px; border:1px solid var(--line); border-radius:9px; overflow:hidden; font-size:12.5px; }
.audit-rows > div { display:grid; grid-template-columns:minmax(120px, 190px) minmax(0, 1fr); border-top:1px solid var(--line); }
.audit-rows > div:first-child { border-top:0; }
.audit-rows dt { padding:6px 10px; background:var(--surface-2); color:var(--ink-2); font-weight:600; }
.audit-rows dd { margin:0; padding:6px 10px; color:var(--ink); overflow-wrap:anywhere; white-space:pre-wrap; }
.audit-rows del { color:var(--muted); }
.audit-comment dd { display:grid; gap:3px; }
.audit-comment.private dd { background:color-mix(in srgb, #e6cf8a 18%, transparent); }
.audit-comment-by { color:var(--muted); font-size:11.5px; }
.audit-comment-text { color:var(--ink); }
@media (max-width:640px) {
  .audit-meta, .audit-rows { margin-left:0; }
  .audit-rows > div { grid-template-columns:1fr; }
}

/* ---------- Audit log page (audit-log.js) ---------- */
.audit-view .page-heading { align-items:flex-start; }
.al-chain .al-chain-about { max-width:820px; margin:4px 0 6px; color:var(--ink-2); line-height:1.5; }
.al-chain { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 20px; margin-bottom:14px; }
.al-chain h2 { margin:0; font-size:14px; }
.al-chain p { margin:3px 0 0; color:var(--muted); font-size:13px; }
.al-chain p.al-chain-ok { color:var(--good); font-weight:600; }
.al-chain p.al-chain-bad { color:var(--bad); font-weight:700; }
.al-filters { display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:12px 14px; align-items:end; margin-bottom:14px; }
.al-filters label { display:grid; gap:5px; color:var(--ink-2); font-size:12px; font-weight:600; }
.al-filters input, .al-filters select { width:100%; min-height:36px; padding:7px 10px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; font-weight:400; }
.al-filters .al-search { grid-column:span 2; }
.al-filter-actions { display:flex; align-items:center; gap:12px; }
.al-summary { margin:0 0 10px; color:var(--muted); font-size:12.5px; }
.al-table { width:100%; border-collapse:collapse; font-size:13px; }
.al-table th { padding:8px 10px; border-bottom:1px solid var(--line); color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.03em; text-align:left; text-transform:uppercase; }
.al-table td { padding:9px 10px; border-bottom:1px solid var(--line); color:var(--ink); vertical-align:top; }
.al-row { cursor:pointer; }
.al-row:hover td, .al-row:focus-visible td { background:var(--hover-bg-subtle); outline:none; }
.al-row[aria-expanded="true"] td { background:var(--surface-2); border-bottom-color:transparent; }
.al-row.is-unverified td { background:var(--bad-soft); }
.al-row small { display:block; color:var(--muted); font-size:11.5px; }
.al-time, .al-ip, .al-entry { white-space:nowrap; font-variant-numeric:tabular-nums; }
.al-ip, .al-entry { color:var(--ink-2); }
.al-detail > td { padding:4px 10px 14px; background:var(--surface-2); }
.al-detail .audit-meta { margin:0 0 8px; overflow-wrap:anywhere; }
.al-detail .audit-rows { margin:0; background:var(--surface); }
.al-more { display:flex; justify-content:center; padding-top:12px; }
.al-more [hidden] { display:none; }
@media (max-width:760px) {
  .al-filters .al-search { grid-column:auto; }
  .al-table th:nth-child(4), .al-table td.al-ip { display:none; }
}

/* ---------- Roles & Permissions: actions that don't apply ---------- */
.permission-na { color:var(--muted); text-align:center; }

/* ---------- Read-only access (Governance & Compliance, or any role without write access) ---------- */
body.read-only-session #newTicketButton,
body.read-only-session #workspaceNewTicketButton,
body.read-only-session #genericAction,
body.read-only-session .page-heading .create-button { display:none !important; }
.tw.is-read-only .comment-composer,
.tw.is-read-only .composer-owner-note,
.tw.is-read-only .task-composer,
.tw.is-read-only .task-check,
.tw.is-read-only .task-remove,
.tw.is-read-only .confirm-related,
.tw.is-read-only #ticketProblemLink .problem-link-row,
.tw.is-read-only #ticketProblemLink [data-unlink-problem],
.tw.is-read-only [data-tw-insert-article],
#detailMoreDropdown [data-detail-action="clone"]:is(.tw.is-read-only *),
#detailMoreDropdown [data-detail-action="escalate"]:is(.tw.is-read-only *) { display:none !important; }
.tw.is-read-only #detailTitle, .tw.is-read-only .tw-description-text { cursor:default; }
.tw.is-read-only #detailTitle:hover, .tw.is-read-only .tw-description-text:hover { background:transparent; }
.tw.is-read-only .tw-props .custom-select-trigger:disabled, .tw.is-read-only .state-dropdown-trigger:disabled { cursor:default; opacity:.8; }
.tw-read-only-note { margin:8px 0 0; padding:10px 14px; border:1px dashed var(--line-strong); border-radius:10px; color:var(--ink-2); font-size:13px; }
.problem-detail-modal:is(.is-read-only *) .problem-incidents .problem-link-row { display:none; }

/* ---------- New problem drawer (problem-form.js), built on the New ticket drawer's styles ---------- */
#problemFormModal {
  --nt-critical:#b03e2c; --nt-high:#d27b2e; --nt-medium:#c9a13f; --nt-low:#9aa196;
  position:fixed; inset:0; z-index:40; display:flex; justify-content:flex-end; background:rgba(20,23,21,0); visibility:hidden;
  transition:background .22s ease, visibility 0s linear .22s; font-family:var(--font-ui);
}
[data-theme="dark"] #problemFormModal { --nt-critical:#e8735d; --nt-high:#e99a55; --nt-medium:#e3c678; --nt-low:#7d857f; }
#problemFormModal.open { visibility:visible; background:rgba(20,23,21,.38); transition:background .22s ease; }
[data-theme="dark"] #problemFormModal.open { background:rgba(0,0,0,.55); }
#problemFormModal.open .nt-drawer { transform:none; opacity:1; }
#problemFormModal input[type="text"], #problemFormModal input[type="datetime-local"], #problemFormModal textarea {
  display:block; width:100%; margin:0; padding:10px 12px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink);
  font:400 14px/1.45 var(--font-ui); outline:none; transition:border-color .15s, box-shadow .15s;
}
#problemFormModal input::placeholder, #problemFormModal textarea::placeholder { color:var(--muted); opacity:.85; }
#problemFormModal input[type="text"]:hover, #problemFormModal input[type="datetime-local"]:hover, #problemFormModal textarea:hover { border-color:var(--control-hover); }
#problemFormModal input[type="text"]:focus, #problemFormModal input[type="datetime-local"]:focus, #problemFormModal textarea:focus { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
#problemFormModal textarea { min-height:76px; resize:vertical; }
#problemFormModal .nt-subject { font-size:15px; font-weight:500; padding:11px 12px; }
#problemFormModal .field-invalid, #problemFormModal .field-invalid:focus { border-color:var(--bad); box-shadow:0 0 0 3px var(--bad-soft); }
#problemFormModal .nt-combo input { padding-left:36px; }
#problemFormModal :focus-visible { outline:2px solid var(--spruce); outline-offset:2px; }
#problemFormModal input:focus-visible, #problemFormModal textarea:focus-visible { outline:none; }
#problemFormModal .nt-field input[type="datetime-local"] { margin-top:6px; min-height:40px; }
#problemFormModal .nt-section .nt-label ~ .nt-label { margin-top:16px; }
#problemFormModal .nt-section .nt-label + .nt-chips, #problemFormModal .nt-section .nt-label + .nt-priority { margin-bottom:2px; }
#problemFormModal .nt-seg { flex-wrap:wrap; }
#problemFormModal [hidden] { display:none !important; }
.pf-draft { display:flex; align-items:center; gap:8px; margin:14px 0 0; padding:9px 12px; border-radius:9px; background:var(--surface-2); color:var(--ink-2); font-size:12.5px; }
.pf-incident-chips { display:flex; flex-wrap:wrap; gap:6px; }
.pf-incident-chips:not(:empty) { margin-bottom:10px; }
.pf-chip { display:inline-flex; align-items:center; gap:6px; max-width:100%; padding:4px 4px 4px 10px; border:1px solid var(--line); border-radius:999px; background:var(--surface-2); color:var(--ink-2); font-size:12.5px; }
.pf-chip b { color:var(--ink); font-weight:600; }
.pf-chip button { display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:transparent; color:var(--muted); }
.pf-chip button:hover { background:var(--hover-bg); color:var(--ink); }
.pf-similar-row { display:flex; align-items:center; gap:10px; padding:7px 8px; border-radius:8px; }
.pf-similar-row + .pf-similar-row { border-top:1px solid var(--line); }
.pf-similar-row > div { flex:1; min-width:0; }
.pf-similar-row b { display:block; color:var(--ink); font-size:13px; font-weight:600; }
.pf-similar-row small { display:block; color:var(--muted); font-size:11.5px; }
.pf-similar-row .nt-btn { padding:6px 10px; font-size:12px; }
.pf-check { display:flex; align-items:flex-start; gap:9px; margin:14px 0 8px; color:var(--ink-2); font-size:13px; line-height:1.4; cursor:pointer; }
.pf-check input { flex:0 0 auto; width:16px; height:16px; margin-top:2px; accent-color:var(--spruce); }
.pf-check b { display:block; color:var(--ink); font-weight:600; }
.pf-more summary { color:var(--ink); font-size:13px; font-weight:600; cursor:pointer; }
.pf-more[open] summary { margin-bottom:10px; }
.pf-more .nt-label { margin-top:12px; }
.pf-new-from-ticket { display:block; margin-top:10px; }
/* On the problem itself */
.pf-detail { margin:4px 0 14px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.pf-detail[hidden] { display:none; }
.pf-detail .pf-check { margin:8px 0; }
.pf-detail textarea { width:100%; }
.pf-detail textarea[hidden] { display:none; }
.pf-detail-meta { margin:0 0 4px; color:var(--muted); font-size:12.5px; }
.pf-detail-meta:empty { display:none; }
@media (max-width:640px) {
  #problemFormModal .nt-priority { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .pf-similar-row { flex-wrap:wrap; }
}
#pfOutageDetails > .nt-label:first-child { margin-top:14px; }

/* Team performance: custom date range calendar (workflow.js) */
.perf-range { position:relative; align-self:center; }
.perf-range .nt-seg { flex-wrap:wrap; }
.perf-range .nt-seg button { display:inline-flex; align-items:center; gap:6px; }
.perf-cal-icon { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
.perf-cal { position:absolute; top:calc(100% + 8px); right:0; z-index:30; width:300px; max-width:calc(100vw - 32px); padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); font-family:var(--font-ui); animation:perfCalIn .14s ease; }
@keyframes perfCalIn { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
.perf-cal-presets { display:flex; flex-wrap:wrap; gap:6px; padding-bottom:12px; margin-bottom:10px; border-bottom:1px solid var(--line); }
.perf-cal-presets button { padding:5px 10px; border:1px solid var(--line); border-radius:999px; background:var(--surface-2); color:var(--ink-2); font-size:12px; font-weight:500; }
.perf-cal-presets button:hover { border-color:var(--control-hover); color:var(--ink); }
.perf-cal-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; }
.perf-cal-head b { color:var(--ink); font-size:13.5px; font-weight:600; }
.perf-cal-nav { display:grid; place-items:center; width:30px; height:30px; border-radius:8px; background:transparent; color:var(--ink-2); }
.perf-cal-nav:hover:not(:disabled) { background:var(--hover-bg); color:var(--ink); }
.perf-cal-nav:disabled { opacity:.35; cursor:default; }
.perf-cal-nav svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.perf-cal-nav.prev svg { transform:rotate(90deg); }
.perf-cal-nav.next svg { transform:rotate(-90deg); }
.perf-cal-grid { display:grid; grid-template-columns:repeat(7, 1fr); row-gap:2px; }
.perf-cal-dow { padding:4px 0 6px; color:var(--muted); font-size:11px; font-weight:600; text-align:center; }
.perf-day { position:relative; height:34px; border-radius:0; background:transparent; color:var(--ink); font-size:12.5px; font-variant-numeric:tabular-nums; }
.perf-day:hover:not(:disabled) { background:var(--hover-bg); border-radius:8px; }
.perf-day.outside { color:var(--muted); }
.perf-day.today { font-weight:700; }
.perf-day.today::after { content:''; position:absolute; left:50%; bottom:5px; width:4px; height:4px; margin-left:-2px; border-radius:50%; background:var(--spruce); }
.perf-day:disabled { color:var(--line-strong); cursor:default; }
.perf-day.in-range { background:var(--spruce-pale); }
.perf-day.in-range:hover:not(:disabled) { border-radius:0; background:var(--spruce-pale); }
.perf-day.range-start, .perf-day.range-end, .perf-day.range-start:hover:not(:disabled), .perf-day.range-end:hover:not(:disabled) { background:var(--spruce); color:var(--brand-ink); font-weight:600; }
.perf-day.range-start { border-radius:8px 0 0 8px; }
.perf-day.range-end { border-radius:0 8px 8px 0; }
.perf-day.range-start.range-end { border-radius:8px; }
.perf-day.range-start::after, .perf-day.range-end::after { background:var(--brand-ink); }
.perf-day:focus-visible { outline:2px solid var(--spruce); outline-offset:-2px; border-radius:8px; z-index:1; }
.perf-cal-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); }
.perf-cal-foot > div { display:flex; gap:4px; }
.perf-cal-foot .nt-btn { padding:7px 12px; font-size:12.5px; }
.perf-cal-foot .nt-btn:disabled { cursor:default; opacity:.45; }
.perf-cal-summary { color:var(--ink-2); font-size:12px; line-height:1.35; }
.perf-cal button:focus-visible { outline:2px solid var(--spruce); outline-offset:2px; }
@media (max-width:700px) {
  #performanceView .page-heading { flex-wrap:wrap; align-items:flex-start; }
  .perf-cal { right:auto; left:0; }
  .perf-cal-foot .nt-btn-ghost { display:inline-block; }
}

/* Facilities vendors: trade tabs with icons, and the Cards / List switch (facilities.js) */
.vendor-icon { flex:0 0 auto; width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.vendor-trade-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:-8px 0 16px; }
.vendor-trade-tabs button { display:inline-flex; align-items:center; gap:7px; min-height:36px; padding:7px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink-2); font:500 12.5px var(--font-ui); box-shadow:var(--shadow); transition:border-color .15s, background .15s, color .15s; }
.vendor-trade-tabs button .vendor-icon { color:var(--spruce); }
.vendor-trade-tabs button small { min-width:18px; padding:1px 6px; border-radius:999px; background:var(--surface-2); color:var(--muted); font-size:10.5px; font-weight:600; text-align:center; }
.vendor-trade-tabs button:hover { border-color:var(--control-hover); color:var(--ink); }
.vendor-trade-tabs button[aria-pressed="true"] { border-color:var(--spruce); background:var(--spruce); color:var(--brand-ink); font-weight:600; }
.vendor-trade-tabs button[aria-pressed="true"] .vendor-icon { color:var(--brand-ink); }
.vendor-trade-tabs button[aria-pressed="true"] small { background:rgba(255,255,255,.22); color:var(--brand-ink); }
[data-theme="dark"] .vendor-trade-tabs button[aria-pressed="true"] small { background:rgba(0,0,0,.18); }
.vendor-trade-tabs button:focus-visible, .vendor-view-toggle button:focus-visible { outline:2px solid var(--spruce); outline-offset:2px; }
.vendor-view-toggle { display:inline-flex; gap:2px; margin-left:auto; padding:3px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.vendor-view-toggle button { display:inline-flex; align-items:center; gap:6px; padding:6px 11px; border-radius:7px; background:transparent; color:var(--ink-2); font:500 12.5px var(--font-ui); }
.vendor-view-toggle button:hover { color:var(--ink); }
.vendor-view-toggle button[aria-checked="true"] { background:var(--surface); color:var(--ink); font-weight:600; box-shadow:0 1px 2px rgba(20,23,21,.1), 0 0 0 1px var(--line); }
.vendor-trade { display:inline-flex; align-items:center; gap:5px; }
.vendor-trade .vendor-icon { width:12px; height:12px; stroke-width:2; }
.vendor-table td { vertical-align:top; }
.vendor-table td > b { color:var(--ink); font-size:12.5px; }
.vendor-table td.nowrap { white-space:nowrap; }
.vendor-table a { color:var(--spruce); font-weight:600; }
.vendor-table td:last-child { text-align:right; }
.vendor-table tr.inactive td { color:var(--muted); }
.vendor-table tr.inactive td > b { color:var(--ink-2); }
.vendor-table .vendor-trade { white-space:nowrap; }
.vendor-list .tableWrap { position:relative; }
.vendor-table td:first-child { min-width:150px; }
.vendor-table td:nth-child(4) { min-width:110px; }
.vendor-areas-cell { display:flex; flex-wrap:wrap; gap:4px; min-width:150px; max-width:230px; }
.vendor-table td:nth-child(6) { max-width:190px; overflow-wrap:anywhere; }
.vendor-table th, .vendor-table td { padding-left:8px; padding-right:8px; }
.vendor-table .vendor-area { white-space:nowrap; }
.vendor-table tbody tr[data-vendor-row]:hover { background:var(--hover-bg); }
.vendor-area.more { color:var(--muted); cursor:help; }
.vendor-status { display:inline-flex; align-items:center; gap:7px; color:var(--ink-2); font-size:12.5px; white-space:nowrap; }
.vendor-status i { width:7px; height:7px; border-radius:50%; background:var(--good); }
.vendor-status.inactive i { background:var(--line-strong); }
.vendor-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
@media (max-width:700px) {
  .vendor-trade-tabs { flex-wrap:nowrap; margin-right:-16px; padding-bottom:4px; overflow-x:auto; scrollbar-width:none; }
  .vendor-trade-tabs button { flex:0 0 auto; }
  .vendor-view-toggle { margin-left:0; }
}
.vendor-table tbody tr:not([data-vendor-row]) { cursor:default; }

/* Dialogs taller than the window: the backdrop scrolls, and a tall dialog starts at the top instead of being cut off above and below. */
.modal-backdrop { overflow-y:auto; overscroll-behavior:contain; place-items:safe center; padding-top:calc(64px + var(--outage-banner-h, 0px) + 16px); }

/* Generated sample history in audit trails (npm run seed-demo / seed-tickets) */
.audit-sample { display:inline-block; padding:0 6px; border-radius:999px; background:var(--surface-2); border:1px solid var(--line); color:var(--muted); font-size:10.5px; font-weight:600; }

/* =====================================================================================================
   Appearance: accent colour, background tone, and contrast (Appearance dialog in the user menu; shell.js).
   The <html> element carries data-theme (light/dark), data-accent, data-tone, and data-contrast.
   Spruce, Warm, and Standard are the original look and change nothing.
   ===================================================================================================== */
:root { --accent-hover:color-mix(in srgb, var(--spruce) 6%, var(--surface)); --accent-border:color-mix(in srgb, var(--spruce) 35%, var(--line)); }

/* ---- Accent colours: [light, dark] ---- */
:root[data-accent="ocean"] { --spruce:#1f5f8b; }
:root[data-accent="indigo"] { --spruce:#4347a8; }
:root[data-accent="plum"] { --spruce:#7a3b73; }
:root[data-accent="terracotta"] { --spruce:#a3472e; }
:root[data-accent="amber"] { --spruce:#86580a; }
:root[data-accent="teal"] { --spruce:#0f6a69; }
:root[data-accent="graphite"] { --spruce:#3c4450; }
:root[data-theme="dark"][data-accent="ocean"] { --spruce:#7fb4dd; }
:root[data-theme="dark"][data-accent="indigo"] { --spruce:#a4a8f2; }
:root[data-theme="dark"][data-accent="plum"] { --spruce:#d69ccd; }
:root[data-theme="dark"][data-accent="terracotta"] { --spruce:#ec9b83; }
:root[data-theme="dark"][data-accent="amber"] { --spruce:#e2b25a; }
:root[data-theme="dark"][data-accent="teal"] { --spruce:#6cc4c0; }
:root[data-theme="dark"][data-accent="graphite"] { --spruce:#b6bdc9; }
/* Shades are worked out from the accent, so every accent gets matching hover, pale, and focus colours. */
:root[data-accent]:not([data-accent="spruce"]) {
  --spruce-dark:color-mix(in srgb, var(--spruce) 80%, #000); --spruce-pale:color-mix(in srgb, var(--spruce) 12%, var(--surface));
  --control-focus:color-mix(in srgb, var(--spruce) 18%, transparent); --brand-ink:#ffffff;
}
:root[data-theme="dark"][data-accent]:not([data-accent="spruce"]) {
  --spruce-dark:color-mix(in srgb, var(--spruce) 78%, #fff); --spruce-pale:color-mix(in srgb, var(--spruce) 18%, var(--surface));
  --control-focus:color-mix(in srgb, var(--spruce) 24%, transparent); --brand-ink:#11151b;
}

/* ---- Background tones ---- */
:root[data-tone="neutral"] {
  --paper:#f5f5f4; --surface:#ffffff; --surface-2:#efefee; --line:#e4e4e2; --line-strong:#d2d2cf;
  --ink:#1d1f21; --ink-2:#4a4d52; --muted:#696d73; --hover-bg:#efefee; --hover-bg-subtle:#f7f7f6; --control-border:#d2d2cf; --control-hover:#b5b5b1;
}
:root[data-theme="dark"][data-tone="neutral"] {
  --paper:#121314; --surface:#1b1c1e; --surface-2:#232427; --line:#2e3033; --line-strong:#3d4044;
  --ink:#eeeff0; --ink-2:#c0c3c7; --muted:#979ba1; --hover-bg:#26272a; --hover-bg-subtle:#1f2022; --control-border:#3d4044; --control-hover:#51555b;
}
:root[data-tone="cool"] {
  --paper:#f2f5f9; --surface:#ffffff; --surface-2:#eaeef4; --line:#dde3eb; --line-strong:#c9d1dc;
  --ink:#19222e; --ink-2:#435061; --muted:#627080; --hover-bg:#eaeef4; --hover-bg-subtle:#f5f7fb; --control-border:#c9d1dc; --control-hover:#a8b4c3;
}
:root[data-theme="dark"][data-tone="cool"] {
  --paper:#0e131a; --surface:#161c25; --surface-2:#1e2530; --line:#29323f; --line-strong:#374252;
  --ink:#e8edf4; --ink-2:#b7c1ce; --muted:#8c98a8; --hover-bg:#212935; --hover-bg-subtle:#1a212b; --control-border:#374252; --control-hover:#4a5669;
}

/* ---- High contrast: darker secondary text, firmer borders, and a thicker focus ring ---- */
:root[data-contrast="high"][data-theme] {
  --ink-2:color-mix(in srgb, var(--ink) 90%, var(--surface)); --muted:color-mix(in srgb, var(--ink) 76%, var(--surface));
  --line:color-mix(in srgb, var(--ink) 30%, var(--surface)); --line-strong:color-mix(in srgb, var(--ink) 48%, var(--surface));
  --control-border:color-mix(in srgb, var(--ink) 48%, var(--surface)); --control-hover:var(--ink-2);
}
:root[data-contrast="high"] :focus-visible { outline-width:3px !important; }

/* ---- The Appearance dialog ---- */
.appearance-modal { width:min(560px, 100%); }
.appearance-modal h3 { margin:20px 0 8px; color:var(--ink); font:600 13px var(--font-ui); }
.appearance-modal h3:first-of-type { margin-top:14px; }
.appearance-seg { display:flex; gap:2px; padding:3px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.appearance-seg button { flex:1; padding:7px 10px; border-radius:7px; background:transparent; color:var(--ink-2); font-size:13px; font-weight:500; }
.appearance-seg button[aria-checked="true"] { background:var(--surface); color:var(--ink); font-weight:600; box-shadow:var(--shadow), 0 0 0 1px var(--line); }
.appearance-accents { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:8px; }
.appearance-accents button, .appearance-tones button { display:flex; align-items:center; gap:9px; padding:9px 10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); font-size:12.5px; font-weight:500; text-align:left; }
.appearance-accents button:hover, .appearance-tones button:hover { border-color:var(--control-hover); }
.appearance-accents button[aria-checked="true"], .appearance-tones button[aria-checked="true"] { border-color:var(--spruce); box-shadow:0 0 0 2px var(--control-focus); font-weight:600; }
.appearance-swatch { flex:0 0 auto; width:18px; height:18px; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(0,0,0,.12); }
.appearance-tones { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; }
.appearance-tones button { flex-direction:column; align-items:stretch; gap:6px; }
.appearance-tone-preview { display:flex; height:30px; overflow:hidden; border-radius:6px; box-shadow:inset 0 0 0 1px rgba(0,0,0,.1); }
.appearance-tone-preview i { flex:1; }
.appearance-note { margin:6px 0 0; color:var(--muted); font-size:12px; line-height:1.45; }
.appearance-foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-top:22px; padding-top:16px; border-top:1px solid var(--line); }
.appearance-foot > div { display:flex; flex-wrap:wrap; gap:8px; }
.appearance-modal button:focus-visible { outline:2px solid var(--spruce); outline-offset:2px; }
.menu-appearance { display:flex !important; align-items:center; gap:8px; width:100%; }
.menu-appearance .appearance-swatch { width:12px; height:12px; }
@media (max-width:560px) { .appearance-accents { grid-template-columns:repeat(2, minmax(0, 1fr)); } .appearance-tones { grid-template-columns:1fr; } }

/* ---------- People directory (people.js) ---------- */
.people-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px; }
.people-toolbar input[type="search"] { flex:1 1 280px; max-width:440px; min-height:38px; padding:0 12px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; }
.people-toolbar select { min-height:38px; padding:0 10px; border:1px solid var(--control-border); border-radius:9px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; }
.people-toolbar input:focus, .people-toolbar select:focus { outline:none; border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
.people-layout { display:grid; grid-template-columns:minmax(0, 1fr); gap:16px; align-items:start; }
.people-layout.has-profile { grid-template-columns:minmax(280px, 380px) minmax(0, 1fr); }
.people-list { display:flex; flex-direction:column; max-height:calc(100vh - 290px - var(--outage-banner-h, 0px)); min-height:240px; overflow-y:auto; padding:6px; }
.people-row { display:flex; align-items:center; gap:10px; width:100%; padding:9px 10px; border-radius:9px; background:transparent; color:var(--ink); text-align:left; }
.people-row + .people-row { margin-top:1px; }
.people-row:hover { background:var(--hover-bg); }
.people-row.selected { background:var(--spruce-pale); box-shadow:inset 3px 0 0 var(--spruce); }
.people-row .avatar, .people-profile-head .avatar { display:grid; flex:0 0 auto; place-items:center; width:34px; height:34px; border-radius:50%; font-size:12px; font-weight:700; }
.people-row-main { flex:1; min-width:0; }
.people-row-main b { display:block; overflow:hidden; font-size:13px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.people-row-main small, .people-row-stats small { display:block; overflow:hidden; color:var(--muted); font-size:11.5px; text-overflow:ellipsis; white-space:nowrap; }
.people-row-stats { display:flex; flex-direction:column; align-items:flex-end; gap:2px; }
.people-open { padding:1px 7px; border-radius:999px; background:var(--spruce-pale); color:var(--spruce-dark); font-size:11px; font-weight:600; white-space:nowrap; }
.people-profile { position:sticky; top:calc(80px + var(--outage-banner-h, 0px)); padding:20px 22px; outline:none; }
.people-empty { margin:24px 0; color:var(--muted); font-size:13px; text-align:center; }
.people-profile-head { position:relative; display:flex; align-items:center; gap:12px; padding-right:30px; }
.people-profile-head .avatar { width:46px; height:46px; font-size:15px; }
.people-profile-head h2 { margin:0 0 4px; color:var(--ink); font:700 20px var(--font-ui); }
.people-role { display:inline-block; padding:2px 9px; border-radius:999px; background:var(--surface-2); color:var(--ink-2); font-size:11.5px; font-weight:600; }
.people-close { top:-4px !important; right:-6px !important; }
.people-details { display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px 18px; margin:16px 0 0; }
.people-details div { min-width:0; }
.people-details dt { color:var(--muted); font-size:11.5px; font-weight:600; }
.people-details dd { margin:2px 0 0; overflow-wrap:anywhere; color:var(--ink); font-size:13px; }
.people-details a { color:var(--spruce); font-weight:600; }
.people-stats { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:8px; margin:16px 0; }
.people-stats div { padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.people-stats b { display:block; color:var(--ink); font-size:18px; font-weight:700; }
.people-stats small { color:var(--muted); font-size:11.5px; }
.people-actions { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.people-tabs { display:flex; gap:4px; border-bottom:1px solid var(--line); }
.people-tabs button { margin-bottom:-1px; padding:9px 12px; border-bottom:2px solid transparent; background:transparent; color:var(--ink-2); font-size:13px; font-weight:500; }
.people-tabs button[aria-selected="true"] { border-bottom-color:var(--spruce); color:var(--ink); font-weight:600; }
.people-tabs button span { margin-left:4px; padding:0 6px; border-radius:999px; background:var(--surface-2); color:var(--muted); font-size:11px; }
.people-filter { margin:12px 0 8px; }
.people-tickets { display:flex; flex-direction:column; }
.people-ticket { display:grid; grid-template-columns:auto minmax(0, 1fr) auto; align-items:center; gap:12px; padding:10px 8px; border-bottom:1px solid var(--line); background:transparent; color:var(--ink); text-align:left; }
.people-ticket:hover { background:var(--hover-bg); }
.people-ticket .ticket-number { color:var(--muted); font-size:12px; font-weight:600; white-space:nowrap; }
.people-ticket-main b { display:block; overflow:hidden; font-size:13px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.people-ticket-main small { color:var(--muted); font-size:11.5px; }
.people-ticket .ticket-state-chip { display:inline-flex; align-items:center; gap:6px; padding:0; border:0; background:transparent !important; color:var(--ink-2); font-size:12px; white-space:nowrap; }
.people-ticket .ticket-state-chip > i { width:7px; height:7px; border-radius:50%; background:var(--state-open); }
.people-ticket .ticket-state-chip:is(.state-pending-customer, .state-pending-escalation, .state-onsite-required) > i { background:var(--state-pending); }
.people-ticket .ticket-state-chip:is(.state-resolved, .state-closed) > i { background:var(--state-done); }
.people-more { margin-top:12px; }
.people-row:focus-visible, .people-ticket:focus-visible, .people-tabs button:focus-visible { outline:2px solid var(--spruce); outline-offset:-2px; }
.tw-profile-link { display:inline-block; margin-top:8px; }
@media (max-width:900px) {
  .people-layout.has-profile { grid-template-columns:minmax(0, 1fr); }
  .people-layout.has-profile .people-list { display:none; }
  .people-profile { position:static; }
  .people-stats { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
.people-toolbar select, .people-toolbar .custom-select-wrapper { flex:0 0 200px; width:200px; max-width:100%; }
#peopleView .avatar-spruce { background:var(--spruce-pale); color:var(--spruce-dark); }
@media (max-width:560px) { .people-toolbar select, .people-toolbar .custom-select-wrapper { flex:1 1 100%; width:100%; } }

/* People: SLAs tab */
.people-sla-badge { background:var(--bad-soft) !important; color:var(--bad) !important; font-weight:600; }
.people-sla-summary { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:8px; margin:14px 0 6px; }
.people-sla-summary div { padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.people-sla-summary b { display:block; color:var(--ink); font-size:18px; font-weight:700; }
.people-sla-summary small { color:var(--muted); font-size:11.5px; }
.people-sla-summary .sla-breached-text { color:var(--bad); }
.people-sla-summary .sla-met-text { color:var(--good); }
.people-sla-note { margin:4px 0 8px; color:var(--muted); font-size:12px; line-height:1.45; }
.people-sla-section { margin-top:18px; }
.people-sla-section h3 { display:flex; align-items:center; gap:8px; margin:0; color:var(--ink); font:600 14px var(--font-ui); }
.people-sla-section h3 span { padding:0 8px; border-radius:999px; font-size:11.5px; font-weight:600; }
.people-sla-section.sla-breached h3 span { background:var(--bad-soft); color:var(--bad); }
.people-sla-section.sla-upcoming h3 span { background:var(--spruce-pale); color:var(--spruce-dark); }
.people-sla-section.sla-met h3 span { background:var(--good-soft); color:var(--good); }
.people-sla-section.sla-breached h3::before, .people-sla-section.sla-upcoming h3::before, .people-sla-section.sla-met h3::before { content:''; width:8px; height:8px; border-radius:50%; }
.people-sla-section.sla-breached h3::before { background:var(--bad); }
.people-sla-section.sla-upcoming h3::before { background:var(--spruce); }
.people-sla-section.sla-met h3::before { background:var(--good); }
.people-sla-outcome { color:var(--ink-2); font-size:12px; font-weight:500; text-align:right; }
.people-sla-row.sla-breached .people-sla-outcome { color:var(--bad); font-weight:600; }
.people-sla-row.sla-met .people-sla-outcome { color:var(--good); }
@media (max-width:900px) { .people-sla-summary { grid-template-columns:repeat(2, minmax(0, 1fr)); } .people-sla-row { grid-template-columns:auto minmax(0, 1fr); } .people-sla-outcome { grid-column:2; text-align:left; } }

/* Users and Requesters directories: phone numbers stay on one line. */
.user-directory-panel table td:nth-child(6), .requester-directory-panel table td:nth-child(6) { white-space:nowrap; }
/* VIP requesters: a gold star after the name in ticket lists and on the ticket. */
.vip-star { display:inline-block; margin-left:5px; color:#d49a1a; font-size:1.05em; line-height:1; vertical-align:baseline; cursor:default; }
[data-theme="dark"] .vip-star { color:#f0c050; }

/* User Settings (preferences.js) */
.user-settings-card .us-wide, .user-settings-grid .us-wide { grid-column:1 / -1; }
.user-settings-card label { display:block; margin-top:12px; color:var(--ink-2); font-size:12.5px; font-weight:600; }
.user-settings-card select, .user-settings-card input[type="date"], .user-settings-card input[type="text"], .user-settings-card textarea { display:block; width:100%; margin-top:6px; padding:9px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-weight:400; }
.us-checks { display:grid; gap:2px; }
.user-settings-card label.us-check { display:flex; align-items:flex-start; gap:9px; margin-top:8px; font-weight:400; cursor:pointer; }
.us-check input { flex:0 0 auto; width:16px; height:16px; margin:2px 0 0; accent-color:var(--spruce); }
.us-check b { display:block; color:var(--ink); font-size:13px; font-weight:600; }
.us-check small { display:block; margin-top:2px; color:var(--muted); font-size:12px; font-weight:400; }
.us-hint { margin:10px 0 0; color:var(--muted); font-size:12px; }
.us-ooo-effects { margin:12px 0 0; padding-left:18px; color:var(--ink-2); font-size:12.5px; line-height:1.6; }
.us-template { display:grid; grid-template-columns:minmax(140px, 220px) minmax(0, 1fr) auto; gap:8px; align-items:start; margin-top:10px; }
.us-template input, .us-template textarea { margin-top:0 !important; }
.us-remove { align-self:center; color:var(--bad) !important; }
@media (max-width:760px) { .us-template { grid-template-columns:1fr; } }
/* Out of office: warning under assignee pickers, and a reminder in the top bar */
.ooo-hint { margin:6px 0 0; padding:7px 10px; border-radius:8px; background:var(--saffron-pale); color:#6f5418; font-size:12px; font-weight:500; line-height:1.4; }
.ooo-hint[hidden] { display:none; }
.ooo-chip { padding:6px 11px; border:1px solid #e3c577; border-radius:999px; background:var(--saffron-pale); color:#6f5418; font-size:12px; font-weight:600; white-space:nowrap; }
.ooo-chip[hidden] { display:none; }
[data-theme="dark"] .ooo-hint, [data-theme="dark"] .ooo-chip { border-color:#5a4a22; background:#3c331d; color:#e8c164; }
/* Reply template picker groups */
.composer-picker .picker-group { margin:8px 10px 2px; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
/* My Workspace: several items per card */
.workspace-items { display:grid; }
.workspace-items .workspace-summary-link + .workspace-summary-link { border-top:1px solid var(--line); }
.workspace-more { display:block; margin:0 18px 14px auto; }
/* Login Policy */
.login-policy-card { max-width:760px; padding:6px 20px; }
.login-policy-row { display:grid; grid-template-columns:minmax(0, 1fr) 110px 70px; gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line); }
.login-policy-row:last-child { border-bottom:0; }
.login-policy-row b { display:block; color:var(--ink); font-size:13px; }
.login-policy-row small { display:block; margin-top:3px; color:var(--muted); font-size:12px; font-weight:400; }
.login-policy-row input { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; text-align:right; }
.login-policy-row input:disabled { background:var(--surface-2); color:var(--muted); }
.login-policy-row em { color:var(--muted); font-size:11.5px; font-style:normal; }
#loginPolicySettingsPanel .save-button { margin-top:16px; }
/* Compact layout (User Settings > Time & display) */
body.density-compact #ticketsView .ticket-row, body.density-compact #ticketsView .ticket-table-head { padding-top:7px !important; padding-bottom:7px !important; min-height:0 !important; }
body.density-compact .rp-table td, body.density-compact .rp-table th { padding-top:5px; padding-bottom:5px; }
body.density-compact .workspace-summary-link { padding-top:9px; padding-bottom:9px; }
body.density-compact .panel { padding:14px; }
body.density-compact .view-container { padding-top:24px; }
/* A short card next to a tall one keeps its fields together at the top. */
.user-settings-card { align-content:start; }
.user-settings-card label.us-check { display:flex; }

/* Users / Requesters directory: use the full page width and keep the Edit button inside its row */
.user-directory-panel, .requester-directory-panel { max-width:none; }
.user-directory-panel .tableWrap td:has(.directory-row-edit), .requester-directory-panel .tableWrap td:has(.directory-row-edit) { display:table-cell; white-space:nowrap; vertical-align:middle; }
.user-directory-panel .directory-row-edit, .requester-directory-panel .directory-row-edit { margin-left:12px; vertical-align:middle; }
.user-directory-panel .tableWrap td, .requester-directory-panel .tableWrap td { vertical-align:middle; }
.user-directory-panel .tableWrap th, .requester-directory-panel .tableWrap th, .user-directory-panel .tableWrap td, .requester-directory-panel .tableWrap td { padding-left:8px; padding-right:8px; }

/* ===== Knowledge base article editor (kbe-*) ===== */
.knowledge-editor-view.active-view, [data-theme="dark"] .knowledge-editor-view.active-view { margin:-28px -32px -72px; min-height:calc(100vh - 64px); background:var(--paper); }
body.density-compact .knowledge-editor-view.active-view { margin-top:-24px; }
.kbe-header { position:sticky; top:64px; z-index:15; display:flex; align-items:center; gap:14px; min-height:60px; padding:0 32px; border-bottom:1px solid var(--line); background:var(--surface); }
.kbe-header .kbe-back { margin:0; }
.kbe-status { display:inline-flex; align-items:center; gap:7px; color:var(--muted); font-size:12.5px; }
.kbe-status::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--line-strong); }
.kbe-status[data-state="dirty"] { color:var(--ink-2); }
.kbe-status[data-state="dirty"]::before { background:#d49a2a; }
.kbe-status[data-state="draft"]::before { background:var(--good); }
.kbe-actions { display:flex; align-items:center; gap:8px; margin-left:auto; }
.kbe-actions .save-button, .kbe-actions .outline-button { margin:0; white-space:nowrap; }
.kbe-preview-toggle { display:inline-flex !important; align-items:center; gap:7px; }
.kbe-preview-toggle[aria-pressed="true"] { border-color:var(--spruce); color:var(--spruce); }

.kbe-body { display:grid; grid-template-columns:minmax(0, 1fr) 300px; gap:24px; max-width:1240px; margin:0 auto; padding:22px 32px 64px; align-items:start; }
.kbe-main { min-width:0; }

.kbe-toolbar { position:sticky; top:136px; z-index:12; display:flex; align-items:center; flex-wrap:wrap; gap:2px; margin-bottom:14px; padding:6px 8px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.kbe-toolbar.is-previewing { display:none; }
.kbe-group { display:flex; align-items:center; gap:2px; padding-right:6px; margin-right:4px; border-right:1px solid var(--line); }
.kbe-group:nth-last-child(2) { border-right:0; }
.kbe-tool, .kbe-select { display:inline-flex; align-items:center; justify-content:center; gap:3px; height:32px; min-width:32px; padding:0 7px; border:0; border-radius:7px; background:none; color:var(--ink-2); cursor:pointer; }
.kbe-tool:hover, .kbe-select:hover, .kbe-tool[aria-expanded="true"], .kbe-select[aria-expanded="true"] { background:var(--hover-bg); color:var(--ink); }
.kbe-tool.is-active { background:var(--spruce-pale); color:var(--spruce); }
.kbe-tool-caret svg:last-child, .kbe-select svg { width:13px; height:13px; opacity:.6; }
.kbe-select { justify-content:space-between; min-width:128px; padding:0 8px 0 10px; font-size:13px; font-weight:500; }
.kbe-count { color:var(--muted); font-size:12.5px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.kbe-count::before { content:"·"; margin-right:10px; color:var(--line-strong); }

.kbe-menu-wrap { position:relative; }
.kbe-menu { position:absolute; top:calc(100% + 6px); left:0; z-index:30; display:grid; min-width:190px; padding:6px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:var(--shadow-pop); }
.kbe-menu[hidden] { display:none; }
.kbe-menu > button { display:flex; align-items:center; gap:10px; padding:7px 10px; border:0; border-radius:6px; background:none; color:var(--ink); font-size:13px; text-align:left; cursor:pointer; }
.kbe-menu > button:hover { background:var(--hover-bg); }
.kbe-menu > button svg { color:var(--muted); }
.kbe-menu .kbe-style-h2 { font-size:17px; font-weight:700; }
.kbe-menu .kbe-style-h3 { font-size:15px; font-weight:700; }
.kbe-menu .kbe-style-blockquote { padding-left:12px; border-left:3px solid var(--spruce); border-radius:0 6px 6px 0; color:var(--ink-2); }
.kbe-menu .kbe-style-pre { font-family:ui-monospace, Consolas, monospace; font-size:12.5px; }
.kbe-more-menu { left:auto; right:0; width:240px; }
.kbe-menu-label { margin:8px 10px 4px; color:var(--muted); font-size:11px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; }
.kbe-menu-label:first-child { margin-top:4px; }
.kbe-menu hr { margin:6px 4px; border:0; border-top:1px solid var(--line); }
.kbe-glyph { display:inline-block; width:16px; color:var(--muted); font-size:12px; font-weight:600; text-align:center; }
.kbe-chip-row, .kbe-swatch-row { display:flex; flex-wrap:wrap; gap:6px; padding:2px 10px 4px; }
.kbe-chip { padding:4px 9px; border:1px solid var(--control-border); border-radius:999px; background:var(--surface); color:var(--ink-2); font-size:12px; cursor:pointer; }
.kbe-chip:hover { border-color:var(--spruce); color:var(--spruce); }
.kbe-swatch { width:24px; height:24px; padding:0; border:2px solid var(--surface); border-radius:50%; background:var(--swatch); box-shadow:0 0 0 1px var(--line-strong); cursor:pointer; }
.kbe-swatch:hover { box-shadow:0 0 0 2px var(--spruce); }
.kbe-swatch-none { background:linear-gradient(135deg, transparent 45%, var(--bad) 45%, var(--bad) 55%, transparent 55%), var(--surface); }

.kbe-link-pop { position:absolute; top:calc(100% + 6px); left:50%; z-index:30; display:flex; gap:8px; width:min(460px, calc(100% - 16px)); padding:8px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:var(--shadow-pop); transform:translateX(-50%); }
.kbe-link-pop[hidden] { display:none; }
.kbe-link-pop input { flex:1; min-width:0; padding:8px 10px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--ink); font-size:13px; }
.kbe-link-pop input:focus { border-color:var(--spruce); outline:0; box-shadow:0 0 0 3px var(--control-focus); }
.kbe-link-pop button { margin:0; }

.kbe-draft-banner { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:14px; padding:10px 14px; border:1px solid #e3c577; border-radius:10px; background:var(--saffron-pale, #fbf1d6); color:var(--ink); font-size:13px; }
.kbe-draft-banner[hidden] { display:none; }
.kbe-draft-banner span { flex:1; min-width:220px; }
.kbe-draft-banner button { margin:0; }
[data-theme="dark"] .kbe-draft-banner { border-color:#6b5622; background:#2e2716; }

.kbe-page { min-height:640px; padding:56px clamp(24px, 7%, 88px) 72px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.kbe-page[hidden] { display:none; }
.kbe-title { display:block; width:100%; margin:0 0 18px; padding:0; overflow:hidden; border:0; outline:0; resize:none; background:transparent; color:var(--ink); font:700 34px/1.2 var(--font-ui); letter-spacing:-.02em; }
.kbe-title::placeholder { color:var(--line-strong); }
.kbe-content { position:relative; min-height:460px; outline:0; }
.kbe-content.is-empty::before { content:attr(data-placeholder); position:absolute; top:0; left:0; right:0; color:var(--muted); pointer-events:none; }

/* Article typography: shared by the editor, the preview and the reader. */
.kb-prose { color:var(--ink); font-size:16px; line-height:1.75; overflow-wrap:anywhere; }
.article-reader-body.kb-prose { font-size:14.5px; line-height:1.65; }
.kb-prose > :first-child { margin-top:0; }
.kb-prose p { margin:0 0 14px; }
.kb-prose h2 { margin:30px 0 10px; color:var(--ink); font:700 24px/1.3 var(--font-ui); letter-spacing:-.01em; }
.kb-prose h3 { margin:24px 0 8px; color:var(--ink); font:700 19px/1.35 var(--font-ui); }
.kb-prose ul, .kb-prose ol { margin:0 0 14px; padding-left:26px; }
.kb-prose li { margin:4px 0; }
.kb-prose blockquote { margin:18px 0; padding:10px 16px; border-left:3px solid var(--spruce); border-radius:0 8px 8px 0; background:var(--spruce-pale); color:var(--ink-2); }
.kb-prose pre { margin:16px 0; padding:12px 14px; overflow-x:auto; border:1px solid var(--line); border-radius:8px; background:var(--surface-2); font:13px/1.55 ui-monospace, Consolas, monospace; white-space:pre-wrap; }
.kb-prose code { padding:1px 5px; border-radius:4px; background:var(--surface-2); font:.9em ui-monospace, Consolas, monospace; }
.kb-prose pre code { padding:0; background:none; }
.kb-prose a { color:var(--spruce); text-decoration:underline; text-underline-offset:2px; }
.kb-prose img { display:block; max-width:100%; height:auto; margin:20px auto; border-radius:8px; }
.kb-prose hr { margin:26px 0; border:0; border-top:1px solid var(--line); }
.kb-prose table { width:100%; margin:18px 0; border-collapse:collapse; font-size:.92em; }
.kb-prose th, .kb-prose td { min-width:70px; padding:8px 10px; border:1px solid var(--line-strong); text-align:left; vertical-align:top; }
.kb-prose th { background:var(--surface-2); font-weight:600; }
[data-theme="dark"] .kb-prose [style*="background-color"] { color:#1f2a24; }

.kbe-preview-note { display:flex; align-items:center; gap:8px; margin:-32px 0 28px; padding:8px 12px; border-radius:8px; background:var(--spruce-pale); color:var(--spruce); font-size:12.5px; font-weight:500; }
.kbe-preview-meta { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:12px; color:var(--muted); font-size:12.5px; }
.kbe-preview-title { margin:0 0 10px; color:var(--ink); font:700 34px/1.2 var(--font-ui); letter-spacing:-.02em; }
.kbe-preview-summary { margin:0 0 26px; padding-bottom:22px; border-bottom:1px solid var(--line); color:var(--ink-2); font-size:17px; line-height:1.55; }
.kbe-preview-empty { color:var(--muted); font-style:italic; font-weight:400; }
.kbe-preview-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:28px; padding-top:18px; border-top:1px solid var(--line); }

.kbe-side { position:sticky; top:136px; display:grid; gap:16px; }
.kbe-card { padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.kbe-card h3 { margin:0 0 14px; color:var(--ink); font-size:14px; font-weight:600; }
.kbe-field { display:flex; align-items:baseline; justify-content:space-between; margin:14px 0 6px; color:var(--ink-2); font-size:12.5px; font-weight:600; }
.kbe-card h3 + .kbe-field { margin-top:0; }
.kbe-field small { color:var(--muted); font-weight:400; font-variant-numeric:tabular-nums; }
.kbe-help { margin:6px 0 0; color:var(--muted); font-size:12px; line-height:1.4; }
.kbe-card textarea, .kbe-combo input { width:100%; box-sizing:border-box; padding:8px 10px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--ink); font-size:13px; line-height:1.45; }
.kbe-card textarea { resize:vertical; min-height:74px; }
.kbe-card textarea:focus, .kbe-combo input:focus, .kbe-tags:focus-within { border-color:var(--spruce); outline:0; box-shadow:0 0 0 3px var(--control-focus); }
.kbe-combo { position:relative; }
.kbe-combo input { padding-right:30px; }
.kbe-combo-caret { position:absolute; top:50%; right:9px; display:flex; color:var(--muted); pointer-events:none; transform:translateY(-50%); }
.kbe-suggest { position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:20; max-height:230px; overflow-y:auto; padding:5px; border:1px solid var(--line); border-radius:9px; background:var(--surface); box-shadow:var(--shadow-pop); }
.kbe-suggest[hidden] { display:none; }
.kbe-suggest button { display:block; width:100%; padding:7px 9px; border:0; border-radius:6px; background:none; color:var(--ink); font-size:13px; text-align:left; cursor:pointer; }
.kbe-suggest button:hover, .kbe-suggest button.is-active { background:var(--hover-bg); }
.kbe-suggest-new { margin:4px 0 0; padding:7px 9px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.kbe-segment { display:grid; grid-template-columns:1fr 1fr; padding:3px; border-radius:9px; background:var(--surface-2); }
.kbe-segment button { padding:7px 10px; border:0; border-radius:7px; background:none; color:var(--ink-2); font-size:13px; font-weight:500; cursor:pointer; }
.kbe-segment button[aria-checked="true"] { background:var(--surface); color:var(--ink); font-weight:600; box-shadow:var(--shadow); }
.kbe-segment.is-locked button { cursor:not-allowed; opacity:.65; }
.kbe-tags { display:flex; flex-wrap:wrap; align-items:center; gap:6px; min-height:38px; padding:5px 8px; box-sizing:border-box; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); cursor:text; }
.kbe-tags input { flex:1; min-width:110px; padding:3px 2px; border:0; outline:0; background:none; color:var(--ink); font-size:13px; }
.kbe-tag { display:inline-flex; align-items:center; gap:4px; padding:2px 4px 2px 9px; border-radius:999px; background:var(--spruce-pale); color:var(--spruce); font-size:12px; font-weight:600; }
.kbe-preview-tags .kbe-tag { padding-right:9px; }
.kbe-tag button { display:grid; place-items:center; width:18px; height:18px; padding:0; border:0; border-radius:50%; background:none; color:inherit; font-size:14px; line-height:1; cursor:pointer; }
.kbe-tag button:hover { background:color-mix(in srgb, var(--spruce) 18%, transparent); }
.kbe-checklist { display:grid; gap:9px; margin:0; padding:0; list-style:none; }
.kbe-checklist li { display:flex; align-items:center; gap:9px; color:var(--ink-2); font-size:13px; }
.kbe-checklist li > span { display:grid; flex:0 0 auto; place-items:center; width:18px; height:18px; box-sizing:border-box; border:1.5px solid var(--line-strong); border-radius:50%; }
.kbe-checklist li.is-done { color:var(--muted); }
.kbe-checklist li.is-done > span { border-color:var(--good); background:var(--good); color:#fff; }
.kbe-checklist li.is-done svg { width:12px; height:12px; stroke-width:3; }

@media (max-width:1100px) {
  .kbe-body { grid-template-columns:minmax(0, 1fr); }
  .kbe-side { position:static; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); }
}
@media (max-width:640px) {
  .knowledge-editor-view.active-view, [data-theme="dark"] .knowledge-editor-view.active-view { margin:-20px -16px -88px; }
  .kbe-header { position:static; flex-wrap:wrap; gap:8px; padding:10px 16px; }
  .kbe-status { order:3; }
  .kbe-actions { width:100%; margin-left:0; }
  .kbe-actions > * { flex:1; }
  .kbe-body { padding:14px 16px 48px; }
  .kbe-toolbar { position:static; }
  .kbe-group { padding-right:2px; margin-right:2px; }
  .kbe-count { order:3; }
  .kbe-page { min-height:420px; padding:28px 18px 40px; }
  .kbe-title, .kbe-preview-title { font-size:26px; }
  .kbe-preview-note { margin-top:-10px; }
}

/* ===== AI assistant (assistant.js) ===== */
.ai-chat-panel { width:min(460px, 100%); background:var(--surface); }
.ai-chat-panel .side-panel-header { align-items:center; padding:16px 18px; }
.ai-chat-panel .side-panel-header small { color:var(--muted); font-size:12px; }
.ai-head-actions { display:flex; align-items:center; gap:10px; }
.ai-link { padding:0; border:0; background:none; color:var(--spruce); font-size:12.5px; font-weight:600; cursor:pointer; }
.ai-link:hover { text-decoration:underline; }
.ai-context { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 18px; border-bottom:1px solid var(--line); background:var(--spruce-pale); color:var(--ink-2); font-size:12.5px; }
.ai-context[hidden] { display:none; }
.ai-context span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ai-context .ai-link { flex:0 0 auto; }
.ai-chat-panel .ai-chat-messages { flex:1; display:flex; flex-direction:column; gap:14px; padding:18px; overflow-y:auto; background:var(--paper); }
.ai-chat-panel .ai-chat-message { display:flex; max-width:100%; }
.ai-chat-panel .ai-chat-message.user { justify-content:flex-end; }
.ai-chat-panel .ai-chat-message .ai-chat-bubble { max-width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink); font-size:13.5px; line-height:1.55; }
.ai-chat-panel .ai-chat-message.user .ai-chat-bubble { max-width:85%; border-color:transparent; background:var(--spruce); color:var(--brand-ink); white-space:pre-wrap; }
.ai-chat-panel .ai-chat-message.agent .ai-chat-bubble { width:100%; }
.ai-answer p { margin:0 0 8px; }
.ai-answer p:last-child { margin-bottom:0; }
.ai-answer ol, .ai-answer ul { margin:4px 0 8px; padding-left:20px; }
.ai-answer li { margin:3px 0; }
.ai-answer code { padding:1px 4px; border-radius:4px; background:var(--surface-2); font:12px ui-monospace, Consolas, monospace; }
.ai-cite { display:inline-grid; place-items:center; min-width:17px; height:17px; margin:0 1px; padding:0 4px; border:0; border-radius:5px; background:var(--spruce-pale); color:var(--spruce); font-size:10.5px; font-weight:700; vertical-align:1px; cursor:pointer; }
.ai-cite:hover { background:var(--spruce); color:var(--brand-ink); }
.ai-draft-label { margin:0 0 6px; color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.ai-draft-text { padding:10px 12px; border-left:3px solid var(--spruce); border-radius:0 8px 8px 0; background:var(--surface-2); white-space:pre-wrap; }
.ai-draft-actions { display:flex; gap:8px; margin-top:10px; }
.ai-draft-actions button { margin:0; padding:7px 12px; font-size:12.5px; }
.ai-sources { margin-top:12px; padding-top:10px; border-top:1px solid var(--line); }
.ai-sources > p { margin:0 0 6px; color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.ai-sources ol { display:grid; gap:4px; margin:0; padding:0; list-style:none; }
.ai-sources details { margin-top:6px; }
.ai-sources summary { color:var(--muted); font-size:12px; cursor:pointer; }
.ai-sources details ol { margin-top:6px; }
.ai-source { display:flex; align-items:flex-start; gap:9px; width:100%; padding:6px 8px; border:1px solid transparent; border-radius:8px; background:none; color:var(--ink); text-align:left; cursor:pointer; }
.ai-source:hover { border-color:var(--line); background:var(--hover-bg); }
.ai-source-num { display:grid; flex:0 0 auto; place-items:center; width:20px; height:20px; margin-top:1px; border-radius:6px; background:var(--spruce-pale); color:var(--spruce); font-size:11px; font-weight:700; }
.ai-source-text { min-width:0; }
.ai-source-text small { display:block; color:var(--muted); font-size:11.5px; }
.ai-source-text b { display:block; overflow:hidden; font-size:12.5px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.ai-feedback { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-top:10px; color:var(--muted); font-size:12px; }
.ai-feedback > button { padding:3px 7px; border:1px solid var(--line); border-radius:7px; background:var(--surface); font-size:13px; line-height:1.2; cursor:pointer; filter:grayscale(1); opacity:.75; }
.ai-feedback > button:hover, .ai-feedback > button[aria-pressed="true"] { border-color:var(--spruce); filter:none; opacity:1; }
.ai-feedback > button[aria-pressed="true"] { background:var(--spruce-pale); }
.ai-feedback-note { display:flex; gap:6px; width:100%; }
.ai-feedback-note[hidden] { display:none; }
.ai-feedback-note input { flex:1; min-width:0; padding:6px 9px; border:1px solid var(--control-border); border-radius:7px; background:var(--surface); color:var(--ink); font-size:12.5px; }
.ai-feedback-note button { margin:0; padding:5px 10px; font-size:12px; }
.ai-thanks { width:100%; color:var(--good); }
.ai-error { border-color:color-mix(in srgb, var(--bad) 35%, var(--line)) !important; background:var(--bad-soft) !important; }
.ai-error button { display:block; margin:10px 0 0; }
.ai-thinking { display:flex; align-items:center; gap:4px; color:var(--muted); font-size:12.5px; }
.ai-thinking span { width:6px; height:6px; border-radius:50%; background:var(--spruce); animation:aiPulse 1s infinite ease-in-out; }
.ai-thinking span:nth-child(2) { animation-delay:.15s; }
.ai-thinking span:nth-child(3) { margin-right:6px; animation-delay:.3s; }
@keyframes aiPulse { 0%, 80%, 100% { opacity:.25; transform:scale(.8); } 40% { opacity:1; transform:scale(1); } }
.ai-welcome { display:grid; gap:10px; margin:auto 0; padding:6px 4px; color:var(--ink-2); font-size:13.5px; line-height:1.55; }
.ai-welcome p { margin:0; }
.ai-welcome .save-button { justify-self:start; margin:0; }
.ai-welcome-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:12px; background:var(--spruce-pale); color:var(--spruce); font-size:20px; }
.ai-prompts { display:grid; gap:6px; }
.ai-prompts button { padding:9px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); font-size:13px; text-align:left; cursor:pointer; }
.ai-prompts button:hover { border-color:var(--spruce); color:var(--spruce); }
.ai-muted { color:var(--muted); }
.ai-chat-panel .ai-chat-composer { display:flex; align-items:flex-end; gap:8px; padding:12px 14px 6px; border-top:1px solid var(--line); background:var(--surface); }
.ai-chat-panel .ai-chat-composer textarea { flex:1; min-height:40px; max-height:140px; padding:10px 12px; border:1px solid var(--control-border); border-radius:10px; background:var(--surface); color:var(--ink); font:13.5px/1.4 var(--font-ui); resize:none; }
.ai-chat-panel .ai-chat-composer textarea:focus { border-color:var(--spruce); outline:0; box-shadow:0 0 0 3px var(--control-focus); }
.ai-chat-panel .ai-chat-composer button { height:40px; padding:0 16px; border:0; border-radius:10px; background:var(--spruce); color:var(--brand-ink); font-weight:600; cursor:pointer; }
.ai-chat-panel .ai-chat-composer :disabled { cursor:not-allowed; opacity:.55; }
.ai-foot { margin:0; padding:0 16px 10px; background:var(--surface); color:var(--muted); font-size:11px; }

.ai-composer-wrap { position:relative; display:inline-block; }
.ai-composer-button { color:var(--spruce) !important; }
.ai-composer-menu { position:absolute; bottom:calc(100% + 6px); left:0; z-index:40; display:grid; width:270px; padding:6px; border:1px solid var(--line); border-radius:10px; background:var(--surface); box-shadow:var(--shadow-pop); }
.ai-composer-menu[hidden] { display:none; }
.ai-composer-menu button { display:grid; gap:1px; padding:8px 10px; border:0; border-radius:7px; background:none; color:var(--ink); text-align:left; cursor:pointer; }
.ai-composer-menu button:hover { background:var(--hover-bg); }
.ai-composer-menu b { font-size:13px; font-weight:600; }
.ai-composer-menu small { color:var(--muted); font-size:11.5px; }

.kb-suggestions { margin-bottom:18px; padding:16px 18px; border-color:color-mix(in srgb, var(--spruce) 30%, var(--line)); }
.kb-suggestions[hidden] { display:none; }
.kb-suggestions-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.kb-suggestions-head h2 { margin:0 0 3px; color:var(--ink); font-size:15px; font-weight:600; }
.kb-suggestions-head p { margin:0; color:var(--muted); font-size:12.5px; }
.kb-suggestions ul { display:grid; gap:0; margin:12px 0 0; padding:0; list-style:none; }
.kb-suggestions li { display:flex; align-items:center; gap:12px; padding:10px 0; border-top:1px solid var(--line); }
.kb-suggestions li > div { flex:1; min-width:0; }
.kb-suggestions li b { display:block; color:var(--ink); font-size:13.5px; font-weight:600; }
.kb-suggestions li small { color:var(--muted); font-size:12px; }
.kb-suggestions li .save-button, .kb-suggestions li .outline-button { margin:0; padding:7px 12px; font-size:12.5px; white-space:nowrap; }

.ai-settings-grid { display:grid; grid-template-columns:minmax(0, 1.25fr) minmax(0, 1fr); gap:16px; max-width:1180px; align-items:start; }
.ai-settings-card { display:grid; gap:14px; padding:20px; }
.ai-settings-title { display:flex; align-items:center; justify-content:space-between; }
.ai-settings-title h3 { margin:0; color:var(--ink); font-size:15px; font-weight:600; }
.ai-settings-card h4 { margin:4px 0 0; color:var(--ink-2); font-size:12.5px; font-weight:600; }
.ai-pill { padding:3px 10px; border-radius:999px; font-size:12px; font-weight:600; }
.ai-pill.ready { background:var(--good-soft); color:var(--good); }
.ai-pill.off { background:var(--surface-2); color:var(--muted); }
.ai-pill.setup { background:var(--saffron-pale, #fbf1d6); color:#7a5a12; }
.ai-settings-problem { margin:0; padding:9px 12px; border-radius:8px; background:var(--surface-2); color:var(--ink-2); font-size:13px; }
.ai-field { display:grid; gap:6px; color:var(--ink-2); font-size:12.5px; font-weight:600; }
.ai-field input, .ai-field select { padding:9px 11px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--ink); font:400 13px var(--font-ui); }
.ai-field input:focus { border-color:var(--spruce); outline:0; box-shadow:0 0 0 3px var(--control-focus); }
.ai-field small { color:var(--muted); font-weight:400; line-height:1.45; }
.ai-switch { display:flex; align-items:flex-start; gap:10px; cursor:pointer; }
.ai-switch input { width:17px; height:17px; margin:2px 0 0; accent-color:var(--spruce); }
.ai-switch b { display:block; color:var(--ink); font-size:13.5px; font-weight:600; }
.ai-switch small { color:var(--muted); font-size:12px; }
.ai-settings-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.ai-settings-actions button { margin:0; }
.ai-test-ok { color:var(--good); font-size:12.5px; font-weight:600; }
.ai-test-fail { color:var(--bad); font-size:12.5px; font-weight:600; }
.ai-privacy { margin:0; padding-top:12px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; line-height:1.5; }
.ai-stats { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; }
.ai-stats div { padding:10px; border-radius:9px; background:var(--surface-2); }
.ai-stats b { display:block; color:var(--ink); font-size:20px; font-weight:700; }
.ai-stats small { color:var(--muted); font-size:11.5px; }
.ai-top-sources, .ai-missed { display:grid; gap:6px; margin:0; padding:0; list-style:none; font-size:12.5px; }
.ai-top-sources li { display:flex; justify-content:space-between; color:var(--muted); }
.ai-missed li b { display:block; color:var(--ink); font-weight:500; }
.ai-missed li small { color:var(--muted); }
@media (max-width:980px) { .ai-settings-grid { grid-template-columns:minmax(0, 1fr); } }
@media (max-width:640px) { .ai-stats { grid-template-columns:repeat(2, 1fr); } .kb-suggestions li { flex-wrap:wrap; } }
.ai-settings-card p.ai-muted { margin:0; font-size:12.5px; line-height:1.45; }

/* ===== Outbound email (email-delivery.js) ===== */
.email-delivery-card { display:grid; gap:14px; max-width:1180px; margin-bottom:16px; padding:20px; }
.email-delivery-intro { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.email-delivery-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.email-delivery-wide { grid-column:1 / -1; }
.email-delivery-card .ai-settings-actions input { width:240px; padding:8px 10px; border:1px solid var(--control-border); border-radius:8px; background:var(--surface); color:var(--ink); font-size:13px; }
.email-delivery-steps { padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); font-size:13px; }
.email-delivery-steps summary { color:var(--ink); font-weight:600; cursor:pointer; }
.email-delivery-steps ol { margin:10px 0 0; padding-left:20px; color:var(--ink-2); line-height:1.6; }
.email-delivery-steps a { color:var(--spruce); }
.email-outbox-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:6px; }
.email-outbox-head h4 { margin:0; color:var(--ink); font-size:14px; font-weight:600; }
.email-outbox-head span { color:var(--muted); font-size:12.5px; }
.email-outbox td small { display:block; margin-top:2px; color:var(--muted); font-size:11.5px; }
.email-outbox td .ai-link { display:block; margin-top:4px; }
.email-status { display:inline-block; padding:2px 8px; border-radius:999px; font-size:11.5px; font-weight:600; white-space:nowrap; }
.email-status.sent { background:var(--good-soft); color:var(--good); }
.email-status.queued { background:var(--surface-2); color:var(--ink-2); }
.email-status.failed { background:var(--bad-soft); color:var(--bad); }
.email-outbox td small.email-error { max-width:320px; color:var(--bad); }

.notification-email-banner { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:14px; padding:11px 14px; border:1px solid #e3c577; border-radius:10px; background:var(--saffron-pale, #fbf1d6); color:var(--ink); font-size:13px; }
.notification-email-banner[hidden] { display:none; }
.notification-email-banner button { flex:0 0 auto; margin:0; }
[data-theme="dark"] .notification-email-banner { border-color:#6b5622; background:#2e2716; }
.notification-rules-panel td small { display:block; margin-top:2px; color:var(--muted); font-size:11.5px; }
.notification-rules-panel td small.notification-email-note { color:#8a6412; }
.notification-dynamic-recipient { border-bottom:1px dashed var(--line); }
.notification-dynamic-recipient b { color:var(--spruce); }
.notification-rule-modal label.is-disabled { opacity:.6; }
.notification-email-tools { display:grid; gap:10px; margin:-4px 0 12px; }
.notification-email-tools[hidden] { display:none; }
.notification-placeholders { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.notification-placeholders span { color:var(--muted); font-size:12px; font-weight:600; }
.notification-placeholders button { padding:3px 9px; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--spruce); font-size:12px; cursor:pointer; }
.notification-placeholders button:hover { border-color:var(--spruce); background:var(--spruce-pale); }
.notification-email-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.notification-email-actions button { margin:0; padding:6px 12px; font-size:12.5px; }
.notification-email-actions span { font-size:12.5px; }
.notification-email-preview { padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.notification-email-preview[hidden] { display:none; }
.notification-preview-meta { margin:0 0 6px; color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.notification-preview-subject { margin:0 0 8px; color:var(--ink); font-size:14px; font-weight:600; }
.notification-preview-body { color:var(--ink-2); font-size:13px; line-height:1.55; white-space:pre-wrap; }
@media (max-width:760px) { .email-delivery-grid { grid-template-columns:minmax(0, 1fr); } .notification-email-banner { flex-direction:column; align-items:flex-start; } }
.email-delivery-reply { margin:0; padding:9px 12px; border-radius:8px; background:var(--surface-2); color:var(--ink-2); font-size:12.5px; line-height:1.5; }

/* ===== Overview: open tickets by site (US map) ===== */
.ov-sites-card .ov-card-body { display:grid; gap:12px; }
.ov-map svg { display:block; width:100%; height:auto; overflow:visible; }
.ov-map-land { fill:var(--surface-2); stroke:var(--line-strong); stroke-width:1; stroke-linejoin:round; }
.ov-map-borders { fill:none; stroke:var(--line-strong); stroke-width:.8; stroke-linejoin:round; opacity:.8; }
.ov-map-site { cursor:pointer; outline:none; }
.ov-map-site circle { fill:var(--spruce); fill-opacity:.85; stroke:var(--surface); stroke-width:6; transition:fill-opacity .15s; }
.ov-map-site:hover circle, .ov-map-site:focus-visible circle { fill-opacity:1; stroke:var(--spruce-dark); }
.ov-map-site:focus-visible circle { stroke-width:10; }
.ov-map-site.is-empty { cursor:default; }
.ov-map-site.is-empty circle { fill:var(--muted); fill-opacity:.55; }
.ov-map-count { fill:var(--brand-ink); font:700 40px var(--font-ui); text-anchor:middle; pointer-events:none; }
.ov-map-land { stroke-width:1.5; }
.ov-map-borders { stroke-width:1.5; }
.ov-site-list { display:grid; gap:2px; margin:0; padding:0; list-style:none; }
.ov-site-row { display:grid; grid-template-columns:10px minmax(0, 1.3fr) minmax(60px, 1fr) 28px; align-items:center; gap:10px; width:100%; padding:6px 8px; border:0; border-radius:8px; background:none; color:var(--ink); text-align:left; cursor:pointer; }
.ov-site-row:hover:not(:disabled) { background:var(--hover-bg); }
.ov-site-row:disabled { cursor:default; }
.ov-site-dot { width:10px; height:10px; border-radius:50%; background:var(--spruce); }
.ov-site-dot.is-empty { background:var(--muted); opacity:.55; }
.ov-site-dot.is-other { background:var(--line-strong); }
.ov-site-name { min-width:0; }
.ov-site-name b { display:block; overflow:hidden; font-size:13px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.ov-site-name small { display:block; overflow:hidden; color:var(--muted); font-size:11.5px; text-overflow:ellipsis; white-space:nowrap; }
.ov-site-count { color:var(--ink); font-size:13px; font-weight:700; text-align:right; font-variant-numeric:tabular-nums; }

/* Admin Settings > Ticket reopening */
.reopen-thanks-row { display:grid; gap:8px; padding:14px 0; border-bottom:1px solid var(--line); }
.reopen-thanks-row b { color:var(--ink); font-size:13px; }
.reopen-thanks-row > small { color:var(--muted); font-size:12px; line-height:1.5; }
.reopen-phrases { display:grid; gap:6px; margin-top:4px; color:var(--ink); font-size:12.5px; font-weight:600; }
.reopen-phrases[hidden] { display:none; }
.reopen-phrases textarea { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-weight:400; resize:vertical; }
.reopen-thanks-row .nt-link { justify-self:start; }
.reopen-tester { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:8px 10px; align-items:end; padding:14px 0; }
.reopen-tester label { display:grid; gap:6px; color:var(--ink); font-size:12.5px; font-weight:600; }
.reopen-tester input { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-weight:400; }
.reopen-tester p { grid-column:1 / -1; margin:0; min-height:1.2em; }
.portal-reply-note { margin:14px 0 6px; color:var(--muted); font-size:12.5px; }
.portal-reply-note.locked { padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--surface-2); color:var(--ink); }
#portalReplyField[hidden], #sendPortalTicketReply[hidden] { display:none !important; }
.reopen-examples { display:grid; gap:6px; padding:14px 0; border-bottom:1px solid var(--line); }
.reopen-examples b { color:var(--ink); font-size:13px; }
.reopen-examples small { color:var(--muted); font-size:12px; }
.reopen-examples table { width:100%; margin-top:4px; font-size:12.5px; }
.reopen-examples td { vertical-align:top; }
.reopen-examples td:first-child { color:var(--ink); font-weight:500; }
.reopen-examples td:last-child { color:var(--muted); }
.reopen-result { display:inline-block; padding:2px 8px; border-radius:999px; background:var(--hover-bg-subtle); color:var(--muted); font-size:11.5px; font-weight:600; white-space:nowrap; }
.reopen-result.stays { background:var(--spruce-pale); color:var(--spruce-dark); }
.reopen-result.reopens { background:var(--terra-pale); color:var(--terra); }

/* Admin Settings > Account: editable account name */
.account-name-body { flex:1; min-width:0; }
.account-name-body .nt-link { margin-top:8px; }
.account-name-form { display:grid; gap:8px; max-width:420px; }
.account-name-form[hidden], #editAccountNameButton[hidden], #accountNameDisplay[hidden] { display:none; }
.account-name-form input { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:600 15px var(--font-ui); }
.account-name-actions { display:flex; gap:8px; }

/* Audit log > Access review and Sensitive changes */
.al-intro { padding:16px 20px; margin-bottom:14px; }
.al-intro > p { margin:0 0 12px; color:var(--muted); font-size:13px; line-height:1.55; max-width:900px; }
.al-review-controls { display:flex; flex-wrap:wrap; gap:10px 12px; align-items:flex-end; }
.al-review-controls label { display:grid; gap:4px; color:var(--muted); font-size:12px; font-weight:600; }
.al-review-controls input, .al-review-controls select { padding:7px 9px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; }
.al-last-signoff { margin:12px 0 0 !important; color:var(--ink) !important; font-weight:600; }
.al-static tbody tr { cursor:default; }
.al-static td { vertical-align:top; }
.al-sub { display:block; margin-top:2px; color:var(--muted); font-size:11.5px; }
.al-granted { color:var(--spruce-dark); }
.al-removed { color:var(--terra); }
.al-pill { display:inline-block; margin:0 2px 3px 0; padding:1px 7px; border-radius:999px; background:var(--hover-bg-subtle); border:1px solid var(--line); font-size:11.5px; white-space:nowrap; }
.al-flag { display:inline-block; margin:0 2px 3px 0; padding:1px 7px; border-radius:999px; background:var(--terra-pale); color:var(--terra); font-size:11.5px; font-weight:600; white-space:nowrap; }
.al-flagged td:first-child { box-shadow:inset 3px 0 0 var(--terra); }
.al-warning { border-color:color-mix(in srgb, var(--terra) 45%, var(--line)); }
.al-warning h2 { color:var(--terra); }
.al-signoff-form { display:grid; gap:10px; max-width:640px; margin-bottom:16px; }
.al-signoff-form label:not(.wf-check) { display:grid; gap:6px; font-size:12.5px; font-weight:600; }
.al-signoff-form textarea { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; resize:vertical; }
.al-signoff-form .save-button { justify-self:start; }
.al-categories { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:8px; margin-bottom:12px; }
.al-category { display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); text-align:left; }
.al-category b { font:600 20px/1.1 var(--font-ui); font-variant-numeric:tabular-nums; }
.al-category span { color:var(--muted); font-size:11.5px; line-height:1.35; }
.al-category.active { border-color:var(--spruce); box-shadow:inset 0 0 0 1px var(--spruce); }
.rp-card + .rp-card, .al-warning { margin-top:14px; }
.rp-card h2 { margin:0 0 4px; font-size:15px; }
.al-anchor-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(340px, 1fr)); gap:14px; margin:14px 0; }
.al-anchor-card { padding:16px 20px; }
.al-anchor-card h2 { margin:0 0 4px; font-size:15px; }
.al-fingerprint-form, .al-anchor-form { display:flex; flex-wrap:wrap; gap:10px 12px; align-items:flex-end; margin:10px 0; }
.al-fingerprint-form label, .al-anchor-form label:not(.wf-check) { display:grid; gap:4px; color:var(--muted); font-size:12px; font-weight:600; }
.al-fingerprint-form input, .al-anchor-form input:not([type="checkbox"]), .al-anchor-form select { padding:7px 9px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; }
.al-fingerprint-form label:first-child input { width:110px; }
.al-fingerprint-hash { flex:1; min-width:220px; }
.al-fingerprint-hash input { width:100%; font-family:Consolas, monospace !important; }
.al-anchor-form label:nth-of-type(2) { flex:1; min-width:240px; }
.al-anchor-form label:nth-of-type(2) input { width:100%; }
.al-anchor-form small { font-weight:400; }
.al-anchor-form .wf-check { flex-basis:100%; color:var(--ink); font-size:13px; }
.al-anchor-actions { display:flex; gap:8px; }
.al-anchor-warning { margin:8px 0; padding:8px 12px; border-radius:8px; background:var(--saffron-pale); color:var(--ink); font-size:12.5px; }
#alFingerprintResult { margin:0; font-size:13px; line-height:1.5; }
.al-anchor-card .rp-table { font-size:12px; }
.al-anchor-card .rp-table th, .al-anchor-card .rp-table td { padding:7px 8px; white-space:normal; }
.al-anchor-card .rp-table .al-sub { overflow-wrap:anywhere; }

/* Time tracking */
.composer-time { display:inline-flex; align-items:center; gap:5px; margin-left:0; padding:0 8px; height:32px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--muted); }
.composer-time:focus-within { border-color:var(--spruce); box-shadow:0 0 0 3px var(--control-focus); }
.composer-time input { width:58px; border:0; outline:0; background:transparent; color:var(--ink); font:inherit; font-size:12.5px; padding:0; }
.composer-time + .post-button { margin-left:0; }
.comment-time { white-space:nowrap; }
.ticket-time-total { display:flex; align-items:baseline; gap:8px; margin:2px 0 8px; }
.ticket-time-total b { font:600 22px/1.1 var(--font-ui); font-variant-numeric:tabular-nums; color:var(--ink); }
.ticket-time-total span { color:var(--muted); font-size:12px; }
.ticket-time-people { list-style:none; margin:0 0 10px; padding:0; display:grid; gap:4px; font-size:12.5px; }
.ticket-time-people li { display:flex; justify-content:space-between; gap:8px; }
.ticket-time-people b { font-weight:600; font-variant-numeric:tabular-nums; }
#ticketTimeCard .outline-button { width:100%; }
.resolution-time { display:grid; gap:4px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; }
.resolution-time.nudge { border-color:color-mix(in srgb, var(--saffron) 55%, var(--line)); background:var(--saffron-pale); }
.resolution-time p { margin:0; }

/* Reports > Scheduled emails */
.rs-when { display:grid; grid-template-columns:repeat(auto-fit, minmax(130px, 1fr)); gap:10px; }
.rs-when label[hidden] { display:none !important; }
.rs-people { margin:0; padding:10px 12px; border:1px solid var(--line); border-radius:10px; display:grid; gap:8px; }
.rs-people legend { padding:0 4px; font-size:12.5px; font-weight:600; }
.rs-people-list { display:grid; gap:4px; max-height:200px; overflow:auto; }
.rs-people-list label[hidden] { display:none !important; }
.rs-people-list small { color:var(--muted); font-weight:400; }
.rs-people > small { color:var(--muted); font-size:11.5px; }
.rp-schedule-actions { white-space:nowrap; }
.rp-schedule-actions .nt-link + .nt-link { margin-left:10px; }

/* Ticket quality reviews */
.perf-review-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(360px, 1fr)); gap:14px; margin-bottom:14px; }
.perf-review-bars { list-style:none; margin:4px 0 0; padding:0; display:grid; gap:9px; font-size:12.5px; }
.perf-review-bars li { display:grid; grid-template-columns:minmax(0, 190px) 1fr 64px; gap:10px; align-items:center; }
.perf-review-bars i { display:block; height:8px; border-radius:99px; background:var(--hover-bg-subtle); overflow:hidden; }
.perf-review-bars b { display:block; height:100%; background:var(--terra); border-radius:99px; }
.perf-review-bars em { color:var(--muted); font-style:normal; text-align:right; }
.rp-num.good, b.good { color:var(--spruce-dark); }
.rp-num.ok, b.ok { color:var(--saffron); }
.rp-num.bad, b.bad { color:var(--terra); }
.ticket-review-modal { max-width:640px; }
.tr-resolution { padding:10px 12px; border:1px solid var(--line); border-radius:10px; font-size:12.5px; }
.tr-resolution dl { display:flex; flex-wrap:wrap; gap:6px 18px; margin:0 0 6px; }
.tr-resolution dt { color:var(--muted); font-size:11px; }
.tr-resolution dd { margin:0; font-weight:600; }
.tr-resolution p { margin:0 0 6px; white-space:pre-wrap; }
.tr-criteria { display:grid; gap:8px; }
.tr-item { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:10px; align-items:center; margin:0; padding:8px 10px; border:1px solid var(--line); border-radius:10px; }
.tr-item legend { float:left; padding:0; display:grid; gap:2px; font-size:13px; }
.tr-item legend small { color:var(--muted); font-size:11.5px; font-weight:400; }
.tr-choices { display:flex; gap:4px; }
.tr-choice { display:inline-flex !important; align-items:center; gap:5px; padding:5px 9px; border:1px solid var(--line); border-radius:8px; font-size:12px; font-weight:500 !important; cursor:pointer; white-space:nowrap; }
.tr-choice input { width:auto !important; margin:0 !important; }
.tr-choice.meets:has(input:checked) { border-color:var(--spruce); background:var(--spruce-pale); }
.tr-choice.needs-work:has(input:checked) { border-color:var(--terra); background:var(--terra-pale); }
.tr-choice.na:has(input:checked) { background:var(--hover-bg-subtle); }
.tr-actions { display:flex; gap:8px; justify-content:flex-end; }
#ticketReviewCard .outline-button { width:100%; }
@media (max-width:560px) { .tr-item { grid-template-columns:1fr; } .perf-review-bars li { grid-template-columns:1fr 60px; } .perf-review-bars i { grid-column:1 / -1; } }

/* Admin Settings > Roles & Permissions (modules) */
.role-note { margin:0 0 12px; padding:9px 12px; border-radius:8px; background:var(--hover-bg-subtle); border:1px solid var(--line); font-size:12.5px; }
.role-toolbar { display:flex; flex-wrap:wrap; gap:8px 14px; align-items:flex-end; margin-bottom:12px; }
.role-toolbar label { display:grid; gap:4px; color:var(--muted); font-size:12px; font-weight:600; }
.role-toolbar select { min-width:200px; }
.role-compare-legend { color:var(--muted); font-size:12px; }
.role-section { margin-top:14px; }
.role-section h3 { margin:0 0 2px; font-size:14px; }
.role-section > .wf-hint { margin:0 0 8px; }
.role-row { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:4px 14px; align-items:center; padding:10px 0; border-bottom:1px solid var(--line); }
.role-row:last-of-type { border-bottom:0; }
.role-row-name b { display:block; font-size:13px; }
.role-row-name small { display:block; margin-top:2px; color:var(--muted); font-size:11.5px; line-height:1.4; }
.role-row-name .role-row-warning { color:var(--saffron); }
.role-row-level { display:flex; gap:8px; align-items:center; }
.role-row-level select { min-width:130px; padding:6px 8px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:12.5px; }
.role-compare-level { min-width:90px; padding:3px 8px; border-radius:999px; background:var(--hover-bg-subtle); color:var(--muted); font-size:11.5px; text-align:center; }
.role-compare-level.differs { background:var(--saffron-pale); color:var(--ink); font-weight:600; }
.role-row-differs { box-shadow:inset 3px 0 0 var(--saffron); padding-left:8px; }
.role-fine-tune { grid-column:1 / -1; font-size:12.5px; }
.role-fine-tune summary { cursor:pointer; color:var(--spruce); font-size:12px; width:max-content; }
.role-fine-grid { display:grid; gap:8px; margin-top:8px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; }
.role-fine-grid > div { display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; }
.role-fine-grid b { min-width:120px; font-size:12px; }
.role-fine-grid label { display:inline-flex; gap:5px; align-items:center; font-size:12px; }
.role-members { display:flex; flex-wrap:wrap; gap:6px; margin:4px 0 8px; padding:0; list-style:none; }
.role-members li { padding:3px 9px; border:1px solid var(--line); border-radius:999px; font-size:12px; }
.role-member-count { color:var(--muted); }
@media (max-width:640px) { .role-row { grid-template-columns:1fr; } }
#rolesSettingsPanel .role-permission-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
#rolesSettingsPanel .role-permission-actions button { white-space:nowrap; }

/* People > Notifications tab */
.people-note-top { margin:4px 0 12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; }
.people-note-top h3 { margin:0 0 6px; font-size:13px; }
.people-note-top ul { list-style:none; margin:0; padding:0; display:grid; gap:4px; }
.people-note-top li { display:grid; grid-template-columns:minmax(0, 1fr) auto 40px; gap:10px; align-items:center; font-size:12.5px; }
.people-note-top em { color:var(--muted); font-style:normal; font-size:11.5px; }
.people-note-top b { text-align:right; font-variant-numeric:tabular-nums; }
.people-note-toolbar { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; align-items:center; margin-bottom:6px; }
.people-note-kind { min-width:82px; padding:2px 8px; border-radius:999px; background:var(--hover-bg-subtle); border:1px solid var(--line); color:var(--muted); font-size:11px; font-weight:600; text-align:center; }
.note-email .people-note-kind { color:var(--spruce-dark); }
.note-in-app .people-note-kind { color:var(--saffron); }
.people-note-source { display:block !important; margin-top:2px; color:var(--spruce) !important; }
.people-note-status { font-size:11.5px; color:var(--muted); white-space:nowrap; }
.people-note-status.status-failed { color:var(--terra); font-weight:600; }
.people-note-status.status-queued { color:var(--saffron); }
.people-note-row[data-no-source] { cursor:default; }

/* CMDB */
.cmdb-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.cmdb-layout { display:grid; grid-template-columns:260px minmax(0, 1fr); gap:14px; align-items:start; }
.cmdb-types { padding:10px 8px; max-height:calc(100vh - 220px); overflow:auto; position:sticky; top:12px; }
.cmdb-types ul { list-style:none; margin:0; padding:0; }
.cmdb-type { display:flex; width:100%; justify-content:space-between; align-items:center; gap:8px; padding:6px 8px; border:0; border-radius:7px; background:none; color:var(--ink); font:inherit; font-size:12.5px; text-align:left; cursor:pointer; }
.cmdb-type:hover { background:var(--hover-bg); }
.cmdb-type.active { background:var(--spruce-pale); color:var(--spruce-dark); font-weight:600; }
.cmdb-type em { color:var(--muted); font-style:normal; font-size:11.5px; font-variant-numeric:tabular-nums; }
.cmdb-list { padding:14px 16px; min-width:0; }
.cmdb-toolbar { display:flex; flex-wrap:wrap; gap:8px; }
.cmdb-toolbar input[type="search"] { flex:1; min-width:240px; }
.cmdb-toolbar input, .cmdb-toolbar select { padding:7px 9px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; }
.cmdb-table td { vertical-align:top; }
.cmdb-sort { border:0; background:none; padding:0; color:inherit; font:inherit; text-transform:inherit; letter-spacing:inherit; cursor:pointer; }
.cmdb-sort.active { color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.cmdb-status { display:inline-block; padding:1px 8px; border-radius:999px; background:var(--hover-bg-subtle); border:1px solid var(--line); font-size:11.5px; font-weight:600; white-space:nowrap; }
.cmdb-status.status-deployed { background:var(--spruce-pale); color:var(--spruce-dark); border-color:transparent; }
.cmdb-status.status-in-maintenance, .cmdb-status.status-ordered { background:var(--saffron-pale); border-color:transparent; }
.cmdb-status.status-retired, .cmdb-status.status-disposed { color:var(--muted); }
.cmdb-op { font-size:11.5px; font-weight:600; }
.cmdb-op-degraded { color:var(--saffron); }
.cmdb-op-down { color:var(--terra); }
.cmdb-head { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; align-items:flex-start; margin:6px 0 12px; }
.cmdb-head h1 { margin:2px 0 6px; font-size:24px; }
.cmdb-head p { margin:0; display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:12.5px; }
.cmdb-crumbs { color:var(--muted); font-size:12px; }
.cmdb-detail { padding:16px 20px; }
.cmdb-field-group { margin-bottom:18px; }
.cmdb-field-group h3 { margin:0 0 8px; font-size:13.5px; }
.cmdb-field-group dl { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:10px 18px; margin:0; }
.cmdb-field-group dt { color:var(--muted); font-size:11.5px; }
.cmdb-field-group dd { margin:2px 0 0; font-size:13px; overflow-wrap:anywhere; }
.cmdb-links { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.cmdb-links li { display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; padding:6px 0; border-bottom:1px solid var(--line); }
.cmdb-links small { color:var(--muted); font-size:11.5px; }
.cmdb-links .rp-danger { margin-left:auto; }
.cmdb-add-link { display:flex; flex-wrap:wrap; gap:8px 10px; align-items:flex-end; margin-bottom:12px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.cmdb-add-link label { display:grid; gap:4px; color:var(--muted); font-size:12px; font-weight:600; }
.cmdb-add-link select, .cmdb-add-link input { padding:7px 9px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; }
.cmdb-link-target { flex:1; min-width:220px; }
.cmdb-history { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.cmdb-history li { padding-bottom:10px; border-bottom:1px solid var(--line); font-size:13px; }
.cmdb-form { padding:16px 20px; display:grid; gap:14px; }
.cmdb-form fieldset { margin:0; padding:10px 12px 12px; border:1px solid var(--line); border-radius:10px; }
.cmdb-form legend { padding:0 4px; font-weight:600; font-size:13px; }
.cmdb-form-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:10px 14px; }
.cmdb-form-grid label, .cmdb-type-field { display:grid; gap:4px; color:var(--muted); font-size:12px; font-weight:600; }
.cmdb-form-grid small { font-weight:400; }
.cmdb-form-grid input, .cmdb-form-grid select, .cmdb-form-grid textarea, .cmdb-type-field select { padding:7px 9px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; font-weight:400; }
.cmdb-wide { grid-column:1 / -1; }
.cmdb-type-field { max-width:420px; }
.cmdb-form-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; margin-top:10px; }
.cmdb-import-modal { max-width:980px; width:min(980px, calc(100vw - 32px)); }
.cmdb-steps { display:flex; gap:6px; list-style:none; margin:4px 0 12px; padding:0; counter-reset:step; }
.cmdb-steps li { flex:1; padding:6px 8px; border-radius:8px; background:var(--hover-bg-subtle); color:var(--muted); font-size:12px; font-weight:600; counter-increment:step; }
.cmdb-steps li::before { content:counter(step) ". "; }
.cmdb-steps li.active { background:var(--spruce-pale); color:var(--spruce-dark); }
.cmdb-steps li.done { color:var(--ink); }
.cmdb-file input { padding:10px; border:1px dashed var(--line); border-radius:10px; width:100%; }
.cmdb-source { display:grid; gap:6px; margin:10px 0; padding:10px 12px; border:1px solid var(--line); border-radius:10px; }
.cmdb-source legend { padding:0 4px; font-size:12.5px; font-weight:600; }
.cmdb-source small { color:var(--muted); font-size:11.5px; }
.cmdb-mapping, .cmdb-preview { max-height:52vh; overflow:auto; }
.cmdb-mapping select { min-width:220px; }
.cmdb-result { display:inline-block; padding:1px 8px; border-radius:999px; font-size:11.5px; font-weight:600; white-space:nowrap; background:var(--hover-bg-subtle); }
.cmdb-result-create { background:var(--spruce-pale); color:var(--spruce-dark); }
.cmdb-result-update { background:var(--saffron-pale); color:var(--ink); }
.cmdb-result-conflict, .cmdb-result-error { background:var(--terra-pale); color:var(--terra); }
.cmdb-problem { color:var(--saffron) !important; }
.cmdb-setup-body { padding:16px 20px; }
.cmdb-setup-layout { display:grid; grid-template-columns:260px minmax(0, 1fr); gap:18px; align-items:start; }
.cmdb-setup-tree { position:static; max-height:none; padding:0; }
.cmdb-setup-tree ul ul { padding-left:12px; }
.cmdb-type-form h3 { margin:14px 0 6px; font-size:13.5px; }
.cmdb-field-table input:not([type="checkbox"]), .cmdb-field-table select { width:100%; min-width:90px; padding:5px 7px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); font:inherit; font-size:12.5px; }
.cmdb-rule-list { margin:8px 0; padding-left:20px; display:grid; gap:6px; }
.cmdb-rule-list li { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:6px 0; border-bottom:1px solid var(--line); font-size:13px; }
.cmdb-rule-list li .nt-link + .nt-link { margin-left:10px; }
@media (max-width:900px) { .cmdb-layout, .cmdb-setup-layout { grid-template-columns:1fr; } .cmdb-types { position:static; max-height:260px; } }
.cmdb-view > .page-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.cmdb-view > .page-heading .cmdb-actions { flex-wrap:nowrap; flex-shrink:0; }
.cmdb-toolbar { align-items:center; }
.cmdb-toolbar .custom-select-wrapper { flex:0 1 170px; width:auto; min-width:140px; }
.cmdb-add-link .custom-select-wrapper { width:auto; min-width:170px; }
@media (max-width:760px) { .cmdb-view > .page-heading { flex-direction:column; } .cmdb-view > .page-heading .cmdb-actions { flex-wrap:wrap; } }
.cmdb-field-table select, .cmdb-field-table .custom-select-wrapper { min-width:130px; }
.cmdb-field-table td:first-child input { min-width:150px; }

/* CMDB phase 2: CIs linked from tickets, problems, changes, People, and the portal */
.ci-links h3 { display:flex; align-items:center; gap:6px; margin:0 0 6px; font-size:14px; }
.ci-link-list { list-style:none; margin:0 0 8px; padding:0; display:grid; gap:4px; }
.ci-link-list li { display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:6px; padding:6px 8px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.ci-link-list li small { grid-column:1; color:var(--muted); font-size:12px; }
.ci-link-list .nt-link { justify-self:start; text-align:left; }
.ci-remove { grid-column:2; grid-row:1 / span 2; border:0; background:none; color:var(--muted); font-size:18px; cursor:pointer; padding:0 4px; }
.ci-remove:hover { color:var(--terra); }
.ci-none { margin:0 0 8px; }
.ci-impact { margin:6px 0 8px; padding:8px 10px; border-radius:8px; background:var(--saffron-pale); font-size:13px; line-height:1.45; }
.ci-impact-none { background:var(--hover-bg-subtle); color:var(--muted); }
.ci-impact-services, .ci-suggest { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; align-items:center; }
.ci-suggest > span { font-size:12px; color:var(--muted); }
.ci-chip { border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; padding:2px 9px; font-size:12px; cursor:pointer; }
.ci-chip:hover { border-color:var(--spruce); }
.ci-chip-service { border-color:var(--saffron); }
.ci-add { display:flex; gap:6px; margin-top:8px; }
.ci-add input { flex:1; min-width:0; }
.ci-conflicts { margin:6px 0 8px; padding:8px 10px; border-radius:8px; background:var(--terra-pale); font-size:13px; }
.ci-conflicts ul { margin:6px 0 0; padding-left:16px; }
.ci-conflicts small { display:block; color:var(--muted); }
.problem-ci-links { margin:16px 0; padding-top:12px; border-top:1px solid var(--line); }
.cmdb-impact-tree, .cmdb-record-list { list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.cmdb-impact-tree li, .cmdb-record-list li { display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; padding:6px 0; border-bottom:1px solid var(--line); }
.cmdb-impact-tree small, .cmdb-record-list small { color:var(--muted); font-size:12px; }
.requester-devices { margin-top:18px; padding:18px; }
.requester-devices-head h2 { margin:0 0 4px; }
.requester-devices-head p { margin:0 0 12px; color:var(--muted); }
.requester-device-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:10px; }
.requester-device { display:grid; gap:6px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.requester-device small { color:var(--muted); }
.requester-device button { justify-self:start; }

/* Change form: which clock the planned times are on */
.change-zone-hint { margin:-4px 0 0; font-size:12.5px; color:var(--muted); }

/* CMDB phase 3: live health, the service health board, and the dependency map */
.ci-health { display:inline-flex; align-items:center; gap:5px; padding:2px 9px; border-radius:999px; font-size:12px; font-weight:600; background:var(--spruce-pale); color:var(--spruce-dark); white-space:nowrap; }
.ci-health i { width:7px; height:7px; border-radius:50%; background:currentColor; }
.ci-health-degraded { background:var(--saffron-pale); color:var(--ink); }
.ci-health-degraded i { background:var(--saffron); }
.ci-health-down { background:var(--terra-pale); color:var(--terra); }
.ci-dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px; vertical-align:1px; }
.ci-dot-degraded { background:var(--saffron); }
.ci-dot-down { background:var(--terra); }
.cmdb-mode { margin:4px 0 14px; }
.svc-count-down { color:var(--terra); }
.svc-count-degraded { color:var(--saffron); }
.svc-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:12px; }
.svc-card { display:grid; gap:8px; padding:14px 16px; border:1px solid var(--line); border-left:5px solid var(--spruce); border-radius:12px; background:var(--surface); cursor:pointer; }
.svc-card:hover, .svc-card:focus-visible { border-color:var(--spruce); outline:none; box-shadow:var(--shadow); }
.svc-card.svc-degraded { border-left-color:var(--saffron); }
.svc-card.svc-down { border-left-color:var(--terra); }
.svc-card header { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.svc-card header b { display:block; font-size:15px; }
.svc-card header small { color:var(--muted); font-size:12px; }
.svc-reason { margin:0; font-size:13px; line-height:1.5; }
.svc-reason.svc-ok { color:var(--muted); }
.svc-card footer { display:flex; flex-wrap:wrap; gap:4px 12px; font-size:12px; color:var(--muted); }
.svc-card footer .svc-hot { color:var(--ink); font-weight:600; }
.cmdb-map-bar { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-bottom:10px; }
.cmdb-map-controls { display:inline-flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.cmdb-map-controls button { border:0; border-right:1px solid var(--line); background:var(--surface); color:var(--ink); padding:5px 10px; font-size:12.5px; cursor:pointer; }
.cmdb-map-controls button:last-child { border-right:0; }
.cmdb-map-controls button[aria-pressed="true"] { background:var(--spruce-pale); color:var(--spruce-dark); font-weight:600; }
.cmdb-map-toggle { display:inline-flex; align-items:center; gap:6px; font-size:13px; }
.cmdb-map-scroll { overflow:auto; max-height:70vh; border:1px solid var(--line); border-radius:10px; background:var(--hover-bg-subtle); padding:2px; }
.cmdb-map-svg { display:block; margin:0 auto; }
.map-edge { fill:none; stroke:var(--muted); stroke-width:1.6; opacity:.75; }
.map-edge-soft { stroke-dasharray:5 4; opacity:.5; }
.map-edge-hot { stroke-width:2.6; opacity:1; }
.map-edge-down { stroke:var(--terra); }
.map-edge-degraded { stroke:var(--saffron); }
.map-node { cursor:pointer; }
.map-box { fill:var(--surface); stroke:var(--line); stroke-width:1.2; }
.map-node:hover .map-box, .map-node:focus-visible .map-box { stroke:var(--spruce); stroke-width:2; }
.map-node:focus { outline:none; }
.map-focus .map-box { stroke:var(--ink); stroke-width:2.4; }
.map-retired { opacity:.5; }
.map-name { font-size:13px; font-weight:600; fill:var(--ink); }
.map-type { font-size:11.5px; fill:var(--muted); }
.cmdb-map-legend { display:flex; flex-wrap:wrap; gap:6px 16px; margin:10px 0 0; font-size:12px; color:var(--muted); }
.cmdb-map-legend span { display:inline-flex; align-items:center; gap:6px; }
.cmdb-map-legend i { display:inline-block; width:12px; height:12px; border-radius:3px; }
.cmdb-map-legend .lg-ok { background:var(--spruce); }
.cmdb-map-legend .lg-degraded { background:var(--saffron); }
.cmdb-map-legend .lg-down { background:var(--terra); }
.cmdb-map-legend .lg-line { height:0; border-top:2px solid var(--muted); border-radius:0; width:18px; }
.cmdb-map-legend .lg-soft { height:0; border-top:2px dashed var(--muted); border-radius:0; width:18px; }
.ci-known { margin:8px 0; padding:8px 10px; border-radius:8px; background:var(--terra-pale); font-size:13px; }
.ci-known p { margin:0 0 4px; line-height:1.45; }
.ci-known p:last-child { margin:0; }
.ci-known-link { margin-left:4px; padding:2px 8px; font-size:12px; }

/* CMDB redundancy groups */
.cmdb-group { padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); margin:0 0 8px; }
.cmdb-group-head { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; }
.cmdb-group-head .nt-link { margin-left:auto; }
.cmdb-group .wf-hint { margin:6px 0 0; }
.cmdb-suggestion { margin:8px 0; padding:10px 12px; border:1px dashed var(--saffron); border-radius:10px; background:var(--saffron-pale); font-size:13px; }
.cmdb-suggestion p { margin:0 0 6px; line-height:1.45; }
.cmdb-suggestion-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.cmdb-setup-sub { display:flex; align-items:center; gap:6px; margin:18px 0 8px; font-size:15px; }
.cmdb-redundancy-form { display:grid; gap:12px; max-width:640px; }
.cmdb-redundancy-form label { display:grid; gap:4px; font-weight:600; font-size:13px; }
.cmdb-redundancy-form label input, .cmdb-redundancy-form label textarea { font-weight:400; }
.cmdb-redundancy-form label input[type="number"] { max-width:120px; }
.cmdb-redundancy-members > span { font-weight:600; font-size:13px; display:block; margin-bottom:4px; }

/* CMDB phase 4: assets, contracts, licences, stock, refresh forecast */
.asset-kpis { grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); }
.asset-alerts { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.asset-alert { display:grid; grid-template-columns:10px 1fr auto; gap:12px; align-items:start; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.asset-alert > i { width:10px; height:10px; border-radius:50%; margin-top:5px; background:var(--muted); }
.asset-high > i { background:var(--terra); }
.asset-medium > i { background:var(--saffron); }
.asset-alert b { display:block; font-size:14px; }
.asset-alert small { display:block; color:var(--muted); font-size:12.5px; margin-top:2px; line-height:1.4; }
.asset-when { text-align:right; font-size:13px; white-space:nowrap; }
.asset-when small { display:block; color:var(--muted); font-size:12px; }
.asset-table td { vertical-align:top; }
.asset-table tr[data-asset-contract] { cursor:pointer; }
.asset-table tr[data-asset-contract]:hover { background:var(--hover-bg-subtle); }
.asset-neg { color:var(--terra); font-weight:600; }
.asset-chip { display:inline-block; padding:2px 8px; border-radius:999px; font-size:12px; font-weight:600; background:var(--hover-bg); white-space:nowrap; }
.asset-chip.svc-ok { background:var(--spruce-pale); color:var(--spruce-dark); }
.asset-chip.svc-degraded { background:var(--saffron-pale); color:var(--ink); }
.asset-chip.svc-down { background:var(--terra-pale); color:var(--terra); }
.asset-two { display:grid; grid-template-columns:minmax(0, 3fr) minmax(0, 2fr); gap:18px; }
.asset-two h3 { margin:0 0 8px; font-size:15px; }
@media (max-width: 860px) { .asset-two { grid-template-columns:1fr; } .asset-alert { grid-template-columns:10px 1fr; } .asset-when { grid-column:2; text-align:left; } }
.asset-stock-rules { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.asset-stock-rules li { display:flex; justify-content:space-between; gap:10px; padding:8px 10px; border:1px solid var(--line); border-left:4px solid var(--spruce); border-radius:8px; font-size:13px; }
.asset-stock-rules li.asset-below { border-left-color:var(--terra); }
.asset-forecast { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:10px; align-items:end; margin:10px 0 16px; }
.asset-bar { position:relative; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:2px; height:190px; padding:8px 6px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); cursor:pointer; overflow:hidden; }
.asset-bar-fill { position:absolute; left:0; right:0; bottom:0; background:var(--spruce-pale); z-index:0; }
.asset-bar-overdue .asset-bar-fill { background:var(--terra-pale); }
.asset-bar > b, .asset-bar > small { position:relative; z-index:1; }
.asset-bar > b { font-size:22px; }
.asset-bar > small { font-size:12px; color:var(--muted); text-align:center; }
.asset-bar.active { border-color:var(--spruce); box-shadow:0 0 0 2px var(--spruce-pale); }
.asset-contract-form { display:grid; gap:14px; }
.asset-contract-form h2 { margin:0; }
.asset-form-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:12px; }
.asset-contract-form label, .asset-form-grid label { display:grid; gap:4px; font-size:13px; font-weight:600; }
.asset-contract-form label input, .asset-contract-form label select, .asset-contract-form label textarea { font-weight:400; }
.asset-renew { align-self:end; display:flex !important; align-items:center; gap:8px; }
.asset-covers h3 { display:flex; gap:6px; align-items:center; margin:0 0 6px; font-size:14px; }
.asset-covers .ci-chip { display:inline-flex; align-items:center; gap:2px; cursor:default; }
.asset-covers .ci-chip .ci-remove { font-size:15px; padding:0 2px; }
.asset-bulk { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:8px; font-size:13px; }
.asset-bulk input { width:160px; }
.asset-life-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:6px 18px; }
.asset-life-grid label { display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:13px; }
.asset-life-grid input { width:90px; }

/* CMDB phase 5: data quality, merge, attestations */
.quality-checks { display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px; margin:0 0 18px; }
.quality-check { display:grid; gap:2px; text-align:left; padding:12px 14px; border:1px solid var(--line); border-left:4px solid var(--muted); border-radius:10px; background:var(--surface); color:var(--ink); cursor:pointer; }
.quality-check:hover { border-color:var(--spruce); }
.quality-check b { font-size:22px; }
.quality-check span { font-weight:600; font-size:13.5px; }
.quality-check small { color:var(--muted); font-size:12px; line-height:1.4; }
.quality-check.quality-high { border-left-color:var(--terra); }
.quality-check.quality-medium { border-left-color:var(--saffron); }
.quality-meter { display:inline-block; width:80px; height:6px; border-radius:3px; background:var(--hover-bg); overflow:hidden; vertical-align:middle; }
.quality-meter i { display:block; height:100%; background:var(--spruce); }
.asset-alert .quality-meter { display:block; width:100%; max-width:260px; margin-top:6px; }
.quality-accept { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:8px; }
.quality-accept input { flex:1; min-width:200px; }
.quality-accepted { margin-top:14px; }
.quality-accepted summary { cursor:pointer; font-weight:600; font-size:13px; }
.quality-line { margin:4px 0; font-size:13px; padding-left:10px; border-left:3px solid var(--muted); }
.quality-line.quality-high { border-left-color:var(--terra); }
.quality-line.quality-medium { border-left-color:var(--saffron); }
.quality-asked { margin:0 0 12px; }
.merge-table td { vertical-align:top; }
.merge-table tr.merge-same td { color:var(--muted); }
.merge-table td.merge-chosen { background:var(--spruce-pale); }
.merge-pick { display:flex; gap:8px; align-items:flex-start; cursor:pointer; }
.attest-answers { display:inline-flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:flex-end; }
.attest-head { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.attest-head h3 { margin:0; }
.attest-mine { margin-bottom:20px; }
.attest-mine h3 { display:flex; gap:6px; align-items:center; margin:0 0 4px; }
.attest-types { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:4px 14px; border:1px solid var(--line); border-radius:10px; padding:10px 12px; }
.attest-types legend { font-weight:600; font-size:13px; padding:0 4px; }
.asset-alerts li[data-attest-open] { cursor:pointer; }
.quality-required details { margin-bottom:6px; }
.quality-required summary { cursor:pointer; font-size:13px; padding:4px 0; }
.quality-field-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:2px 12px; padding:6px 0 8px 14px; }
.requester-device .attest-answers { justify-content:flex-start; }

/* CMDB phase 6: connectors */
.conn-group { margin:16px 0 8px; font-size:13px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.conn-gallery { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:10px; }
.conn-type { display:grid; gap:6px; text-align:left; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink); cursor:pointer; }
.conn-type:hover { border-color:var(--spruce); box-shadow:var(--shadow); }
.conn-type b { font-size:15px; }
.conn-type span { font-size:13px; line-height:1.45; }
.conn-type small { font-size:12px; color:var(--muted); line-height:1.4; }
.conn-list { display:grid; gap:10px; margin-top:14px; }
.conn-card { padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.conn-card header { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.conn-card header b { display:block; font-size:15px; }
.conn-card header small { color:var(--muted); font-size:12.5px; }
.conn-last { margin:8px 0 0; font-size:13px; line-height:1.45; }
.conn-last code, .conn-token code { font-size:12px; word-break:break-all; }
.conn-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:10px; }
.conn-test { margin-top:10px; }
.conn-preview { list-style:none; margin:6px 0 0; padding:0; display:grid; gap:3px; }
.conn-preview small { color:var(--muted); }
.conn-token { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 12px; padding:10px 12px; border:1px solid var(--saffron); border-radius:10px; background:var(--saffron-pale); }
.conn-token code { padding:4px 8px; border-radius:6px; background:var(--surface); }
.conn-fieldset { border:1px solid var(--line); border-radius:10px; padding:10px 14px; display:grid; gap:8px; }
.conn-fieldset legend { font-weight:600; font-size:13px; padding:0 4px; }
.conn-code { display:block; padding:8px 10px; border-radius:8px; background:var(--hover-bg-subtle); border:1px solid var(--line); font-size:12px; white-space:pre-wrap; word-break:break-all; }
.asset-form-grid label.full-width { grid-column:1 / -1; }
.conn-fieldset > button { justify-self:start; }

/* CMDB integrations: monitoring setup, collector, API access */
.conn-steps { margin:0; padding-left:20px; display:grid; gap:8px; font-size:13px; line-height:1.45; }
.conn-steps .conn-code { margin-top:6px; }
.api-key-new { max-width:560px; margin:6px 0 14px; }
.api-endpoints td:first-child { white-space:nowrap; width:1%; }
.api-endpoints code { font-size:12.5px; }

/* New ticket: the requester's devices */
.nt-devices { margin-top:8px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--hover-bg-subtle); }
.nt-devices-head b { display:block; font-size:13px; }
.nt-devices-head small { color:var(--muted); font-size:12px; }
.nt-devices ul { list-style:none; margin:8px 0 0; padding:0; display:grid; gap:4px; }
.nt-device { display:flex; gap:8px; align-items:flex-start; padding:6px 8px; border-radius:8px; background:var(--surface); border:1px solid var(--line); cursor:pointer; font-weight:400; }
.nt-device input { margin-top:3px; }
.nt-device small { display:block; color:var(--muted); font-size:12px; }
.nt-device-state { font-size:11.5px; font-weight:600; color:var(--terra); }
.nt-devices-more { margin:6px 0 0; font-size:12px; color:var(--muted); }

/* Integration catalog */
.conn-top-actions { display:flex; flex-wrap:wrap; gap:8px; }
.ig-filters { display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 10px; }
.ig-filters input { flex:1; min-width:220px; }
.ig-list { display:grid; gap:6px; }
.ig-item { border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.ig-item.open { border-color:var(--spruce); }
.ig-item-head { width:100%; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 12px; border:0; background:none; color:var(--ink); text-align:left; cursor:pointer; }
.ig-item-head b { display:block; font-size:14px; }
.ig-item-head small { color:var(--muted); font-size:12.5px; }
.ig-badges { display:flex; flex-wrap:wrap; gap:4px; justify-content:flex-end; flex-shrink:0; max-width:50%; }
.ig-badge { display:inline-block; padding:2px 8px; border-radius:999px; font-size:11.5px; font-weight:600; white-space:nowrap; background:var(--hover-bg); color:var(--ink); }
.ig-badge.ig-connector { background:var(--spruce-pale); color:var(--spruce-dark); }
.ig-badge.ig-monitoring { background:var(--saffron-pale); }
.ig-badge.ig-rest { background:color-mix(in srgb, var(--spruce) 14%, var(--surface)); }
.ig-detail { display:grid; gap:10px; padding:0 12px 12px; }
.ig-method { padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--hover-bg-subtle); }
.ig-method-head { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.ig-method p { margin:6px 0 0; font-size:13px; line-height:1.45; }
.ig-settings { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:4px 14px; margin:8px 0 0; font-size:12.5px; }
.ig-settings dt { color:var(--muted); }
.ig-settings dd { margin:0; word-break:break-all; }
.ig-method .conn-code { margin-top:8px; }
@media (max-width: 700px) { .ig-item-head { flex-direction:column; align-items:flex-start; } .ig-badges { max-width:none; justify-content:flex-start; } }

/* Integration catalog filters: compact */
.ig-filters { flex-wrap:nowrap; }
.ig-filters input[type="search"] { flex:1 1 auto; width:auto; min-width:0; }
.ig-filters select { flex:0 0 220px; width:220px; }
.ig-how { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.ig-how .al-category { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; min-height:0; height:auto; border-radius:999px; font-size:13px; flex:0 0 auto; }
.ig-how .al-category span { font-size:12px; }
@media (max-width: 700px) { .ig-filters { flex-wrap:wrap; } .ig-filters select { flex:1 1 100%; width:100%; } }
.ig-filters > input[type="search"] { flex:1 1 60%; }
.ig-filters > .custom-select-wrapper, .ig-filters > select { flex:0 0 240px; width:240px; max-width:100%; }
.ig-how .al-category span { display:inline; margin:0; }
@media (max-width: 700px) { .ig-filters > .custom-select-wrapper { flex:1 1 100%; width:100%; } }

/* CI form: every field lines up across the row (label, then the box, then any hint), and boxes are one height,
   so a hint under one field doesn't stretch or push down the fields beside it. */
.cmdb-form-grid { align-items:start; }
.cmdb-form-grid label, .cmdb-type-field { align-content:start; }
.cmdb-form-grid input:not([type="checkbox"]):not([type="radio"]), .cmdb-form-grid select, .cmdb-form-grid .custom-select-trigger,
.cmdb-type-field select, .cmdb-type-field .custom-select-trigger { box-sizing:border-box; height:40px; min-height:40px; padding-top:0; padding-bottom:0; }
.cmdb-form-grid .custom-select-wrapper, .cmdb-type-field .custom-select-wrapper { margin:0; }
.cmdb-form-grid textarea { min-height:80px; }

/* Outage register filters */
.outage-filters { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)) minmax(90px, 0.5fr) auto; gap:10px; align-items:end; margin:4px 0 12px; }
.outage-filters label { display:grid; gap:5px; min-width:0; color:var(--muted); font-size:12px; font-weight:600; }
.outage-filters select, .outage-filters .custom-select-trigger { box-sizing:border-box; height:38px; min-height:38px; }
.outage-filters .custom-select-wrapper { margin:0; }
.outage-filters .outline-button { height:38px; white-space:nowrap; }
.outage-filter-empty { padding:18px; color:var(--muted); text-align:center; }
@media (max-width: 860px) { .outage-filters { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .outage-filters { grid-template-columns:1fr; } }

/* Global search: area chips and "show all" rows */
.global-search-scopes { display:flex; flex-wrap:wrap; gap:6px; box-sizing:border-box; width:min(680px, calc(100% - 32px)); margin:8px auto 0; padding:8px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-pop); }
.global-search-scopes[hidden] { display:none; }
.global-scope { display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--ink); font-size:12.5px; font-weight:600; cursor:pointer; }
.global-scope span { color:var(--muted); font-weight:600; }
.global-scope:hover { border-color:var(--control-hover); }
.global-scope[aria-checked="true"] { border-color:var(--spruce); background:var(--spruce); color:var(--surface); }
.global-scope[aria-checked="true"] span { color:inherit; opacity:.8; }
.global-scope:focus-visible, .global-more:focus-visible, .global-result:focus-visible { outline:2px solid var(--spruce); outline-offset:2px; }
.global-more { display:block; width:100%; margin:2px 0 6px; padding:7px 12px; border:0; border-radius:7px; background:none; color:var(--spruce); font-size:12.5px; font-weight:700; text-align:left; cursor:pointer; }
.global-more:hover { background:var(--hover-bg); }

/* Global search: the shortcuts list */
.global-tips-toggle { margin-left:auto; padding:5px 11px; border:1px dashed var(--line); border-radius:999px; background:none; color:var(--muted); font-size:12.5px; font-weight:600; cursor:pointer; }
.global-tips-toggle:hover, .global-tips-toggle[aria-expanded="true"] { border-color:var(--spruce); color:var(--spruce); }
.global-tips { margin:2px 2px 8px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--hover-bg-subtle); }
.global-tips-head { display:grid; gap:2px; margin-bottom:8px; }
.global-tips-head b { font-size:13px; }
.global-tips-head small, .global-tips-keys { color:var(--muted); font-size:12px; }
.global-tips kbd { display:inline-block; min-width:14px; padding:1px 6px; border:1px solid var(--line); border-bottom-width:2px; border-radius:5px; background:var(--surface); color:var(--ink); font:600 11.5px ui-monospace, SFMono-Regular, Consolas, monospace; text-align:center; }
.global-tip-list { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:4px; }
.global-tip { display:flex; align-items:center; gap:8px; padding:5px 8px; border:0; border-radius:7px; background:none; color:var(--ink); font-size:12.5px; text-align:left; cursor:pointer; }
.global-tip:hover, .global-tip:focus-visible { background:var(--hover-bg); }
.global-tip kbd { min-width:34px; }
.global-tip small { display:block; color:var(--muted); font-size:11px; }
.global-tips-keys { display:flex; flex-wrap:wrap; gap:4px 14px; margin:8px 0 0; padding-top:8px; border-top:1px solid var(--line); }

/* Global search: a wider pop-out, so chips sit on one row and the shortcuts fit in two lines */
.global-search-box, .global-search-scopes, .global-search-results { width:min(1000px, calc(100% - 32px)); }
.global-search-results { max-height:max(300px, calc(100vh - 240px)); }
.global-search-scopes { flex-wrap:wrap; align-items:center; }
.global-tips { padding:8px 12px; }
.global-tips-head { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; margin-bottom:6px; }
.global-tip-list { grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:2px 4px; }
.global-tip { padding:4px 8px; }
.global-tip span { white-space:nowrap; }
.global-tip small { display:inline; margin-left:6px; }
.global-tips-keys { margin-top:6px; padding-top:6px; }

/* CMDB summary tiles open the list of what they count */
button.cmdb-kpi { width:100%; font:inherit; color:var(--ink); text-align:left; cursor:pointer; }
button.cmdb-kpi:hover { border-color:var(--spruce); }
button.cmdb-kpi:focus-visible { outline:2px solid var(--spruce); outline-offset:2px; }
button.cmdb-kpi.active { border-color:var(--spruce); box-shadow:inset 0 0 0 1px var(--spruce); }

/* Global search: why a result matched, and where the search appears */
.global-result mark { padding:0 1px; border-radius:3px; background:color-mix(in srgb, var(--saffron, #d5a33c) 35%, transparent); color:inherit; }
.global-why { display:block; margin-top:2px; color:var(--spruce) !important; font-size:11.5px; }
.global-why b { font-weight:700; }
.global-result .global-why b, .global-result .global-why mark, .global-result b mark { display:inline; margin:0; font-size:inherit; }
.global-result .global-why b { color:inherit; }

/* Outage banner: the latest update posted on the problem, on its own line under the outage */
.outage-banner-body li { flex-wrap:wrap; }
.outage-banner-note { flex-basis:100%; margin:0 0 2px; font-size:12.5px; line-height:1.45; opacity:.95; overflow-wrap:anywhere; }
.outage-banner-note span { font-weight:700; }

/* Custom States: what the ticket states mean */
.state-meanings-card { grid-column:1 / -1; }
.state-meanings { display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:12px; }
.state-meaning { display:grid; gap:8px; align-content:start; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); }
.state-meaning span { display:grid; gap:3px; }
.state-meaning b { font-size:13px; color:var(--ink); }
.state-meaning small { color:var(--muted); font-size:12px; line-height:1.4; }

/* Custom States: what each ticket state does to the SLA */
.custom-state-row > span:first-child { display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; min-width:0; }
.state-sla { display:inline-flex; align-items:center; gap:3px; padding:1px 7px; border-radius:999px; font-size:10.5px; font-style:normal; font-weight:700; white-space:nowrap; }
.state-sla-paused { background:color-mix(in srgb, #d5a33c 22%, var(--surface)); color:#8a6418; }
.state-sla-runs { background:color-mix(in srgb, #55966d 16%, var(--surface)); color:#2f6b47; }
.state-sla-stops { background:var(--hover-bg); color:var(--muted); }
[data-theme="dark"] .state-sla-paused { color:#e8c06a; }
[data-theme="dark"] .state-sla-runs { color:#8fd0a8; }
.state-sla-key { margin:0 0 10px; padding:8px 10px; border-radius:8px; background:var(--surface-2); color:var(--ink-2); font-size:12.5px; line-height:1.45; }

/* Custom States: the "Pauses SLA" checkbox on each open ticket state */
.state-sla-toggle { display:inline-flex; align-items:center; gap:4px; padding:1px 8px 1px 4px; border-radius:999px; font-size:10.5px; font-weight:700; white-space:nowrap; cursor:pointer; }
.state-sla-toggle input { width:13px; height:13px; margin:0; accent-color:#b5852a; cursor:pointer; }

/* Sidebar: on a short window the links scroll, and the bottom (Admin Settings, user menu) stays in view.
   The nav reaches out to the sidebar's edges so the active item's left marker isn't cut off by the scroll area. */
.sidebar { overflow:hidden; }
.sidebar > .brand-lockup, .sidebar > .workspace-switcher, .sidebar > .sidebar-bottom { flex-shrink:0; }
.sidebar > .primary-nav { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; margin:0 -14px; padding:0 14px 8px; scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
.sidebar > .primary-nav::-webkit-scrollbar { width:6px; }
.sidebar > .primary-nav::-webkit-scrollbar-thumb { border-radius:3px; background:var(--line); }

/* Ticket reply bar: on a narrower ticket (a laptop at 100% zoom) the controls wrap onto a second row instead of being
   squeezed: each keeps its size and one-line label, and Post stays at the right. */
.comment-composer .composer-footer { flex-wrap:wrap !important; align-items:center !important; justify-content:flex-start !important; gap:8px !important; }
.comment-composer .composer-footer > * { flex:0 0 auto; }
.comment-composer .comment-visibility { width:auto !important; flex-wrap:nowrap !important; }
.comment-composer .composer-footer button, .comment-composer .composer-footer .outline-button { white-space:nowrap; }
.comment-composer .composer-inserts { flex-wrap:nowrap; }
.comment-composer .composer-footer .tw-post-group { margin-left:auto; }
.comment-composer .composer-footer .attach-button { margin-left:0 !important; }

/* Edit requester: give them service desk access */
.requester-promote { display:grid; gap:10px; margin:14px 0; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2); }
.requester-promote[hidden] { display:none; }
.requester-promote-head { display:grid; gap:3px; }
.requester-promote-head b { font-size:14px; color:var(--ink); }
.requester-promote-head small { color:var(--muted); font-size:12.5px; line-height:1.4; }
.requester-promote-fields { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.requester-promote-fields label { display:grid; gap:5px; font-size:12.5px; font-weight:600; color:var(--ink-2); }
.requester-promote-fields label small { color:var(--muted); font-weight:500; }
.requester-promote .outline-button { justify-self:start; }
@media (max-width: 560px) { .requester-promote-fields { grid-template-columns:1fr; } }