/*
 Theme Name:   Basel Child
 Description:  Basel Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     basel
 Version:      1.0.0
 Text Domain:  basel-child
*/

/* ==========================================================
   GLOBAL ELEMENTS
   ========================================================== */
h1 { font-size:34px !important; color: #000 !important; font-weight: bold !important; }
h2 { font-size:32px !important; color: #000 !important; font-weight: bold !important; }
h3 { font-size:22px !important; color: #000 !important; font-weight: bold !important; }
h4 { font-size:28px !important; color: #fff !important; font-weight: bold; }
h5 { font-size:20px !important; color: #fff !important; font-weight: bold !important; }
h6 { font-size:19px !important; color: #fff !important; font-weight: bold !important; }

.widget-title { color: black !important; }

.grecaptcha-badge { display: none !important; }

.hidden-fields-container { display: none !important; }

.product-share { display: none !important; }

.single-product .asnp-esb-productBadge { display: none !important; }

.asnp-esb-badge-3::after { width: 14px !important; }

/* ==========================================================
   HEADER & TOPBAR
   ========================================================== */
.top-banner {
  color: #fff;
  text-align: center;
  padding: 10px 15px;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.5px;
}
.right-column .search-button a i:before { display: none !important; }

/* ==========================================================
   HEADINGS & TITLES
   ========================================================== */
.heading-home {
    background: #A48F50 !important;
    color: #fff !important;
    display: table;
    padding: 10px 30px;
    margin: 20px auto;
    text-align: center;
    border-radius: 4px;
}

.heading-home,
.heading-home * { color: #fff !important; }

.title-wrapper.basel-title-color-default .title-subtitle { font-size: 16px !important; }

/* ==========================================================
   SHOP PAGE LAYOUT
   ========================================================== */
.woocommerce-shop .site-content { 
    display: flex; 
    flex-direction: column; 
}

.woocommerce-shop .page-description { order: 2; }
.woocommerce-shop .products { order: 1; }

/* Product grid items */
.product-grid-item {
    border: 1px solid #e6e6e4 !important;
    border-radius: 12px;
    padding: 20px;
    margin: 15px;
    box-sizing: border-box;
    min-height: 720px !important;
}

body .basel-hover-alt,
body .basel-hover-alt .price,
body .basel-hover-alt .product-title { 
    text-align: center !important; 
}

.attachment-woocommerce_thumbnail { text-align: center !important; }

.product-grid-item .price .amount { 
    font-size: 20px; 
    color: #a28c4b !important; 
    font-weight: 700 !important; 
}

.product-grid-item .price del .amount { 
    font-size: 18px !important; 
    color: #000 !important; 
    text-decoration: line-through; 
}

/* Product images */
.product-element-top .hover-img { display: none !important; }
.product-element-top:hover img { opacity: 1 !important; }

/* Product descriptions */
body.woocommerce-shop .product-grid-item .product-short-description {
    min-height: 150px !important;
    max-height: 150px !important;
    overflow: hidden;
}

/* Nutritional button */
body.woocommerce-shop .pbm-nutri-btn{
    min-height: 38px;
    display: inline-block;
}

/* Make bundle card reserve the same space as other cards */
body.woocommerce-shop .product-grid-item[data-id="295"] .product-short-description{
    min-height: 150px !important;
    max-height: 150px !important;
}

body.woocommerce-shop .product-grid-item[data-id="295"] .price{
    margin-bottom: 38px !important;
}

/* Shop page Add to Cart button */
.products .btn-add .button {
    background: #000000 !important;
    color: #ffffff !important;
    border: none !important;
}

.products .btn-add .button:hover {
    background: #222222 !important;
    color: #ffffff !important;
}

/* ==========================================================
   SHOP PAGE GRID - 3 PRODUCTS PER ROW
   ========================================================== */
@media (min-width: 768px) {
    .woocommerce-shop .products.elements-grid.basel-products-holder {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: stretch !important;
    }
    
    .woocommerce-shop .products.elements-grid.basel-products-holder > .product-grid-item {
        float: none !important;
        width: calc(33.3333% - 30px) !important;
        max-width: calc(33.3333% - 30px) !important;
        flex: 0 0 calc(33.3333% - 30px) !important;
    }
    
    .woocommerce-shop .products.elements-grid.basel-products-holder > .clearfix {
        display: none !important;
    }
    
    /* Image alignment */
    .woocommerce-shop .basel-products-holder .product-grid-item .product-element-top > a,
    .woocommerce-shop .basel-products-holder .product-grid-item .product-element-top .hover-img > a {
        height: 320px;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        width: 100%;
    }
    
    .woocommerce-shop .basel-products-holder .product-grid-item .product-element-top > a > img,
    .woocommerce-shop .basel-products-holder .product-grid-item .product-element-top .hover-img > a > img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain;
        object-position: center;
    }
}

@media (max-width: 767px) {
    .woocommerce-shop .products.elements-grid.basel-products-holder {
        display: flex !important;
        flex-wrap: wrap !important;
    }
    
    .woocommerce-shop .products.elements-grid.basel-products-holder > .product-grid-item {
        float: none !important;
        width: calc(50% - 30px) !important;
        max-width: calc(50% - 30px) !important;
        flex: 0 0 calc(50% - 30px) !important;
        min-height: auto !important;
    }
    
    .woocommerce-shop .products.elements-grid.basel-products-holder > .clearfix {
        display: none !important;
    }
    
    .woocommerce-shop .basel-products-holder .product-grid-item .product-element-top > a,
    .woocommerce-shop .basel-products-holder .product-grid-item .product-element-top .hover-img > a {
        height: 220px;
    }
}

/* ==========================================================
   SINGLE PRODUCT PAGE
   ========================================================== */
.single-product-content .price del .amount { 
    font-size: 18px !important; 
    color: #000 !important; 
    text-decoration: line-through; 
}

/* ==========================================================
   PRICE TAGS & BUNDLES
   ========================================================== */
.price-tag-inline {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 10px;
    margin-top: 10px;
}

.price-tag-inline .discounted {
    font-size: 1.6rem;
    font-weight: 700;
    color: #a28c4b;
}

.price-tag-inline .discounted1 {
    font-size: 1.6rem;
    font-weight: 700;
    color: #fff;
}

.price-tag-inline span.original,
.price-tag-inline span.original1 { 
    font-size: 18px !important; 
    color: #000 !important; 
    text-decoration: line-through;
    font-weight: 700 !important;
    opacity: 0.7;
}

.price-tag-inline span.original1 { color: #e3dcc9; }

/* Bundle blocks */
.bundle-block {
    width: 30% !important;
    min-height: 300px;
    padding: 20px;
    margin: 1%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.bundle-row {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 20px;
}

/* ==========================================================
   BUTTONS
   ========================================================== */
.btn-buyNow .vc_btn3 {
    background-color: #3a3a3a !important;
    color: #ffffff !important;
    border: none !important;
    padding: 14px 28px !important;
    font-weight: 600;
}

.btn-buyNow .vc_btn3:hover {
    background-color: #222222 !important;
    color: #ffffff !important;
}

input.wpcf7-form-control.wpcf7-submit,
input.wpcf7-form-control.wpcf7-submit:hover {
    background-color: #000 !important;
    color: #fff;
}

/* ==========================================================
   ICONS & ICON BOXES
   ========================================================== */
.fa-big { font-size: 30px !important; }
.fa-solid { margin-top: -10px; }
/* Fix icon alignment in feature banner */
.icon-center-box{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:10px; /* spacing between icon and text */
}

.white-icon{
    color:white;
    font-size:28px;
    background-color:#a28c4b;
    padding:10px;
    border-radius:50%;
    margin-bottom:8px !important; /* remove negative margin */
}

.icon-text{
    color:#ffffff;
    font-size:18px;
    font-weight:600;
    line-height:1.4;
}

.icon-center-box .white-icon {
    font-size: 28px;
    margin-bottom: 10px;
}

.icon-center-box .icon-text {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
}

.icon-row {
    display: flex;
    align-items: center;
    gap: 15px;
}

.icon-row .vc_icon_element { margin-bottom: 0 !important; }
.icon-row .wpb_text_column { margin-bottom: 0 !important; }

.social-contact .vc_icon_element-icon { top: 30px !important; }

.vc_icon_element.vc_icon_element-outer .vc_icon_element-inner .vc_icon_element-icon { 
    top: 68% !important; 
}

/* ==========================================================
   REVIEWS SECTION
   ========================================================== */
.pbm-review-summary-meta {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e5e5e5;
}

.pbm-review-stars {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.pbm-review-rating {
    font-size: 14px;
    color: #222;
}

.pbm-review-count {
    font-size: 14px;
    color: #666;
    margin-bottom: 14px;
}

.pbm-review-button {
    background: #000 !important;
    color: #fff !important;
    padding: 12px 24px;
    display: inline-block;
    text-transform: none;
}

.pbm-review-button:hover { color: #fff !important; }
/* ==========================================================
   MODULA GALLERY - FIX SPACING + SAME SIZE IMAGES
   ========================================================== */

/* gallery wrapper */
#jtg-336 .modula-items {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 12px !important;
    position: static !important;
    height: auto !important;
}

/* reset each item fully */
#jtg-336 .modula-item {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    transform: none !important;
}

/* clickable/image wrappers */
#jtg-336 .modula-item-content,
#jtg-336 .figc,
#jtg-336 .tile-inner,
#jtg-336 .jtg-body a {
    display: block !important;
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 12px !important;
}

/* image itself */
#jtg-336 .modula-item img.pic {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    margin: 0 !important;
    display: block !important;
}

/* hide captions/editor text showing under images */
#jtg-336 .modula-item .jtg-caption,
#jtg-336 .modula-item .modula-item-content > p,
#jtg-336 .modula-item .modula-item-content .description,
#jtg-336 .modula-item .figc p,
#jtg-336 .modula-item .jtg-body,
#jtg-336 .modula-edit-link,
#jtg-336 .modula-item .modula-item-content .edit-gallery-link {
    display: none !important;
}

/* tablet */
@media (max-width: 991px) {
    #jtg-336 .modula-items {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

/* mobile */
@media (max-width: 767px) {
    #jtg-336 .modula-items {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
/* ==========================================================
   FOOTER
   ========================================================== */
.footer-contact {
    display: block;
    color: #ffffff;
    text-decoration: none;
    font-size: 15px;
    margin-bottom: 8px;
}

.footer-contact i {
    margin-right: 8px;
    color: #c8a45c;
}

.footer-contact:hover { color: #c8a45c; }

/* ==========================================================
   MISCELLANEOUS
   ========================================================== */
.wpb_single_image img { border-radius: 10px !important; }

ul.circle-bullets li::marker { color: #a28c4b; }

vc_row.vc_column-gap-35 {
     margin-left: 0px !important; 
    margin-right: 0px !important; 
}

/* ==========================================================
   RESPONSIVE OVERRIDES
   ========================================================== */
@media only screen and (max-width : 990px) {
    #icons-banner .wpb_column .vc_col-sm-3 { 
        width: 20% !important; 
        float: left !important; 
    }
    
    #icons-banner .wpb_column .vc_col-sm-9 { 
        width: 80% !important; 
        float: left !important; 
        text-align: center !important; 
    }
    
    .real-people-real-results .wpb_single_image { 
        max-width: 300px; 
        display: block; 
        margin: auto; 
    }
    
    .real-people-real-results .vc_column-inner { margin-top: 0 !important; }
    #mix-match-shop-page .bundle-block { width: 100% !important; }
    .bundle-row { display: block; }
}

/* Force buttons to align at the bottom of product cards */
.woocommerce-shop .product-grid-item{
    display:flex;
    flex-direction:column;
}

.woocommerce-shop .product-grid-item .btn-add{
    margin-top:auto;
}

/* Keep nutritional button spacing consistent */
.woocommerce-shop .product-grid-item .pbm-nutri-btn{
    margin-top:5px;
}
.asnp-esb-badge-1,
.asnp-esb-badge-2,
.asnp-esb-badge-3,
.asnp-esb-badge-1:after{
    background: #C0C0C0 !important;
}

.asnp-esb-badge-1,
.asnp-esb-badge-2,
.asnp-esb-badge-3,
.asnp-esb-badge-1:after,
.asnp-esb-badge-2:after,
.asnp-esb-badge-3:after{
    background: #C0C0C0 !important;
}

.onsale ,
.product-label{
	    background: #C0C0C0 !important;

	
}

.asnp-esb-badge-1:after{
	background: #C0C0C0 !important ;
}

.vc_row.vc_custom_1773317122790{
    max-width: 1135px;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}






/* STEP 1: kill plugin column system completely */
#wps-slider-section .wpsf-product,
#wps-slider-section [class*="sp-wps-col-"] {
    width: 33.3333% !important;
    max-width: 33.3333% !important;
    flex: 0 0 33.3333% !important;
}

/* STEP 2: center container properly */
#wps-slider-section #sp-woo-product-slider-464 {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    margin: 0 auto !important;
    max-width: 1200px !important;
}

/* STEP 3: remove hidden spacing causing shift */
#wps-slider-section .wps-product-section {
    padding: 0 !important;
    margin: 0 auto !important;
}

/* STEP 4: clean spacing between cards */
#wps-slider-section .wpsf-product {
    display: flex !important;
    padding: 0 15px !important;
    box-sizing: border-box;
}

/* STEP 5: make each card equal height */
#wps-slider-section .sp-wps-product-image-area {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    width: 100% !important;
}

#wps-slider-section .sp-wps-product-details {
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    text-align: center !important;
}

#wps-slider-section .sp-wps-product-details-inner {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

/* STEP 6: control title height */
#wps-slider-section .wpsf-product-title {
    min-height: 48px !important;
    max-height: 48px !important;
    overflow: hidden !important;
}

