/*
Theme Name: Sapa
Theme URI: https://sapa.thembaydev.com/
Author: Thembay
Author URI: https://thembay.com
Description: Sapa - Product Landing Page WooCommerce Theme
Version: 1.1.7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: sapa
Domain Path: /languages/
Requires PHP: 7.4
Requires at least: 5.0
Tested up to: 5.5

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


/**
 * Table of Contents
 *
 * 1.0 - Reset
 * 2.0 - Genericons
 * 3.0 - Typography
 * 4.0 - Elements
 * 5.0 - Forms
 * 6.0 - Navigations
 *   6.1 - Links
 *   6.2 - Menus
 * 7.0 - Accessibility
 * 8.0 - Alignments
 * 9.0 - Clearings
 * 10.0 - Header
 * 11.0 - Widgets
 * 12.0 - Content
 *    12.1 - Posts and pages
 *    12.2 - Post Formats
 *    12.3 - Comments
 * 13.0 - Footer
 * 14.0 - Media
 *    14.1 - Captions
 *    14.2 - Galleries
 * 15.0 - Multisite
 * 16.0 - Media Queries
 *    16.1 - Mobile Large
 *    16.2 - Tablet Small
 *    16.3 - Tablet Large
 *    16.4 - Desktop Small
 *    16.5 - Desktop Medium
 *    16.6 - Desktop Large
 *    16.7 - Desktop X-Large
 * 17.0 - Print
 */


/**
 * 1.0 - Reset
 *
 * Resetting and rebuilding styles have been helped along thanks to the fine
 * work of Eric Meyer, Nicolas Gallagher, Jonathan Neal, and Blueprint.
 */
img{
    max-width: 100%;
    height:auto;
 }
 
 .sticky{
    background: #FFFFFF;
 }
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
	color: #333;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000; /* Above WP toolbar. */
}
.gallery-caption,
.bypostauthor {
  font-style: italic;
  font-size: 12px;
  color: #757575;
}

/**
 *  Gallery
 * -----------------------------------------------------------------------------
 */
 #tbay-main-content .single-post .gallery {
	padding-top: 30px;
	margin-right: -25px;
 }
  .gallery .gallery-item a {
	  margin: 0;
  }
 .gallery .gallery-item {
    float: left;
    margin: 0 4px 4px 0;
    overflow: hidden;
    padding: 0;
    position: relative; }
  
  .gallery-columns-1 .gallery-item {
    max-width: 100%;
    width: auto; }
  
  .gallery-columns-2 .gallery-item {
    max-width: 48%;
    max-width: -webkit-calc(50% - 14px);
    max-width: calc(50% - 14px);
    width: auto; }
  
  .gallery-columns-3 .gallery-item {
    max-width: 32%;
    max-width: -webkit-calc(33.3% - 11px);
    max-width: calc(33.3% - 11px);
    width: auto; }
  
  .gallery-columns-4 .gallery-item {
    max-width: 23%;
    max-width: -webkit-calc(25% - 9px);
    max-width: calc(25% - 9px);
    width: auto; }
  
  .gallery-columns-5 .gallery-item {
    max-width: 19%;
    max-width: -webkit-calc(20% - 8px);
    max-width: calc(20% - 8px);
    width: auto; }
  
  .gallery-columns-6 .gallery-item {
    max-width: 15%;
    max-width: -webkit-calc(16.7% - 7px);
    max-width: calc(16.7% - 7px);
    width: auto; }
  
  .gallery-columns-7 .gallery-item {
    max-width: 13%;
    max-width: -webkit-calc(14.28% - 7px);
    max-width: calc(14.28% - 7px);
    width: auto; }
  
  .gallery-columns-8 .gallery-item {
    max-width: 11%;
    max-width: -webkit-calc(12.5% - 6px);
    max-width: calc(12.5% - 6px);
    width: auto; }
  
