/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 6,000+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.12.6.1775601766
Updated: 2026-04-07 22:42:46

*/

/* =====================
   CATEGORY SECTION
===================== */

#shop-by-category ul.products {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  gap: 20px !important;
  padding: 0 0 10px 0 !important;
  margin: 0 !important;
}

#shop-by-category ul.products li.product-category {
  background: #ffffff !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  text-align: center !important;
  margin-bottom: 0 !important;
  flex: 0 0 120px !important;
}

#shop-by-category ul.products li.product-category:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
}

#shop-by-category ul.products li.product-category a {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  padding-bottom: 100% !important;
  height: 0 !important;
}

#shop-by-category ul.products li.product-category a img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  padding-bottom: 0 !important;
}

#shop-by-category ul.products li.product-category a .woocommerce-loop-category__title {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 10px !important;
  color: #ffffff !important;
  background: rgba(30, 41, 59, 0.75) !important;
  display: block !important;
}

#shop-by-category ul.products li.product-category:hover .woocommerce-loop-category__title {
  background: rgba(205, 167, 72, 0.9) !important;
  color: #ffffff !important;
}

#shop-by-category ul.products li.product-category .count {
  display: none !important;
}

@media (max-width: 768px) {
  #shop-by-category ul.products li.product-category {
    flex: 0 0 150px !important;
  }
}

@media (max-width: 480px) {
  #shop-by-category ul.products li.product-category {
    flex: 0 0 120px !important;
  }
}


/* =====================
   SHOP PAGE FIX
===================== */

ul.products.columns-4 {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  flex-wrap: unset !important;
  overflow-x: unset !important;
  gap: 20px !important;
}

ul.products.columns-3 {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  flex-wrap: unset !important;
  overflow-x: unset !important;
  gap: 20px !important;
}

ul.products.columns-4 li.product,
ul.products.columns-3 li.product {
  flex: unset !important;
  width: 100% !important;
  margin: 0 !important;
}


/* =====================
   PRODUCT CAROUSEL
===================== */

.eael-woo-product-carousel .product.swiper-slide .eael-product-carousel {
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}

.eael-woo-product-carousel .product.swiper-slide:hover .eael-product-carousel {
  transform: translateY(-8px) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.15) !important;
}

.eael-woo-product-carousel .product.swiper-slide .image-wrap img {
  transition: transform 0.4s ease !important;
}

.eael-woo-product-carousel .product.swiper-slide:hover .image-wrap img {
  transform: scale(1.08) !important;
}

.eael-woo-product-carousel .product.swiper-slide:hover .eael-product-title a {
  color: #cda748 !important;
}

.eael-woo-product-carousel .eael-product-title a {
  transition: color 0.3s ease !important;
}

/* Search input */
.ast-search-menu-icon .search-field {
  border-radius: 20px !important;
  border: 2px solid #e5c777 !important;
  padding: 8px 16px !important;
}

/* FiboSearch results dropdown */
.dgwt-wcas-search-wrapp {
  border-radius: 12px !important;
}

/* FiboSearch result item hover */
.dgwt-wcas-suggestion:hover {
  background: #f9f5ee !important;
}

/* FiboSearch product price color */
.dgwt-wcas-sp .dgwt-wcas-sp-price {
  color: #cda748 !important;
}


/* Search icon color */
.ast-search-menu-icon .astra-search-icon {
  color: #e5c777 !important;
}

/* Search bar width when expanded */
.ast-search-menu-icon.slide-search .ast-search-icon,
.ast-search-menu-icon .search-field {
  width: 400px !important;
}

/* FiboSearch results dropdown width */
.dgwt-wcas-search-wrapp {
  width: 400px !important;
}
/* Always show search bar open */
.ast-search-menu-icon .ast-search-icon {
  display: none !important;
}

.ast-search-menu-icon.slide-search .search-form,
.ast-search-menu-icon .search-form {
  visibility: visible !important;
  opacity: 1 !important;
  width: 400px !important;
}




@media (max-width: 768px) {
    .wc-block-product-filters__open-overlay {
        display: none !important;
    }
}

@media (min-width: 769px) {
    .woof_show_mobile_filter {
        display: none !important;
    }
}

@media (min-width: 769px) {
    .woof_sid_widget {
        display: none !important;
    }
}

/*not working*/
/*body .woof_loader,*/
/*body .woof_loader:before {*/
/*    border-color: #ff0000 !important;*/
/*    border-top-color: #ff0000 !important;*/
/*}*/


body.ast-main-header-nav-open {
    overflow: hidden !important;
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
}

/* Overlay */
.ast-menu-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);

    z-index: 999;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition: opacity 0.25s ease, visibility 0.25s ease;
}

.ast-menu-overlay.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

body.ast-main-header-nav-open {
    overflow: hidden !important;
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
}

/*fix fibosearch alignments*/

