html[data-mok-theme="dark"] {
  color-scheme: dark;
  --bs-body-color: #e5edf2;
  --bs-body-color-rgb: 229, 237, 242;
  --bs-body-bg: #101820;
  --bs-body-bg-rgb: 16, 24, 32;
  --bs-emphasis-color: #f5f8fa;
  --bs-secondary-color: #b5c1ca;
  --bs-secondary-bg: #1b2731;
  --bs-tertiary-color: #9eacb7;
  --bs-tertiary-bg: #23313d;
  --bs-border-color: #3a4a57;
  --bs-link-color: #64d5f5;
  --bs-link-hover-color: #a2eaff;
  --bs-code-color: #f28ab2;
}

html[data-mok-theme="dark"] body,
html[data-mok-theme="dark"] #container {
  background-color: #101820;
  color: #e5edf2;
}

html[data-mok-theme="dark"] h1,
html[data-mok-theme="dark"] h2,
html[data-mok-theme="dark"] h3,
html[data-mok-theme="dark"] h4,
html[data-mok-theme="dark"] h5,
html[data-mok-theme="dark"] h6,
html[data-mok-theme="dark"] label,
html[data-mok-theme="dark"] .form-label {
  color: #f0f5f8;
}

html[data-mok-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item) {
  color: #72d9f6;
}

html[data-mok-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):hover {
  color: #b1edff;
}

html[data-mok-theme="dark"] .mk-cart-summary-actions-x22 .mk-cart-premium-link-x22 {
  background: #173744;
  border-color: #356274;
  color: #dff8ff !important;
}

html[data-mok-theme="dark"] .mk-cart-summary-actions-x22 .mk-cart-premium-link-x22:hover {
  background: #214b5c;
  color: #ffffff !important;
}

html[data-mok-theme="dark"] .mk-cart-empty-x22 .mk-cart-premium-link-x22 {
  background: #173744;
  border-color: #356274;
  color: #dff8ff !important;
}

html[data-mok-theme="dark"] .mk-cart-empty-x22 .mk-cart-premium-link-x22:hover {
  background: #214b5c;
  color: #ffffff !important;
}

html[data-mok-theme="dark"] #top,
html[data-mok-theme="dark"] header,
html[data-mok-theme="dark"] nav:not(.navbar),
html[data-mok-theme="dark"] footer,
html[data-mok-theme="dark"] .mk-product-section-block-p88,
html[data-mok-theme="dark"] .mk-product-option-section-p88,
html[data-mok-theme="dark"] .premium-addon-grid-item .card,
html[data-mok-theme="dark"] .product-thumb,
html[data-mok-theme="dark"] .product-list .product-thumb,
html[data-mok-theme="dark"] .card,
html[data-mok-theme="dark"] .toast,
html[data-mok-theme="dark"] .toast-popup,
html[data-mok-theme="dark"] .modal-content,
html[data-mok-theme="dark"] .dropdown-menu,
html[data-mok-theme="dark"] .list-group-item,
html[data-mok-theme="dark"] .popover,
html[data-mok-theme="dark"] .tooltip-inner,
html[data-mok-theme="dark"] .offcanvas,
html[data-mok-theme="dark"] .accordion-item,
html[data-mok-theme="dark"] .tab-content {
  background-color: #1b2731;
  color: #e5edf2;
  border-color: #3a4a57;
}

html[data-mok-theme="dark"] .dropdown-item,
html[data-mok-theme="dark"] .modal-header,
html[data-mok-theme="dark"] .modal-footer,
html[data-mok-theme="dark"] .card-header,
html[data-mok-theme="dark"] .card-footer,
html[data-mok-theme="dark"] .accordion-button {
  background-color: #23313d;
  color: #e5edf2;
  border-color: #3a4a57;
}

html[data-mok-theme="dark"] .dropdown-item:hover,
html[data-mok-theme="dark"] .dropdown-item:focus,
html[data-mok-theme="dark"] .list-group-item-action:hover,
html[data-mok-theme="dark"] .accordion-button:not(.collapsed) {
  background-color: #2d3e4b;
  color: #ffffff;
}

