/*
Theme Name: Woostify Child
Theme URI: https://woostify.com
Template: woostify
Author: Woostify
Author URI: https://woostify.com/about
Description: Woostify is fast, lightweight, responsive and super flexible WooCommerce theme built with SEO, speed, and usability in mind. The theme works great with any of your favorite page builder likes Elementor, Beaver Builder, SiteOrigin, Thrive Architect, Divi, etc. Therefore, you can build any type of websites like shop, business agencies, corporate, portfolio, education, university portal, consulting, church, restaurant, medical and so on. Woostify is compatible with all well-coded plugins, including major ones like WooCommerce, OrbitFox, Yoast, BuddyPress, bbPress, etc. Learn more about the theme and ready to import demo sites at https://woostify.com
Tags: e-commerce,two-columns,left-sidebar,right-sidebar,custom-background,custom-colors,custom-header,custom-menu,featured-images,full-width-template,threaded-comments,rtl-language-support,footer-widgets,sticky-post,theme-options
Version: 2.4.4.1762548762
Updated: 2025-11-07 20:52:42

*/

/*----------------------------------------------
  Additional CSS cleaned, optimized !important
  Author: Santanu
  Date: 08-Nov-2025
----------------------------------------------*/

/*----------------------------------------------
  Responsive Footer Widgets - WP default
----------------------------------------------*/
@media (max-width: 600px) {
  .site-footer-widget .widget_custom_html {
    margin-bottom: 25px;
  }
}
/*----------------------------------------------
  Shop Dropdown Menu (Submenu) Customizations
----------------------------------------------*/
/* Make submenu wider */
.main-navigation ul.sub-menu {
  min-width: 230px !important; /* necessary to override parent */
}

/* Submenu hover colors */
.main-navigation ul.sub-menu li:hover > a {
  background-color: #a60000 !important; /* deep red hover */
  color: #fff !important; /* white font color */
  transition: all 0.2s ease-in-out;
}
/*----------------------------------------------
  Scrollable & Centered Circular Product Category Row
----------------------------------------------*/
.thakurghor-category-row {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  padding: 10px 0;
}

/* Hide scrollbars */
.thakurghor-category-row::-webkit-scrollbar {
  display: none;
}
.thakurghor-category-row {
  scrollbar-width: none;
}

/* Product list flex layout */
.thakurghor-category-row ul.products {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  gap: 10px;
  list-style: none;
  padding: 0 14px;
  margin: 0 auto;
  width: max-content;
}

/* Center block when few items (larger screens) */
@media (min-width: 768px) {
  .thakurghor-category-row ul.products {
    margin-left: auto;
    margin-right: auto;
  }
}

/* Category box */
.thakurghor-category-row ul.products li.product-category {
  flex: 0 0 auto;
  text-align: center;
  width: 100px;
  margin: 0;
}

/* Circular image with hover zoom */
.thakurghor-category-row ul.products li.product-category a img {
  width: 95px;
  height: 95px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  margin: 0 auto;
  transition: transform 0.3s ease;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
.thakurghor-category-row ul.products li.product-category a img:hover {
  transform: scale(1.1);
}

/* Category title */
.thakurghor-category-row ul.products li.product-category h2.woocommerce-loop-category__title {
  font-size: 13px;
  font-weight: 400; /* normal text */
  text-align: center;
  margin-top: 6px;
  line-height: 1.2em;
  min-height: 2.4em;
}

/* Hide product count ----- this is replaced by another section used below that'll work globally
.thakurghor-category-row ul.products li.product .count {
  display: none;
}*/

/* Larger screens: increase circle & title size */
@media (min-width: 768px) {
  .thakurghor-category-row ul.products li.product-category a img {
    width: 130px;
    height: 130px;
  }
  .thakurghor-category-row ul.products li.product-category {
    width: 130px;
  }
  .thakurghor-category-row ul.products li.product-category h2.woocommerce-loop-category__title {
    font-size: 14px;
  }
}

/*--------------------------------------------
 Sticky Header (Mobile + Desktop)
----------------------------------------------*/
#header,
.site-header {
  position: sticky;
  top: 0;
  z-index: 9999;
  background: rgba(255, 255, 255, 0.75);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.10);
  transition: box-shadow 0.2s ease, background 0.2s ease;
}

