:root {
--dn-side-nav-width: 230px;
--testimonial-stars: #C98218;
}

:root, [data-bs-theme="light"] {
--top-nav-color: #e1e4eb;
--top-nav-color-rgb: 225,228,235;
--top-nav-bg: #49b4b2;
--top-nav-bg-rgb: 73,180,178;
--top-nav-btn-bg: #5cbcba;
--top-nav-focus1: #6dc3c1;
--top-nav-focus2: #80cbca;
--top-nav-focus3: #92d2d1;
--bs-primary: #49b4b2;
--bs-primary-rgb: 73,180,178;
--bs-primary-focus1: #6dc3c1;
--bs-primary-focus2: #80cbca;
--bs-primary-focus3: #92d2d1;
--bs-primary-text-emphasis: #337e7d;
--bs-primary-bg-subtle: rgba(var(--bs-primary-rgb), 0.1);
--bs-primary-border-subtle: rgba(var(--bs-primary-rgb), 0.2);
--bs-link-color: #337e7d;
--bs-link-color-rgb: 51,126,125;
--bs-link-hover-color: #5c9897;
--bs-link-hover-color-rgb: 92,152,151;
--dn-tile-bg: #49b4b2;
--dn-tile-color: #e1e4eb;
--bs-secondary: #284860;
--bs-secondary-rgb: 40,72,96;
--bs-secondary-focus1: #536d80;
--bs-secondary-focus2: #697f90;
--bs-secondary-focus3: #7e91a0;
--bs-secondary-text-emphasis: #284860;
--bs-secondary-bg-subtle: rgba(var(--bs-secondary-rgb), 0.1);
--bs-secondary-border-subtle: rgba(var(--bs-secondary-rgb), 0.2);
--bs-accent: #284860;
--bs-accent-rgb: 40,72,96;
--bs-accent-focus1: #536d80;
--bs-accent-focus2: #697f90;
--bs-accent-focus3: #7e91a0;
--bs-accent-text-emphasis: #284860;
--bs-accent-bg-subtle: rgba(var(--bs-accent-rgb), 0.1);
--bs-accent-border-subtle: rgba(var(--bs-accent-rgb), 0.2);
}


.form-switch .form-check-input:not(:checked):focus,
input[type=range]:focus::-webkit-slider-thumb,
input[type=range]:active:focus::-webkit-slider-thumb {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='rgba(73,180,178, 0.25)'/></svg>") !important;
}
span.icon-circle {
    background-color: #49b4b2;
    color: #e1e4eb;
}

.btn-primary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary-focus1);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-primary-focus1);
    --bs-btn-hover-border-color: var(--bs-primary-focus2);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--bs-primary-focus2);
    --bs-btn-active-border-color: var(--bs-primary-focus3);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}
.btn-outline-primary {
    --bs-btn-color: var(--bs-primary-text-emphasis);
    --bs-btn-border-color: var(--bs-primary-text-emphasis);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-disabled-color: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}
.text-bg-primary {
    color: #ffffff !important;
}

.btn-secondary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary-focus1);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-secondary-focus1);
    --bs-btn-hover-border-color: var(--bs-secondary-focus2);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--bs-secondary-focus2);
    --bs-btn-active-border-color: var(--bs-secondary-focus3);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-disabled-bg: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}
.btn-outline-secondary {
    --bs-btn-color: var(--bs-secondary-text-emphasis);
    --bs-btn-border-color: var(--bs-secondary-text-emphasis);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-bg: var(--bs-secondary);
    --bs-btn-active-border-color: var(--bs-secondary);
    --bs-btn-disabled-color: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}
.text-bg-secondary {
    color: #ffffff !important;
}

