:root{--app-sidebar-w:258px;--app-sidebar-w-collapsed:85px;--app-margin:8px;--app-header-h:70px;--app-gap:12px;--sidebar-bg:#fff;--sidebar-text:#64748b;--sidebar-text-active:#fff;--sidebar-accent:#0f172a;--sidebar-hover:#f1f5f9;--sidebar-border:#0000000a;--sidebar-shadow:0 10px 40px #0000000a;--sidebar-transition:all .35s cubic-bezier(.4,0,.2,1)}.dark{--sidebar-bg:#161d30;--sidebar-text:#7d8da8;--sidebar-text-active:#e8edf5;--sidebar-accent:#4f8ef7;--sidebar-hover:#1e2a42;--sidebar-border:#4f8ef71a;--sidebar-shadow:0 12px 40px #00000080,0 4px 16px #00000059}.sidebar-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:40;opacity:0;pointer-events:none;background:#0f172a4d;transition:opacity .25s;position:fixed;inset:0}.sidebar-overlay.show{opacity:1;pointer-events:auto}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.sidebar{top:var(--app-margin);left:var(--app-margin);height:calc(100dvh - calc(var(--app-margin)*2));width:var(--app-sidebar-w);background:var(--sidebar-bg);color:var(--sidebar-text);transform:translateX(calc(-100% - var(--app-margin) - 20px));transition:var(--sidebar-transition);z-index:1001;border:1px solid var(--sidebar-border);box-shadow:var(--sidebar-shadow);border-radius:20px;flex-direction:column;display:flex;position:fixed;overflow:hidden}.sidebar.blur-when-modal-open{opacity:.4;filter:brightness(.7);pointer-events:none;transition:filter .3s,opacity .3s}.sidebar.collapsed{overflow:visible!important}.sidebar.open{transform:translate(0)}.sidebar.collapsed{width:var(--app-sidebar-w-collapsed)}@media (min-width:992px){.sidebar{transform:translate(0)}.sidebar-overlay{display:none}}.sidebar-header{height:var(--app-header-h);justify-content:center;align-items:center;width:100%;padding:0 20px 0 32px;display:flex}.brand-wrapper{justify-content:center;align-items:center;gap:12px;display:flex}.brand-logo{transition:var(--sidebar-transition);flex-shrink:0;justify-content:center;align-items:center;gap:10px;display:flex}.brand-logo-img{filter:drop-shadow(0 2px 8px #00000026);width:120px;height:auto;display:block}.brand-text-acca{letter-spacing:.02em;background:linear-gradient(135deg,#0038a8 0%,#6d28d9 60%,#a21caf 100%) 0 0/200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;align-items:center;font-family:Poppins,sans-serif;font-size:1.55rem;font-weight:850;line-height:normal;transition:all .3s;display:flex}.sidebar.collapsed .brand-logo-img{width:28px}.sidebar.collapsed .brand-wrapper{flex-direction:column;justify-content:flex-start;align-items:center;gap:8px}.sidebar.collapsed .brand-logo{flex-direction:column;justify-content:flex-start;align-items:center;gap:0}.sidebar.collapsed .brand-text-acca{display:none}.sidebar.collapsed .sidebar-header{border-bottom:none;flex-direction:column;justify-content:flex-start;align-items:center;gap:6px;height:auto;min-height:90px;padding:18px 0 8px}.sidebar.collapsed .sidebar-nav{min-height:0;max-height:calc(100dvh - var(--app-margin)*2 - 90px);scrollbar-width:thin;scrollbar-color:var(--sidebar-border)transparent;flex:1 1 0;margin-top:0;padding:6px 4px;overflow:visible auto}.sidebar.collapsed .sidebar-nav::-webkit-scrollbar{width:3px}.sidebar.collapsed .sidebar-nav::-webkit-scrollbar-thumb{background:var(--sidebar-border);border-radius:3px}.sidebar.collapsed .collapse-toggle{background:var(--sidebar-hover);border-radius:50%;width:32px;height:32px}.sidebar.collapsed .menu-btn{justify-content:center;padding:12px 0}.sidebar.collapsed .menu-content{justify-content:center;gap:0}.collapse-toggle{background:var(--sidebar-hover);cursor:pointer;width:28px;height:28px;color:var(--sidebar-text);z-index:5;border:none;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.collapse-toggle:hover{background:var(--sidebar-accent);color:#fff}@media (max-width:991.98px){.collapse-toggle{display:none}.sidebar-header{justify-content:center!important;padding:0 20px!important}.sidebar-nav{padding:0 12px 20px!important}}.dark .sidebar-title{color:var(--n-primary-light)}.dark .toggle-btn:hover{color:var(--n-ink)!important}.dark .menu-btn.active .menu-label{color:var(--sidebar-text-active)!important}.toggle-btn{background:var(--sidebar-hover);width:28px;height:28px;color:var(--sidebar-text);cursor:pointer;border:none;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:none}.toggle-btn:hover{background:var(--sidebar-accent);color:#fff}@media (min-width:992px){.toggle-btn{display:flex}}.sidebar.collapsed .toggle-btn{display:none}.sidebar-nav{flex:1;padding:0 16px 20px;overflow:hidden auto}.sidebar.collapsed .sidebar-nav{overflow:visible}.menu-btn{width:100%;color:inherit;cursor:pointer;background:0 0;border:none;border-radius:12px;justify-content:space-between;align-items:center;margin:2px 0;padding:12px 14px;font-weight:600;transition:all .2s;display:flex}.menu-btn:hover{background:var(--sidebar-hover);color:var(--sidebar-accent)}@media (max-width:991.98px){.menu-btn{margin:1px 0;padding:8px 14px}}.menu-btn.active{background:var(--n-primary);color:#fff;box-shadow:0 4px 16px #4f8ef74d}.menu-content{align-items:center;gap:12px;display:flex}.menu-icon{flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:1.1rem;display:flex}.menu-label{white-space:nowrap;font-size:.9rem}.sidebar.collapsed .menu-label,.sidebar.collapsed .chevron,.sidebar.collapsed .sidebar-search{display:none}.sidebar.collapsed .menu-btn{justify-content:center;margin:2px 0;padding:10px 0}.sidebar.collapsed .menu-content{gap:0}.chevron{opacity:.5;font-size:.75rem;transition:transform .25s}.menu-btn.active .chevron{opacity:1}.chevron.rotate{transform:rotate(180deg)}.submenu{max-height:0;padding-left:0;transition:max-height .3s cubic-bezier(.4,0,.2,1);overflow:hidden}.submenu.open{max-height:500px;margin-bottom:8px}.submenu-btn{width:100%;color:inherit;cursor:pointer;background:0 0;border:none;border-radius:12px;align-items:center;margin:2px 0;padding:12px 14px 12px 50px;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}@media (max-width:991.98px){.submenu-btn{margin:1px 0;padding:8px 14px 8px 50px}}.submenu-btn.active{color:var(--n-primary);box-shadow:none;background:#4f8ef714;font-weight:700;position:relative}.submenu-btn.active:before{content:"";background:var(--n-primary);border-radius:50%;width:6px;height:6px;position:absolute;left:28px;box-shadow:0 0 8px #4f8ef780}.sidebar.collapsed .submenu{display:none}.menu-group{position:relative}.sidebar-tooltip{background:var(--sidebar-bg);border:1px solid var(--sidebar-border);z-index:10000;pointer-events:all;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);border-radius:12px;width:max-content;min-width:140px;max-width:260px;margin-left:20px;padding:6px;animation:.25s ease-out tooltipFadeIn;position:absolute;top:50%;left:100%;transform:translateY(-50%);box-shadow:12px 0 45px #0038a81f}.sidebar-tooltip:before{content:"";background:0 0;width:30px;position:absolute;top:0;bottom:0;left:-25px}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(-50%)translate(-10px)}to{opacity:1;transform:translateY(-50%)translate(0)}}.tooltip-submenu{flex-direction:column;gap:2px;margin-top:4px;display:flex}.tooltip-header{color:var(--sidebar-accent);align-items:center;gap:8px;padding:6px 10px;font-size:.85rem;font-weight:700;display:flex}.tooltip-sub-btn{width:100%;color:var(--sidebar-text);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:8px;padding:8px 12px;font-size:.85rem;font-weight:500;transition:all .15s}.tooltip-sub-btn:hover{background:var(--sidebar-hover);color:var(--sidebar-accent)}.tooltip-sub-btn.active{color:var(--n-primary-light);box-shadow:none;background:#4f8ef714;font-weight:700}.sidebar-footer{display:none}
:root{--app-sidebar-w:260px;--app-sidebar-w-collapsed:85px;--app-header-h:70px;--app-gap:12px;--app-margin:8px;--header-bg:#fff;--header-border:#0000000a;--header-shadow:0 4px 20px #00000008;--header-text:#1e293b}.dark{--header-bg:#161d30;--header-border:#4f8ef71a;--header-shadow:0 12px 40px #00000080,0 4px 16px #00000059;--header-text:#e8edf5}.header{top:var(--app-margin);left:calc(var(--app-margin) + var(--app-sidebar-w) + var(--app-gap));right:var(--app-margin);height:var(--app-header-h);background:var(--header-bg);border:1px solid var(--header-border);z-index:500;box-shadow:var(--header-shadow);will-change:transform,left,right;border-radius:20px;justify-content:space-between;align-items:center;padding:0 24px;transition:left .35s cubic-bezier(.4,0,.2,1),right .35s cubic-bezier(.4,0,.2,1),background-color .35s,box-shadow .35s,opacity .2s,visibility .2s;display:flex;position:fixed;transform:translateZ(0)}.header.collapsed{left:calc(var(--app-margin) + var(--app-sidebar-w-collapsed) + var(--app-gap))}.header.blur-when-modal-open{opacity:.4;filter:brightness(.7);pointer-events:none;transition:filter .3s,opacity .3s}@media (max-width:991.98px){.header,.header.collapsed{left:var(--app-margin);right:var(--app-margin);padding:0 8px}.sidebar-mobile-open .header{opacity:0;visibility:hidden;pointer-events:none;transform:translateZ(0)translateY(-10px)}}.header-left{align-items:center;gap:16px;min-width:0;display:flex}@media (max-width:991.98px){.header-left{gap:8px}}.menu-toggle{background:var(--sidebar-hover);width:40px;height:40px;color:var(--header-text);cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;font-size:1.25rem;transition:all .2s;display:none}@media (max-width:991.98px){.menu-toggle{gap:8px;width:34px;height:34px;display:flex}}.menu-toggle:hover{background:var(--n-primary);color:#fff}.header-title-wrapper{flex-direction:column;min-width:0;display:flex}.header-title{color:var(--header-text);letter-spacing:-.3px;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:1.2rem;font-weight:750;line-height:1.2;overflow:hidden}@media (max-width:991.98px){.header-title{white-space:nowrap;text-transform:none;letter-spacing:-.01em;text-overflow:clip;font-size:.9rem;line-height:1.1;display:block;overflow:visible}.header-title span{white-space:nowrap;opacity:.85;font-size:.9rem;display:block}}.header-subtitle{color:var(--sidebar-text);opacity:.6;font-size:.75rem;font-weight:500}@media (max-width:991.98px){.header-subtitle{display:none}}.header-right{flex-shrink:0;align-items:center;gap:12px;display:flex}@media (max-width:991.98px){.header-right{gap:4px}}.dark-mode-toggle{background:var(--sidebar-hover);cursor:pointer;width:44px;height:44px;color:var(--header-text);border:none;border-radius:12px;justify-content:center;align-items:center;font-size:1.1rem;transition:all .2s;display:flex}.dark-mode-toggle:hover{background:var(--n-primary);color:#fff}@media (max-width:991.98px){.dark-mode-toggle{background:0 0;border-radius:8px;width:28px;height:28px;font-size:.85rem}}.header-icon-btn{cursor:pointer;width:44px;height:44px;color:var(--header-text);background:linear-gradient(135deg,#3b82f614 0%,#8b5cf614 100%);border:1px solid #3b82f61a;border-radius:14px;justify-content:center;align-items:center;margin-right:8px;font-size:1.1rem;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.header-icon-btn:hover{background:linear-gradient(135deg,var(--n-primary)0%,#6366f1 100%);color:#fff;border-color:#0000;transform:translateY(-2px);box-shadow:0 8px 20px #3b82f659}.header-icon-btn:active{transform:translateY(0);box-shadow:0 4px 12px #3b82f640}.header-icon-btn svg{transition:all .3s}.header-icon-btn:hover svg{transform:scale(1.05)}.notification-badge{color:#fff;border:2px solid var(--header-bg);background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);border-radius:10px;justify-content:center;align-items:center;min-width:20px;height:20px;padding:0 5px;font-size:10px;font-weight:800;animation:2s ease-in-out infinite badge-pulse;display:flex;position:absolute;top:-6px;right:-4px;box-shadow:0 4px 12px #ef444466}@keyframes badge-pulse{0%,to{transform:scale(1);box-shadow:0 4px 12px #ef444466}50%{transform:scale(1.1);box-shadow:0 6px 20px #ef444499}}.header-icon-btn:hover .notification-badge{color:var(--n-primary);background:linear-gradient(135deg,#fff 0%,#f8fafc 100%);animation:none;box-shadow:0 2px 8px #00000026}@media (max-width:991.98px){.header-icon-btn{background:0 0;border-color:#0000;border-radius:10px;width:36px;height:36px;margin-right:4px;font-size:.9rem}.notification-badge{min-width:16px;height:16px;font-size:8px;top:-4px;right:-2px}}.user-menu-wrapper{position:relative}.user-menu-trigger{background:var(--sidebar-hover);cursor:pointer;border:none;border-radius:12px;align-items:center;gap:10px;padding:4px;transition:all .2s;display:flex}@media (max-width:991.98px){.user-menu-trigger{background:0 0;gap:0;padding:0}}.user-avatar-small{background:#3b82f61a;border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;display:flex;overflow:hidden}@media (max-width:991.98px){.user-avatar-small{background:0 0;border-radius:8px;width:28px;height:28px}}.user-avatar-small i{color:var(--n-primary)}.user-info-header{flex-direction:column;align-items:flex-start;display:flex}@media (max-width:991.98px){.user-info-header{display:none}}@media (min-width:992px){.user-info-header{display:none}.user-menu-trigger{padding-right:4px}}.user-name-header{font-size:.85rem;font-weight:700;line-height:1.2}.user-role-header{opacity:.6;font-size:.7rem}.user-menu-overlay{z-index:1000;position:fixed;inset:0}.user-menu-dropdown{background:var(--n-card);border:1px solid var(--n-border);z-index:1001;border-radius:20px;width:240px;position:absolute;top:calc(100% + 12px);right:0;overflow:hidden;box-shadow:0 12px 40px #00000073,0 4px 16px #0000004d}.user-menu-info{border-bottom:1px solid var(--header-border);padding:20px}.user-menu-name{color:var(--header-text);margin-bottom:2px;font-size:.95rem;font-weight:750}.user-menu-role{color:var(--n-primary);font-size:.75rem;font-weight:700}.user-menu-item{cursor:pointer;width:100%;color:var(--header-text);background:0 0;border:none;align-items:center;gap:12px;padding:14px 20px;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.user-menu-item:hover{background:var(--n-surface)}
.notification-wrapper{position:relative}.notification-overlay{z-index:1000;position:fixed;inset:0}.notification-dropdown{background:var(--sidebar-bg);border:1px solid var(--header-border);z-index:1001;border-radius:16px;flex-direction:column;width:340px;max-height:420px;animation:.2s slideDown;display:flex;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden;box-shadow:0 8px 24px #0000001f}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.notification-header{background:linear-gradient(135deg,#0038a8 0%,#0052d4 100%);border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.notification-header h3{color:#fff;text-transform:uppercase;letter-spacing:.5px;margin:0;font-size:.8rem;font-weight:700}.notification-count{color:#fff;-webkit-backdrop-filter:blur(10px);background:#fff3;border:1px solid #ffffff4d;border-radius:12px;padding:3px 10px;font-size:.7rem;font-weight:600}.notification-list{flex:1;max-height:400px;overflow-y:auto}.notification-item{border-bottom:1px solid var(--header-border);cursor:pointer;align-items:center;gap:10px;padding:12px 16px;transition:all .2s;display:flex;position:relative}.notification-item:before{content:"";background:linear-gradient(135deg,#0038a8 0%,#0052d4 100%);width:3px;transition:transform .2s;position:absolute;top:0;bottom:0;left:0;transform:scaleX(0)}.notification-item:hover{background:linear-gradient(90deg,#0038a80d,#0000);transform:translate(2px)}.notification-item:hover:before{transform:scaleX(1)}.notification-icon{color:#fff;background:linear-gradient(135deg,#6b7280 0%,#9ca3af 100%);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.1rem;transition:all .2s;display:flex;box-shadow:0 2px 8px #6b728033}.notification-icon-unread{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);box-shadow:0 4px 12px #ef444459}.notification-icon-read{background:linear-gradient(135deg,#6b7280 0%,#9ca3af 100%);box-shadow:0 4px 12px #6b728040}.notification-icon-approved{background:linear-gradient(135deg,#10b981 0%,#059669 100%);box-shadow:0 4px 12px #10b98159}.notification-icon-revision{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);box-shadow:0 4px 12px #ef444459}.notification-item:hover .notification-icon{transform:scale(1.05)}.notification-item:hover .notification-icon-unread{box-shadow:0 6px 20px #ef444473}.notification-item:hover .notification-icon-read{box-shadow:0 6px 20px #6b728059}.notification-item:hover .notification-icon-approved{box-shadow:0 6px 20px #10b98173}.notification-item:hover .notification-icon-revision{box-shadow:0 6px 20px #ef444473}.notification-unread:before{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%)}.notification-read:before{background:linear-gradient(135deg,#6b7280 0%,#9ca3af 100%)}.notification-unread:hover{background:linear-gradient(90deg,#ef444414,#0000)}.notification-read{opacity:.7}.notification-read:hover{opacity:1;background:linear-gradient(90deg,#6b728014,#0000)}.notification-content{flex:1;min-width:0}.notification-title{color:var(--header-text);margin-bottom:3px;font-size:.8rem;font-weight:700;line-height:1.2}.notification-subtitle{color:#0038a8;align-items:center;gap:4px;margin-bottom:3px;font-size:.7rem;font-weight:600;display:flex}.notification-nip{color:var(--sidebar-text);opacity:.7;background:var(--sidebar-hover);border-radius:4px;margin-bottom:3px;padding:2px 6px;font-size:.65rem;font-weight:500;display:inline-block}.notification-time{color:var(--sidebar-text);opacity:.6;align-items:center;gap:4px;font-size:.65rem;font-weight:500;display:flex}.notification-empty{text-align:center;color:var(--sidebar-text);opacity:.5;padding:80px 20px}.notification-empty i{color:#0038a8;opacity:.3;margin-bottom:16px;font-size:3.5rem;display:block}.notification-empty p{margin:0;font-size:.9rem;font-weight:600}.notification-arrow{color:var(--sidebar-text);opacity:.3;font-size:1.1rem;transition:all .3s}.notification-item:hover .notification-arrow{opacity:1;color:#0038a8;transform:translate(6px)}.notification-footer{border-top:1px solid var(--header-border);background:var(--sidebar-hover);padding:10px 16px}.notification-view-all{color:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;background:linear-gradient(135deg,#0038a8 0%,#0052d4 100%);border:none;border-radius:8px;width:100%;padding:8px;font-size:.75rem;font-weight:600;transition:all .2s}.notification-view-all:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0038a840}.notification-view-all:active{transform:translateY(0)}@media (max-width:991.98px){.notification-dropdown{width:340px;right:-10px}.notification-icon{width:42px;height:42px;font-size:1.1rem}.notification-item{padding:14px 16px}}
.notification-note{color:var(--sidebar-text);opacity:.8;align-items:flex-start;gap:4px;margin-top:3px;margin-bottom:3px;font-size:.65rem;font-style:italic;line-height:1.3;display:flex}.notification-note i{flex-shrink:0;margin-top:2px}