*,
*::before,
*::after {
  box-sizing: border-box;
}

:root {
  --clr-btn-txt: #fff;
  --clr-theme-color: #1e73be;
  --clr-light: #ffffff;
  --clr-gray: #f1f0f0;
  --clr-dark: #000000;
  --clr-breadcrump: #f1f0f0;
  --clr-breadtext: #000000;
  --clr-accent: #f1f0f0;
  --clr-authorbox: #ca2129;
  --clr-authorboxtext: #ffffff;
  --clr-topsocial: #f1f0f0;
  --clr-border: #f1f0f0;
  --foreground: var(--clr-dark);
  --background: var(--clr-light);
  --single-post: var(--clr-gray);
  --clr-footer: #161616;
  --clr-tag: #ca2129;
  --clr-tag-label: #ca2129;
  --clr-menuicon: #000000;
  --clr-menuback: rgba(255, 255, 255, 0.945);
}

.darkmode {
  --clr-btn-txt: #121212;
  --clr-theme-color: #fff;
  --clr-light: #fff;
  --clr-dark: #121212;
  --clr-breadcrump: #fff;
  --clr-breadtext: #121212;
  --clr-accent: #121212;
  --clr-authorbox: #121212;
  --clr-authorboxtext: #fff;
  --clr-topsocial: #121212;
  --clr-border: #fff;
  --foreground: var(--clr-light);
  --background: var(--clr-dark);
  --single-post: var(--clr-dark);
  --clr-footer: #121212;
  --clr-tag: #121212;
  --clr-tag-label: #fff;
  --clr-menuicon: #ffffff;
  --clr-menuback: #121212;
}

.dark-mode-area {
  display: flex;
  align-items: center;
}

.dark-mode-area svg {
  fill: var(--foreground);
}

body {
  background: var(--background);
  color: var(--foreground);
}

.top-bar-container {
  border-bottom: 1px solid var(--clr-border);
  background: var(--background);
}

.post {
  border: 1px solid var(--clr-border);
}

#scroll-value .fa {
  background: var(--background);
}

.fa {
  background: var(--clr-topsocial);
  color: var(--foreground);
}

.search-area {
  background-color: var(--clr-accent);
  border-bottom: 1px solid var(--foreground);
}

.search-form input[type="text"] {
  background: var(--background);
  color: var(--foreground);
}

.close svg {
  color: var(--foreground);
}

.header {
  background: var(--background);
  color: var(--foreground);
  border-bottom: 1px solid var(--clr-border);
}

header .main-navbar .navbar-nav li a,
header .main-navbar div.menuon ul li a {
  color: var(--foreground);
}

.logo-title a {
  color: var(--foreground);
}

.search-toggle svg {
  fill: var(--foreground);
}

ul.sub-menu,
ul.children {
  background-color: var(--background);
}

.sub-menu > .menu-item,
.children > .page_item {
  background-color: var(--background);
}

header .main-navbar .navbar-nav li a:hover,
header .main-navbar .navbar-nav li a:focus,
header .main-navbar div.menuon ul li a:hover,
header .main-navbar div.menuon ul li a:focus {
  color: var(--foreground);
}

.hero-section {
  background: var(--clr-accent);
  border-bottom: solid 1px var(--clr-border);
}

.sub-heading {
  color: var(--foreground);
}

.heading-primary,
.heading-secondary {
  color: var(--foreground);
}

.heading-primary p,
.heading-secondary p {
  border-bottom: solid 2px var(--foreground);
}

.post-title a {
  color: var(--foreground);
}

.post-excerpt {
  color: var(--foreground);
}

.author-c span a {
  color: var(--foreground);
}

.entry-meta {
  border-top: 1px solid var(--foreground);
  border-bottom: 1px solid var(--foreground);
}

.tag-c a,
.see-more-btn,
.time-tag,
.views-tag,
.section-posts .cart button {
  color: var(--background);
  background-color: var(--clr-theme-color);
}

.section-deals {
  background-color: var(--clr-accent);
}

.nav-col ul a:link,
.nav-col ul a:visited {
  color: var(--clr-light);
}

.footer p {
  color: var(--foreground);
}

.copyright {
  color: #fff;
}

.copyright a {
  color:white;
}

.wp-block-code > code {
  color: var(--foreground);
}

.single-deal {
  background-color: var(--single-post);
}

.single-post {
  background-color: var(--single-post);
}

.single-post-content {
  background-color: var(--background);
}

.breadcrumbs {
  background-color: var(--clr-breadcrump);
  color: var(--clr-breadtext);
}

.breadcrumbs a {
  color: var(--clr-breadtext);
}

.single-entry-meta {
  color: var(--foreground);
  border-bottom: solid 1px var(--foreground);
  border-top: solid 1px var(--foreground);
}

.single-entry-meta span a {
  color: var(--foreground);
}

.entry-content ul li,
.entry-content ol li {
  color: var(--foreground);
}

.author-box {
  background-color: var(--clr-footer);
  color: var(--clr-authorboxtext);
}

.author-box-title a {
  color: var(--clr-authorboxtext);
}

.woocommerce {
  background-color: var(--background);
}

.single.single-product {
  background-color: var(--background);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--foreground);
}

.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background-color: var(--foreground);
  color: var(--background);
}

.woocommerce ul.products li.product .woocommerce-loop-category__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h3 {
  color: var(--foreground);
}

.woocommerce ul.products li.product .price {
  color: var(--foreground);
}

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  background-color: var(--foreground);
  color: var(--background);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background-color: var(--background);
}

.post-comments li {
  background-color: var(--background);
}

.comment-author a {
  color: var(--foreground);
}

.comment-metadata a {
  color: var(--foreground);
}

.comment-body .reply a {
  color: var(--foreground);
}

a {
  color: var(--foreground);
}

.dark-mode-toggle {
  z-index: 100;
  top: 1em;
  right: 1em;
  color: var(--foreground);
  border: 2px solid currentColor;
  padding: 4px;
  background: transparent;
  cursor: pointer;
  border-radius: 5px;
  width: 30px;
  height: 30px;
}

.click-here {
  width: 100px;
  right: 1.5em;
}

.footer {
  background-color: var(--clr-footer);
}

.hamburger .line {
  background-color: var(--clr-menuicon);
}
.main-nav {
  background-color: var(--clr-menuback);
}

.search-block {
  background-color: var(--background);
}

.search-close {
  fill: var(--clr-menuicon);
}

.card-meta .card-meta-tag a {
  background-color: var(--clr-menuicon);
  color: var(--background);
}

.copyright-text {
  background-color: var(--clr-footer);
  border-top: 1px solid #393838; 
  padding-bottom: 80px;
}