@import "https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700&display=swap";:root{--font-sans:"Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--color-primary:#25437a;--color-primary-hover:#1b325c;--color-primary-light:#e9eef7;--color-success:#639922;--color-success-light:#f0f7e6;--color-late:#ba7517;--color-late-light:#fdf5e8;--color-absent:#e24b4a;--color-absent-light:#fdeeed;--color-leave:#378add;--color-leave-light:#ebf4fc;--color-holiday:#8a94a6;--color-holiday-light:#f3f5f8;--color-ot:#8b5cf6;--color-ot-light:#f5f3ff;--color-bg:#f5f7fa;--color-card:#fff;--color-border:#e2e8f0;--border-style:.5px solid var(--color-border);--color-text:#475569;--color-text-dark:#0f172a;--color-text-light:#94a3b8;--radius-sm:8px;--radius-lg:12px;font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;margin:0}*,:before,:after{box-sizing:border-box}button,input{font-family:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}.app-layout{background-color:var(--color-bg);align-items:stretch;width:100%;min-height:100vh;display:flex;position:relative}.main-container{flex-direction:column;flex:1;width:calc(100% - 260px);min-width:0;display:flex;overflow-x:hidden}.main-content-inner{flex-direction:column;gap:24px;width:100%;max-width:1600px;margin:0 auto;padding:24px;display:flex}.header{background-color:var(--color-card);border:none;border-bottom:var(--border-style);z-index:100;border-radius:0;justify-content:space-between;align-items:center;width:100%;padding:16px 24px;display:flex;position:sticky;top:0;box-shadow:0 4px 6px -1px #00000005}.title{color:var(--color-primary);margin:0;font-size:24px;font-weight:700}.month-navigator{align-items:center;gap:16px;display:flex}.nav-btn{border:var(--border-style);border-radius:var(--radius-sm);width:36px;height:36px;color:var(--color-text);cursor:pointer;background-color:#0000;justify-content:center;align-items:center;transition:all .2s;display:flex}.nav-btn:hover{background-color:var(--color-primary-light);color:var(--color-primary);border-color:var(--color-primary)}.month-display{color:var(--color-text-dark);text-align:center;min-width:120px;font-size:16px;font-weight:600}.stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.stats-card{background-color:var(--color-card);border-radius:var(--radius-lg);border:var(--border-style);flex-direction:column;gap:8px;padding:20px;display:flex}.stats-label{color:var(--color-text-light);font-size:14px;font-weight:600}.stats-value-row{justify-content:space-between;align-items:baseline;display:flex}.stats-value{color:var(--color-text-dark);font-size:28px;font-weight:700}.stats-badge{border-radius:9999px;padding:4px 8px;font-size:12px;font-weight:600}.stats-badge.success{background-color:var(--color-success-light);color:var(--color-success)}.stats-badge.late{background-color:var(--color-late-light);color:var(--color-late)}.stats-badge.absent{background-color:var(--color-absent-light);color:var(--color-absent)}.stats-badge.leave{background-color:var(--color-leave-light);color:var(--color-leave)}.toolbar{background-color:var(--color-card);border-radius:var(--radius-lg);border:var(--border-style);justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;display:flex}.search-box{flex:1;align-items:center;gap:12px;max-width:500px;display:flex}.search-wrapper{flex:1;position:relative}.search-icon{color:var(--color-text-light);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.search-input{border:var(--border-style);border-radius:var(--radius-sm);outline:none;width:100%;padding:10px 12px 10px 40px;font-size:14px;transition:all .2s}.search-input:focus{border-color:var(--color-primary);background-color:var(--color-primary-light)}.dept-select{border:var(--border-style);border-radius:var(--radius-sm);background-color:var(--color-card);color:var(--color-text);cursor:pointer;outline:none;padding:10px 16px;font-size:14px}.dept-select:focus{border-color:var(--color-primary)}.export-btn{background-color:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:8px;padding:10px 16px;font-size:14px;font-weight:600;transition:background-color .2s;display:flex}.export-btn:hover{background-color:var(--color-primary-hover)}.table-card{background-color:var(--color-card);border-radius:var(--radius-lg);border:var(--border-style);-webkit-overflow-scrolling:touch;overflow-x:auto}.attendance-table{border-collapse:collapse;text-align:left;width:100%}.attendance-table th{background-color:var(--color-bg);color:var(--color-text-light);border-bottom:var(--border-style);text-transform:uppercase;letter-spacing:.5px;padding:14px 16px;font-size:13px;font-weight:600}.table-row{border-bottom:var(--border-style);cursor:pointer;transition:background-color .15s}.table-row:hover{background-color:#f8fafc}.table-row.expanded{background-color:var(--color-primary-light)}.attendance-table td{color:var(--color-text-dark);padding:14px 16px;font-size:14px}.employee-cell{align-items:center;gap:12px;display:flex}.avatar-badge{background-color:var(--color-primary-light);width:36px;height:36px;color:var(--color-primary);text-transform:uppercase;border-radius:50%;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.emp-info{flex-direction:column;display:flex}.emp-name{color:var(--color-text-dark);font-weight:600}.emp-code{color:var(--color-text-light);font-size:12px}.dept-tag{border-radius:var(--radius-sm);color:#475569;background-color:#f1f5f9;padding:2px 8px;font-size:12px;font-weight:600;display:inline-block}.number-cell{font-weight:600}.number-cell.warning{color:var(--color-late)}.number-cell.danger{color:var(--color-absent)}.mini-bar{align-items:center;gap:2.5px;display:flex}.mini-day{cursor:pointer;border-radius:2.5px;width:13px;height:20px;position:relative}.mini-day.p{background-color:var(--color-success)}.mini-day.l{background-color:var(--color-late)}.mini-day.a{background-color:var(--color-absent)}.mini-day.v{background-color:var(--color-leave)}.mini-day.h{background-color:#cbd5e1}.mini-day.o{background-color:var(--color-ot)}.mini-day.f{opacity:.5;background-color:#e2e8f0}.tooltip{visibility:hidden;background-color:var(--color-text-dark);color:#fff;text-align:center;white-space:nowrap;z-index:10;opacity:0;border-radius:4px;padding:4px 8px;font-size:11px;transition:opacity .2s;position:absolute;bottom:130%;left:50%;transform:translate(-50%);box-shadow:0 4px 6px -1px #0000001a}.tooltip:after{content:"";border-style:solid;border-width:4px;border-color:var(--color-text-dark) transparent transparent transparent;position:absolute;top:100%;left:50%;transform:translate(-50%)}.mini-day:hover .tooltip{visibility:visible;opacity:.9}.pill-badge{border-radius:9999px;align-items:center;padding:4px 10px;font-size:12px;font-weight:600;display:inline-flex}.pill-badge.present{background-color:var(--color-success-light);color:var(--color-success)}.pill-badge.late{background-color:var(--color-late-light);color:var(--color-late)}.pill-badge.absent{background-color:var(--color-absent-light);color:var(--color-absent)}.pill-badge.leave{background-color:var(--color-leave-light);color:var(--color-leave)}.pill-badge.holiday{background-color:var(--color-holiday-light);color:var(--color-holiday)}.pill-badge.ot{background-color:var(--color-ot-light);color:var(--color-ot)}.legend-section{background-color:var(--color-card);border-radius:var(--radius-lg);border:var(--border-style);flex-wrap:wrap;align-items:center;gap:24px;padding:16px 24px;display:flex}.legend-title{color:var(--color-text-light);text-transform:uppercase;font-size:13px;font-weight:600}.legend-items{flex-wrap:wrap;gap:16px;display:flex}.legend-item{align-items:center;gap:8px;font-size:13px;display:flex}.legend-dot{border-radius:3px;width:12px;height:12px}.legend-dot.p{background-color:var(--color-success)}.legend-dot.l{background-color:var(--color-late)}.legend-dot.a{background-color:var(--color-absent)}.legend-dot.v{background-color:var(--color-leave)}.legend-dot.h{background-color:#cbd5e1}.legend-dot.o{background-color:var(--color-ot)}.expanded-row{border-bottom:var(--border-style);background-color:#f8fafc}.expanded-container{flex-direction:column;gap:20px;padding:24px;display:flex}.expanded-header-row{justify-content:space-between;align-items:center;display:flex}.expanded-title{color:var(--color-primary);margin:0;font-size:16px;font-weight:700}.expanded-grid{grid-template-columns:2fr 1fr;gap:24px;display:grid}@media (width<=1024px){.expanded-grid{grid-template-columns:1fr}}.expanded-left{flex-direction:column;gap:16px;display:flex}.card-stats-5{grid-template-columns:repeat(5,1fr);gap:10px;display:grid}.mini-stats-card{background-color:var(--color-card);border:var(--border-style);border-radius:var(--radius-sm);flex-direction:column;align-items:center;gap:4px;padding:12px;display:flex}.mini-stats-val{color:var(--color-text-dark);font-size:18px;font-weight:700}.mini-stats-lbl{color:var(--color-text-light);text-align:center;font-size:11px;font-weight:600}.calendar-wrapper{background-color:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);padding:16px}.calendar-grid{grid-template-columns:repeat(7,1fr);gap:6px;display:grid}.calendar-header{text-align:center;color:var(--color-text-light);text-transform:uppercase;padding-bottom:8px;font-size:12px;font-weight:700}.calendar-cell{aspect-ratio:1;border-radius:var(--radius-sm);flex-direction:column;justify-content:space-between;padding:6px;font-size:12px;font-weight:600;transition:transform .1s;display:flex;position:relative}.calendar-cell:hover{z-index:2;transform:scale(1.05)}.calendar-cell.empty{background-color:#0000;border:none}.calendar-cell.p{background-color:var(--color-success-light);border:.5px solid var(--color-success);color:var(--color-success)}.calendar-cell.l{background-color:var(--color-late-light);border:.5px solid var(--color-late);color:var(--color-late)}.calendar-cell.a{background-color:var(--color-absent-light);border:.5px solid var(--color-absent);color:var(--color-absent)}.calendar-cell.v{background-color:var(--color-leave-light);border:.5px solid var(--color-leave);color:var(--color-leave)}.calendar-cell.h{background-color:var(--color-holiday-light);color:var(--color-holiday);border:.5px solid #cbd5e1}.calendar-cell.o{background-color:var(--color-ot-light);border:.5px solid var(--color-ot);color:var(--color-ot)}.calendar-cell.f{color:var(--color-text-light);opacity:.6;background-color:#f8fafc;border:.5px dashed #cbd5e1}.calendar-date{align-self:flex-start}.calendar-status{border-radius:4px;align-self:flex-end;padding:2px 4px;font-size:9px;font-weight:700}.calendar-cell.p .calendar-status{background-color:var(--color-success);color:#fff}.calendar-cell.l .calendar-status{background-color:var(--color-late);color:#fff}.calendar-cell.a .calendar-status{background-color:var(--color-absent);color:#fff}.calendar-cell.v .calendar-status{background-color:var(--color-leave);color:#fff}.calendar-cell.h .calendar-status{background-color:var(--color-holiday);color:#fff}.calendar-cell.o .calendar-status{background-color:var(--color-ot);color:#fff}.calendar-cell-top{justify-content:space-between;align-items:center;width:100%;display:flex}.calendar-cell-times{flex-direction:column;align-items:stretch;gap:3px;width:100%;margin-top:auto;display:flex}.calendar-time-row{border-radius:4px;justify-content:space-between;align-items:center;gap:3px;padding:1px 4px;font-size:9.5px;font-weight:600;display:flex}.calendar-time-row svg{flex-shrink:0}.calendar-time-row.in{color:var(--color-success);background-color:#63992214}.calendar-time-row.out{color:var(--color-leave);background-color:#378add14}.calendar-cell.o .calendar-time-row.out{color:var(--color-ot);background-color:#8b5cf614}.expanded-actions{flex-direction:column;justify-content:center;gap:12px;display:flex}.action-btn-outline{background-color:var(--color-card);border:var(--border-style);border-radius:var(--radius-sm);color:var(--color-text-dark);cursor:pointer;justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-size:14px;font-weight:600;transition:all .2s;display:flex}.action-btn-outline:hover{background-color:var(--color-primary-light);color:var(--color-primary);border-color:var(--color-primary)}.action-btn-primary{background-color:var(--color-primary);border-radius:var(--radius-sm);color:#fff;cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-size:14px;font-weight:600;transition:background-color .2s;display:flex}.action-btn-primary:hover{background-color:var(--color-primary-hover)}.modal-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:100;background-color:#0f172a66;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--color-card);border-radius:var(--radius-lg);border:var(--border-style);flex-direction:column;width:100%;max-width:900px;max-height:90svh;display:flex;overflow:hidden}.modal-employee-header{align-items:center;gap:16px;display:flex}.modal-avatar{background-color:var(--color-primary-light);width:48px;height:48px;color:var(--color-primary);text-transform:uppercase;border-radius:50%;justify-content:center;align-items:center;font-size:18px;font-weight:700;display:flex}.modal-emp-info{flex-direction:column;gap:2px;display:flex}.modal-emp-name{color:var(--color-text-dark);font-size:18px;font-weight:700}.modal-emp-meta{color:var(--color-text-light);font-size:13px;font-weight:500}.modal-close{color:var(--color-text-light);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.modal-close:hover{color:var(--color-text-dark);background-color:#f1f5f9}.modal-body{flex-direction:column;gap:24px;padding:24px;display:flex;overflow-y:auto}.modal-stats-row{grid-template-columns:repeat(5,1fr);gap:12px;display:grid}.modal-stat-card{border:var(--border-style);border-radius:var(--radius-sm);background-color:var(--color-bg);flex-direction:column;align-items:center;gap:4px;padding:14px;display:flex}.modal-stat-label{color:var(--color-text-light);font-size:12px;font-weight:600}.modal-stat-value{color:var(--color-text-dark);font-size:20px;font-weight:700}.modal-stat-card.warning .modal-stat-value{color:var(--color-late)}.modal-stat-card.danger .modal-stat-value{color:var(--color-absent)}.modal-stat-card.info .modal-stat-value{color:var(--color-success)}.filter-pills{border-bottom:var(--border-style);flex-wrap:wrap;gap:8px;padding-bottom:16px;display:flex}.filter-pill{border:var(--border-style);color:var(--color-text);cursor:pointer;background-color:#0000;border-radius:9999px;padding:6px 16px;font-size:13px;font-weight:600;transition:all .2s}.filter-pill:hover{background-color:#f1f5f9;border-color:#cbd5e1}.filter-pill.active{background-color:var(--color-primary);border-color:var(--color-primary);color:#fff}.logs-list{flex-direction:column;gap:16px;display:flex}.day-block{border:var(--border-style);border-radius:var(--radius-lg);background-color:var(--color-card);overflow:hidden}.day-header-summary{cursor:pointer;background-color:var(--color-card);justify-content:space-between;align-items:center;padding:14px 20px;transition:background-color .15s;display:flex}.day-header-summary:hover{background-color:#f8fafc}.day-title-info{align-items:center;gap:16px;display:flex}.day-date{color:var(--color-text-dark);font-size:14px;font-weight:700}.day-dow{color:var(--color-text-light);background-color:#f1f5f9;border-radius:4px;padding:2px 6px;font-size:12px;font-weight:700}.day-chips{align-items:center;gap:8px;display:flex}.chip-io{border-radius:var(--radius-sm);align-items:center;gap:4px;padding:4px 10px;font-size:12px;font-weight:600;display:flex}.chip-io.in{background-color:var(--color-success-light);color:var(--color-success)}.chip-io.out{background-color:var(--color-leave-light);color:var(--color-leave)}.chip-badge{text-transform:uppercase;border-radius:4px;padding:2px 6px;font-size:11px;font-weight:700}.chip-badge.warning{color:#d97706;background-color:#fef3c7}.chip-badge.danger{color:#dc2626;background-color:#fee2e2}.chip-badge.info{color:#0284c7;background-color:#e0f2fe}.day-right-side{align-items:center;gap:12px;display:flex}.day-details{border-top:var(--border-style);background-color:#fafbfd;flex-direction:column;gap:16px;padding:20px 24px;display:flex}.timeline{flex-direction:column;gap:16px;padding-left:24px;display:flex;position:relative}.timeline:before{content:"";background-color:var(--color-border);width:2px;position:absolute;top:6px;bottom:6px;left:7px}.timeline-event{justify-content:space-between;align-items:center;gap:16px;font-size:13.5px;display:flex;position:relative}.timeline-dot{background-color:#cbd5e1;border:3px solid #fff;border-radius:50%;width:14px;height:14px;position:absolute;left:-22px}.timeline-dot.in{background-color:var(--color-success)}.timeline-dot.out{background-color:var(--color-leave)}.timeline-dot.manual{background-color:var(--color-holiday)}.event-details{align-items:center;gap:8px;display:flex}.event-time{color:var(--color-text-dark);font-weight:700}.event-label{color:var(--color-text);font-weight:500}.source-tag{border-radius:4px;padding:2px 6px;font-size:11px;font-weight:600}.source-tag.face{background-color:var(--color-success-light);color:var(--color-success)}.source-tag.manual{color:var(--color-text-light);background-color:#f1f5f9}.event-note{color:var(--color-text-light);margin-top:2px;font-size:12px;font-style:italic}.day-summary-bar{border:var(--border-style);border-radius:var(--radius-sm);color:var(--color-text);background-color:#fff;justify-content:space-between;align-items:center;padding:12px 16px;font-size:13px;font-weight:600;display:flex}.summary-value{color:var(--color-text-dark)}.day-actions{gap:8px;display:flex}.mini-action-btn{border:var(--border-style);border-radius:var(--radius-sm);color:var(--color-text-dark);cursor:pointer;background-color:#0000;align-items:center;gap:4px;padding:6px 12px;font-size:12px;font-weight:600;transition:all .2s;display:flex}.mini-action-btn:hover{background-color:var(--color-primary-light);color:var(--color-primary);border-color:var(--color-primary)}.mini-action-btn.primary{background-color:var(--color-primary);border-color:var(--color-primary);color:#fff}.mini-action-btn.primary:hover{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover);color:#fff}.loading-overlay{min-height:200px;color:var(--color-text-light);justify-content:center;align-items:center;font-weight:600;display:flex}.toast-msg{background-color:var(--color-text-dark);color:#fff;border-radius:var(--radius-sm);z-index:1000;padding:12px 24px;font-size:14px;font-weight:600;position:fixed;bottom:24px;right:24px;box-shadow:0 4px 12px #00000026}.connection-banner{border-radius:var(--radius-lg);justify-content:space-between;align-items:center;padding:12px 20px;animation:.35s ease-out slideDown;display:flex}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.connection-banner.warning{color:#92400e;background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);border:1px solid #f59e0b}.connection-banner.success{color:#166534;background:linear-gradient(135deg,#dcfce7 0%,#bbf7d0 100%);border:1px solid #22c55e}.banner-content{align-items:center;gap:12px;display:flex}.banner-text{flex-direction:column;gap:2px;display:flex}.banner-text strong{font-size:14px;font-weight:700}.banner-text span{opacity:.85;font-size:12px}.banner-retry-btn{border-radius:var(--radius-sm);color:#92400e;cursor:pointer;background:#ffffffd9;border:1px solid #f59e0b;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .2s;display:flex}.banner-retry-btn:hover{background:#fff;transform:translateY(-1px);box-shadow:0 2px 8px #f59e0b40}.banner-status-dot{border-radius:50%;flex-shrink:0;width:12px;height:12px}.banner-status-dot.connected{background-color:#22c55e;animation:2s infinite pulse-dot;box-shadow:0 0 8px #22c55e80}@keyframes pulse-dot{0%,to{box-shadow:0 0 4px #22c55e66}50%{box-shadow:0 0 12px #22c55eb3}}.header-right{align-items:center;gap:20px;display:flex}.connection-indicator{align-items:center;display:flex}.conn-badge{letter-spacing:.3px;border-radius:20px;align-items:center;gap:6px;padding:6px 14px;font-size:12px;font-weight:700;transition:all .2s;display:inline-flex}.conn-badge.connected{color:#166534;background:linear-gradient(135deg,#dcfce7,#bbf7d0);border:1px solid #86efac}.conn-badge.disconnected{color:#92400e;cursor:pointer;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #fbbf24}.conn-badge.disconnected:hover{background:linear-gradient(135deg,#fde68a,#fcd34d);box-shadow:0 2px 8px #fbbf244d}.conn-badge.loading{color:#3730a3;background:linear-gradient(135deg,#e0e7ff,#c7d2fe);border:1px solid #a5b4fc}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=1200px){.main-content-inner{gap:16px;padding:16px}}@media (width<=1024px){.stats-grid{grid-template-columns:repeat(2,1fr);gap:12px}.expanded-grid{grid-template-columns:1fr;gap:16px}.expanded-actions{flex-direction:row;justify-content:stretch;width:100%}.action-btn-primary,.action-btn-outline{flex:1;padding:10px 14px;font-size:13px}}@media (width<=768px){.header{flex-direction:column;align-items:stretch;gap:12px;padding:12px 16px}.header-left{justify-content:flex-start;align-items:center;gap:10px;width:100%;display:flex}.header-left .title{white-space:nowrap;text-overflow:ellipsis;font-size:18px;font-weight:700;overflow:hidden}.header-right{flex-flow:wrap;justify-content:space-between;align-items:center;gap:10px;width:100%}.month-navigator{flex:1;justify-content:space-between;min-width:0}.month-display{flex:1;min-width:0;font-size:14px}.connection-indicator{justify-content:center;width:auto}.conn-badge{justify-content:center;width:auto;padding:4px 8px;font-size:11.5px}.connection-banner{flex-direction:column;align-items:stretch;gap:12px;padding:12px 16px}.banner-retry-btn{justify-content:center;width:100%}.stats-grid{grid-template-columns:repeat(2,1fr)}.toolbar{flex-direction:column;align-items:stretch;gap:12px;padding:16px}.search-box{flex-direction:column;gap:10px;width:100%;max-width:none}.search-wrapper,.dept-select{width:100%}.export-btn{justify-content:center;width:100%}.attendance-table{min-width:980px}.card-stats-5{grid-template-columns:repeat(3,1fr);gap:8px}.mini-stats-card{padding:8px}.mini-stats-val{font-size:16px}.mini-stats-lbl{font-size:10px}.modal-overlay{padding:8px}.modal-content{max-height:96svh}.modal-header{padding:16px}.modal-employee-header{gap:10px}.modal-avatar{width:40px;height:40px;font-size:15px}.modal-emp-name{font-size:16px}.modal-emp-meta{font-size:11px;line-height:1.4}.modal-body{gap:16px;padding:16px}.modal-stats-row{grid-template-columns:repeat(3,1fr);gap:8px}.day-header-summary{flex-direction:column;align-items:stretch;gap:10px;padding:12px 16px}.day-title-info{flex-wrap:wrap;gap:8px}.day-chips{flex-wrap:wrap;gap:6px;width:100%}.chip-io{padding:3px 8px;font-size:11px}.day-right-side{border-top:1px dashed var(--color-border);justify-content:space-between;width:100%;margin-top:2px;padding-top:10px}.day-details{gap:12px;padding:14px 16px}.timeline{padding-left:16px}.timeline:before{left:4px}.timeline-dot{border-width:2px;width:10px;height:10px;left:-19px}.timeline-event{flex-direction:column;align-items:flex-start;gap:4px}.day-actions{flex-direction:column;gap:8px}.mini-action-btn{justify-content:center;width:100%}.legend-section{flex-direction:column;align-items:flex-start;gap:12px;padding:16px}.legend-items{gap:10px 14px}}@media (width<=480px){.stats-grid{grid-template-columns:1fr;gap:8px}.stats-card{padding:16px}.stats-value{font-size:24px}.card-stats-5{grid-template-columns:repeat(2,1fr)}.card-stats-5>:last-child{grid-column:span 2}.expanded-actions{flex-direction:column}.calendar-grid{gap:4px}.calendar-cell{padding:4px 2px;font-size:10px}.calendar-status{padding:1px;font-size:7px}.modal-stats-row{grid-template-columns:repeat(2,1fr)}.modal-stats-row>:last-child{grid-column:span 2}}.login-screen-container{color:#fff;z-index:9999;background:linear-gradient(135deg,#0a1628,#0f2347,#0a1f3c);justify-content:center;align-items:center;width:100vw;min-height:100vh;font-family:Inter,sans-serif;display:flex;position:fixed;top:0;left:0;overflow:hidden auto}.login-grid-overlay{z-index:1;background-image:linear-gradient(90deg,#ffffff08 1px,#0000 1px),linear-gradient(#ffffff08 1px,#0000 1px);background-size:60px 60px;width:100%;height:100%;position:absolute;top:0;left:0}.glow-circle{filter:blur(80px);z-index:2;pointer-events:none;border-radius:50%;position:absolute}.glow-circle-1{background:#2563eb1f;width:400px;height:400px;top:-10%;right:-10%;box-shadow:0 0 120px 40px #2563eb1f}.glow-circle-2{background:#4f46e51f;width:400px;height:400px;bottom:-10%;left:-10%;box-shadow:0 0 120px 40px #4f46e51f}.glow-circle-3{background:#2563eb2e;width:500px;height:500px;top:calc(50% - 250px);left:calc(50% - 250px);box-shadow:0 0 150px 50px #2563eb2e}.login-content-wrapper{z-index:10;justify-content:center;align-items:center;width:100%;max-width:1100px;padding:40px 24px;display:flex;position:relative}.login-split-layout{justify-content:space-between;align-items:center;gap:80px;width:100%;display:flex}.login-branding-section{text-align:center;flex-direction:column;flex:1;align-items:center;animation:.6s ease-out fadeInDown;display:flex}.login-logo{object-fit:contain;filter:drop-shadow(0 10px 20px #0000004d);width:250px;height:250px;margin-bottom:24px;animation:.6s ease-out scaleUp}.login-title-h1{color:#fff;letter-spacing:-.5px;margin:0 0 12px;font-size:40px;font-weight:800}.login-subtitle-p{color:#ffffffb3;letter-spacing:.2px;margin:0;font-size:16px;font-weight:500}.login-form-container{flex:1;justify-content:center;display:flex}.login-card{-webkit-backdrop-filter:blur(20px);background:#ffffff14;border:1px solid #ffffff26;border-radius:24px;width:100%;max-width:450px;padding:40px;animation:.6s ease-out .2s both fadeInUp;box-shadow:0 25px 50px -12px #00000080}.login-card-title{color:#fff;margin:0 0 8px;font-size:24px;font-weight:700}.login-card-subtitle{color:#bfdbfeb3;margin:0 0 32px;font-size:14px}.login-form-group{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.login-input-label{color:#dbeafe;text-align:left;font-size:14px;font-weight:500}.login-input-wrapper{align-items:center;display:flex;position:relative}.login-input-icon-left{color:#bfdbfe80;pointer-events:none;align-items:center;display:flex;position:absolute;left:16px}.login-input-field{color:#fff;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:16px;outline:none;width:100%;padding:16px 16px 16px 48px;font-family:inherit;font-size:15px;transition:all .2s}.login-input-field:focus{background:#ffffff14;border-color:#2563eb;box-shadow:0 0 0 2px #2563eb33}.login-input-field::placeholder{color:#bfdbfe4d}.login-password-toggle{color:#bfdbfe80;cursor:pointer;background:0 0;border:none;align-items:center;padding:0;display:flex;position:absolute;right:16px}.login-password-toggle:hover{color:#fff}.login-forgot-pwd-btn{color:#dbeafe;cursor:pointer;background:0 0;border:none;align-self:flex-end;align-items:center;gap:6px;margin-top:-12px;margin-bottom:24px;padding:4px 8px;font-size:13px;font-weight:600;display:flex}.login-forgot-pwd-btn:hover{color:#fff}.login-btn-primary{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:16px;justify-content:center;align-items:center;gap:10px;width:100%;height:54px;font-size:16px;font-weight:700;transition:all .2s;display:flex;box-shadow:0 8px 16px #2563eb40}.login-btn-primary:hover:not(:disabled){background:#1d4ed8;transform:translateY(-1px);box-shadow:0 10px 20px #2563eb59}.login-btn-primary:active:not(:disabled){transform:translateY(0)}.login-btn-primary:disabled{opacity:.6;cursor:not-allowed}.login-divider{align-items:center;margin:24px 0;display:flex}.login-divider-line{background:#ffffff1a;flex:1;height:1px}.login-divider-text{color:#bfdbfe80;padding:0 16px;font-size:12px;font-weight:500}.login-btn-outline{color:#fff;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:16px;width:100%;height:54px;font-size:14px;font-weight:600;transition:all .2s}.login-btn-outline:hover{background:#ffffff0d;border-color:#ffffff4d}.login-error-card{background:#ef444426;border:1px solid #ef44444d;border-radius:12px;align-items:center;gap:10px;margin-bottom:24px;padding:12px;animation:.5s ease-in-out shake;display:flex}.login-error-text{color:#fca5a5;text-align:left;font-size:13px;line-height:1.4}.login-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10000;background:#000000a6;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;animation:.3s ease-out fadeIn;display:flex;position:fixed;top:0;left:0}.login-modal-card{background:#111827;border:1px solid #ffffff26;border-radius:18px;width:100%;max-width:480px;animation:.3s cubic-bezier(.34,1.56,.64,1) zoomIn;overflow:hidden;box-shadow:0 20px 25px -5px #00000080}.login-modal-header{border-bottom:1px solid #ffffff14;padding:24px 24px 16px}.login-modal-title{color:#fff;margin:0;font-size:18px;font-weight:700}.login-modal-body{flex-direction:column;gap:16px;max-height:70vh;padding:24px;display:flex;overflow-y:auto}.login-modal-footer{border-top:1px solid #ffffff14;justify-content:flex-end;gap:12px;padding:16px 24px 24px;display:flex}.login-modal-btn-cancel{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:10px;padding:10px 16px;font-size:14px;font-weight:600;transition:all .2s}.login-modal-btn-cancel:hover{color:#fff;background:#ffffff0d}.login-modal-btn-submit{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:10px;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s;display:flex;box-shadow:0 4px 6px #2563eb33}.login-modal-btn-submit:hover:not(:disabled){background:#1d4ed8}.login-modal-btn-submit:disabled{opacity:.6;cursor:not-allowed}.login-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:20px;height:20px;animation:.8s linear infinite spin}.login-header-logout{color:#fca5a5;cursor:pointer;background:#ef44441a;border:1px solid #ef444433;border-radius:8px;align-items:center;gap:8px;padding:6px 12px;font-size:13px;font-weight:600;transition:all .2s;display:flex}.login-header-logout:hover{color:#fff;background:#ef444433;border-color:#ef444466}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes zoomIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleUp{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@media (width<=1023px){.login-split-layout{flex-direction:column;gap:32px}.login-branding-section{animation:.6s ease-out fadeInDown}.login-logo{width:150px;height:150px;margin-bottom:16px}.login-title-h1{font-size:28px}.login-subtitle-p{font-size:13px}.login-card{border-radius:20px;padding:24px}}@media (height<=600px){.login-logo{width:100px;height:100px;margin-bottom:8px}.login-title-h1{font-size:22px}.login-subtitle-p{display:none}.login-split-layout{gap:16px}}.header-left{align-items:center;gap:20px;display:flex}.tab-buttons{background:#f1f5f9;border:1px solid #e2e8f0;border-radius:8px;gap:8px;padding:4px;display:flex}.tab-btn{cursor:pointer;color:var(--color-text-light);box-shadow:none;background:0 0;border:none;border-radius:6px;padding:6px 12px;font-size:13px;font-weight:600;transition:all .2s}.tab-btn.active{color:var(--color-primary);background:#fff;box-shadow:0 1px 3px #0000001a}.banner-icon--error,.banner-text--error{color:#ef4444}.date-picker-wrapper{gap:8px}.date-picker-icon{color:var(--color-text-light)}.date-picker-input{color:var(--color-text-dark);border:1px solid #e2e8f0;border-radius:6px;outline:none;padding:6px 10px;font-family:inherit;font-size:13px;font-weight:600}.shift-label{color:var(--color-text);font-size:13px;font-weight:500}.action-btn-sm{border-radius:6px;align-items:center;gap:4px;padding:5px 10px;font-size:12px;display:inline-flex}.calendar-loading{text-align:center;color:var(--color-text-light);padding:20px;font-size:13px}.time-label{font-weight:700}.modal-content--narrow{max-width:450px}.modal-body--gap{flex-direction:column;gap:16px;display:flex}.edit-employee-card{background:#f8fafc;border-radius:8px;align-items:center;gap:12px;padding:12px;display:flex}.edit-employee-name{color:var(--color-text-dark);font-weight:700}.edit-employee-date{color:var(--color-text-light);font-size:12px}.edit-record-block{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:12px}.edit-record-label{cursor:pointer;align-items:center;gap:8px;margin-bottom:8px;font-size:14px;font-weight:600;display:flex}.edit-time-group{flex-direction:column;gap:4px;margin-top:8px;display:flex}.edit-time-label{color:var(--color-text-light);font-size:12px}.edit-time-input{border:1px solid #cbd5e1;border-radius:6px;outline:none;padding:8px 12px;font-size:14px}.edit-time-input--disabled{color:var(--color-text-light);cursor:not-allowed;background:#f1f5f9}.edit-note-group{flex-direction:column;gap:6px;display:flex}.edit-note-label{color:var(--color-text-dark);font-size:13px;font-weight:600}.edit-note-textarea{resize:vertical;border:1px solid #cbd5e1;border-radius:6px;outline:none;min-height:80px;padding:8px 12px;font-family:inherit;font-size:14px}.manual-type-options{gap:16px;display:flex}.manual-type-label{cursor:pointer;align-items:center;gap:8px;font-size:14px;display:flex}.modal-footer{border-top:1px solid #e2e8f0;justify-content:flex-end;gap:12px;padding:16px 24px;display:flex}.sidebar{color:#f8fafc;z-index:1000;background-color:#1e293b;border-right:1px solid #334155;flex-direction:column;flex-shrink:0;width:260px;min-width:260px;max-width:260px;height:100dvh;max-height:100dvh;display:flex;position:sticky;top:0;left:0;overflow-y:hidden;margin-left:0!important;transform:none!important}.sidebar-header{border-bottom:1px solid #334155;justify-content:flex-start;align-items:center;padding:20px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-logo{object-fit:contain;width:32px;height:32px}.brand-info{flex-direction:column;display:flex}.brand-name{color:#fff;letter-spacing:.5px;font-size:14px;font-weight:800}.brand-sub{color:#94a3b8;font-size:11px;font-weight:500}.sidebar-nav{flex-direction:column;flex:1;gap:12px;padding:16px 12px;display:flex;overflow-y:auto}.menu-item-direct{border-radius:var(--radius-sm);color:#94a3b8;text-align:left;cursor:pointer;text-transform:uppercase;letter-spacing:.05em;background:0 0;border:none;align-items:center;gap:10px;width:100%;padding:10px 12px;font-family:inherit;font-size:13px;font-weight:700;transition:all .2s;display:flex}.menu-item-direct:hover{color:#f8fafc;background-color:#ffffff0d}.menu-item-direct.active{background-color:var(--color-primary);color:#fff}.menu-item-direct.active .item-icon{color:#fff}.menu-group{flex-direction:column;gap:4px;display:flex}.menu-group-header{color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;justify-content:space-between;align-items:center;width:100%;padding:8px 12px;font-family:inherit;font-size:11.5px;font-weight:700;transition:color .2s;display:flex}.menu-group-header:hover{color:#f8fafc;background-color:#ffffff05}.menu-group-title{align-items:center;gap:10px;display:flex}.group-icon{color:#64748b;transition:color .2s}.menu-group-header:hover .group-icon{color:#94a3b8}.menu-sub-items{border-left:1px solid #334155;flex-direction:column;gap:2px;margin-top:2px;margin-left:18px;padding-left:8px;display:flex}.menu-item{color:#94a3b8;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;gap:10px;width:100%;padding:8px 12px;font-family:inherit;font-size:13px;font-weight:600;transition:all .2s;display:flex}.menu-item:hover{color:#f8fafc;background-color:#ffffff0d}.menu-item.active{background-color:var(--color-primary);color:#fff}.item-icon{transition:color .2s}.menu-item.active .item-icon{color:#fff}.sidebar-footer{border-top:1px solid #334155;flex-direction:column;align-items:center;width:100%;padding:16px 12px;display:flex}.sidebar-user-panel{border-radius:var(--radius-sm);background-color:#ffffff08;border:1px solid #ffffff0d;align-items:center;gap:10px;width:100%;margin-bottom:10px;padding:10px;display:flex}.user-avatar{background-color:var(--color-primary);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:13px;font-weight:700;display:flex}.user-details{flex-direction:column;flex:1;min-width:0;display:flex}.user-name{color:#fff;white-space:nowrap;text-overflow:ellipsis;text-align:left;font-size:13px;font-weight:600;overflow:hidden}.user-role{color:#64748b;text-transform:capitalize;text-align:left;font-size:11px}.sidebar-logout-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.sidebar-logout-btn:hover{color:#ef4444;background-color:#ef44441a}.version-tag{color:#475569;font-size:11px;font-weight:500}.device-container{flex-direction:column;gap:20px;animation:.4s ease-out fadeIn;display:flex}.device-stats-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:8px;display:grid}.device-stat-card{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);align-items:center;gap:16px;padding:20px;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -2px #0000000d}.device-stat-card:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.device-stat-icon{border-radius:50px;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.device-stat-icon.total{background:var(--color-primary-light);color:var(--color-primary)}.device-stat-icon.online{background:var(--color-success-light);color:var(--color-success)}.device-stat-icon.offline{background:var(--color-absent-light);color:var(--color-absent)}.device-stat-icon.latency{background:var(--color-leave-light);color:var(--color-leave)}.device-stat-info{flex-direction:column;display:flex}.device-stat-label{color:var(--color-text-light);font-size:.85rem;font-weight:500}.device-stat-value{color:var(--color-text-dark);margin-top:2px;font-size:1.6rem;font-weight:700;line-height:1.2}.device-control-bar{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:16px;display:flex;box-shadow:0 1px 3px #0000000d}.device-filter-group{border-radius:var(--radius-sm);background:#f1f5f9;gap:2px;padding:4px;display:flex}.device-filter-btn{color:var(--color-text);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:8px 16px;font-size:.85rem;font-weight:600;transition:all .2s}.device-filter-btn:hover{color:var(--color-text-dark)}.device-filter-btn.active{color:var(--color-primary);background:#fff;box-shadow:0 1px 3px #0000001a}.device-search-actions{flex-grow:1;justify-content:flex-end;align-items:center;gap:12px;display:flex}.device-search-wrapper{width:100%;max-width:320px;position:relative}.device-search-icon{color:var(--color-text-light);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.device-search-input{border-radius:var(--radius-sm);background:#f8fafc;border:1px solid #cbd5e1;outline:none;width:100%;padding:9px 12px 9px 38px;font-size:.9rem;transition:all .2s}.device-search-input:focus{border-color:var(--color-primary);background:#fff;box-shadow:0 0 0 3px #25437a26}.device-add-btn{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:8px;padding:9px 16px;font-size:.9rem;font-weight:600;transition:background-color .2s;display:flex}.device-add-btn:hover{background-color:var(--color-primary-hover)}.device-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;display:grid}.device-card{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);flex-direction:column;gap:16px;padding:20px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 2px 4px #00000008}.device-card:before{content:"";background:var(--color-primary);opacity:0;height:4px;transition:opacity .2s;position:absolute;top:0;left:0;right:0}.device-card.online:before{background:var(--color-success);opacity:1}.device-card.offline:before{background:var(--color-absent);opacity:1}.device-card:hover{transform:translateY(-4px);box-shadow:0 12px 20px -8px #0000001f}.device-card-header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.device-avatar-title{align-items:center;gap:12px;display:flex}.device-avatar{border-radius:var(--radius-sm);justify-content:center;align-items:center;width:44px;height:44px;font-size:1.2rem;display:flex}.device-avatar.attendance{color:var(--color-success);background:#6399221a}.device-avatar.warehouse{color:var(--color-leave);background:#378add1a}.device-avatar.technician{color:var(--color-ot);background:#8b5cf61a}.device-avatar.admin,.device-avatar.super_admin{color:#dc2626;background:#ef44441f}.device-avatar.manager{color:#d97706;background:#f59e0b1f}.device-avatar.employee,.device-avatar.receptionist{color:#0284c7;background:#0ea5e91f}.device-title-info{flex-direction:column;display:flex}.device-name{color:var(--color-text-dark);white-space:nowrap;text-overflow:ellipsis;max-width:170px;font-size:1rem;font-weight:700;overflow:hidden}.device-id{color:var(--color-text-light);margin-top:1px;font-family:monospace;font-size:.75rem;font-weight:600}.device-status-badge{text-transform:uppercase;border-radius:50px;align-items:center;gap:6px;padding:4px 10px;font-size:.75rem;font-weight:700;display:flex}.device-status-badge.online{background:var(--color-success-light);color:var(--color-success)}.device-status-badge.offline{background:var(--color-absent-light);color:var(--color-absent)}.status-dot{border-radius:50%;width:8px;height:8px;display:inline-block}.status-dot.online{background-color:var(--color-success);animation:1.8s infinite pulse-green;box-shadow:0 0 #639922b3}.status-dot.offline{background-color:var(--color-absent);animation:2.2s infinite pulse-red;box-shadow:0 0 #e24b4a66}@keyframes pulse-green{0%{transform:scale(.95);box-shadow:0 0 #639922b3}70%{transform:scale(1);box-shadow:0 0 0 6px #63992200}to{transform:scale(.95);box-shadow:0 0 #63992200}}@keyframes pulse-red{0%{transform:scale(.95);box-shadow:0 0 #e24b4a66}70%{transform:scale(1);box-shadow:0 0 0 5px #e24b4a00}to{transform:scale(.95);box-shadow:0 0 #e24b4a00}}.device-card-details{border-top:1px dashed #e2e8f0;border-bottom:1px dashed #e2e8f0;grid-template-columns:1fr 1fr;gap:12px;padding:12px 0;display:grid}.detail-item{flex-direction:column;gap:3px;display:flex}.detail-label{color:var(--color-text-light);align-items:center;gap:4px;font-size:.75rem;font-weight:500;display:flex}.detail-value{color:var(--color-text-dark);font-size:.85rem;font-weight:600}.detail-value.ip{font-family:monospace}.detail-value.ping{color:var(--color-success)}.detail-value.ping.high{color:var(--color-late)}.device-card-actions{justify-content:flex-end;align-items:center;gap:8px;display:flex}.action-btn{width:36px;height:36px;color:var(--color-text);cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:all .2s;display:inline-flex}.action-btn svg{stroke-width:2.2px;width:20px;height:20px}.action-btn:hover{color:var(--color-text-dark);background:#f8fafc;border-color:#94a3b8}.action-btn.ping{background:var(--color-primary-light);color:var(--color-primary);border-color:#0000}.action-btn.ping:hover{background:#dbeafe}.action-btn.toggle-sim{color:#b45309;background:#fffbeb;border:1px solid #fde68a;border-radius:8px;gap:6px;width:auto;height:36px;padding:0 14px;font-size:.85rem;font-weight:700}.action-btn.toggle-sim svg{width:18px;height:18px}.action-btn.toggle-sim:hover{background:#fef3c7;border-color:#fcd34d}.action-btn.edit:hover{color:var(--color-leave);border-color:var(--color-leave);background:#378add14}.action-btn.delete:hover{color:var(--color-absent);border-color:var(--color-absent);background:var(--color-absent-light)}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0f172a66;justify-content:center;align-items:center;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.modal-content{border-radius:var(--radius-lg);background:#fff;width:100%;max-width:480px;animation:.3s cubic-bezier(.34,1.56,.64,1) slideUp;overflow:hidden;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{background:var(--color-primary);color:#fff;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.modal-header h3{margin:0;font-size:1.1rem;font-weight:700}.close-modal-btn{color:#fff;opacity:.8;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;display:flex}.close-modal-btn:hover{opacity:1;background:#ffffff1a}.modal-body{padding:20px}.device-form{flex-direction:column;gap:16px;display:flex}.form-input{border-radius:var(--radius-sm);border:1px solid #cbd5e1;outline:none;padding:9px 12px;font-size:.9rem;transition:all .2s}.form-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #25437a26}.form-actions{justify-content:flex-end;gap:10px;margin-top:10px;display:flex}.form-cancel-btn{color:var(--color-text);border-radius:var(--radius-sm);cursor:pointer;background:#f1f5f9;border:1px solid #cbd5e1;padding:9px 16px;font-size:.9rem;font-weight:600;transition:all .2s}.form-cancel-btn:hover{color:var(--color-text-dark);background:#e2e8f0}.form-submit-btn{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;padding:9px 20px;font-size:.9rem;font-weight:600;transition:background-color .2s}.form-submit-btn:hover{background:var(--color-primary-hover)}.device-empty-view{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);text-align:center;color:var(--color-text-light);flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:40px;display:flex}.device-empty-icon{color:var(--color-text-light);opacity:.5}.device-empty-text{font-size:1rem;font-weight:600}.real-time-indicator{background:#63992214;border:1px solid #63992233;border-radius:50px;align-items:center;gap:8px;padding:6px 12px;display:flex}.real-time-dot{background-color:var(--color-success);border-radius:50%;width:8px;height:8px;animation:1.5s infinite pulse-green}.real-time-text{color:var(--color-success);font-size:.8rem;font-weight:700}.update-container{flex-direction:column;gap:24px;animation:.4s ease-out updateFadeIn;display:flex}@keyframes updateFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.update-stats-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.update-stat-card{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);align-items:center;gap:20px;padding:24px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 4px 12px #0f172a08,0 2px 4px #0f172a05}.update-stat-card:before{content:"";background:0 0;width:4px;height:100%;transition:background .3s;position:absolute;top:0;left:0}.update-stat-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #0f172a0f,0 4px 8px #0f172a0a}.update-stat-card:hover:before{background:var(--color-primary)}.update-stat-icon{border-radius:14px;justify-content:center;align-items:center;width:52px;height:52px;transition:all .3s;display:flex}.update-stat-icon.active-ver{background:var(--color-primary-light);color:var(--color-primary)}.update-stat-icon.published{background:var(--color-success-light);color:var(--color-success)}.update-stat-icon.drafts{background:var(--color-late-light);color:var(--color-late)}.update-stat-card:hover .update-stat-icon{transform:scale(1.1)rotate(4deg)}.update-stat-info{flex-direction:column;gap:4px;display:flex}.update-stat-label{color:var(--color-text-light);text-transform:uppercase;letter-spacing:.05em;font-size:.85rem;font-weight:600}.update-stat-value{color:var(--color-text-dark);font-size:1.8rem;font-weight:750;line-height:1.1}.update-control-bar{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;padding:20px 24px;display:flex;box-shadow:0 2px 8px #00000005}.update-control-title h2{color:var(--color-text-dark);margin:0 0 4px;font-size:1.3rem;font-weight:700}.update-control-title p{color:var(--color-text-light);margin:0;font-size:.88rem}.update-search-actions{align-items:center;gap:12px;display:flex}.update-refresh-btn{border:1px solid var(--color-border);border-radius:var(--radius-sm);width:40px;height:40px;color:var(--color-text);cursor:pointer;background:0 0;justify-content:center;align-items:center;transition:all .2s;display:flex}.update-refresh-btn:hover:not(:disabled){background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.update-refresh-btn:disabled{opacity:.6;cursor:not-allowed}.update-add-btn{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:8px;padding:10px 20px;font-size:.92rem;font-weight:600;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 4px 10px #25437a33}.update-add-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 6px 14px #25437a4d}.update-add-btn.inline-btn{box-shadow:none;margin-top:16px}@keyframes spinnerAnim{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.update-list-wrapper{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 4px 12px #0f172a05}.update-table{border-collapse:collapse;text-align:left;width:100%;font-size:.92rem}.update-table th{color:var(--color-text-light);border-bottom:1px solid var(--color-border);text-transform:uppercase;letter-spacing:.05em;background:#f8fafc;padding:16px 20px;font-size:.75rem;font-weight:600}.update-table td{border-bottom:1px solid var(--color-border);vertical-align:middle;padding:18px 20px;transition:background-color .2s}.update-table tr:last-child td{border-bottom:none}.update-table tr.row-released:hover td{background-color:#63992204}.update-table tr.row-draft:hover td{background-color:#ba751704}.version-tag{background:var(--color-primary-light);color:var(--color-primary);border:1px solid #25437a1a;border-radius:20px;padding:6px 12px;font-size:.88rem;font-weight:700;display:inline-block}.changelog-text{max-width:320px;color:var(--color-text);text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:.88rem;line-height:1.5;display:-webkit-box;overflow:hidden}.changelog-text div{margin-bottom:2px}.url-container{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:#f8fafc;justify-content:space-between;align-items:center;gap:8px;max-width:280px;padding:6px 10px;display:flex}.url-text{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;flex-grow:1;font-family:monospace;font-size:.8rem;overflow:hidden}.url-actions{flex-shrink:0;gap:4px;display:flex}.icon-action-btn{border:1px solid var(--color-border);color:var(--color-text);cursor:pointer;background:#fff;border-radius:4px;justify-content:center;align-items:center;width:24px;height:24px;transition:all .2s;display:flex}.icon-action-btn:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.badge{text-transform:uppercase;border-radius:6px;align-items:center;padding:4px 10px;font-size:.78rem;font-weight:700;display:inline-flex}.badge-danger{background:var(--color-absent-light);color:var(--color-absent);border:1px solid #e24b4a26}.badge-success{background:var(--color-success-light);color:var(--color-success);border:1px solid #63992226}.badge-warning{background:var(--color-late-light);color:var(--color-late);border:1px solid #ba751726}.badge-secondary{color:#64748b;background:#f1f5f9;border:1px solid #cbd5e1}.time-info{flex-direction:column;gap:6px;font-size:.8rem;display:flex}.time-row{color:var(--color-text-light);align-items:center;gap:6px;display:flex}.time-row.highlight{color:var(--color-success);font-weight:550}.time-icon{flex-shrink:0}.action-btn{border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:6px;padding:8px 14px;font-size:.85rem;font-weight:600;transition:all .2s;display:inline-flex}.release-btn{background:var(--color-primary-light);color:var(--color-primary);border:1px solid #25437a26}.release-btn:hover:not(:disabled){background:var(--color-primary);color:#fff;box-shadow:0 4px 8px #25437a26}.release-btn:disabled{opacity:.5;cursor:not-allowed}.action-done{color:var(--color-success);align-items:center;gap:6px;font-size:.85rem;font-weight:600;display:flex}.update-loading,.update-empty-state{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:60px 40px;display:flex;box-shadow:0 2px 8px #00000003}.loading-icon{color:var(--color-primary);margin-bottom:8px}.empty-icon{color:var(--color-text-light);opacity:.6;margin-bottom:8px}.update-empty-state h3{color:var(--color-text-dark);margin:0;font-size:1.15rem;font-weight:700}.update-empty-state p{color:var(--color-text-light);max-width:320px;margin:0;font-size:.9rem}.update-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background-color:#0f172a80;justify-content:center;align-items:center;animation:.2s ease-out modalOverlayFade;display:flex;position:fixed;inset:0}@keyframes modalOverlayFade{0%{opacity:0}to{opacity:1}}.update-modal-box{background:var(--color-card);border-radius:var(--radius-lg);width:100%;max-width:540px;animation:.3s cubic-bezier(.34,1.56,.64,1) modalBoxPopup;overflow:hidden;box-shadow:0 20px 25px -5px #00000026,0 10px 10px -5px #0000001a}@keyframes modalBoxPopup{0%{opacity:0;transform:scale(.9)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.update-modal-header{border-bottom:1px solid var(--color-border);background:#f8fafc;justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.update-modal-header h3{color:var(--color-text-dark);margin:0;font-size:1.15rem;font-weight:700}.close-modal-btn{color:var(--color-text-light);cursor:pointer;background:0 0;border:none;font-size:1.5rem;transition:color .2s}.close-modal-btn:hover{color:var(--color-text-dark)}.update-modal-form{flex-direction:column;gap:18px;padding:24px;display:flex}.form-group input,.form-group textarea,.form-group select{border-radius:var(--radius-sm);background:#f8fafc;border:1px solid #cbd5e1;outline:none;padding:10px 14px;font-size:.9rem;transition:all .25s}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--color-primary);background:#fff;box-shadow:0 0 0 3px #25437a1f}.form-row-checkbox{align-items:flex-start;padding:6px 0;display:flex}.checkbox-label{cursor:pointer;align-items:flex-start;gap:10px;display:flex}.checkbox-label input[type=checkbox]{width:17px;height:17px;accent-color:var(--color-primary);margin-top:2px}.checkbox-text{color:var(--color-text);font-size:.85rem;line-height:1.4}.release-warning{background:var(--color-late-light);border-radius:var(--radius-sm);color:#7c2d12;border:1px solid #ba751733;align-items:flex-start;gap:10px;padding:12px;font-size:.82rem;display:flex}.warning-icon{color:var(--color-late);flex-shrink:0;margin-top:1px}.update-modal-footer{justify-content:flex-end;gap:12px;margin-top:10px;display:flex}.btn-cancel{color:var(--color-text);border-radius:var(--radius-sm);cursor:pointer;background:#f1f5f9;border:1px solid #cbd5e1;padding:10px 18px;font-size:.9rem;font-weight:600;transition:all .2s}.btn-cancel:hover:not(:disabled){color:var(--color-text-dark);background:#e2e8f0}.btn-submit{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:8px;padding:10px 22px;font-size:.9rem;font-weight:600;transition:all .25s;display:flex;box-shadow:0 4px 6px #25437a26}.btn-submit:hover:not(:disabled){background:var(--color-primary-hover);box-shadow:0 6px 12px #25437a40}.btn-submit:disabled,.btn-cancel:disabled{opacity:.6;cursor:not-allowed}@media (width<=768px){.update-control-bar{flex-direction:column;align-items:flex-start}.update-search-actions{justify-content:space-between;width:100%}.update-table th,.update-table td{padding:12px}}.media-modal-backdrop{z-index:9999;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f172aeb;justify-content:center;align-items:center;animation:.25s cubic-bezier(.16,1,.3,1) mediaModalFadeIn;display:flex;position:fixed;inset:0}@keyframes mediaModalFadeIn{0%{opacity:0}to{opacity:1}}.media-modal-container{background:#1e293bd9;border:1px solid #ffffff1a;border-radius:16px;flex-direction:column;width:95vw;max-width:1400px;height:94vh;display:flex;overflow:hidden;box-shadow:0 25px 50px -12px #000000b3}.media-modal-header{background:#0f172a99;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.media-info-col{align-items:center;gap:12px;display:flex}.media-title{color:#f8fafc;white-space:nowrap;text-overflow:ellipsis;max-width:500px;margin:0;font-size:1.05rem;font-weight:600;overflow:hidden}.media-counter{color:#cbd5e1;background:#ffffff1f;border-radius:99px;padding:3px 10px;font-size:.78rem;font-weight:600}.media-modal-header-actions{align-items:center;gap:8px;display:flex}.media-icon-btn{color:#e2e8f0;cursor:pointer;background:#ffffff14;border:1px solid #ffffff1f;border-radius:8px;align-items:center;gap:6px;padding:6px 12px;font-size:.85rem;font-weight:500;text-decoration:none;transition:all .2s;display:inline-flex}.media-icon-btn:hover{color:#fff;background:#ffffff2e;border-color:#ffffff40}.media-icon-btn.danger{color:#fca5a5;background:#ef444426;border-color:#ef444440}.media-icon-btn.danger:hover{color:#fff;background:#ef44444d}.media-modal-close-btn{color:#94a3b8;cursor:pointer;background:#ffffff1a;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;margin-left:8px;transition:all .2s;display:flex}.media-modal-close-btn:hover{color:#fff;background:#ef4444}.media-modal-stage{background:#020617;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.media-nav-arrow{z-index:10;color:#f8fafc;cursor:pointer;background:#0f172aa6;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;transition:all .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 4px 12px #0006}.media-nav-arrow.prev{left:20px}.media-nav-arrow.next{right:20px}.media-nav-arrow:hover{background:#2563eb;border-color:#3b82f6;transform:translateY(-50%)scale(1.08)}.media-display-area{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.image-viewer-wrapper{-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;width:100%;height:100%;display:flex;overflow:hidden}.main-lightbox-img{object-fit:contain;border-radius:4px;max-width:90%;max-height:85vh;box-shadow:0 10px 30px #00000080}.image-toolbar-floating{z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0f172ad9;border:1px solid #ffffff26;border-radius:99px;align-items:center;gap:8px;padding:6px 14px;display:flex;position:absolute;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 10px 25px #00000080}.toolbar-btn{color:#cbd5e1;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.toolbar-btn:hover{color:#fff;background:#ffffff26}.zoom-indicator{color:#38bdf8;text-align:center;min-width:44px;font-size:.82rem;font-weight:700}.toolbar-divider{background:#ffffff26;width:1px;height:18px;margin:0 4px}.video-player-wrapper{flex-direction:column;justify-content:center;align-items:center;width:90%;max-width:1000px;height:85%;display:flex;position:relative}.main-video-element{background:#000;border-radius:12px;outline:none;width:100%;max-height:calc(85vh - 60px);box-shadow:0 15px 35px #0009}.video-custom-toolbar{background:#0f172acc;border:1px solid #ffffff1a;border-radius:99px;align-items:center;gap:8px;margin-top:12px;padding:6px 16px;display:flex}.toolbar-label{color:#94a3b8;margin-right:4px;font-size:.8rem}.speed-chip{color:#cbd5e1;cursor:pointer;background:#ffffff14;border:1px solid #ffffff1f;border-radius:6px;padding:3px 10px;font-size:.78rem;font-weight:600;transition:all .2s}.speed-chip.active,.speed-chip:hover{color:#fff;background:#2563eb;border-color:#3b82f6}.pdf-preview-wrapper{background:#1e293b;border-radius:12px;width:92%;height:90%;display:flex;overflow:hidden;box-shadow:0 10px 30px #00000080}.pdf-preview-iframe{border:none;width:100%;height:100%}.document-preview-card{text-align:center;background:#0f172ab3;border:1px solid #ffffff1f;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;max-width:520px;padding:40px;display:flex;box-shadow:0 20px 40px #0006}.doc-type-icon{margin-bottom:16px}.doc-type-icon.excel{color:#10b981}.doc-type-icon.zip{color:#f59e0b}.doc-type-icon.code{color:#3b82f6}.doc-type-icon.default{color:#8b5cf6}.doc-card-title{color:#f8fafc;word-break:break-all;margin:0 0 8px;font-size:1.15rem;font-weight:600}.doc-card-sub{color:#94a3b8;margin:0 0 24px;font-size:.85rem;line-height:1.5}.doc-card-actions{gap:12px;display:flex}.btn-primary-action{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-size:.9rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary-action:hover{background:#1d4ed8;transform:translateY(-1px)}.btn-secondary-action{color:#e2e8f0;cursor:pointer;background:#ffffff1a;border:1px solid #ffffff26;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-size:.9rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-flex}.btn-secondary-action:hover{color:#fff;background:#fff3}.media-carousel-bar{scrollbar-width:thin;background:#0f172ad9;border-top:1px solid #ffffff14;align-items:center;gap:10px;padding:12px 20px;display:flex;overflow-x:auto}.carousel-thumb-btn{cursor:pointer;opacity:.6;background:#0f172a;border:2px solid #0000;border-radius:8px;flex-shrink:0;width:56px;height:56px;padding:0;transition:all .2s;position:relative;overflow:hidden}.carousel-thumb-btn:hover{opacity:.9;transform:translateY(-2px)}.carousel-thumb-btn.active{opacity:1;border-color:#38bdf8;box-shadow:0 0 12px #38bdf880}.thumb-media{object-fit:cover;width:100%;height:100%}.thumb-video-placeholder{background:#334155;width:100%;height:100%;position:relative}.thumb-play-icon{color:#fff;z-index:2;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.thumb-doc-placeholder{color:#a5b4fc;background:#312e81;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.thumb-badge{color:#fff;z-index:3;border-radius:3px;padding:1px 4px;font-size:.6rem;font-weight:800;position:absolute;bottom:2px;right:2px}.thumb-badge.vid{background:#ef4444}.thumb-badge.doc{background:#8b5cf6}.orders-container{flex-direction:column;height:calc(100vh - 80px);padding:20px;animation:.4s ease-out fadeIn;display:flex;overflow:hidden}.orders-layout{grid-template-columns:1fr 1fr;gap:20px;height:100%;display:grid;overflow:hidden}.orders-list-panel{flex-direction:column;gap:16px;height:100%;display:flex;overflow:hidden}.orders-summary-bar{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);grid-template-columns:repeat(4,1fr);gap:8px;padding:12px;display:grid;box-shadow:0 4px 6px -1px #00000008}.summary-stat{text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}.summary-val{color:var(--color-text-dark);font-size:1.25rem;font-weight:700}.summary-lbl{color:var(--color-text-light);white-space:nowrap;margin-top:2px;font-size:.7rem;font-weight:500}.orders-filter-card{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);flex-direction:column;gap:12px;padding:16px;display:flex;box-shadow:0 4px 6px -1px #00000008}.search-box-row{gap:10px;width:100%;display:flex}.search-input-wrapper{flex:1;position:relative}.search-icon{color:var(--color-text-light);position:absolute;top:50%;left:12px;transform:translateY(-50%)}.orders-search-input{border:1px solid var(--color-border);border-radius:var(--radius-sm);width:100%;color:var(--color-text-dark);background:var(--color-bg);padding:10px 12px 10px 38px;font-size:.9rem;transition:all .2s}.orders-search-input:focus{border-color:var(--color-primary);background:var(--color-card);outline:none;box-shadow:0 0 0 3px #25437a1a}.btn-create-order{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;align-items:center;gap:6px;padding:0 16px;font-size:.85rem;font-weight:600;transition:background .2s;display:flex}.btn-create-order:hover{background:var(--color-primary-hover)}.filters-row{grid-template-columns:1fr 1fr 1fr;gap:8px;display:grid}.filter-item{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);align-items:center;gap:6px;padding:6px 8px;display:flex;position:relative}.filter-icon{color:var(--color-text-light)}.filter-item select,.filter-item input{width:100%;color:var(--color-text);cursor:pointer;background:0 0;border:none;outline:none;font-size:.8rem;font-weight:500}.clear-date-btn{color:var(--color-text-light);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:2px;display:flex}.clear-date-btn:hover{color:var(--color-absent);background:#0000000d}.orders-list-wrapper{flex:1;padding-right:4px;overflow-y:auto}.list-status-msg{text-align:center;color:var(--color-text-light);padding:40px;font-size:.95rem}.orders-cards-list{flex-direction:column;gap:12px;display:flex}.order-list-card{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);cursor:pointer;padding:16px;transition:all .2s;position:relative;box-shadow:0 2px 4px #00000005}.order-list-card:after{content:"";border-top-left-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg);background:0 0;width:4px;transition:background .2s;position:absolute;top:0;bottom:0;left:0}.order-list-card:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000000d}.order-list-card.selected{border-color:var(--color-primary);background:#f8fafc}.order-list-card.selected:after{background:var(--color-primary)}.card-header-row{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.order-code-tag{color:var(--color-primary);background:var(--color-primary-light);border-radius:4px;padding:2px 8px;font-family:monospace;font-size:.85rem;font-weight:700}.card-device-name{color:var(--color-text-dark);white-space:nowrap;text-overflow:ellipsis;margin:0 0 8px;font-size:.95rem;font-weight:600;overflow:hidden}.card-info-grid{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}.card-info-grid .info-item{color:var(--color-text);align-items:center;gap:8px;font-size:.8rem;display:flex}.card-footer-row{border-top:1px dashed var(--color-border);justify-content:space-between;align-items:center;margin-top:8px;padding-top:8px;display:flex}.card-date{color:var(--color-text-light);font-size:.75rem}.assignees-badge{color:var(--color-ot);background:#8b5cf61a;border-radius:99px;padding:2px 8px;font-size:.75rem;font-weight:600}.unassigned-badge{color:var(--color-text-light);background:#f1f5f9;border-radius:99px;padding:2px 8px;font-size:.75rem;font-weight:500}.pagination-bar{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);justify-content:space-between;align-items:center;padding:10px 16px;font-size:.85rem;font-weight:500;display:flex}.pagination-bar button{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;padding:6px 12px;font-weight:600;transition:all .2s}.pagination-bar button:hover:not(:disabled){background:var(--color-primary-light);color:var(--color-primary);border-color:var(--color-primary)}.pagination-bar button:disabled{opacity:.5;cursor:not-allowed}.orders-detail-panel{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);flex-direction:column;height:100%;display:flex;overflow:hidden;box-shadow:0 4px 6px -1px #00000008}.detail-scroller{flex-direction:column;flex:1;gap:20px;padding:24px;display:flex;overflow-y:auto}.detail-header{border-bottom:1px solid var(--color-border);padding-bottom:16px}.detail-title-row{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:12px;display:flex}.detail-order-code{color:var(--color-primary);background:var(--color-primary-light);border-radius:6px;margin-bottom:8px;padding:4px 10px;font-family:monospace;font-size:.95rem;font-weight:700;display:inline-block}.detail-device-title{color:var(--color-text-dark);margin:0;font-size:1.35rem;font-weight:700}.detail-actions{gap:8px;display:flex}.btn-action-outline{border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;background:#fff;align-items:center;gap:6px;padding:8px 12px;font-size:.8rem;font-weight:600;transition:all .2s;display:flex}.btn-action-outline:hover{background:var(--color-bg);border-color:var(--color-text-light)}.btn-action-outline.danger{color:var(--color-absent)}.status-timeline-bar{background:var(--color-bg);border-radius:var(--radius-sm);justify-content:space-between;align-items:center;padding:12px;display:flex}.btn-update-status{background:var(--color-primary-light);color:var(--color-primary);border:1px solid var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;padding:6px 12px;font-size:.8rem;font-weight:600;transition:all .2s}.btn-update-status:hover{background:var(--color-primary);color:#fff}.section-header-row{justify-content:space-between;align-items:center;display:flex}.detail-info-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);flex-direction:column;gap:8px;padding:14px;display:flex}.info-row{font-size:.85rem;display:flex}.info-lbl{width:120px;color:var(--color-text-light);font-weight:500}.info-val{color:var(--color-text-dark);font-weight:600}.devices-detail-list{flex-direction:column;gap:10px;display:flex}.device-detail-card{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:#fff;padding:12px;box-shadow:0 1px 2px #00000003}.device-card-header{border-bottom:1px dashed var(--color-border);justify-content:space-between;align-items:center;margin-bottom:8px;padding-bottom:8px;display:flex}.device-name{color:var(--color-text-dark);font-size:.9rem;font-weight:600}.warranty-tag{border-radius:4px;padding:2px 6px;font-size:.7rem;font-weight:700}.warranty-tag.true{background:var(--color-success-light);color:var(--color-success)}.warranty-tag.false{color:var(--color-text-light);background:#f1f5f9}.device-card-body{grid-template-columns:1fr 1fr;gap:6px;display:grid}.device-body-item{font-size:.8rem;display:flex}.device-body-item.full{flex-direction:column;grid-column:span 2;gap:4px}.device-body-item .lbl{color:var(--color-text-light);width:90px}.device-body-item p{color:var(--color-text);background:var(--color-bg);border-radius:4px;margin:0;padding:6px}.detail-assignees-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:12px}.assignees-list{flex-wrap:wrap;gap:8px;display:flex}.tech-badge-item{border:1px solid var(--color-border);color:var(--color-text-dark);background:#fff;border-radius:99px;align-items:center;gap:6px;padding:4px 10px;font-size:.8rem;font-weight:600;display:flex}.no-data-text{color:var(--color-text-light);margin:0;font-size:.85rem;font-style:italic}.media-attachments-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:16px}.media-uploading{color:var(--color-primary);margin-bottom:10px;font-size:.85rem;font-weight:600}.upload-btn-wrapper{display:inline-block;position:relative;overflow:hidden}.upload-btn-wrapper input[type=file]{opacity:0;cursor:pointer;font-size:100px;position:absolute;top:0;left:0}.media-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:12px;display:grid}.media-item-wrapper{aspect-ratio:1;border:1px solid var(--color-border);cursor:pointer;background:#fff;border-radius:8px;transition:all .2s;position:relative;overflow:hidden}.media-item-wrapper:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.media-item-wrapper img,.media-item-wrapper video{object-fit:cover;width:100%;height:100%;display:block}.media-video-placeholder,.media-image-placeholder{background:#1e293b;width:100%;height:100%;position:relative}.media-doc-placeholder{color:#c7d2fe;background:linear-gradient(135deg,#1e1b4b 0%,#312e81 100%);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.doc-grid-icon{margin-bottom:4px}.media-overlay-icon{color:#fff;z-index:2;opacity:.85;background:#0f172a66;justify-content:center;align-items:center;transition:opacity .2s,background .2s;display:flex;position:absolute;inset:0}.media-item-wrapper:hover .media-overlay-icon{opacity:1;background:#0f172a99}.play-icon,.zoom-icon{filter:drop-shadow(0 2px 4px #00000080);transition:transform .2s}.media-item-wrapper:hover .play-icon,.media-item-wrapper:hover .zoom-icon{transform:scale(1.15)}.media-type-badge{color:#fff;z-index:3;letter-spacing:.5px;border-radius:4px;padding:2px 6px;font-size:.62rem;font-weight:800;position:absolute;bottom:4px;left:4px}.media-type-badge.vid{background:#ef4444}.media-type-badge.doc{background:#8b5cf6}.delete-media-btn{color:#fff;cursor:pointer;z-index:5;background:#e24b4ae6;border:none;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;transition:all .2s;display:flex;position:absolute;top:4px;right:4px;box-shadow:0 2px 6px #0000004d}.delete-media-btn:hover{background:#e24b4a;transform:scale(1.1)}.media-caption{color:#fff;text-align:center;white-space:nowrap;text-overflow:ellipsis;background:#0009;padding:2px 4px;font-size:.65rem;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.timeline-flow-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:16px 20px}.vertical-timeline{flex-direction:column;padding-left:14px;display:flex;position:relative}.vertical-timeline:before{content:"";background:var(--color-border);width:2px;position:absolute;top:4px;bottom:4px;left:3px}.timeline-node{padding-bottom:20px;position:relative}.timeline-node:last-child{padding-bottom:0}.node-marker{background:var(--color-primary);width:8px;height:8px;box-shadow:0 0 0 2px var(--color-border);border:2px solid #fff;border-radius:50%;position:absolute;top:4px;left:-15px}.timeline-node:first-child .node-marker{background:var(--color-success);box-shadow:0 0 0 2px var(--color-success-light)}.node-content{flex-direction:column;gap:4px;display:flex}.node-header{align-items:center;gap:12px;display:flex}.node-time{color:var(--color-text-light);font-size:.7rem}.node-author{color:var(--color-text);margin:0;font-size:.75rem;font-weight:500}.node-notes{color:var(--color-text-dark);border-left:3px solid var(--color-border);background:#fff;border-radius:4px;margin:2px 0 0;padding:6px 10px;font-size:.75rem}.detail-empty-state{text-align:center;height:100%;color:var(--color-text-light);flex-direction:column;justify-content:center;align-items:center;padding:40px;display:flex}.empty-icon{color:var(--color-border);margin-bottom:16px}.detail-empty-state h3{color:var(--color-text-dark);margin:0 0 8px;font-size:1.15rem}.detail-empty-state p{max-width:320px;margin:0;font-size:.85rem;line-height:1.4}.cancel-order-footer{border-top:1px solid var(--color-border);justify-content:flex-end;padding-top:16px;display:flex}.btn-cancel-order{border:1px solid var(--color-absent);color:var(--color-absent);border-radius:var(--radius-sm);cursor:pointer;background:#fff;align-items:center;gap:6px;padding:8px 16px;font-size:.8rem;font-weight:600;transition:all .2s;display:flex}.btn-cancel-order:hover{background:var(--color-absent-light)}.orders-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0f172a99;justify-content:center;align-items:center;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.orders-modal-card{border-radius:var(--radius-lg);background:#fff;flex-direction:column;max-height:90vh;display:flex;overflow:hidden;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.orders-modal-card.small{width:460px}.orders-modal-card.large{width:800px}.modal-header{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.modal-header h3{color:var(--color-text-dark);margin:0;font-size:1.15rem;font-weight:700}.close-modal-btn{color:var(--color-text-light);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:4px;transition:background .2s;display:flex}.close-modal-btn:hover{background:var(--color-bg);color:var(--color-text-dark)}.modal-form{flex-direction:column;gap:16px;padding:24px;display:flex;overflow-y:auto}.form-section-title{text-transform:uppercase;color:var(--color-primary);border-bottom:1px solid var(--color-primary-light);margin-top:8px;padding-bottom:4px;font-size:.8rem;font-weight:700}.form-section-title.flex-header{justify-content:space-between;align-items:center;display:flex}.btn-add-device-row{background:var(--color-success-light);color:var(--color-success);border:1px solid var(--color-success);cursor:pointer;border-radius:4px;align-items:center;gap:4px;padding:4px 10px;font-size:.75rem;font-weight:600;transition:all .2s;display:flex}.btn-add-device-row:hover{background:var(--color-success);color:#fff}.form-row-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;display:grid}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--color-text-dark);font-size:.8rem;font-weight:600}.form-group input,.form-group select,.form-group textarea{border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-dark);background:var(--color-bg);outline:none;padding:8px 12px;font-size:.9rem}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--color-primary);background:#fff;box-shadow:0 0 0 3px #25437a1a}.form-group-checkbox{align-items:center;gap:8px;margin-top:14px;display:flex}.form-group-checkbox input{cursor:pointer;width:16px;height:16px}.form-group-checkbox label{color:var(--color-text-dark);cursor:pointer;font-size:.85rem;font-weight:600}.modal-devices-scroll{flex-direction:column;gap:16px;max-height:320px;padding-right:4px;display:flex;overflow-y:auto}.device-form-item{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);flex-direction:column;gap:10px;padding:14px;display:flex;position:relative}.device-item-header{border-bottom:1px dashed var(--color-border);color:var(--color-text);justify-content:space-between;align-items:center;padding-bottom:6px;font-size:.85rem;font-weight:700;display:flex}.btn-remove-device{color:var(--color-absent);cursor:pointer;background:0 0;border:none;align-items:center;gap:2px;font-size:.75rem;font-weight:600;display:flex}.modal-actions-footer{border-top:1px solid var(--color-border);justify-content:flex-end;gap:10px;padding-top:16px;display:flex}.modal-actions-footer button{border-radius:var(--radius-sm);cursor:pointer;padding:10px 20px;font-size:.85rem;font-weight:600;transition:all .2s}.modal-actions-footer .btn-cancel{border:1px solid var(--color-border);color:var(--color-text);background:#fff}.modal-actions-footer .btn-cancel:hover{background:var(--color-bg)}.modal-actions-footer .btn-submit{background:var(--color-primary);color:#fff;border:none}.modal-actions-footer .btn-submit:hover{background:var(--color-primary-hover)}.tech-checkbox-list{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);flex-direction:column;gap:8px;max-height:200px;padding:10px;display:flex;overflow-y:auto}.tech-checkbox-row{align-items:center;gap:10px;display:flex}.tech-checkbox-row input{cursor:pointer;width:16px;height:16px}.tech-checkbox-row label{color:var(--color-text-dark);cursor:pointer;font-size:.85rem;font-weight:500}.status-badge{border-radius:99px;padding:4px 8px;font-size:.75rem;font-weight:700;display:inline-block}.status-badge.lg{padding:6px 14px;font-size:.85rem}.status-badge.sm{padding:2px 6px;font-size:.65rem}.status-pending{color:#ef4444;background:#fee2e2}.status-waiting{color:#d97706;background:#fef3c7}.status-checking{color:#0284c7;background:#e0f2fe}.status-checked{color:#4f46e5;background:#e0e7ff}.status-inprogress{color:#7c3aed;background:#f5f3ff}.status-completed{color:#16a34a;background:#dcfce7}.status-delivered{color:#059669;background:#ecfdf5}.status-cancelled{color:#64748b;background:#f1f5f9}.status-color-pending{color:#ef4444}.status-color-inprogress{color:#7c3aed}.status-color-completed{color:#16a34a}.infinite-scroll-footer{text-align:center;color:var(--color-text-light);padding:16px 8px 24px;font-size:.8rem;font-weight:500}.loading-more-text{background:var(--color-card);border:1px solid var(--color-border);border-radius:99px;padding:6px 14px;display:inline-block;box-shadow:0 2px 4px #0000000a}.end-list-text{opacity:.75;font-style:italic}@media (width<=900px){.orders-container{height:auto;overflow-y:auto}.orders-layout{grid-template-columns:1fr;height:auto}.orders-list-panel{height:550px}.orders-list-wrapper{-webkit-overflow-scrolling:touch}.orders-detail-panel{height:600px}}.qr-print-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1200;background-color:#0f172aa6;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.qr-print-modal-container{background:#fff;border:1px solid #e2e8f0;border-radius:16px;flex-direction:column;width:95vw;max-width:1040px;max-height:90vh;display:flex;overflow:hidden;box-shadow:0 25px 50px -12px #00000040}.qr-print-modal-header{background:#f8fafc;border-bottom:1px solid #e2e8f0;flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 22px;display:flex}.qr-print-modal-header h3{color:#0f172a;align-items:center;gap:10px;margin:0;font-size:17px;font-weight:700;display:flex}.qr-print-modal-header p{color:#64748b;margin:3px 0 0;font-size:13px}.btn-close-modal{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:flex}.btn-close-modal:hover{color:#0f172a;background:#e2e8f0}.qr-print-modal-body{flex:1;min-height:0;display:flex;overflow:hidden}.qr-print-controls-pane{box-sizing:border-box;background:#fff;border-right:1px solid #e2e8f0;flex-direction:column;gap:16px;width:50%;min-width:380px;padding:18px 20px;display:flex;overflow-y:auto}.control-group{flex-direction:column;gap:8px;display:flex}.control-group-title{color:#0f172a;border-bottom:1px solid #f1f5f9;align-items:center;gap:8px;margin-bottom:2px;padding-bottom:4px;font-size:13.5px;font-weight:700;display:flex}.control-grid-2{grid-template-columns:1fr 1fr;gap:10px;display:grid}.control-label{color:#475569;margin-bottom:4px;font-size:12px;font-weight:600;display:block}.control-select,.control-input{color:#0f172a;box-sizing:border-box;background:#fff;border:1.5px solid #cbd5e1;border-radius:8px;outline:none;width:100%;padding:7px 10px;font-size:13px;transition:border-color .2s,box-shadow .2s}.control-select:focus,.control-input:focus{border-color:#0284c7;box-shadow:0 0 0 3px #0284c726}.btn-test-driver{color:#fff;cursor:pointer;background:#0284c7;border:none;border-radius:6px;align-items:center;gap:6px;width:fit-content;padding:6px 12px;font-size:12px;font-weight:600;transition:background .2s;display:inline-flex}.btn-test-driver:hover{background:#0369a1}.driver-status-badge{color:#166534;background:#dcfce7;border:1px solid #bbf7d0;border-radius:6px;margin-top:4px;padding:6px 10px;font-size:11px;font-weight:600}.preset-buttons-row{flex-wrap:wrap;gap:6px;display:flex}.preset-btn{color:#475569;cursor:pointer;background:#f8fafc;border:1.5px solid #cbd5e1;border-radius:6px;padding:5px 10px;font-size:12px;font-weight:600;transition:all .15s}.preset-btn:hover{color:#0f172a;background:#f1f5f9;border-color:#94a3b8}.preset-btn.active{color:#0369a1;background:#e0f2fe;border-color:#0284c7;font-weight:700}.dimension-inputs-row{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:8px 10px}.dimension-inputs-row .control-label{color:#64748b;margin-bottom:2px;font-size:11px}.dimension-inputs-row .control-input{text-align:center;padding:5px 8px;font-size:12.5px;font-weight:600}.checkbox-options-list{flex-direction:column;gap:8px;display:flex}.custom-toggle-card{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;background:#fff;border:1.5px solid #e2e8f0;border-radius:10px;padding:10px 14px;transition:all .2s;flex-direction:row!important;justify-content:flex-start!important;align-items:center!important;gap:12px!important;width:100%!important;margin:0!important;display:flex!important}.custom-toggle-card:hover{background:#f8fafc;border-color:#cbd5e1}.custom-toggle-card.checked{background:#f0f9ff;border-color:#0284c7}.custom-toggle-card input[type=checkbox]{accent-color:#0284c7;cursor:pointer;flex-shrink:0;width:18px;height:18px;margin:0!important}.toggle-card-content{flex-direction:column;flex:1;gap:2px;display:flex}.toggle-card-title{color:#0f172a;font-size:13px;font-weight:600;line-height:1.3}.custom-toggle-card.checked .toggle-card-title{color:#0369a1}.toggle-card-sub{color:#64748b;font-size:11.5px;line-height:1.2}.checkboxes-grid{flex-direction:column;gap:8px;display:flex}.checkbox-item{color:#334155!important;cursor:pointer!important;-webkit-user-select:none!important;user-select:none!important;justify-content:flex-start!important;align-items:center!important;gap:8px!important;width:fit-content!important;margin:0!important;font-size:13px!important;font-weight:500!important;display:inline-flex!important}.qr-print-preview-pane{box-sizing:border-box;background:#f8fafc;flex-direction:column;flex:1;width:50%;padding:18px 20px;display:flex;overflow:hidden}.preview-header{flex-shrink:0;justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.preview-header-title{color:#0f172a;align-items:center;gap:6px;font-size:13.5px;font-weight:700;display:flex}.preview-viewport-wrapper{box-sizing:border-box;background-image:radial-gradient(#cbd5e1 1.2px,#0000 1.2px);background-size:16px 16px;border:1px dashed #cbd5e1;border-radius:12px;flex:1;justify-content:center;align-items:center;width:100%;padding:24px 16px;display:flex;overflow:auto}.live-qr-card{box-sizing:border-box;background:#fff;margin:auto;transition:all .2s;display:flex;box-shadow:0 4px 14px #00000014}.live-qr-card.order-qr_top{flex-direction:column;justify-content:center;align-items:center}.live-qr-card.order-title_top{flex-direction:column-reverse;justify-content:center;align-items:center}.live-qr-card.order-horizontal{flex-direction:row;justify-content:center;align-items:center}.live-qr-image-wrapper{flex-shrink:0;justify-content:center;align-items:center;display:flex}.live-qr-img{object-fit:contain}.live-qr-meta{flex-direction:column;width:100%;display:flex}.live-qr-title{color:#0f172a;word-break:break-word;font-weight:800;line-height:1.25}.live-qr-subtext{color:#475569;margin-top:2px}.live-qr-code-box{box-sizing:border-box;background:#f1f5f9;border:1px solid #cbd5e1;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;width:100%;padding:4px 8px;display:flex}.live-qr-code-label{color:#475569;letter-spacing:.5px;font-size:9px;font-weight:700}.live-qr-code-value{color:#0f172a;letter-spacing:.8px;word-break:break-all;text-align:center;font-family:Courier New,Courier,monospace;font-weight:800}.qr-print-modal-footer{background:#fff;border-top:1px solid #e2e8f0;flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 22px;display:flex}.modal-footer-left,.modal-footer-right{align-items:center;gap:10px;display:flex}.btn-secondary{color:#334155;cursor:pointer;background:#f1f5f9;border:1.5px solid #cbd5e1;border-radius:8px;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .2s;display:inline-flex}.btn-secondary:hover{color:#0f172a;background:#e2e8f0}.btn-primary-print{color:#fff;cursor:pointer;background:#0284c7;border:none;border-radius:8px;align-items:center;gap:8px;padding:9px 20px;font-size:13.5px;font-weight:700;transition:all .2s;display:inline-flex;box-shadow:0 2px 6px #0284c74d}.btn-primary-print:hover{background:#0369a1;box-shadow:0 4px 10px #0284c766}@media (width<=860px){.qr-print-modal-body{flex-direction:column;overflow-y:auto}.qr-print-controls-pane,.qr-print-preview-pane{border-right:none;width:100%;min-width:0}.qr-print-controls-pane{border-bottom:1px solid #e2e8f0}}.warehouse-container{box-sizing:border-box;flex-direction:column;gap:20px;width:100%;padding:0;animation:.4s ease-out fadeIn;display:flex}.warehouse-header-bar{background:var(--color-card,#fff);border:var(--border-style,1px solid #e2e8f0);border-radius:var(--radius-lg,12px);box-sizing:border-box;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:12px 16px;display:flex;box-shadow:0 2px 4px -1px #00000005}.warehouse-layout{box-sizing:border-box;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start;gap:24px;width:100%;display:grid}.warehouse-main-panel{flex-direction:column;gap:18px;width:100%;min-width:0;display:flex}.warehouse-stats-row{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.w-stat-card{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-md);align-items:center;gap:10px;padding:8px 12px;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 2px 4px -1px #00000005}.w-stat-card:hover{transform:translateY(-1px);box-shadow:0 4px 8px #0000000a}.stat-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.stat-icon.total{background:var(--color-primary-light);color:var(--color-primary)}.stat-icon.available{background:var(--color-success-light);color:var(--color-success)}.stat-icon.checkedout{background:var(--color-late-light);color:var(--color-late)}.stat-icon.maintenance{background:var(--color-absent-light);color:var(--color-absent)}.stat-text{flex-direction:column;min-width:0;display:flex}.stat-val{color:var(--color-text-dark);font-size:1.15rem;font-weight:700;line-height:1.15}.stat-lbl{color:var(--color-text-light);white-space:nowrap;text-overflow:ellipsis;margin-top:1px;font-size:.72rem;font-weight:500;overflow:hidden}.text-warning{color:var(--color-late)!important}.warehouse-control-bar{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);flex-direction:column;gap:10px;padding:12px 16px;display:flex;box-shadow:0 4px 6px -1px #00000005}.warehouse-control-top-row{flex-wrap:wrap;align-items:center;gap:10px;width:100%;display:flex}.warehouse-control-bottom-row{border-top:1px solid var(--color-border-light,#f1f5f9);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;width:100%;padding-top:8px;display:flex}.search-input-wrapper{flex:1;align-items:center;min-width:200px;display:flex;position:relative}.search-input-wrapper .search-icon{color:var(--color-text-light);pointer-events:none;z-index:2;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.flex-1{flex:1}.w-search-input{border:1px solid var(--color-border);border-radius:var(--radius-sm);width:100%;height:38px;color:var(--color-text-dark);background:var(--color-bg);padding:0 12px 0 38px;font-size:.85rem;transition:all .2s}.w-search-input:focus{border-color:var(--color-primary);background:#fff;outline:none;box-shadow:0 0 0 3px #25437a1a}.filters-actions-wrapper{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.w-status-select{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);height:38px;color:var(--color-text);cursor:pointer;outline:none;padding:0 12px;font-size:.85rem;font-weight:500;transition:all .2s}.w-status-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #25437a1a}.btn-add-board{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;justify-content:center;align-items:center;gap:6px;height:38px;padding:0 16px;font-size:.85rem;font-weight:600;transition:background .2s;display:inline-flex}.btn-add-board:hover{background:var(--color-primary-hover)}.btn-export-pdf-all{border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-bg);height:38px;color:var(--color-text);cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;gap:6px;padding:0 14px;font-size:.85rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-export-pdf-all:hover{color:var(--color-primary);background:#25437a14}.warehouse-mode-toggle-group{align-items:center;gap:8px;display:flex}.mode-toggle-label{color:var(--color-text-secondary,#64748b);font-size:.82rem;font-weight:600}.warehouse-pill-btn{border:1px solid var(--color-border);background:var(--color-bg);color:var(--color-text);cursor:pointer;border-radius:20px;align-items:center;gap:6px;padding:6px 14px;font-size:.82rem;font-weight:600;transition:all .2s;display:inline-flex}.warehouse-pill-btn:hover{border-color:var(--color-primary);color:var(--color-primary);background:#25437a0a}.warehouse-pill-btn.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary);box-shadow:0 2px 4px #25437a33}.boards-grid-wrapper{flex:1;padding-right:4px;overflow-y:auto}.boards-grid-list{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;display:grid}.board-grid-card{background:var(--color-card);border:var(--border-style);border-radius:var(--radius-lg);cursor:pointer;flex-direction:column;justify-content:space-between;gap:12px;padding:16px;transition:all .2s;display:flex;box-shadow:0 2px 4px #00000005}.board-grid-card:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000000d}.board-grid-card.selected{border-color:var(--color-primary);background:#f8fafc}.board-card-header{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.board-card-title{color:var(--color-text-dark);white-space:nowrap;text-overflow:ellipsis;flex:1;margin:0;font-size:.95rem;font-weight:700;overflow:hidden}.board-status-dot-badge{white-space:nowrap;border-radius:99px;padding:2px 8px;font-size:.7rem;font-weight:700}.board-card-specs{flex-direction:column;gap:6px;display:flex}.spec-row{color:var(--color-text);align-items:center;gap:8px;font-size:.8rem;display:flex}.board-card-borrow-info{border-top:1px dashed var(--color-border);color:var(--color-text);padding-top:8px;font-size:.75rem}.warehouse-detail-panel{background:var(--color-card,#fff);border:var(--border-style,1px solid #e2e8f0);border-radius:var(--radius-lg,12px);box-sizing:border-box;flex-direction:column;max-height:calc(100vh - 120px);display:flex;position:sticky;top:90px;overflow:hidden;box-shadow:0 4px 6px -1px #00000008}.detail-scroller{box-sizing:border-box;flex-direction:column;flex:1;gap:20px;padding:20px;display:flex;overflow-y:auto}.detail-header-row{border-bottom:1px solid var(--color-border,#e2e8f0);justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:16px;display:flex}.title-wrapper{align-items:center;gap:12px;display:flex}.board-badge-icon{background:var(--color-primary-light,#eff6ff);width:44px;height:44px;color:var(--color-primary,#2563eb);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.detail-board-name{color:var(--color-text-dark,#0f172a);margin:0 0 4px;font-size:1.15rem;font-weight:700}.status-badge{border-radius:99px;width:fit-content;padding:3px 10px;font-size:.72rem;font-weight:700;display:inline-block}.actions-wrapper{align-items:center;gap:8px;display:flex}.btn-action-outline{border-radius:var(--radius-sm,6px);border:1.5px solid var(--color-border,#cbd5e1);height:36px;color:var(--color-text,#334155);cursor:pointer;white-space:nowrap;background:#fff;justify-content:center;align-items:center;gap:6px;padding:0 12px;font-size:.82rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-action-outline:hover{background:var(--color-bg,#f8fafc);border-color:var(--color-primary,#2563eb);color:var(--color-primary,#2563eb)}.btn-action-outline.danger{color:#dc2626;border-color:#fca5a5}.btn-action-outline.danger:hover{background:#fef2f2;border-color:#dc2626}.detail-content-section{flex-direction:column;gap:10px;display:flex}.section-title{color:var(--color-text-dark,#0f172a);text-transform:uppercase;letter-spacing:.05em;margin:0;font-size:.82rem;font-weight:700}.detail-main-actions-bar{background:var(--color-bg,#f8fafc);border:1px solid var(--color-border,#e2e8f0);border-radius:var(--radius-sm,8px);align-items:center;gap:10px;padding:12px 16px;display:flex}.btn-checkout-board{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;width:100%;padding:10px;font-size:.85rem;font-weight:600;transition:background .2s}.btn-checkout-board:hover{background:var(--color-primary-hover)}.btn-return-board{background:var(--color-success);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;width:100%;padding:10px;font-size:.85rem;font-weight:600;transition:background .2s}.btn-return-board:hover{background:#52801a}.specs-info-grid{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);flex-direction:column;gap:10px;padding:16px;display:flex}.spec-detail-item{justify-content:space-between;align-items:center;font-size:.85rem;display:flex}.spec-detail-item .label{color:var(--color-text-light);font-weight:500}.spec-detail-item .value{color:var(--color-text-dark);font-weight:600}.active-borrow-card{border-radius:var(--radius-sm);background:#fef3c7;border:1px solid #fde68a;flex-direction:column;gap:6px;padding:14px;display:flex}.borrow-row{font-size:.8rem;display:flex}.borrow-row .lbl{width:120px;color:var(--color-late);font-weight:600}.borrow-row .val{color:var(--color-text-dark);font-weight:600}.borrow-row .val.link-code{background:#fff;border-radius:4px;padding:1px 6px;font-family:monospace;font-size:.75rem}.description-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:12px 16px}.description-card p{color:var(--color-text);margin:0;font-size:.85rem;line-height:1.4}.btn-export-pdf-all{background:var(--color-bg);color:var(--color-primary);border:1px solid var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;align-items:center;gap:6px;padding:8px 14px;font-size:.85rem;font-weight:600;transition:all .2s;display:flex}.btn-export-pdf-all:hover{background:var(--color-primary-light);border-color:var(--color-primary)}.qrcode-section-header{justify-content:space-between;align-items:center;width:100%;margin-bottom:8px;display:flex}.margin-0{margin:0!important}.btn-export-qr-pdf{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:6px;padding:6px 12px;font-size:.8rem;font-weight:600;transition:background .2s;display:inline-flex}.btn-export-qr-pdf:hover{background:var(--color-primary-hover)}.btn-export-qr-pdf-outline{color:var(--color-primary);border:1px solid var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;background:#fff;justify-content:center;align-items:center;gap:6px;margin-top:8px;padding:6px 12px;font-size:.78rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-export-qr-pdf-outline:hover{background:var(--color-primary-light)}.btn-export-qr-pdf.copied-success{background:#16a34a!important}.btn-export-qr-pdf-outline.copied-success{color:#15803d!important;background:#dcfce7!important;border-color:#86efac!important}.align-center{align-items:center}.qrcode-container-card{border:1px dashed var(--color-text-light);border-radius:var(--radius-sm);background:#fff;flex-direction:column;align-items:center;gap:12px;width:100%;padding:20px;display:flex}.qrcode-img{background:#fff;border-radius:6px;width:150px;height:150px;box-shadow:0 4px 6px -1px #0000000d}.qrcode-meta{text-align:center;flex-direction:column;align-items:center;gap:4px;display:flex}.qr-value{color:var(--color-text-dark);font-family:monospace;font-size:.9rem;font-weight:700}.qr-desc{color:var(--color-text-light);font-size:.7rem;line-height:1.3}.history-nodes-list{flex-direction:column;padding-left:14px;display:flex;position:relative}.history-nodes-list:before{content:"";background:var(--color-border);width:2px;position:absolute;top:4px;bottom:4px;left:3px}.history-node-item{padding-bottom:20px;position:relative}.history-node-item:last-child{padding-bottom:0}.history-node-item .node-marker{background:var(--color-primary);border:2px solid #fff;border-radius:50%;width:8px;height:8px;position:absolute;top:4px;left:-15px}.node-info{flex-direction:column;gap:2px;display:flex}.node-header{justify-content:space-between;align-items:center;font-size:.8rem;display:flex}.node-date{color:var(--color-text-light);font-size:.7rem}.node-ref-order{color:var(--color-primary);margin:0;font-family:monospace;font-size:.75rem}.node-note{color:var(--color-text);border-left:2px solid var(--color-border);background:#fff;border-radius:4px;margin:2px 0 0;padding:4px 8px;font-size:.75rem}.node-return-box{color:var(--color-text);background:#f1f5f9;border-radius:4px;margin-top:4px;padding:4px 8px;font-size:.75rem}.return-indicator{color:var(--color-success);font-weight:600}.node-active-badge{color:var(--color-late);background:#fef3c7;border-radius:4px;align-self:flex-start;margin-top:4px;padding:2px 6px;font-size:.65rem;font-weight:700;display:inline-block}.w-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0f172a99;justify-content:center;align-items:center;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.w-modal-card{border-radius:var(--radius-lg);background:#fff;flex-direction:column;width:580px;max-height:90vh;display:flex;overflow:hidden;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.w-modal-card.small{width:480px}.board-available{background:var(--color-success-light);color:var(--color-success)}.board-checkedout{background:var(--color-late-light);color:var(--color-late)}.board-inrepair{color:var(--color-ot);background:#8b5cf61a}.board-damaged{background:var(--color-absent-light);color:var(--color-absent)}.board-lost{color:#fff;background:#334155}.board-archived{color:var(--color-text-light);background:#f1f5f9}.board-maintenance{color:#b91c1c;background:#fee2e2}@media (width<=900px){.warehouse-layout{grid-template-columns:1fr;height:auto}.warehouse-main-panel{height:500px}.warehouse-detail-panel{height:600px}}.warehouse-mode-toggle{background:var(--color-bg);border:var(--border-style);border-radius:var(--radius-lg);gap:4px;max-width:320px;margin-bottom:16px;padding:4px;display:flex}.warehouse-mode-btn{cursor:pointer;color:var(--color-text-secondary,#64748b);background:0 0;border:none;border-radius:8px;align-items:center;gap:6px;padding:8px 16px;font-size:.88rem;font-weight:600;transition:all .2s;display:inline-flex}.warehouse-mode-btn:hover{color:var(--color-primary);background:#25437a0f}.warehouse-mode-btn.active{box-shadow:0 2px 6px #25437a40;background:var(--color-primary)!important;color:#fff!important}.mode-toggle-btn{border-radius:calc(var(--radius-lg) - 2px);color:var(--color-text);cursor:pointer;background:0 0;border:none;flex:1;justify-content:center;align-items:center;gap:8px;padding:8px 16px;font-size:.85rem;font-weight:600;transition:all .2s;display:flex}.mode-toggle-btn:hover{color:var(--color-primary);background:#25437a0d}.mode-toggle-btn.active{background:var(--color-primary);color:#fff}.return-type-options{flex-direction:column;gap:10px;display:flex}.return-type-card{border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;background:var(--color-bg);-webkit-user-select:none;user-select:none;align-items:flex-start;gap:12px;padding:14px 16px;transition:border-color .18s,background .18s,box-shadow .18s;display:flex}.return-type-card:hover{border-color:var(--color-primary);background:#25437a0a}.return-type-card.selected{border-color:var(--color-primary);background:#25437a12;box-shadow:0 0 0 3px #25437a1f}.return-type-icon{flex-shrink:0;margin-top:2px;font-size:1.4rem;line-height:1}.return-type-text{flex-direction:column;gap:2px;display:flex}.return-type-text strong{color:var(--color-text);font-size:.95rem;font-weight:700}.return-type-text span{color:var(--color-text-light);font-size:.78rem;line-height:1.4}.return-type-card.selected .return-type-text strong{color:var(--color-primary)}.checkout-stock-banner{border-radius:var(--radius-md);background:var(--color-bg);border:var(--border-style);justify-content:space-between;align-items:center;margin-bottom:14px;padding:10px 14px;display:flex}.checkout-stock-banner .stock-label{color:var(--color-text-light);font-size:.85rem;font-weight:600}.checkout-stock-banner .stock-value{font-size:1rem;font-weight:700}.checkout-stock-banner .stock-value.ok{color:var(--color-success)}.checkout-stock-banner .stock-value.empty{color:var(--color-absent)}.field-error-msg{color:var(--color-absent);margin-top:4px;font-size:.78rem;font-weight:600;display:block}.text-success{color:var(--color-success)!important}.text-danger{color:var(--color-absent)!important}.perm-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0f172a73;justify-content:center;align-items:center;padding:1rem;animation:.15s overlay-in;display:flex;position:fixed;inset:0}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.perm-modal{background:var(--color-card,#fff);border:var(--border-style,1px solid #e2e8f0);border-radius:var(--radius-lg,18px);flex-direction:column;width:100%;max-width:720px;max-height:90vh;animation:.2s modal-in;display:flex;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@keyframes modal-in{0%{opacity:0;transform:translateY(16px)scale(.97)}to{opacity:1;transform:none}}.perm-modal-header{border-bottom:1px solid var(--color-border,#e2e8f0);flex-shrink:0;align-items:center;gap:1rem;padding:1.25rem 1.5rem;display:flex}.perm-modal-header-info{flex:1;min-width:0}.perm-modal-title{color:var(--color-text-dark,#0f172a);white-space:nowrap;text-overflow:ellipsis;margin:0 0 .2rem;font-size:1rem;font-weight:700;overflow:hidden}.perm-modal-subtitle{color:var(--color-text-light,#64748b);margin:0;font-size:.78rem}.perm-modal-close{color:#64748b;cursor:pointer;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;transition:all .15s;display:flex}.perm-modal-close:hover{color:#ef4444;background:#fee2e2;border-color:#fca5a5}.perm-legend{border-bottom:1px solid var(--color-border,#e2e8f0);background:#f8fafc;flex-wrap:wrap;flex-shrink:0;gap:1.25rem;padding:.75rem 1.5rem;display:flex}.perm-legend-item{color:#64748b;align-items:center;gap:.4rem;font-size:.75rem;font-weight:500;display:flex}.perm-legend-dot{border-radius:3px;flex-shrink:0;width:10px;height:10px}.perm-legend-dot.inherited{background:#818cf8}.perm-legend-dot.granted{background:#10b981}.perm-legend-dot.denied{background:#ef4444}.perm-modal-body{flex:1;padding:1rem 1.5rem;overflow-y:auto}.perm-modal-body::-webkit-scrollbar{width:6px}.perm-modal-body::-webkit-scrollbar-track{background:0 0}.perm-modal-body::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.perm-modal-loading{color:#64748b;flex-direction:column;align-items:center;gap:1rem;padding:3rem;display:flex}.perm-modal-spinner{border:3px solid #25437a26;border-top-color:var(--color-primary,#25437a);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}.perm-module-group{margin-bottom:1.25rem}.perm-module-header{border-bottom:1px solid #f1f5f9;align-items:center;gap:.5rem;margin-bottom:.5rem;padding:.5rem 0;display:flex}.perm-module-label{text-transform:uppercase;letter-spacing:.08em;color:var(--color-primary,#25437a);font-size:.7rem;font-weight:700}.perm-module-count{color:#3730a3;background:#e0e7ff;border-radius:10px;padding:.1rem .4rem;font-size:.68rem;font-weight:600}.perm-row{background:#fff;border:1px solid #f1f5f9;border-radius:10px;align-items:center;gap:.75rem;margin-bottom:.35rem;padding:.6rem .75rem;transition:background .12s,border-color .12s;display:flex}.perm-row:hover{background:#f8fafc;border-color:#e2e8f0}.perm-row-info{flex:1;min-width:0}.perm-row-name{color:var(--color-text-dark,#0f172a);align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;display:flex}.perm-row-code{color:#64748b;font-family:monospace;font-size:.68rem}.perm-row-desc{color:var(--color-text,#475569);white-space:nowrap;text-overflow:ellipsis;margin-top:.1rem;font-size:.75rem;overflow:hidden}.perm-toggle-group{flex-shrink:0;gap:.35rem;display:flex}.perm-toggle-btn{cursor:pointer;color:#64748b;background:#fff;border:1px solid #cbd5e1;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .15s;display:flex;position:relative}.perm-toggle-btn:hover{color:#1e293b;background:#f1f5f9}.perm-toggle-btn.inherited.active{color:#3730a3;background:#e0e7ff;border-color:#818cf8}.perm-toggle-btn.grant.active{color:#15803d;background:#dcfce7;border-color:#86efac}.perm-toggle-btn.deny.active{color:#b91c1c;background:#fee2e2;border-color:#fca5a5}.perm-effective{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;font-size:.75rem;font-weight:700;display:flex}.perm-effective.yes{color:#15803d;background:#dcfce7}.perm-effective.no{color:#b91c1c;background:#fee2e2}.perm-modal-footer{border-top:1px solid var(--color-border,#e2e8f0);background:#f8fafc;flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:.75rem;padding:1rem 1.5rem;display:flex}.perm-modal-footer-info{color:#64748b;font-size:.78rem;font-weight:500}.perm-footer-btns{gap:.5rem;display:flex}.btn-perm-reset{color:#64748b;cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:10px;padding:.5rem 1rem;font-size:.85rem;font-weight:500;transition:all .15s}.btn-perm-reset:hover:not(:disabled){color:#dc2626;background:#fee2e2;border-color:#fca5a5}.btn-perm-save{background:var(--color-primary,#25437a);color:#fff;cursor:pointer;border:none;border-radius:10px;align-items:center;gap:.4rem;padding:.5rem 1.25rem;font-size:.85rem;font-weight:600;transition:all .15s;display:flex}.btn-perm-save:hover:not(:disabled){background:var(--color-primary-hover,#1b325c);transform:translateY(-1px)}.btn-perm-save:disabled,.btn-perm-reset:disabled{opacity:.4;cursor:not-allowed;transform:none}.perm-changed-badge{color:#a16207;background:#fef9c3;border:1px solid #fef08a;border-radius:20px;padding:.15rem .5rem;font-size:.72rem;font-weight:600}.perm-toggle-btn[title]:hover:after{content:attr(title);color:#fff;white-space:nowrap;z-index:10;pointer-events:none;background:#0f172a;border:1px solid #334155;border-radius:6px;padding:.25rem .5rem;font-size:.7rem;position:absolute;bottom:120%;left:50%;transform:translate(-50%)}@media (width<=600px){.perm-modal{border-radius:14px}.perm-modal-body{padding:.75rem 1rem}.perm-modal-header,.perm-modal-footer{padding:1rem}.perm-row-code{display:none}}.accounts-tab{max-width:1400px;margin:0 auto;padding:0 1.5rem 2rem}.accounts-header{flex-wrap:wrap;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.accounts-search-box{background:var(--color-card,#fff);border:var(--border-style,1px solid #e2e8f0);border-radius:var(--radius-lg,10px);min-width:240px;color:var(--color-text-dark,#0f172a);flex:1;align-items:center;gap:.5rem;padding:.55rem .9rem;transition:border-color .2s,box-shadow .2s;display:flex;box-shadow:0 1px 3px #00000008}.accounts-search-box:focus-within{border-color:var(--color-primary,#25437a);box-shadow:0 0 0 3px #25437a1a}.accounts-search-box input{color:inherit;background:0 0;border:none;outline:none;flex:1;min-width:0;font-size:.875rem}.accounts-search-box input::placeholder{color:var(--color-text-light,#94a3b8)}.accounts-filter-select{background:var(--color-card,#fff);border:var(--border-style,1px solid #e2e8f0);border-radius:var(--radius-lg,10px);color:var(--color-text-dark,#0f172a);cursor:pointer;outline:none;padding:.55rem .9rem;font-size:.875rem;transition:border-color .2s;box-shadow:0 1px 3px #00000008}.accounts-filter-select:focus{border-color:var(--color-primary,#25437a)}.accounts-stats-row{flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem;display:flex}.accounts-stat-card{background:var(--color-card,#fff);border:var(--border-style,1px solid #e2e8f0);border-radius:var(--radius-lg,12px);flex-direction:column;flex:1;gap:.25rem;min-width:130px;padding:1rem 1.25rem;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 4px 6px -1px #00000008}.accounts-stat-card:hover{transform:translateY(-2px);box-shadow:0 8px 12px #0000000d}.accounts-stat-card .stat-value{color:var(--color-text-dark,#0f172a);font-size:1.75rem;font-weight:700;line-height:1}.accounts-stat-card .stat-label{color:var(--color-text-light,#64748b);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.accounts-table-wrapper{background:var(--color-card,#fff);border:var(--border-style,1px solid #e2e8f0);border-radius:var(--radius-lg,14px);overflow:hidden;box-shadow:0 4px 6px -1px #00000008}.accounts-table{border-collapse:collapse;width:100%}.accounts-table thead th{text-align:left;text-transform:uppercase;letter-spacing:.06em;color:#64748b;border-bottom:1px solid var(--color-border,#e2e8f0);white-space:nowrap;background:#f8fafc;padding:.85rem 1rem;font-size:.75rem;font-weight:700}.accounts-table tbody tr{transition:background .15s}.accounts-table tbody tr:hover{background:#25437a08}.accounts-table tbody tr+tr td{border-top:1px solid #f1f5f9}.accounts-table tbody td{vertical-align:middle;color:var(--color-text-dark,#0f172a);padding:.85rem 1rem;font-size:.875rem}.user-cell{align-items:center;gap:.75rem;display:flex}.user-avatar-sm{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:.875rem;font-weight:700;display:flex;box-shadow:0 2px 4px #0000001a}.user-cell-info{flex-direction:column;min-width:0;display:flex}.user-cell-name{color:var(--color-text-dark,#0f172a);white-space:nowrap;text-overflow:ellipsis;max-width:200px;font-weight:600;overflow:hidden}.user-cell-username{color:var(--color-text-light,#94a3b8);font-size:.75rem}.role-badge{white-space:nowrap;border:1px solid;border-radius:20px;align-items:center;gap:.35rem;padding:.25rem .65rem;font-size:.75rem;font-weight:600;display:inline-flex}.status-badge{border:1px solid #0000;border-radius:20px;align-items:center;gap:.3rem;padding:.2rem .65rem;font-size:.75rem;font-weight:600;display:inline-flex}.status-badge.active{color:#15803d;background:#dcfce7;border-color:#bbf7d0}.status-badge.pending{color:#a16207;background:#fef9c3;border-color:#fef08a}.status-badge.suspended{color:#b91c1c;background:#fee2e2;border-color:#fca5a5}.status-badge.registered{color:#0369a1;background:#e0f2fe;border-color:#bae6fd}.status-badge.deleted{color:#4b5563;background:#f3f4f6;border-color:#e5e7eb}.permissions-mini{flex-wrap:wrap;gap:.3rem;max-width:320px;display:flex}.perm-chip{color:#3730a3;white-space:nowrap;background:#eef2ff;border:1px solid #c7d2fe;border-radius:6px;padding:.15rem .5rem;font-size:.68rem;font-weight:500}.perm-chip-more{color:#64748b;white-space:nowrap;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:6px;padding:.15rem .5rem;font-size:.68rem;font-weight:500}.accounts-actions{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.accounts-role-select{color:var(--color-text-dark,#0f172a);cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:8px;outline:none;min-width:120px;padding:.3rem .6rem;font-size:.8rem;transition:border-color .2s}.accounts-role-select:focus{border-color:var(--color-primary,#25437a)}.accounts-role-select:disabled{opacity:.4;cursor:not-allowed}.btn-icon-sm{cursor:pointer;color:#64748b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.btn-icon-sm:hover:not(:disabled){color:#4338ca;background:#e0e7ff;border-color:#a5b4fc}.btn-icon-sm.danger:hover:not(:disabled){color:#dc2626;background:#fee2e2;border-color:#fca5a5}.btn-icon-sm.success:hover:not(:disabled){color:#16a34a;background:#dcfce7;border-color:#86efac}.btn-icon-sm:disabled{opacity:.3;cursor:not-allowed}.accounts-pagination{border-top:1px solid var(--color-border,#e2e8f0);background:#f8fafc;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;padding:1rem 1.25rem;display:flex}.accounts-pagination-info{color:#64748b;font-size:.8rem;font-weight:500}.accounts-pagination-btns{gap:.4rem;display:flex}.accounts-page-btn{color:var(--color-text-dark,#0f172a);cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:8px;padding:.35rem .75rem;font-size:.8rem;font-weight:500;transition:all .2s}.accounts-page-btn:hover:not(:disabled){background:#f1f5f9;border-color:#94a3b8}.accounts-page-btn.active-page{background:var(--color-primary,#25437a);border-color:var(--color-primary,#25437a);color:#fff}.accounts-page-btn:disabled{opacity:.35;cursor:not-allowed}.accounts-matrix-card{background:var(--color-card,#fff);border:var(--border-style,1px solid #e2e8f0);border-radius:var(--radius-lg,14px);margin-top:1.5rem;padding:1.25rem;box-shadow:0 4px 6px -1px #00000008}.accounts-matrix-table{border-collapse:collapse;width:100%;font-size:.78rem}.accounts-matrix-table thead th{text-align:left;color:#64748b;white-space:nowrap;background:#f8fafc;border-bottom:1px solid #e2e8f0;padding:.5rem .75rem;font-weight:700}.accounts-matrix-table thead th:not(:first-child){text-align:center;padding:.5rem;font-size:.72rem}.accounts-matrix-table tbody tr{border-bottom:1px solid #f1f5f9;transition:background .15s}.accounts-matrix-table tbody tr:hover{background:#f8fafc}.accounts-matrix-table tbody td{color:var(--color-text-dark,#0f172a);white-space:nowrap;padding:.45rem .75rem}.accounts-empty{text-align:center;color:var(--color-text-light,#94a3b8);padding:3rem}.accounts-loading{text-align:center;color:var(--color-text-light,#94a3b8);flex-direction:column;align-items:center;gap:1rem;padding:3rem;display:flex}.accounts-spinner{border:3px solid #25437a26;border-top-color:var(--color-primary,#25437a);border-radius:50%;width:36px;height:36px;animation:.8s linear infinite spin}.dept-text{color:var(--color-text,#475569);font-size:.8rem}@media (width<=900px){.accounts-table thead th:nth-child(5),.accounts-table tbody td:nth-child(5){display:none}}@media (width<=640px){.accounts-tab{padding:0 .75rem 1.5rem}.accounts-table thead th:nth-child(4),.accounts-table tbody td:nth-child(4){display:none}}.dashboard-tab{flex-direction:column;gap:24px;width:100%;display:flex}.dashboard-loading{height:300px;color:var(--color-text);justify-content:center;align-items:center;gap:10px;font-size:16px;font-weight:500;display:flex}.dashboard-header-panel{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:flex-end;padding-bottom:16px;display:flex}.welcome-info{flex-direction:column;gap:4px;display:flex}.welcome-info h2{color:var(--color-text-dark);margin:0;font-size:24px;font-weight:700}.current-date{color:var(--color-text-light);font-size:13px;font-weight:500}.btn-refresh-dashboard{background-color:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;align-items:center;gap:8px;padding:8px 14px;font-size:13.5px;font-weight:600;transition:all .2s;display:flex}.btn-refresh-dashboard:hover{background-color:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.btn-refresh-dashboard:disabled{opacity:.6;cursor:not-allowed}.dashboard-stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}@media (width<=1200px){.dashboard-stats-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.dashboard-stats-grid{grid-template-columns:1fr}}.stat-card{background-color:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);justify-content:space-between;align-items:center;padding:16px;transition:transform .2s,box-shadow .2s;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #00000003,0 2px 4px -1px #00000003}.stat-card:before{content:"";border-top-left-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg);width:4px;position:absolute;top:0;bottom:0;left:0}.stat-card:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000000a,0 4px 6px -2px #00000005}.stat-card.border-blue:before{background-color:#3b82f6}.stat-card.border-orange:before{background-color:#f59e0b}.stat-card.border-green:before{background-color:#10b981}.stat-card.border-purple:before{background-color:#8b5cf6}.stat-card.border-teal:before{background-color:#0d9488}.stat-card.border-pink:before{background-color:#ec4899}.stat-card.border-red:before{background-color:#ef4444}.stat-card.border-amber:before{background-color:#d97706}.stat-info{flex-direction:column;display:flex}.stat-label{color:var(--color-text-light);margin-bottom:4px;font-size:13px;font-weight:600}.stat-value{color:var(--color-text-dark);font-size:22px;font-weight:800;line-height:1.2}.stat-sub{color:var(--color-text-light);margin-top:4px;font-size:11px}.stat-icon-wrapper{border-radius:var(--radius-sm);justify-content:center;align-items:center;width:40px;height:40px;display:flex}.bg-blue{background-color:#eff6ff}.bg-orange{background-color:#fff7ed}.bg-green{background-color:#ecfdf5}.bg-purple{background-color:#f5f3ff}.bg-teal{background-color:#f0fdfa}.bg-pink{background-color:#fdf2f8}.bg-red{background-color:#fef2f2}.bg-amber{background-color:#fefaf0}.icon-blue{color:#3b82f6}.icon-orange{color:#f59e0b}.icon-green{color:#10b981}.icon-purple{color:#8b5cf6}.icon-teal{color:#0d9488}.icon-pink{color:#ec4899}.icon-red{color:#ef4444}.icon-amber{color:#d97706}.dashboard-content-split{grid-template-columns:1.2fr .8fr;align-items:stretch;gap:20px;display:grid}@media (width<=1024px){.dashboard-content-split{grid-template-columns:1fr}}.dashboard-charts-column{flex-direction:column;gap:20px;height:100%;display:flex}.dashboard-charts-column>.dashboard-panel:last-child{flex-direction:column;flex:1;display:flex}.dashboard-charts-column>.dashboard-panel:last-child .status-ratio-wrapper{flex:1;align-items:center;display:flex}.dashboard-lists-column{flex-direction:column;gap:20px;display:flex}.dashboard-panel{background-color:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:20px;box-shadow:0 4px 6px -1px #00000003}.dashboard-panel.flex-column{flex-direction:column;display:flex}.panel-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.panel-header .panel-title{margin-bottom:0}.panel-title{color:var(--color-text-dark);margin-top:0;margin-bottom:16px;font-size:16px;font-weight:700}.panel-badge{background-color:var(--color-primary-light);color:var(--color-primary);border-radius:20px;padding:4px 10px;font-size:11.5px;font-weight:700}.chart-container{justify-content:center;align-items:center;width:100%;display:flex}.weekly-svg{width:100%;max-height:240px}.grid-line{stroke:var(--color-border);stroke-width:1px;stroke-dasharray:4 4;opacity:.8}.y-label,.x-label{fill:var(--color-text-light);font-size:10.5px;font-weight:500}.y-label{text-anchor:end}.bar-pending{fill:#f59e0b;transition:height .3s}.bar-progress{fill:#3b82f6;transition:height .3s}.bar-completed{fill:#10b981;transition:height .3s}.chart-legend{justify-content:center;gap:20px;margin-top:12px;display:flex}.legend-item{color:var(--color-text);align-items:center;gap:6px;font-size:12px;font-weight:600;display:flex}.legend-dot{border-radius:50%;width:10px;height:10px;display:inline-block}.status-ratio-wrapper{justify-content:center;align-items:center;gap:40px;width:100%;padding:20px 0;display:flex}@media (width<=768px){.status-ratio-wrapper{flex-direction:column;gap:20px}}.pie-chart-container{justify-content:center;align-items:center;display:flex}.pie-chart-container svg{width:180px;min-width:180px;height:180px;min-height:180px;transition:all .3s}.donut-slice{transition:stroke-dashoffset .5s}.pie-stats-list{flex-direction:column;flex:1;gap:14px;max-width:280px;display:flex}.pie-stat-row{color:var(--color-text);align-items:center;gap:12px;font-size:14.5px;display:flex}.pie-stat-row .bullet{border-radius:50%;width:10px;height:10px}.pie-stat-row .label{color:var(--color-text);flex:1;font-weight:600}.pie-stat-row .value{color:var(--color-text-dark);text-align:right;min-width:24px;font-weight:700}.pie-stat-row .percent{color:var(--color-text-light);text-align:right;width:45px;font-size:13px;font-weight:500}.list-container{flex-direction:column;gap:12px;max-height:380px;padding-right:4px;display:flex;overflow-y:auto}.list-item{border:1px solid var(--color-border);border-radius:var(--radius-sm);background-color:var(--color-card);align-items:center;padding:10px 12px;transition:background-color .2s,transform .15s;display:flex}.list-item.clickable{cursor:pointer}.list-item.clickable:hover{background-color:var(--color-bg);transform:translate(2px)}.item-avatar{background-color:var(--color-primary-light);width:32px;height:32px;color:var(--color-primary);border-radius:50%;justify-content:center;align-items:center;margin-right:12px;font-size:12px;font-weight:700;display:flex}.order-icon-badge{border-radius:var(--radius-sm);color:#3b82f6;background-color:#eff6ff;justify-content:center;align-items:center;width:32px;height:32px;margin-right:12px;display:flex}.item-details{flex-direction:column;flex:1;min-width:0;display:flex}.item-primary-name{color:var(--color-text-dark);text-overflow:ellipsis;white-space:nowrap;font-size:13.5px;font-weight:700;overflow:hidden}.item-secondary-info{color:var(--color-text-light);margin-top:2px;font-size:11.5px}.item-action-status{flex-shrink:0;margin-left:12px}.empty-state{color:var(--color-text-light);border:1.5px dashed var(--color-border);border-radius:var(--radius-sm);justify-content:center;align-items:center;padding:40px;font-size:13px;font-weight:500;display:flex}.btn-link{color:var(--color-primary);cursor:pointer;background:0 0;border:none;align-items:center;gap:4px;padding:0;font-size:13px;font-weight:600;transition:opacity .2s;display:flex}.btn-link:hover{opacity:.8;text-decoration:underline}.att-badge{border-radius:12px;padding:4px 8px;font-size:11.5px;font-weight:700}.att-badge.success{color:#10b981;background-color:#ecfdf5}.att-badge.warning{color:#f59e0b;background-color:#fff7ed}.att-badge.danger{color:#ef4444;background-color:#fef2f2}.status-pill-small{border-radius:var(--radius-sm);padding:4px 8px;font-size:11.5px;font-weight:700;display:inline-block}.status-pill-small.os-pending{color:#ef4444;background-color:#fee2e2}.status-pill-small.os-checking{color:#3b82f6;background-color:#eff6ff}.status-pill-small.os-checked{color:#059669;background-color:#ecfdf5}.status-pill-small.os-progress{color:#d97706;background-color:#fef3c7}.status-pill-small.os-completed{color:#10b981;background-color:#d1fae5}.status-pill-small.os-delivered{color:#475569;background-color:#e2e8f0}.status-pill-small.os-cancelled{color:#94a3b8;background-color:#f1f5f9}.spin{animation:1s linear infinite spin-kf}@keyframes spin-kf{0%{transform:rotate(0)}to{transform:rotate(360deg)}}