/* 
Theme Name: JHB Designs Theme
Theme URI: https://jhbdesigns.nl/
Description: JHB Designs Theme is a child theme of Hello Elementor, created by JHB designs
Author: JHB Designs
Author URI: https://jhbdesigns.nl
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/


:root {
    /* Global Padding Variables - Editable */
    /* Left and Right Padding All /Sections/Containers*/
    --fluid-side-padding-min: 1.25rem; /* 20px */
    --fluid-side-padding-max: 5rem;   /* 80px */

    /* Top and Bottom Padding All Containers*/
    --section-xxl-padding-min: 9.375rem; /* 150px */
    --section-xxl-padding-max: 10rem; /* 160px */ 
  
    --section-xl-padding-min: 6.875rem; /* 110px */
    --section-xl-padding-max: 7.5rem; /* 120px */
  
    --section-l-padding-min: 5.625rem; /* 90px */
    --section-l-padding-max: 6.25rem; /* 100px */
  
    --section-m-padding-min: 5rem; /* 80px */
    --section-m-padding-max: 5rem; /* 80px */
  
    --section-s-padding-min: 3.75rem; /* 60px */
    --section-s-padding-max: 3.75rem; /* 60px */
  
    --section-xs-padding-min: 2.5rem; /* 40px */
    --section-xs-padding-max: 2.5rem; /* 40px */
  
    --section-xxs-padding-min: 1.5rem; /* 24px */
    --section-xxs-padding-max: 1.5rem; /* 24px */
    
    --section-header-padding-min: 1.25rem; /* 20px */
    --section-header-padding-max: 1.25rem; /* 20px */

  
    /* Hero Sections Height Variable */
    --section-hero-height: 100vh; /* 100% the screen height */
  
    /* Offset Padding for Overlay Headers */
    --section-offset-header: 80px; /* Adjust to the overlay header's negative margin */

    /* Width For Narrow Sections*/
    --section-narrow: 62.5rem; /* 1000px */
    --section-narrow-xs: 45rem; /* 720px */
  }


/* CSS Template (do not edit below) */
  
  
  /* Section/Container Padding - Fluid Variants */
  .section-xxl {
    padding-top: clamp(var(--section-xxl-padding-min), 1.087vw + 9.13rem, var(--section-xxl-padding-max));
    padding-bottom: clamp(var(--section-xxl-padding-min), 1.087vw + 9.13rem, var(--section-xxl-padding-max));
    padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
  }
  
  .section-xl {
    padding-top: clamp(var(--section-xl-padding-min), 1.087vw + 6.63rem, var(--section-xl-padding-max));
    padding-bottom: clamp(var(--section-xl-padding-min), 1.087vw + 6.63rem, var(--section-xl-padding-max));
    padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
  }
  
  .section-l {
    padding-top: clamp(var(--section-l-padding-min), 1.087vw + 5.38rem, var(--section-l-padding-max));
    padding-bottom: clamp(var(--section-l-padding-min), 1.087vw + 5.38rem, var(--section-l-padding-max));
    padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
  }
  
  .section-m {
    padding-top: clamp(var(--section-m-padding-min), 0vw + 5rem, var(--section-m-padding-max));
    padding-bottom: clamp(var(--section-m-padding-min), 0vw + 5rem, var(--section-m-padding-max));
    padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
  }
  
  .section-s {
    padding-top: clamp(var(--section-s-padding-min), 0vw + 3.75rem, var(--section-s-padding-max));
    padding-bottom: clamp(var(--section-s-padding-min), 0vw + 3.75rem, var(--section-s-padding-max));
    padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
  }
  
  .section-xs {
    padding-top: clamp(var(--section-xs-padding-min), 0vw + 2.5rem, var(--section-xs-padding-max));
    padding-bottom: clamp(var(--section-xs-padding-min), 0vw + 2.5rem, var(--section-xs-padding-max));
    padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
  }
  
  .section-xxs {
    padding-top: clamp(var(--section-xxs-padding-min), 0vw + 1.5rem, var(--section-xxs-padding-max));
    padding-bottom: clamp(var(--section-xxs-padding-min), 0vw + 1.5rem, var(--section-xxs-padding-max));
    padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
  }
  
  .section-header {
    padding-top: clamp(var(--section-header-padding-min), 0vw + 1.25rem, var(--section-header-padding-max));
    padding-bottom: clamp(var(--section-header-padding-min), 0vw + 1.25rem, var(--section-header-padding-max));
    padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
  }
  
  /* Hero Container/Sections Height */
  .section-hero {
    min-height: var(--section-hero-height)!important;
  }

  .section-hero .e-con-inner {
    justify-content: center!important;
}
  
  /* Full Width Sections - No Side Padding */

  .section-full div {
    max-width: 100%!important;
  }
  

  /* Narrow Sections */
  .section-narrow .e-con-inner {
    max-width: var(--section-narrow)!important;
  }

  .section-narrow-xs .e-con-inner {
    max-width: var(--section-narrow-xs)!important;
  }


  /* Offset Padding for Overlay Headers */
  .section-offset {
    padding-top: calc(var(--section-offset-header) + var(--section-xxl-padding-min));
  }