html[data-mok-theme="dark"] .form-control,
html[data-mok-theme="dark"] .form-select,
html[data-mok-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
html[data-mok-theme="dark"] textarea,
html[data-mok-theme="dark"] select {
  background-color: #111c25;
  color: #edf4f7;
  border-color: #50616e;
}

html[data-mok-theme="dark"] .form-control::placeholder,
html[data-mok-theme="dark"] input::placeholder,
html[data-mok-theme="dark"] textarea::placeholder {
  color: #a5b3bd;
  opacity: 1;
}

html[data-mok-theme="dark"] select option {
  background-color: #1b2731;
  color: #e5edf2;
}

html[data-mok-theme="dark"] .table,
html[data-mok-theme="dark"] .table > :not(caption) > * > *,
html[data-mok-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > *,
html[data-mok-theme="dark"] .table-hover > tbody > tr:hover > * {
  color: #e5edf2;
  border-color: #3a4a57;
  background-color: #1b2731;
}

html[data-mok-theme="dark"] .table thead th,
html[data-mok-theme="dark"] .table-light,
html[data-mok-theme="dark"] .bg-light,
html[data-mok-theme="dark"] .bg-white {
  --bs-table-bg: #23313d;
  background-color: #23313d !important;
  color: #edf4f7 !important;
}

html[data-mok-theme="dark"] .text-dark,
html[data-mok-theme="dark"] .text-body,
html[data-mok-theme="dark"] .text-muted,
html[data-mok-theme="dark"] .small.text-muted {
  color: #b5c1ca !important;
}

html[data-mok-theme="dark"] .border,
html[data-mok-theme="dark"] .border-top,
html[data-mok-theme="dark"] .border-bottom,
html[data-mok-theme="dark"] hr {
  border-color: #3a4a57 !important;
}

html[data-mok-theme="dark"] .btn-outline-secondary,
html[data-mok-theme="dark"] [data-mok-theme-toggle],
html[data-mok-theme="dark"] .mk-auth-theme-toggle {
  color: #edf4f7;
  border-color: #71828e;
  background-color: #1b2731;
}

html[data-mok-theme="dark"] .seller-addon-success {
  background-color: #163b2a;
  border-color: #2a6846;
  color: #d8f5e4;
}

.mok-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 10px;
  min-width: 6px;
  padding-inline: 0;
  color: #263746;
}

.mok-theme-icon {
  color: #263746;
  font-family: Arial, sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1;
}

html[data-mok-theme="dark"] .mok-theme-icon {
  color: #ffe08a;
}

html[data-mok-theme="dark"] .btn-outline-secondary:hover,
html[data-mok-theme="dark"] [data-mok-theme-toggle]:hover,
html[data-mok-theme="dark"] .mk-auth-theme-toggle:hover {
  color: #101820;
  background-color: #d3e1e8;
  border-color: #d3e1e8;
}

.mok-theme-toggle:hover .mok-theme-icon,
html[data-mok-theme="dark"] .mok-theme-toggle:hover .mok-theme-icon {
  color: inherit;
}

html[data-mok-theme="dark"] .alert-light,
html[data-mok-theme="dark"] .alert-secondary,
html[data-mok-theme="dark"] .bg-secondary-subtle {
  background-color: #23313d;
  color: #e5edf2;
  border-color: #3a4a57;
}

html[data-mok-theme="dark"] .autocomplete-items,
html[data-mok-theme="dark"] .search-results,
html[data-mok-theme="dark"] .search-result,
html[data-mok-theme="dark"] .search-suggestion,
html[data-mok-theme="dark"] .ocsearch-result,
html[data-mok-theme="dark"] .ajax-search-result,
html[data-mok-theme="dark"] .tt-menu,
html[data-mok-theme="dark"] .tt-suggestion,
html[data-mok-theme="dark"] #ps-live-search,
html[data-mok-theme="dark"] #ps-live-search .ps-live-search-subheader,
html[data-mok-theme="dark"] #ps-live-search .ps-live-search-header,
html[data-mok-theme="dark"] #ps-live-search .ps-live-search-item,
html[data-mok-theme="dark"] #ps-live-search .ps-live-search-more,
html[data-mok-theme="dark"] #search .dropdown-menu {
  background-color: #1b2731;
  color: #e5edf2;
  border-color: #3a4a57;
}

html[data-mok-theme="dark"] .autocomplete-items > *,
html[data-mok-theme="dark"] .search-results > *,
html[data-mok-theme="dark"] .search-result > *,
html[data-mok-theme="dark"] .search-suggestion > *,
html[data-mok-theme="dark"] .tt-suggestion {
  color: #e5edf2;
  border-color: #3a4a57;
}

html[data-mok-theme="dark"] #ps-live-search .ps-live-search-subheader {
  color: #b5c1ca;
  border-color: #3a4a57;
}

html[data-mok-theme="dark"] #mok-popup-box,
html[data-mok-theme="dark"] .toast,
html[data-mok-theme="dark"] .toast-popup,
html[data-mok-theme="dark"] .premium-addon-section,
html[data-mok-theme="dark"] .mk-product-cart-box-p88,
html[data-mok-theme="dark"] .mk-product-rich-content-p88 {
  color: #e5edf2;
}

html[data-mok-theme="dark"] #mok-popup-overlay,
html[data-mok-theme="dark"] .modal-backdrop,
html[data-mok-theme="dark"] .offcanvas-backdrop {
  background-color: rgba(0, 0, 0, 0.72);
}

html[data-mok-theme="dark"] img,
html[data-mok-theme="dark"] video,
html[data-mok-theme="dark"] canvas {
  filter: none;
}

@media (max-width: 767.98px) {
  html[data-mok-theme="dark"] [data-mok-theme-toggle] {
    min-height: 34px;
    padding-inline: 8px;
  }
}