/* Active state */
.ast-menu-overlay.is-active {
    opacity: 1;
    pointer-events: auto;
}

.dgwt-wcas-search-wrapp {
    display: flex;
    align-items: center;
    height: 100%;
}

.dgwt-wcas-search-form {
    height: 100%;
    display: flex;
    align-items: center;
}

.dgwt-wcas-sf-wrapp {
    display: flex;
    align-items: center;
}

/* Ensure sticky header is always above form elements */
.site-header,
.ast-sticky-main-header-bar-alignment {
    z-index: 99999 !important;
}

/* Fix Select2 stacking context */
.select2-container {
    z-index: 9999 !important;
}

/* Dropdown must be BELOW header, but above page content */
.select2-dropdown {
    z-index: 9998 !important;
}

/* WooCommerce checkout form stacking fix */
.woocommerce form .form-row {
    position: relative;
    z-index: 1;
}

/*mobile menu styling */
/* =====================
   MOBILE MENU — BRANDED GOLD STYLE
   Exact selectors from rihambrands.com HTML
===================== */

@media (max-width: 921px) {

    /* ── Container ── */
    .ast-builder-menu-mobile .main-navigation {
        background: #ffffff !important;
        border-top: 3px solid #CDA748 !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10) !important;
        border-radius: 0 0 16px 16px !important;
        padding: 4px 0 12px !important;
        overflow-y: auto !important;
        max-height: calc(100vh - 110px) !important; /* 110px = your fixed header height */
    }

    /* ── Top-level items ── */
    #ast-hf-mobile-menu > .menu-item > a.menu-link {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 9px 16px !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        color: #1a1a1a !important;
        text-decoration: none !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
        transition: background 0.2s ease, color 0.2s ease, padding-left 0.2s ease !important;
        position: relative !important;
    }

    #ast-hf-mobile-menu > .menu-item > a.menu-link:hover {
        background: rgba(205, 167, 72, 0.08) !important;
        color: #CDA748 !important;
        padding-left: 20px !important;
    }

    /* ── Active / current page ── */
    #ast-hf-mobile-menu > .current-menu-item > a.menu-link,
    #ast-hf-mobile-menu > .current-menu-ancestor > a.menu-link {
        color: #CDA748 !important;
        font-weight: 600 !important;
        background: rgba(205, 167, 72, 0.06) !important;
    }

    /* ── Gold left bar on active item ── */
    #ast-hf-mobile-menu > .current-menu-item > a.menu-link::before,
    #ast-hf-mobile-menu > .current-menu-ancestor > a.menu-link::before {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        width: 3px !important;
        background: #CDA748 !important;
    }

    /* ── Hide the arrow SVG inside top-level <a> links (not the toggle button) ── */
    #ast-hf-mobile-menu > .menu-item > a.menu-link .ast-icon.icon-arrow {
        display: none !important;
    }

    /* ── Keep toggle button functional but invisible — stretch over the whole row ── */
    #ast-hf-mobile-menu .menu-item-has-children {
        position: relative !important;
    }

    #ast-hf-mobile-menu .ast-menu-toggle {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        opacity: 0 !important;
        cursor: pointer !important;
        z-index: 3 !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* ── The built-in <span class="dropdown-menu-toggle"> inside <a> acts as our indicator ── */
    /* Hide the SVG inside it, replace with a clean CSS chevron */
    #ast-hf-mobile-menu .menu-item-has-children > a.menu-link .dropdown-menu-toggle .ast-icon {
        display: none !important;
    }

    #ast-hf-mobile-menu .menu-item-has-children > a.menu-link .dropdown-menu-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 20px !important;
        height: 20px !important;
        margin-left: 8px !important;
        flex-shrink: 0 !important;
        vertical-align: middle !important;
        position: relative !important;
    }

    /* CSS chevron via ::after on the span */
    #ast-hf-mobile-menu .menu-item-has-children > a.menu-link .dropdown-menu-toggle::after {
        content: "" !important;
        display: block !important;
        width: 7px !important;
        height: 7px !important;
        border-right: 2px solid #CDA748 !important;
        border-bottom: 2px solid #CDA748 !important;
        transform: rotate(45deg) translateY(-2px) !important;
        transition: transform 0.25s ease !important;
    }

    /* ── Rotate chevron when expanded ── */
    #ast-hf-mobile-menu > .menu-item-has-children.ast-submenu-expanded > a.menu-link .dropdown-menu-toggle::after {
        transform: rotate(-135deg) translateY(2px) !important;
    }

    /* ── Sub-menu container ── */
    #ast-hf-mobile-menu .sub-menu {
        background: #fafafa !important;
        border-top: 1px solid rgba(205, 167, 72, 0.15) !important;
        border-bottom: 1px solid rgba(205, 167, 72, 0.15) !important;
        padding: 4px 0 !important;
        margin: 0 !important;
    }

    /* ── Sub-menu items ── */
    #ast-hf-mobile-menu .sub-menu .menu-item > a.menu-link {
        display: flex !important;
        align-items: center !important;
        padding: 8px 16px 8px 28px !important;
        font-size: 12px !important;
        color: #555 !important;
        font-weight: 400 !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.04) !important;
        transition: background 0.2s ease, color 0.2s ease, padding-left 0.2s ease !important;
    }

    #ast-hf-mobile-menu .sub-menu .menu-item > a.menu-link:hover {
        color: #CDA748 !important;
        background: rgba(205, 167, 72, 0.06) !important;
        padding-left: 38px !important;
    }

    /* ── Hide the arrow SVG inside sub-menu <a> links ── */
    #ast-hf-mobile-menu .sub-menu .menu-item > a.menu-link .ast-icon.icon-arrow {
        display: none !important;
    }

    /* ── Last items — no border ── */
    #ast-hf-mobile-menu > .menu-item:last-child > a.menu-link,
    #ast-hf-mobile-menu .sub-menu .menu-item:last-child > a.menu-link {
        border-bottom: none !important;
    }

    /* ── Branded tap highlight ── */
    #ast-hf-mobile-menu .menu-item > a.menu-link,
    #ast-hf-mobile-menu .ast-menu-toggle {
        -webkit-tap-highlight-color: rgba(205, 167, 72, 0.15) !important;
    }

    /* ── Hide scrollbar, keep scroll functionality ── */
    .ast-builder-menu-mobile .main-navigation {
        scrollbar-width: none !important;        /* Firefox */
        -ms-overflow-style: none !important;     /* IE/Edge */
    }

    .ast-builder-menu-mobile .main-navigation::-webkit-scrollbar {
        display: none !important;                /* Chrome/Safari */
    }
    #ast-hf-mobile-menu .menu-item > a.menu-link::after {
        display: none !important;
    }
}


