html[data-theme="dark"] {
  --dm-bg: #0f1720;
  --dm-band: #151f2a;
  --dm-surface: #18222f;
  --dm-surface-2: #202c3b;
  --dm-border: #2a3646;
  --dm-field-border: #3d4c5f;
  --dm-heading: #eef2f7;
  --dm-text: #bcc6d1;
  --dm-muted: #8a95a3;

  color-scheme: dark;

  --body-bg-color: var(--dm-bg);
  --body-text-color: var(--dm-text);
  --headings-color: var(--dm-heading);
  --body-headings-color: var(--dm-heading);

  --border-color: var(--dm-border);
  --border-focus-color: var(--dm-field-border);

  --color-light: var(--dm-band);

  --gray-100: var(--dm-band);
  --gray-theme: var(--dm-band);
  --gray-theme-hover: var(--dm-surface-2);
  --white-theme: var(--dm-surface);

  --mainnav-text-color: var(--dm-heading);
  --mainnav-link-color: var(--dm-heading);

  --t4-body-bg: var(--dm-bg);
  --t4-body-bg-rgb: 15, 23, 32;
  --t4-body-color: var(--dm-text);
  --t4-body-color-rgb: 188, 198, 209;
  --t4-emphasis-color: var(--dm-heading);
  --t4-emphasis-color-rgb: 238, 242, 247;
  --t4-heading-color: var(--dm-heading);
  --t4-secondary-color: var(--dm-muted);
  --t4-secondary-bg: var(--dm-surface-2);
  --t4-tertiary-color: var(--dm-muted);
  --t4-tertiary-bg: var(--dm-band);
  --t4-border-color: var(--dm-border);
  --t4-border-color-translucent: rgba(255, 255, 255, 0.15);
  --t4-light: var(--dm-band);
  --t4-light-rgb: 21, 31, 42;
  --t4-table-bg: transparent;
  --t4-table-striped-bg: rgba(255, 255, 255, 0.04);
  --t4-table-hover-bg: rgba(255, 255, 255, 0.06);
  --t4-table-color: var(--dm-text);
  --t4-table-border-color: var(--dm-border);
  --t4-card-bg: var(--dm-surface);
  --t4-card-border-color: var(--dm-border);
  --t4-dropdown-bg: var(--dm-surface-2);
  --t4-dropdown-link-color: var(--dm-text);
  --t4-dropdown-border-color: var(--dm-border);
  --t4-modal-bg: var(--dm-surface);
  --t4-list-group-bg: var(--dm-surface);
  --t4-pagination-bg: var(--dm-band);
  --t4-accordion-bg: var(--dm-surface);
  --t4-accordion-btn-color: var(--dm-heading);
}

html[data-theme="dark"] body.theme-gym {
  --body-bg-color: #000000;
  --body-text-color: rgba(255, 255, 255, 0.6);
  --headings-color: #ffffff;
  --body-headings-color: #ffffff;
  --border-color: rgba(255, 255, 255, 0.1);
  --border-focus-color: rgba(255, 255, 255, 0.2);
  --color-light: rgba(255, 255, 255, 0.1);
  --color-dark: rgba(255, 255, 255, 0.5);
  --gray-100: rgba(255, 255, 255, 0.1);
  --gray-theme: rgba(255, 255, 255, 0.1);
  --gray-theme-hover: rgba(255, 255, 255, 0.2);
  --white-theme: rgba(255, 255, 255, 0.1);
  --mainnav-text-color: #ffffff;
  --mainnav-link-color: #ffffff;
}

html[data-theme="dark"] body.theme-food {
  --gray-100: var(--dm-band);
}

html[data-theme="dark"] body {
  background-color: var(--body-bg-color);
  color: var(--body-text-color);
}

html[data-theme="dark"] .t4-header .header-block.header-default {
  box-shadow: none;
  border-bottom: 1px solid var(--dm-border);
}

html[data-theme="dark"] body.theme-gym .t4-header .header-block.header-default {
  border-bottom: 0;
}

