:root {
    
    --jgk-primary: #0B2545;
    --jgk-primary-hover: #143A6B;
    --jgk-primary-active: #08203E;
    --jgk-primary-tint: #0F2D54;

    --jgk-accent: #C8102E;
    --jgk-accent-soft: #E63946;

    --jgk-danger: #8B1E2D;
    --jgk-success: #1E5631;
    --jgk-warning: #C8102E;
    --jgk-info: #1F5B7A;

    
    --jgk-n50:  #F6F7F9;
    --jgk-n100: #ECEEF1;
    --jgk-n200: #DDE1E7;
    --jgk-n300: #C5CAD2;
    --jgk-n400: #9AA3AE;
    --jgk-n500: #6B7480;
    --jgk-n600: #4A525C;
    --jgk-n700: #2F3640;
    --jgk-n800: #1C2128;
    --jgk-n900: #0E1116;

    --jgk-body-bg: #F4F5F7;
    --jgk-card-bg: #FFFFFF;
    --jgk-border: #DDE1E7;

    --jgk-font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;

    --jgk-radius-sm: 3px;
    --jgk-radius-md: 6px;
    --jgk-radius-lg: 10px;

    --jgk-shadow-sm: 0 1px 2px rgba(11,37,69,.06), 0 1px 1px rgba(11,37,69,.04);
    --jgk-shadow-md: 0 2px 6px rgba(11,37,69,.08), 0 1px 2px rgba(11,37,69,.06);
    --jgk-shadow-lg: 0 8px 24px rgba(11,37,69,.12);

    
    --bs-primary: #0B2545;
    --bs-primary-rgb: 11,37,69;
    --bs-danger: #8B1E2D;
    --bs-danger-rgb: 139,30,45;
    --bs-success: #1E5631;
    --bs-success-rgb: 30,86,49;
    --bs-warning: #C8102E;
    --bs-warning-rgb: 200,16,46;
    --bs-info: #1F5B7A;
    --bs-info-rgb: 31,91,122;
    --bs-body-font-family: var(--jgk-font);
    --bs-body-bg: #F4F5F7;
    --bs-body-color: #1C2128;
    --bs-border-radius: 6px;
    --bs-link-color: #0B2545;
}

html, body {
    font-family: var(--jgk-font);
    color: var(--jgk-n800);
    background-color: var(--jgk-body-bg);
}

h1, h2, h3, h4, h5, h6 { color: var(--jgk-n900); font-weight: 600; }
h1 { font-size: 28px; font-weight: 700; }
h2 { font-size: 22px; }
h3 { font-size: 18px; }
h4 { font-size: 16px; }
h5 { font-size: 15px; }
h6 { font-size: 14px; }

