:root,
[data-bs-theme="light"] {
    --brand-red: #F6502B;
    --brand-navy: #25346A;
    --brand-blue: #295BDD;
    --brand-yellow: #FFB118;
    --brand-green: #71C204;
    --brand-ink: #172033;
    --brand-muted: #5e6a84;
    --brand-line: #d8deeb;
    --brand-surface: #f5f7fb;
    --brand-surface-soft: #f8faff;
    --bs-blue: var(--brand-blue);
    --bs-indigo: var(--brand-navy);
    --bs-purple: var(--brand-navy);
    --bs-red: var(--brand-red);
    --bs-orange: var(--brand-red);
    --bs-yellow: var(--brand-yellow);
    --bs-green: var(--brand-green);
    --bs-cyan: var(--brand-blue);
    --bs-primary: var(--brand-navy);
    --bs-secondary: #6b7280;
    --bs-success: var(--brand-green);
    --bs-info: var(--brand-blue);
    --bs-warning: var(--brand-yellow);
    --bs-danger: var(--brand-red);
    --bs-light: var(--brand-surface);
    --bs-dark: var(--brand-navy);
    --bs-primary-rgb: 37, 52, 106;
    --bs-secondary-rgb: 107, 114, 128;
    --bs-success-rgb: 113, 194, 4;
    --bs-info-rgb: 41, 91, 221;
    --bs-warning-rgb: 255, 177, 24;
    --bs-danger-rgb: 246, 80, 43;
    --bs-light-rgb: 245, 247, 251;
    --bs-dark-rgb: 37, 52, 106;
    --bs-primary-text-emphasis: #172047;
    --bs-secondary-text-emphasis: #374151;
    --bs-success-text-emphasis: #315700;
    --bs-info-text-emphasis: #172f82;
    --bs-warning-text-emphasis: #6f4700;
    --bs-danger-text-emphasis: #92250f;
    --bs-primary-bg-subtle: #e5e8f4;
    --bs-secondary-bg-subtle: #f1f3f6;
    --bs-success-bg-subtle: #edf9df;
    --bs-info-bg-subtle: #e8eeff;
    --bs-warning-bg-subtle: #fff4d8;
    --bs-danger-bg-subtle: #ffe7df;
    --bs-primary-border-subtle: #bac3e2;
    --bs-secondary-border-subtle: #d4d8df;
    --bs-success-border-subtle: #d0eda9;
    --bs-info-border-subtle: #b7c7ff;
    --bs-warning-border-subtle: #ffd782;
    --bs-danger-border-subtle: #ffb8a7;
    --bs-body-color: var(--brand-ink);
    --bs-body-color-rgb: 23, 32, 51;
    --bs-body-bg: #ffffff;
    --bs-secondary-color: rgba(23, 32, 51, 0.72);
    --bs-secondary-bg: var(--brand-surface);
    --bs-tertiary-color: rgba(23, 32, 51, 0.54);
    --bs-tertiary-bg: var(--brand-surface-soft);
    --bs-heading-color: var(--brand-navy);
    --bs-link-color: var(--brand-blue);
    --bs-link-color-rgb: 41, 91, 221;
    --bs-link-hover-color: var(--brand-navy);
    --bs-link-hover-color-rgb: 37, 52, 106;
    --bs-border-color: var(--brand-line);
    --bs-focus-ring-color: rgba(41, 91, 221, 0.25);
    --bs-form-valid-color: #4f8903;
    --bs-form-valid-border-color: var(--brand-green);
    --bs-form-invalid-color: var(--brand-red);
    --bs-form-invalid-border-color: var(--brand-red);
    --bs-border-radius: 0rem;
    --bs-border-radius-sm: 0rem;
    --bs-border-radius-lg: 0rem;
    --bs-border-radius-xl: 0rem;
    --bs-border-radius-xxl: 0rem;
    --bs-border-radius-2xl: 0rem;
    --bs-border-radius-pill: 0rem;
}

.bg-primary {
    background-color: var(--brand-navy) !important;
}

.bg-success {
    background-color: var(--brand-green) !important;
}

.bg-info {
    background-color: var(--brand-blue) !important;
}

.bg-warning {
    background-color: var(--brand-yellow) !important;
}

.bg-danger {
    background-color: var(--brand-red) !important;
}

.text-primary,
.link-primary {
    color: var(--brand-blue) !important;
}

.border-primary {
    border-color: var(--brand-blue) !important;
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-blue);
    --bs-btn-border-color: var(--brand-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-navy);
    --bs-btn-hover-border-color: var(--brand-navy);
    --bs-btn-focus-shadow-rgb: 41, 91, 221;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-navy);
    --bs-btn-active-border-color: var(--brand-navy);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-blue);
    --bs-btn-disabled-border-color: var(--brand-blue);
}