#wps-slider-section .wpsf-product-title a {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

/* STEP 7: keep stars centered */
#wps-slider-section .star-rating {
    margin: 10px auto !important;
    float: none !important;
    display: block !important;
}

/* STEP 8: push price/button area down without breaking stars */
#wps-slider-section .wpsf-cart-button {
    margin-top: 10px !important;
}

/* TABLET */
@media (max-width: 1024px) {
    #wps-slider-section .wpsf-product,
    #wps-slider-section [class*="sp-wps-col-"] {
        width: 50% !important;
        max-width: 50% !important;
        flex: 0 0 50% !important;
    }
}

/* MOBILE */
@media (max-width: 767px) {
    #wps-slider-section .wpsf-product,
    #wps-slider-section [class*="sp-wps-col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}



/* ==========================================================
   MOBILE PRODUCT CARD FIX - STARS + BUTTON SPACING
   ========================================================== */

/* Fix stars alignment on mobile product cards */
.woocommerce-shop .product-grid-item .star-rating,
.products .product-grid-item .star-rating {
    float: none !important;
    display: block !important;
    margin: 10px auto 18px auto !important;
    text-align: center !important;
}

/* Make stars show in one clean row */
.woocommerce-shop .product-grid-item .star-rating::before,
.woocommerce-shop .product-grid-item .star-rating span::before,
.products .product-grid-item .star-rating::before,
.products .product-grid-item .star-rating span::before {
    letter-spacing: 2px !important;
    color: #a28c4b !important;
}

/* Fix space between Nutritional Ingredients and Add to Cart/View Cart */
.woocommerce-shop .product-grid-item .pbm-nutri-btn,
.products .product-grid-item .pbm-nutri-btn {
    display: block !important;
    width: 100% !important;
    margin: 12px auto 0 auto !important;
    padding: 13px 8px !important;
    line-height: 1.25 !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

/* Remove gap/overlap between the two buttons */
.woocommerce-shop .product-grid-item .btn-add,
.products .product-grid-item .btn-add {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Add to cart / view cart button clean spacing */
.woocommerce-shop .product-grid-item .btn-add .button,
.products .product-grid-item .btn-add .button,
.woocommerce-shop .product-grid-item .added_to_cart,
.products .product-grid-item .added_to_cart {
    display: inline-block !important;
    margin-top: 0 !important;
    padding: 14px 22px !important;
    line-height: 1.2 !important;
    min-height: 45px !important;
}

/* Mobile specific card spacing */
@media (max-width: 767px) {
    .woocommerce-shop .product-grid-item,
    .products .product-grid-item {
        padding: 16px 10px !important;
    }

    .woocommerce-shop .product-grid-item .star-rating,
    .products .product-grid-item .star-rating {
        margin-top: 8px !important;
        margin-bottom: 14px !important;
    }

    .woocommerce-shop .product-grid-item .pbm-nutri-btn,
    .products .product-grid-item .pbm-nutri-btn {
        font-size: 14px !important;
        min-height: 49px !important;
    }

    .woocommerce-shop .product-grid-item .btn-add .button,
    .products .product-grid-item .btn-add .button,
    .woocommerce-shop .product-grid-item .added_to_cart,
    .products .product-grid-item .added_to_cart {
        font-size: 13px !important;
        min-width: 150px !important;
    }
}

/* ==========================================================
   INCREASE SPACE BETWEEN BUTTONS (CLEAN FIX)
   ========================================================== */

/* Add space under Nutritional button */
.woocommerce-shop .product-grid-item .pbm-nutri-btn,
.products .product-grid-item .pbm-nutri-btn {
    margin-bottom: 14px !important;
}

/* Add space above Add to Cart / View Cart */
.woocommerce-shop .product-grid-item .btn-add,
.products .product-grid-item .btn-add {
    margin-top: 10px !important;
}

/* Ensure buttons don’t stick together */
.woocommerce-shop .product-grid-item .btn-add .button,
.products .product-grid-item .btn-add .button {
    margin-top: 0 !important;
}


/* SAFE MOBILE BUTTON FIX */
@media (max-width: 767px) {

    .woocommerce-shop .product-grid-item {
        min-height: auto !important;
        height: auto !important;
        display: block !important;
        padding: 14px 10px !important;
    }

    .woocommerce-shop .product-grid-item .pbm-nutri-btn {
        width: 100% !important;
        margin: 14px auto 14px auto !important;
        padding: 12px 6px !important;
        min-height: auto !important;
        line-height: 1.25 !important;
    }

    .woocommerce-shop .product-grid-item .btn-add {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .woocommerce-shop .product-grid-item .btn-add .button,
    .woocommerce-shop .product-grid-item .added_to_cart {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: auto !important;
        padding: 13px 6px !important;
        margin: 0 auto !important;
        line-height: 1.2 !important;
    }
}



.pbm-popup-form p{
    margin:0!important;
}

.pbm-popup-form{
    width:100%;
}

.pbm-popup-form input[type=email]{
    width:100%!important;
    padding:16px 24px!important;
    border-radius:30px!important;
    border:1px solid #ddd!important;
    font-size:15px!important;
    background:#fff!important;
    margin-bottom:18px!important;
    box-sizing:border-box!important;
}

.pbm-popup-form input[type=submit]{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    background:#000!important;
    color:#fff!important;
    border:none!important;
    padding:18px 20px!important;
    border-radius:14px!important;
    font-size:14px!important;
    font-weight:700!important;
    cursor:pointer!important;
    text-transform:uppercase!important;
    letter-spacing:.5px!important;
    box-sizing:border-box!important;
    white-space:normal!important;
    line-height:1.4!important;
}

.pbm-popup-form .wpcf7-spinner{
    display:none!important;
}

.pbm-popup-form input[type=submit]:hover{
    background:#c9a34e!important;
    color:#000!important;
}






/* ===========================
   PBM POPUP CLEAN FIX
   Remove white border only
=========================== */

/* Remove Popup Maker outer white frame */
#popmake-561.pum-container,
#popmake-561 .pum-container-inner{
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    overflow: visible !important;
}

/* Remove Popup Maker default content spacing */
#popmake-561 .pum-content{
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

/* Hide default title */
#popmake-561 .pum-title{
    display:none !important;
}

/* Keep popup sizing normal */
#popmake-561{
    max-width:1000px !important;
    width:95% !important;
}

/* Keep your custom popup visible */
#popmake-561 .pum-content > div{
    border-radius:0 !important;
    overflow:hidden !important;
}

/* Better close button position */
#popmake-561 .pum-close{
    
   font-weight:600 !important;
	font-size: 20px !important;
}

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

#popmake-561{
    width:95% !important;
}

#popmake-561 .pum-content > div{
    flex-direction:column !important;
}

#popmake-561 .pum-content > div > div{
    width:100% !important;
}

}