@property --contrast-color {
    syntax: "<color>";
    inherits: true;
    initial-value: #000000;
}

/*
root- (e.g., .btn-root, .color-root)
master- (e.g., .btn-master)
base- (e.g., .btn-base) — Note: This usually implies a stripped-down skeleton rather than something "more important," but it sits at the top of the inheritance chain.

brand- (e.g., .btn-brand or .bg-brand) — Specifically ties it to the company's core identity, leaving "primary" for the main UI color.
hero- (e.g., .btn-hero) — Perfect for giant, one-time call-to-action buttons (like on a landing page).
accent- (e.g., .btn-accent) — Used for high-contrast, eye-catching elements.
featured- (e.g., .card-featured)
*/

/*:root {
    --bs-link-color: var(--color-primary, var(--bs-primary));
    --bs-link-hover-color: color-mix(in srgb, var(--bs-link-color) 80%, black);
}*/

:root {
    --root-primary: var(--color-primary, var(--bs-primary));
    --root-primary-rgb: var(--color-primary-rgb, var(--bs-primary-rgb));
    --root-light: var(--color-light, var(--bs-light));
    --root-light-rgb: var(--color-light-rgb, var(--bs-light-rgb));
    --root-dark: var(--color-dark, var(--bs-dark));
    --root-dark-rgb: var(--color-dark-rgb, var(--bs-dark-rgb));
    /**/
    --bs-link-color: var(--root-primary);
    --bs-link-hover-color: color-mix(in srgb, var(--root-primary) 80%, black);
}



:is(.bg-dark, .bg-indigo) {
    --bs-body-color: #F4F2F4;
    --bs-link-color: #90C589;
    --bs-link-hover-color: #739E6E;
    --bs-border-color-translucent: rgba(207,237,209,.175);
}

.page-section:is(.bg-dark, .bg-indigo) {
    --section-color: #F4F2F4;
    --heading-color: var(--color-light);
    --sub-heading-color: var(--color-sage);
}

:is(.bg-dark, .bg-indigo) .card {
    --bs-card-color: #212529;
    --bs-card-border-width: 0;
    --bs-card-border-color: transparent;
    --bs-card-border-radius: 0.75rem;
    --bs-card-title-color: var(--color-primary);
}

:is(.bg-light, .bg-mint) {
    --bs-link-color: #6C37D3;
    --bs-link-hover-color: #562CA9;
    --bs-border-color-translucent: rgba(207,237,209,.175);
}

.page-section:is(.bg-light, .bg-mint) {
    --section-color: var(--bs-body-color);
    --heading-color: var(--color-dark);
    --sub-heading-color: var(--color-primary);
}

.page-section {
    --section-color: var(--bs-body-color);
    --heading-color: var(--color-primary);
    --sub-heading-color: var(--color-dark);
    color: var(--section-color);
}




/*
 *	Resets
==================================================== */

.dropdown-menu {
    --contrast-color: contrast-color(color-mix(in srgb, var(--root-primary) 95%, black));
    --bs-dropdown-link-active-color: var(--contrast-color);
    --bs-dropdown-link-active-bg: var(--root-primary);
}

.list-group {
    --contrast-color: contrast-color(color-mix(in srgb, var(--root-primary) 95%, black));
    --bs-list-group-active-color: var(--contrast-color);
    --bs-list-group-active-bg: var(--root-primary);
    --bs-list-group-active-border-color: var(--root-primary);
}

.nav-pills {
    --bs-nav-pills-link-active-bg: var(--root-primary);
}



/*
 *	Accordion
==================================================== */

.accordion {
    --bs-accordion-btn-focus-border-color: color-mix(in srgb, var(--root-primary) 50%, white);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgb(from var(--root-primary) r g b / 0.25);
    --bs-accordion-active-color: color-mix(in srgb, var(--root-primary) 90%, black);
    --bs-accordion-active-bg: color-mix(in srgb, var(--root-primary) 10%, white);
}

.accordion-button::after {
    background-color: var(--bs-accordion-btn-color);
    background-image: none;
    mask-composite: intersect;
    mask-image: var(--bs-accordion-btn-icon);
    mask-position: 0 0;
    mask-repeat: no-repeat;
    mask-size: var(--bs-accordion-btn-icon-width);
}

.accordion-button:not(.collapsed)::after {
    background-color: var(--bs-accordion-active-color);
    background-image: none;
}



