@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--primary-color: #005A9C;--primary-hover: #00407A;--accent-color: #E31837;--bg-main: #f0f4f8;--bg-card: #ffffff;--bg-sidebar: #ffffff;--text-main: #1e293b;--text-muted: #64748b;--border-color: #e2e8f0;--error: #E31837}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,sans-serif;background-color:var(--bg-main);color:var(--text-main);min-height:100vh;display:flex;flex-direction:column}#root{flex:1;display:flex;flex-direction:column}.glass-panel{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;box-shadow:0 10px 25px -5px #0000000d,0 8px 10px -6px #00000003}.form-group{display:flex;flex-direction:column;margin-bottom:1.5rem}.form-group label{font-size:.875rem;font-weight:600;margin-bottom:.5rem;color:var(--text-main)}.form-group input,.form-group select{padding:.75rem 1rem;background:#f8fafc;border:1px solid var(--border-color);border-radius:8px;color:var(--text-main);font-size:1rem;outline:none;transition:all .2s}.form-group input:focus,.form-group select:focus{border-color:var(--primary-color);background:#fff;box-shadow:0 0 0 3px #005a9c26}.btn-primary{background:var(--primary-color);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;width:100%;box-shadow:0 4px 6px -1px #005a9c33}.btn-primary:hover{background:var(--primary-hover);box-shadow:0 6px 8px -1px #005a9c4d}.btn-primary:active{transform:translateY(1px)}.btn-secondary{background:#fff;color:var(--text-main);border:1px solid var(--border-color);padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:#f1f5f9;border-color:#cbd5e1}.error-text{color:var(--error);font-size:.875rem;margin-top:.5rem;font-weight:500}.layout-container{display:flex;min-height:100vh}.sidebar{width:260px;background:var(--bg-sidebar);border-right:1px solid var(--border-color);display:flex;flex-direction:column;box-shadow:2px 0 10px #00000005;z-index:10}.sidebar-header{padding:1.5rem;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:center}.sidebar-nav{padding:1.5rem 1rem;flex:1;display:flex;flex-direction:column;gap:.5rem}.nav-item{display:flex;align-items:center;padding:.875rem 1rem;color:var(--text-muted);font-weight:500;text-decoration:none;border-radius:8px;transition:all .2s}.nav-item:hover{color:var(--primary-color);background:#f0f4f8}.nav-item.active{color:#fff;background:var(--primary-color);box-shadow:0 4px 6px -1px #005a9c33}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.top-header{height:70px;background:var(--bg-card);border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:flex-end;padding:0 2rem;box-shadow:0 2px 10px #00000005;z-index:5}.page-content{flex:1;padding:2.5rem;overflow-y:auto;overflow-x:hidden;min-width:0}.stat-card{padding:1.5rem;border-radius:12px;background:var(--bg-card);border:1px solid var(--border-color);box-shadow:0 4px 6px -1px #00000005;display:flex;flex-direction:column;border-top:4px solid var(--primary-color);transition:transform .2s,box-shadow .2s}.stat-card:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000000d}.stat-card h3{font-size:.875rem;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.stat-card .value{font-size:2.25rem;font-weight:700;color:var(--text-main);margin-top:.5rem}.table-container{width:100%;overflow-x:auto;border-radius:12px;background:var(--bg-card);border:1px solid var(--border-color);box-shadow:0 4px 6px -1px #00000005}.premium-table{width:100%;border-collapse:collapse;text-align:left}.premium-table th{padding:1.25rem 1.5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);font-weight:700;border-bottom:2px solid var(--border-color);background:#f8fafc}.premium-table td{padding:1.25rem 1.5rem;border-bottom:1px solid var(--border-color);color:var(--text-main);font-size:.875rem;font-weight:500}.premium-table tr:last-child td{border-bottom:none}.premium-table tbody tr:hover{background:#f8fafc}.badge{padding:.35rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:700;letter-spacing:.025em}.badge-blue{background:#e0f2fe;color:#0369a1}.badge-green{background:#dcfce7;color:#15803d}.badge-red{background:#fee2e2;color:#b91c1c}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a66;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:50}.modal-content{background:var(--bg-card);border-radius:16px;width:100%;max-width:500px;padding:2.5rem;box-shadow:0 25px 50px -12px #00000040;animation:modalSlideIn .3s ease-out forwards}.modal-content h2{color:var(--text-main)}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.mobile-only{display:none!important}@media (max-width: 768px){.mobile-only{display:flex!important}.desktop-only{display:none!important}.layout-container{flex-direction:column}.sidebar{position:fixed;top:0;bottom:0;left:-280px;width:260px;z-index:1000;transition:left .3s ease-in-out;box-shadow:10px 0 25px #0000001a}.sidebar.mobile-open{left:0}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a66;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:999;opacity:0;pointer-events:none;transition:opacity .3s ease-in-out}.sidebar-overlay.active{opacity:1;pointer-events:auto}.top-header{height:60px;padding:0 1rem;justify-content:space-between}.top-header .mobile-logo{display:block!important}.top-header .user-info{display:none}.page-content{padding:1.5rem 1rem}.stat-card .value{font-size:1.75rem}.modal-content{padding:1.5rem;border-radius:16px 16px 0 0;margin-top:auto;max-height:90vh;overflow-y:auto}.modal-overlay{align-items:flex-end}.form-group-grid{grid-template-columns:1fr!important}.logout-btn-text{display:none}}.mobile-logo{display:none}.form-group-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