.btn-accent {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--bs-accent);
    --bs-btn-border-color: var(--bs-accent-focus1);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-accent-focus1);
    --bs-btn-hover-border-color: var(--bs-accent-focus2);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--bs-accent-focus2);
    --bs-btn-active-border-color: var(--bs-accent-focus3);
    --bs-btn-focus-shadow-rgb: var(--bs-accent-rgb);
    --bs-btn-disabled-bg: var(--bs-accent);
    --bs-btn-disabled-border-color: var(--bs-accent);
}
.btn-outline-accent {
    --bs-btn-color: var(--bs-accent-text-emphasis);
    --bs-btn-border-color: var(--bs-accent-text-emphasis);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-accent);
    --bs-btn-hover-border-color: var(--bs-accent);
    --bs-btn-focus-shadow-rgb: var(--bs-accent-rgb);
    --bs-btn-active-bg: var(--bs-accent);
    --bs-btn-active-border-color: var(--bs-accent);
    --bs-btn-disabled-color: var(--bs-accent);
    --bs-btn-disabled-border-color: var(--bs-accent);
}
.text-bg-accent {
    color: #ffffff !important;
}
[data-bs-theme="dark"] {
--top-nav-color: #e1e4eb;
--top-nav-color-rgb: 225,228,235;
--top-nav-bg: #1f2937;
--top-nav-bg-rgb: 31,41,55;
--top-nav-btn-bg: #363f4c;
--top-nav-focus1: #4c545f;
--top-nav-focus2: #636a74;
--top-nav-focus3: #797f87;
--bs-primary: #3b82f6;
--bs-primary-rgb: 59,130,246;
--bs-primary-focus1: #629bf8;
--bs-primary-focus2: #76a8f9;
--bs-primary-focus3: #89b4fa;
--bs-primary-text-emphasis: #4589f7;
--bs-primary-bg-subtle: rgba(var(--bs-primary-rgb), 0.1);
--bs-primary-border-subtle: rgba(var(--bs-primary-rgb), 0.2);
--bs-link-color: #4589f7;
--bs-link-color-rgb: 69,137,247;
--bs-link-hover-color: #6aa1f9;
--bs-link-hover-color-rgb: 106,161,249;
--dn-tile-bg: #3b82f6;
--dn-tile-color: #e1e4eb;
--bs-secondary: #10b981;
--bs-secondary-rgb: 16,185,129;
--bs-secondary-focus1: #40c79a;
--bs-secondary-focus2: #58cfa7;
--bs-secondary-focus3: #70d5b3;
--bs-secondary-text-emphasis: #10b981;
--bs-secondary-bg-subtle: rgba(var(--bs-secondary-rgb), 0.1);
--bs-secondary-border-subtle: rgba(var(--bs-secondary-rgb), 0.2);
--bs-accent: #10b981;
--bs-accent-rgb: 16,185,129;
--bs-accent-focus1: #40c79a;
--bs-accent-focus2: #58cfa7;
--bs-accent-focus3: #70d5b3;
--bs-accent-text-emphasis: #10b981;
--bs-accent-bg-subtle: rgba(var(--bs-accent-rgb), 0.1);
--bs-accent-border-subtle: rgba(var(--bs-accent-rgb), 0.2);
}


[data-bs-theme="dark"] .form-switch .form-check-input:not(:checked):focus,
input[type=range]:focus::-webkit-slider-thumb,
input[type=range]:active:focus::-webkit-slider-thumb {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='rgba(59,130,246, 0.25)'/></svg>") !important;
}
[data-bs-theme="dark"] span.icon-circle {
    background-color: #3b82f6;
    color: #e1e4eb;
}

[data-bs-theme="dark"] .btn-primary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary-focus1);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-primary-focus1);
    --bs-btn-hover-border-color: var(--bs-primary-focus2);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--bs-primary-focus2);
    --bs-btn-active-border-color: var(--bs-primary-focus3);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}
[data-bs-theme="dark"] .btn-outline-primary {
    --bs-btn-color: var(--bs-primary-text-emphasis);
    --bs-btn-border-color: var(--bs-primary-text-emphasis);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-disabled-color: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}
[data-bs-theme="dark"] .text-bg-primary {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-secondary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary-focus1);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-secondary-focus1);
    --bs-btn-hover-border-color: var(--bs-secondary-focus2);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--bs-secondary-focus2);
    --bs-btn-active-border-color: var(--bs-secondary-focus3);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-disabled-bg: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}
[data-bs-theme="dark"] .btn-outline-secondary {
    --bs-btn-color: var(--bs-secondary-text-emphasis);
    --bs-btn-border-color: var(--bs-secondary-text-emphasis);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-bg: var(--bs-secondary);
    --bs-btn-active-border-color: var(--bs-secondary);
    --bs-btn-disabled-color: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}
[data-bs-theme="dark"] .text-bg-secondary {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-accent {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--bs-accent);
    --bs-btn-border-color: var(--bs-accent-focus1);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-accent-focus1);
    --bs-btn-hover-border-color: var(--bs-accent-focus2);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--bs-accent-focus2);
    --bs-btn-active-border-color: var(--bs-accent-focus3);
    --bs-btn-focus-shadow-rgb: var(--bs-accent-rgb);
    --bs-btn-disabled-bg: var(--bs-accent);
    --bs-btn-disabled-border-color: var(--bs-accent);
}
[data-bs-theme="dark"] .btn-outline-accent {
    --bs-btn-color: var(--bs-accent-text-emphasis);
    --bs-btn-border-color: var(--bs-accent-text-emphasis);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--bs-accent);
    --bs-btn-hover-border-color: var(--bs-accent);
    --bs-btn-focus-shadow-rgb: var(--bs-accent-rgb);
    --bs-btn-active-bg: var(--bs-accent);
    --bs-btn-active-border-color: var(--bs-accent);
    --bs-btn-disabled-color: var(--bs-accent);
    --bs-btn-disabled-border-color: var(--bs-accent);
}
[data-bs-theme="dark"] .text-bg-accent {
    color: #ffffff !important;
}

html, body {
        font-family: "Roboto",  sans-serif;
    }