/*
 *	Card
==================================================== */

.card {
    --bs-card-title-color: var(--root-dark);
}



/*
 *	Datepicker
==================================================== */

.litepicker {
    --litepicker-button-prev-month-color-hover: var(--root-primary);
    --litepicker-button-next-month-color-hover: var(--root-primary);
    --litepicker-is-start-color-bg: var(--root-primary);
    --litepicker-is-in-range-color: #eee;
    --litepicker-is-end-color-bg: var(--root-primary);
    --litepicker-day-color-hover: var(--root-primary);
    --litepicker-button-apply-color-bg: var(--root-primary);
    --litepicker-is-today-color: var(--root-primary);
}



/*
 *	Table
==================================================== */

.table-primary {
    --bs-table-color: #000;
    --bs-table-bg: color-mix(in srgb, var(--root-primary) 20%, white);
    --bs-table-border-color: color-mix(in srgb, var(--bs-table-bg) 90%, black);
    --bs-table-striped-bg: color-mix(in srgb, var(--bs-table-bg) 95%, black);
    --bs-table-striped-color: #000;
    --bs-table-active-bg: color-mix(in srgb, var(--bs-table-bg) 90%, black);
    --bs-table-active-color: #000;
    --bs-table-hover-bg: color-mix(in srgb, var(--bs-table-bg) 92.5%, black);
    --bs-table-hover-color: #000;
}



/*
 *	Dropdown Colors
==================================================== */

.dropdown-menu-primary {
    --base-color: var(--root-primary);
}

.dropdown-menu-light {
    --base-color: var(--root-light);
}

.dropdown-menu-dark {
    --base-color: var(--root-dark);
}

:is(.dropdown-menu-primary, .dropdown-menu-light, .dropdown-menu-dark) {
    --contrast-color: contrast-color(color-mix(in srgb, var(--base-color) 95%, black));
    --inverted-color: contrast-color(var(--contrast-color));
    /**/
    --bs-dropdown-bg: var(--base-color);
    --bs-dropdown-color: rgb(from var(--contrast-color) r g b / 0.75);
    --bs-dropdown-border-color: rgb(from var(--inverted-color) r g b / 0.15);
    --bs-dropdown-link-color: rgb(from var(--contrast-color) r g b / 0.75);
    --bs-dropdown-link-disabled-color: rgb(from var(--contrast-color) r g b / 0.5);
    --bs-dropdown-link-hover-bg: rgb(from var(--contrast-color) r g b / 0.15);
    --bs-dropdown-link-hover-color: var(--contrast-color);
    --bs-dropdown-link-active-bg: color-mix(in srgb, var(--base-color) 80%, black);
    --bs-dropdown-link-active-color: var(--contrast-color);
    --bs-dropdown-header-color: rgb(from var(--contrast-color) r g b / 0.5);
    --bs-dropdown-divider-bg: rgb(from var(--inverted-color) r g b / 0.15);
}



/*
 *	Alert
==================================================== */

.alert-primary {
    --base-color: var(--root-primary);
}

.alert-light {
    --base-color: var(--root-light);
}

.alert-dark {
    --base-color: var(--root-dark);
}

:is(.alert-primary, .alert-light, .alert-dark) {
    --bs-alert-color: color-mix(in srgb, var(--base-color) 60%, black);
    --bs-alert-bg: color-mix(in srgb, var(--base-color) 20%, white);
    --bs-alert-border-color: color-mix(in srgb, var(--base-color) 30%, white);
    --bs-alert-link-color: color-mix(in srgb, var(--base-color) 48%, black);
}

:is(.alert-primary, .alert-light, .alert-dark).alert-vivid {
    --contrast-color: contrast-color(color-mix(in srgb, var(--base-color) 95%, black));
    /**/
    --bs-alert-color: rgb(from var(--contrast-color) r g b / .85);
    --bs-alert-bg: var(--base-color);
    --bs-alert-border-color: var(--base-color);
    --bs-alert-link-color: var(--contrast-color);
}



/*
 *	Button
==================================================== */

.btn-primary, .btn-outline-primary {
    --base-color: var(--root-primary);
}

.btn-light, .btn-outline-light {
    --base-color: var(--root-light);
}

.btn-dark, .btn-outline-dark {
    --base-color: var(--root-dark);
}

