@font-face {
    font-display: swap;
    font-family: 'Oxanium';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/oxanium-v21-latin_latin-ext-regular.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Oxanium';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/oxanium-v21-latin_latin-ext-500.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Oxanium';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/oxanium-v21-latin_latin-ext-600.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Oxanium';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/oxanium-v21-latin_latin-ext-700.woff2') format('woff2');
}

@font-face {
    font-display: swap;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/montserrat-v31-latin_latin-ext-regular.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/montserrat-v31-latin_latin-ext-500.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/montserrat-v31-latin_latin-ext-600.woff2') format('woff2');
}
@font-face {
    font-display: swap;
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/montserrat-v31-latin_latin-ext-700.woff2') format('woff2');
}

:root {
    --brand-blue: #244277;
    --brand-blue-dark: #1a325c;
    --brand-blue-light: #5B72AC;
    --brand-blue-pale: #E6EFFF;
    --brand-orange: #FF9428;
    --brand-black: #000000;
    --page-bg: #F8F9FA;
    --font-display: 'Oxanium', 'Segoe UI', system-ui, sans-serif;
    --font-body: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
}

body {
    font-family: var(--font-body);
    color: var(--brand-black);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--brand-blue);
}

body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) {
    background-color: var(--page-bg);
}

.site-header {
    background: var(--page-bg);
    border-bottom: 1px solid var(--brand-blue-pale);
}