.gallery-columns-9 .gallery-item {
    max-width: 9%;
    max-width: -webkit-calc(11.1% - 6px);
    max-width: calc(11.1% - 6px);
    width: auto; }
  
  .gallery-columns-1 .gallery-item:nth-of-type(1n),.gallery-columns-2 .gallery-item:nth-of-type(2n),.gallery-columns-3 .gallery-item:nth-of-type(3n),.gallery-columns-4 .gallery-item:nth-of-type(4n),.gallery-columns-5 .gallery-item:nth-of-type(5n),.gallery-columns-6 .gallery-item:nth-of-type(6n),.gallery-columns-7 .gallery-item:nth-of-type(7n),.gallery-columns-8 .gallery-item:nth-of-type(8n),.gallery-columns-9 .gallery-item:nth-of-type(9n) {
    margin-right: 0; }
  
  .gallery .gallery-caption {
    background-color: rgba(0,0,0,.7);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    font-size: 12px;
    line-height: 1.5;
    margin: 0;
    max-height: 85%;
    opacity: 0;
    padding: 6px 8px;
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: left;
    width: 100%; }
  
  .gallery .gallery-caption:before {
    content: "";
    height: 100%;
    min-height: 49px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; }
  
  .gallery-item:hover .gallery-caption {
    opacity: 1; }
  
  .gallery-columns-7 .gallery-caption,.gallery-columns-8 .gallery-caption,.gallery-columns-9 .gallery-caption {
    display: none; }
  
  .gallery-columns-2 .gallery-item:nth-child(odd),.gallery-columns-3 .gallery-item:nth-child(3n+1),.gallery-columns-4 .gallery-item:nth-child(4n+1),.gallery-columns-5 .gallery-item:nth-child(5n+1),.gallery-columns-6 .gallery-item:nth-child(6n+1),.gallery-columns-7 .gallery-item:nth-child(7n+1),.gallery-columns-8 .gallery-item:nth-child(8n+1),.gallery-columns-9 .gallery-item:nth-child(9n+1) {
    clear: both; }