.btn {
    font-weight: 500;
    letter-spacing: .01em;
    border-radius: 5px;
    padding: .45rem 1rem;
    transition: background-color .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.btn-primary {
    background: var(--jgk-primary);
    border-color: var(--jgk-primary-active);
    color: #fff;
}
.btn-primary:hover { background: var(--jgk-primary-hover); border-color: var(--jgk-primary); }
.btn-primary:active, .btn-primary:focus {
    background: var(--jgk-primary-active);
    box-shadow: 0 0 0 .2rem rgba(11,37,69,.25);
}

.btn-danger { background: var(--jgk-danger); border-color: #6B1623; color: #fff; }
.btn-danger:hover { background: #A12937; border-color: var(--jgk-danger); }

.btn-success { background: var(--jgk-success); border-color: #143E22; color: #fff; }
.btn-success:hover { background: #2A6E40; }

.btn-warning { background: var(--jgk-warning); border-color: #8A6309; color: #fff; }
.btn-warning:hover { background: #C9941F; color: #fff; }

.btn-info { background: var(--jgk-info); border-color: #154258; color: #fff; }
.btn-info:hover { background: #2C7295; color: #fff; }

.btn-secondary { background: var(--jgk-n500); border-color: var(--jgk-n600); color: #fff; }
.btn-secondary:hover { background: var(--jgk-n600); }

.btn-dark { background: var(--jgk-n800); border-color: var(--jgk-n900); color: #fff; }

.btn-outline-primary { color: var(--jgk-primary); border-color: var(--jgk-primary); background: transparent; }
.btn-outline-primary:hover { background: var(--jgk-primary); color: #fff; }

.btn-outline-secondary { color: var(--jgk-n600); border-color: var(--jgk-n300); background: transparent; }
.btn-outline-secondary:hover { background: var(--jgk-n100); color: var(--jgk-n800); border-color: var(--jgk-n400); }

.btn:focus, .btn:focus-visible {
    box-shadow: 0 0 0 .2rem rgba(11,37,69,.25);
    outline: none;
}

.card {
    border: 1px solid var(--jgk-border);
    border-radius: var(--jgk-radius-md);
    box-shadow: var(--jgk-shadow-sm);
    background: var(--jgk-card-bg);
}
.card-header {
    background: #fff;
    border-bottom: 1px solid var(--jgk-border);
    font-weight: 600;
    color: var(--jgk-n800);
    padding: 14px 18px;
}
.card-title {
    color: var(--jgk-primary);
    font-weight: 600;
}
.shadow-sm { box-shadow: var(--jgk-shadow-sm) !important; }

.form-control, .form-select {
    border: 1px solid var(--jgk-n300);
    border-radius: 5px;
    padding: .45rem .75rem;
    font-size: 14px;
    color: var(--jgk-n800);
    background-color: #fff;
}
.form-control:focus, .form-select:focus {
    border-color: var(--jgk-primary);
    box-shadow: 0 0 0 3px rgba(11,37,69,.12);
    outline: none;
}
.form-label {
    font-weight: 600;
    font-size: 13px;
    color: var(--jgk-n700);
    margin-bottom: 6px;
}
.invalid {
    outline: none;
    border-color: var(--jgk-danger);
}
.validation-message {
    color: var(--jgk-danger);
    font-size: 12px;
}
.form-check-input:checked {
    background-color: var(--jgk-primary);
    border-color: var(--jgk-primary);
}
.form-check-input:focus {
    border-color: var(--jgk-primary);
    box-shadow: 0 0 0 3px rgba(11,37,69,.12);
}

.table {
    font-size: 14px;
    --bs-table-bg: #fff;
    margin-bottom: 0;
}
.table thead th {
    background: var(--jgk-primary);
    color: #fff !important;
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 12px;
    border: none;
    vertical-align: middle;
}
.table tbody td {
    padding: 10px 12px;
    vertical-align: middle;
    border-color: var(--jgk-n100);
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-bg-type: #FAFBFC;
}
.table-hover tbody tr:hover {
    background: #EEF2F7;
}

.alert {
    border: 1px solid;
    border-left-width: 4px;
    border-radius: 4px;
    padding: 12px 16px;
}
.alert-success { background: #E8F0EB; border-color: var(--jgk-success); color: #143E22; }
.alert-danger  { background: #F5E4E7; border-color: var(--jgk-danger);  color: #5C0F1A; }
.alert-warning { background: #F8EFD8; border-color: var(--jgk-warning); color: #6E5008; }
.alert-info    { background: #E1ECF2; border-color: var(--jgk-info);    color: #133E54; }

.badge {
    font-weight: 500;
    padding: .35em .6em;
    border-radius: 4px;
}
.badge.bg-primary { background: var(--jgk-primary) !important; }
.badge.bg-secondary { background: var(--jgk-n500) !important; }
.badge.bg-danger { background: var(--jgk-danger) !important; }
.badge.bg-success { background: var(--jgk-success) !important; }
.badge.bg-warning { background: var(--jgk-warning) !important; color: #fff !important; }
.badge.bg-info { background: var(--jgk-info) !important; color: #fff !important; }

.text-primary { color: var(--jgk-primary) !important; }
.text-danger  { color: var(--jgk-danger) !important; }
.text-success { color: var(--jgk-success) !important; }
.text-warning { color: var(--jgk-warning) !important; }
.text-info    { color: var(--jgk-info) !important; }
.text-muted   { color: var(--jgk-n500) !important; }

.spinner-border.text-primary { color: var(--jgk-primary) !important; }
.spinner-border.text-secondary { color: var(--jgk-n500) !important; }

.dropdown-menu {
    border: 1px solid var(--jgk-border);
    box-shadow: var(--jgk-shadow-md);
    border-radius: 6px;
    padding: 6px;
}
.dropdown-item {
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 14px;
    color: var(--jgk-n700);
}
.dropdown-item:hover, .dropdown-item:focus {
    background: var(--jgk-n50);
    color: var(--jgk-primary);
}
.dropdown-divider { border-color: var(--jgk-n100); }

.pagination .page-link {
    color: var(--jgk-primary);
    border-color: var(--jgk-n200);
}
.pagination .page-item.active .page-link {
    background: var(--jgk-primary);
    border-color: var(--jgk-primary);
    color: #fff;
}

a {
    color: var(--jgk-primary);
    text-decoration: none;
}
a:hover {
    color: var(--jgk-primary-hover);
    text-decoration: underline;
}

#blazor-error-ui {
    background: var(--jgk-danger) !important;
    color: #fff !important;
    border-top: 4px solid var(--jgk-accent);
}
#blazor-error-ui a {
    color: var(--jgk-accent-soft) !important;
}