body[class*="plugin-cmsclient"] .site-header,
body[class*="-bg"] .site-header {
    background: #FFFFFF;
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.site-header .navbar {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.site-header .navbar-brand {
    padding: 0;
    margin-right: 2.5rem;
}

.site-header .navbar-brand img {
    display: block;
    width: auto;
}

.site-header .navbar-nav .nav-link {
    color: var(--brand-black);
    font-family: var(--font-body);
    font-weight: 500;
    padding: 0.5rem 1rem;
    transition: color 0.15s ease;
}

.site-header .navbar-nav .nav-link:hover,
.site-header .navbar-nav .nav-link:focus {
    color: var(--brand-blue);
}


.site-header .navbar-nav .nav-item.active > .nav-link {
    color: var(--brand-blue);
    position: relative;
}

.site-header .navbar-nav .nav-item.active > .nav-link::after {
    content: '';
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 0;
    height: 3px;
    background: var(--brand-orange);
    border-radius: 2px;
}


.site-header .dropdown-menu {
    border: 1px solid var(--brand-blue-pale);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(36, 66, 119, 0.12);
    padding: 0.5rem 0;
    margin-top: 0.25rem;
}

.site-header .dropdown-item {
    color: var(--brand-black);
    font-family: var(--font-body);
    padding: 0.5rem 1.25rem;
}

.site-header .dropdown-item:hover,
.site-header .dropdown-item:focus {
    background: var(--brand-blue-pale);
    color: var(--brand-blue);
}


.site-header .navbar-toggler {
    border: 1px solid var(--brand-blue-pale);
    padding: 0.4rem 0.6rem;
}

.site-header .navbar-toggler:focus {
    box-shadow: 0 0 0 0.2rem rgba(36, 66, 119, 0.15);
}


.site-header .header,
.site-header .nav-content {
    background: transparent !important;
}

.title {
    display: none;
}

.title-styled-when-enabled,
.title:not(.d-none).title-show {
    display: block;
    background: var(--brand-blue-pale);
    color: var(--brand-blue);
    border-bottom: 1px solid rgba(36, 66, 119, 0.08);
}

.title h3,
.title h2,
.title h1 {
    color: var(--brand-blue);
    font-family: var(--font-display);
}

.btn-primary,
.btn.btn-primary {
    background-color: var(--brand-blue);
    border-color: var(--brand-blue);
    color: #ffffff;
    font-family: var(--font-body);
    font-weight: 600;
    position: relative;
    transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.05s ease;
}

.btn-primary:hover,
.btn-primary:focus,
.btn.btn-primary:hover,
.btn.btn-primary:focus {
    background-color: var(--brand-blue-dark);
    border-color: var(--brand-blue-dark);
    color: #ffffff;
}

.btn-primary::after,
.btn.btn-primary::after {
    content: '';
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 0.35rem;
    height: 2px;
    background: var(--brand-orange);
    border-radius: 1px;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.btn-primary:hover::after,
.btn-primary:focus::after,
.btn.btn-primary:hover::after,
.btn.btn-primary:focus::after {
    opacity: 1;
}

.btn-primary:active,
.btn.btn-primary:active {
    transform: translateY(1px);
}

.btn-secondary,
.btn-outline-primary {
    background-color: transparent;
    border-color: var(--brand-blue);
    color: var(--brand-blue);
    font-family: var(--font-body);
    font-weight: 500;
}

.btn-secondary:hover,
.btn-outline-primary:hover {
    background-color: var(--brand-blue-pale);
    border-color: var(--brand-blue);
    color: var(--brand-blue);
}

.btn-info,
.btn.btn-info {
    background-color: var(--brand-blue);
    border-color: var(--brand-blue);
    color: #ffffff;
}

.btn-info:hover,
.btn.btn-info:hover {
    background-color: var(--brand-blue-dark);
    border-color: var(--brand-blue-dark);
    color: #ffffff;
}

.container-md a:not(.nav-link):not(.dropdown-item):not(.btn):not(.navbar-brand),
.card a:not(.btn),
.panel a:not(.btn),
main a:not(.btn) {
    color: var(--brand-blue);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.container-md a:not(.nav-link):not(.dropdown-item):not(.btn):not(.navbar-brand):hover,
.card a:not(.btn):hover,
.panel a:not(.btn):hover,
main a:not(.btn):hover {
    color: var(--brand-blue);
    border-bottom-color: var(--brand-orange);
}

.form-control:focus,
.form-select:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
textarea:focus,
select:focus {
    border-color: var(--brand-blue);
    box-shadow: 0 0 0 0.2rem rgba(36, 66, 119, 0.15);
    outline: none;
}

.form-control,
.form-select {
    font-family: var(--font-body);
    border-color: var(--brand-blue-pale);
}

label,
.form-label {
    font-family: var(--font-body);
    font-weight: 500;
    color: var(--brand-black);
}

body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .card {
    border: 1px solid var(--brand-blue-pale);
    border-radius: 8px;
    background-color: #ffffff;
}

body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .card-header,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .panel-heading {
    background-color: #ffffff;
    border-bottom: 1px solid var(--brand-blue-pale);
    color: var(--brand-blue);
    font-family: var(--font-display);
    font-weight: 600;
    padding: 1rem 1.25rem;
}

body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .card-header h1,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .card-header h2,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .card-header h3,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .card-header h4,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .card-header h5,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .panel-heading h1,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .panel-heading h2,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .panel-heading h3,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .panel-heading h4,
body:not([class*="plugin-cmsclient"]):not([class*="-bg"]) .panel-heading h5 {
    margin: 0;
    color: var(--brand-blue);
}

.alert-info {
    background-color: var(--brand-blue-pale);
    border-color: var(--brand-blue-pale);
    color: var(--brand-blue);
}

hr {
    border: none;
    border-top: 1px solid var(--brand-blue-pale);
    margin: 2rem 0;
}

body[class*="plugin-cmsclient"] .row.footer hr,
body[class*="-bg"] .row.footer hr {
    display: none;
}

.table {
    font-family: var(--font-body);
}

.table thead th {
    background-color: #ffffff;
    color: var(--brand-blue);
    border-bottom: 2px solid var(--brand-blue-pale);
    font-family: var(--font-display);
    font-weight: 600;
}

.table tbody tr:hover {
    background-color: var(--brand-blue-pale);
}

.badge-primary,
.badge.badge-primary,
.bg-primary {
    background-color: var(--brand-blue) !important;
    color: #ffffff;
}

.badge-info,
.badge.badge-info {
    background-color: var(--brand-blue);
    color: #ffffff;
}

.page-link {
    color: var(--brand-blue);
    border-color: var(--brand-blue-pale);
}

.page-item.active .page-link {
    background-color: var(--brand-blue);
    border-color: var(--brand-blue);
    color: #ffffff;
}

.page-link:hover {
    background-color: var(--brand-blue-pale);
    color: var(--brand-blue);
}
body[class*="plugin-order"] .card:not(.package),
body[class*="plugin-order"] .card:not(.package) p {
    color: #1a2640 !important;
}

body[class*="plugin-order"] .card:not(.package) h1,
body[class*="plugin-order"] .card:not(.package) h2,
body[class*="plugin-order"] .card:not(.package) h3,
body[class*="plugin-order"] .card:not(.package) h4,
body[class*="plugin-order"] .card:not(.package) h5,
body[class*="plugin-order"] .card:not(.package) h6,
body[class*="plugin-order"] .card:not(.package) label {
    color: var(--brand-blue) !important;
}

body[class*="plugin-order"] .card:not(.package) hr {
    border-color: rgba(91, 114, 172, 0.25) !important;
}

body[class*="plugin-order"] .card input[type="text"]:not(#package-config input),
body[class*="plugin-order"] .card input[type="email"]:not(#package-config input),
body[class*="plugin-order"] .card input[type="password"]:not(#package-config input),
body[class*="plugin-order"] .card select:not(#package-config select) {
    border: 1px solid var(--brand-blue-light) !important;
    box-shadow: none !important;
}

body[class*="plugin-order"] .card input[type="text"]:not(#package-config input):focus,
body[class*="plugin-order"] .card input[type="email"]:not(#package-config input):focus,
body[class*="plugin-order"] .card input[type="password"]:not(#package-config input):focus,
body[class*="plugin-order"] .card select:not(#package-config select):focus {
    border-color: var(--brand-blue) !important;
    box-shadow: 0 0 0 3px rgba(36, 66, 119, 0.25) !important;
}

#stripe-cc-form {
    background: #F4F7FD !important;
    border: 1px solid var(--brand-blue-pale) !important;
    border-radius: 8px !important;
    padding: 1.25rem !important;
}

#stripe-cc-form label {
    color: var(--brand-blue) !important;
}

#stripe-cc-form .StripeElement {
    display: block !important;
    background: #FFFFFF !important;
    border: 1px solid var(--brand-blue-light) !important;
    border-radius: 6px !important;
    padding: 0.6rem 0.75rem !important;
    height: auto !important;
    min-height: 0 !important;
    box-shadow: none !important;
}

#stripe-cc-form .StripeElement--focus {
    border-color: var(--brand-blue) !important;
    box-shadow: 0 0 0 3px rgba(36, 66, 119, 0.25) !important;
}

#stripe-cc-form .StripeElement--invalid {
    border-color: #dc3545 !important;
}