:is(.btn-primary, .btn-light, .btn-dark) {
    --contrast-color: contrast-color(color-mix(in srgb, var(--base-color) 95%, black));
    --inverted-color: contrast-color(var(--contrast-color));
    --base-color-focus-shadow: color-mix(in srgb, var(--base-color) 85%, var(--contrast-color));
    /**/
    --bs-btn-color: var(--contrast-color);
    --bs-btn-bg: var(--base-color);
    --bs-btn-border-color: var(--base-color);
    --bs-btn-hover-color: var(--contrast-color);
    --bs-btn-hover-bg: color-mix(in srgb, var(--base-color) 85%, var(--inverted-color));
    --bs-btn-hover-border-color: color-mix(in srgb, var(--base-color) 80%, var(--inverted-color));
    --bs-btn-focus-shadow-rgb: rgb(from var(--base-color-focus-shadow) r g b / 1);
    --bs-btn-active-color: var(--contrast-color);
    --bs-btn-active-bg: color-mix(in srgb, var(--base-color) 80%, var(--inverted-color));
    --bs-btn-active-border-color: color-mix(in srgb, var(--base-color) 75%, var(--inverted-color));
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
    --bs-btn-disabled-color: var(--contrast-color);
    --bs-btn-disabled-bg: var(--base-color);
    --bs-btn-disabled-border-color: var(--base-color);
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgb(from var(--base-color-focus-shadow) r g b / .5);
}

:is(.btn-primary, .btn-light, .btn-dark).btn-elevate {
    box-shadow: 0 .25rem .5rem 0 rgb(from var(--base-color) r g b / .25);
}

:is(.btn-primary, .btn-light, .btn-dark).btn-elevate:is(:focus,:hover) {
    box-shadow: 0 .5rem 1rem -.125rem rgb(from var(--base-color) r g b / .5);
}

:is(.btn-outline-primary, .btn-outline-light, .btn-outline-dark) {
    --contrast-color: contrast-color(color-mix(in srgb, var(--base-color) 95%, black));
    /**/
    --bs-btn-color: var(--base-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--base-color);
    --bs-btn-hover-color: var(--contrast-color);
    --bs-btn-hover-bg: var(--base-color);
    --bs-btn-hover-border-color: var(--base-color);
    --bs-btn-focus-shadow-rgb: rgb(from var(--base-color) r g b / 1);
    --bs-btn-active-color: var(--contrast-color);
    --bs-btn-active-bg: var(--base-color);
    --bs-btn-active-border-color: var(--base-color);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
    --bs-btn-disabled-color: var(--base-color);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--base-color);
    --bs-gradient: none;
}

:is(.btn-outline-primary, .btn-outline-light, .btn-outline-dark).btn-elevate {
    box-shadow: 0 .25rem .5rem 0 rgb(from var(--base-color) r g b / .25);
}

:is(.btn-outline-primary, .btn-outline-light, .btn-outline-dark).btn-elevate:is(:focus,:hover) {
    box-shadow: 0 .5rem 1rem -.125rem rgb(from var(--base-color) r g b / .5);
}