html[data-theme="dark"] .not-at-top #t4-header.t4-sticky {
  background-color: var(--dm-bg);
}

.t4-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--mainnav-link-color, currentColor);
  cursor: pointer;
  line-height: 1;
  flex: 0 0 auto;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.t4-theme-toggle:hover,
.t4-theme-toggle:focus-visible {
  background: var(--gray-100, rgba(127, 140, 160, 0.15));
  color: var(--mainnav-link-hover-color, currentColor);
}

body.error-page .t4-theme-toggle,
body.offline .t4-theme-toggle {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 10;
}

.t4-theme-toggle svg {
  width: 20px;
  height: 20px;
}

.t4-theme-toggle .t4-theme-toggle__sun { display: none; }
.t4-theme-toggle .t4-theme-toggle__moon { display: block; }
html[data-theme="dark"] .t4-theme-toggle .t4-theme-toggle__sun { display: block; }
html[data-theme="dark"] .t4-theme-toggle .t4-theme-toggle__moon { display: none; }

html[data-theme="dark"] .t4-megamenu .dropdown-toggle .item-caret::before {
  border-top-color: var(--mainnav-link-color);
}

html[data-theme="dark"] .nav-breakpoint-xs .t4-megamenu {
  background: var(--dm-surface);
}
@media (max-width: 575.98px) {
  html[data-theme="dark"] .nav-breakpoint-sm .t4-megamenu { background: var(--dm-surface); }
}
@media (max-width: 767.98px) {
  html[data-theme="dark"] .nav-breakpoint-md .t4-megamenu { background: var(--dm-surface); }
}
@media (max-width: 991.98px) {
  html[data-theme="dark"] .nav-breakpoint-lg .t4-megamenu { background: var(--dm-surface); }
}
@media (max-width: 1199.98px) {
  html[data-theme="dark"] .nav-breakpoint-xl .t4-megamenu { background: var(--dm-surface); }
}
@media (max-width: 1399.98px) {
  html[data-theme="dark"] .nav-breakpoint-xxl .t4-megamenu { background: var(--dm-surface); }
}

html[data-theme="dark"] .t4-megamenu .t4-module .nav li.nav-item a:hover,
html[data-theme="dark"] .t4-megamenu .mega-col-module .nav li.nav-item a:hover {
  background-color: var(--dm-surface-2);
  color: var(--mainnav-link-hover-color);
}

html[data-theme="dark"] .t4-megamenu .mega-nav .nav-header,
html[data-theme="dark"] .t4-megamenu .mega-col-nav .nav-header.nav-link {
  color: var(--headings-color);
}

html[data-theme="dark"] .t4-offcanvas,
html[data-theme="dark"] .t4-off-canvas-body,
html[data-theme="dark"] .t4-off-canvas-header {
  background-color: var(--dm-surface);
  color: var(--body-text-color);
}

html[data-theme="dark"] .t4-off-canvas-header .close span,
html[data-theme="dark"] .t4-off-canvas-header .close {
  color: var(--headings-color);
}

