@import 'bootstrap/dist/css/bootstrap.min.css';
@import 'bootstrap-icons/font/bootstrap-icons.css';
@import 'sweetalert2/dist/sweetalert2.min.css';
@import 'tom-select/dist/css/tom-select.bootstrap5.css';
@import 'flatpickr/dist/flatpickr.min.css';
@import 'datatables.net-bs5/css/dataTables.bootstrap5.min.css';
@import 'datatables.net-responsive-bs5/css/responsive.bootstrap5.min.css';

:root {
    --prn-primary: #123c69;
    --prn-primary-dark: #0b2949;
    --prn-accent: #2d6a4f;
    --prn-border: #d9e2ec;
    --prn-surface: #f5f7fa;
    --prn-muted: #62748a;
}

body {
    background: var(--prn-surface);
    color: #1f2933;
}

.app-navbar {
    background: var(--prn-primary-dark);
}

.brand-mark {
    align-items: center;
    background: #fff;
    border-radius: 8px;
    color: var(--prn-primary-dark);
    display: inline-flex;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.page-shell {
    padding-bottom: 3rem;
    padding-top: 1.5rem;
}

.page-heading {
    border-bottom: 1px solid var(--prn-border);
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
}

.eyebrow {
    color: var(--prn-muted);
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.stat-card,
.content-panel,
.auth-card {
    background: #fff;
    border: 1px solid var(--prn-border);
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .04);
}

.stat-card {
    min-height: 132px;
    padding: 1rem;
}

.stat-icon {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.auth-body {
    background:
        linear-gradient(180deg, rgba(18, 60, 105, .94), rgba(18, 60, 105, .82)),
        #123c69;
    min-height: 100vh;
}

.auth-shell {
    margin: 0 auto;
    max-width: 460px;
    padding: 2rem 1rem;
}

.auth-card {
    padding: 1.5rem;
}

.nav-link.active {
    font-weight: 700;
}

.table-mobile-card {
    border: 1px solid var(--prn-border);
    border-radius: 8px;
}

@media (max-width: 575.98px) {
    .page-shell {
        padding-top: 1rem;
    }

    .auth-shell {
        padding-top: 1rem;
    }
}