/**
 * NShop Woo color scheme – dark palette with stone/slate and gold accents.
 * Use var(--black), var(--gold), etc. in CSS. Gold: .text-gold / .bg-gold where needed.
 */
:root {
  /* Main palette */
  --black: #191B1F;
  --offwhite: #EDEFF2;
  --stone-light: #95A9BF;
  --stone: #95A9BF;
  --stone-dark: #5C748C;
  --slate: #5C748C;
  --teal-dark: #1C333D;

  /* Gold – use .text-gold / .bg-gold where needed */
  --gold: #D4AF37;
  --gold-light: #E5C65C;
  --gold-dark: #B8960C;
  --gold-darker: #866F09;
  --gold-darker2: #594B07;
  --gold-darkest: #2C2503;
  --gold-gradient: linear-gradient(to right, var(--gold), var(--gold-light));

  /* Bootstrap alignment – accent from palette */
  --bs-primary: #95A9BF;
  --bs-primary-rgb: 149, 169, 191;
  --bs-body-bg: #191B1F;
  --bs-body-color: #EDEFF2;
  --bs-modal-color: #EDEFF2;
  --bs-modal-bg: #191B1F;
}

/* Apply palette to body and main content */
body {
  background-color: var(--black) !important;
  color: var(--offwhite) !important;
}

/* ---------- Header: top bar + masthead ---------- */
#top-bar {
  background: var(--teal-dark) !important;
  color: var(--offwhite) !important;
}
#top-bar .hvr-ripple-out,
#top-bar .hvr-wobble-bottom,
#top-bar .hvr-bounce-to-bottom,
#top-bar .hvr-rectangle-out,
#top-bar .hvr-shutter-in-horizontal {
  background: var(--stone-dark) !important;
  color: var(--offwhite) !important;
}
#top-bar .hvr-ripple-out:hover,
#top-bar .hvr-wobble-bottom:hover,
#top-bar .hvr-bounce-to-bottom:hover,
#top-bar .hvr-rectangle-out:hover {
  background: var(--stone) !important;
  color: var(--black) !important;
}
#top-bar #searchicon {
  background: var(--teal-dark) !important;
  border-color: var(--stone-dark) !important;
}
#top-bar .mobileMenu,
#top-bar .td_mobile_menu_wrap::after {
  background: var(--stone-dark) !important;
  color: var(--offwhite) !important;
}

#masthead {
  background: var(--teal-dark) !important;
  color: var(--offwhite) !important;
}
#masthead h1.site-title a,
#masthead .site-description,
#masthead h2.site-description {
  color: var(--offwhite) !important;
}
#top-search input[type=search] {
  background: var(--teal-dark) !important;
  border-color: var(--stone-dark) !important;
  color: var(--offwhite) !important;
}
#top-search button {
  background: var(--stone-dark) !important;
  border-color: var(--stone-dark) !important;
  color: var(--offwhite) !important;
}
#top-cart a,
#top-cart .cart-contents {
  color: var(--offwhite) !important;
}

/* ---------- Main navigation ---------- */
#site-navigation {
  background: var(--stone-dark) !important;
}
#site-navigation ul li a,
#site-navigation .menu-desc {
  color: var(--offwhite) !important;
}
#site-navigation ul li a:hover,
#site-navigation ul li:hover > a,
#site-navigation ul ul li a:hover {
  background: var(--stone) !important;
  color: var(--black) !important;
}
#site-navigation ul.sub-menu,
#site-navigation ul.children {
  background: var(--teal-dark) !important;
}
#site-navigation ul.sub-menu li a,
#site-navigation ul.children li a {
  background: var(--teal-dark) !important;
  color: var(--offwhite) !important;
}
#site-navigation ul.sub-menu li:nth-child(odd) a {
  background: var(--stone-dark) !important;
}
#site-navigation .current_page_item > a,
#site-navigation .current-menu-item > a,
#site-navigation .current_page_ancestor > a {
  background: var(--teal-dark) !important;
  color: var(--gold) !important;
}
.slicknav_menu {
  background: var(--stone-dark) !important;
}
.slicknav_btn {
  background: var(--teal-dark) !important;
  border-color: var(--stone-dark) !important;
}
.slicknav_nav a,
.slicknav_menutxt {
  color: var(--offwhite) !important;
}
.slicknav_nav a:hover,
.slicknav_nav li:hover {
  background: var(--stone) !important;
  color: var(--black) !important;
}

/* ---------- Content, sidebar, footer ---------- */
#content,
.site-main,
.content-area,
#primary,
#secondary,
.widget,
.sidebar .widget {
  background-color: var(--black) !important;
  color: var(--offwhite) !important;
}
.widget-title,
.widget h2,
.widget h3 {
  color: var(--offwhite) !important;
}
#hero {
  background: var(--teal-dark) !important;
}
.section-title {
  color: var(--offwhite) !important;
}