/* === Custom chemical product card layout (shop grid) === */
/* Equal-height product cards in grid */
.products-grid.row {
    display: flex;
    flex-wrap: wrap;
}
.products-grid.row > [class*="col-"] {
    display: flex;
}
.products-grid .product {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.product-content--custom-card{
    background:#ffffff;
    border-radius:24px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    flex: 1 1 auto;
    height:100%;
    min-height: 0;
    box-shadow:0 6px 18px rgba(0,0,0,0.06);
    max-width:420px;
    margin:0 auto;
    width: 100%;
}

.product-content--custom-card .custom-card-inner{
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.product-content--custom-card .custom-card-image{
    background:#f3f4f6;
    padding:0;
    text-align:center;
    flex-shrink: 0;
    min-height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Direct link+img (no figure) – always visible on mobile and desktop */
.product-content--custom-card .custom-card-image .product-image{
    display: block !important;
    width: 100%;
    height: 100%;
    min-height: 100%;
}
.product-content--custom-card .custom-card-image .product-image img{
    width:100%;
    height:auto;
    max-height: 240px;
    object-fit: contain;
    background:#f3f4f6;
}

/* Ensure product image always shows (override theme hide/lazy rules) */
.product-content--custom-card .custom-card-image .product-image,
.product-content--custom-card .custom-card-image .product-image img{
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}
.product-content--custom-card .custom-card-image .product-image .image-no-effect+img{
    display: block !important;
}
.product-content--custom-card .custom-card-image .product-image:not(.image-loaded) img{
    opacity: 1 !important;
}

 /* Mobile: one product per row + ensure image visible */
 @media (max-width: 767px) {
     .products.products-grid > .row > .product,
     .products.products-grid > .row > [class*="col-"] {
         flex: 0 0 100% !important;
         max-width: 100% !important;
     }
     .product-content--custom-card .custom-card-image{
         min-height: 170px;
         height: 170px;
     }
     .product-content--custom-card .custom-card-image .product-image img{
         height: 100% !important;
         max-height: none;
         object-fit: contain;
     }
     .product-content--custom-card .custom-card-image,
     .product-content--custom-card .custom-card-image .product-image,
     .product-content--custom-card .custom-card-image .product-image img{
         display: block !important;
         opacity: 1 !important;
         visibility: visible !important;
     }
 }

 .sapa-product-image-modal{
     position: fixed;
     inset: 0;
     z-index: 100002;
     display: none;
     align-items: center;
     justify-content: center;
     padding: 24px;
 }
 .sapa-product-image-modal.is-open{
     display: flex;
 }
 .sapa-product-image-modal__backdrop{
     position: absolute;
     inset: 0;
     background: rgba(0,0,0,0.78);
 }
 .sapa-product-image-modal__dialog{
     position: relative;
     z-index: 1;
     background: #ffffff;
     border-radius: 8px;
     max-width: min(90vw, 420px);
     width: 100%;
     max-height: min(75vh, 420px);
     padding: 18px;
     box-shadow: 0 14px 40px rgba(0,0,0,0.25);
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
 }
 .sapa-product-image-modal__img{
     width: 100%;
     height: auto;
     max-height: calc(min(75vh, 420px) - 52px);
     object-fit: contain;
     display: block;
 }
 .sapa-product-image-modal__title{
     margin-top: 10px;
     font-size: 14px;
     line-height: 1.3;
     font-weight: 600;
     color: #111827;
     text-align: center;
     width: 100%;
 }
 .sapa-product-image-modal__close{
     position: absolute;
     top: 8px;
     right: 8px;
     width: 32px;
     height: 32px;
     padding: 0;
     border: 0;
     border-radius: 50% !important;
     background: transparent;
     color: #1f2937;
     font-size: 18px;
     line-height: 1;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     box-sizing: border-box;
 }
 .sapa-product-image-modal__close:hover,
 .sapa-product-image-modal__close:focus{
     background: rgba(0,0,0,0.12);
     border-radius: 50% !important;
 }

 body.sapa-image-modal-open{
     overflow: hidden;
}

@media (max-width: 767px){
    body .marquee{
        overflow: hidden;
    }
    body .marquee > .e-con-inner{
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center;
    }
    body .marquee > .e-con-inner{
        width: max-content;
        animation: sapa-marquee-scroll 18s linear infinite;
        will-change: transform;
    }
    body .marquee > .e-con-inner > *{
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
    }
    body .marquee .marquee-content{
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }
    body .marquee .marquee-content,
    body .marquee .marquee-content.elementor-element,
    body .marquee .marquee-content .elementor-widget-container,
    body .marquee .marquee-content p{
        display: inline-flex !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        white-space: nowrap !important;
        flex: 0 0 auto !important;
    }

    body .marquee .marquee-content.elementor-widget-text-editor,
    body .marquee .marquee-content.elementor-widget-text-editor p,
    body .marquee .marquee-content.elementor-widget-text-editor span{
        font-size: 14px;
        line-height: 1.2;
    }
}

@keyframes sapa-marquee-scroll{
    from{ transform: translateX(0); }
    to{ transform: translateX(-50%); }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce){
    body .marquee > .e-con-inner{
        animation: none;
    }
}

.product-content--custom-card .custom-card-info{
    background:#050058;
    color:#ffffff;
    --custom-card-info-pad-x: 16px;
    padding:12px 16px 16px;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 220px;
}

.product-content--custom-card .custom-card-explore{
    margin-top: auto;
}

.product-content--custom-card .custom-card-title{
    font-size:18px;
    font-weight:700;
    margin:0 0 10px;
    color:#ffffff;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    min-width:0;
}

.product-content--custom-card .custom-card-title a,
.product-content--custom-card .name,
.product-content--custom-card .name a{
    color:#ffffff !important;
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    min-width:0;
}

.product-content--custom-card .custom-card-title a:hover,
.product-content--custom-card .custom-card-title a:focus,
.product-content--custom-card .name a:hover,
.product-content--custom-card .name a:focus{
    color:#ffffff !important;
}

.product-content--custom-card .custom-card-cas-bar{
    margin-bottom:18px;
    font-size:15px;
    font-weight:600;
    background:transparent !important;
    border-radius:0 !important;
    padding:0 !important;
}

.product-content--custom-card .custom-card-cas-label{
    margin-right:4px;
}

.product-content--custom-card .custom-card-pill-row{
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:nowrap;
    gap:12px;
    width:100%;
    margin-bottom:24px;
    min-height: 36px;
}

.product-content--custom-card .custom-card-pill-row:before{
    content:"";
    position:absolute;
    left:calc(-1 * var(--custom-card-info-pad-x, 16px));
    right:calc(-1 * var(--custom-card-info-pad-x, 16px));
    top:50%;
    transform:translateY(-50%);
    border-top:2px solid #15c079;
    z-index:0;
}

.product-content--custom-card .custom-card-pill{
    position:relative;
    z-index:1;
    padding:6px 12px;
    border-radius:999px;
    border:2px solid #15c079;
    background:#050058;
    font-size:12px;
    line-height:1;
    white-space:nowrap;
    display:inline-flex;
    align-items:center;
    gap:6px;
}

.product-content--custom-card .custom-card-explore{
    display:flex !important;
    justify-content:center !important;
    align-items:center;
    width:100%;
    text-align:center;
}

.product-content--custom-card .custom-card-explore-btn{
    display:flex !important;
    justify-content:center;
    align-items:center;
    width:100%;
    max-width:360px;
  margin:0 auto;
  margin-left:auto !important;
  margin-right:auto !important;
  float:none !important;
    height:48px;
    line-height:1 !important;
    padding:0 24px !important;
    background:#1fd4c0 !important;
    color:#ffffff !important;
    border-radius:8px;
    border:0 !important;
    box-shadow:none !important;
    text-align:center;
    text-decoration:none;
    font-size:16px;
    font-weight:600;
}

.product-content--custom-card .custom-card-explore-btn:hover,
.product-content--custom-card .custom-card-explore-btn:focus{
    background:#18bca9 !important;
    color:#ffffff !important;
    border:0 !important;
    box-shadow:none !important;
}

/* Hide shop toolbar (result count + sorting + view modes) */
.woocommerce .tbay-filter,
.woocommerce-page .tbay-filter{
    display:none !important;
}

/* Mobile shop: remove extra top space and sidebar column */
@media (max-width: 767px) {
    /* Collapse sidebar column so it takes zero space (removes extra gap) */
    .row-shop-sidebar > #sidebar-shop,
    .row-shop-sidebar > aside#sidebar-shop.sidebar.tbay-sidebar-shop {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        flex: 0 0 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        border: 0 !important;
    }
    body.post-type-archive-product .archive .row-shop-sidebar,
    body.woocommerce-shop .archive .row-shop-sidebar {
        margin-top: 0 !important;
    }
    body.post-type-archive-product .archive-shop,
    body.woocommerce-shop .archive-shop,
    body.post-type-archive-product #main.archive-shop,
    body.woocommerce-shop #main.archive-shop {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    body.tb-default.post-type-archive-product .archive-shop,
    body.tb-default.woocommerce-shop .archive-shop,
    body.tb-default.post-type-archive-product #main.archive-shop,
    body.tb-default.woocommerce-shop #main.archive-shop {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
}

/* === Product Categories filter: show checkbox next to category === */
body .widget_product_categories .product-categories .sapa-product-cat-row{
    display:flex;
    align-items:center;
    gap:10px;
}
body .widget_product_categories .product-categories .sapa-product-cat-checkbox{
    margin:0;
    width:16px;
    height:16px;
    flex:0 0 auto;
    accent-color: #0a0056;
}
body .widget_product_categories .product-categories .sapa-product-cat-checkbox:checked{
    background-color: #47baa9;
    border-color: #47baa9;
}
body .widget_product_categories .product-categories .sapa-product-cat-row > a{
    flex:1 1 auto;
    min-width:0;
}
body .widget_product_categories .product-categories .sapa-product-cat-row > a:hover,
body .widget_product_categories .product-categories .sapa-product-cat-row > a:focus{
    color: #47baa9;
}
body .widget_product_categories .product-categories a:hover,
body .widget_product_categories .product-categories a:focus{
    color: #47baa9;
}

 .sapa-shop-archive-banner{
     width: 100%;
     margin: 0 0 20px;
 }
 .sapa-shop-archive-banner img{
     display: block;
     width: 100%;
     height: auto;
 }

 body.woocommerce-shop .woocommerce-products-header__title.page-title,
 body.post-type-archive-product .woocommerce-products-header__title.page-title,
 body.tax-product_cat .woocommerce-products-header__title.page-title,
 body.tax-product_tag .woocommerce-products-header__title.page-title{
     display: none;
 }

/* === Product Categories widget title: "Filters" + "Clear All" === */
body .widget_product_categories .widget-title .sapa-filters-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    width:100%;
    position: relative;
}
body .widget_product_categories .widget-title .sapa-filters-title-text{
    font-weight: 500;
}
/* Add padding to widget title in mobile drawer to accommodate close button */
@media (max-width: 1199px) {
    body.filter-mobile-active #sidebar-shop .widget_product_categories .widget-title {
        padding-right: 60px !important; /* Make room for close button (44px + 16px padding) */
        padding-top: 0 !important;
        margin-top: 70px !important; /* Add top margin to push content below close button (44px button + 8px top + 18px spacing) */
        position: relative !important;
        z-index: 1 !important; /* Ensure it's below close button */
    }
    
    /* Ensure Clear All link is visible and not hidden */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .widget-title .sapa-filters-clear-all {
        position: relative !important;
        z-index: 1 !important;
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
        margin-right: 0 !important; /* Remove any margin that might push it out */
    }
    
    /* Ensure the Filters title text is also visible */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .widget-title .sapa-filters-title-text {
        position: relative !important;
        z-index: 1 !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Add margin to the entire filters title container */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .widget-title .sapa-filters-title {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}
body .widget_product_categories .widget-title .sapa-filters-clear-all{
    font-size:14px;
    font-weight:500;
    text-decoration:none;
}
body .widget_product_categories .widget-title .sapa-filters-clear-all:hover,
body .widget_product_categories .widget-title .sapa-filters-clear-all:focus{
    text-decoration:underline;
    color: #47baa9;
}

/* === Single product split layout: left content + right contact form === */
body.single-product .sapa-single-product-split{
    display:flex;
    align-items:flex-start;
    gap:32px;
}

/* Single product top action button */
body.single-product .sapa-single-product-top-actions{
    margin:0 0 14px;
}
body.single-product .sapa-back-to-products{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:4px 10px;
    border:1px solid #1fd4c0;
    color:#1fd4c0;
    border-radius:999px;
    font-size:13px;
    line-height:1;
    text-decoration:none;
    background:transparent;
}
body.single-product .sapa-back-to-products:hover,
body.single-product .sapa-back-to-products:focus{
    background:rgba(31,212,192,0.12);
    text-decoration:none;
}
body.single-product .sapa-single-product-left{
    flex: 0 0 50%;
    max-width: 50%;
    min-width:0;
}
body.single-product .sapa-single-product-right{
    flex: 0 0 50%;
    max-width: 50%;
}
@media (max-width: 991px){
    body.single-product .sapa-single-product-split{
        flex-direction:column;
        gap:24px;
    }
    body.single-product .sapa-single-product-left{
        flex:1 1 auto;
        max-width:none;
        width:100%;
    }
    body.single-product .sapa-single-product-right{
        flex:1 1 auto;
        max-width:none;
        width:100%;
    }
}

/* === Single product "details card" background (top section) === */
body.single-product .sapa-single-product-left .single-main-content{
    background:#f3f4f6;
    border-radius:18px;
    padding:32px;
    overflow:hidden; /* prevent row negative margins from bleeding */
}
/* Force details on top, image at bottom (within the card) */
body.single-product .sapa-single-product-left .single-main-content > .row{
    display:flex;
    flex-direction:column;
    flex-wrap:nowrap;
}
body.single-product .sapa-single-product-left .single-main-content .information{
    order:1;
    flex:0 0 100%;
    max-width:100%;
}
body.single-product .sapa-single-product-left .single-main-content .image-mains{
    order:2;
    flex:0 0 100%;
    max-width:100%;
    margin-top:18px;
}
body.single-product .sapa-single-product-left .single-main-content .image-mains,
body.single-product .sapa-single-product-left .single-main-content .information{
    width:100%;
    padding-left:0 !important;
    padding-right:0 !important;
}
body.single-product .sapa-single-product-left .single-main-content .woocommerce-product-gallery{
    margin:0 auto;
}
body.single-product .sapa-single-product-left .single-main-content .woocommerce-product-gallery__wrapper{
    margin:0;
}
/* Make single product image/gallery smaller */
body.single-product .sapa-single-product-left .single-main-content .woocommerce-product-gallery{
    max-width:320px;
}
body.single-product .sapa-single-product-left .single-main-content .woocommerce-product-gallery__image img{
    width:100% !important;
    height:auto !important;
    max-height:260px;
    object-fit:contain;
}
body.single-product .sapa-single-product-left .single-main-content .flex-control-thumbs{
    max-width:320px;
    margin:12px auto 0;
}
body.single-product .sapa-single-product-left .single-main-content .flex-control-thumbs img{
    max-height:56px;
    object-fit:contain;
}
body.single-product .sapa-single-product-left .single-main-content .summary.entry-summary{
    background:transparent !important;
    padding:0 !important;
    margin:0 !important;
}
body.single-product .sapa-single-product-left .single-main-content .product_title{
    margin-top:0;
}

/* Single product details list (CAS/MF/etc.) */
body.single-product .sapa-single-product-details{
    margin-top:10px;
}
body.single-product .sapa-single-product-details-list{
    list-style:none;
    padding:0;
    margin:0;
}
body.single-product .sapa-single-product-details-list li{
    margin:10px 0;
    font-size:15px;
    line-height:1.45;
    font-weight:500;
    color:#050058;
}
body.single-product .sapa-single-product-details-list li strong{
    font-weight:600;
}

@media (min-width: 992px){
    body.single-product .product_title.entry-title{
        padding: 15px;
    }
    body.single-product .sapa-single-product-details-list{
        padding: 15px;
    }
}

/* Fallback: hide rating + share blocks if still output by plugins */
body.single-product .sapa-single-product-left .woocommerce-product-rating,
body.single-product .sapa-single-product-left .tbay-post-share,
body.single-product .sapa-single-product-left .tbay-product-share,
body.single-product .sapa-single-product-left .woocommerce-product-details__short-description + .tbay-post-share,
body.single-product .sapa-single-product-left .social-share,
body.single-product .sapa-single-product-left .tbay-social-share{
    display:none !important;
}

/* === Mobile Filter Drawer Enhancements === */
@media (max-width: 1199px) {
    /* When drawer is open: override mobile hide so sidebar is visible */
    body.filter-mobile-active #sidebar-shop,
    body.filter-mobile-active .sidebar#sidebar-shop,
    body.filter-mobile-active .sidebar.sidebar#sidebar-shop,
    body.filter-mobile-active #sidebar-shop.sidebar,
    body.filter-mobile-active #sidebar-shop.tbay-sidebar-shop,
    body.filter-mobile-active #sidebar-shop.sidebar-desktop {
        display: block !important;
        width: min(320px, 85vw) !important;
        max-width: 85vw !important;
        min-width: 280px !important;
        left: 0 !important;
        top: 0 !important;
        z-index: 100001 !important;
        position: fixed !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        height: 100vh !important;
        max-height: 100vh !important;
        padding: 16px !important;
        margin: 0 !important;
        flex: none !important;
        background: #fff !important;
        box-shadow: 4px 0 20px rgba(0,0,0,0.15) !important;
    }
    
    /* Also ensure the drawer wrapper/container has high z-index */
    body.filter-mobile-active .filter-btn-wrapper {
        z-index: 100000 !important;
    }
    
    /* Ensure filter widget is visible and styled in mobile drawer */
    body.filter-mobile-active #sidebar-shop .widget_product_categories,
    body.filter-mobile-active #sidebar-shop .widget.widget_product_categories {
        display: block !important;
        padding: 0;
        margin-bottom: 24px;
        overflow: visible !important;
    }
    
    /* Make sure all widgets in drawer are scrollable */
    body.filter-mobile-active #sidebar-shop .widget {
        overflow: visible !important;
        margin-bottom: 24px;
    }
    
    /* Filter widget title styling in drawer */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .widget-title {
        padding: 0 56px 12px 0 !important; /* Right padding for close button */
        margin: 18px 0 12px 0 !important;
        border-bottom: 1px solid #e0e0e0;
        font-size: 16px;
        font-weight: 600;
        position: relative !important;
        z-index: 1 !important;
    }
    
    /* Filter list styling in drawer - make it scrollable if too long */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .product-categories {
        max-height: none !important; /* Remove max-height restriction since parent is scrollable */
        overflow-y: visible !important;
        padding-right: 8px;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Custom scrollbar for entire drawer */
    body.filter-mobile-active #sidebar-shop::-webkit-scrollbar {
        width: 6px;
    }
    body.filter-mobile-active #sidebar-shop::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 3px;
    }
    body.filter-mobile-active #sidebar-shop::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 3px;
    }
    body.filter-mobile-active #sidebar-shop::-webkit-scrollbar-thumb:hover {
        background: #555;
    }
    
    /* Custom scrollbar for filter list (if nested scrolling needed) */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .product-categories::-webkit-scrollbar {
        width: 4px;
    }
    body.filter-mobile-active #sidebar-shop .widget_product_categories .product-categories::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 2px;
    }
    body.filter-mobile-active #sidebar-shop .widget_product_categories .product-categories::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 2px;
    }
    body.filter-mobile-active #sidebar-shop .widget_product_categories .product-categories::-webkit-scrollbar-thumb:hover {
        background: #555;
    }
    
    /* Filter items spacing in drawer */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .product-categories li {
        padding: 10px 0;
        border-bottom: 1px solid #f0f0f0;
    }
    body.filter-mobile-active #sidebar-shop .widget_product_categories .product-categories li:last-child {
        border-bottom: none;
    }
    
    /* Checkbox styling in drawer - make it more touch-friendly */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .sapa-product-cat-checkbox {
        width: 20px;
        height: 20px;
        cursor: pointer;
        flex-shrink: 0;
    }
    
    /* Filter row touch target - ensure good spacing */
    body.filter-mobile-active #sidebar-shop .widget_product_categories .sapa-product-cat-row {
        min-height: 44px; /* Minimum touch target size */
        padding: 4px 0;
    }
    
    /* Close icon button in filter drawer - top right position */
    body.filter-mobile-active #sidebar-shop .sapa-filter-close-btn,
    #sidebar-shop .sapa-filter-close-btn {
        position: absolute !important;
        top: 8px !important; /* Position higher to avoid overlap */
        right: 8px !important; /* Position on right side */
        left: auto !important;
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        background: #1fd4c0 !important;
        background-color: #1fd4c0 !important;
        border: none !important;
        border-radius: 10px !important;
        cursor: pointer !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        margin: 0 !important;
        z-index: 10001 !important;
        color: #ffffff !important;
        font-size: 0 !important;
        line-height: 1 !important;
        transition: background-color 0.2s ease !important;
        -webkit-tap-highlight-color: transparent !important;
        visibility: visible !important;
        opacity: 1 !important;
        box-shadow: 0 2px 10px rgba(31, 212, 192, 0.35) !important;
    }
    
    body.filter-mobile-active #sidebar-shop .sapa-filter-close-btn:hover,
    body.filter-mobile-active #sidebar-shop .sapa-filter-close-btn:focus,
    #sidebar-shop .sapa-filter-close-btn:hover,
    #sidebar-shop .sapa-filter-close-btn:focus {
        color: #ffffff !important;
        background: #18bca9 !important;
        background-color: #18bca9 !important;
        outline: none !important;
        transform: scale(0.95) !important;
        transition: all 0.2s ease !important;
    }
    
    body.filter-mobile-active #sidebar-shop .sapa-filter-close-btn i,
    body.filter-mobile-active #sidebar-shop .sapa-filter-close-btn .tb-icon,
    #sidebar-shop .sapa-filter-close-btn i,
    #sidebar-shop .sapa-filter-close-btn .tb-icon {
        font-size: 20px !important;
        line-height: 1 !important;
        color: #ffffff !important; /* White X icon */
        display: inline-block !important;
    }
    
    /* Ensure sidebar has relative positioning for absolute close button */
    body.filter-mobile-active #sidebar-shop,
    #sidebar-shop {
        position: relative !important;
    }
    
    /* Make sure close button is always visible when sidebar is active */
    body.filter-mobile-active #sidebar-shop .sapa-filter-close-btn {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Override any conflicting styles */
    #sidebar-shop button.sapa-filter-close-btn,
    #sidebar-shop .sapa-filter-close-btn {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* === Hamburger Filter Button Hook for Mobile === */
