:root{
  --cc-grid-line: #000000;
}

/* =========================
   Header behavior
   ========================= */
/* popup Search */
/* Comment: Fullscreen modal wrapper */
#cc-husky-search-modal {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
}

/* Comment: Visible state */
#cc-husky-search-modal.is-open {
    display: block;
}

/* Comment: Dark overlay */
#cc-husky-search-modal .cc-husky-search-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
}

/* Comment: Centered dialog */
#cc-husky-search-modal .cc-husky-search-dialog {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(700px, 92vw);
    max-height: 80vh;
    overflow: visible;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.22);
    padding:26px 44px 15px 15px;
}

/* Comment: Mobile spacing */
@media (max-width: 767px) {
    #cc-husky-search-modal .cc-husky-search-dialog {
        width: 92vw;
        padding: 22px 16px 18px;
        border-radius: 14px;
    }
}

/* Comment: Close button */
#cc-husky-search-modal .cc-husky-search-close {
    position: absolute;
    top: 10px;
    right: 14px;
    width: 36px;
    height: 36px;
    border: 0;
    background: transparent;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}

/* Comment: Keep search results visible */
#cc-husky-search-modal .cc-husky-search-inner,
#cc-husky-search-modal .woof,
#cc-husky-search-modal .woof_text_search_container {
    overflow: visible !important;
}

/* Comment: Input style */
#cc-husky-search-modal .woof_husky_txt-input {
    width: 100%;
    min-height: 52px;
    border: 1px solid #d8d8d8;
    border-radius: 12px;
    padding: 0 16px;
    font-size: 16px;
    outline: none;
    box-shadow: none;
}

/* Comment: Dropdown results */
#cc-husky-search-modal .ui-autocomplete,
#cc-husky-search-modal .woof_text_search_container_result,
#cc-husky-search-modal .woof_text_search_results {
    z-index: 1000000 !important;
}

/* Comment: Optional body lock */
body.cc-husky-search-open {
    overflow: hidden;
}


/* Popup Search */
   
   
/*
Popup style
*/

.cc-age-step-2{
    display: none;
}

.dialog-widget.cc-age-denied .cc-age-step-1{
    display: none;
}

.dialog-widget.cc-age-denied .cc-age-step-2{
    display: block; 
}

.dialog-widget.cc-age-popup-fadeout{
    opacity: 0;
    transition: opacity 0.3s ease;
}


/*
Popup style
*/


/* Home: header overlays hero */
body.home .cc-site-header{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: transparent;
}

/* If WP admin bar exists, push header down */
body.home.admin-bar .cc-site-header{
  top: 32px;
}

/* Other pages: normal header */
body:not(.home) .cc-site-header{
  position: relative;
  background: #fff;
  z-index: 10;
}

/* Sticky header styling */
.elementor-sticky--effects .cc-site-header{
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
}


/* =========================
   Hero layers
   Classes (Elementor):
   - Hero container: cc-hero
   - Image widget wrapper: cc-hero-poster
   - HTML widget wrapper: cc-hero-video
   - Content container: cc-hero-content
   ========================= */

.cc-hero{
  position: relative;
  overflow: hidden;

  /* Prevent zero-height hero when media layers are absolute */
  /*min-height: 70vh;*/

  /* Make it easy to position content */
  display: flex;
  align-items: center;      /* vertical center */
}

/* Optional: smaller hero on tablet/mobile */
@media (max-width: 1024px){
  .cc-hero{ min-height: 50vh; }
}

/* Poster layer (fallback) */
.cc-hero .cc-hero-poster{
  position: absolute;
  inset: 0;
  z-index: 0;
}
.cc-hero .cc-hero-poster img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Video layer (desktop) */
.cc-hero .cc-hero-video{
  position: absolute; /* IMPORTANT: do NOT comment this */
  inset: 0;
  z-index: 1;
}
.cc-hero .cc-hero-video video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Optional: dark overlay for readability */
.cc-hero::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: rgba(0,0,0,.28);
}