.site-footer,
#colophon,
.site-info {
  background: var(--teal-dark) !important;
  color: var(--offwhite) !important;
}
.site-footer a,
.site-info a {
  color: var(--stone-light) !important;
}
.site-footer a:hover,
.site-info a:hover {
  color: var(--gold) !important;
}

/* ---------- Buttons (theme + WooCommerce) ---------- */
.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background-color: var(--stone-dark) !important;
  border-color: var(--stone) !important;
  color: var(--offwhite) !important;
}
.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
  background-color: var(--stone) !important;
  border-color: var(--stone-light) !important;
  color: var(--black) !important;
}
.woocommerce .button.alt {
  background: var(--gold-dark) !important;
  border-color: var(--gold) !important;
  color: var(--offwhite) !important;
}
.woocommerce .button.alt:hover {
  background: var(--gold) !important;
  border-color: var(--gold-light) !important;
  color: var(--black) !important;
}

/* ---------- WooCommerce ---------- */
p.demo_store {
  background-color: var(--teal-dark) !important;
  color: var(--offwhite) !important;
}
.woocommerce .woocommerce-breadcrumb {
  background: var(--teal-dark) !important;
  color: var(--offwhite) !important;
  border-bottom-color: var(--stone-dark) !important;
}
.woocommerce .woocommerce-breadcrumb a {
  color: var(--stone-light) !important;
}
.woocommerce .woocommerce-breadcrumb a:hover {
  color: var(--gold) !important;
}
.woocommerce ul.products li.product {
  background: var(--teal-dark) !important;
  border-color: var(--stone-dark) !important;
}
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info {
  background-color: var(--teal-dark) !important;
  color: var(--offwhite) !important;
  border-top-color: var(--stone) !important;
}
.woocommerce .woocommerce-message:before,
.woocommerce .woocommerce-info:before {
  color: var(--stone-light) !important;
}
.woocommerce .woocommerce-error {
  border-top-color: var(--gold-dark) !important;
}
.woocommerce .woocommerce-error:before {
  color: var(--gold) !important;
}
.woocommerce .star-rating span,
.woocommerce .star-rating::before {
  color: var(--gold) !important;
}
.woocommerce div.product .summary .price,
.woocommerce div.product p.price {
  color: var(--gold) !important;
}
.woocommerce .summary .cart button,
.woocommerce form.cart .button {
  background: var(--gold-dark) !important;
  border-color: var(--gold) !important;
  color: var(--offwhite) !important;
}
.woocommerce .summary .cart button:hover,
.woocommerce form.cart .button:hover {
  background: var(--gold) !important;
  color: var(--black) !important;
}

/* Gold utility classes */
.text-gold { color: var(--gold) !important; }
.text-gold-light { color: var(--gold-light) !important; }
.text-gold-dark { color: var(--gold-dark) !important; }
.bg-gold { background-color: var(--gold) !important; }
.bg-gold-light { background-color: var(--gold-light) !important; }
.bg-gold-dark { background-color: var(--gold-dark) !important; }
.bg-gold-darker { background-color: var(--gold-darker) !important; }
.bg-gold-gradient { background: var(--gold-gradient) !important; }

/* Links and accents use stone/slate from palette */
a {
  color: var(--stone-light) !important;
}
a:hover,
a:focus {
  color: var(--gold) !important;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.entry-title,
.entry-title a,
.page-title {
  color: var(--offwhite) !important;
}
.entry-title a:hover {
  color: var(--gold) !important;
}

/* Form inputs – dark inputs on dark bg */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
  background-color: var(--teal-dark) !important;
  border-color: var(--stone-dark) !important;
  color: var(--offwhite) !important;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
  border-color: var(--stone-light) !important;
  color: var(--offwhite) !important;
}

/* Buttons – primary = stone */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  background-color: var(--stone-dark) !important;
  border-color: var(--stone) !important;
  color: var(--offwhite) !important;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
  background-color: var(--stone) !important;
  border-color: var(--stone-light) !important;
  color: var(--black) !important;
}

/* WooCommerce product titles and content */
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
  color: var(--offwhite) !important;
}
.woocommerce ul.products li.product .price {
  color: var(--gold) !important;
}

/* Extra overrides for compiled skin blue */
#site-navigation ul ul li {
  border-bottom-color: var(--stone-dark) !important;
}
.readmore a,
span.readmore a {
  color: var(--stone-light) !important;
}
.readmore a:hover,
span.readmore a:hover {
  color: var(--gold) !important;
}
.postedon,
.entry-meta,
.entry-footer,
.cat-links,
.tags-links {
  color: var(--stone) !important;
}
.entry-content,
.entry-summary,
.page-content {
  color: var(--offwhite) !important;
}
.main-navigation a {
  color: var(--offwhite) !important;
}
.main-navigation a:hover,
.main-navigation .current_page_item > a:hover,
.main-navigation .current-menu-item > a:hover {
  color: var(--gold) !important;
}
.screen-reader-text:focus {
  color: var(--stone-light) !important;
}