/* Custom CSS */
a {
    text-decoration: none !important;
}
/* NOTICE!!! Removed in due to overwrite: /themes/astra/assets/css/minified/compatibility/woocommerce/woocommerce-grid.min.css?ver=4.9.0 */
.elementor-heading-title  .woocommerce-js h2, .woocommerce-js h2 {
	margin-bottom 0 !important;
}

.elementor-menu-cart__container .elementor-menu-cart__main {
	width: 450px;
}

.nav-menu-mobile-icon-list .elementor-icon-list-icon {
	padding-left: 2rem;
}

.nav-menu-mobile-accordion .e-n-accordion-item:first-child .e-n-accordion-item-title:after {
    position: absolute;
    float: right;
    top: 2.4rem;
    right: 3rem;
    
    content: '\02C3';
    font-size: 3rem;
    color: var(--e-global-color-accent);
}

.nav-menu-mobile-accordion .e-n-accordion-item[open] .e-n-accordion-item-title:after {
    content: '\2304';
    top: 1rem;
    right: 2rem;
    font-size: 2.5rem;
    color: #ffffff;
}


#order_review {
	border-style: none!important;
}

#order_review_heading {
        width: 100% !important;
}

#order_review tr.cart_item.woolentor-order-review-product {
	display: none !important;
}

#order_review .shop_table .woocommerce-Price-amount {
    font-weight: 800 !important;
    font-size: 15px;
    color: #ec7e30;
}


#order_review .tax-total th {
    text-transform: uppercase;
}


#order_review .tax-total th:after {
    content: " (21%)";
}

.order-again {
	display: none;
}

.woocommerce form .form-row .woocommerce-terms-and-conditions-wrapper .woocommerce-form__label-for-checkbox {
	line-height: 1;
	font-size: var( --e-global-typography-text-font-size );
}
/* 
.elementor-widget-form .elementor-field-group > label {
    color: var(--e-global-color-primary);
    font-family: var(--e-global-typography-31d8c5d-font-family), Sans-serif;
    font-size: var(--e-global-typography-31d8c5d-font-size);
    font-weight: var(--e-global-typography-31d8c5d-font-weight);
} */

.woocommerce form #payment #place_order {
	width: 100%;
}

.woocommerce form #payment .payment_methods input[type="radio"] {
	appearance: none;
	width: 15px;
	height: 15px;
	border: 1px solid #DDD;
	border-radius: 50%;
	outline: none;
	background-color: white;
	cursor: pointer;
	padding: 0;
}
.woocommerce form #payment .payment_methods input[type="radio"]:checked {
	background-color: var( --e-global-color-accent );
	border: 2px solid #FFF;
}

.woocommerce form #payment input[type="checkbox"], .elementor-form #form-field-terms_of_service  {
	width: 20px;
	height: 20px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-color: #e0e0e0;
	border: 1px solid #ccc;
	border-radius: 3px;
	cursor: pointer;
	position: relative;
	margin: 10px 10px 0 0;
	padding: 5px;
}

/* Change the background color when checkbox is checked */
.woocommerce form #payment input[type="checkbox"]:checked, .elementor-form #form-field-terms_of_service:checked  {
	background-color: var( --e-global-color-accent );
	border: 1px solid var( --e-global-color-accent );
}

/* Add a check mark when checked */
.woocommerce form #payment input[type="checkbox"]:checked::after, .elementor-form #form-field-terms_of_service:checked::after {
	content: "";
	position: absolute;
	left: 6px;
	top: 2px;
	width: 6px;
	height: 12px;
	border-width: 0 3px 3px 0;
	transform: rotate(45deg);
	border-color: white;
	border-style: solid;
}

.elementor-field-group-terms_of_service .elementor-field-subgroup label {
    font-family: var(--e-global-typography-31d8c5d-font-family), Sans-serif;
    font-size: 1rem;
    font-weight: var(--e-global-typography-31d8c5d-font-weight);
	line-height: 1;
}