/*display product img on mobile*/
@media (max-width: 768px) {
  .moderncart-cart-item-container {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .moderncart-cart-item-image {
    display: block !important;
    flex: 0 0 70px;
  }

  .moderncart-cart-item-product {
    flex: 1;
  }

  .moderncart-cart-item-image img {
    width: 70px !important;
  }
}

/* 1. Fix the swiper wrapper to a consistent height */
.swiper-container-02e8c85,
.eael-woo-product-carousel .swiper-wrapper {
  height: auto !important;
  align-items: stretch !important;
}

/* 2. Make each slide and inner card stretch equally */
.eael-woo-product-carousel .swiper-slide {
  height: auto !important;
}

.eael-woo-product-carousel .swiper-slide .eael-product-carousel {
  display: flex;
  flex-direction: column;
  height: 96%;
}

/* 3. Push product details to fill remaining space */
.eael-woo-product-carousel .product-details-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
 
}

/*.eael-woo-product-carousel .eael-product-carousel {*/
 /* padding: 0 0px 16px; /* top | sides | bottom — adjust as needed */
/*}*/

/* 4. Fix image container to a consistent height */
.eael-woo-product-carousel .image-wrap {
  aspect-ratio: 4/4;
  overflow: hidden;
}

.eael-woo-product-carousel .image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* shop */

/* ── Grid layout ── */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  align-items: stretch;
}

@media (max-width: 768px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ── Card base ── */
.woocommerce ul.products li.product {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
}

/* ── Image ── */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap {
  overflow: hidden;
}

.woocommerce ul.products li.product .astra-shop-thumbnail-wrap img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

/* ── Card content ── */
.woocommerce ul.products li.product .astra-shop-summary-wrap {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding-left: 8px;
  padding-right: 8px;
}

/* Push button to bottom */
.woocommerce ul.products li.product .astra-shop-summary-wrap .button {
  margin-top: auto;
}

/* ── Hover animations (desktop only) ── */
@media (min-width: 769px) {
  .woocommerce ul.products li.product {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    will-change: transform;
  }

  .woocommerce ul.products li.product:hover {
    transform: scale(1.03);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    z-index: 2;
  }

  .woocommerce ul.products li.product .astra-shop-thumbnail-wrap img {
    transition: transform 0.4s ease;
  }

  .woocommerce ul.products li.product:hover .astra-shop-thumbnail-wrap img {
    transform: scale(1.06);
  }
}

/* Main product image */
.woocommerce div.product div.images img {
  border-radius: 16px; /* adjust as needed */
}

/* Thumbnail images */
.woocommerce div.product div.images .flex-control-thumbs img {
  border-radius: 16px;
}

/* filter loading overlay light goldy tone*/
/* Blue overlay */
.plainoverlay {
  background-color: rgba(205, 167, 72, 0.15) !important;
}

/* Gold spinner */
.jQuery-plainOverlay-progress {
  border-color: #CDA748 !important;
  border-top-color: transparent !important;
}

/*hide it on product pages*/
.single-product .woocommerce-breadcrumb {
    display: none !important;
}