:root{--blue:#0b5bd3;--blue-dark:#053c63;--navy:#06395d;--blue-soft:#eaf2ff;--bg:#f5f7fb;--surface:#fff;--text:#172033;--muted:#6b7280;--border:#dfe5ef;--success:#14804a;--success-bg:#e8f7ef;--warning:#a86100;--warning-bg:#fff4df;--danger:#b42318;--danger-bg:#fdeceb;--shadow:0 14px 35px rgba(23,32,51,.08);--radius:18px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}body{min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.app-shell{min-height:100vh}.topbar{min-height:74px;padding:14px clamp(16px,4vw,52px);display:flex;align-items:center;justify-content:space-between;gap:20px;color:#fff;background:linear-gradient(135deg,var(--blue),var(--blue-dark));box-shadow:0 7px 22px rgba(8,59,140,.18);position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:12px;min-width:220px}.brand-mark{width:43px;height:43px;object-fit:contain;border-radius:12px;background:#fff;padding:4px;box-shadow:0 5px 15px rgba(0,0,0,.12)}.brand-logo{width:158px;height:auto;display:block;object-fit:contain;flex:0 0 auto}.brand strong{display:block;font-size:19px;line-height:1.05;letter-spacing:-.3px}.brand span{display:block;font-size:12px;opacity:.78;margin-top:4px}.brand-dark{color:var(--text);margin-bottom:30px}.brand-dark .brand-mark{width:48px;height:48px}.top-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.user-badge{font-size:13px;font-weight:700;opacity:.9}.btn{border:0;border-radius:11px;padding:11px 15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:800;transition:.2s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--blue);color:#fff;box-shadow:0 6px 14px rgba(11,91,211,.18)}.btn-outline{background:#fff;color:var(--blue-dark);border:1px solid #b7c8e4}.btn-ghost{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.24)}.btn-wide{width:100%}.page{width:min(1460px,calc(100% - 36px));margin:28px auto 44px}.hero,.monitor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:22px}.hero h1,.monitor-head h1{font-size:clamp(28px,3vw,40px);letter-spacing:-.8px;margin:0}.hero p,.monitor-head p{color:var(--muted);margin:8px 0 0}.eyebrow{color:var(--blue);font-size:11px;font-weight:900;letter-spacing:2px;margin-bottom:8px}.back-link{border:0;background:transparent;color:var(--blue-dark);font-weight:800;padding:0 0 12px}.notice{border:1px solid #cbd8ef;background:var(--blue-soft);color:var(--blue-dark);border-radius:12px;padding:12px 15px;margin-bottom:18px;font-weight:700}.notice.error{border-color:#efb8b3;background:var(--danger-bg);color:var(--danger)}.notice.success{border-color:#acd9be;background:var(--success-bg);color:var(--success)}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}.selection-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:21px;text-align:left;min-height:160px;transition:.2s ease}.selection-card:hover{transform:translateY(-3px);border-color:#a9c3ec}.selection-card h2{font-size:20px;margin:16px 0 6px}.selection-card p{color:var(--muted);margin:0}.selection-icon{width:42px;height:42px;border-radius:13px;background:var(--blue-soft);color:var(--blue-dark);display:grid;place-items:center;font-weight:900}.updated-box{background:#fff;border:1px solid var(--border);border-radius:14px;padding:13px 16px;min-width:230px;box-shadow:0 5px 20px rgba(23,32,51,.04)}.updated-box span{display:block;color:var(--muted);font-size:11px;font-weight:900;letter-spacing:.7px}.updated-box strong{display:block;font-size:17px;margin-top:5px}.updated-box small{display:block;color:var(--muted);margin-top:4px}.kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-bottom:18px}.operational-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.time-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.kpi{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow);position:relative;overflow:hidden}.kpi:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--blue)}.kpi.success:before{background:var(--success)}.kpi.warning:before{background:#e08b00}.kpi.danger:before{background:var(--danger)}.kpi span,.kpi small{display:block;color:var(--muted)}.kpi span{font-size:11px;font-weight:900;letter-spacing:.55px;line-height:1.35;text-transform:uppercase}.kpi strong{display:block;font-size:30px;margin-top:8px}.kpi small{font-size:12px;margin-top:5px}.main-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);gap:18px;align-items:start}.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.card-head{padding:17px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,#fff,#fbfcff)}.card-head h2{font-size:16px;margin:0}.badge{border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800;white-space:nowrap}.badge.green{color:var(--success);background:var(--success-bg)}.badge.red{color:var(--danger);background:var(--danger-bg)}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:14px 20px;text-align:left;border-bottom:1px solid #edf0f5;font-size:14px}th{font-size:11px;text-transform:uppercase;letter-spacing:.55px;color:var(--muted);background:#fafbfd}tr:last-child td{border-bottom:0}.position{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--blue-soft);color:var(--blue-dark);font-weight:900}.wait{font-variant-numeric:tabular-nums;font-weight:800}.wait.attention{color:var(--warning)}.wait.critical{color:var(--danger)}.empty{padding:42px 20px;text-align:center;color:var(--muted)}.empty strong{display:block;color:var(--text);font-size:17px;margin-bottom:6px}.agent-list{padding:8px 0}.agent-row{display:grid;grid-template-columns:88px 1fr auto;gap:12px;align-items:center;padding:13px 20px;border-bottom:1px solid #edf0f5}.agent-row:last-child{border-bottom:0}.ramal{font-size:19px;font-weight:900}.agent-status{display:flex;align-items:center;gap:9px;font-weight:700;font-size:14px}.agent-state-label{display:flex;flex-direction:column;gap:2px}.current-call{font-size:12px;color:var(--muted);font-style:normal;font-weight:700;white-space:normal}.dot{width:10px;height:10px;border-radius:50%;display:inline-block}.dot.available{background:var(--success)}.dot.incall{background:#e08b00}.dot.unavailable{background:var(--danger)}.dot.paused{background:#7c3aed}.status-pill{font-size:11px;font-weight:800;border-radius:999px;padding:6px 9px}.status-pill.available{color:var(--success);background:var(--success-bg)}.status-pill.incall{color:var(--warning);background:var(--warning-bg)}.status-pill.unavailable{color:var(--danger);background:var(--danger-bg)}.status-pill.paused{color:#6d28d9;background:#f1e9ff}.login-screen{min-height:100vh;display:grid;grid-template-columns:minmax(360px,.75fr) minmax(420px,1.25fr);background:#fff}.login-card{width:min(470px,calc(100% - 40px));align-self:center;justify-self:center;padding:32px 0}.login-card h1{font-size:clamp(34px,4vw,52px);line-height:1.02;letter-spacing:-1.8px;margin:6px 0 12px;color:var(--navy)}.lead{color:var(--muted);font-size:16px;line-height:1.7;margin:0 0 30px}.form-stack{display:grid;gap:15px}.form-stack label,.field-label{display:grid;gap:7px;color:var(--text);font-size:13px;font-weight:800}.form-stack input,.form-stack select,.field-label select{width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:12px 13px;background:#fff;color:var(--text);outline:none}.form-stack input:focus,.form-stack select:focus,.field-label select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(11,91,211,.12)}.form-error{color:var(--danger);font-size:13px;min-height:18px;margin:0}.login-foot{font-size:12px;color:var(--muted);margin-top:24px}.login-visual{display:grid;place-items:center;background:linear-gradient(135deg,#073d63,#0b5bd3);padding:7vw;position:relative;overflow:hidden}.login-visual:before,.login-visual:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.16)}.login-visual:before{width:620px;height:620px;right:-240px;top:-190px}.login-visual:after{width:430px;height:430px;left:-230px;bottom:-200px}.visual-panel{max-width:560px;color:#fff;border-radius:28px;padding:34px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);box-shadow:0 20px 60px rgba(0,0,0,.16);backdrop-filter:blur(6px)}.visual-panel span{font-size:11px;letter-spacing:2px;font-weight:900;opacity:.8}.visual-panel strong{display:block;font-size:clamp(28px,4vw,52px);line-height:1.05;letter-spacing:-1.2px;margin:18px 0 30px}.visual-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.visual-grid i{font-style:normal;border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.12);border-radius:10px;padding:12px;font-size:13px}.admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.admin-card{padding-bottom:18px}.admin-card .card-head{margin:-1px -1px 18px}.compact{padding:0 20px}.admin-list{display:grid;gap:8px;margin:18px 20px 0}.admin-list-item{border:1px solid var(--border);border-radius:10px;padding:10px 12px;font-size:13px}.admin-list-item strong{display:block}.admin-list-item small{color:var(--muted)}.check-list{display:grid;gap:8px;padding:15px 20px}.check-item{display:flex;align-items:center;gap:8px;font-size:13px}.check-item input{accent-color:var(--blue)}.admin-card>.field-label{padding:0 20px}.admin-card>.btn{margin:0 20px}.field-label{margin-bottom:2px}.login-screen+.app-shell{display:block}@media(max-width:980px){.login-screen{grid-template-columns:1fr}.login-visual{display:none}.login-card{padding:30px 0}.kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.main-grid{grid-template-columns:1fr}.admin-grid{grid-template-columns:1fr}.hero,.monitor-head{flex-direction:column}.updated-box{width:100%}}@media(max-width:620px){.page{width:calc(100% - 20px);margin-top:18px}.topbar{padding:12px 14px}.topbar .brand span{display:none}.user-badge{display:none}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.kpi{padding:15px}.kpi strong{font-size:25px}.kpi small{font-size:11px}.agent-row{grid-template-columns:70px 1fr;padding:12px 14px}.agent-row .status-pill{display:none}th,td{padding:12px 14px}.login-card{width:min(100% - 34px,470px)}}

.admin-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:20px;align-items:start}.admin-sidebar{padding:0;overflow:hidden;position:sticky;top:96px}.admin-sidebar-head{padding:20px;border-bottom:1px solid var(--border)}.admin-sidebar-head strong{font-size:18px}.admin-nav{padding:10px}.admin-nav-label{padding:14px 12px 6px;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase}.admin-nav-item{display:block;width:100%;border:0;background:transparent;border-radius:10px;padding:11px 12px;text-align:left;color:var(--text);font-weight:800}.admin-nav-item:hover,.admin-nav-item.active{background:var(--blue-soft);color:var(--blue-dark)}.admin-content{min-width:0}.page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px}.page-heading h1{margin:0;font-size:clamp(26px,3vw,38px);letter-spacing:-.8px}.page-heading p{color:var(--muted);margin:8px 0 0}.admin-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.admin-stat{padding:18px 20px}.admin-stat span,.admin-stat small{display:block;color:var(--muted)}.admin-stat span{font-size:11px;font-weight:900;letter-spacing:.6px;text-transform:uppercase}.admin-stat strong{display:block;font-size:30px;margin:9px 0 4px}.admin-stat small{font-size:12px}.admin-summary{padding-bottom:18px}.quick-links{display:flex;flex-wrap:wrap;gap:10px;padding:18px 20px}.filter-bar{display:grid;grid-template-columns:minmax(170px,.35fr) minmax(140px,.25fr) minmax(230px,1fr);gap:14px;padding:16px 20px;margin-bottom:18px}.filter-bar label{display:grid;gap:6px;color:var(--text);font-size:12px;font-weight:800}.filter-bar input,.filter-bar select{width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:10px 12px;background:#fff;color:var(--text)}.filter-search{min-width:0}.admin-form{display:grid;gap:16px;padding:24px;max-width:720px}.admin-form label{display:grid;gap:7px;color:var(--text);font-size:13px;font-weight:800}.admin-form input,.admin-form select{width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:12px 13px;background:#fff;color:var(--text);outline:none}.admin-form input:focus,.admin-form select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(11,91,211,.12)}.admin-form small{color:var(--muted);font-weight:500}.form-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-actions{display:flex;gap:10px;flex-wrap:wrap;padding-top:6px}.switch-label{display:flex!important;align-items:center;gap:9px!important}.switch-label input{width:18px!important;height:18px;accent-color:var(--blue)}.btn-small{padding:7px 10px;font-size:12px}.check-list{display:grid;gap:10px;padding:4px 0}.check-item{display:flex!important;align-items:flex-start;gap:9px;font-size:13px;font-weight:700!important;padding:10px;border:1px solid var(--border);border-radius:10px}.check-item input{width:auto!important;margin-top:2px;accent-color:var(--blue)}.check-item span{display:grid;gap:3px}.check-item small{color:var(--muted)}@media(max-width:980px){.admin-layout{grid-template-columns:1fr}.admin-sidebar{position:static}.admin-nav{display:flex;flex-wrap:wrap;gap:6px}.admin-nav-label{width:100%;padding:10px 12px 2px}.admin-nav-item{width:auto}.admin-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.page-heading{flex-direction:column}.filter-bar{grid-template-columns:1fr}.form-two{grid-template-columns:1fr}.admin-stat-grid{gap:10px}.admin-stat{padding:15px}.admin-stat strong{font-size:25px}}