@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap";@import"https://unpkg.com/boxicons@2.1.2/css/boxicons.min.css";:root{--timberwolf: #dad7cd;--sage: #a3b18a;--fern-green: #588157;--hunter-green: #3a5a40;--brunswick-green: #344e41;--transition-speed: .3s;--tran-03: all .3s ease;--tran-05: all .5s ease;--box-shadow: 0 2px 4px rgba(0, 0, 0, .1);--hover-shadow: 0 4px 8px rgba(0, 0, 0, .15)}*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}body{min-height:100%;background:var(--timberwolf);-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}@media screen and (max-width:420px){html{scroll-behavior:smooth;-webkit-overflow-scrolling:touch}body{overscroll-behavior-y:contain}}.alert{padding:15px;border-radius:8px;margin-bottom:20px;position:relative;display:flex;align-items:center;font-size:16px;animation:slideIn .3s ease-out}.alert:before{font-family:boxicons;margin-right:12px;font-size:24px}.alert.success{background:#dcfce7;color:#166534;border-left:4px solid #22c55e}.alert.success:before{content:""}.alert.error{background:#fee2e2;color:#b91c1c;border-left:4px solid #ef4444}.alert.error:before{content:""}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.btn-submit,.btn-cancel{padding:10px 24px;border-radius:6px;font-size:14px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;transition:all .3s ease;border:none}.btn-submit{background:var(--hunter-green);color:#fff}.btn-cancel{background:#f5f5f5;color:#666;border:1px solid #ddd}.btn-submit:hover{background:var(--brunswick-green)}.btn-cancel:hover{background:#e5e5e5}.status{padding:6px 12px;border-radius:20px;font-size:14px;font-weight:500;transition:all var(--transition-speed);display:inline-block}.status.in-stock{background:#e3f2e5;color:#2da544}.status.low-stock{background:#fff4e5;color:#ffa116}.status.warning-stock{background:#fff8e5;color:#ff9500}.status.out-stock{background:#fde8e8;color:#ef4444}.status:hover{transform:scale(1.05)}@media screen and (max-width:420px){.alert{padding:12px;font-size:14px;margin-bottom:16px}.alert:before{font-size:20px;margin-right:10px}.status{padding:5px 10px;font-size:13px;border-radius:16px}.status:hover{transform:none}.btn-submit,.btn-cancel{padding:12px 20px;font-size:16px;min-height:44px}}.text-center{text-align:center}.loading,.error,.no-data{text-align:center;padding:40px;color:#666;font-size:16px}.error{color:#c33}@media screen and (max-width:420px){.loading,.error,.no-data{padding:24px 14px;font-size:14px}}.sidebar{position:fixed;top:0;left:0;height:100%;width:250px;padding:10px 14px;background:var(--sidebar-color);transition:var(--tran-05);z-index:100;box-shadow:0 0 10px #0000001a}.sidebar.close{width:88px}.sidebar li{height:50px;list-style:none;display:flex;align-items:center;margin-top:10px}.sidebar header .image,.sidebar .icon{min-width:60px;border-radius:6px}.sidebar .icon{min-width:60px;border-radius:6px;height:100%;display:flex;align-items:center;justify-content:center;font-size:20px}.sidebar .text,.sidebar .icon{color:var(--text-color);transition:var(--tran-03)}.sidebar .text{font-size:17px;font-weight:500;white-space:nowrap;opacity:1}.sidebar.close .text{opacity:0}.sidebar header{position:relative}.sidebar header .image-text{display:flex;align-items:center}.sidebar header .image-text .image{display:flex;align-items:center;justify-content:center;font-size:32px;color:var(--primary-color)}.sidebar header .image-text .header-text{display:flex;flex-direction:column}.header-text .name{margin-top:2px;font-size:18px;font-weight:600;color:var(--text-color)}.header-text .profession{font-size:12px;margin-top:-2px;display:block;color:var(--text-color)}.sidebar header .toggle{position:absolute;top:50%;right:-25px;transform:translateY(-50%) rotate(180deg);height:25px;width:25px;background-color:var(--primary-color);color:var(--sidebar-color);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;cursor:pointer;transition:var(--tran-05)}.sidebar.close .toggle{transform:translateY(-50%) rotate(0)}.sidebar .menu{margin-top:40px}.sidebar li a{list-style:none;background-color:transparent;display:flex;align-items:center;height:100%;width:100%;border-radius:6px;text-decoration:none;transition:var(--tran-03)}.sidebar li a:hover{background-color:var(--primary-color)}.sidebar li a:hover .icon,.sidebar li a:hover .text{color:var(--sidebar-color)}.sidebar .menu-bar{height:calc(100% - 55px);display:flex;flex-direction:column;justify-content:space-between;overflow-y:scroll}.menu-bar::-webkit-scrollbar{display:none}.sidebar .menu-bar .bottom-content .user-info{list-style:none;background-color:transparent;display:flex;align-items:center;height:100%;width:100%;border-radius:6px;text-decoration:none}.sidebar li a.router-link-active{background-color:var(--primary-color)}.sidebar li a.router-link-active .icon,.sidebar li a.router-link-active .text{color:var(--sidebar-color)}.main-container{position:relative;left:250px;background-color:var(--body-color);min-height:100vh;top:0;width:calc(100% - 250px);padding:20px;transition:var(--tran-05)}.sidebar.close~.main-container{left:88px;width:calc(100% - 88px)}.main-title{margin-bottom:30px}.main-title h2{color:#333;font-size:28px;font-weight:600}.card-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:40px}.card{background:#fff;border-radius:10px;padding:25px;cursor:pointer;transition:transform .3s,box-shadow .3s;box-shadow:0 2px 10px #00000014}.card:hover{transform:translateY(-5px);box-shadow:0 5px 20px #00000026}.card-inner{display:flex;align-items:center;gap:15px;margin-bottom:15px}.card-inner i{font-size:40px}.card-title{font-size:16px;font-weight:500;color:#666}.card h3{font-size:36px;font-weight:700;margin:0}.card-instock{border-left:5px solid #4caf50}.card-instock i,.card-instock h3{color:#4caf50}.card-lowstock{border-left:5px solid #ff9800}.card-lowstock i,.card-lowstock h3{color:#ff9800}.card-outstock{border-left:5px solid #f44336}.card-outstock i,.card-outstock h3{color:#f44336}.table-container{background:#fff;border-radius:10px;padding:25px;box-shadow:0 2px 10px #00000014;overflow-x:auto}.table-container h3{margin-bottom:20px;color:#333;font-size:20px}table{width:100%;border-collapse:collapse;min-width:800px}thead{background-color:var(--primary-color);color:#fff}th,td{padding:12px 15px;text-align:left}th{font-weight:600}tbody tr{border-bottom:1px solid #eee;transition:background-color .3s}tbody tr:hover{background-color:#f5f5f5}tbody tr:last-child{border-bottom:none}.status{padding:5px 12px;border-radius:20px;font-size:13px;font-weight:500;display:inline-block}.status.in-stock{background:#e8f5e9;color:#2e7d32}.status.low-stock{background:#fff3e0;color:#e65100}.status.out-stock{background:#ffebee;color:#c62828}.last-login .timestamp{display:flex;align-items:center;gap:5px;color:#666}.last-login .never-login{display:flex;align-items:center;gap:5px;color:#999}@media(max-width:768px){.sidebar{width:88px}.sidebar .text{opacity:0}.main-container{left:0;width:100%;padding:20px 15px;transition:var(--tran-03)}.sidebar.close~.main-container,.sidebar~.main-container{left:0;width:100%}.main-title{margin-top:60px;margin-bottom:25px}.main-title h2{font-size:24px}.card-container{grid-template-columns:1fr}table{min-width:100%}thead{display:none}tbody tr{display:block;margin-bottom:15px;border:1px solid #ddd;border-radius:8px;padding:10px}tbody td{display:flex;justify-content:space-between;padding:8px 10px;border-bottom:1px solid #eee}tbody td:last-child{border-bottom:none}tbody td:before{content:attr(data-label);font-weight:600;color:#333}}@media(max-width:480px){.main-container{padding:15px 10px}.main-title{margin-top:65px;margin-bottom:20px}.main-title h2{font-size:22px}.card,.table-container{padding:15px}}