.btn-outline-primary {
    --bs-btn-color: var(--brand-blue);
    --bs-btn-border-color: var(--brand-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-blue);
    --bs-btn-hover-border-color: var(--brand-blue);
    --bs-btn-focus-shadow-rgb: 41, 91, 221;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-navy);
    --bs-btn-active-border-color: var(--brand-navy);
    --bs-btn-disabled-color: var(--brand-blue);
}

.btn-success {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-green);
    --bs-btn-border-color: var(--brand-green);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #62aa02;
    --bs-btn-hover-border-color: #62aa02;
    --bs-btn-focus-shadow-rgb: 113, 194, 4;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #62aa02;
    --bs-btn-active-border-color: #62aa02;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-green);
    --bs-btn-disabled-border-color: var(--brand-green);
    color: #fff !important;
}

.btn-info {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-blue);
    --bs-btn-border-color: var(--brand-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-navy);
    --bs-btn-hover-border-color: var(--brand-navy);
}

.btn-warning {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-yellow);
    --bs-btn-border-color: var(--brand-yellow);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #e9a00f;
    --bs-btn-hover-border-color: #e9a00f;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #e9a00f;
    --bs-btn-active-border-color: #e9a00f;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-yellow);
    --bs-btn-disabled-border-color: var(--brand-yellow);
    color: #fff !important;
}

.btn-danger {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-red);
    --bs-btn-border-color: var(--brand-red);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #d94220;
    --bs-btn-hover-border-color: #d94220;
}

.alert-primary,
.alert-info {
    background-color: var(--brand-blue);
}

.alert-success {
    background-color: var(--brand-green);
}

.table-success {
    --bs-table-color: #fff;
    color: #fff !important;
}

.table-success i,
.table-success .bi,
.table-success svg,
.table-success .text-primary,
.table-success .text-secondary,
.table-success .text-success,
.table-success .text-info,
.table-success .text-warning,
.table-success .text-danger,
.table-success .text-dark,
.table-success .text-body,
.table-success .text-muted,
.table-success .link-primary {
    color: currentColor !important;
}

.alert-warning {
    background-color: var(--brand-yellow);
}

.table-warning {
    --bs-table-color: #fff;
    color: #fff !important;
}

.table-warning i,
.table-warning .bi,
.table-warning svg,
.table-warning .text-primary,
.table-warning .text-secondary,
.table-warning .text-success,
.table-warning .text-info,
.table-warning .text-warning,
.table-warning .text-danger,
.table-warning .text-dark,
.table-warning .text-body,
.table-warning .text-muted,
.table-warning .link-primary {
    color: currentColor !important;
}

.alert-danger {
    background-color: var(--brand-red);
}

.badge.bg-primary,
.text-bg-primary {
    background-color: var(--brand-navy) !important;
}

.badge.bg-info,
.text-bg-info {
    background-color: var(--brand-blue) !important;
}

.badge.bg-success,
.text-bg-success {
    background-color: var(--brand-green) !important;
}

.badge.bg-warning,
.text-bg-warning {
    background-color: var(--brand-yellow) !important;
}

.badge.bg-danger,
.text-bg-danger {
    background-color: var(--brand-red) !important;
}

.badge.bg-primary,
.badge.bg-secondary,
.badge.bg-success,
.badge.bg-info,
.badge.bg-warning,
.badge.bg-danger,
.badge.bg-dark,
.badge.text-bg-primary,
.badge.text-bg-secondary,
.badge.text-bg-success,
.badge.text-bg-info,
.badge.text-bg-warning,
.badge.text-bg-danger,
.badge.text-bg-dark {
    color: #fff !important;
}

.badge.bg-primary i,
.badge.bg-primary .bi,
.badge.bg-secondary i,
.badge.bg-secondary .bi,
.badge.bg-success i,
.badge.bg-success .bi,
.badge.bg-info i,
.badge.bg-info .bi,
.badge.bg-warning i,
.badge.bg-warning .bi,
.badge.bg-danger i,
.badge.bg-danger .bi,
.badge.bg-dark i,
.badge.bg-dark .bi,
.badge.text-bg-primary i,
.badge.text-bg-primary .bi,
.badge.text-bg-secondary i,
.badge.text-bg-secondary .bi,
.badge.text-bg-success i,
.badge.text-bg-success .bi,
.badge.text-bg-info i,
.badge.text-bg-info .bi,
.badge.text-bg-warning i,
.badge.text-bg-warning .bi,
.badge.text-bg-danger i,
.badge.text-bg-danger .bi,
.badge.text-bg-dark i,
.badge.text-bg-dark .bi {
    color: currentColor !important;
}

