:root {
    /* Scheme #1 — Emerald & Navy */
    --t-navy: #0f2740;       /* sidebar top (navy) */
    --t-navy-2: #16385c;     /* sidebar bottom */
    --t-accent: #1f9d72;     /* emerald */
    --t-accent-2: #28b487;
    --t-bg: #f4f6f9;
    --t-card: #ffffff;
    --t-ink: #1f2d3d;
    --t-muted: #6b7a90;
    --t-border: #e6eaf0;
}

html, body {
    font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    background: var(--t-bg);
    color: var(--t-ink);
}

h1, h2, h3, h4, h5 { font-weight: 600; letter-spacing: -0.01em; }
h1 { font-size: 1.6rem; }

a, .btn-link { color: var(--t-accent); }

/* ---- Layout ---- */
.page { position: relative; display: flex; flex-direction: column; }

.sidebar {
    background: linear-gradient(180deg, var(--t-navy) 0%, var(--t-navy-2) 100%);
}

.bare-main { min-height: 100vh; }

/* Top bar */
.top-row {
    background: var(--t-card);
    border-bottom: 1px solid var(--t-border);
    height: 3.5rem;
    box-shadow: 0 1px 2px rgba(16,39,64,0.04);
}
.top-row .nav-user { color: var(--t-muted); font-size: .9rem; }
.top-row a { color: var(--t-muted); text-decoration: none; }
.top-row a:hover { color: var(--t-accent); }

/* ---- Brand ---- */
.navbar-brand {
    font-weight: 700; font-size: 1.25rem; letter-spacing: .02em;
    display: flex; align-items: center; gap: .5rem;
}
.navbar-brand i { color: var(--t-accent-2); }
.navbar-brand .brand-mark {
    height: 30px; width: 30px; object-fit: cover; border-radius: 7px;
    background: #fff; padding: 2px; vertical-align: middle;
}

/* ---- Nav links ---- */
.nav-scrollable { padding-top: .5rem; }
.nav-item { margin: .1rem .6rem; }
.nav-item ::deep .nav-link,
.nav-link {
    color: #c7d3e0 !important;
    border-radius: 8px;
    padding: .55rem .85rem !important;
    display: flex; align-items: center; gap: .65rem;
    font-size: .95rem;
    transition: background .15s, color .15s;
}
.nav-link .bi { font-size: 1.05rem; opacity: .9; }
.nav-link:hover { background: rgba(255,255,255,0.08); color: #fff !important; }
.nav-link.active {
    background: rgba(40,180,135,0.18) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 0 var(--t-accent-2);
}

/* ---- Cards ---- */
.card {
    border: 1px solid var(--t-border);
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(16,39,64,0.05);
}
.card .text-muted { color: var(--t-muted) !important; }
.card h6.text-muted { text-transform: uppercase; font-size: .72rem; letter-spacing: .06em; }

/* ---- Buttons ---- */
.btn-primary {
    background: var(--t-accent); border-color: var(--t-accent);
}
.btn-primary:hover, .btn-primary:focus {
    background: var(--t-accent-2); border-color: var(--t-accent-2);
}
.badge.bg-primary { background: var(--t-accent) !important; }

/* ---- Tables ---- */
.table { --bs-table-hover-bg: #f0f7f4; }
.table thead th {
    font-size: .78rem; text-transform: uppercase; letter-spacing: .04em;
    color: var(--t-muted); border-bottom: 2px solid var(--t-border);
    cursor: default;
}
.table th.sortable { cursor: pointer; user-select: none; }
.table th.sortable:hover { color: var(--t-accent); }

/* ---- Login ---- */
.login-wrap {
    min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: radial-gradient(1200px 600px at 50% -10%, #1c4068 0%, var(--t-navy) 55%);
}
.login-card {
    background: #fff; padding: 2.5rem; border-radius: 18px; width: 100%; max-width: 380px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
}
.login-brand {
    display: flex; align-items: center; gap: .6rem; font-size: 1.6rem; font-weight: 700;
    color: var(--t-navy); margin-bottom: .25rem;
}
.login-brand i { color: var(--t-accent-2); }
.login-logo { display: block; max-width: 260px; width: 100%; margin: 0 auto .5rem; }

/* ---- Misc ---- */
.stat-icon {
    width: 40px; height: 40px; border-radius: 10px; display: inline-flex;
    align-items: center; justify-content: center; background: #eaf6f1; color: var(--t-accent);
    font-size: 1.1rem;
}

/* ---- Print / Save-as-PDF ---- */
@media print {
    .sidebar, .top-row, .navbar-toggler, .no-print { display: none !important; }
    .page { display: block; }
    main, .content { padding: 0 !important; margin: 0 !important; }
    html, body { background: #fff !important; }
    .card { box-shadow: none !important; border: 1px solid #d9dee5 !important; break-inside: avoid; }
    .row > [class*="col-"] { break-inside: avoid; }
    a { color: inherit !important; text-decoration: none !important; }
    table { font-size: 12px; }
    @page { margin: 1.4cm; }
}
