/* Extracted legacy shell CSS from templates/base.html. */
:root{--sidebar-width:250px;--header-height:64px;--primary-color:#1a237e;--secondary-color:#283593;--accent-color:#3949ab;--text-color:#333;--light-bg:#f5f8fa;--border-color:#e0e0e0;--success-color:#2e7d32;--error-color:#c62828;--spacing-unit:8px}body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;margin:0;padding:0;background-color:var(--light-bg);color:var(--text-color);line-height:1.6;width:100%;min-height:100vh}.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sidebar-width);background-color:var(--primary-color);color:white;display:flex;flex-direction:column;z-index:1050;transition:transform 0.3s ease-in-out,width 0.3s ease-in-out}.sidebar.collapsed{width:60px}.sidebar.collapsed .sidebar-header h3{display:none}.sidebar.collapsed .menu-item span{display:none}.sidebar.collapsed .menu-header{display:none}.sidebar.collapsed .menu-divider{display:none}.sidebar.collapsed .company-info{display:none}.sidebar.collapsed .menu-item{justify-content:center;padding:calc(var(--spacing-unit) * 2) 0}.sidebar.collapsed .menu-item i{margin-right:0}.sidebar-toggle-btn{background:none;border:none;color:white;font-size:1.2rem;cursor:pointer;padding:0.5rem;border-radius:4px;transition:all 0.3s ease;display:flex;align-items:center;justify-content:center;width:32px;height:32px}.sidebar-toggle-btn:hover{background-color:rgba(255,255,255,0.1)}.sidebar.collapsed .sidebar-toggle-btn i{transform:rotate(180deg)}.sidebar-header{padding:calc(var(--spacing-unit) * 3) 0;border-bottom:1px solid rgba(255,255,255,0.1);text-align:center}.sidebar-header h3{margin:0;font-size:1.25rem;font-weight:500;color:rgba(255,255,255,0.96);letter-spacing:0.01em;text-shadow:0 1px 2px rgba(0,0,0,0.18)}.sidebar-menu{flex:1;padding:calc(var(--spacing-unit) * 2) 0;overflow-y:auto}.menu-item{padding:calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 3);display:flex;align-items:center;color:rgba(255,255,255,0.9);text-decoration:none;transition:all 0.3s ease;border-left:4px solid transparent;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}.menu-item:hover{background-color:var(--secondary-color);color:white;border-left-color:var(--accent-color)}.menu-item.active{background-color:var(--accent-color);color:white;border-left-color:white}.menu-item i{margin-right:calc(var(--spacing-unit) * 2);width:20px;text-align:center;font-size:1.1rem}.header{position:fixed;top:0;right:0;left:var(--sidebar-width);height:var(--header-height);background-color:white;box-shadow:0 2px 4px rgba(0,0,0,0.1);z-index:1040;display:flex;align-items:center;padding:0 1rem;transition:left 0.3s ease-in-out}.sidebar.collapsed~.header{left:60px}.header h4{color:var(--text-color);margin:0;font-weight:500;font-size:1.25rem}.user-info{display:flex;align-items:center;justify-content:flex-end}.user-info img{width:32px;height:32px;border-radius:50%;margin-right:8px}.logout-btn{color:var(--error-color);text-decoration:none;padding:0.5rem;border-radius:6px;transition:all 0.3s ease;font-size:0.9rem;display:flex;align-items:center;gap:var(--spacing-unit)}.logout-btn:hover{background-color:#ffebee}.main-content{margin-left:0;padding:calc(var(--header-height) + var(--spacing-unit) * 4) calc(var(--spacing-unit) * 4) calc(var(--spacing-unit) * 4);min-height:calc(100vh - var(--header-height));background-color:var(--light-bg);position:relative;z-index:1;transition:margin-left 0.3s ease-in-out}.shell-authenticated .main-content{margin-left:var(--sidebar-width)}.sidebar.collapsed~.main-content{margin-left:60px}.form-group{margin-bottom:calc(var(--spacing-unit) * 3)}.form-group label{display:block;margin-bottom:var(--spacing-unit);color:var(--text-color);font-weight:500;font-size:0.9rem}.form-group input{width:100%;padding:calc(var(--spacing-unit) * 1.5);border:1px solid var(--border-color);border-radius:6px;font-size:1rem;transition:all 0.3s ease}.form-group input:focus{border-color:var(--accent-color);outline:none;box-shadow:0 0 0 3px rgba(57,73,171,0.1)}.auth-container{max-width:400px;margin:0 auto;background-color:white;padding:calc(var(--spacing-unit) * 4);border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,0.1)}.auth-header{text-align:center;margin-bottom:calc(var(--spacing-unit) * 4)}.auth-header .logo{font-size:3rem;color:var(--primary-color);margin-bottom:calc(var(--spacing-unit) * 2)}.auth-header h1{color:var(--primary-color);margin:0;font-size:1.5rem;font-weight:500}.btn{padding:calc(var(--spacing-unit) * 1.5) calc(var(--spacing-unit) * 3);border:none;border-radius:6px;cursor:pointer;font-weight:500;font-size:1rem;transition:all 0.3s ease;display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-unit)}.btn-primary{background-color:var(--primary-color);color:white}.btn-primary:hover{background-color:var(--secondary-color);transform:translateY(-1px);box-shadow:0 4px 12px rgba(26,35,126,0.2)}.alert{margin-bottom:1rem;border:none;border-radius:4px;padding:1rem}.alert-success{background-color:#d4edda;color:#155724}.alert-error{background-color:#f8d7da;color:#721c24}.alert-dismissible .btn-close{padding:1.25rem}.checkbox-label{display:flex;align-items:center;gap:var(--spacing-unit);cursor:pointer}.checkbox-label input[type="checkbox"]{width:auto;margin-right:var(--spacing-unit)}.company-name{color:rgba(255,255,255,0.9);font-size:0.9rem;padding:calc(var(--spacing-unit)) calc(var(--spacing-unit) * 2);background-color:rgba(255,255,255,0.1);border-radius:4px;text-align:center}.menu-divider{height:1px;background-color:rgba(255,255,255,0.1);margin:calc(var(--spacing-unit) * 2) 0}.menu-header{color:rgba(255,255,255,0.5);font-size:0.8rem;text-transform:uppercase;letter-spacing:1px;padding:calc(var(--spacing-unit)) calc(var(--spacing-unit) * 3);margin-bottom:calc(var(--spacing-unit))}.company-info{padding:calc(var(--spacing-unit) * 2);border-top:1px solid rgba(255,255,255,0.1);background-color:rgba(0,0,0,0.1)}.dropdown-menu{z-index:1000;margin-top:0.5rem;min-width:200px;border-radius:0.5rem;border:1px solid var(--border-color);box-shadow:0 4px 12px rgba(0,0,0,0.1)}.dropdown-menu .dropdown-item{padding:0.5rem 1rem;display:flex;align-items:center;gap:0.5rem}.dropdown-menu .dropdown-item:hover{background-color:var(--light-bg)}.dropdown-menu form{margin:0;padding:0.25rem 1rem}.dropdown-menu select.form-select{font-size:0.875rem}.sidebar{z-index:100}@media (max-width:768px){:root{--sidebar-width:100%;--sidebar-max-width:400px}.sidebar{width:var(--sidebar-max-width);max-width:90%;transform:translateX(-100%);box-shadow:2px 0 8px rgba(0,0,0,0.2);z-index:1030}.sidebar.show{transform:translateX(0)}.sidebar-toggle-btn{display:none}.mobile-menu-toggle{display:flex !important;width:44px;height:44px;border-radius:50%;background:transparent;color:var(--primary-color);font-size:1.25rem;align-items:center;justify-content:center;border:none;cursor:pointer;transition:background-color 0.3s;-webkit-tap-highlight-color:transparent}.mobile-menu-toggle:active{background-color:rgba(0,0,0,0.1)}.sidebar-menu{padding:1rem 0}.menu-item{padding:1rem 1.5rem;font-size:1.1rem;display:flex;align-items:center;gap:1rem;border-left:none;border-bottom:1px solid rgba(255,255,255,0.1)}.menu-item i{width:24px;font-size:1.25rem}.menu-item:active{background-color:var(--secondary-color)}.sidebar-backdrop{background-color:rgba(0,0,0,0.5);z-index:1050;opacity:0;transition:opacity 0.3s ease;pointer-events:none}.sidebar-backdrop.show{opacity:1;pointer-events:auto}.header{left:0;padding:0 0.5rem}.header h4{font-size:1.1rem}.header .user-info span{display:none}.header .d-flex>div[style*="width:200px"]{width:60px !important}.header .text-center{padding:0 0.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}.sidebar-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:1049;display:none;opacity:0;transition:opacity 0.3s ease-in-out}@media (max-width:768px){.sidebar-backdrop.show{display:block}}@supports (padding-top:env(safe-area-inset-top)){.header{padding-top:env(safe-area-inset-top);height:calc(var(--header-height) + env(safe-area-inset-top))}.sidebar{padding-top:env(safe-area-inset-top)}.main-content{padding-top:calc(var(--header-height) + env(safe-area-inset-top) + 1rem);padding-bottom:calc(1rem + env(safe-area-inset-bottom))}}.floating-menu{display:none;position:fixed;right:20px;bottom:20px;z-index:1030}.floating-menu-toggle{width:56px;height:56px;border-radius:50%;background-color:var(--primary-color);color:white;border:none;box-shadow:0 4px 12px rgba(0,0,0,0.2);display:flex;align-items:center;justify-content:center;font-size:24px;cursor:pointer;transition:transform 0.3s,background-color 0.3s;-webkit-tap-highlight-color:transparent}.floating-menu-toggle:active{transform:scale(0.95)}.floating-menu-toggle.active{background-color:var(--error-color);transform:rotate(180deg)}@media (max-width:768px){.floating-menu{display:block;padding-bottom:env(safe-area-inset-bottom)}.sidebar{position:fixed;right:0;left:auto;width:85%;max-width:360px;transform:translateX(100%);box-shadow:-2px 0 8px rgba(0,0,0,0.2);background-color:white}.sidebar.show{transform:translateX(0)}.mobile-menu-toggle{display:none !important}.menu-item{padding:16px 24px;font-size:16px;border-bottom:1px solid rgba(255,255,255,0.1)}.menu-item i{width:24px;margin-right:16px}.sidebar-backdrop{background-color:rgba(0,0,0,0.7);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}}@supports (padding-bottom:env(safe-area-inset-bottom)){@media (max-width:768px){.floating-menu{bottom:max(20px,env(safe-area-inset-bottom))}.sidebar{padding-bottom:env(safe-area-inset-bottom)}}}.mobile-nav{display:none;position:fixed;bottom:0;left:0;right:0;background:white;box-shadow:0 -2px 10px rgba(0,0,0,0.1);z-index:1050;padding-bottom:env(safe-area-inset-bottom);height:70px}.mobile-nav .nav-container{display:flex;height:100%;align-items:center;justify-content:space-evenly;padding:0;width:100%}.mobile-nav .nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px 4px;color:var(--text-color);text-decoration:none;font-size:11px;border:none;background:none;cursor:pointer;gap:6px;border-radius:8px;transition:all 0.3s ease;position:relative;flex:1;min-width:0;text-align:center}.mobile-nav .nav-item i{font-size:24px;height:24px;width:24px;display:flex;align-items:center;justify-content:center;transition:transform 0.3s ease}.mobile-nav .nav-item span{line-height:1;margin-top:2px;font-weight:500;text-align:center;white-space:nowrap}.mobile-nav .nav-item.active{color:var(--primary-color);background-color:rgba(26,35,126,0.1)}.mobile-nav .nav-item:active{transform:scale(0.95)}.mobile-submenu{position:fixed;bottom:70px;left:0;right:0;background:white;box-shadow:0 -4px 20px rgba(0,0,0,0.15);border-radius:16px 16px 0 0;transform:translateY(calc(100% + 88px));transition:transform 0.3s cubic-bezier(0.4,0,0.2,1);z-index:1049;max-height:70vh;overflow-y:auto;opacity:0;visibility:hidden;pointer-events:none}.mobile-submenu.show{transform:translateY(0);opacity:1;visibility:visible;pointer-events:auto}.mobile-submenu .submenu-header{padding:16px 20px 8px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between}.mobile-submenu .submenu-title{font-size:16px;font-weight:600;color:var(--text-color)}.mobile-submenu .close-btn{background:none;border:none;font-size:20px;color:var(--text-color);cursor:pointer;padding:4px;border-radius:50%;transition:background-color 0.3s}.mobile-submenu .close-btn:active{background-color:var(--light-bg)}.mobile-submenu .submenu-content{padding:8px 0 16px}.mobile-submenu .submenu-item{display:flex;align-items:center;padding:12px 20px;color:var(--text-color);text-decoration:none;gap:16px;transition:background-color 0.3s;border:none;background:none;font-family:inherit;font-size:inherit;width:100%;text-align:left}.mobile-submenu .submenu-item:active{background-color:var(--light-bg)}.mobile-submenu .submenu-item i{font-size:18px;width:24px;text-align:center;color:var(--primary-color)}.mobile-submenu .submenu-item span{font-size:14px;font-weight:500}.mobile-submenu-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.3);z-index:1048;opacity:0;visibility:hidden;transition:all 0.3s ease}.mobile-submenu-backdrop.show{opacity:1;visibility:visible}@media (min-width:1024px){.mobile-nav,.mobile-submenu,.mobile-submenu-backdrop{display:none !important}}@media (max-width:1023px){.mobile-nav{display:flex}.sidebar{display:none}.main-content{margin-left:0;padding-bottom:calc(80px + env(safe-area-inset-bottom))}.mobile-submenu{bottom:70px}.mobile-nav .nav-item.active i{transform:scale(1.1)}}.logout-btn{color:#dc3545;transition:all 0.3s ease}.logout-btn:hover{background-color:#dc3545;color:white}.sidebar-bottom{position:absolute;bottom:0;width:100%;padding:1rem;border-top:1px solid rgba(0,0,0,.1)}.flash-messages-container{position:fixed;top:var(--header-height);left:0;right:0;z-index:1030;padding:1rem;pointer-events:none}.shell-authenticated .flash-messages-container{left:var(--sidebar-width)}.flash-messages-container .alert{max-width:600px;margin:0 auto 1rem;pointer-events:auto;box-shadow:0 2px 8px rgba(0,0,0,0.1)}@media (max-width:768px){.header{display:none !important}.main-content{padding-top:calc(var(--spacing-unit) * 4) !important;margin-left:0 !important;padding-bottom:calc(80px + env(safe-area-inset-bottom) + var(--spacing-unit) * 4) !important;padding-left:0 !important;padding-right:0 !important;overflow-x:hidden !important;overflow-y:auto !important;width:100% !important;max-width:100vw !important;box-sizing:border-box !important;position:absolute !important;top:0 !important;left:0 !important;right:0 !important;bottom:0 !important;height:100vh !important}.flash-messages-container{top:0 !important;left:0 !important;width:100% !important;padding-top:env(safe-area-inset-top) !important;padding-bottom:0 !important;z-index:1100 !important}.mobile-nav{display:flex;z-index:1050}body{padding-top:0 !important;margin-top:0 !important}}.title-accent{position:relative;display:inline-block;padding-bottom:4px;font-weight:500}.title-accent::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--primary-color),var(--accent-color));border-radius:3px}.title-icon{color:var(--accent-color);margin-right:6px;font-size:0.9em}@media (max-width:768px){.title-accent{font-size:1.15rem;padding-bottom:3px}.title-accent::after{height:2px}.title-icon{margin-right:4px}}#installButton{animation:slideInUp 0.5s ease-out;box-shadow:0 4px 12px rgba(0,0,0,0.15);transition:all 0.3s ease}#installButton:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,0.2)}@keyframes slideInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){#installButton{margin:0.5rem 0;font-size:0.9rem}#installButton .btn{padding:0.375rem 0.75rem;font-size:0.875rem}}.logout-loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#1a237e 0%,#3949ab 100%);display:none;justify-content:center;align-items:center;z-index:9999;opacity:0;transition:opacity 0.3s ease-in-out}.logout-loading-overlay.show{display:flex;opacity:1}.logout-loading-content{text-align:center;color:white;animation:fadeInUp 0.6s ease-out}.logout-loading-spinner{width:80px;height:80px;border:8px solid rgba(255,255,255,0.2);border-left:8px solid #ffffff;border-radius:50%;margin:0 auto 30px;animation:spin 1s linear infinite}.logout-loading-text{font-size:24px;font-weight:bold;margin-bottom:10px;animation:pulse 2s ease-in-out infinite}.logout-loading-subtext{font-size:16px;opacity:0.8;animation:fadeInOut 3s ease-in-out infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.7}}@keyframes fadeInOut{0%,100%{opacity:0.8}50%{opacity:1}}