.btn-outline-link {
    --contrast-color: contrast-color(color-mix(in srgb, var(--bs-link-color) 95%, black));
    --inverted-color: contrast-color(var(--contrast-color));
    /**/
    --bs-btn-color: var(--bs-link-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: var(--bs-link-hover-color);
    --bs-btn-hover-bg: rgb(from color-mix(in srgb, var(--bs-link-color) 85%, var(--inverted-color)) r g b / .1);
    --bs-btn-hover-border-color: var(--bs-btn-hover-color);
    --bs-btn-active-color: var(--bs-link-hover-color);
    --bs-btn-active-bg: rgb(from color-mix(in srgb, var(--bs-link-color) 80%, var(--inverted-color)) r g b / .1);
    --bs-btn-active-border-color: var(--bs-btn-active-color);
    --bs-btn-disabled-color: #6c757d;
    --bs-btn-disabled-border-color: transparent;
    --bs-btn-box-shadow: none;
    --bs-btn-focus-shadow-rgb: var(--color-primary-rgb, var(--bs-primary-rgb));
    text-decoration: underline;
}

.btn-outline-link:is(:focus,:hover) {
    text-decoration: none;
}



/*
 *	Pagination
==================================================== */

.pagination, .pagination-primary {
    --base-color: var(--root-primary);
}

.pagination-light {
    --base-color: var(--root-light);
}

.pagination-dark {
    --base-color: var(--root-dark);
}

:is(.pagination, .pagination-primary, .pagination-light, .pagination-dark) {
    --contrast-color: contrast-color(color-mix(in srgb, var(--base-color) 95%, black));
    --inverted-color: contrast-color(var(--contrast-color));
    /**/
    --bs-pagination-color: var(--base-color);
    --bs-pagination-hover-color: color-mix(in srgb, var(--base-color) 80%, var(--inverted-color));
    --bs-pagination-focus-color: color-mix(in srgb, var(--base-color) 80%, var(--inverted-color));
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgb(from var(--base-color) r g b / .25);
    --bs-pagination-active-color: var(--contrast-color);
    --bs-pagination-active-bg: var(--base-color);
    --bs-pagination-active-border-color: var(--base-color);
}



/*
 *	Toast
==================================================== */

.toast-primary {
    --base-color: var(--root-primary);
}

.toast-light {
    --base-color: var(--root-light);
}

.toast-dark {
    --base-color: var(--root-dark);
}

:is(.toast-primary, .toast-light, .toast-dark) {
    --contrast-color: contrast-color(color-mix(in srgb, var(--base-color) 95%, black));
    /**/
    --bs-toast-color: var(--contrast-color);
    --bs-toast-bg: rgb(from var(--base-color) r g b / .85);
    --bs-toast-header-color: var(--bs-toast-color);
    --bs-toast-header-bg: rgb(from contrast-color(var(--contrast-color)) r g b / .15);
    --bs-toast-header-border-color: rgb(from var(--contrast-color) r g b / .05);
}

@container style(--contrast-color: white) {

    .toast .btn-close:not(.btn-close-white) {
        filter: invert(1) grayscale(100%) brightness(200%);
    }
}

:is(.toast-primary, .toast-light, .toast-dark).soft {
    --base-bg: color-mix(in srgb, var(--base-color) 30%, white);
    /**/
    --bs-toast-color: var(--bs-dark);
    --bs-toast-bg: rgb(from var(--base-bg) r g b / .85);
    --bs-toast-header-color: var(--bs-toast-color);
    --bs-toast-header-bg: rgba(255, 255, 255, 0.85);
}



/*
 *	Popover
==================================================== */

.popover-primary {
    --base-color: var(--root-primary);
}

.popover-light {
    --base-color: var(--root-light);
}

.popover-dark {
    --base-color: var(--root-dark);
}

:is(.popover-primary, .popover-light, .popover-dark) {
    --contrast-color: contrast-color(color-mix(in srgb, var(--base-color) 95%, black));
    /**/
    --bs-popover-bg: color-mix(in srgb, var(--base-color) 20%, white);
    --bs-popover-border-color: color-mix(in srgb, var(--base-color) 30%, white);
    --bs-popover-header-bg: color-mix(in srgb, var(--base-color) 60%, black);
    --bs-popover-header-color: var(--contrast-color);
    --bs-popover-body-color: color-mix(in srgb, var(--base-color) 60%, black);
}



/*
 *	Utility
==================================================== */

:is(.bg-primary, .border-primary, .text-primary, .text-bg-primary, .link-primary) {
    --base-color: var(--root-primary);
}

:is(.bg-light, .border-light, .text-light, .text-bg-light, .link-light) {
    --base-color: var(--root-light);
}

:is(.bg-dark, .border-dark, .text-dark, .text-bg-dark, .link-dark) {
    --base-color: var(--root-dark);
}

:is(.bg-primary, .bg-light, .bg-dark) {
    background-color: rgb(from var(--base-color) r g b / var(--bs-bg-opacity, 1)) !important;
}

:is(.border-primary, .border-light, .border-dark) {
    border-color: rgb(from var(--base-color) r g b / var(--bs-border-opacity, 1)) !important;
}

:is(.text-primary, .text-light, .text-dark) {
    color: rgb(from var(--base-color) r g b / var(--bs-text-opacity, 1)) !important;
}

:is(.text-bg-primary, .text-bg-light, .text-bg-dark) {
    --contrast-color: contrast-color(color-mix(in srgb, var(--base-color) 95%, black));
    background-color: rgb(from var(--base-color) r g b / var(--bs-bg-opacity, 1)) !important;
    color: var(--contrast-color) !important;
}

:is(.link-primary, .link-light, .link-dark) {
    color: var(--base-color) !important;
}

:is(.link-primary, .link-light, .link-dark):is(:focus, :hover) {
    --link-hover-color: color-mix(in srgb, var(--base-color) 80%, black);
    color: var(--link-hover-color) !important;
}




/*
 *	Text/Title Colors
==================================================== */

.eyebrow-text {
    color: var(--root-primary);
}

.form-title {
    color: var(--root-dark);
}

/* .hero.css */
/*.content-dark {
    color: #212529;
}

.content-dark .heading {
    color: var(--color-indigo);
}

.content-dark .sub-heading {
    color: var(--color-purple);
}


.content-light {
    color: #fff;
}

.content-light .heading {
    color: var(--color-mint);
}

.content-light .sub-heading {
    color: var(--color-sage);
}*/



/*
 *	Block Heading
==================================================== */

.block-heading {
    --heading-border-color: var(--root-primary);
}



/*
 *	Tab Panel
==================================================== */

.tab-panel {
    --tab-panel-nav-tabs-link-hover-bg: var(--root-primary);
}

.tab-panel-dark {
    --tab-panel-nav-bg: var(--root-dark);
}

.tab-panel-dark > .nav-tabs {
    --bs-nav-tabs-link-active-color: var(--root-primary);
}



/*
 *	Hero
==================================================== */

/* .content ...*/

.hero {
    --hero-bg: var(--root-dark);
}

/*.hero-page .hero {
    --hero-bg-image: linear-gradient(rgb(from var(--root-dark) r g b / 0.65), transparent 95%);
}*/

.hero-page .hero::before {
    background-image: linear-gradient(rgb(from var(--root-dark) r g b / 0.65), transparent 95%);
}


/*.hero.go-dark .content {
    color: #fff;
}

.hero.go-dark .content .heading {
    color: var(--color-mint);
}

.hero.go-dark .content .sub-heading {
    color: var(--color-sage);
}*/


.hero-form {
    --hero-form-bg-rgb: var(--root-dark-rgb);
    --hero-form-title-color: var(--root-light);
}

/*.hero-form .btn[data-bs-slide]:not([type="submit"]) {
    --bs-btn-color: #FFFFFF;
    --bs-btn-bg: #6C37D3;
    --bs-btn-border-color: #6C37D3;
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: #5C2FB3;
    --bs-btn-hover-border-color: #562CA9;
    --bs-btn-focus-shadow-rgb: 130,85,218;
    --bs-btn-active-color: #FFFFFF;
    --bs-btn-active-bg: #562CA9;
    --bs-btn-active-border-color: #51299E;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
    --bs-btn-disabled-color: #FFFFFF;
    --bs-btn-disabled-bg: #6C37D3;
    --bs-btn-disabled-border-color: #6C37D3;
}*/



/*
 *	Blog
==================================================== */

.blog-archive {
    --contrast-color: contrast-color(color-mix(in srgb, var(--root-primary) 95%, black));
    /**/
    --blog-list-count-hover-color: color-mix(in srgb, var(--root-primary) 60%, black);
    --blog-list-count-hover-bg: rgba(var(--root-primary-rgb), .25);
    --blog-list-count-hover-border-color: rgba(var(--root-primary-rgb), .25);
    --blog-list-count-active-color: var(--contrast-color);
    --blog-list-count-active-bg: var(--root-primary);
    --blog-list-count-active-border-color: var(--root-primary);
}

.list-tags {
    --tag-link-active-bg: var(--root-primary);
}



/*
 *	Features
==================================================== */

.card.feature .card-img:has(.fa) {
    background-color: var(--root-dark);
}

:is(.features-1,.features-2) .feature {
    --card-title-color: var(--root-dark);
    --card-link-color: var(--root-primary);
}

:is(.features-1,.features-2) .feature:is(a):hover {
    --bs-card-bg: var(--root-dark);
    --bs-card-color: #fff;
    --bs-card-border-color: var(--root-dark);
    --card-title-color: var(--root-light);
    --card-link-color: color-mix(in oklch, var(--root-primary) 60%, white);
    box-shadow: 0 10px 20px rgba(var(--root-dark-rgb),.25);
}

:is(.features-3,.features-4) .feature {
    /*--card-bar-color: var(--ti-sage);*/
    --card-title-color: var(--root-dark);
}

:is(.features-3,.features-4) .feature:is(a):hover {
    /*--bs-card-border-color: var(--ti-sage);*/
    --card-title-color: var(--root-primary);
}

.features-3 .feature:is(a):hover .card-img {
    box-shadow: 0 10px 20px rgba(var(--root-dark-rgb),.25);
}

.features-6 .feature {
    --card-title-bg: var(--root-dark);
}

.features-6 .feature:is(a):hover {
    --card-title-color: var(--root-light);
}

.features-5 .feature:is(a):hover {
    --card-title-color: var(--root-primary);
}

:is(.features-5,.features-6) .feature .card-img,
.features-6 .feature .card-title {
    box-shadow: 0 .5rem 1.25rem -.25rem rgba(var(--root-dark-rgb),.25), 0 .25rem .5rem -.25rem rgba(var(--root-dark-rgb),.5);
}

:is(.features-5,.features-6) .feature:is(a):hover .card-img,
.features-6 .feature:is(a):hover .card-title {
    box-shadow: 0 .625rem 1.5rem rgba(var(--root-dark-rgb),.25), 0 .25rem .5rem -.25rem rgba(var(--root-dark-rgb),.5);
}

/*.bg-indigo .features-5 .feature {
    --card-title-color: var(--ti-sage);
}*/

.bg-indigo .features-6 .feature {
    --card-title-bg: var(--root-primary);
}

:is(.features-7,.features-8) .feature {
    /*--card-bar-color: var(--ti-sage);*/
    box-shadow: 0 .5rem 1.25rem -.25rem rgba(var(--root-dark-rgb),.15), 0 .25rem .5rem -.25rem rgba(var(--root-dark-rgb),.15);
}

.features-7 .feature {
    --bs-card-bg: var(--root-dark);
    --bs-card-color: #fff;
    --card-title-color: var(--root-light);
}

.features-8 .feature {
    /*--bs-card-border-color: var(--ti-sage);*/
    --card-title-color: var(--root-primary);
}

:is(.features-7,.features-8) .feature:is(a):hover {
    box-shadow: 0 .5rem 1.25rem -.25rem rgba(var(--root-dark-rgb),.25), 0 .25rem .5rem -.25rem rgba(var(--root-dark-rgb),.25);
}



/*
 *	Page - Tabbed Content
==================================================== */

[data-block="tabs"] .nav-tabs .nav-link {
    border-bottom: 3px solid rgba(var(--root-dark-rgb),.05);
}

[data-block="tabs"] .nav-tabs .nav-link:hover {
    border-color: rgba(var(--root-dark-rgb),.15);
}

[data-block="tabs"] .nav-tabs .nav-item.show .nav-link,
[data-block="tabs"] .nav-tabs .nav-link.active {
    border-color: var(--root-primary);
}



/*
 *	Site Header
==================================================== */

.site-header {
    --site-header-bg: var(--bs-white);
    /*background-color: var(--bs-white);
    box-shadow: 0 -1.5rem 1.5rem 2rem rgba(0,0,0,.25);
    position: relative;*/
}

.site-header .offcanvas {
    --bs-offcanvas-color: var(--root-dark);
    --bs-offcanvas-bg: var(--root-light);
    --bs-offcanvas-border-width: 0px;
    --bs-offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.site-header .navbar {
    border-bottom: 1px solid transparent;
}

.site-header .navbar-nav {
    --bs-nav-link-font-weight: 600;
}

.site-header .navbar-nav:not(:only-child) {
    --bs-navbar-nav-link-padding-y: .75rem;
}

.site-header .navbar .nav-link {
    font-family: var(--font-sans-serif-condensed);
    font-weight: 700;
    /*text-transform: uppercase;*/
}

.site-header .navbar .nav-link small {
    opacity: .75;
}

@media screen and (min-width: 576px) {

    .site-header .navbar-expand-sm .nav-link[aria-expanded="true"],
    .site-header .navbar-expand-sm .nav-link:hover {
        border-color: var(--root-light);
    }
}

@media screen and (min-width: 768px) {

    .site-header .navbar-expand-md .nav-link[aria-expanded="true"],
    .site-header .navbar-expand-md .nav-link:hover {
        border-color: var(--root-light);
    }
}

@media screen and (min-width: 992px) {

    .site-header .navbar-expand-lg .nav-link[aria-expanded="true"],
    .site-header .navbar-expand-lg .nav-link:hover {
        border-color: var(--root-light);
    }
}

@media screen and (min-width: 1200px) {

    .site-header .navbar-expand-xl .nav-link[aria-expanded="true"],
    .site-header .navbar-expand-xl .nav-link:hover {
        border-color: var(--root-light);
    }
}

@media screen and (min-width: 1400px) {

    .site-header .navbar-expand-xxl .nav-link[aria-expanded="true"],
    .site-header .navbar-expand-xxl .nav-link:hover {
        border-color: var(--root-light);
    }
}



/*
 *	Site Footer
==================================================== */

.site-footer {
    --site-footer-bg: var(--root-light);
    --site-footer-title-accent-color: var(--root-primary);
    --disclaimer-bg: rgba(var(--root-primary-rgb),.2);
    border-top-color: var(--root-primary);
}



/*
 *	Latest Posts
==================================================== */

.post-card .post-title {
    color: var(--root-dark);
}

.post-card .post-date {
    color: var(--root-primary);
}

.post-slider .post-link:hover .post-card,
.post-slider .post-link:focus .post-card {
    box-shadow: 0 0 0 .25rem rgba(var(--root-primary-rgb), .25);
}



/*
 *	Quote Section
==================================================== */

.quote-dialog .quote-icon {
    background-color: var(--root-primary);
}

@media(min-width: 768px) {

    .quote-dialog .blockquote::before,
    .quote-dialog .blockquote::after {
        color: var(--root-primary);
    }
}



/*
 *	Product Group Page
==================================================== */

.nav-plans .nav-link.active {
    background-color: var(--root-primary);
    border-color: var(--root-primary);
    color: #fff;
}

.plan-card .card-header {
    color: var(--root-dark);
}

.plan-card.active {
    box-shadow: 0 4px 16px rgba(var(--root-dark-rgb),.15);
}

.plan-card.active .card-header {
    color: var(--root-primary);
}

.plan-grid-title {
    color: var(--root-dark);
}

.plan-grid abbr {
    border-bottom: 0.5px dashed rgba(var(--root-primary-rgb),.5);
}

@media(min-width: 992px) {

    .plan-grid .nav-tabs .nav-link:focus,
    .plan-grid .nav-tabs .nav-link:hover {
        border-color: var(--root-primary);
    }

    .plan-grid .nav-tabs .nav-link:hover {
        background-color: var(--root-primary);
        color: #fff;
    }

    .plan-grid.bg-indigo .nav-tabs .nav-item.show .nav-link,
    .plan-grid.bg-indigo .nav-tabs .nav-link.active {
        color: var(--root-primary);
    }
}



/*
 *	Locale Links
==================================================== */

.locale-link {
    --locale-link-bg-rgb: var(--root-dark-rgb);
}



/*
 *	Masonry
==================================================== */

.masonry {
    --masonry-caption-bg: var(--root-dark);
}



/*
 *	CTA
==================================================== */

/*.cta {
    background-color: var(--color-dark);
    color: #04aaff;
    box-shadow: 0 15px 35px rgba(3,28,48,.25), 0 5px 15px rgba(0,0,0,.1);
    text-shadow: 0 1px rgba(0,0,0,.3);
}

.cta .btn-link {
    --bs-btn-color: #FFFFFF;
    --bs-btn-bg: #6C37D3;
    --bs-btn-border-color: #6C37D3;
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: #5C2FB3;
    --bs-btn-hover-border-color: #562CA9;
    --bs-btn-focus-shadow-rgb: 130,85,218;
    --bs-btn-active-color: #FFFFFF;
    --bs-btn-active-bg: #562CA9;
    --bs-btn-active-border-color: #51299E;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
    --bs-btn-disabled-color: #FFFFFF;
    --bs-btn-disabled-bg: #6C37D3;
    --bs-btn-disabled-border-color: #6C37D3;
}*/




.slick-dotted.slick-slider {
    margin-bottom: 30px !important;
}

.slick-prev::before,
.slick-next::before {
    color: var(--section-color, black) !important;
}

.slick-dots li button::before,
.slick-dots li.slick-active button::before {
    color: var(--section-color, black) !important;
}