html,body,#root{width:100%;height:100%}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;font-size:14px}:root{--bg-page:#f0f2f5;--bg-card:#fff;--bg-sidebar:#fff;--bg-topbar:#fff;--bg-hover:#f5f7fa;--bg-active:#fff0f0;--bg-input:#f5f7fa;--border:#e4e8ef;--border-light:#eef1f6;--text-primary:#0f172a;--text-secondary:#4b5675;--text-muted:#94a3b8;--text-inverse:#fff;--brand:#e53535;--brand-dark:#c42b2b;--brand-light:#fff0f0;--brand-border:#fecaca;--shadow-sm:0 1px 3px #0f172a0f;--shadow-md:0 4px 12px #0f172a14;--shadow-lg:0 10px 30px #0f172a1a;--radius-sm:6px;--radius-md:9px;--radius-lg:12px;--radius-xl:16px}[data-theme=dark]{--bg-page:#0f172a;--bg-card:#1e293b;--bg-sidebar:#1e293b;--bg-topbar:#1e293b;--bg-hover:#263448;--bg-active:#3b1a1a;--bg-input:#263448;--border:#2d3f55;--border-light:#253347;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--text-inverse:#fff;--brand:#ef4444;--brand-dark:#dc2626;--brand-light:#3b1a1a;--brand-border:#7f1d1d;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 12px #0006;--shadow-lg:0 10px 30px #00000080}body{background:var(--bg-page);color:var(--text-primary);font-family:Plus Jakarta Sans,system-ui,sans-serif;line-height:1.5;transition:background .2s,color .2s}h1,h2,h3,h4{font-family:Syne,system-ui,sans-serif}h1{font-size:22px;font-weight:700;line-height:1.25}h2{font-size:18px;font-weight:700;line-height:1.25}h3{font-size:15px;font-weight:600;line-height:1.3}h4{font-size:13px;font-weight:600}p{color:var(--text-secondary);font-size:14px;line-height:1.6}a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}:focus-visible{outline:2px solid var(--brand);outline-offset:2px}input,textarea,select,button{font-family:Plus Jakarta Sans,system-ui,sans-serif;font-size:inherit}button{cursor:pointer}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.topbar{background:var(--bg-topbar);border-bottom:1px solid var(--border);height:58px;box-shadow:var(--shadow-sm);align-items:center;gap:0;padding:0 20px 0 0;transition:background .2s;display:flex}.topbar-left{flex-shrink:0;align-items:center;gap:0;height:58px;display:flex}.topbar-menu-btn{width:58px;height:58px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex}.topbar-menu-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.topbar-brand{align-items:center;gap:9px;padding-left:4px;display:flex}.topbar-logo{background:var(--brand);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex;overflow:hidden}.topbar-logo img{object-fit:contain;filter:brightness(0)invert();width:22px;height:22px}.topbar-brand-name{color:var(--text-primary);letter-spacing:-.2px;white-space:nowrap;font-family:Syne,system-ui,sans-serif;font-size:15px;font-weight:700}.topbar-search{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-md);align-items:center;gap:8px;min-width:220px;height:38px;margin-left:20px;padding:0 14px;transition:border-color .15s,background .15s;display:flex}.topbar-search:focus-within{border-color:var(--brand);background:var(--bg-card);box-shadow:0 0 0 3px #e5353514}.topbar-search svg{color:var(--text-muted);flex-shrink:0}.topbar-search input{color:var(--text-primary);background:0 0;border:none;outline:none;width:100%;font-family:Plus Jakarta Sans,system-ui,sans-serif;font-size:13px}.topbar-search input::placeholder{color:var(--text-muted)}.topbar-right{align-items:center;gap:4px;margin-left:auto;display:flex}.topbar-divider{background:var(--border);flex-shrink:0;width:1px;height:24px;margin:0 6px}.topbar-branch{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-input);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;padding:6px 12px;transition:border-color .15s,background .15s;display:flex;position:relative}.topbar-branch:hover{border-color:var(--brand);background:var(--bg-card)}.topbar-branch-icon{border-radius:var(--radius-sm);background:var(--brand-light);flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.topbar-branch-info{line-height:1.3}.topbar-branch-company{color:var(--text-muted);font-size:10px;font-weight:400}.topbar-branch-name{color:var(--text-primary);font-size:12.5px;font-weight:600}.topbar-branch-chevron{color:var(--text-muted)}.branch-dropdown{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:400;min-width:240px;display:none;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden}.branch-dropdown.open{display:block}.branch-dropdown-header{letter-spacing:1px;text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--border-light);background:var(--bg-hover);padding:10px 16px;font-size:10px;font-weight:700}.branch-dropdown-item{cursor:pointer;align-items:center;gap:12px;padding:11px 16px;transition:background .12s;display:flex}.branch-dropdown-item:hover{background:var(--bg-hover)}.branch-dropdown-item.active{background:var(--bg-active)}.branch-item-dot{background:var(--border);border-radius:50%;flex-shrink:0;width:8px;height:8px}.branch-dropdown-item.active .branch-item-dot{background:var(--brand)}.branch-item-company{color:var(--text-muted);font-size:10px;line-height:1.3}.branch-item-name{color:var(--text-primary);font-size:13px;font-weight:600;line-height:1.3}.topbar-icon-btn{border-radius:var(--radius-md);width:38px;height:38px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex;position:relative}.topbar-icon-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.topbar-notif-badge{background:var(--brand);border:2px solid var(--bg-topbar);border-radius:50%;width:8px;height:8px;position:absolute;top:7px;right:7px}.topbar-theme-btn{border-radius:var(--radius-md);border:1px solid var(--border);width:38px;height:38px;color:var(--text-secondary);cursor:pointer;background:0 0;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s,color .15s,border-color .15s;display:flex}.topbar-theme-btn:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--brand)}.topbar-user{border-radius:var(--radius-md);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:9px;padding:5px 10px 5px 5px;transition:background .15s;display:flex;position:relative}.topbar-user:hover{background:var(--bg-hover)}.topbar-avatar{background:var(--brand);color:#fff;letter-spacing:.5px;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;font-size:12px;font-weight:700;display:flex}.topbar-user-info{line-height:1.3}.topbar-user-name{color:var(--text-primary);font-size:13px;font-weight:600}.topbar-user-role{color:var(--text-muted);text-transform:capitalize;font-size:10.5px}.user-dropdown{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:400;min-width:220px;display:none;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden}.user-dropdown.open{display:block}.user-dropdown-header{border-bottom:1px solid var(--border-light);background:var(--bg-hover);padding:14px 16px}.user-dropdown-name{color:var(--text-primary);font-size:14px;font-weight:600}.user-dropdown-email{color:var(--text-muted);margin-top:2px;font-size:11.5px}.user-dropdown-item{color:var(--text-secondary);cursor:pointer;align-items:center;gap:11px;padding:11px 16px;font-family:Plus Jakarta Sans,system-ui,sans-serif;font-size:13.5px;transition:background .12s,color .12s;display:flex}.user-dropdown-item:hover{background:var(--bg-hover);color:var(--text-primary)}.user-dropdown-item.danger{color:var(--brand)}.user-dropdown-item.danger:hover{background:var(--brand-light)}.user-dropdown-divider{background:var(--border-light);height:1px;margin:4px 0}@media (width<=900px){.topbar-brand-name,.topbar-search,.topbar-branch-info,.topbar-user-info,.topbar-divider{display:none}}.topbar-company{position:relative}.topbar-company-btn{border-radius:var(--radius-sm);background:var(--brand-light);border:1px solid var(--brand-border);color:var(--text-primary);cursor:pointer;white-space:nowrap;align-items:center;gap:6px;padding:5px 10px;font-size:12.5px;font-weight:500;transition:all .15s;display:flex}.topbar-company-btn:hover:not(:disabled){background:var(--bg-hover)}.topbar-company-btn:disabled{opacity:.6;cursor:not-allowed}.topbar-company-name{color:var(--brand);font-weight:600}.topbar-branch{position:relative}.topbar-branch-btn{border-radius:var(--radius-sm);border:1px solid var(--border);cursor:pointer;background:0 0;align-items:center;gap:6px;padding:5px 10px;transition:all .15s;display:flex}.topbar-branch-btn:hover:not(:disabled){background:var(--bg-hover)}.topbar-branch-btn:disabled{opacity:.6;cursor:not-allowed}.topbar-branch-icon{align-items:center;display:flex}.topbar-branch-type{color:var(--text-muted);font-size:10.5px;line-height:1}.topbar-branch-name{color:var(--text-primary);font-size:12.5px;font-weight:500;line-height:1.3}.topbar-dropdown{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:100;min-width:220px;animation:.15s td-in;position:absolute;top:calc(100% + 6px);left:0;overflow:hidden}@keyframes td-in{0%{opacity:0;transform:translateY(-4px)}}.topbar-branch-dropdown{min-width:240px}.topbar-company-dropdown{min-width:280px}.topbar-dropdown-header{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);padding:10px 14px 8px;font-size:11px;font-weight:600}.topbar-dropdown-item{width:100%;color:var(--text-primary);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:10px;padding:10px 14px;font-size:13px;transition:background .1s;display:flex}.topbar-dropdown-item:hover:not(:disabled){background:var(--bg-hover)}.topbar-dropdown-item:disabled{opacity:.5;cursor:not-allowed}.topbar-dropdown-item.active{background:var(--brand-light)}.topbar-dropdown-item-dot{background:var(--border);border-radius:50%;flex-shrink:0;width:7px;height:7px}.topbar-dropdown-item.active .topbar-dropdown-item-dot{background:var(--brand)}.topbar-dropdown-item-name{color:var(--text-primary);align-items:center;gap:6px;font-size:13px;font-weight:500;display:flex}.topbar-dropdown-item-sub{color:var(--text-muted);margin-top:1px;font-size:11.5px}.topbar-dropdown-empty{color:var(--text-muted);text-align:center;padding:14px;font-size:13px}.topbar-ho-tag{background:var(--brand-light);border:1px solid var(--brand-border);color:var(--brand);border-radius:99px;padding:1px 5px;font-size:10px;font-weight:700}.topbar-switching{color:var(--text-muted);align-items:center;gap:6px;font-size:12px;display:flex}.topbar-switching-spinner{border:1.5px solid var(--border);border-top-color:var(--brand);border-radius:50%;width:12px;height:12px;animation:.6s linear infinite topbar-spin;display:inline-block}@keyframes topbar-spin{to{transform:rotate(360deg)}}.topbar-switch-error{border-radius:var(--radius-sm);color:#b91c1c;cursor:pointer;background:#fef2f2;border:1px solid #fecaca;align-items:center;gap:7px;max-width:280px;padding:6px 12px;font-size:12.5px;display:flex}[data-theme=dark] .topbar-switch-error{color:#f87171;background:#b91c1c1a;border-color:#b91c1c4d}.user-dropdown-company{color:var(--brand);margin-top:2px;font-size:11.5px;font-weight:500}.sidebar{background:var(--bg-sidebar);border-right:1px solid var(--border);width:230px;height:100%;box-shadow:var(--shadow-sm);flex-direction:column;transition:width .2s;display:flex;overflow:hidden}.sidebar.collapsed{width:62px}.sidebar-logo{border-bottom:1px solid var(--border-light);flex-shrink:0;align-items:center;gap:10px;height:58px;padding:0 16px;display:flex;overflow:hidden}.sidebar-logo-mark{background:var(--brand);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.sidebar-logo-mark img{object-fit:contain;filter:brightness(0)invert();width:22px;height:22px}.sidebar-logo-text{color:var(--text-primary);letter-spacing:-.3px;white-space:nowrap;opacity:1;font-family:Syne,system-ui,sans-serif;font-size:15px;font-weight:700;transition:opacity .15s}.sidebar.collapsed .sidebar-logo-text{opacity:0;pointer-events:none}.sidebar-nav{flex-direction:column;flex:1;gap:1px;padding:10px;display:flex;overflow:hidden auto}.sidebar-nav::-webkit-scrollbar{width:3px}.sidebar-nav::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}.sidebar-section-label{letter-spacing:1.4px;text-transform:uppercase;color:var(--text-muted);white-space:nowrap;padding:16px 10px 6px;font-size:9.5px;font-weight:700;transition:opacity .15s;overflow:hidden}.sidebar-section-label:first-child{padding-top:8px}.sidebar.collapsed .sidebar-section-label{opacity:0;pointer-events:none;height:0;padding:0}.sidebar-item{border-radius:var(--radius-md);cursor:pointer;white-space:nowrap;border:1px solid #0000;align-items:center;gap:10px;padding:9px 10px;text-decoration:none;transition:background .12s,color .12s;display:flex;position:relative;overflow:hidden}.sidebar-item:hover{background:var(--bg-hover)}.sidebar-item.active{background:var(--bg-active);border-color:var(--brand-border)}.sidebar-item.active:before{content:"";background:var(--brand);border-radius:0 3px 3px 0;width:3px;position:absolute;top:18%;bottom:18%;left:0}.sidebar-item-icon{border-radius:var(--radius-sm);background:var(--bg-input);width:32px;height:32px;color:var(--text-muted);flex-shrink:0;justify-content:center;align-items:center;transition:background .12s,color .12s;display:flex}.sidebar-item:hover .sidebar-item-icon{background:var(--border);color:var(--text-secondary)}.sidebar-item.active .sidebar-item-icon{background:var(--brand-light);color:var(--brand)}.sidebar-item-label{color:var(--text-secondary);text-overflow:ellipsis;flex:1;font-size:13px;font-weight:500;transition:color .12s;overflow:hidden}.sidebar-item:hover .sidebar-item-label{color:var(--text-primary)}.sidebar-item.active .sidebar-item-label{color:var(--brand);font-weight:600}.sidebar-tooltip{background:var(--text-primary);color:var(--text-inverse);border-radius:var(--radius-sm);white-space:nowrap;pointer-events:none;z-index:500;box-shadow:var(--shadow-md);padding:6px 10px;font-size:12px;font-weight:500;display:none;position:absolute;left:54px}.sidebar.collapsed .sidebar-item:hover .sidebar-tooltip{display:block}.sidebar-footer{border-top:1px solid var(--border-light);flex-shrink:0;padding:12px 10px}.sidebar-footer-version{color:var(--text-muted);text-align:center;white-space:nowrap;padding:4px;font-size:10px;transition:opacity .15s;overflow:hidden}.sidebar.collapsed .sidebar-footer-version{opacity:0}.shell{background:var(--bg-page);grid-template-rows:58px 1fr;grid-template-columns:230px 1fr;width:100vw;height:100vh;transition:grid-template-columns .2s;display:grid;overflow:hidden}.shell.collapsed{grid-template-columns:62px 1fr}.shell-topbar{z-index:100;grid-area:1/1/auto/-1}.shell-sidebar{z-index:50;grid-area:2/1;overflow:hidden}.shell-content{background:var(--bg-page);grid-area:2/2;padding:20px;overflow:hidden auto}@media (width<=900px){.shell{grid-template-columns:1fr}.shell-sidebar{z-index:200;box-shadow:var(--shadow-lg);display:none;position:fixed;top:58px;bottom:0;left:0;width:230px!important}.shell-sidebar.mobile-open{display:block}.shell-content{grid-column:1}.shell-overlay{z-index:199;background:#00000073;display:none;position:fixed;inset:58px 0 0}.shell-overlay.visible{display:block}}.tn-container{z-index:9999;pointer-events:none;flex-direction:column;gap:10px;width:360px;max-width:calc(100vw - 32px);display:flex;position:fixed;bottom:24px;right:24px}.tn-item{pointer-events:all;cursor:default;border:1px solid;border-radius:10px;align-items:flex-start;gap:10px;padding:13px 14px 16px;animation:.22s tn-slide-in;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 16px #0000001f,0 1px 4px #00000012}@keyframes tn-slide-in{0%{opacity:0;transform:translate(20px)scale(.97)}to{opacity:1;transform:translate(0)scale(1)}}.tn-item--success{color:#15803d;background:#f0fdf4;border-color:#bbf7d0}.tn-item--error{color:#dc2626;background:#fef2f2;border-color:#fecaca}.tn-item--info{color:#1d4ed8;background:#eff6ff;border-color:#bfdbfe}.tn-icon{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;margin-top:1px;display:flex}.tn-item--success .tn-icon{background:#dcfce7}.tn-item--error .tn-icon{background:#fee2e2}.tn-item--info .tn-icon{background:#dbeafe}.tn-body{flex:1;min-width:0}.tn-title{color:inherit;font-size:13.5px;font-weight:600;line-height:1.4}.tn-msg{opacity:.85;margin-top:2px;font-size:12.5px;font-weight:400;line-height:1.45}.tn-item--success .tn-title{color:#15803d}.tn-item--error .tn-title{color:#b91c1c}.tn-item--info .tn-title{color:#1e40af}.tn-item--success .tn-msg{color:#166534}.tn-item--error .tn-msg{color:#991b1b}.tn-item--info .tn-msg{color:#1e3a8a}.tn-close{cursor:pointer;color:inherit;opacity:.5;background:0 0;border:none;border-radius:4px;flex-shrink:0;align-items:center;padding:2px;transition:opacity .12s;display:flex}.tn-close:hover{opacity:1}.tn-progress{transform-origin:0;border-radius:0 0 10px 10px;width:100%;height:3px;animation:linear forwards tn-shrink;position:absolute;bottom:0;left:0}.tn-item--success .tn-progress{background:#22c55e}.tn-item--error .tn-progress{background:#ef4444}.tn-item--info .tn-progress{background:#3b82f6}@keyframes tn-shrink{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media (width<=480px){.tn-container{width:auto;bottom:16px;left:16px;right:16px}}