/* Ensure sticky works on all devices */
body {
  overflow-x: hidden;
}

/* ------------------------------------------------------ */
/* THAKURGHOR — Sticky Header Z-index Fixes (Unified)     */
/* Handles Mobile Menu, Filter Sidebar & Cart Sidebar     */
/* ------------------------------------------------------ */
/* ====================================================== */
/* 1) MOBILE MENU SIDEBAR FIX                             */
/* ====================================================== */
body.woostify-mobile-menu-open #header,
body.woostify-mobile-menu-open .site-header {
    position: fixed !important;
    z-index: 5 !important; /* push header behind menu */
    background: #fff !important;
    box-shadow: none !important;
}

/* Mobile Menu Drawer */
.sidebar-menu {
    z-index: 99999 !important; /* highest */
    position: fixed !important;
}

/* Mobile Menu Overlay */
.sidebar-menu-overlay {
    z-index: 99998 !important;
    position: fixed !important;
}
/* ====================================================== */
/* 2) FILTER SIDEBAR FIX (MOBILE)                         */
/* ====================================================== */

@media (max-width: 768px) {

    body.filter-sidebar-open #header,
    body.filter-sidebar-open .site-header {
        position: fixed !important;
        z-index: 5 !important; /* header behind filter sidebar */
        background: #fff !important;
        box-shadow: none !important;
    }

    /* WooCommerce Filter Sidebar */
    #secondary.shop-widget {
        z-index: 99999 !important; /* top layer */
        position: fixed !important;
        top: 0;
        left: 0;
        height: 100vh;
        overflow-y: auto;
        background: #fff;
    }

    /* Filter overlay */
    .woocommerce-sidebar-overlay {
        z-index: 99998 !important;
        position: fixed !important;
    }
}

/* ====================================================== */
/* 3) CART SIDEBAR FIX (RIGHT SIDEBAR)                    */
/* ====================================================== */

/* When the WooCommerce cart sidebar is open */
body.woostify-cart-open #header,
body.woostify-cart-open .site-header {
    position: fixed !important;
    z-index: 5 !important; /* push header behind cart drawer */
    background: #fff !important;
    box-shadow: none !important;
}

/* Actual Cart Sidebar (your theme uses #shop-cart-sidebar) */
#shop-cart-sidebar {
    position: fixed !important;
    top: 0;
    right: 0;
    height: 100vh;
    width: auto;
    z-index: 99999 !important; /* top-most layer */
    background: #fff;
}

/* Cart Overlay (if your theme uses one) */
.woostify-cart-overlay,
.cart-sidebar-overlay {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 99998 !important; /* between header & cart drawer */
    background: rgba(0,0,0,0.5); /* fallback */
}

/*--------------------------------------------
Hide product count in WooCommerce product categories (global)
----------------------------------------------*/
ul.products li.product-category .count {
    display: none !important;
}

/* Hide WooCommerce result count and sorting dropdown ONLY on "The Store" page */
body.page-id-8 .woocommerce-result-count,
body.page-id-8 .woocommerce-ordering {
    display: none !important;
}
/* -------------------------------------------- */
/* Thakurghor Custom CSS                        */
/* Global button style for 'View Collection' buttons */
/* Applies to all Elementor buttons with class: view-collection-btn */
/* Added on: 08-Nov-2025                        */
/* -------------------------------------------- */

/* Only style the actual button, not the whole widget wrapper */
.view-collection-btn .elementor-button {
  background-color: #b30000 !important;
  color: #fff !important;
  padding: 8px 18px !important;
  border-radius: 4px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  display: inline-block;
  text-decoration: none !important;
  transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
}

/* Hover effect */
.view-collection-btn .elementor-button:hover {
  background-color: #800000 !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}