html[data-theme="dark"] .t4-off-canvas-header .close:hover {
  background-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .t4-off-canvas-body .dropdown-menu,
html[data-theme="dark"] .t4-off-canvas-body .drilldown-effect .sub-menu-back {
  background-color: var(--dm-surface);
  border-color: var(--dm-border);
}

html[data-theme="dark"] .pagenav li a {
  background-color: var(--dm-band);
  color: var(--body-text-color);
}

html[data-theme="dark"] .pagenav li a:hover,
html[data-theme="dark"] .pagenav li a:focus {
  background-color: var(--dm-surface-2);
  color: var(--headings-color);
}

html[data-theme="dark"] .pagenav li span:before {
  color: var(--body-text-color);
}

html[data-theme="dark"] .nav-tabs .nav-link {
  color: var(--body-text-color);
}

html[data-theme="dark"] .nav-tabs .nav-link:hover {
  background-color: var(--dm-surface-2);
}

html[data-theme="dark"] .nav-tabs .nav-link.active {
  background-color: var(--dm-surface-2);
  color: var(--headings-color);
  border-color: var(--dm-border);
}

html[data-theme="dark"] .acm-features.style-1 .item-inner > .item-content {
  background-color: var(--dm-surface);
}

html[data-theme="dark"] .mod-article-highlight .item-highlight .article-content {
  background-color: var(--dm-surface);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

html[data-theme="dark"] .acm-testimonial.style-2 .testimonial-item-wrap {
  background-color: var(--dm-surface);
  border-color: var(--dm-border);
}

html[data-theme="dark"] .list-course.style-1 .item,
html[data-theme="dark"] .course-detail .course-sidebar {
  border: 1px solid var(--dm-border);
}

html[data-theme="dark"] .t4-banner {
  background-color: var(--dm-band);
}

html[data-theme="dark"] .bg-gray .section-title-wrap .section-title span {
  background-color: var(--dm-surface);
  color: var(--headings-color);
}

html[data-theme="dark"] body.theme-default .hero-content .sub-title > span {
  background-color: var(--white-theme);
}

html[data-theme="dark"] body.theme-food .hero-content .sub-title > span {
  background-color: transparent;
}

html[data-theme="dark"] .acm-hero.style-2 .acm-action .btn i {
  background-color: var(--gray-100);
}

html[data-theme="dark"] .link-dark {
  color: var(--dm-heading) !important;
}

html[data-theme="dark"] .btn.btn-light {
  background-color: var(--dm-band);
  border-color: var(--dm-field-border);
  color: var(--dm-heading);
}

html[data-theme="dark"] .text-light {
  color: var(--dm-heading) !important;
}

html[data-theme="dark"] mark,
html[data-theme="dark"] .mark {
  color: #212529;
}

html[data-theme="dark"] .btn.btn-outline-dark {
  color: var(--dm-heading);
  border-color: var(--dm-field-border);
}

html[data-theme="dark"] .btn.btn-outline-dark:hover,
html[data-theme="dark"] .btn.btn-outline-dark:focus,
html[data-theme="dark"] .btn.btn-outline-dark:active {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-field-border);
  color: var(--dm-heading);
}

html[data-theme="dark"] .bg-light.text-dark,
html[data-theme="dark"] .badge.bg-light.text-dark,
html[data-theme="dark"] .bg-light .text-dark {
  color: var(--dm-heading) !important;
}

html[data-theme="dark"] .card.bg-light,
html[data-theme="dark"] .card.bg-light .card-text {
  color: var(--dm-text);
}

html[data-theme="dark"] .card.bg-light .card-title,
html[data-theme="dark"] .card.bg-light .card-header {
  color: var(--dm-heading);
}

html[data-theme="dark"] .categories-module > li,
html[data-theme="dark"] .icons .dropdown-menu a,
html[data-theme="dark"] .items-extrafields .course-info,
html[data-theme="dark"] .course-detail .course-sidebar ul li .left,
html[data-theme="dark"] .course-detail .course-sidebar ul li .right,
html[data-theme="dark"] .contact legend,
html[data-theme="dark"] #search-result-empty,
html[data-theme="dark"] #guru-module-courses .item-inner .gru-course-meta ul li,
html[data-theme="dark"] div#guru-component .gru-course-item .uk-panel-box .gru-course-meta ul,
html[data-theme="dark"] div#guru-component .gru-course-item .uk-panel-box .gru-course-meta ul li,
html[data-theme="dark"] div#guru-component .gru-course-detail #guru_tabs ul.uk-tab li a {
  color: var(--dm-text);
}

html[data-theme="dark"] .testimonial-block:after {
  background-color: var(--dm-border);
}

html[data-theme="dark"] .blog-list .item-meta span::after {
  background-color: var(--dm-border);
}

