:root {
    --bg-primary: #0f111a; --bg-secondary: #16192b; --bg-card: #1e223d;
    --text-primary: #cbd5e1; --text-muted: #64748b; --accent-cyan: #66fcf1;
    --accent-hover: #45a29e; --status-active: #10b981; --status-expired: #ef4444; --status-disabled: #64748b;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { background-color: var(--bg-primary); color: var(--text-primary); font-family: 'Segoe UI', sans-serif; }
.navbar { background-color: var(--bg-secondary); border-bottom: 1px solid #2e3456; padding: 1rem 2rem; display: flex; justify-content: space-between; align-items: center; }
.navbar-brand { color: var(--accent-cyan); font-size: 1.5rem; font-weight: 800; text-decoration: none; }
.container-fluid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; padding: 2rem; }
.card { background-color: var(--bg-card); border: 1px solid #2e3456; border-radius: 12px; padding: 2rem; box-shadow: 0 10px 25px rgba(0,0,0,0.4); }
h5.text-info { color: var(--accent-cyan) !important; font-size: 1.25rem; font-weight: 700; border-bottom: 1px solid #2e3456; padding-bottom: 0.5rem; margin-bottom: 1rem; }
.form-control, .form-select { width: 100%; padding: 0.75rem; background-color: var(--bg-primary); border: 1px solid #2e3456; border-radius: 8px; color: #fff; margin-bottom: 1rem; }
.form-control:focus, .form-select:focus { outline: none; border-color: var(--accent-cyan); }
.btn { padding: 0.5rem 1rem; font-weight: 700; border-radius: 8px; border: none; cursor: pointer; text-decoration: none; text-align: center; }
.btn-primary, .btn-info { background-color: var(--accent-cyan); color: var(--bg-primary); }
.btn-danger { background-color: var(--status-expired); color: #fff; }
.btn-warning { background-color: #f59e0b; color: #fff; }
.table { width: 100%; border-collapse: collapse; margin-top: 1rem; color: var(--text-primary); }
.table th, .table td { padding: 1rem; border-bottom: 1px solid #2e3456; text-align: left; }
.table th { background-color: var(--bg-secondary); color: var(--accent-cyan); }
.badge { padding: 0.25rem 0.5rem; border-radius: 50px; font-size: 0.8rem; font-weight: 700; }
.bg-success { background-color: var(--status-active); }
.bg-danger { background-color: var(--status-expired); }
.bg-secondary { background-color: var(--status-disabled); }
code { background-color: var(--bg-primary); padding: 0.2rem; color: #f43f5e; border-radius: 4px; }
.alert { padding: 1rem; border-radius: 8px; margin-bottom: 1rem; }
.alert-danger { background-color: rgba(239, 68, 68, 0.1); color: var(--status-expired); border: 1px solid var(--status-expired); }
.alert-success { background-color: rgba(16, 185, 129, 0.1); color: var(--status-active); border: 1px solid var(--status-active); }
