:root {
    --ct-navy:   #0a1628;
    --ct-gold:   #c9a84c;
    --ct-gold2:  #e8c96e;
    --ct-sidebar-w: 240px;
    --ct-navbar-h: 56px;
}

body { background: #f0f2f5; font-family: 'Inter', sans-serif; }

/* ── Navbar ─────────────────────────────────────── */
.ct-navbar { background: var(--ct-navy); height: var(--ct-navbar-h); z-index: 1040; border-bottom: 2px solid var(--ct-gold); }
.ct-brand-text { font-family: 'Cinzel', serif; letter-spacing: .05em; color: var(--ct-gold); }

/* ── Sidebar ─────────────────────────────────────── */
.ct-wrapper { display: flex; padding-top: var(--ct-navbar-h); min-height: 100vh; }
.ct-sidebar {
    width: var(--ct-sidebar-w);
    background: var(--ct-navy);
    position: fixed;
    top: var(--ct-navbar-h);
    bottom: 0;
    left: 0;
    overflow-y: auto;
    z-index: 1030;
    transition: transform .3s;
}
.ct-sidebar-inner { padding: 1rem 0; }
.ct-sidebar .nav-link {
    color: rgba(255,255,255,.65);
    padding: .55rem 1.25rem;
    border-radius: 0;
    font-size: .875rem;
    display: flex;
    align-items: center;
    gap: .55rem;
    transition: all .2s;
}
.ct-sidebar .nav-link:hover,
.ct-sidebar .nav-link.active {
    color: #fff;
    background: rgba(201,168,76,.15);
    border-left: 3px solid var(--ct-gold);
}
.ct-sidebar-section {
    color: var(--ct-gold);
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 1rem 1.25rem .35rem;
    opacity: .8;
}

/* ── Main ─────────────────────────────────────── */
.ct-main { margin-left: var(--ct-sidebar-w); flex: 1; padding: 1.75rem; min-height: calc(100vh - var(--ct-navbar-h)); }
.ct-page-header { border-bottom: 1px solid #dee2e6; padding-bottom: .75rem; }
.ct-page-header h4 { color: var(--ct-navy); font-weight: 600; }

/* ── Cards ─────────────────────────────────────── */
.ct-card { background: #fff; border-radius: 12px; border: none; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.ct-stat-card { border-left: 4px solid var(--ct-gold); }
.ct-stat-card .ct-stat-icon { width: 48px; height: 48px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; }

/* ── Badges & Status ─────────────────────────────────────── */
.badge-active   { background: #d1fae5; color: #065f46; }
.badge-revoked  { background: #fee2e2; color: #991b1b; }
.badge-upcoming { background: #dbeafe; color: #1e40af; }
.badge-completed{ background: #f3f4f6; color: #374151; }
.badge-inactive { background: #fef3c7; color: #92400e; }

/* ── Tables ─────────────────────────────────────── */
.table th { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; font-weight: 600; }
.table td { vertical-align: middle; font-size: .875rem; }

/* ── Buttons ─────────────────────────────────────── */
.btn-ct-gold { background: var(--ct-gold); color: var(--ct-navy); border: none; font-weight: 600; }
.btn-ct-gold:hover { background: var(--ct-gold2); color: var(--ct-navy); }
.btn-ct-navy { background: var(--ct-navy); color: #fff; border: none; }
.btn-ct-navy:hover { background: #1a2a4a; color: #fff; }

/* ── Login ─────────────────────────────────────── */
.ct-login-page { background: linear-gradient(135deg, var(--ct-navy) 0%, #1a2a4a 100%); min-height: 100vh; display: flex; align-items: center; justify-content: center; }
.ct-login-card { background: #fff; border-radius: 16px; padding: 2.5rem; width: 100%; max-width: 420px; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.ct-login-logo { font-family: 'Cinzel', serif; color: var(--ct-navy); font-size: 1.6rem; letter-spacing: .05em; }
.ct-login-logo span { color: var(--ct-gold); }

/* ── Responsive ─────────────────────────────────────── */
@media (max-width: 768px) {
    .ct-sidebar { transform: translateX(-100%); }
    .ct-sidebar.show { transform: translateX(0); }
    .ct-main { margin-left: 0; padding: 1rem; }
}