*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg:#0f1117;--color-surface:#1a1d27;--color-surface2:#22263a;--color-border:#2e3349;--color-primary:#e8433a;--color-primary-dark:#c4342c;--color-text:#e8eaf0;--color-text-muted:#8891a8;--color-success:#2ecc71;--color-warning:#f39c12;--color-error:#e74c3c;--radius:8px;--font:"Inter", system-ui, sans-serif}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font);min-height:100vh;font-size:14px;line-height:1.5}a{color:var(--color-primary);text-decoration:none}button{cursor:pointer;font-family:inherit}input,select,textarea{font-family:inherit;font-size:inherit}.btn{border-radius:var(--radius);border:none;align-items:center;gap:6px;padding:8px 16px;font-size:14px;font-weight:500;transition:opacity .15s,background .15s;display:inline-flex}.btn:hover{opacity:.88}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-ghost{color:var(--color-text-muted);border:1px solid var(--color-border);background:0 0}.btn-ghost:hover{background:var(--color-surface2);opacity:1}.btn-danger{background:var(--color-error);color:#fff}.btn-sm{padding:5px 10px;font-size:12px}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:20px}.field{flex-direction:column;gap:6px;display:flex}.field label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:12px;font-weight:500}.field input,.field select,.field textarea{background:var(--color-surface2);border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);outline:none;padding:9px 12px;transition:border-color .15s}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--color-primary)}.badge{border-radius:20px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-block}.badge-admin{color:#7ba7f7;background:#2a3a6b}.badge-mesa{color:#7bf7b7;background:#2a4a3a}.badge-superAdmin{color:#f77bb7;background:#4a2a3a}.alert-banner{border-radius:var(--radius);margin-bottom:16px;padding:10px 14px;font-size:13px}.alert-banner.error{border:1px solid var(--color-error);color:#f1948a;background:#e74c3c26}.alert-banner.success{border:1px solid var(--color-success);color:#82e0aa;background:#2ecc7126}.spinner{border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:20px;height:20px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.page-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.page-header h1{font-size:20px;font-weight:600}.table-wrap{margin:0 -20px;padding:0 20px;overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:480px}th{text-align:left;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);border-bottom:1px solid var(--color-border);padding:10px 12px;font-size:11px}td{border-bottom:1px solid var(--color-border);vertical-align:middle;padding:12px}tr:last-child td{border-bottom:none}tr:hover td{background:var(--color-surface2)}.empty-state{text-align:center;color:var(--color-text-muted);padding:48px}.form-layout{grid-template-columns:minmax(0,3fr) minmax(300px,2fr);align-items:start;gap:20px;display:grid}@media (width<=900px){.form-layout{grid-template-columns:1fr}}.field-row{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;display:grid}@media (width<=768px){.hide-mobile{display:none}body{font-size:13px}.btn{min-height:38px;padding:8px 14px}.btn-sm{min-height:32px;padding:6px 10px;font-size:12px}.card{border-radius:6px;padding:14px}.page-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:18px}.page-header h1{font-size:18px}.page-header>div:last-child{flex-wrap:wrap;width:100%}.table-wrap{-webkit-overflow-scrolling:touch;margin:0 -14px;padding:0 14px}table{min-width:max-content;font-size:12px}th,td{padding:8px 6px}.field input,.field select,.field textarea{padding:10px 12px;font-size:14px}.form-layout{flex-direction:column-reverse;gap:14px;display:flex}.form-layout>.card{width:100%;min-width:0;max-width:100%}.card{width:100%}.alert-banner{padding:9px 12px;font-size:12px}}.layout{min-height:100vh;display:flex}.sidebar{background:var(--color-surface);border-right:1px solid var(--color-border);z-index:100;flex-direction:column;width:220px;transition:transform .2s;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-logo{border-bottom:1px solid var(--color-border);padding:20px}.sidebar-logo h2{color:var(--color-primary);font-size:18px;font-weight:700}.sidebar-logo span{color:var(--color-text-muted);font-size:11px}.sidebar-nav{flex:1;padding:12px 0;overflow-y:auto}.nav-section{text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);padding:8px 16px 4px;font-size:10px}.nav-link{color:var(--color-text-muted);border-left:3px solid #0000;align-items:center;gap:10px;padding:9px 16px;font-size:14px;transition:all .15s;display:flex}.nav-link:hover{background:var(--color-surface2);color:var(--color-text)}.nav-link.active{color:var(--color-primary);border-left-color:var(--color-primary);background:#e8433a1a}.sidebar-footer{border-top:1px solid var(--color-border);color:var(--color-text-muted);padding:16px;font-size:12px}.sidebar-footer strong{color:var(--color-text);display:block}.main-content{flex:1;min-width:0;max-width:100%;margin-left:220px;padding:28px;overflow-x:hidden}.sidebar-toggle{z-index:102;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);width:40px;height:40px;color:var(--color-text);justify-content:center;align-items:center;font-size:18px;display:none;position:fixed;top:10px;left:10px}.sidebar-backdrop{z-index:99;background:#00000080;display:none;position:fixed;inset:0}@media (width<=768px){.sidebar{width:260px;transform:translate(-100%)}.layout.sidebar-open .sidebar{transform:translate(0);box-shadow:2px 0 16px #0006}.layout.sidebar-open .sidebar-backdrop{display:block}.main-content{margin-left:0;padding:60px 14px 14px}.sidebar-toggle{display:inline-flex}.layout.sidebar-open .sidebar-toggle{background:var(--color-surface2);left:auto;right:10px}}