/* Only show on mobile screens, hide on desktop and during transitions */
@media (max-width: 1194px) {
    /* Hamburger filter button container - Center left position */
    /* Ensure it's always fixed to viewport, not affected by parent containers */
    button#sapa-filter-hamburger-btn,
    #sapa-filter-hamburger-btn,
    button.sapa-filter-hamburger-btn,
    .sapa-filter-hamburger-btn {
        position: fixed !important;
        left: 0 !important; /* Stick to left edge with no padding */
        top: 50vh !important; /* Use viewport height instead of percentage */
        transform: translateY(-50%) !important; /* Center vertically */
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        max-width: 44px !important;
        max-height: 44px !important;
        background: rgb(31, 212, 192) !important; /* Teal/turquoise background color */
        background-color: rgb(31, 212, 192) !important;
        border: none !important;
        border-radius: 0 !important; /* Sharp corners - rectangular button */
        box-shadow: none !important; /* No shadow for clean look */
        cursor: pointer !important;
        z-index: 99999 !important; /* Very high z-index, but drawer (100001) should be above this */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        margin: 0 !important;
        transition: background-color 0.2s ease !important;
        -webkit-tap-highlight-color: transparent !important;
        visibility: visible !important;
        opacity: 1 !important;
        /* Ensure it's not affected by parent positioning */
        position: fixed !important;
        /* Remove any parent transforms that might affect positioning */
        will-change: transform !important;
        /* Override any inherited styles */
        float: none !important;
        clear: none !important;
    }
    
    /* Ensure parent containers don't affect positioning - more specific selectors */
    footer button#sapa-filter-hamburger-btn,
    footer #sapa-filter-hamburger-btn,
    footer .sapa-filter-hamburger-btn,
    #footer button#sapa-filter-hamburger-btn,
    #footer #sapa-filter-hamburger-btn,
    #footer .sapa-filter-hamburger-btn,
    .footer button#sapa-filter-hamburger-btn,
    .footer #sapa-filter-hamburger-btn,
    .footer .sapa-filter-hamburger-btn,
    body > button#sapa-filter-hamburger-btn,
    body > #sapa-filter-hamburger-btn,
    body > .sapa-filter-hamburger-btn {
        position: fixed !important;
        left: 0 !important; /* Stick to left edge with no padding */
        top: 50vh !important;
        transform: translateY(-50%) !important;
        z-index: 99999 !important;
        background: rgb(31, 212, 192) !important;
        background-color: rgb(31, 212, 192) !important;
        border: none !important;
        border-radius: 0 !important;
        width: 44px !important;
        height: 44px !important;
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Override any parent transforms or positioning contexts */
    
    /* Specific override for footer and any container */
    
    footer button#sapa-filter-hamburger-btn,
    footer #sapa-filter-hamburger-btn,
    footer .sapa-filter-hamburger-btn {
        position: fixed !important;
        left: 0 !important; /* Stick to left edge with no padding */
        top: 50vh !important;
        transform: translateY(-50%) !important;
        z-index: 99999 !important;
        background: rgb(31, 212, 192) !important;
        background-color: rgb(31, 212, 192) !important;
        border: none !important;
        border-radius: 0 !important;
        width: 44px !important;
        height: 44px !important;
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Filter icon styling */
    .sapa-filter-hamburger-btn .sapa-filter-icon,
    .sapa-filter-hamburger-btn i.tb-icon-filter,
    .sapa-filter-hamburger-btn .tb-icon-filter {
        color: #ffffff !important;
        font-size: 20px !important;
        line-height: 1 !important;
        display: inline-block !important;
    }
    
    /* Hover and active states - preserve vertical centering */
    .sapa-filter-hamburger-btn:hover {
        background: rgb(24, 188, 169) !important; /* Darker teal on hover */
        background-color: rgb(24, 188, 169) !important;
        transform: translateY(-50%) !important; /* No scale, just color change */
    }
    
    .sapa-filter-hamburger-btn:active {
        background: rgb(20, 170, 153) !important; /* Even darker teal on click */
        background-color: rgb(20, 170, 153) !important;
        transform: translateY(-50%) !important; /* No scale */
    }
    
    /* Hide old hamburger icon if it exists */
    .sapa-filter-hamburger-btn .sapa-hamburger-icon {
        display: none !important;
    }
    
    /* Filter icon styling */
    .sapa-filter-hamburger-btn .tb-icon-filter,
    .sapa-filter-hamburger-btn i.tb-icon-filter {
        color: #ffffff !important;
        font-size: 20px !important;
        line-height: 1 !important;
        display: inline-block !important;
        width: auto !important;
        height: auto !important;
    }
    
    /* Active state - button stays centered */
    .sapa-filter-hamburger-btn.active {
        transform: translateY(-50%) !important; /* Keep vertical centering */
    }
    
    /* Hide on desktop */
    @media (min-width: 1200px) {
        button#sapa-filter-hamburger-btn,
        #sapa-filter-hamburger-btn,
        .sapa-filter-hamburger-btn {
            display: none !important;
            visibility: hidden !important;
            opacity: 0 !important;
            pointer-events: none !important;
        }
    }
}

/* Desktop - hide hamburger button (global rule) */
@media (min-width: 1200px) {
    button#sapa-filter-hamburger-btn,
    #sapa-filter-hamburger-btn,
    button.sapa-filter-hamburger-btn,
    .sapa-filter-hamburger-btn,
    body > button#sapa-filter-hamburger-btn,
    body > #sapa-filter-hamburger-btn {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        position: absolute !important;
        left: -9999px !important;
        top: -9999px !important;
    }
}

/* Hide button during viewport transitions (between 1199px and 1200px) */
@media (min-width: 1195px) {
    button#sapa-filter-hamburger-btn,
    #sapa-filter-hamburger-btn,
    button.sapa-filter-hamburger-btn,
    .sapa-filter-hamburger-btn {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

/* Additional global override to ensure button is visible on mobile */
@media (max-width: 1194px) {
    button#sapa-filter-hamburger-btn,
    #sapa-filter-hamburger-btn {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* CRITICAL: Ensure drawer is above filter hook button - placed at end for maximum priority */
@media (max-width: 1199px) {
    body.filter-mobile-active #sidebar-shop,
    body.filter-mobile-active #sidebar-shop.sidebar,
    body.filter-mobile-active #sidebar-shop.tbay-sidebar-shop,
    body.filter-mobile-active #sidebar-shop.sidebar-desktop,
    body.filter-mobile-active .sidebar#sidebar-shop {
        z-index: 100001 !important;
        position: fixed !important;
    }
}