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

/* =============================================================================
   HEADER CSS VARIABLES AND ADVANCED STYLING
   ============================================================================= */
   
:root {
  --hdr-bg: #0a1e34;   /* رنگ هدر */
  --hdr-radius: 16px;  /* گردی کارت داخل کانتینر */
}

/* 1) حالت عادی: فقط کارتِ داخل کانتینر رنگی و گرد باشد */
.whb-main-header .whb-general-header > .container {
  background: var(--hdr-bg);
  border-radius: var(--hdr-radius);
  overflow: hidden;
}

/* 2) قبل از اسکرول هرگونه پس‌زمینه/اورلی/سایهٔ ردیف را خنثی کن
   (علت باکس مستطیلی با گوشه‌های تیز همین‌هاست) */
.whb-main-header .whb-general-header.whb-with-bg:not(.whb-sticked),
.whb-main-header .whb-general-header.whb-with-bg:not(.whb-sticked)::before,
.whb-main-header .whb-general-header.whb-with-bg:not(.whb-sticked)::after,
.whb-main-header .wd-with-overlay::before {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* 3) یک لایهٔ کنترل‌شده روی خود ردیف بسازیم؛ پیش‌فرض پنهان باشد */
.whb-main-header .whb-general-header.whb-with-bg {
  position: relative;
  isolation: isolate;               /* استکینگ جدا تا z-index مطمئن شود */
}
.whb-main-header .whb-general-header.whb-with-bg::after {
  content: none;                    /* قبل از اسکرول، اصلاً ساخته نشود */
}

/* 4) وقتی sticky/full-width شد، همان لایه را با رنگ #0a1e34 فعال کن */
.whb-main-header .whb-general-header.whb-with-bg.whb-sticky-row.whb-sticked::after,
.whb-main-header .whb-general-header.whb-with-bg.whb-sticky-row.is-sticky::after,
.whb-main-header .whb-general-header.whb-with-bg.whb-sticky-row.whb-fixed::after,
.whb-main-header.whb-sticked .whb-general-header.whb-with-bg::after {
  content: "";
  position: absolute;
  inset: 0;                         /* تمام عرض/ارتفاع ردیف */
  background: var(--hdr-bg) !important; /* دقیقا #0a1e34 */
  border-radius: 0;                 /* نوار تمام‌عرض نیازی به گردی ندارد */
  z-index: 0;
  pointer-events: none;
}

/* 5) محتوای هدر بالاتر از لایهٔ تمام‌عرض باشد */
.whb-main-header .whb-general-header.whb-with-bg > * {
  position: relative;
  z-index: 1;
}

/* =============================================================================
   HEADER FULL WIDTH FIXES - Compatible with advanced styling above
   ============================================================================= */

