:root{--primary-color:#4f46e5;--text-color:#374151;--text-light:#6b7280;--bg-color:#ffffff;--sidebar-bg:#ffffff;--border-color:#e5e7eb;--hover-bg:#374151;--hover-text:#ffffff}.app-layout{display:flex;position:relative;min-height:100vh;background-color:#fff0;font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}.sidebar{position:fixed;top:0;left:0;height:100vh;width:260px;background-color:var(--sidebar-bg);border-right:1px solid var(--border-color);display:flex;flex-direction:column;padding:1.5rem 1rem;box-sizing:border-box;transition:width 0.3s cubic-bezier(.4,0,.2,1);z-index:1000;overflow-y:auto;overflow-x:hidden;white-space:nowrap}.sidebar::-webkit-scrollbar{width:5px}.sidebar::-webkit-scrollbar-track{background:#fff0}.sidebar::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:20px}.sidebar-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1.5rem;min-height:60px;overflow:hidden;transition:padding 0.3s ease}.logo-container{display:flex;align-items:center;gap:.75rem;transition:all 0.3s ease;width:100%}.logo-icon{min-width:32px;min-height:32px;width:32px;height:32px;flex-shrink:0;color:var(--primary-color);transition:margin 0.3s ease;object-fit:contain}.logo-text{font-weight:700;font-size:1.15rem;white-space:nowrap;color:var(--text-color);opacity:1;transform-origin:left center;transition:opacity 0.2s ease,transform 0.2s ease;transition-delay:0.1s}.logo-text span{display:block;font-size:.75rem;font-weight:500;color:var(--text-light);line-height:1.2}.sidebar-menu{list-style:none;padding:0;margin:0;flex-grow:1}.sidebar-menu li{margin-bottom:.25rem}.sidebar-menu li a{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:8px;text-decoration:none;color:var(--text-light);font-weight:500;font-size:.95rem;transition:all 0.2s ease;white-space:nowrap;line-height:1.4;overflow:hidden;width:auto;height:auto}.sidebar-menu li a span{opacity:1;transition:opacity 0.2s ease,transform 0.2s ease;transition-delay:0.1s;display:inline-block}.sidebar-menu li .menu-icon{min-width:24px;min-height:24px;width:24px;height:24px;flex-shrink:0;stroke-width:2px}.sidebar-menu li.active a{background-color:var(--hover-bg);color:#fff;box-shadow:0 4px 6px -1px rgb(55 65 81 / .1),0 2px 4px -1px rgb(55 65 81 / .06)}.sidebar-menu li.active a .menu-icon{stroke:#fff}.sidebar-menu li:not(.active) a:hover{background-color:var(--hover-bg);color:var(--hover-text)}.sidebar-menu li:not(.active) a:hover .menu-icon{stroke:var(--hover-text)}.menu-separator{height:1px;background-color:var(--border-color);margin:1rem 0}.has-submenu{position:relative}.submenu-toggle{cursor:pointer;position:relative}.submenu-arrow{margin-left:auto;transition:transform 0.3s ease;flex-shrink:0;width:16px;height:16px}.has-submenu.open .submenu-arrow{transform:rotate(180deg)}.submenu{list-style:none;padding:0;margin:0;max-height:0;overflow:hidden;transition:max-height 0.3s ease,opacity 0.3s ease;opacity:0;background-color:#f8fafc;border-radius:8px;margin-top:4px}.has-submenu.open .submenu{max-height:500px;opacity:1}.submenu li{margin-bottom:0}.submenu li a{padding:.6rem 1rem .6rem 2.5rem;font-size:.9rem;border-radius:6px;margin:2px 4px}.submenu li a .menu-icon{width:20px;height:20px;min-width:20px;min-height:20px}.submenu li:not(.active) a:hover{background-color:var(--hover-bg);color:var(--hover-text)}.submenu li:not(.active) a:hover .menu-icon{stroke:var(--hover-text)}.new-badge{margin-left:auto;background-color:var(--primary-color);color:#fff;padding:2px 8px;border-radius:99px;font-size:.65rem;font-weight:700;letter-spacing:.025em;flex-shrink:0;transition:opacity 0.2s ease;transition-delay:0.1s}.sidebar-footer{margin-top:auto;padding-top:1rem}.sidebar-footer a{display:flex;align-items:center;padding:.75rem 1rem;border-radius:8px;transition:background-color 0.2s ease;color:var(--text-light);justify-content:flex-start;width:auto;height:auto}.sidebar-footer a:hover{background-color:var(--hover-bg);color:var(--text-color)}.main-content{margin-left:260px;padding:2rem 3rem;width:calc(100% - 260px);box-sizing:border-box;transition:margin-left 0.3s cubic-bezier(.4,0,.2,1),width 0.3s cubic-bezier(.4,0,.2,1);background-color:#fff0}.sidebar.collapsed{width:80px;padding:1.5rem .5rem}.sidebar.collapsed .logo-text,.sidebar.collapsed .sidebar-menu li a span,.sidebar.collapsed .new-badge{opacity:0;pointer-events:none;position:absolute;left:100%;transition-delay:0s}.sidebar.collapsed .sidebar-header{justify-content:center;padding-left:0;padding-right:0}.sidebar.collapsed .logo-container{justify-content:center;margin:0}.sidebar.collapsed .logo-icon{margin:0}.sidebar.collapsed .sidebar-menu li a{justify-content:center;padding:0;width:48px;height:48px;margin:0 auto;border-radius:12px}.sidebar.collapsed .sidebar-footer a{justify-content:center;padding:0;width:48px;height:48px;margin:0 auto;border-radius:12px}.sidebar.collapsed #desktop-collapse-btn .menu-icon{transform:rotate(180deg)}.sidebar.collapsed+.main-content{margin-left:80px;width:calc(100% - 80px)}.sidebar-close-btn{display:none}.mobile-menu-toggle{display:none}.overlay{display:none}@media (max-width:992px){.sidebar{transform:translateX(-100%);width:260px!important;transition:transform 0.3s cubic-bezier(.4,0,.2,1);white-space:normal;padding:1.5rem 1rem!important}.sidebar.open{transform:translateX(0)!important;box-shadow:0 20px 25px -5px rgb(0 0 0 / .1)}.sidebar.collapsed{width:260px!important;transform:translateX(-100%)}.sidebar.collapsed.open{transform:translateX(0)!important}.sidebar.collapsed .sidebar-menu li a{width:auto!important;height:auto!important;margin:0!important;padding:.75rem 1rem!important;justify-content:flex-start!important}.sidebar.collapsed .sidebar-footer a{width:auto!important;height:auto!important;margin:0!important;padding:.75rem 1rem!important;justify-content:flex-start!important}.sidebar.collapsed .logo-container{justify-content:flex-start!important}.sidebar.collapsed .sidebar-header{justify-content:space-between!important}.sidebar.collapsed .logo-text,.sidebar.collapsed .sidebar-menu li a span,.sidebar.collapsed .new-badge{opacity:1!important;position:static!important;pointer-events:auto!important;display:inline-block}.sidebar.collapsed #desktop-collapse-btn .menu-icon{transform:rotate(0deg)}.main-content{margin-left:0!important;width:100%!important;padding:1.5rem}.sidebar.collapsed+.main-content{margin-left:0!important;width:100%!important}.mobile-menu-toggle{display:flex;align-items:center;justify-content:center;position:fixed;top:1rem;right:1rem;z-index:998;background-color:#1f2937;border:none;cursor:pointer;padding:.6rem;border-radius:8px;box-shadow:0 4px 6px -1px rgb(0 0 0 / .1)}.sidebar-close-btn{display:block;background:none;border:none;cursor:pointer;color:var(--text-light)}#desktop-collapse-btn{display:none}.overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgb(0 0 0 / .5);z-index:999;backdrop-filter:blur(2px)}.overlay.active{display:block}}