@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#17284a;background:#f6f9fe;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:wait}.splash{height:100vh;display:grid;place-items:center;font-size:2rem;font-weight:800}.splash span,.brand b{color:#3d80ff}.layout{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}.sidebar{background:white;border-right:1px solid #e5ebf6;padding:27px 18px;display:flex;flex-direction:column;gap:26px}.brand{font-weight:850;letter-spacing:-.7px;font-size:26px;display:flex;align-items:center;gap:10px}.brandmark{height:38px;width:38px;background:#1369ed;border-radius:13px;display:grid;place-items:center;color:white;font-size:23px}.nav{display:grid;gap:5px}.nav button{text-align:left;border:0;background:none;color:#6f7e99;border-radius:12px;padding:14px 15px;font-weight:650}.nav button:hover,.nav button.active{background:#eaf2ff;color:#1766d8}.nav button span{display:inline-block;width:26px}.main{padding:30px 36px;min-width:0;max-width:1450px;width:100%;margin:auto}.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;gap:15px}.eyebrow{text-transform:uppercase;color:#7184a5;font-weight:750;letter-spacing:2px;font-size:10px}.top h1{font-size:29px;margin:7px 0;letter-spacing:-1.1px}.muted{color:#7c8aa2}.small{font-size:12px}.card{background:#fff;border:1px solid #e8eef8;border-radius:19px;box-shadow:0 8px 28px #123a7510;padding:24px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.metric{font-size:35px;font-weight:800;margin-top:8px}.tag{padding:5px 9px;border-radius:999px;background:#eaf2ff;color:#1668df;font-size:11px;font-weight:800;display:inline-block;text-transform:capitalize}.tag.escalated,.tag.critical{background:#fff0e8;color:#c35c19}.tag.closed,.tag.resolved,.tag.ok{background:#eafaf3;color:#16805e}.btn{border:1px solid #dce6f6;background:#fff;color:#1e477f;padding:11px 17px;border-radius:11px;font-weight:750}.btn.primary{background:#1768ee;color:#fff;border-color:#1768ee}.btn:hover{filter:brightness(.96)}.btn.danger{color:#c54848}.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.list{display:grid;gap:10px}.item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px;border:1px solid #e7eef8;background:white;border-radius:13px;cursor:pointer;text-align:left;width:100%}.item:hover{border-color:#7daaf9;background:#fbfdff}.item strong{display:block;margin-bottom:5px}.chat-layout{display:grid;grid-template-columns:295px minmax(0,1fr);gap:17px;min-height:70vh}.chat-window{display:flex;flex-direction:column;min-height:70vh;max-height:78vh;padding:0;overflow:hidden}.chat-header{padding:18px 22px;border-bottom:1px solid #edf1f8;display:flex;justify-content:space-between;gap:10px;align-items:center}.messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:12px;background:linear-gradient(#fff,#fbfdff)}.bubble{max-width:85%;padding:13px 16px;border-radius:16px;background:#eef3fb;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}.bubble.customer{background:#1768ed;color:#fff;align-self:flex-end;border-bottom-right-radius:4px}.bubble.assistant{align-self:flex-start;border-bottom-left-radius:4px}.bubble.superadmin{background:#e3f8ed;color:#146444}.bubble.system{align-self:center;background:#fff6df;font-size:12px}.bubble small{display:block;font-size:10px;opacity:.75;margin-top:6px}.composer{display:flex;align-items:end;gap:10px;padding:14px;border-top:1px solid #ecf1f8}.composer textarea{flex:1;resize:vertical;max-height:130px;min-height:46px}.field,input,textarea,select{border:1px solid #dfe7f3;border-radius:11px;padding:12px 13px;background:white;color:#243858;outline:none;width:100%}.field:focus,input:focus,textarea:focus,select:focus{border-color:#4f8dec;box-shadow:0 0 0 3px #3d80ff1c}label{font-size:12px;color:#556988;font-weight:750;display:grid;gap:7px}form.stack{display:grid;gap:14px}.auth{min-height:100vh;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at 20% 15%,#d7eaff,transparent 38%),#f5f9ff}.authbox{width:100%;max-width:440px}.auth .brand{margin-bottom:26px}.auth h1{margin:0 0 9px;font-size:30px}.link{border:0;background:none;color:#1768ee;padding:4px;font-weight:700}.table-wrap{overflow-x:auto;background:#fff;border-radius:17px;border:1px solid #e8eef8}table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}th{color:#7586a1;font-weight:750;font-size:11px;text-transform:uppercase;letter-spacing:.5px}td,th{padding:16px;border-bottom:1px solid #edf1f6;vertical-align:top}tr:last-child td{border:0}.sectionhead{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:0 0 14px}.split{display:grid;grid-template-columns:1fr 1fr;gap:18px}.footer{margin-top:auto;font-size:12px;color:#9cabc2}.notice{background:#eef5ff;border:1px solid #d4e5ff;padding:12px;border-radius:10px;font-size:13px}.error{color:#bf3e4d;background:#fff0f2;border-radius:10px;padding:12px}.success{color:#1d7954;background:#edfbf5;border-radius:10px;padding:12px}.empty{text-align:center;padding:60px 20px;color:#8090aa}.pillrow{display:flex;gap:8px;flex-wrap:wrap}.logo-icon{font-size:18px}.mobile-top{display:none}.inputrow{display:flex;gap:8px}.inputrow>*{flex:1}@media(max-width:950px){.layout{grid-template-columns:76px minmax(0,1fr)}.sidebar{padding:18px 8px}.sidebar .brand .word,.nav .txt,.footer,.userlabel{display:none}.sidebar .brand{justify-content:center}.nav button{text-align:center}.main{padding:20px}.chat-layout{grid-template-columns:220px 1fr}.cards{grid-template-columns:1fr 1fr}}@media(max-width:650px){.layout{display:block;padding-bottom:65px}.sidebar{position:fixed;bottom:0;left:0;right:0;z-index:20;display:block;padding:5px;border-top:1px solid #e5ebf6;border-right:0}.sidebar>.brand,.footer{display:none}.nav{display:flex;justify-content:space-around}.nav button{padding:8px;font-size:10px;flex:1}.nav button span{display:block;margin:auto}.nav .txt{display:block}.main{padding:16px}.top h1{font-size:23px}.cards,.split{grid-template-columns:1fr}.chat-layout{grid-template-columns:1fr}.chat-list{max-height:160px;overflow:auto}.chat-window{min-height:62vh;max-height:70vh}.card{padding:16px}}