/* Force header to be full width with solid background - Compatible with advanced styling */
.whb-header,
.whb-sticky-header,
.header-banner,
.woodmart-header {
  width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Main header - work with advanced styling, don't override background */
.whb-main-header {
  width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Sticky header when scrolling - full width solid - Compatible with advanced styling */
.whb-sticky-header,
.header-sticky,
.woodmart-sticky-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  background: var(--hdr-bg) !important; /* Use CSS variable */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
  z-index: 9999 !important;
}

/* Additional sticky states - work with advanced styling */
body.header-sticky .whb-header:not(.whb-main-header) {
  background: var(--hdr-bg) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Remove any glassmorphic wrapper or container limitations */
.whb-header-wrapper,
.whb-header-inner,
.header-wrapper,
.header-inner,
.container.header-container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* Header row full width */
.whb-row,
.header-row,
.whb-header .row,
.main-header .row {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* Remove glassmorphic effects from header elements */
.whb-header *,
.main-header *,
.header-banner * {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Specific fixes for blog and contact pages - Compatible with advanced styling */
body.blog .whb-header:not(.whb-main-header),
body.single-post .whb-header:not(.whb-main-header),
body.page-template-contact .whb-header:not(.whb-main-header),
body.page .whb-header:not(.whb-main-header),
body.archive .whb-header:not(.whb-main-header) {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  background: var(--hdr-bg) !important; /* Use CSS variable */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* For non-main headers on all pages */
body.blog .header-banner,
body.single-post .header-banner,
body.page-template-contact .header-banner,
body.page .header-banner,
body.archive .header-banner {
  background: var(--hdr-bg) !important;
}

/* Ensure header content stays centered within the full width */
.whb-header .container,
.main-header .container,
.header-banner .container {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* Mobile responsiveness for header - Compatible with advanced styling */
@media (max-width: 1024px) {
  .whb-header:not(.whb-main-header),
  .whb-sticky-header,
  .header-banner,
  .woodmart-header {
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--hdr-bg) !important; /* Use CSS variable */
  }
  
  /* Main header mobile - work with advanced styling */
  .whb-main-header {
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
  }
  
  .whb-header .container,
  .main-header .container {
    max-width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
}

@media (max-width: 768px) {
  .whb-header .container,
  .main-header .container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* Remove glassmorphic pseudo-elements - Compatible with advanced styling */
/* Note: We exclude .whb-main-header pseudo-elements to preserve advanced styling */
.whb-header:not(.whb-main-header)::before,
.whb-header:not(.whb-main-header)::after,
.whb-sticky-header::before,
.whb-sticky-header::after,
.whb-header_430112:not(.whb-main-header)::before,
.whb-header_430112:not(.whb-main-header)::after,
.whb-overcontent:not(.whb-main-header)::before,
.whb-overcontent:not(.whb-main-header)::after,
.whb-boxed:not(.whb-main-header)::before,
.whb-boxed:not(.whb-main-header)::after {
  display: none !important;
  content: none !important;
  height: 0 !important;
  width: 0 !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  background: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Ensure z-index hierarchy is correct */
.whb-header {
  z-index: 999 !important;
}

.whb-sticky-header {
  z-index: 9999 !important;
}

/* Fix any potential layout issues */
body {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Specific fix for homepage header extra space */
body.home .whb-header,
body.front-page .whb-header,
.whb-header.whb-overcontent,
.whb-header.whb-boxed {
  margin-top: 0 !important;
  padding-top: 0 !important;
  top: 0 !important;
  position: relative !important;
}

/* Force remove any header spacing */
.whb-header.whb-header_430112 {
  margin-top: 0 !important;
  padding-top: 0 !important;
  top: 0 !important;
}

/* Remove any wrapper spacing above header */
.whb-header-wrapper,
.header-wrapper,
body > .whb-header {
  margin-top: 0 !important;
  padding-top: 0 !important;
  top: 0 !important;
}

/* Ensure no space before header in DOM */
html,
body {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Target specific header elements that might create space */
.whb-main-header,
.whb-general-header,
.whb-row {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.admin-bar .whb-sticky-header {
  top: 32px !important;
}

@media (max-width: 782px) {
  body.admin-bar .whb-sticky-header {
    top: 46px !important;
  }
}

/* TARGETED ELIMINATION - Remove problematic pseudo-elements while preserving advanced styling */
.whb-header:not(.whb-main-header),
.whb-header:not(.whb-main-header) *,
[class*="whb-header"]:not([class*="whb-main"]),
[class*="whb-sticky"] {
  position: relative !important;
}

/* Remove problematic pseudo-elements - EXCLUDE whb-main-header and whb-general-header.whb-with-bg */
.whb-header:not(.whb-main-header)::before,
.whb-header:not(.whb-main-header)::after,
[class*="whb-header"]:not([class*="whb-main"])::before,
[class*="whb-header"]:not([class*="whb-main"])::after,
[class*="whb-sticky"]::before,
[class*="whb-sticky"]::after,
.whb-row:not(.whb-general-header)::before,
.whb-row:not(.whb-general-header)::after {
  content: none !important;
  display: none !important;
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Homepage specific - complete space elimination */
body.home {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

body.home .whb-header {
  position: relative !important;
  top: 0 !important;
  margin: 0 !important;
  padding-top: 0 !important;
}

/* =============================================================================
   HOMEPAGE SPECIFIC FIXES - Remove unwanted ::before pseudo-element
   ============================================================================= */

/* Remove the problematic ::before pseudo-element from whb-main-header on homepage */
body.home .whb-main-header::before,
body.front-page .whb-main-header::before {
  content: none !important;
  display: none !important;
  height: 0 !important;
  width: 0 !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  background: none !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* Alternative approach: Make the ::before element invisible */
body.home .whb-main-header::before,
body.front-page .whb-main-header::before {
  opacity: 0 !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
}

/* =============================================================================
   HEADER UNIFICATION - Make blog and contact us headers identical to home page
   ============================================================================= */

/* Hide phone icon, phone number, and "Available 24/7" text on blog and contact us pages */
body.blog .info-box-wrapper,
body.single-post .info-box-wrapper,
body.page-template-contact .info-box-wrapper,
body.page .info-box-wrapper,
body.archive .info-box-wrapper {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* Alternative: Hide specific elements within info-box */
body.blog .info-box-icon,
body.single-post .info-box-icon,
body.page-template-contact .info-box-icon,
body.page .info-box-icon,
body.archive .info-box-icon,
body.blog .info-box-content,
body.single-post .info-box-content,
body.page-template-contact .info-box-content,
body.page .info-box-content,
body.archive .info-box-content {
  display: none !important;
}

/* Hide the entire info-box container */
body.blog .wd-info-box,
body.single-post .wd-info-box,
body.page-template-contact .wd-info-box,
body.page .wd-info-box,
body.archive .wd-info-box {
  display: none !important;
}

/* Ensure the right column doesn't collapse by maintaining structure */
body.blog .whb-col-right,
body.single-post .whb-col-right,
body.page-template-contact .whb-col-right,
body.page .whb-col-right,
body.archive .whb-col-right {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
}

/* Show only the "Take The First Step" button on blog and contact us pages */
body.blog .wd-button-wrapper,
body.single-post .wd-button-wrapper,
body.page-template-contact .wd-button-wrapper,
body.page .wd-button-wrapper,
body.archive .wd-button-wrapper {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* =============================================================================
   JAVASCRIPT OVERRIDE - Fix dynamic header spacing on non-homepage
   ============================================================================= */

/* ULTIMATE CSS FIX - Override ALL JavaScript-added spacing on non-homepage pages */

/* SPECIFIC HEADER PADDING FIX - Remove 90px padding-top from header */
body:not(.home):not(.front-page) .whb-header,
body:not(.home):not(.front-page) header[class*="whb-header"],
body:not(.home):not(.front-page) .whb-main-header {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Override inline styles in header */
body:not(.home):not(.front-page) .whb-header[style*="padding-top"],
body:not(.home):not(.front-page) header[style*="padding-top"] {
  padding-top: 0 !important;
}

/* Level 1: Basic body override */
body:not(.home):not(.front-page) {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Level 2: Override with inline style specificity */
body:not(.home):not(.front-page)[style*="padding-top"],
body:not(.home):not(.front-page)[style*="margin-top"] {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Level 3: Override any header-related classes that add spacing */
body:not(.home):not(.front-page)[class*="whb-header-overlapped"],
body:not(.home):not(.front-page)[class*="header-overlapped"],
body:not(.home):not(.front-page)[class*="whb-sticky"],
body:not(.home):not(.front-page).whb-header-overlapped,
body:not(.home):not(.front-page).header-overlapped {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Level 4: Override main content containers */
body:not(.home):not(.front-page) .main-page-wrapper,
body:not(.home):not(.front-page) #main,
body:not(.home):not(.front-page) .main-content,
body:not(.home):not(.front-page) .site-content,
body:not(.home):not(.front-page) .content-area,
body:not(.home):not(.front-page) .page-wrapper,
body:not(.home):not(.front-page) .elementor,
body:not(.home):not(.front-page) .elementor-section:first-child {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Level 5: Ultra-specific override for WordPress theme patterns */
body:not(.home):not(.front-page) > *:first-child,
body:not(.home):not(.front-page) #page > *:first-child,
body:not(.home):not(.front-page) .site > *:first-child {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Level 6: Override any element that comes after header */
body:not(.home):not(.front-page) .whb-header + *,
body:not(.home):not(.front-page) .whb-header ~ *,
body:not(.home):not(.front-page) header + *,
body:not(.home):not(.front-page) header ~ * {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Level 7: Animation-safe override (prevents flicker) */
@keyframes removeSpacing {
  0%, 100% {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
}

body:not(.home):not(.front-page) {
  animation: removeSpacing 0.01s infinite;
}

/* NOTE: Above comprehensive CSS rules replace all previous JavaScript overrides */

/* Additional desktop-specific safety */
@media (min-width: 1025px) {
  body:not(.home):not(.front-page) {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
  
  /* Additional header safety for desktop */
  body:not(.home):not(.front-page) .whb-header,
  body:not(.home):not(.front-page) header[class*="whb-header"] {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
}

/* =============================================================================
   INTEGRATION NOTES:
   - Advanced styling handles: whb-main-header rounded container + sticky full-width
   - Full width fixes handle: All other headers, blog/contact pages, mobile
   - CSS variables (--hdr-bg, --hdr-radius) used throughout for consistency
   - JavaScript override: Prevents dynamic spacing on non-homepage pages
   - No conflicts: Advanced styling preserved, full-width enhanced
   ============================================================================= */