html[data-theme="dark"] .article-info dd:after,
html[data-theme="dark"] .t4-footer-nav .footer-info small:after,
html[data-theme="dark"] .breadcrumb .divider:before {
  color: var(--dm-muted);
}

html[data-theme="dark"] .registration fieldset::before {
  background-color: var(--dm-border);
}

html[data-theme="dark"] #guru_tabs ul.uk-tab li.uk-active a:after {
  border-top-color: var(--dm-surface-2);
}

html[data-theme="dark"] .owl-dots .owl-dot {
  background-color: var(--dm-surface-2);
}

html[data-theme="dark"] .social-list li a {
  background-color: var(--dm-band);
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="url"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-field-border);
  color: var(--dm-text);
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus,
html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-field-border);
  color: var(--dm-text);
}

html[data-theme="dark"] ::placeholder {
  color: var(--dm-muted);
  opacity: 1;
}

html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus,
html[data-theme="dark"] textarea:-webkit-autofill {
  -webkit-text-fill-color: var(--dm-text);
  -webkit-box-shadow: 0 0 0 1000px var(--dm-surface-2) inset;
  box-shadow: 0 0 0 1000px var(--dm-surface-2) inset;
  caret-color: var(--dm-text);
}

html[data-theme="dark"] .btn.btn-outline-light:hover,
html[data-theme="dark"] .btn.btn-outline-light:focus {
  color: var(--dm-heading);
}

html[data-theme="dark"] .btn.btn-outline-light {
  border-color: var(--dm-field-border);
  color: var(--dm-text);
}

html[data-theme="dark"] .choices__inner,
html[data-theme="dark"] .choices__list--dropdown,
html[data-theme="dark"] .choices[data-type*="select-one"] .choices__input {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-field-border);
  color: var(--dm-text);
}

html[data-theme="dark"] .choices__list--dropdown .choices__item--selectable.is-highlighted {
  background-color: var(--dm-border);
  color: var(--dm-heading);
}

html[data-theme="dark"] .choices__list--multiple .choices__item {
  background-color: var(--dm-border);
  border-color: var(--dm-field-border);
  color: var(--dm-heading);
}

html[data-theme="dark"] .field-media-preview {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-border);
}

html[data-theme="dark"] .switcher .toggle-outside {
  background: var(--dm-field-border);
  border-color: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .t4-header .form-search .form-control,
html[data-theme="dark"] .t4-header .form-search .search-query,
html[data-theme="dark"] .t4-offcanvas .form-search .form-control,
html[data-theme="dark"] .t4-offcanvas .form-search .search-query {

  background-color: transparent;
  background-image: url("../images/icon/search-light.png");
  background-repeat: no-repeat;
  background-position: right 10px center;
  border-color: var(--dm-field-border);
  color: var(--dm-text);
}

html[data-theme="dark"] .t4-header .form-search .search-query:focus,
html[data-theme="dark"] .t4-offcanvas .form-search .search-query:focus,
html[data-theme="dark"] .t4-header .form-search .form-control:focus,
html[data-theme="dark"] .t4-offcanvas .form-search .form-control:focus {
  border-color: var(--dm-field-border);
  box-shadow: none;
}

html[data-theme="dark"] .contact .contact-links ul.nav li a:hover,
html[data-theme="dark"] .contact .contact-links ul.nav li a:focus,
html[data-theme="dark"] .contact .contact-links ul.nav li a:active {
  color: var(--headings-color);
}

html[data-theme="dark"] .acm-hero.style-2 {
  background-color: var(--dm-bg);
  background-blend-mode: multiply;
}

html[data-theme="dark"] body.theme-food .bg-gray:before {
  background-image: url("../images/decor/wave-1-dark.svg");
}

html[data-theme="dark"] body.theme-food .t4-footer:before {
  background-image: url("../images/decor/ft-wave-1-dark.svg");
}

html[data-theme="dark"] body.theme-food .section-border-top:before,
html[data-theme="dark"] body.theme-food .section-border-bottom:before,
html[data-theme="dark"] body.theme-food .mod-article-highlight .item-child .item-inner + .item-inner:before {
  background-image: none;
  background-color: var(--border-color);
  -webkit-mask-image: url("../images/decor/horizontal-food.png");
          mask-image: url("../images/decor/horizontal-food.png");
  -webkit-mask-repeat: repeat-x;
          mask-repeat: repeat-x;
}

html[data-theme="dark"] body.theme-food .mod-article-highlight .row > div + div:before,
html[data-theme="dark"] .acm-features.style-4 .row > div + div:before {
  background-image: none;
  background-color: var(--border-color);
  -webkit-mask-image: url("../images/decor/vertical-food.png");
          mask-image: url("../images/decor/vertical-food.png");
  -webkit-mask-repeat: repeat-y;
          mask-repeat: repeat-y;
}

html[data-theme="dark"] body:not(.theme-food) .bg-gray {
  background-image: url("../images/decor/vertical-line-light.png");
}

html[data-theme="dark"] pre {
  background-color: var(--dm-surface-2);
  color: var(--dm-text);
  border-color: var(--dm-border);
}

html[data-theme="dark"] hr {
  border-color: var(--dm-border);
  opacity: 1;
}

html[data-theme="dark"] .text-bg-light {
  background-color: var(--dm-band) !important;
  color: var(--dm-heading) !important;
}

html[data-theme="dark"] #back-to-top {
  background-color: rgba(255, 255, 255, 0.4);
}

