/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* Contractors Overstock - Hero styling */
#slider-313 {
  margin-top: 34px;
  margin-bottom: 64px;
  background-color: #FAF7F2;
  overflow: visible;
}

#slider-313 .wd-carousel-inner {
  overflow: visible;
}

#slider-313 .wd-slide {
  min-height: 620px;
  background-color: #FAF7F2;
}

#slider-313 .wd-slide-container {
  max-width: none !important;
  width: 100% !important;
  padding: 72px clamp(48px, 6vw, 110px);
}

#slider-313 .wd-slide-inner {
  width: 100%;
}

#slider-313 h1,
#slider-313 .elementor-heading-title {
  color: #232220;
  font-size: clamp(38px, 4vw, 64px);
  line-height: 1.08;
  letter-spacing: -0.035em;
  margin-bottom: 22px;
}

#slider-313 p {
  color: #3A3733;
  font-size: 18px;
  line-height: 1.7;
}

#slider-313 .elementor-button,
#slider-313 a.elementor-button,
#slider-313 .btn {
  background-color: #D29644 !important;
  color: #232220 !important;
  border-radius: 2px !important;
  padding: 15px 34px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  box-shadow: 0 12px 26px rgba(210, 150, 68, 0.22);
  transition: all 0.25s ease;
}

#slider-313 .elementor-button:hover,
#slider-313 a.elementor-button:hover,
#slider-313 .btn:hover {
  background-color: #F2BD6D !important;
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(242, 189, 109, 0.28);
}

#slider-313 .elementor-widget-image img,
#slider-313 .wd-image img {
  border-radius: 2px;
  box-shadow: 0 28px 70px rgba(35, 34, 32, 0.16);
}

/* Hero slider arrows */
#slider-313 .wd-slider-arrows {
  --wd-arrow-size: 44px;
  --wd-arrow-offset-v: 0px;
  z-index: 30 !important;
}

#slider-313 .wd-slider-arrows .wd-btn-arrow {
  opacity: 1 !important;
  visibility: visible !important;
}

#slider-313 .wd-slider-arrows .wd-prev {
  left: 24px !important;
  right: auto !important;
  inset-inline-end: auto !important;
}

#slider-313 .wd-slider-arrows .wd-next {
  right: 24px !important;
  left: auto !important;
  inset-inline-start: auto !important;
}

#slider-313 .wd-slider-arrows .wd-arrow-inner {
  display: inline-flex !important;
  width: 44px !important;
  height: 44px !important;
  background-color: #2C4A73 !important;
  color: #FFFFFF !important;
  border-radius: 2px !important;
  box-shadow: 0 12px 28px rgba(44, 74, 115, 0.24) !important;
  border: 0 !important;
  transition: all 0.25s ease;
}

#slider-313 .wd-slider-arrows .wd-arrow-inner:hover {
  background-color: #D29644 !important;
  box-shadow: 0 16px 34px rgba(210, 150, 68, 0.3) !important;
}

/* Hero desktop balance pass */
@media (min-width: 1025px) {
  #slider-313 {
    margin-top: 22px;
    margin-bottom: 46px;
  }

  #slider-313 .wd-slide {
    min-height: 560px !important;
  }

  #slider-313 .wd-slide-container {
    padding-top: 52px !important;
    padding-bottom: 52px !important;
  }

  #slider-313 .wd-slide-inner {
    display: flex;
    align-items: center;
  }

  #slider-313 h1,
  #slider-313 .elementor-heading-title {
    font-size: clamp(42px, 3.3vw, 58px);
    line-height: 1.08;
    max-width: 720px;
  }

  #slider-313 p {
    max-width: 620px;
    margin-bottom: 22px;
  }

  #slider-313 .elementor-widget-image img,
  #slider-313 .wd-image img {
    width: 100%;
    max-height: 470px;
    object-fit: cover;
  }

  #slider-313 .elementor-button,
  #slider-313 a.elementor-button {
    margin-top: 4px;
  }
}

/* Contractors Overstock - Full width Popular Categories band */
.elementor-element-950c1e0 {
  position: relative !important;
  z-index: 1 !important;
  background: transparent !important;
  padding-top: 45px !important;
  padding-bottom: 45px !important;
  overflow: visible !important;
}

.elementor-element-950c1e0::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  background: #FAF7F2;
  border-top: 1px solid #E7DED3;
  border-bottom: 1px solid #E7DED3;
  z-index: -1;
}

.elementor-element-81c38f3 {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  background: transparent !important;
}

/* Contractors Overstock - Popular Categories clean circular thumbnails */
.elementor-element-b8c3dbd .category-image-wrapp {
  background: transparent !important;
  border-radius: 0 !important;
  overflow: visible !important;
  display: flex !important;
  justify-content: center !important;
  margin: 0 auto 14px !important;
}