/* Content layer (LEFT aligned) */
.cc-hero .cc-hero-content {
    position: relative;
    z-index: 3;
    width: 100%;
    margin: 0 auto;
    padding: 0 24px;
    text-align: left;
    padding-top: 8%;
}

/* SHOP STYLE */

.eael-woo-product-carousel-container.preset-3 .product-details-wrap {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}
/* No gap */
ul.products.eael-post-appender{
  gap: 0 !important;
  border-top: 1px solid var(--cc-grid-line);
  border-left: 1px solid var(--cc-grid-line);
}

/* Clean li */
ul.products.eael-post-appender > li.product{
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Remove any existing borders */
ul.products.eael-post-appender > li.product .eael-product-wrap{
  box-sizing: border-box;
  height: 100%;
}
.eael-product-grid .woocommerce ul.products .product .eael-product-wrap, .eael-post-grid .woocommerce ul.products .product .eael-product-wrap {

    border-right: 1px solid #000000;
}
/* Draw RIGHT + BOTTOM lines per item (never doubles in thickness) */
ul.products.eael-post-appender > li.product .eael-product-wrap{
  box-shadow: inset -0.1px 0 0 #000000, inset 0 -0.6px 0 var(--cc-grid-line);
}

/* SHOP STYLE END */

/*
 Single product style start
*/

/* =========================================================
   Elementor Single Product â€” EAEL Product Images
   You will add TWO classes in Elementor:

   1) Gallery column/container (wraps the images widget):  pdp-gallery
      (in your HTML: container elementor-element-6dcf1f1)

   2) Summary column/container (wraps product info widgets): pdp-summary
      (in your HTML: container elementor-element-a7bfbc1)
   ========================================================= */


/* =========================================================
   OPTION A (Recommended): Desktop = images stacked vertically (PAGE scroll)
   Mobile = slider (default swiper)
   ========================================================= */

/* Desktop */
@media (min-width: 768px){

  /* 1) Gallery: disable swiper sliding and stack slides */
  .pdp-gallery .product_image_slider__container .swiper-wrapper{
    transform: none !important;
    transition: none !important;
    display: block !important;
    height: auto !important;
  }

  .pdp-gallery .product_image_slider__container .swiper-slide{
    width: 100% !important;
    height: auto !important;
    flex: none !important;
    display: block !important;
    margin: 0 0 16px 0; /* spacing between images */
  }

  .pdp-gallery .image_slider__image img{
    width: 100%;
    height: auto;
    display: block;
  }

  /* Optional: hide arrows/pagination on desktop */
  .pdp-gallery .swiper-button-next,
  .pdp-gallery .swiper-button-prev,
  .pdp-gallery .swiper-pagination{
    display: none !important;
  }

  /* 2) Summary: sticky while the page scrolls down images */
  .pdp-summary{
    position: sticky;
    top: 90px; /* adjust based on your sticky header height */
    align-self: flex-start;
  }

  /* Sticky can fail if a parent has overflow hidden */
  .pdp-summary{
    overflow: visible !important;
  }
}

/* Mobile */
@media (max-width: 767px){

  /* Keep swiper slider behavior */
  .pdp-gallery .product_image_slider__container .swiper-wrapper{
    display: flex !important;
  }

  /* Disable sticky on mobile */
  .pdp-summary{
    position: static;
    top: auto;
  }
}


@media (min-width: 768px){

  .pdp-gallery .product_image_slider__container{
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }

  .pdp-gallery .product_image_slider__container .swiper-wrapper{
    transform: none !important;
    transition: none !important;
    display: block !important;
    height: auto !important;
  }

  .pdp-gallery .product_image_slider__container .swiper-slide{
    width: 100% !important;
    height: auto !important;
    flex: none !important;
    display: block !important;
    margin: 0 0 16px 0;
  }

  .pdp-gallery .image_slider__image img{
    width: 100%;
    height: auto;
    display: block;
  }

  .pdp-gallery .swiper-button-next,
  .pdp-gallery .swiper-button-prev,
  .pdp-gallery .swiper-pagination{
    display: none !important;
  }
}

.eael-single-product-price:has(> p.price:empty) {
  display: none;
}
.cc-product-categories__item a {
    font-family: Founders Grotesk;
    text-transform: uppercase;
    font-size: 15px;
}

.cc-product-categories__item a:hover {
    border-bottom: 2px solid #000;
}
.cc-product-categories{
  padding-left: 16px;
  display: flex;
  list-style-type: disclosure-closed;
  gap: 10px;
  color: #1ab25d;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.cc-product-categories__item{margin-right: 20px;}

/*
 Single product style end
*/
.eael-woo-product-carousel-container.preset-3 .eael-product-carousel {
    margin: 2px;
}
.woocommerce-error, .woocommerce-info, .woocommerce-message a {
    font-family: Founders Grotesk, sans-serif !important;
    font-weight: 400;
    letter-spacing: .5px;
    background-color: unset;
}
.woocommerce-notices-wrapper .woocommerce-message {
    background-color: white;
    border-bottom: 1px solid #000000;
    border-top: unset;
    margin:0;
}
.wc-block-cart .wc-block-cart__submit-container .wc-block-components-button__text {
    color: white;
}

button.wc-block-components-button.wp-element-button.wc-block-components-totals-coupon__button.contained {
    border: 1px solid black;
    color: black;
}
button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.contained {
    background-color: #006f47;
    color: white;
    border: 1px solid #006f47;
}
.woocommerce-notices-wrapper .woocommerce-message a {
    background-color: unset;
    font-family: Founders Grotesk, sans-serif !important;
    font-weight: 400;
    letter-spacing: .5px;
}

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button:hover {
    background-color: unset;
    text-decoration: underline;
}
/*
Related product
*/
.related-product-single .eael-product-grid.eael-product-simple .woocommerce ul.products li.product .button::before, .eael-product-grid.eael-product-simple .woocommerce ul.products li.product .button.add_to_cart_button::before{
    content:unset;
}
.related-product-single .eael-product-title {
    min-height: 75px;
    padding: 0 10px;
}
/*
End Related product
*/

/*
Start Tabs in signle product
*/
 .woocommerce .cc-tabs-single .woocommerce-tabs ul.wc-tabs li:not(.active) a, .woocommerce .cc-tabs-single .woocommerce-tabs ul.wc-tabs li.active a {
    padding: 5px 25px;
}
.woocommerce div.product.elementor .cc-tabs-single  ul.tabs {
    padding: 0 0 0 5px;
}
.woocommerce .cc-tabs-single .woocommerce-tabs .woocommerce-Tabs-panel {
    border: 1px solid black;
    overflow: hidden;
}
.woocommerce .cc-tabs-single .woocommerce-tabs ul.wc-tabs li.active a {
    background-color: #c4c4c4;
}
.woocommerce .elementor-323 .elementor-element.elementor-element-ce04dee .woocommerce-tabs .woocommerce-Tabs-panel {
    overflow-y: auto;
    height: 540px;
}

/*
End Tabs in single product
*/

/* Start Cart Page */
 .eael-woo-cart.woocommerce-cart .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .product-quantity .quantity {
    border: 1px solid black;
}

/* End Cart Page */


/* Start Checkout page */


.q1-checkout-notices {
  margin: 24px 0;
}

.q1-checkout-notice {
  margin: 0 0 14px;
  padding: 14px 16px;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  line-height: 1.7;
  font-size: 14px;
}

.q1-checkout-notice--warning {
  background: #fff8e5;
  border-color: #e7cf8b;
}

.q1-checkout-notice--danger {
  background: #fff1f1;
  border-color: #e3a7a7;
}

.q1-checkout-notice--info {
  background: #f6f8fb;
  border-color: #cfd8e3;
}

.q1-checkout-policies {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
  font-size: 14px;
}

.q1-checkout-policies span {
  opacity: 0.6;
}
.q1-checkout-notices,
.q1-checkout-notice {
  margin-bottom: 16px;
}
.q1-checkout-policies a {
  text-decoration: underline;
}

@media (max-width: 767px) {
  .q1-checkout-notice {
    font-size: 13px;
    padding: 12px 14px;
  }

  .q1-checkout-policies {
    gap: 8px;
  }
}

/* End Checkout page */




/* Hide video on tablet/mobile (backup even if Elementor responsive is set) */
@media (max-width: 1024px){
  .cc-hero .cc-hero-video{ display: none; }
  
    .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs > li{
      margin: 0 !important;
    }
    

  /* Reset spacing */
  .woocommerce div.product.elementor .cc-tabs-single ul.tabs{
    padding: 0;
    margin: 0;
  }

  /* UL as a framed 2-col grid */
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs{
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    list-style: none;

    position: relative;

    /* Frame: top + left */
    border-top: 1px solid var(--cc-grid-line);
    border-left: 1px solid var(--cc-grid-line);
  }

  /* Remove Woo default pseudo lines */
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs::before,
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs::after{
    content: none;
    display: none;
  }

  /* Add right + bottom frame */
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs{
    overflow: hidden;
  }
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs::after{
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-right: 1px solid var(--cc-grid-line);
    border-bottom: 1px solid var(--cc-grid-line);
    display: block;
  }

  /* LI as 2 columns, draw only right + bottom inner lines */
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs > li{
    float: none;
    flex: 0 0 50%;
    max-width: 50%;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 !important;;                 /* IMPORTANT */
  }

  /* Make the <a> fill the cell */
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs > li > a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: 12px 10px;
    text-align: center;
    text-decoration: none;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0px;
    border-bottom: 1px solid black;
    border-right: 1px solid black;
  }

  /* Active tab */
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs > li.active a{
    background: #c4c4c4;
  }

  /* Prevent double line between tabs header and panel border */
  .woocommerce .cc-tabs-single .woocommerce-tabs .woocommerce-Tabs-panel{
    border-top: 0;
  }



}

@media (max-width: 768px){
    
    .cc-hero .cc-hero-content {
    padding-top: 28%;
  }
  /*
  Cart page style
  */
  
  
.woocommerce-cart.eael-woo-cart .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table {min-width: unset;}

.woocommerce-cart.eael-woo-cart .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-header {
    display: none;
}

.woocommerce-cart.eael-woo-cart .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body {
    display: block;
    width: 100%;
}

.woocommerce-cart .eael-woo-cart-wrapper form.eael-woo-cart-form .eael-woo-cart-table .eael-wc-table-body .eael-wct-tr {
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.woocommerce-cart.eael-woo-cart .elementor-419 .elementor-element.elementor-element-fec00a5 .eael-woo-cart-wrapper form.eael-woo-cart-form .eael-woo-cart-table .elementor-repeater-item-1930ffb {
    width: 100%;
    text-align: center;
    justify-content: center;
}

.woocommerce-cart.eael-woo-cart .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wct-tr .eael-wct-td {
    padding: 0;
}

.woocommerce-cart.eael-woo-cart .elementor-419 .elementor-element.elementor-element-fec00a5 .eael-woo-cart-wrapper form.eael-woo-cart-form .eael-woo-cart-table .elementor-repeater-item-1930ffb a .woocommerce img, .woocommerce-page img {
    width: 40%;
}

.woocommerce-cart.eael-woo-cart .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .product-quantity .quantity .eael-cart-qty-plus, .eael-woo-cart .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .product-quantity .quantity .eael-cart-qty-minus,.eael-woo-cart .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .product-quantity .quantity input[type=number] {
    padding: 1px 15px;
}
  
  
/*
Cart page
*/

}

.eael-single-product-images .product_image_slider__container {
    margin: 0;
}

/* Optional: on very small screens, switch to 1 column */
@media (max-width: 426px){
  .cc-tabs-single .woocommerce-tabs ul.tabs.wc-tabs > li{
    flex: 0 0 100%;
    max-width: 100%;
  }
}
