/*========== Dark Mode =================================*/
root {
  color-scheme: light dark;
  --dark-color-first: light-dark(#000, #fff);
  --color-dark: light-dark(#fff, #000);
  --border-dark: light-dark(#6c757d, #d5d5d5);
  --secondary-dark: light-dark(#6c757d, #f3f3f3);
  --color-second: light-dark(#5d5d5d, #dddddd);
  --color-third: #f9f9f9;
  --color-fourth: #D7D7D7;
  --icon-secondary: #676767;
  --bg-light-1: #f9f9f9;
  --bg-1: #f4f9f5;
  --bg-first-opacity: light-dark(rgba(29, 91, 69, 0.6), rgba(255, 255, 255, .15));
  --border-xlight: light-dark(rgb(0 0 0 / 5%), rgba(255, 255, 255, .15));
  --border-light: light-dark(rgba(0, 0, 0, .1), rgba(255, 255, 255, .1));
  --border-medium: light-dark(rgba(0, 0, 0, .15), rgba(255, 255, 255, .15));
  --border-heavy: light-dark(rgba(0, 0, 0, .2), rgba(255, 255, 255, .2));
  --border-xheavy: light-dark(rgba(0, 0, 0, .25), rgba(255, 255, 255, .25));
  --gray-50: #f9f9f9;
  --gray-100: #ececec;
  --gray-200: #e3e3e3;
  --gray-300: #cdcdcd;
  --gray-400: #b4b4b4;
  --gray-500: #9b9b9b;
  --gray-600: light-dark(#676767, #d0d0d0);
  --gray-700: light-dark(#424242, #ececec);
  --gray-750: #2f2f2f;
  --gray-800: light-dark(#212121, #ececec);
  --gray-900: #171717;
  --gray-950: #0d0d0d;
  --gray-hover: #595959;
  --light-blue-bg: light-dark(#d2e3fc, #627ca2);
  /*--bs-secondary-rgb:light-dark(rgb(108, 117, 125),#e3e3e3);*/
  --shadow: 0 1px 2px 0 rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .13);
}

:root:has(html[data-bs-theme="light auto"]) {
  color-scheme: light;
}

:root:has(html[data-bs-theme="dark"]) {
  color-scheme: dark;
}

html[data-bs-theme="dark"] * {
  color: var(--color-light);
}

html[data-bs-theme="dark"] body {
  color: var(--color-light);
  background-color: #0d0d0d;
}

html[data-bs-theme="dark"] .chat-input-box i {
  color: var(--color-first);
}

html[data-bs-theme="dark"] .b-brand img,
html[data-bs-theme="dark"] .logos-image img {
  filter: invert(100%);
}

/*html[data-bs-theme="dark"] .url-logo-input {filter: invert(100%);}*/
/*html[data-bs-theme="dark"] img{filter: invert(100%);}*/
html[data-bs-theme="dark"] img.brand-logo,
html[data-bs-theme="dark"] .publisher-offerings-box img,
html[data-bs-theme="dark"] img.publishers-main-img,
html[data-bs-theme="dark"] .liveBrands img {
  filter: invert(100%);
}

html[data-bs-theme="dark"] svg.icon-check {
  stroke: var(--color-first);
  fill: none;
}

html[data-bs-theme="dark"] .left-chat-box,
html[data-bs-theme="dark"] .left-chat-box div,
html[data-bs-theme="dark"] .left-chat-box section,
html[data-bs-theme="dark"] .left-chat-box main {
  background: var(--bs-tertiary-bg-rgb) !important;
}

html[data-bs-theme="dark"] .left-chat-box h1,
html[data-bs-theme="dark"] .left-chat-box h2,
html[data-bs-theme="dark"] .left-chat-box h3,
html[data-bs-theme="dark"] .left-chat-box h4,
html[data-bs-theme="dark"] .left-chat-box h5,
html[data-bs-theme="dark"] .left-chat-box h6,
html[data-bs-theme="dark"] .left-chat-box p,
html[data-bs-theme="dark"] .left-chat-box span,
html[data-bs-theme="dark"] .left-chat-box strong,
html[data-bs-theme="dark"] .left-chat-box b,
html[data-bs-theme="dark"] .left-chat-box ul li,
html[data-bs-theme="dark"] .webContent .my-p,
html[data-bs-theme="dark"] .my-p,
html[data-bs-theme="dark"] .webContent .my-p a,
html[data-bs-theme="dark"] .my-p a,
html[data-bs-theme="dark"] .webContent .my-p span,
html[data-bs-theme="dark"] .my-p span,
html[data-bs-theme="dark"] .webContent ul li strong,
html[data-bs-theme="dark"] .webContent ol li strong,
html[data-bs-theme="dark"] .webContent strong,
html[data-bs-theme="dark"] .webContent strong a {
  color: var(--gray-400) !important;
}

html[data-bs-theme="dark"] .bg-white {
  background-color: var(--bg-dark2) !important;
}

html[data-bs-theme="dark"] .bg-light {
  background-color: var(--gray-750) !important;
}

html[data-bs-theme="dark"] .form-validation .form-check-input:checked {
  background-color: #4D4D4D;
  border-color: var(--color-first);
}

html[data-bs-theme="dark"] input:-webkit-autofill,
html[data-bs-theme="dark"] input:-webkit-autofill:hover,
html[data-bs-theme="dark"] input:-webkit-autofill:focus,
html[data-bs-theme="dark"] input:-webkit-autofill:active {
  -webkit-box-shadow: none !important;
}

html[data-bs-theme="dark"] .form-validation .text-secondary {
  color: #e3e3e3 !important;
}

html[data-bs-theme="dark"] .lightblue-bg-section .text-24 {
  color: var(--gray-900);
}

html[data-bs-theme="dark"] .text-secondary {
  color: #b6c1cb !important;
}

html[data-bs-theme="dark"] .pcoded-header,
html[data-bs-theme="dark"] .pcoded-navbar {
  color: var(--color-light);
  background-color: var(--bg-black) !important;
}

html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar li.pcoded-hasmenu .pcoded-submenu li.active>a .pcoded-micon {
  background-color: transparent;
}

html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar li.pcoded-hasmenu .pcoded-submenu li.active>a .pcoded-micon svg {
  stroke: var(--color-second);
}

html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar li>a>.pcoded-micon+.pcoded-mtext,
html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar>li.pcoded-trigger.active .pcoded-submenu li.active>a>.pcoded-mtext {
  color: var(--color-light);
}

html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar li.pcoded-hasmenu .pcoded-submenu li.active>a {
  color: var(--color-second);
}

html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar li.active>a,
html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar li:focus>a,
html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar li:hover>a,
html[data-bs-theme="dark"] .pcoded-inner-navbar li:hover>a .pcoded-mtext,
html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar>li.pcoded-trigger>a.nav-link,
html[data-bs-theme="dark"] .pcoded-navbar .pcoded-inner-navbar>li.pcoded-trigger:hover a.nav-link {
  background-color: var(--bg-dark2);
}

html[data-bs-theme="dark"] .nav-user-name {
  color: var(--color-first);
}

html[data-bs-theme="dark"] .pcoded-header .input-group .input-group-text,
html[data-bs-theme="dark"] .pcoded-header a,
html[data-bs-theme="dark"] .pcoded-header dropdown-toggle {
  color: #ffffff;
}

html[data-bs-theme="dark"] .daterangepicker {
  background-color: var(--bg-black);
  box-shadow: 0 0 25px rgba(255, 255, 255, 0.15);
}

html[data-bs-theme="dark"] .daterangepicker:after {
  border-bottom: 6px solid var(--bg-black);
}

html[data-bs-theme="dark"] .webContent p a,
html[data-bs-theme="dark"] .webContent p a span,
html[data-bs-theme="dark"] .webContent p span,
html[data-bs-theme="dark"] .webContent p,
html[data-bs-theme="dark"] .webContent ul li,
html[data-bs-theme="dark"] .webContent p,
html[data-bs-theme="dark"] .webContent p span,
html[data-bs-theme="dark"] .webContent span p,
html[data-bs-theme="dark"] .webContent span,
html[data-bs-theme="dark"] .webContent a,
html[data-bs-theme="dark"] .webContent strong a {
  color: var(--gray-400);
}

html[data-bs-theme="dark"] .card,
html[data-bs-theme="dark"] .storefront-form,
html[data-bs-theme="dark"] .platform-cards .platform-card {
  background-color: var(--bg-black) !important;
  box-shadow: 0 0 2px rgba(255, 255, 255, 0.2);
}

html[data-bs-theme="dark"] .card-dark {
  border: 1px solid #2e2e2e !important;
  background-color: var(--bg-black);
}

html[data-bs-theme="dark"] .platform-cards .platform-card.my-card .link-card-img {
  border-color: rgba(233, 233, 233, 0.24);
}

html[data-bs-theme="dark"] .mob-toggler span:after,
html[data-bs-theme="dark"] .mob-toggler span:before,
html[data-bs-theme="dark"] .mobile-menu span:after,
html[data-bs-theme="dark"] .mobile-menu span:before,
html[data-bs-theme="dark"] .mob-toggler span,
html[data-bs-theme="dark"] .mobile-menu span {
  background-color: rgba(255, 255, 255, 0.7);
}

html[data-bs-theme="dark"] .radio-btn-area .btn-outline-primary {
  border-color: var(--color-second);
}

html[data-bs-theme="dark"] .radio-btn-area .btn-check:checked+.btn,
html[data-bs-theme="dark"] .radio-btn-area .btn.active,
html[data-bs-theme="dark"] .radio-btn-area .btn.show,
html[data-bs-theme="dark"] .radio-btn-area .btn:first-child:active,
html[data-bs-theme="dark"] .radio-btn-area :not(.btn-check)+.btn:active,
html[data-bs-theme="dark"] .radio-btn-area .btn-outline-primary:hover {
  border-color: var(--color-first);
}

html[data-bs-theme="dark"] .url-logo-area .form-control {
  background-color: var(--bg-dark2) !important;
}

html[data-bs-theme="dark"] .user-dropdown svg,
html[data-bs-theme="dark"] .switch .slider {
  background-color: var(--color-second);
}

html[data-bs-theme="dark"] .modal-content {
  background-color: var(--bg-black);
}

html[data-bs-theme="dark"] .x-btn,
html[data-bs-theme="dark"] .ai-text-area {
  background-color: var(--bg-dark2);
}

html[data-bs-theme="dark"] table.dataTable>thead>tr>th,
html[data-bs-theme="dark"] table.dataTable>thead>tr>td,
html[data-bs-theme="dark"] .links-ulr-card {
  border-color: rgba(255, 255, 255, 0.1) !important;
}

html[data-bs-theme="dark"] table.dataTable th,
html[data-bs-theme="dark"] table.dataTable td,
html[data-bs-theme="dark"] .links-ulr-card,
html[data-bs-theme="dark"] .webContent .card-ul li {
  border-color: rgba(255, 255, 255, 0.1);
}

html[data-bs-theme="dark"] .table>:not(caption)>*>* {
  background-color: transparent;
}

html[data-bs-theme="dark"] .platform-cards .platform-card.my-card2.dm-card,
html[data-bs-theme="dark"] .reply-card,
html[data-bs-theme="dark"] .affiliate-link,
html[data-bs-theme="dark"] .customReply .card,
html[data-bs-theme="dark"] .customKeyword .card {
  box-shadow: 0 0 2px rgba(255, 255, 255, 0.44);
}

html[data-bs-theme="dark"] .products-dropdown .dropdown-menu svg {
  stroke: #ffffff;
}

html[data-bs-theme="dark"] .ai-btn option {
  color: var(--bg-dark2) !important;
}

html[data-bs-theme="dark"] .shop-tab.active {
  border-color: var(--gray-400);
}

html[data-bs-theme="dark"] .download-icon-btn svg,
html[data-bs-theme="dark"] .download-icon-btn b {
  color: var(--color-first);
  stroke: var(--color-first);
}

html[data-bs-theme="dark"] .form-control.platform-input-clr {
  color: var(--gray-400) !important;
}

html[data-bs-theme="dark"] .form-control.platform-form-control {
  background-color: transparent !important;
}

@media screen and (max-width: 767px) {
  .radio-btn-area .btn-check:checked+.btn:hover {
    color: var(--color-first);
    background-color: var(--bg-first-light);
    border-color: var(--color-first);
  }

  .radio-btn-area .btn-outline-primary:hover {
    color: var(--color-second);
    border-color: var(--color-light);
    background-color: transparent;
  }
}

/*========== Dark Mode END =================================*/