.elementor-element-b8c3dbd .category-image-wrapp > a.category-image {
  width: 92px !important;
  height: 92px !important;
  min-width: 92px !important;
  min-height: 92px !important;
  border-radius: 999px !important;
  background: #F0ECE8 !important;
  border: 1px solid #E7DED3 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

.elementor-element-b8c3dbd .category-image-wrapp > a.category-image img {
  width: auto !important;
  height: auto !important;
  max-width: 64px !important;
  max-height: 64px !important;
  object-fit: contain !important;
  display: block !important;
}

/* Contractors Overstock - Benefits full width band */
.co-benefits-band {
  position: relative !important;
  z-index: 1 !important;
  background: transparent !important;
  overflow: visible !important;
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

.co-benefits-band::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  background: #FAF7F2;
  border-top: 1px solid #E7DED3;
  border-bottom: 1px solid #E7DED3;
  z-index: -1;
}

/* Contractors Overstock - Footer newsletter strip (blue/gold rebrand) */
.elementor-element-557dc46 {
  background-color: #2C4A73 !important; /* Deep Blue, was #C55A2A orange */
}

.elementor-element-557dc46 .mc4wp-form {
  --btn-accented-bgcolor: #D29644 !important;       /* Gold button */
  --btn-accented-color: #232220 !important;         /* dark text on gold */
  --btn-accented-bgcolor-hover: #F2BD6D !important; /* Light Gold hover */
  --btn-accented-color-hover: #232220 !important;
}

/* Contractors Overstock - Footer branding/links area (blue/gold rebrand) */
.elementor-element-79578b4 .wd-el-toggle-title {
  color: #2C4A73 !important; /* column headings -> Deep Blue */
}

.elementor-element-79578b4 .wd-sub-accented > li > a {
  color: #232220 !important;
}

.elementor-element-79578b4 .wd-sub-accented > li > a:hover {
  color: #D29644 !important; /* link hover -> Gold */
}

.elementor-element-79578b4 .wd-social-icons .wd-social-icon {
  background-color: #2C4A73 !important;
  color: #FFFFFF !important;
}

.elementor-element-79578b4 .wd-social-icons .wd-social-icon:hover {
  background-color: #D29644 !important;
  color: #232220 !important;
}

/* Contractors Overstock - Homepage accents (blue/gold rebrand) */
.elementor-element-1482f59 .wd-nav-tabs {
  --nav-color: #2C4A73 !important;        /* tab idle -> Deep Blue, was #1246AB */
  --nav-color-hover: #D29644 !important;  /* hover -> Gold, was #DF2626 red */
  --nav-color-active: #D29644 !important; /* active -> Gold */
}

.elementor-element-823a732 .info-box-subtitle {
  color: #D29644 !important; /* info-box subtitle -> Gold, was #C55A2A */
}

/* Contractors Overstock - Depicter hero buttons (blue/gold rebrand) */
.depicter-revert .depicter-1-element-7,
.depicter-revert .depicter-1-element-13,
.depicter-revert .depicter-1-element-22 {
  background-color: #D29644 !important; /* Gold, was #C55A2A */
  color: #232220 !important;
  border-color: #D29644 !important;
}

.depicter-revert .depicter-1-element-7:not(.depicter-hover-off):hover,
.depicter-revert .depicter-1-element-13:not(.depicter-hover-off):hover,
.depicter-revert .depicter-1-element-22:not(.depicter-hover-off):hover {
  background-color: #F2BD6D !important; /* Light Gold hover */
  color: #232220 !important;
  border-color: #F2BD6D !important;
}

/* ============================================
   Contractors Overstock — Header rebuild (CO Header v2)
   Moved from Appearance -> Customize -> Additional CSS
   (custom_css post ID 2890) so it's version-controlled.
   ============================================ */

/* ---------- Header: search box border ----------
   Woodmart sets --wd-form-brd-width: 0px at :root, and the Header
   Builder's search widget colour picker only ever writes
   --wd-form-brd-color, never the width. So a border colour was being
   applied to a border that was still 0px wide and never rendered.
   We supply the missing width here; the colour still comes from the
   Header Builder setting. */
.whb-intjt9nb82bpfol6ap47.wd-search-form.wd-header-search-form .searchform {
  --wd-form-brd-width: 1px;
}

/* ---------- Header: "Call for Pricing" CTA ----------
   The .co-header-cta class is NOT set here — it's added manually in
   Header Builder on the Button element (Additional CSS class field).
   If someone removes/renames that class in Header Builder, this
   button silently loses all styling and falls back to the theme
   default. Selectors cover both cases Header Builder can produce:
   the class printed on the <a> itself, or on a wrapper div around it. */
a.co-header-cta,
.co-header-cta a,
.co-header-cta > .wd-button,
.whb-header .co-header-cta {
  border: 2px solid #343846 !important;
  border-radius: 22px !important;
  background-color: transparent !important;
  color: #343846 !important;
  text-transform: none !important;
  font-weight: 600;
  padding: 12px 28px !important;
  display: inline-block;
  line-height: 1.2;
  transition: background-color .2s ease, color .2s ease;
}

a.co-header-cta:hover,
.co-header-cta a:hover,
.co-header-cta > .wd-button:hover,
.whb-header .co-header-cta:hover {
  background-color: #343846 !important;
  color: #FFFFFF !important;
  border-color: #343846 !important;
}

/* ---------- Header/hero gap ----------
   Remove the gap the header builder leaves above page content. */
.whb-header {
  margin-bottom: 0 !important;
}

.whb-space {
  display: none !important;
}

/* Woodmart's base.css gives .wd-content-layout padding-block: 40px,
   which sits between the header and the first section on every page.
   Scoped to .home only, so the homepage hero sits flush under the
   header while inner pages (shop, product, blog) keep their normal
   40px breathing room. */
.home .wd-content-layout {
  padding-block-start: 0;
}

/* ---------- Shop grid: hover quick-info backstop ----------
   WoodMart's fw-button product hover paints the white panel behind
   the revealed attributes via a JS-measured .wd-product-card-bg
   (productHover.js sets an inline negative margin-bottom on it and
   caches the result per card via .wd-height-calculated). That cached
   measurement is never refreshed on window resizes, grid-column
   switches, or wd-fade-off toggles, so the card can end up revealing
   its attributes with no backdrop — text floating transparently over
   the next row. Give the hover block its own background as a safety
   net; invisible (white on white) when the theme works correctly. */
.wd-hover-with-fade .wd-product-card-hover {
  background-color: var(--wd-prod-bg, var(--bgcolor-white, #fff));
}