/*
 * Dark mode: low-contrast gray text -> white.
 *
 * Applies ONLY when <body> has the "dark-mode" class (theme color: dark).
 * Only the `color` property changes: no backgrounds, borders, buttons,
 * sizes, fonts or spacing. Light mode is not affected.
 *
 * Every rule ends with :not(:where(...)) (zero specificity) so it does NOT apply to:
 *  - areas that keep a LIGHT background in dark mode, where white would be invisible
 *    (.bg-light, .bg-white, .navbar-light, POS category/brand filter, POS cart header,
 *    dashboard header, breadcrumb holder, alerts, badges, popovers, date/time pickers,
 *    virtual keyboard, "No results" box)
 *  - buttons (plain-text links of the action menus are text and do change)
 *  - disabled items (gray means "disabled")
 *  - hover / focus / active / selected states (they keep their own colors)
 * Placeholders are not touched (gray means "empty field").
 */

/* Base text color of the app (was #d0d2d6) */
body.dark-mode {
    color: #fff;
}

/* Light containers keep the color they inherited before (zero specificity:
   only replaces inheritance, never a color the element declares itself) */
:where(body.dark-mode) :where(.bg-light, .bg-white, .navbar-light, .filter-window, .dashboard-header, .breadcrumb-holder, .message-card, .datepicker, .daterangepicker, .ui-timepicker-wrapper, .ui-keyboard, .ui-autocomplete) {
    color: #d0d2d6;
}

/* Gray texts: style.default.css, custom-default.css, bootstrap, POS */
body.dark-mode h2:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .updates a:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .updates .update-date:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .updates span:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .updates strong:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .updates p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .card:not([class*=text]) p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode nav.navbar small:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode nav.navbar .dropdown-menu a:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode nav.navbar .dropdown-menu a span:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .side-navbar li a:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .side-navbar .sidenav-heading:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .right-sidebar a:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .dashboard-counts:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .dashboard-counts .count-title span:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .dashboard-counts strong:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .statistics p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .statistics .income .number:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .statistics .data-usage small:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .statistics .data-usage span:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .statistics .user-activity .number:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .daily-feeds small:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .blockquote-footer:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .forms p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .forms small:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode footer.main-footer p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode input.form-control-custom + label:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode select.form-control option:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .dropdown-menu:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .dropdown-item:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .dropdown-header:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode caption:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .figure-caption:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .form-text:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .breadcrumb-item.active:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .input-group-text:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .form-control:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .bootstrap-select.form-control:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .dropdown-menu.edit-options li a:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .dropdown-menu.edit-options li .btn-link:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .page-link:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode table.table:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode table.dataTable:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode #product-table td p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .totals .totals-title:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .product-grid > div p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .category-img p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .brand-img p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .login-page p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .register-page p:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .login-page small:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .register-page small:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .login-page a.create-account:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .register-page a.create-account:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode input.input-material:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode input.input-material ~ label:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)) {
    color: #fff;
}

/* Bootstrap gray utilities (!important in bootstrap) */
body.dark-mode .text-muted:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .text-secondary:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)),
body.dark-mode .text-dark:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)) {
    color: #fff !important;
}

/* Gray colors written inline in the views (style="color:...") */
body.dark-mode label[style*="color:rgb(136, 136, 136)"]:not(:where(.bg-light *, .bg-white *, .navbar-light *, .filter-window *, .dashboard-header *, .breadcrumb-holder *, .message-card *, .datepicker *, .daterangepicker *, .ui-timepicker-wrapper *, .ui-keyboard *, .ui-autocomplete *, .alert *, .popover *, .tooltip *, .badge, .badge *, #no-results-message, .pos-page #myTable th, .btn:not(.btn-link), .btn:not(.btn-link) *, :disabled, .disabled, .disabled *, :hover, :focus, :active, .active, .selected, [aria-expanded="true"], .active > a, #product-table td:hover p, .page-item.active .page-link, .payment-amount h2, #switch-theme *)) {
    color: #fff !important;
}