*,:after,:before{box-sizing:border-box;margin:0;padding:0}:root{--blue:#0071ce;--blue-dk:#004f9a;--yellow:#ffc220;--green:#007c59;--red:#c0392b;--bg-page:#eef4fb;--sidebar-bg:#fff;--gray-50:#f0f6ff;--gray-100:#e8f0f8;--gray-200:#e9ecef;--gray-300:#dee2e6;--gray-400:#ced4da;--gray-600:#6c757d;--gray-800:#343a40;--text:#1a1a2e;--radius:8px;--shadow:0 2px 8px #00000014;--shadow-lg:0 8px 24px #0000001f}body{background:#eef4fb;background:var(--bg-page);color:#1a1a2e;color:var(--text);font-family:Inter,sans-serif;font-family:var(--app-font,"Inter",sans-serif);font-size:14px;line-height:1.5}a{color:#0071ce;color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}.app-layout{display:flex;min-height:100vh}.sidebar{background:#fff;background:var(--sidebar-bg,#fff);border-right:1px solid #e9ecef;border-right:1px solid var(--gray-200);display:flex;flex-direction:column;height:100vh;position:fixed;width:240px;z-index:100}.sidebar-logo{align-items:center;border-bottom:1px solid #e9ecef;border-bottom:1px solid var(--gray-200);display:flex;gap:10px;padding:20px 24px}.sidebar-logo .logo-spark{align-items:center;background:#ffc220;background:var(--yellow);border-radius:50%;color:#1a1a2e;color:var(--text);display:flex;font-size:18px;font-weight:700;height:32px;justify-content:center;width:32px}.sidebar-logo .logo-text{color:#1a1a2e;color:var(--text);font-size:13px;font-weight:600;line-height:1.2}.sidebar-logo .logo-text span{color:#6c757d;color:var(--gray-600);display:block;font-size:11px;font-weight:400}.sidebar-nav{flex:1 1;overflow-y:auto;padding:16px 0}.nav-section-label{color:#6c757d;color:var(--gray-600);font-size:10px;font-weight:600;letter-spacing:.08em;padding:12px 24px 4px;text-transform:uppercase}.nav-item{align-items:center;background:none;border:none;color:#343a40;color:var(--gray-800);cursor:pointer;display:flex;font-size:13.5px;font-weight:500;gap:10px;padding:9px 24px;text-align:left;transition:background .15s,color .15s;width:100%}.nav-item.active,.nav-item:hover{background:#e8f0f8;background:var(--gray-100);color:#0071ce;color:var(--blue)}.nav-item .nav-icon{font-size:16px;text-align:center;width:20px}.sidebar-footer{border-top:1px solid #e9ecef;border-top:1px solid var(--gray-200);color:#6c757d;color:var(--gray-600);font-size:12px;padding:16px 24px}.sidebar-footer .user-name{color:#1a1a2e;color:var(--text);font-weight:600}.sidebar-footer .user-role{border-radius:12px;display:inline-block;font-size:10px;font-weight:600;margin-top:2px;padding:1px 8px;text-transform:uppercase}.role-supplier{background:#e3f2fd;color:#1565c0}.role-service{background:#e8f5e9;color:#2e7d32}.role-admin{background:#fce4ec;color:#c62828}.main-content{display:flex;flex:1 1;flex-direction:column;margin-left:240px;min-height:100vh}.topbar{align-items:center;background:#fff;border-bottom:1px solid #e9ecef;border-bottom:1px solid var(--gray-200);display:flex;height:60px;justify-content:space-between;padding:0 32px;position:-webkit-sticky;position:sticky;top:0;z-index:99}.topbar-title{font-size:18px;font-weight:600}.page-body{padding:32px}.card{background:#fff;border:1px solid #e9ecef;border:1px solid var(--gray-200);border-radius:8px;border-radius:var(--radius);box-shadow:0 2px 8px #00000014;box-shadow:var(--shadow)}.card-header{align-items:center;border-bottom:1px solid #e9ecef;border-bottom:1px solid var(--gray-200);display:flex;justify-content:space-between;padding:18px 24px 14px}.card-title{font-size:15px;font-weight:600}.card-body{padding:20px 24px}.stats-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-bottom:24px}.stat-card{background:#fff;border:1px solid #e9ecef;border:1px solid var(--gray-200);border-radius:8px;border-radius:var(--radius);box-shadow:0 2px 8px #00000014;box-shadow:var(--shadow);padding:20px 24px}.stat-label{color:#6c757d;color:var(--gray-600);font-size:12px;font-weight:500;letter-spacing:.05em;text-transform:uppercase}.stat-value{font-size:28px;font-weight:700;margin:6px 0 2px}.stat-sub{color:#6c757d;color:var(--gray-600);font-size:12px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;font-size:13.5px;width:100%}thead th{background:#f0f6ff;background:var(--gray-50);border-bottom:2px solid #e9ecef;border-bottom:2px solid var(--gray-200);color:#6c757d;color:var(--gray-600);font-size:12px;font-weight:600;letter-spacing:.04em;padding:10px 16px;text-align:left;text-transform:uppercase;white-space:nowrap}tbody td{border-bottom:1px solid #e8f0f8;border-bottom:1px solid var(--gray-100);padding:11px 16px;vertical-align:middle}tbody tr:last-child td{border-bottom:none}tbody tr:hover{background:#f0f6ff;background:var(--gray-50)}.form-group{margin-bottom:16px}.form-group label{color:#343a40;color:var(--gray-800);display:block;font-size:13px;font-weight:500;margin-bottom:5px}input[type=email],input[type=password],input[type=text],select,textarea{background:#fff;border:1px solid #dee2e6;border:1px solid var(--gray-300);border-radius:6px;color:#1a1a2e;color:var(--text);font-family:inherit;font-size:14px;padding:9px 12px;transition:border-color .15s,box-shadow .15s;width:100%}input:focus,select:focus,textarea:focus{border-color:#0071ce;border-color:var(--blue);box-shadow:0 0 0 3px #0071ce1f;outline:none}.btn{align-items:center;border:none;border-radius:6px;cursor:pointer;display:inline-flex;font-family:inherit;font-size:13.5px;font-weight:600;gap:6px;padding:9px 18px;transition:all .15s;white-space:nowrap}.btn-primary{background:#0071ce;background:var(--blue);color:#fff}.btn-primary:hover{background:#004f9a;background:var(--blue-dk)}.btn-yellow{background:#ffc220;background:var(--yellow);color:#1a1a2e;color:var(--text)}.btn-yellow:hover{background:#e6ae00}.btn-success{background:#007c59;background:var(--green);color:#fff}.btn-success:hover{background:#006347}.btn-danger{background:#c0392b;background:var(--red);color:#fff}.btn-danger:hover{background:#a93226}.btn-outline{background:#0000;border:1.5px solid #dee2e6;border:1.5px solid var(--gray-300);color:#343a40;color:var(--gray-800)}.btn-outline:hover{border-color:#0071ce;border-color:var(--blue);color:#0071ce;color:var(--blue)}.btn:disabled{cursor:not-allowed;opacity:.5}.btn-sm{font-size:12.5px;padding:5px 12px}.badge{border-radius:12px;display:inline-block;font-size:11px;font-weight:600;padding:2px 10px;text-transform:uppercase}.badge-green{background:#e8f5e9;color:#2e7d32}.badge-yellow{background:#fff8e1;color:#f57f17}.badge-red{background:#fce4ec;color:#c62828}.badge-blue{background:#e3f2fd;color:#1565c0}.badge-gray{background:#e9ecef;background:var(--gray-200);color:#6c757d;color:var(--gray-600)}.pagination{align-items:center;display:flex;font-size:13px;gap:8px;justify-content:flex-end;margin-top:16px}.pagination span{color:#6c757d;color:var(--gray-600)}.flex{display:flex}.flex-between{align-items:center;display:flex;justify-content:space-between}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.mb-16{margin-bottom:16px}.mb-24{margin-bottom:24px}.mt-16{margin-top:16px}.text-muted{color:#6c757d;color:var(--gray-600)}.text-sm{font-size:12.5px}.fw-600{font-weight:600}.login-page{align-items:center;background:linear-gradient(135deg,#004f9a,#0071ce 60%,#ffc220);display:flex;justify-content:center;min-height:100vh}.login-box{background:#fff;border-radius:12px;box-shadow:0 8px 24px #0000001f;box-shadow:var(--shadow-lg);max-width:420px;padding:48px 40px;width:100%}.login-logo{margin-bottom:32px;text-align:center}.login-logo svg{display:inline-block;margin-bottom:12px}.login-logo h1{font-size:22px;font-weight:700;margin-top:4px}.login-logo p{color:#6c757d;color:var(--gray-600);font-size:13px;margin-top:4px}.login-error{background:#fce4ec;border-radius:6px;color:#c62828;font-size:13px;margin-bottom:16px;padding:10px 14px}.login-box .btn-primary{justify-content:center;margin-top:8px;padding:12px;width:100%}.modal-overlay{align-items:center;background:#00000073;display:flex;inset:0;justify-content:center;position:fixed;z-index:999}.modal{background:#fff;border-radius:10px;box-shadow:0 8px 24px #0000001f;box-shadow:var(--shadow-lg);max-height:90vh;max-width:520px;overflow-y:auto;width:100%}.modal-header{align-items:center;border-bottom:1px solid #e9ecef;border-bottom:1px solid var(--gray-200);display:flex;justify-content:space-between;padding:20px 24px 16px}.modal-title{font-size:16px;font-weight:600}.modal-close{background:none;border:none;color:#6c757d;color:var(--gray-600);cursor:pointer;font-size:20px}.modal-body{padding:20px 24px}.modal-footer{border-top:1px solid #e9ecef;border-top:1px solid var(--gray-200);display:flex;gap:10px;justify-content:flex-end;padding:16px 24px}.alert{border-radius:6px;font-size:13px;margin-bottom:16px;padding:12px 16px}.alert-success{background:#e8f5e9;color:#2e7d32}.alert-error{background:#fce4ec;color:#c62828}.alert-info{background:#e3f2fd;color:#1565c0}.theme-notification-banner{align-items:center;animation:slideUp .3s ease;background:#1e293b;border-radius:10px;bottom:24px;box-shadow:0 8px 32px #00000047;color:#f8fafc;display:flex;font-size:13.5px;gap:16px;left:50%;max-width:620px;padding:14px 20px;position:fixed;transform:translateX(-50%);width:calc(100vw - 48px);z-index:9999}.theme-notification-banner a,.theme-notification-banner button.link-btn{background:none;border:none;color:#60a5fa;cursor:pointer;font-family:inherit;font-size:13.5px;padding:0;text-decoration:underline}.theme-notification-banner .dismiss-btn{background:#ffffff1f;border:none;border-radius:6px;color:#f8fafc;cursor:pointer;font-family:inherit;font-size:12.5px;margin-left:auto;padding:5px 12px;white-space:nowrap}.theme-notification-banner .dismiss-btn:hover{background:#fff3}@keyframes slideUp{0%{opacity:0;transform:translateX(-50%) translateY(12px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}.env-select{border:1px solid #dee2e6;border:1px solid var(--gray-300);border-radius:6px;font-size:13px;padding:6px 10px}@media (max-width:768px){.sidebar{transform:translateX(-100%)}.main-content{margin-left:0}}.xlsx-drop-zone{align-items:center;background:#f0f6ff;background:var(--gray-50);border:2px dashed #dee2e6;border:2px dashed var(--gray-300);border-radius:var(--radius-lg);cursor:pointer;display:flex;flex-direction:column;gap:8px;justify-content:center;padding:48px 24px;text-align:center;transition:border-color .15s,background .15s}.xlsx-drop-zone.dragging,.xlsx-drop-zone:hover{background:#eff6ff;border-color:var(--blue-600)}.xlsx-drop-zone .xlsx-drop-icon{font-size:40px;line-height:1}.xlsx-drop-zone .xlsx-drop-label{color:#343a40;color:var(--gray-800);font-size:16px;font-weight:600}.xlsx-drop-zone .xlsx-drop-sub{color:var(--gray-500);font-size:13px}