.bg-success,
.text-bg-success,
.btn-success,
.alert-success,
.progress-bar.bg-success {
    color: #fff !important;
}

.bg-warning,
.text-bg-warning,
.btn-warning,
.alert-warning,
.progress-bar.bg-warning {
    color: #fff !important;
}

.bg-success i,
.bg-success .bi,
.bg-success svg,
.bg-success .text-primary,
.bg-success .text-secondary,
.bg-success .text-success,
.bg-success .text-info,
.bg-success .text-warning,
.bg-success .text-danger,
.bg-success .text-dark,
.bg-success .text-body,
.bg-success .text-muted,
.bg-success .link-primary,
.text-bg-success i,
.text-bg-success .bi,
.text-bg-success svg,
.text-bg-success .text-primary,
.text-bg-success .text-secondary,
.text-bg-success .text-success,
.text-bg-success .text-info,
.text-bg-success .text-warning,
.text-bg-success .text-danger,
.text-bg-success .text-dark,
.text-bg-success .text-body,
.text-bg-success .text-muted,
.text-bg-success .link-primary,
.btn-success i,
.btn-success .bi,
.btn-success svg,
.btn-success .text-primary,
.btn-success .text-secondary,
.btn-success .text-success,
.btn-success .text-info,
.btn-success .text-warning,
.btn-success .text-danger,
.btn-success .text-dark,
.btn-success .text-body,
.btn-success .text-muted,
.btn-success .link-primary,
.alert-success i,
.alert-success .bi,
.alert-success svg,
.alert-success .text-primary,
.alert-success .text-secondary,
.alert-success .text-success,
.alert-success .text-info,
.alert-success .text-warning,
.alert-success .text-danger,
.alert-success .text-dark,
.alert-success .text-body,
.alert-success .text-muted,
.alert-success .link-primary,
.progress-bar.bg-success i,
.progress-bar.bg-success .bi,
.progress-bar.bg-success svg {
    color: currentColor !important;
}

.bg-warning i,
.bg-warning .bi,
.bg-warning svg,
.bg-warning .text-primary,
.bg-warning .text-secondary,
.bg-warning .text-success,
.bg-warning .text-info,
.bg-warning .text-warning,
.bg-warning .text-danger,
.bg-warning .text-dark,
.bg-warning .text-body,
.bg-warning .text-muted,
.bg-warning .link-primary,
.text-bg-warning i,
.text-bg-warning .bi,
.text-bg-warning svg,
.text-bg-warning .text-primary,
.text-bg-warning .text-secondary,
.text-bg-warning .text-success,
.text-bg-warning .text-info,
.text-bg-warning .text-warning,
.text-bg-warning .text-danger,
.text-bg-warning .text-dark,
.text-bg-warning .text-body,
.text-bg-warning .text-muted,
.text-bg-warning .link-primary,
.btn-warning i,
.btn-warning .bi,
.btn-warning svg,
.btn-warning .text-primary,
.btn-warning .text-secondary,
.btn-warning .text-success,
.btn-warning .text-info,
.btn-warning .text-warning,
.btn-warning .text-danger,
.btn-warning .text-dark,
.btn-warning .text-body,
.btn-warning .text-muted,
.btn-warning .link-primary,
.alert-warning i,
.alert-warning .bi,
.alert-warning svg,
.alert-warning .text-primary,
.alert-warning .text-secondary,
.alert-warning .text-success,
.alert-warning .text-info,
.alert-warning .text-warning,
.alert-warning .text-danger,
.alert-warning .text-dark,
.alert-warning .text-body,
.alert-warning .text-muted,
.alert-warning .link-primary,
.progress-bar.bg-warning i,
.progress-bar.bg-warning .bi,
.progress-bar.bg-warning svg {
    color: currentColor !important;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: var(--brand-blue);
    box-shadow: 0 0 0 0.18rem rgba(41, 91, 221, 0.14) !important;
}

.form-check-input:checked {
    background-color: var(--brand-blue);
    border-color: var(--brand-blue);
}

button,
input,
select,
textarea,
.btn,
.card,
.modal-content,
.dropdown-menu,
.alert,
.badge,
.list-group-item,
.nav-link,
.navbar,
.pagination .page-link,
.form-control,
.form-select,
.form-check-input,
.input-group-text,
.accordion-item,
.accordion-button,
.offcanvas,
.popover,
.tooltip,
[class*="rounded"],
[class*="card"],
[class*="btn"],
[class*="badge"],
[class*="modal"],
[class*="input"],
[class*="field"],
[class*="select"],
[class*="note"],
[class*="panel"],
[class*="toolbar"],
[class*="topbar"],
[class*="sidebar"],
[class*="launcher"],
[class*="summary"],
[class*="wrap"],
[class*="box"] {
    border-radius: 0 !important;
}

