:root{--navy:#061735;--deep:#020817;--blue:#0798db;--blue2:#0876c9;--bg:#f2f6fb;--line:#e1e9f2;--text:#152b42}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}.app{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:245px;background:linear-gradient(180deg,#071b3b,var(--deep));padding:20px 16px;color:#fff;display:flex;flex-direction:column;z-index:10}.brand{display:block;text-align:center;border-bottom:1px solid #ffffff18;padding:0 4px 20px;text-decoration:none}.brand img{width:100%;height:78px;object-fit:contain}.brand small{display:block;color:#8eabc6;text-transform:uppercase;letter-spacing:.15em;font-size:9px}.sidebar nav{display:grid;gap:5px;margin-top:20px}.sidebar nav a{color:#afc2d4;text-decoration:none;padding:11px 14px;border-radius:10px;font-weight:550}.sidebar nav a:hover{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff}.sidebar-user{margin-top:auto;border-top:1px solid #ffffff18;padding:15px 8px 0}.sidebar-user b,.sidebar-user small{display:block}.sidebar-user small{color:#8eabc6}.sidebar-user button{border:0;background:none;color:#96b5d0;padding:8px 0;font-size:12px}.main{margin-left:245px;padding:28px 32px;min-height:100vh}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.topbar h1{margin:3px 0 0;font-size:26px;color:var(--navy);font-weight:800}.topbar small{color:#73859a}.user-chip{background:#fff;border:1px solid #dbe7f1;color:#0876c9;padding:8px 12px;border-radius:20px;text-decoration:none;font-size:13px}.panel,.card{border:1px solid var(--line);border-radius:16px;box-shadow:0 8px 24px #0617350a;background:#fff;padding:20px}.stat-card{height:100%}.stat-card small{color:#718298}.stat-card strong{display:block;color:var(--navy);font-size:24px;margin-top:6px}.btn-primary,.btn-lim{background:linear-gradient(135deg,var(--blue),var(--blue2));border:0;box-shadow:0 6px 16px #0798db2d;color:#fff}.table{font-size:14px}.table thead th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#718298;border-bottom-color:var(--line)}.table td{vertical-align:middle}.toolbar{display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}.toolbar form{display:flex;gap:8px}.badge-stock-ok{background:#e6f8ef;color:#157a48}.badge-stock-low{background:#fff0e5;color:#b55a19}.login-bg{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 18% 10%,#123667 0,transparent 34%),radial-gradient(circle at 82% 90%,#063969 0,transparent 30%),var(--deep);padding:20px}.login-card{width:min(430px,100%);background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 28px 80px #0009}.login-logo{background:linear-gradient(145deg,var(--navy),var(--deep));padding:26px 40px;border-bottom:3px solid var(--blue)}.login-logo img{width:100%;height:96px;object-fit:contain}.login-body{padding:30px 38px}.login-body h1{font-size:22px;font-weight:800;color:var(--navy)}.login-body p{color:#718298}.form-control,.form-select{border-color:#d8e3ed;padding:.65rem .8rem}.form-control:focus,.form-select:focus{border-color:var(--blue);box-shadow:0 0 0 .2rem #0798db22}.modal-content{border:0;border-radius:16px}.pagination{flex-wrap:wrap}.change-box{display:flex;align-items:center;gap:12px;background:#eef8fd;border:1px solid #ccecf9;border-radius:12px;padding:12px 14px}.change-box small{color:#64788e}.change-box strong{font-size:20px;color:var(--navy);margin-left:auto}.finish-check{background:#f5f8fb;border:1px solid var(--line);border-radius:12px;padding:13px 13px 13px 38px}.finish-check .form-check-input{margin-left:-24px}@media(max-width:800px){.sidebar{position:static;width:100%;padding:10px 12px}.brand{max-width:180px;margin:auto;border:0;padding:0}.brand img{height:58px}.brand small,.sidebar-user{display:none}.sidebar nav{display:flex;overflow:auto;margin:4px 0}.sidebar nav a{white-space:nowrap;padding:9px 12px}.main{margin-left:0;padding:18px 12px}.topbar h1{font-size:21px}.toolbar form{width:100%}.toolbar form input{min-width:0}.table .d-flex{min-width:230px}}