html[data-theme="dark"] .author-block .author-socials a {
  background: rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] .author-block .author-socials a:hover,
html[data-theme="dark"] .author-block .author-socials a:focus,
html[data-theme="dark"] .author-block .author-socials a:active {
  background: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .acm-features.style-2 .intro-img.decor-1:before,
html[data-theme="dark"] .acm-features.style-2 .intro-img.decor-2:before,
html[data-theme="dark"] .acm-features.style-2 .intro-img.decor-3:before {
  filter: invert(1);
}

html[data-theme="dark"] body.error-page,
html[data-theme="dark"] body.t4-error-page,
html[data-theme="dark"] body.offline {
  background-color: var(--dm-bg);
  color: var(--dm-text);
}

html[data-theme="dark"] body.error-page h1,
html[data-theme="dark"] body.error-page h2,
html[data-theme="dark"] body.error-page .error-title,
html[data-theme="dark"] body.t4-error-page h1,
html[data-theme="dark"] body.offline h1,
html[data-theme="dark"] body.offline .outline {
  color: var(--dm-heading);
}

html[data-theme="dark"] body.error-page .error-message,
html[data-theme="dark"] body.t4-error-page .error-message,
html[data-theme="dark"] body.offline p {
  color: var(--dm-text);
}

html[data-theme="dark"] body.error-page .error-desc,
html[data-theme="dark"] body.error-page .error-code,
html[data-theme="dark"] body.error-page .error-desc span,
html[data-theme="dark"] body.error-page .error-other-info {
  color: var(--dm-text);
}

html[data-theme="dark"] body.error-page .page-redirect a {
  background-color: var(--dm-heading);
  color: var(--dm-bg);
}

html[data-theme="dark"] body.t4-error-page .cta-wrap a {
  background-color: var(--dm-surface-2);
  color: var(--dm-heading);
}

html[data-theme="dark"] body.t4-error-page .cta-wrap a:hover {
  background-color: var(--dm-border);
  color: var(--dm-heading);
}

html[data-theme="dark"] body.error-page .error-page-wrap {
  background-color: transparent;
}

html[data-theme="dark"] body.offline .form-wrap,
html[data-theme="dark"] body.offline .form-wrap .offline-header {
  background-color: var(--dm-surface);
  border-color: var(--dm-border);
}

html[data-theme="dark"] body.offline .form-wrap .offline-header .logo-icon {
  background-color: var(--dm-surface);
  border-color: var(--dm-border);
}

html[data-theme="dark"] body.offline .form-wrap h1 {
  color: var(--dm-heading);
}

html[data-theme="dark"] body.offline .form-wrap .offline-message {
  color: var(--dm-text);
}

html[data-theme="dark"] .form-wrap #form-login #form-login-username label,
html[data-theme="dark"] .form-wrap #form-login #form-login-password label,
html[data-theme="dark"] .form-wrap #form-login #form-login-secretkey label {
  color: var(--dm-text);
}

