*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f4f7fb;color:#142033}.app{display:grid;grid-template-columns:210px 1fr;min-height:100vh}.sidebar{background:linear-gradient(180deg,#102235,#0b1a29);color:#fff;padding:24px 14px;display:flex;flex-direction:column}.sidebar nav{display:flex;flex-direction:column;gap:7px}.sidebar nav a{color:#e9f0f7;text-decoration:none;padding:11px 12px;border-radius:7px;display:flex;gap:10px}.sidebar nav a.active{background:#2478ef}.session-card{margin-top:auto;background:rgba(255,255,255,.06);padding:14px;border-radius:10px;line-height:1.45}.session-card strong{display:block;margin-bottom:10px}.session-card small{display:block;color:#9db1c7;margin-top:10px}.topbar{height:64px;background:#102235;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 18px}.topbar h1{font-size:22px;margin:0}.topbar div{font-size:12px;color:#dce7f2}.content{padding:18px}.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.stat,.panel,.subpanel{background:#fff;border:1px solid #dfe6ee;border-radius:10px;box-shadow:0 1px 3px rgba(20,32,51,.05)}.stat{padding:17px;min-height:112px}.stat label{text-transform:uppercase;font-weight:700;font-size:13px}.stat strong{display:block;font-size:31px;margin:8px 0}.stat span{font-size:12px;color:#657386}.stat.pass label,.stat.pass strong{color:#159447}.stat.warning label,.stat.warning strong{color:#ef8d00}.stat.fail label,.stat.fail strong{color:#e33a42}.stat.testing label,.stat.testing strong{color:#1268c9}.bar{height:8px;border-radius:6px;background:#edf1f5;overflow:hidden}.bar i{display:block;height:100%;background:currentColor;border-radius:6px}.panel{margin-top:14px;overflow:hidden}.panel-head,.detail-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #e5eaf0}.panel h2{font-size:17px;margin:0}.button{padding:8px 12px;border:1px solid #d4dce5;border-radius:7px;text-decoration:none;color:#1d2a39;background:#fff}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px}th,td{padding:11px 12px;border-bottom:1px solid #e8edf2;text-align:left;white-space:nowrap}th{font-size:10px;text-transform:uppercase;color:#344052;background:#fafbfd}tbody tr:hover{background:#f7fbff}.selected-row{background:#f0f7ff}td a{color:#0767d7;text-decoration:none;font-weight:700}.badge{display:inline-block;padding:5px 9px;border-radius:5px;color:#fff;font-weight:800;font-size:11px}.badge.pass{background:#63c685}.badge.warning{background:#f1b64f;color:#4b3410}.badge.fail{background:#e7545b}.badge.testing{background:#3488dc}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.detail-head>div:first-child{display:flex;align-items:center;gap:12px}.detail-head h2 span{color:#0868d4}.meta{display:flex;gap:15px;font-size:12px;color:#465569}.detail-grid{display:grid;grid-template-columns:270px 1fr 390px;gap:10px;padding:10px}.subpanel{padding:14px}.subpanel h3{margin:0 0 12px;font-size:13px}.subpanel dl{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px;font-size:12px;margin:0}.subpanel dt{color:#526174}.subpanel dd{margin:0;text-align:right}.legend{font-size:11px;color:#536174;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.dot,.timeline-dot{width:9px;height:9px;border-radius:50%;display:inline-block}.dot.on,.timeline-dot.on{background:#22a95a}.dot.late,.timeline-dot.late{background:#f19a1c}.dot.missing{background:#fff;border:1px solid #e4474e}.square,.timeline-square{width:8px;height:8px;background:#202833;display:inline-block}.dots{display:flex;flex-wrap:wrap;gap:8px;padding:18px 0;border-bottom:1px solid #e8edf2;margin-bottom:12px}.events{list-style:none;padding:0;margin:0;font-size:11px;display:grid;grid-template-columns:1fr;gap:7px 12px}.events time{font-family:ui-monospace,monospace;color:#48617c;margin-right:7px}.compact th,.compact td{padding:8px 6px}.compact td:first-child{font-weight:600}details{margin:0 10px 10px;border:1px solid #e0e7ef;border-radius:8px;padding:10px}summary{cursor:pointer;font-weight:700;font-size:12px}pre{white-space:pre-wrap;word-break:break-all;background:#0d1722;color:#d7e3ef;padding:12px;border-radius:6px;font-size:11px}footer{padding:16px 4px;color:#637184;font-size:11px}.empty{text-align:center;padding:35px;color:#667587}@media(max-width:1200px){.cards{grid-template-columns:repeat(2,1fr)}.detail-grid{grid-template-columns:1fr}.app{grid-template-columns:170px 1fr}}@media(max-width:760px){.app{display:block}.sidebar{display:none}.topbar{height:auto;padding:14px;align-items:flex-start;gap:12px}.cards{grid-template-columns:1fr}.content{padding:10px}.meta{display:none}}
.latest-values{padding:12px}
.latest-values h3{font-size:16px;margin-bottom:4px}
.profile-note{font-size:11px;color:#64748b;margin:0 0 10px}
.values-table{border-collapse:separate;border-spacing:0 4px}
.values-table thead th{background:#f7f9fc;padding:8px 10px}
.values-table td{padding:8px 10px;border-bottom:0}
.values-table .value-row td:first-child{font-weight:700}
.values-table .value-row.ok td{background:#edf9f0;color:#08752e}
.values-table .value-row.bad td{background:#fff0f0;color:#cf1f1f}
.values-table .value-row.na td{background:#f4f6f8;color:#667085}
.values-table .value-row.charging td{background:#168bff;color:#fff}
.values-table .value-row td:first-child{border-radius:7px 0 0 7px}
.values-table .value-row td:last-child{border-radius:0 7px 7px 0}
.values-legend{display:flex;gap:18px;flex-wrap:wrap;font-size:10px;color:#596579;margin-top:8px}
.values-legend span{display:flex;align-items:center;gap:6px}
.legend-swatch{width:9px;height:9px;border-radius:50%;display:inline-block}
.legend-swatch.ok{background:#20a657}
.legend-swatch.bad{background:#ef4444}
.legend-swatch.na{background:#cbd5e1}

.menu-toggle{border:0;background:transparent;color:#fff;font-size:24px;cursor:pointer;padding:4px 8px;margin-right:8px}
.topbar{justify-content:flex-start;gap:8px}
.topbar>div:last-child{margin-left:auto}
.app.sidebar-collapsed{grid-template-columns:64px 1fr}
.app.sidebar-collapsed .sidebar{padding-left:8px;padding-right:8px}
.app.sidebar-collapsed 

.app.sidebar-collapsed .sidebar nav a{justify-content:center}
.app.sidebar-collapsed .sidebar nav a span{display:none}
.app.sidebar-collapsed .session-card{display:none}
.dot.issue,.timeline-dot.issue{background:#ef4444}
.dot.location,.timeline-dot.location{background:#2889e9}
.accessory-reporting-head{display:flex;align-items:center;gap:10px;margin-top:-4px;font-size:10px;color:#667085}
.accessory-reporting-head strong{font-size:11px;color:#344054;margin-right:3px}
.accessory-reporting-head span{display:flex;align-items:center;gap:4px}
.accessory-key,.accessory-report-dot{display:inline-block;width:9px;height:9px;border-radius:50%}
.accessory-key.pass,.accessory-report-dot.pass{background:#39ff88;box-shadow:0 0 5px rgba(57,255,136,.8)}
.accessory-key.fail,.accessory-report-dot.fail{background:#b026ff;box-shadow:0 0 5px rgba(176,38,255,.8)}
.dots.accessory-dots{padding:10px 0 16px;margin-bottom:12px}
.badge.accessory-na{background:#98a2b3}
.event-issue{color:#d92d20}
.event-recovered{color:#16803d}
.event-location{color:#1769aa}
.event-type{color:#1268c9}
.failure-reason{margin-top:14px;padding:12px;border:1px solid #fecaca;background:#fff1f2;border-radius:8px;color:#b42318;font-size:11px;line-height:1.45}
.failure-reason strong,.failure-reason span{display:block}
.failure-reason strong{margin-bottom:4px}
@media(max-width:760px){
  .app.sidebar-collapsed{display:block}
  .menu-toggle{display:none}
}

.sidebar nav{margin-top:8px}
.delete-col,.delete-cell{width:42px;text-align:center}
.delete-form{margin:0;display:inline-flex}




.cloud-test-title{
    font-size:19px;
    font-weight:800;
    letter-spacing:1.2px;
    margin:0 8px 22px;
    color:#fff;
    white-space:nowrap
}
.app.sidebar-collapsed .cloud-test-title{
    font-size:0;
    margin:0 0 16px;
    text-align:center
}
.app.sidebar-collapsed .cloud-test-title::after{
    content:"CT";
    font-size:17px;
    color:#fff
}
#devices table{min-width:1320px}
#devices th,#devices td{padding-top:7px;padding-bottom:7px}
.delete-col,.delete-cell{
    width:50px;
    min-width:50px;
    max-width:50px;
    text-align:center;
    position:sticky;
    right:0;
    background:#fff;
    z-index:2
}
#devices thead .delete-col{background:#fafbfd;z-index:3}
#devices tbody tr:hover .delete-cell,
#devices tbody tr.selected-row .delete-cell{background:inherit}



.cloud-test-title{
    font-size:19px;
    font-weight:800;
    letter-spacing:1.2px;
    margin:0 8px 22px;
    color:#fff;
    white-space:nowrap
}
.app.sidebar-collapsed .cloud-test-title{
    font-size:0;
    margin:0 0 16px;
    text-align:center
}
.app.sidebar-collapsed .cloud-test-title::after{
    content:"CT";
    font-size:17px;
    color:#fff
}
.delete-col,.delete-cell{
    width:76px;
    min-width:76px;
    max-width:76px;
    text-align:center;
    position:sticky;
    right:0;
    background:#fff;
    z-index:2
}
#devices thead .delete-col{
    background:#fafbfd;
    z-index:3;
    color:#667085;
    font-weight:800
}
#devices tbody tr:hover .delete-cell,
#devices tbody tr.selected-row .delete-cell{
    background:inherit
}
.delete-device{
    border:1px solid #cbd5e1;
    border-radius:5px;
    background:#f8fafc;
    color:#667085;
    cursor:pointer;
    font-size:10px;
    font-weight:800;
    letter-spacing:.4px;
    padding:6px 8px;
    line-height:1
}
.delete-device:hover{
    background:#e5e7eb;
    border-color:#98a2b3;
    color:#344054
}

/* Force the delete control to remain visible at all widths */
#devices .table-wrap{overflow-x:auto}
#devices table{min-width:1380px}
#devices th.delete-col,
#devices td.delete-cell{
    display:table-cell !important;
    width:86px !important;
    min-width:86px !important;
    max-width:86px !important;
    padding:6px 8px !important;
    text-align:center !important;
    position:sticky !important;
    right:0 !important;
    z-index:8 !important;
    background:#fff !important;
    box-shadow:-4px 0 6px rgba(20,32,51,.08)
}
#devices th.delete-col{
    background:#f8fafc !important;
    color:#475467 !important;
    font-weight:800 !important
}
#devices tr.selected-row td.delete-cell{background:#f0f7ff !important}
#devices tbody tr:hover td.delete-cell{background:#f7fbff !important}
.delete-form{display:block !important;margin:0 !important}
.delete-device{
    display:inline-block !important;
    visibility:visible !important;
    opacity:1 !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    border:1px solid #98a2b3 !important;
    border-radius:5px !important;
    background:#f2f4f7 !important;
    color:#475467 !important;
    font:800 10px/1 Arial,sans-serif !important;
    letter-spacing:.4px !important;
    padding:7px 9px !important;
    cursor:pointer !important
}
.delete-device:hover{
    background:#e4e7ec !important;
    color:#101828 !important
}

/* Accessory output history */
.accessories-panel{
    margin:0 10px 10px;
    border:1px solid #dfe6ee;
    border-radius:10px;
    background:#f8fbff;
    overflow:hidden
}
.accessories-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:16px 18px;
    background:#fff;
    border-bottom:1px solid #dfe6ee
}
.accessories-head h2{margin:0;font-size:18px}
.accessories-head p{margin:5px 0 0;color:#657386;font-size:12px}
.accessories-grid{
    display:grid;
    grid-template-columns:minmax(520px,2fr) minmax(180px,.7fr) minmax(180px,.7fr);
    gap:12px;
    padding:12px
}
.alarm-soak,.accessory-card{
    background:#fff;
    border:1px solid #dfe6ee;
    border-radius:10px;
    padding:16px
}
.alarm-title{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;
    margin-bottom:18px
}
.alarm-title h3,.accessory-card h3{margin:0;font-size:15px}
.alarm-title span{color:#657386;font-size:12px}
.output-history-row{
    display:grid;
    grid-template-columns:42px 1fr;
    align-items:center;
    gap:10px;
    margin:12px 0
}
.output-history-row>strong{font-size:12px;color:#344054}
.output-history-bar{
    display:flex;
    height:18px;
    overflow:hidden;
    border-radius:6px;
    background:#e9eef5;
    box-shadow:inset 0 0 0 1px rgba(15,23,42,.05)
}
.output-history-bar i{
    display:block;
    flex:1 1 0;
    min-width:3px;
    height:100%
}
.output-history-bar i.waiting,.output-history-legend i.waiting{background:#f4c542}
.output-history-bar i.confirmed-on,.output-history-legend i.confirmed-on{background:#28ad62}
.output-history-bar i.confirmed-off,.output-history-legend i.confirmed-off{background:#3488dc}
.output-history-bar i.failed,.output-history-legend i.failed{background:#e5484d}
.output-history-legend{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin:14px 0 0 52px;
    color:#657386;
    font-size:11px
}
.output-history-legend span{display:flex;align-items:center;gap:6px}
.output-history-legend i{width:10px;height:10px;border-radius:3px}
.accessory-phase{
    margin-top:15px;
    padding:10px 12px;
    border-radius:7px;
    background:#f4f7fb;
    color:#657386;
    font-size:12px
}
.accessory-phase strong{color:#142033}
.accessory-empty{
    padding:22px;
    border-radius:7px;
    background:#f4f7fb;
    color:#657386;
    text-align:center;
    font-size:12px
}
.accessory-card p{font-size:12px;color:#657386;margin:14px 0}
.accessory-card p.received{color:#16803d;font-weight:700}
.accessory-value{
    display:inline-block;
    margin-top:14px;
    padding:6px 9px;
    border-radius:6px;
    background:#eef2f6;
    color:#667085;
    font-size:11px
}
.accessory-value.on{background:#dcfce7;color:#08752e}
.accessory-value.off{background:#e8f2ff;color:#1268c9}
@media(max-width:1100px){
    .accessories-grid{grid-template-columns:1fr 1fr}
    .alarm-soak{grid-column:1/-1}
}
@media(max-width:650px){
    .accessories-grid{grid-template-columns:1fr}
    .alarm-soak{grid-column:auto}
    .alarm-title{align-items:flex-start;flex-direction:column}
    .output-history-legend{margin-left:0}
}

/* Full-width dashboard: the legacy sidebar and hamburger have been removed. */
.app{display:block;min-height:100vh}
.app main{width:100%}
.topbar{justify-content:space-between}

/* Reset and delete actions */
#devices th.delete-col,
#devices td.delete-cell{
    width:164px !important;
    min-width:164px !important;
    max-width:164px !important
}
.delete-cell .delete-form{
    display:inline-block !important;
    margin:0 2px !important
}
.reset-device{
    display:inline-block;
    border:1px solid #3488dc;
    border-radius:5px;
    background:#edf6ff;
    color:#1268c9;
    font:800 10px/1 Arial,sans-serif;
    letter-spacing:.4px;
    padding:7px 9px;
    cursor:pointer
}
.reset-device:hover{
    background:#3488dc;
    color:#fff
}

/* Sortable device summary and IMEI copy control */
.sortable-column{
    cursor:pointer;
    user-select:none;
    padding-right:22px !important;
    position:relative
}
.sortable-column::after{
    content:"↕";
    position:absolute;
    right:7px;
    color:#98a2b3;
    font-size:11px
}
.sortable-column.sort-asc::after{
    content:"▲";
    color:#1268c9
}
.sortable-column.sort-desc::after{
    content:"▼";
    color:#1268c9
}
.sortable-column:focus-visible{
    outline:2px solid #3488dc;
    outline-offset:-2px
}
.device-id-cell{
    display:flex;
    align-items:center;
    gap:7px
}
.copy-imei{
    width:25px;
    height:25px;
    padding:0;
    border:1px solid #cbd5e1;
    border-radius:5px;
    background:#fff;
    color:#667085;
    cursor:pointer;
    font:700 15px/1 Arial,sans-serif
}
.copy-imei:hover{
    border-color:#3488dc;
    color:#1268c9;
    background:#edf6ff
}
.copy-imei.copied{
    border-color:#28ad62;
    color:#16803d;
    background:#edf9f0
}