:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#172033;background:#f5f7fb;font-synthesis:none;text-rendering:optimizeLegibility;--navy:#173b57;--blue:#2f6bff;--border:#e5eaf1;--muted:#6b7280;--shadow:0 10px 30px rgba(18,38,63,.08)}*{box-sizing:border-box}body{margin:0;min-width:1180px;min-height:100vh;background:#f5f7fb}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.full-loader{min-height:100vh;display:grid;place-items:center}.app-shell{display:grid;grid-template-columns:248px 1fr;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#fff;border-right:1px solid var(--border);display:flex;flex-direction:column;padding:22px 16px;z-index:20;transition:.2s}.main-column{grid-column:2;min-width:0}.sidebar-collapsed{grid-template-columns:82px 1fr}.sidebar-collapsed .sidebar{width:82px}.sidebar-collapsed .sidebar span,.sidebar-collapsed .sidebar .brand div{display:none}.brand{display:flex;align-items:center;gap:11px;padding:0 6px;margin-bottom:28px}.brand-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,var(--navy),var(--blue));color:#fff;display:grid;place-items:center;font-weight:800}.brand strong{display:block;font-size:18px}.brand small{display:block;color:var(--muted);font-size:12px;margin-top:1px}.sidebar nav{display:flex;flex-direction:column;gap:5px;flex:1}.sidebar nav a,.collapse-btn{display:flex;align-items:center;gap:12px;height:44px;padding:0 13px;border-radius:10px;color:#4b5563;font-weight:600;font-size:14px;border:none;background:none;width:100%}.sidebar nav a:hover,.collapse-btn:hover{background:#f4f7fb;color:var(--navy)}.sidebar nav a.active{background:#eaf1ff;color:#1f5ee8}.sidebar-bottom{border-top:1px solid var(--border);padding-top:12px}.topbar{height:74px;background:#fffffff5;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:12;backdrop-filter:blur(10px)}.topbar-title{display:flex;align-items:center;gap:18px}.topbar-title h2{font-size:18px;margin:0}.tenant-select{display:flex;align-items:center;gap:7px;padding:8px 10px;background:#f7f9fc;border:1px solid var(--border);border-radius:9px}.tenant-select select{border:none;background:transparent;appearance:none;font-weight:600;min-width:180px}.topbar-search{width:min(380px,32vw);height:40px;border:1px solid var(--border);border-radius:10px;display:flex;align-items:center;padding:0 12px;gap:8px;color:#9aa3b2;background:#fafbfd}.topbar-search input{border:none;outline:none;background:transparent;width:100%}.topbar-actions{display:flex;align-items:center;gap:10px}.notification-btn,.icon-btn{width:38px;height:38px;border:1px solid var(--border);background:#fff;border-radius:10px;display:grid;place-items:center;position:relative;color:#526070}.notification-btn b{position:absolute;right:-4px;top:-5px;background:#ef4444;color:#fff;font-size:10px;min-width:18px;height:18px;border-radius:999px;display:grid;place-items:center}.user-chip{display:flex;align-items:center;gap:9px;padding:5px 8px}.user-chip>span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e7efff;color:#285edf;font-weight:800}.user-chip strong{display:block;font-size:13px}.user-chip small{display:block;color:var(--muted);font-size:11px;margin-top:2px}main{padding:26px 30px 44px;max-width:1680px;margin:0 auto}.page-header{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:22px}.page-header h1{font-size:26px;margin:0 0 6px}.page-header p{margin:0;color:var(--muted);font-size:14px}.page-actions,.button-row{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.btn{height:39px;border-radius:9px;padding:0 14px;border:1px solid var(--border);display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700;font-size:13px;background:#fff;color:#344054}.btn-primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn-secondary:hover{background:#f7f9fc}.btn-danger{background:#fff1f2;border-color:#fecdd3;color:#be123c}.btn-block{width:100%}.btn:disabled{opacity:.6;cursor:not-allowed}.metrics-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:18px}.metric-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:17px 18px;box-shadow:0 2px 12px #1f2d3d08;position:relative;overflow:hidden}.metric-card:after{content:"";position:absolute;inset:auto 0 0;height:3px;background:#dbe6ff}.metric-green:after{background:#9ce4bf}.metric-orange:after{background:#ffd69b}.metric-red:after{background:#f8a7ad}.metric-purple:after{background:#c7b8ff}.metric-label{display:block;color:var(--muted);font-size:13px;font-weight:600}.metric-card strong{display:block;font-size:26px;margin:8px 0 3px}.metric-card small{color:#8b95a5}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.three-column{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:16px}.section-card{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 2px 12px #1f2d3d08;margin-bottom:16px;overflow:hidden}.section-card>header{display:flex;justify-content:space-between;align-items:flex-start;padding:17px 18px;border-bottom:1px solid var(--border)}.section-card h2{font-size:15px;margin:0}.section-card header p{margin:4px 0 0;color:var(--muted);font-size:12px}.section-content{padding:16px 18px}.toolbar{display:flex;justify-content:space-between;gap:14px;margin-bottom:14px}.toolbar-actions{display:flex;gap:10px;align-items:center}.search-box{height:40px;border:1px solid var(--border);background:#fff;border-radius:9px;display:flex;align-items:center;gap:8px;padding:0 12px;min-width:300px;color:#98a2b3}.search-box input{border:none;outline:none;width:100%}.toolbar select,.ticket-footer select,.form-grid select{height:40px;border:1px solid var(--border);border-radius:9px;background:#fff;padding:0 10px}.check{display:flex;gap:8px;align-items:center;color:#5d6675;font-size:13px}.table-shell{overflow:auto;border:1px solid var(--border);border-radius:12px;background:#fff}.data-table{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}.data-table th{position:sticky;top:0;background:#fafbfd;color:#667085;text-align:left;font-weight:700;padding:11px 13px;border-bottom:1px solid var(--border);white-space:nowrap}.data-table td{padding:12px 13px;border-bottom:1px solid #edf0f4;vertical-align:middle}.data-table tr:last-child td{border-bottom:none}.data-table tr.clickable:hover{background:#f7faff}.data-table tr.clickable{cursor:pointer}.table-sub{display:block;color:var(--muted);font-size:11px;margin-top:4px}.mono{font-family:SFMono-Regular,Consolas,monospace}.status-badge,.tag{display:inline-flex;align-items:center;min-height:24px;border-radius:999px;padding:3px 9px;background:#eef3f8;color:#475467;font-weight:700;font-size:11px;white-space:nowrap}.status-active,.status-enabled,.status-success,.status-resolved,.status-valid,.status-synced,.status-completed{background:#e7f8ee;color:#167647}.status-new,.status-trial,.status-in-progress,.status-open{background:#eaf1ff;color:#255ccc}.status-waiting-client,.status-normal,.status-pending,.status-grace-period{background:#fff7df;color:#9a6700}.status-high,.status-urgent,.status-error,.status-failed,.status-missing-metadata,.status-invalid-metadata,.status-out-of-sync,.status-suspended{background:#fff0f1;color:#c6283d}.status-closed,.status-cancelled,.status-archived,.status-disabled,.status-terminated{background:#f1f2f4;color:#636b75}.status-reopened,.status-purple{background:#f1ecff;color:#6847c7}.status-low{background:#eef5fb;color:#52708a}.tabs{display:flex;gap:3px;border-bottom:1px solid var(--border);margin-bottom:15px}.tabs button{border:none;background:none;padding:10px 14px;color:#667085;font-weight:700;border-bottom:2px solid transparent}.tabs button.active{color:var(--blue);border-color:var(--blue)}.tabs button span{margin-left:6px;padding:1px 6px;border-radius:999px;background:#eef2f6;font-size:10px}.mini-chart{display:flex;flex-direction:column;gap:11px}.mini-chart-row{display:grid;grid-template-columns:120px 1fr 44px;align-items:center;gap:10px;font-size:12px}.mini-chart-row>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#596273}.mini-chart-row>div{height:8px;background:#edf1f6;border-radius:999px;overflow:hidden}.mini-chart-row i{height:100%;display:block;background:linear-gradient(90deg,var(--blue),#6d9aff);border-radius:999px}.mini-chart-row b{text-align:right}.health-list{display:flex;flex-direction:column;gap:12px}.health-list>div,.feature-grid>div,.detail-list>div{display:flex;justify-content:space-between;gap:16px;padding-bottom:10px;border-bottom:1px dashed var(--border)}.health-list span,.detail-list span{color:var(--muted)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.issue-counts{display:flex;gap:6px;flex-wrap:wrap}.issue-counts span{font-size:11px;background:#f1f4f8;padding:4px 7px;border-radius:7px}.issue-counts .danger{color:#bd2130;background:#fff0f1}.empty-state,.loading-state{min-height:180px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;color:#8a94a3;text-align:center}.loading-state{flex-direction:row;min-height:120px}.error-state{background:#fff4f4;border:1px solid #ffd0d3;padding:16px;border-radius:12px;display:flex;gap:12px;color:#b42332}.error-state p{margin:5px 0 10px}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.drawer-layer,.modal-layer{position:fixed;inset:0;background:#0f172a47;z-index:50;display:flex;justify-content:flex-end}.drawer{width:min(620px,48vw);height:100%;background:#fff;box-shadow:-18px 0 45px #12263f29;display:flex;flex-direction:column;animation:slideIn .2s ease}.drawer>header,.modal>header{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--border)}.drawer h2,.modal h2{font-size:17px;margin:0}.drawer-body{padding:18px 20px;overflow:auto;flex:1}.drawer>footer{padding:13px 18px;border-top:1px solid var(--border);background:#fafbfd}.modal-layer{justify-content:center;align-items:center}.modal{width:min(680px,90vw);max-height:90vh;background:#fff;border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column}.modal-body{padding:18px 20px;overflow:auto}.modal>footer{padding:14px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:9px}@keyframes slideIn{0%{transform:translate(40px);opacity:.6}}.conversation-thread{display:flex;flex-direction:column;gap:12px;margin:16px 0}.chat-event{max-width:88%}.chat-event>span{display:block;color:#7a8494;font-size:11px;margin-bottom:5px}.chat-event>div{padding:11px 13px;border-radius:12px;background:#f2f4f7;line-height:1.55;white-space:pre-wrap}.chat-event.user{align-self:flex-end}.chat-event.user>div{background:#e8f0ff}.chat-event small{display:block;color:#8b95a5;margin-top:4px}.detail-meta{display:flex;justify-content:space-between;color:#697386;font-size:12px}.source-list{display:flex;flex-direction:column;gap:10px}.source-list>div{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--border);border-radius:10px}.source-list>div>div{flex:1}.source-list small{display:block;color:var(--muted);margin-top:3px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid label{font-size:12px;font-weight:700;color:#4e5968;display:flex;flex-direction:column;gap:7px}.form-grid input,.form-grid textarea,.code-editor,.ticket-footer input{border:1px solid var(--border);border-radius:9px;padding:10px 11px;outline:none;background:#fff;color:#243142}.form-grid input:focus,.form-grid textarea:focus,.code-editor:focus{border-color:#8eb0ff;box-shadow:0 0 0 3px #edf3ff}.form-grid .full{grid-column:1/-1}.snapshot,.quote-box{background:#f7f9fc;border:1px solid var(--border);border-radius:10px;padding:12px;line-height:1.55;white-space:pre-wrap}.snapshot p{margin:5px 0 13px}.ticket-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.ticket-summary>div{padding:10px;border:1px solid var(--border);border-radius:10px}.ticket-summary span,.detail-label{display:block;color:var(--muted);font-size:11px;margin-bottom:6px}.ticket-detail h3{margin:0 0 10px}.comments{display:flex;flex-direction:column;gap:10px}.comment{padding:11px;border:1px solid var(--border);border-radius:10px}.comment.super_admin{background:#f7faff}.comment>div{display:flex;justify-content:space-between}.comment small{color:var(--muted)}.comment p{margin:8px 0 0;line-height:1.5}.ticket-footer{display:flex;gap:8px;align-items:center}.comment-composer{display:flex;flex:1;gap:7px}.comment-composer input{flex:1}.icon-btn.primary{background:var(--blue);color:#fff;border-color:var(--blue)}.timeline{display:flex;flex-direction:column}.timeline-item{display:grid;grid-template-columns:28px 1fr;gap:9px;position:relative;padding-bottom:16px}.timeline-item:after{content:"";position:absolute;left:13px;top:24px;bottom:0;width:1px;background:var(--border)}.timeline-item:last-child:after{display:none}.timeline-dot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#e8f6ed;color:#138044;z-index:1}.timeline-item p{margin:3px 0;color:var(--muted);font-size:11px}.timeline-item small{color:#647085}.code-editor{width:100%;font-family:SFMono-Regular,Consolas,monospace;line-height:1.45;background:#0f172a;color:#dce8ff;border-color:#0f172a}.notification-list{display:flex;flex-direction:column;gap:8px}.notification-list button{display:grid;grid-template-columns:40px 1fr 8px;align-items:start;text-align:left;width:100%;border:1px solid var(--border);background:#fff;border-radius:12px;padding:13px}.notification-list button.read{opacity:.7}.notification-list p{margin:4px 0;color:#667085}.notification-list small{color:#98a2b3}.notification-list i{width:7px;height:7px;border-radius:50%;background:var(--blue);margin-top:8px}.notification-icon{width:34px;height:34px;border-radius:9px;background:#eaf1ff;color:#2f65df;display:grid;place-items:center}.success-message{color:#167647;background:#eaf8ef;border-radius:9px;padding:9px}.login-page{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr;background:#fff}.login-visual{padding:10vh 8vw;background:linear-gradient(145deg,#112f48,#235983);color:#fff;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.login-visual:after{content:"";position:absolute;width:480px;height:480px;border-radius:50%;background:#ffffff0f;right:-140px;bottom:-180px}.visual-badge{display:inline-flex;align-self:flex-start;padding:7px 11px;border:1px solid rgba(255,255,255,.25);border-radius:999px;font-size:12px}.login-visual h1{font-size:48px;line-height:1.12;max-width:720px;margin:25px 0 18px}.login-visual p{font-size:18px;line-height:1.6;max-width:650px;color:#d9e8f5}.visual-points{display:flex;gap:18px;flex-wrap:wrap;margin-top:25px}.visual-points span{display:flex;gap:7px;align-items:center;font-size:13px}.visual-points svg{width:17px}.login-card{width:min(430px,72%);align-self:center;justify-self:center}.brand-login{padding:0;margin-bottom:42px}.login-card h2{font-size:28px;margin:0 0 8px}.login-card>p{color:var(--muted);margin-bottom:25px}.login-card label{display:flex;flex-direction:column;gap:7px;margin-bottom:15px;font-size:13px;font-weight:700}.login-card input{height:46px;border:1px solid var(--border);border-radius:10px;padding:0 12px}.form-error{display:flex;gap:8px;align-items:center;background:#fff1f2;color:#b4233b;padding:10px;border-radius:9px;margin-bottom:14px;font-size:13px}.login-note{display:block;color:#8a94a3;text-align:center;margin-top:16px}@media(max-width:1300px){.metrics-grid{grid-template-columns:repeat(3,1fr)}.topbar-search{display:none}.feature-grid{grid-template-columns:1fr 1fr}}.inline-filter{display:flex;align-items:center;gap:8px;font-weight:600}.inline-filter input{width:110px}.two-column.wide-left{grid-template-columns:minmax(0,1.65fr) minmax(320px,.85fr)}.icon-btn.danger{color:#c73939}.form-grid .check{align-self:center;display:flex;align-items:center;gap:8px}.form-grid .check input{width:auto}.channel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.channel-card{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #e3e8ef;background:#fff;border-radius:14px;padding:18px;cursor:pointer}.channel-card:hover{border-color:#8eb5e5;box-shadow:0 8px 24px #173b5714}.channel-card div{display:flex;flex-direction:column;flex:1}.channel-card small{color:#667085;margin-top:4px}@media(max-width:900px){.channel-grid{grid-template-columns:1fr}}
