/*
 Theme Name: AndyWarholWoo Child
 Template: andywarholwoo
 Text Domain: andywarholwoo-child
 Version: 1.0.1
*/

/* ====== GLOBAL ====== */
:root{
  --brand-primary:#0E7A57;
  --text:#444;
  --hdr-h:65px;            /* header height */
}
html{ scroll-padding-top: var(--hdr-h) !important; }
body{ padding-top: var(--hdr-h) !important; font-family: "Roboto", system-ui, -apple-system, Segoe UI, Arial, sans-serif; }

/* ====== HEADER — ULTRA HIGH SPECIFICITY & DEBUG ======
   আমরা সবচেয়ে কমন সব র‍্যাপারের ওপর একই রুল বসাচ্ছি।
*/
header#header.header.autohide.sticky,
header#header.header,
.site-header,
header.header,
header#header,
#header,
[class*="site-header"],
[class*="header"].sticky,
[class*="header"].autohide,
[class*="header"][style]{
  background:#d11616 !important;
  background-position:50% 0 !important;
  background-size:cover !important;
  color: rgb(68,68,68) !important;
  font-size:14px !important;
  line-height:21px !important;
  min-height: var(--hdr-h) !important;
  border-bottom:1px solid rgb(214,224,235) !important;

  /* ডিবাগ: প্রথমে thin লাল বর্ডার রাখছি যাতে বোঝা যায় রুল apply হচ্ছে।
     ভিজ্যুয়ালি ঠিক হলে border: none করে দিও। */
  outline: 1px solid rgba(255,0,0,.15) !important;

  position: fixed !important;
  top:0; left:0; right:0;
  z-index:1030 !important;
  transition: all .3s ease-out !important;
}

/* inner wrappers যেন উলটো bg/border না বসায় */
header#header .header-main,
header#header .header-wrapper,
header#header .main-bar,
.site-header .header-main,
.site-header .header-wrapper,
.site-header .main-bar{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  min-height: var(--hdr-h) !important;
}

/* লিঙ্ক কালার */
header#header a, .site-header a{
  color: rgb(68,68,68) !important;
  text-decoration: none !important;
}
header#header a:hover, .site-header a:hover{
  color: var(--brand-primary) !important;
}

/* ====== POPULAR CATEGORIES BAR ====== */
.home .popular-categories, .popular-categories{
  background:#C1A889 !important;       /* চাইলে exact hex দিও */
  padding:20px 0 !important;
  border:0 !important;
}

/* ====== PRODUCT GRID (ratio + hover) ====== */
.woocommerce ul.products li.product a img{
  aspect-ratio:4/5 !important;
  object-fit:cover !important;
  border-radius:12px !important;
}
.woocommerce ul.products li.product{
  transition: transform .15s ease, box-shadow .15s ease !important;
}
.woocommerce ul.products li.product:hover{
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.08) !important;
}

/* === FIX: match real header class autohide_sticky === */
header#header.header.autohide_sticky,
header#header.autohide_sticky,
#header.autohide_sticky{
  background:#d11616 !important;
  background-position:50% 0 !important;
  background-size:cover !important;
  color:rgb(68,68,68) !important;
  font-family:"Roboto",sans-serif !important;
  font-size:14px !important;
  line-height:21px !important;
  min-height:65px !important;
  border-bottom:1px solid rgb(214,224,235) !important;
  position:fixed !important;
  top:0; left:0; right:0;
  z-index:1030 !important;
  transition:all .3s ease-out !important;
}

/* inner wrappers */
#header.autohide_sticky .header__wrapper,
#header.autohide_sticky .header-main,
#header.autohide_sticky .header-main__wrap,
#header.autohide_sticky .mainmenu-wrap{
  background:transparent !important;
  border:0 !important;
  min-height:65px !important;
  box-shadow:none !important;
}

/* theme draws a background bar using this container — neutralize it */
#header .header-bg-container.fill{
  background:#fff !important;
  border-bottom:1px solid rgb(214,224,235) !important;
  height:65px !important;
}

/* links */
#header.autohide_sticky a{ color:rgb(68,68,68) !important; text-decoration:none !important; }
#header.autohide_sticky a:hover{ color:#0E7A57 !important; }

/* keep content clear under fixed header */
html{ scroll-padding-top:65px !important; }
body{ padding-top:65px !important; }

/* Popular Categories strip */
.home .popular-categories, .popular-categories{
  background:#C1A889 !important;
  padding:20px 0 !important;
  border:0 !important;
}

/* ========== KILL OVERLAY & FORCE OUR STYLES (DEBUG) ========== */

/* থিমের ব্যাকগ্রাউন্ড লেয়ারটা সাময়িকভাবে বন্ধ */
#header .header-bg-container.fill{
  display:none !important;        /* ← ডিবাগ: আগে এটাকে মেরে দাও */
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

/* হেডারকে একদম স্পষ্ট করে দাও */
#header.autohide_sticky{
  background: #d11616 !important;
  background-image: none !important;      /* ← কোনো bg image থাকলে বন্ধ */
  border-bottom: 4px solid #ff0055 !important; /* ← মোটা পিঙ্ক বর্ডার (ডিবাগে চোখে পড়বে) */
  min-height: 85px !important;            /* ← ডিবাগে হাইট বাড়িয়ে দিচ্ছি */
  position: fixed !important;
  top: 0; left: 0; right: 0;
  z-index: 50000 !important;              /* ← সব কিছুর উপরে */
}

/* ভিতরের র‍্যাপারেও কোনো শেডো/বর্ডার থাকলে হটাও */
#header.autohide_sticky .header__wrapper,
#header.autohide_sticky .header-main,
#header.autohide_sticky .header-main__wrap,
#header.autohide_sticky .mainmenu-wrap{
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* লিংক কালার */
#header.autohide_sticky a{
  color: #444 !important; text-decoration: none !important;
}
#header.autohide_sticky a:hover{
  color: #0E7A57 !important;
}

/* কন্টেন্টকে নিচে নামাও (fixed header clearance) */
html{ scroll-padding-top: 85px !important; }   /* ডিবাগ হাইট অনুযায়ী */
body{ padding-top: 85px !important; }