html[data-theme="dark"] .form-wrap #form-login #form-login-username input,
html[data-theme="dark"] .form-wrap #form-login #form-login-password input,
html[data-theme="dark"] .form-wrap #form-login #form-login-secretkey input {
  background: var(--dm-surface-2);
  border-color: var(--dm-field-border);
  color: var(--dm-text);
}

html[data-theme="dark"] .form-wrap #form-login #form-login-username input:hover,
html[data-theme="dark"] .form-wrap #form-login #form-login-username input:focus,
html[data-theme="dark"] .form-wrap #form-login #form-login-password input:hover,
html[data-theme="dark"] .form-wrap #form-login #form-login-password input:focus,
html[data-theme="dark"] .form-wrap #form-login #form-login-secretkey input:hover,
html[data-theme="dark"] .form-wrap #form-login #form-login-secretkey input:focus {
  border-color: var(--dm-heading);
}

html[data-theme="dark"] .form-wrap #form-login input.button {
  background-color: var(--dm-surface-2);
  color: var(--dm-heading);
}

html[data-theme="dark"] .form-wrap #form-login input.button:hover,
html[data-theme="dark"] .form-wrap #form-login input.button:focus,
html[data-theme="dark"] .form-wrap #form-login input.button:active {
  background-color: var(--dm-border);
  color: var(--dm-heading);
}

html[data-theme="dark"] .table {
  --t4-table-color: var(--dm-heading);
  --t4-table-accent-bg: var(--dm-band);
  --t4-table-border-color: var(--dm-border);
  --t4-table-striped-color: var(--dm-heading);
  --t4-table-striped-bg: rgba(255, 255, 255, 0.05);
  --t4-table-active-color: var(--dm-heading);
  --t4-table-active-bg: rgba(255, 255, 255, 0.1);
  --t4-table-hover-color: var(--dm-heading);
  --t4-table-hover-bg: rgba(255, 255, 255, 0.075);
}

html[data-theme="dark"] #member-profile fieldset legend {
  border-bottom-color: var(--dm-border);
}

html[data-theme="dark"] .error-page-wrap .error-info {
  border-bottom-color: var(--dm-border);
}

html[data-theme="dark"] .img-thumbnail {
  background-color: var(--body-bg-color);
  border-color: var(--dm-border);
}

html[data-theme="dark"] .list-group {
  --t4-list-group-color: var(--dm-heading);
  --t4-list-group-bg: transparent;
  --t4-list-group-border-color: var(--dm-border);
  --t4-list-group-action-color: var(--dm-text);
  --t4-list-group-action-hover-color: var(--dm-text);
  --t4-list-group-action-hover-bg: var(--dm-surface);
  --t4-list-group-action-active-color: var(--dm-heading);
  --t4-list-group-action-active-bg: var(--dm-surface-2);
}

html[data-theme="dark"] div.com-users-remind,
html[data-theme="dark"] div.com-users-reset {
  background-color: var(--dm-surface);
}

html[data-theme="dark"] .com-tags-tag.tag-category .list-group .list-group-item a {
  color: var(--dm-heading);
}
html[data-theme="dark"] .com-tags-tag.tag-category .list-group .list-group-item a:hover,
html[data-theme="dark"] .com-tags-tag.tag-category .list-group .list-group-item a:focus,
html[data-theme="dark"] .com-tags-tag.tag-category .list-group .list-group-item a:active {
  color: var(--t4-link-color, #6ea8fe);
}
