
/* ===============================
CSS VARIABLES
================================ */
:root {
--primary: #f0f0f0;
--primary-10: #f0f0f01a;
--primary-20: #f0f0f033;
--primary-30: #f0f0f04d;

--secondary: #040a2c;

--white: #ffffff;
}

/* ===============================
BACKGROUNDS
================================ */
.btn--base::before,
.btn--base::after,
.btn--base.active:focus,
.btn--base.active:hover,
.slider-next,
.slider-prev,
.process-area::before,
.process-area-inner::before,
.faq-thumb .faq-video .video-icon,
.submit-btn,
*::-webkit-scrollbar-thumb,
.footer-social li:hover,
.preloader,
.bg--base,
.schedule-thumb .schedule-badge,
.blog-content .blog-date .date-icon,
::selection {
background-color: var(--primary) !important;
}

.btn--base.active::before,
.btn--base.active::after {
background-color: var(--white) !important;
}

/* ===============================
TEXT COLORS
================================ */
.text--base,
.section-header .section-title,
.custom-btn,
.statistics-icon,
.breadcrumb-item a,
.breadcrumb-item.active,
.blog-social-area .title,
.blog-social-area .blog-social li,
.contact-info-icon i {
color: var(--primary) !important;
}

.btn--base.active:focus,
.btn--base.active:hover,
.blog-social-area .blog-social li:hover {
color: var(--white) !important;
}

/* ===============================
BORDERS
================================ */
.section-header .title-border::before,
.section-header .title-border::after {
border: 1px solid var(--primary) !important;
}

.schedule-thumb .schedule-badge::before {
border-top-color: var(--primary);
}

.process-area::before,
.process-area::after,
.process-item .process-content .title::after,
.process-area-inner::before {
border: 6px solid var(--secondary) !important;
}

.blog-content .blog-date .date-icon {
border-bottom: 3px solid var(--primary-10) !important;
}

.footer-section {
border-top: 3px solid var(--primary-20) !important;
}

.blog-social-area .blog-social li {
border: 2px solid var(--primary-20) !important;
}

/* ===============================
PAGINATION
================================ */
.page,
.pagination .page-item.active .page-link,
.pagination .page-item:hover .page-link {
background: var(--primary) !important;
border-color: var(--primary) !important;
}

.pagination .page-item.disabled span {
background: var(--primary-30) !important;
border-color: var(--primary-30) !important;
}

/* ===============================
MISC
================================ */
.action-button,
#msform fieldset .radio-wrapper input[type="radio"]:checked + label::after {
background: var(--primary) !important;
}

.subject-item::after {
background-color: var(--primary-30);
}

.section--bg,
.footer-section,
.statistics-section,
.footer-bottom-area,
.account-form-area,
.page-container .sidebar-menu {
background-color: var(--secondary) !important;
}

.bg-overlay-white::before {
background-color: var(--secondary);
opacity: .83;
}