/*
Theme Name: Wabasta
Theme URI: #
Author: Wabasta
Author URI: 
Description: A custom WordPress theme for Wabasta.
Version: 1.0
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wabasta
*/
@font-face {
    font-family: 'Satoshi-Medium';
    src: url('./assets/fonts/Satoshi-Medium.woff2') format('woff2'),
        url('./assets/fonts/Satoshi-Medium.woff') format('woff'),
        url('./assets/fonts/Satoshi-Medium.ttf') format('truetype'),
        url('./assets/fonts/Satoshi-Medium.svg#Satoshi-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi-Black';
    src: url('./assets/fonts/Satoshi-Black.woff2') format('woff2'),
        url('./assets/fonts/Satoshi-Black.woff') format('woff'),
        url('./assets/fonts/Satoshi-Black.ttf') format('truetype'),
        url('./assets/fonts/Satoshi-Black.svg#Satoshi-Black') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi-Bold';
    src: url('./assets/fonts/Satoshi-Bold.woff2') format('woff2'),
        url('./assets/fonts/Satoshi-Bold.woff') format('woff'),
        url('./assets/fonts/Satoshi-Bold.ttf') format('truetype'),
        url('./assets/fonts/Satoshi-Bold.svg#Satoshi-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi-Regular';
    src: url('./assets/fonts/Satoshi-Regular.woff2') format('woff2'),
        url('./assets/fonts/Satoshi-Regular.woff') format('woff'),
        url('./assets/fonts/Satoshi-Regular.ttf') format('truetype'),
        url('./assets/fonts/Satoshi-Regular.svg#Satoshi-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi-Light';
    src: url('./assets/fonts/Satoshi-Light.woff2') format('woff2'),
        url('./assets/fonts/Satoshi-Light.woff') format('woff'),
        url('./assets/fonts/Satoshi-Light.ttf') format('truetype'),
        url('./assets/fonts/Satoshi-Light.svg#Satoshi-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

:root{
    --global-font-family: 'Satoshi-Regular', serif;
    --global-font-size: 16px;
    --global-font-weight: 400;
    --global-font-color: #373737;
    --global-background-color: #fff;
    --list--font-family: 'Satoshi-Regular', serif;
}
*{ box-sizing: border-box; }
html{ font-family: var(--global-font-family); font-size: var(--global-font-size); font-weight: var(--global-font-weight); color: var(--global-font-color); background: var(--global-background-color); }
body{ overflow-x: hidden; margin: 0; padding: 0; background: #fff; }
body ::selection{ background-color: #F9D84B; color: #282F3D; }
body ::placeholder, body ::-webkit-input-placeholder,body ::-moz-placeholder, ::-ms-input-placeholder,body ::-moz-placeholder{ color: #fff; }
body .container{ max-width: 1720px; margin: 0 auto; width: 100%; }
body .hidden{ display: none !important; }
body p{ font-family: var(--global-font-family); font-size: var(--global-font-size); font-weight: var(--global-font-weight); margin: 0 0 1em; }
body a{ color: #282F3D; text-decoration: none; box-shadow: none; transition: 0.4s; }
body a:hover{ opacity: 0.8; transition: 0.4s; }
.flex-row{ display: flex; flex-direction: row; flex-wrap: wrap; }
.flex-row .col-1{ flex: 0 0 8.34%; width: 8.34%; padding: 0 0.938em; }
.flex-row .col-2{ flex: 0 0 16.67%; width: 16.67%; padding: 0 0.938em; }
.flex-row .col-2-5{ flex: 0 0 20%; width: 20%; padding: 0 0.938em; }
.flex-row .col-3{ flex: 0 0 25%; width: 25%; padding: 0 0.938em; }
.flex-row .col-4{ flex: 0 0 33.33%; width: 33.33%; padding: 0 0.938em; }
.flex-row .col-5{ flex: 0 0 41.66%; width: 41.66%; padding: 0 0.938em; }
.flex-row .col-6{ flex: 0 0 50%; width: 50%; padding: 0 0.938em; }
.flex-row .col-7{ flex: 0 0 58.33%; width: 58.33%; padding: 0 0.938em; }
.flex-row .col-8{ flex: 0 0 66.66%; width: 66.66%; padding: 0 0.938em; }
.flex-row .col-9{ flex: 0 0 75%; width: 75%; padding: 0 0.938em; }
.flex-row .col-10{ flex: 0 0 83.33%; width: 83.33%; padding: 0 0.938em; }
.flex-row .col-11{ flex: 0 0 91.66%; width: 91.66%; padding: 0 0.938em; }
.flex-row .col-12{ flex: 0 0 100%; width: 100%; padding: 0 0.938em; }
.flex-row .col-12{ flex: 0 0 100%; width: 100%; padding: 0 0.938em; }

#masthead{  }
/* #masthead .upper-header{ padding: 1.2rem 0; }
#masthead .upper-header .flex-row{ align-items: center; }
#masthead .upper-header .homepage-btn{  }
#masthead .upper-header .homepage-btn a{ background: #EBEDF2; color: #282F3D; font-size: 1.2rem; position: relative; padding: 0.8rem 2.2rem 0.8rem 4rem; display: inline-flex; align-items: center; border-radius: 50px; transition: 0.4s; }
#masthead .upper-header .homepage-btn a:before{ content: ''; position: absolute; background: url('./assets/images/icon-list.png') no-repeat; width: 28px; height: 28px; left: 1.6rem; background-position: left top; transition: 0.4s; }
#masthead .upper-header .homepage-btn a:hover{ background: #282F3D; color: #fff; transition: 0.4s; }
#masthead .upper-header .homepage-btn a:hover:before{ filter: brightness(0) invert(1); transition: 0.4s; }
#masthead .logo{ text-align: center; }
#masthead .logo a{ display: inline-block; }
#masthead .commerce-icons{  }
#masthead .commerce-icons ul{ margin: 0; padding: 0; display: flex; align-items: center; justify-content: flex-end; }
#masthead .commerce-icons ul li{ list-style: none; margin-left: 1rem; }
#masthead .commerce-icons ul li a{ width: 60px; height: 60px; background: #EBEDF2; display: flex; border-radius: 50%; position: relative; align-items: center; justify-content: center; transition: 0.4s; }
#masthead .commerce-icons ul li a:hover{ background: #282F3D; color: #fff; transition: 0.4s; }
#masthead .commerce-icons ul li a:before{ content: ''; width: 31px; height: 27px; position: absolute; background: url('./assets/images/icon-list.png') no-repeat; transition: 0.4s; }
#masthead .commerce-icons ul li a.wishlist:before{ background-position: top center; }
#masthead .commerce-icons ul li a.cart:before{ background-position: top right; }
#masthead .commerce-icons ul li a.my-account:before{ background-position: -2% 38%; }
#masthead .commerce-icons ul li a:hover:before{ filter: brightness(0) invert(1); transition: 0.4s; }
#masthead .below-header{ background: #EBEDF2; padding: 1.2rem 0; }
#masthead .below-header .flex-row{ align-items: center; }
#masthead .below-header ul#primary-menu-list{ margin: 0; padding: 0; display: flex; align-items: center; }
#masthead .below-header ul#primary-menu-list li.menu-item{ margin: 0 0.75rem; list-style: none; }
#masthead .below-header ul#primary-menu-list li.menu-item:first-child{ margin-left: 0; }
#masthead .below-header ul#primary-menu-list li.menu-item:last-child{ margin-right: 0; }
#masthead .below-header ul#primary-menu-list li.menu-item a{ background: #fff; padding: 0.6rem 1.5rem; color: #282F3D; border-radius: 50px; font-size: 1.250rem; transition: 0.4s; }
#masthead .below-header ul#primary-menu-list li.menu-item a:hover,
#masthead .below-header ul#primary-menu-list li.menu-item a:active,
#masthead .below-header ul#primary-menu-list li.menu-item a:focus{ background: #282F3D; color: #fff; transition: 0.4s; }
 */

body #content .woocommerce-content .woo-product .product .woocommerce-tabs{padding-bottom:2em;}
body #content .woocommerce-content .woo-product .product .product-upper-wrapper .summary .stock{background-color: #ff6f00; color: #fff; font-size: 0.9em; padding: 4px 12px; border-radius: 24px; font-weight: 600; display: inline-block;  float:right;}
body #content .wp-block-woocommerce-checkout .wc-block-checkout .wp-block-woocommerce-checkout-fields-block .wc-block-components-radio-control:after{display:none;}
body #content .woocommerce-content .woo-product .product .woocommerce-tabs .woocommerce-Tabs-panel .woocommerce-Reviews #review_form_wrapper form.comment-form p.stars{font-size:1.5em;}