.login-page {
    --login-red: #F6502B;
    --login-navy: #25346A;
    --login-blue: #295BDD;
    --login-yellow: #FFB118;
    --login-green: #71C204;
    --login-ink: #172033;
    --login-muted: #5e6a84;
    --login-line: #d8deeb;
    --login-surface: #f5f7fb;
    min-height: 100vh;
    margin: 0;
    background: var(--login-surface);
    color: var(--login-ink);
}

.login-shell {
    position: relative;
    min-height: 100svh;
    display: grid;
    place-items: center;
    padding: clamp(1.25rem, 4vw, 4.5rem);
    background:
        linear-gradient(135deg, rgba(41, 91, 221, 0.12), transparent 42%),
        linear-gradient(180deg, #ffffff 0%, #eef2fb 100%);
}

.login-shell::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 7px;
    background: linear-gradient(90deg, var(--login-red) 0 20%, var(--login-navy) 20% 40%, var(--login-blue) 40% 60%, var(--login-yellow) 60% 80%, var(--login-green) 80% 100%);
}

.login-panel {
    display: grid;
    gap: 1.25rem;
    place-items: center;
    width: min(100%, 380px);
    transform: translateY(-1.25rem);
}

.login-card {
    width: 100%;
    padding: 2.55rem 2rem;
    border: 1px solid var(--login-line);
    background: #fff;
    box-shadow: 0 24px 60px rgba(37, 52, 106, 0.12);
}

.login-card .card-body {
    padding: 0;
}

.login-logo-top {
    display: grid;
    place-items: center;
}

.login-heading {
    display: grid;
    gap: 0.25rem;
    margin-bottom: 1.5rem;
    text-align: center;
}

.login-brand-logo {
    width: auto;
    max-width: 220px;
    height: 48px;
}

.login-heading h1 {
    margin: 0;
    color: var(--login-navy);
    font-size: 1.7rem;
    font-weight: 800;
    letter-spacing: 0;
}

.login-heading p {
    margin: 0;
    color: var(--login-muted);
    font-size: 0.92rem;
}

.login-form {
    display: grid;
    gap: 1rem;
}

.login-field {
    display: grid;
    gap: 0.4rem;
}

.login-field .form-label {
    margin: 0;
    color: var(--login-navy);
    font-size: 0.82rem;
    font-weight: 800;
}

.login-control {
    min-height: 3.1rem;
    border-color: #ccd4e5;
    background: #fff;
    border-radius: var(--bs-border-radius) !important;
    font-size: 0.95rem;
}

.login-control:focus {
    border-color: var(--login-blue);
    box-shadow: 0 0 0 0.18rem rgba(41, 91, 221, 0.14) !important;
}

.login-control.is-invalid {
    border-color: var(--login-red);
    background-image: none;
}

.login-control.is-invalid:focus {
    border-color: var(--login-red);
    box-shadow: 0 0 0 0.18rem rgba(246, 80, 43, 0.14) !important;
}

.login-alert {
    display: grid;
    gap: 0.18rem;
    margin-bottom: 1.25rem;
    border: 1px solid rgba(246, 80, 43, 0.34);
    background: rgba(246, 80, 43, 0.08);
    color: #92250f;
    font-size: 0.86rem;
    border-radius: var(--bs-border-radius) !important;
}

.login-alert strong,
.login-alert span {
    display: block;
}

.alert-warning.login-alert {
    border-color: rgba(255, 177, 24, 0.42);
    background: rgba(255, 177, 24, 0.12);
    color: #6f4700 !important;
}

.login-submit {
    min-height: 3.1rem;
    margin-top: 0.25rem;
    background: var(--login-blue);
    border-color: var(--login-blue);
    border-radius: var(--bs-border-radius) !important;
    font-weight: 800;
}

.login-submit:hover,
.login-submit:focus {
    background: var(--login-navy);
    border-color: var(--login-navy);
}

.login-note {
    margin: 0.25rem 0 0;
    padding: 0.65rem 0.85rem;
    border-left: 3px solid var(--login-blue);
    background: rgba(45, 91, 215, 0.06);
    border-radius: 6px;
    color: var(--login-muted);
    font-size: 0.82rem;
    line-height: 1.4;
    text-align: center;
}

@media (max-width: 520px) {
    .login-card {
        padding: 1.5rem;
    }
}
