/*
* Sasaki V1.0
* Copyright 2023, LAB 360 SRL
* www.lab360.be
*/

/* Fonts */
@font-face {
    font-family: 'RoundedMplus1c-Regular';
    src: url('../fonts/RoundedMplus1c-Regular.woff2') format('woff2'),
        url('../fonts/RoundedMplus1c-Regular.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'RoundedMplus1c-Medium';
    src: url('../fonts/RoundedMplus1c-Medium.woff2') format('woff2'),
        url('../fonts/RoundedMplus1c-Medium.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'RoundedMplus1c-Light';
    src: url('../fonts/RoundedMplus1c-Light.woff2') format('woff2'),
        url('../fonts/RoundedMplus1c-Light.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'RoundedMplus1c-Bold';
    src: url('../fonts/RoundedMplus1c-Bold.woff2') format('woff2'),
        url('../fonts/RoundedMplus1c-Bold.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'RoundedMplus1c-Thin';
    src: url('../fonts/RoundedMplus1c-Thin.woff2') format('woff2'),
        url('../fonts/RoundedMplus1c-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

/* Common layout */
body {margin:0; padding:0; width:100%; font-family:'RoundedMplus1c-Regular'; font-weight:100; color:#999; background-color:#fff; height:100%; font-size:18px}
body.home {background-color:#fbf5ec;}
#main {position: relative; z-index: 2;}
strong {font-family:'RoundedMplus1c-Bold'; font-weight:100!important; }
a, a:focus {outline: 0;}
a, a.active .linklabel {color:#999;;}
a {text-decoration: none;}
a:hover {text-decoration:underline;}
a.arrow {width:70px; height:70px; display:block; background-image: url(../pictures/arrow.svg); background-position: top 0 left 0; background-size:70px; background-repeat: no-repeat; margin:16px 0;}
a.arrow:hover {background-image: url(../pictures/arrow-hover.svg); background-position: top 0 left 0; background-size:70px; background-repeat: no-repeat; }
a.back-button {position: absolute; width:50px; height:25px; top:0; left:0; margin:13px 0 0 9%; display:block; transform: rotate(180deg); background-image: url("../pictures/filter-on.svg"); background-position: top 0 left 0; background-size:100%; background-repeat: no-repeat; }
a.back-button:hover { background-image: url("../pictures/filter-on-hover.svg"); }
a.button {display:inline-block; background-color:#e19174; color:#f9e4ca; padding:6px 16px; border-radius:30px; font-weight:100; font-family:'RoundedMplus1c-Medium';}
a.button:hover {background-color:#999999; color:#fff; text-decoration:none; }
h1, h2, h3, h4, h5  {font-family:'RoundedMplus1c-Light'; font-weight:100; line-height: 1em; letter-spacing: 0; color:#808080}
h1 {margin:0 0 14px 0; padding:0; font-size:2.6em; width:100%; margin-left:16.66%}
.page-template-default h1 {margin:0 0 50px 0; margin-left:0}
h2 {margin:0 0 10px 0; padding:0; font-size:1.8em; }
h3 {margin:0 0 10px 0; padding:0; font-size:1.4em; }
p {margin:0 0 15px; line-height:1.5em;}
p.orange {color:#e19174}
em {color:#e19174; font-style:normal; margin: 0 0 15px; display: inline-block;}
img {width:100%; height:auto;}
.japan {color:#e19174;}
.hide {display:none;}
.retrait {margin-left:10%;}
.retrait-heading {margin-left: 16.66%;}
.bullet {position:absolute; left:-30px; width:20px; height:30px; display:inline-block; background-image: url("../pictures/bullet-salmon.svg"); background-position: top 4px left 0px; background-size:20px; background-repeat: no-repeat; }
#footer .bullet {margin: 50px 0 0 0;}
.backbutton {display:inline-block; height:34px; z-index:10; position:absolute; bottom:10px; left:10px; background-color:#000; color:#fff; padding: 2px 16px; border-radius: 30px; font-family: 'RoundedMplus1c-Medium';}
.backbutton a {color:#fff;}
.backbutton:hover {background-color:#999999; }
.backbutton a:hover {color:#fff; text-decoration:none; }
.flex-columns-home-item:last-child .backbutton {bottom:200px;}
.homeblocks-template-default .flex-columns-home-item:last-child .backbutton {bottom:150px; left:0;}
.homeblocks-template-default h1, .seasonblocks-template-default h1 {margin:0;}
.page-template-default .post-edit-link, .page-template-template-twocolumns .post-edit-link, .single-product .post-edit-link {display:inline-block; height:34px; z-index:10; position:relative; background-color:#000; color:#fff; padding: 2px 16px; border-radius: 30px; font-family: 'RoundedMplus1c-Medium';}
.page-template-default .post-edit-link:hover, .page-template-template-twocolumns .post-edit-link:hover, .single-product .post-edit-link:hover {background-color:#999999; color:#fff; text-decoration:none; }


#logo {width:320px; z-index:2; position:relative; right:-50px;}
#mobile-side-column {display:none;}

/* Background circles */
#content-circle-bkg {width:450px; height:450px; position:absolute; right:-250px; top:-180px; background-color:#f9cbbc; border-radius:50%; z-index:1; pointer-events: none}
#main-body-circle-bkg {width:450px; height:450px; position:absolute; left:-205px; bottom:-380px; background-color:#f79c7c; opacity:30%; border-radius:50%; z-index:1; pointer-events: none}
#footer-circle-bkg {width:450px; height:450px; position:absolute; right:-205px; bottom:-250px; background-color:#f8c7a9; border-radius:50%; z-index:1; pointer-events: none}
.column-circle-bkg {width:450px; height:450px; position:absolute; left:-205px; bottom:-160px; background-color:#f8c7a9; border-radius:50%; z-index:1; opacity: 60%; pointer-events: none}
.flex-columns-home .flex-columns-home-item:nth-child(even) .column-circle-bkg { right:-205px; left: initial; pointer-events:none}
.flex-columns-home .flex-columns-home-item:last-child .column-circle-bkg { display:none;}
/* END Background circles */

#main-holder {width:100%; height:100%; display:flex; flex-direction:column; min-height:100vh; justify-content:space-between; }

#mobile-homelink-area, #mobile-search-area, #mobile-tagline {display:none}

#header-holder {margin: 40px 0;}
#header {width:100%; position:relative; display:flex; justify-content:space-between;}

/* Toggle */
#menuToggle a {padding:0; display:inline-block; margin-top:0px; width:35px;}
#menuToggle a:hover span {background:#e19274;}
#menuToggle span {display:block; width:42px; height:6px; margin-bottom:5px; position:relative; background-color:#999; z-index: 1; transform-origin:0px 0px; transition: transform 0.3s cubic-bezier(0.77,0.2,0.05,1.0), background 0.3s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.3s ease;}
#menuToggle span:first-child {transform-origin:0% 0%;}
#menuToggle span:nth-last-child(3) {transform-origin:0% 100%;}
/* END Toggle */

/* Shortcuts */
#shortcuts-overlay {position:fixed; top:0; width:25%; height:100%; padding-right: 40px; background-color:#e19174; color:#fff; display:none; z-index:15; overflow:hidden;}
body.admin-bar #shortcuts-overlay {top:32px;}
#shortcuts-overlay.default {display:none;}
#shortcuts-overlay.shortcutsopen {display:inline-block; box-shadow: 0px 0px 10px rgba(0,0,0,.5); overflow: auto;}
#shortcuts-overlay-links {margin-top:20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#shortcuts-overlay-links ul {list-style:none; display:flex; flex-direction:column; margin: 0 0 0 40px;}
#shortcuts-overlay-bkg {position:fixed; top:0; width:100%; height:100%; background-color:rgba(255,255,255,0); display:none; z-index:9; overflow:hidden; pointer-events: none;}
#navigation-close {margin:20px 0 50px 40px;}
#navigation-close a {width:40px; height:40px; display:block; background-image: url(../pictures/close.svg); background-position: top 0 left 0; background-size:40px; background-repeat: no-repeat; }
#navigation-close a:hover {background-image: url(../pictures/close-hover.svg); }
ul.menu li.menu-item a {color:#fff; font-family:'RoundedMplus1c-Light'; font-size:28px;}
.nav-item-japan-label {color:#f9cbbd; margin:0; padding:0;}
.menu-item {margin-bottom:50px;}
#side-contact {margin: 0 0 0 40px; font-family:'RoundedMplus1c-Medium'; color: #f9e4ca;}
#side-contact a {color:#f9e4ca;}
/* END Shortcuts */

.primary-navigation {display: inherit;}

#main-body {z-index:2; position:relative;}
#main-body-holder {margin-bottom:200px;}
.home #main-body-holder {margin-bottom:0; z-index: 2; position: relative;}
#content {width:100%; height:100%; display:flex; flex-direction:column; min-height:100vh; justify-content:space-between; overflow: hidden;}
.flex-columns-holder {width:100%; display:flex; flex-direction:row; flex-wrap:wrap; justify-content: space-between; margin: 50px 0; position:relative;}

.flex-column {width:50%; display:flex; flex-direction:column;}
.flex-column-inner {width:75%;}

.flex-column.side {width:30%;}
.flex-column.side .flex-column-inner {width:85%;}
.flex-column.picture {width:70%;}
.flex-column.picture .flex-column-inner {width:100%;}

.flex-column img {margin-bottom:30px;}
.flex-column.full-width {width:100%; display:flex; flex-direction:row;}
.flex-column.full-width .flex-column-inner {width:91.63%;}
.flex-column.full-width img {margin-bottom:0;}

.flex-columns-holder.saison img {aspect-ratio: 100/66; object-fit: cover; width: 100%; height: 100%;}

#footer {width:100%; font-family:'RoundedMplus1c-Medium'; margin:0; min-height: 100px; display:flex; justify-content: space-around; position:relative; bottom:0; color:#999; background-color:#fbf5ec; padding: 20px 0; z-index:2;}
.footer-columns-holder {width:100%; display:flex; flex-direction:row; flex-wrap:wrap; justify-content: space-between; margin: 50px 0 0 0;}
.footer-column {width:25%; display:flex; flex-direction:column; z-index:2; margin-top: 140px;}
.footer-column:first-child {width:75%; margin-top:0;}
#footer-legal {font-size:14px; position: relative; z-index: 2} 

#footer-picture {width: 260px; height: 260px; display: inline-block; position: absolute; top: -100px;}
#footer-picture img {object-fit: cover; width: 100%; height: 100%; border-radius: 50%;}

.footer-social-networks {display:flex; flex-direction:row; align-items:center; justify-content:flex-start; width:100%; margin-bottom:30px;}
.social-network a {padding-right:15px; width:41px; height:41px; display:inline-block;}
.social-network:last-child a {padding-right:0px;}
.social-network-facebook a {background-image: url(../pictures/picto-facebook.svg); background-position: top 0 left 0; background-size: 40px; background-repeat: no-repeat; width:50px;}
.social-network-instagram a {background-image: url(../pictures/picto-instagram.svg); background-position: top 0 left 0; background-size: 40px; background-repeat: no-repeat; width:50px;}
.social-network-facebook a:hover {background-image: url(../pictures/picto-facebook-hover.svg); }
.social-network-instagram a:hover {background-image: url(../pictures/picto-instagram-hover.svg); }

#side-contact .social-network-facebook a {background-image: url(../pictures/picto-facebook-side.svg); background-position: top 0 left 0; background-size: 40px; background-repeat: no-repeat; width:50px;}
#side-contact .social-network-instagram a {background-image: url(../pictures/picto-instagram-side.svg); background-position: top 0 left 0; background-size: 40px; background-repeat: no-repeat; width:50px;}
#side-contact .social-network-facebook a:hover {background-image: url(../pictures/picto-facebook.svg); }
#side-contact .social-network-instagram a:hover {background-image: url(../pictures/picto-instagram.svg); }


/* The sticky class is added to the header with JS when it reaches its scroll position */
/*@keyframes slide-down {
	0% 	 { opacity: 0; transform: translateY(-100%);} 
    100% { opacity: 1; transform: translateY(0);} 
}*/

#header-holder.sticky { top:0; height:140px; width:100%; z-index:30; transition:all 1s ease-out; animation:slide-down 1s;}
body.admin-bar #header-holder.sticky  {top:32px;}
#header-holder.sticky #header, body#home #header-holder.sticky #header {background:none; height:100%; display:flex; align-items:center;}
#header-holder.sticky #banner {margin:0px;}
#header-holder.sticky #banner-tagline {font-size:1.4em; min-width:220px;}
#header-holder.sticky #banner-logo {width:140px; z-index:33;}
#header-holder.sticky #banner-logo img {width:100%; left:0}
#header-holder.sticky #primary-nav {width:75%;}
.slicknav_menu {position:fixed; width:100%; height:80px; top:0; z-index:32;}

/* Home */
.flex-columns-home {display:flex; flex-direction:column; width:100%; z-index:2; position:relative;}
.flex-columns-home .flex-columns-home-item {display:flex; margin:0; overflow:hidden;}
.flex-columns-home .flex-columns-home-item:nth-child(odd) .flex-columns-holder {flex-direction:row-reverse; }
.flex-columns-home .flex-columns-home-item:nth-child(odd) a.arrow {transform: rotate(180deg);}
.flex-columns-home .flex-columns-home-item:first-child .flex-columns-holder {margin:0;}
.flex-columns-home .flex-columns-home-item:first-child .flex-columns-holder .flex-column:first-child {justify-content: center;}
.flex-columns-home .flex-columns-home-item:nth-child(even) {background-color:#fff;}
.flex-columns-home .flex-columns-home-item:last-child .flex-columns-holder {margin-bottom:200px;}
.flex-columns-home .flex-columns-holder {margin:100px 0 0 0;}
.flex-columns-home .flex-column {width:50%;}
.flex-columns-home .flex-column:nth-child(odd) {align-items:flex-end;}
.flex-columns-home .flex-column:nth-child(even) {align-items:flex-start;}
.flex-columns-home .flex-columns-home-item:nth-child(even) .flex-column:nth-child(odd) {align-items:flex-start;} 
.flex-columns-home .flex-columns-home-item:nth-child(even) .flex-column:nth-child(even) {align-items:flex-end;} 
.flex-columns-home .flex-column-inner {width:95%; display:flex; flex-direction:column;}
.flex-columns-home .flex-column-inner h2 {margin-bottom:30px;}
.flex-columns-home .flex-column-inner h2 span.japan {display:inline-block; margin-top:14px;}
.flex-columns-home .flex-column img {aspect-ratio:1/1; object-fit: cover; margin:60px 0 0 0;}

/* Nos Produits */
.wc-block-product-categories {margin-top: 150px;}
.flex-grid-filters ul, .wp-block-woocommerce-product-categories ul {list-style: none; margin:0 0 0 -20px; padding:0; font-family: 'RoundedMplus1c-Medium';}
.flex-grid-filters li, .wp-block-woocommerce-product-categories li {margin: 0 0 20px 0; position: relative;}
.flex-grid-filters li a, .wp-block-woocommerce-product-categories li a {font-weight:100; background-image: url("../pictures/bullet-grey.svg"); position: relative;  background-position: center left 0px; background-size:16px; background-repeat: no-repeat; padding-left:22px; }
.widget-area .widget a {font-weight:100; text-decoration: none;}
.flex-grid-filters li a:hover, .flex-grid-filters li a.active, .wp-block-woocommerce-product-categories li a:hover {color:#e19174; text-decoration: none;}
.flex-grid-filters li a.active {background: none;}
.filter-on {direction:inline-block; position:absolute; left:-33px; width:50px; height:25px; background-image: url("../pictures/filter-on.svg"); background-position: center; background-size:100%; background-repeat: no-repeat; }
.flex-grid-holder {display:flex; flex-direction:row; flex-wrap:wrap; width:100%; justify-content: space-between; margin: 50px 0;}
.flex-grid-filters {display:flex; flex-direction:column; flex-wrap:wrap; width:16.66%;}
.flex-grid-items {display:flex; flex-direction:row; flex-wrap:wrap; width:83.34%; justify-content: space-between;}
.flex-grid-item {display:flex; flex-direction:column; flex-wrap:wrap; width:32%; aspect-ratio:1/1; position:relative; margin-bottom: 2%; overflow: hidden;}
.flex-grid-item-label {position:absolute; display:none; width:100%; height:100%; justify-content:center; align-items:center; background-color:rgba(247,156,124,0.8); color:#fff; text-align:center; font-family:'RoundedMplus1c-Medium'; line-height:1.1em; font-size:22px;}
.flex-grid-item-label span {display:block; margin-top: 16px;}
.flex-grid-item:hover .flex-grid-item-label {display:flex;}
.flex-grid-item-label-inner {padding: 15%;}
.flex-grid-item img { object-fit:cover; aspect-ratio: 1/1; width:100%; height:100%;}

/* Produit Woo Commerce */
a.woocommerce-product-gallery__trigger {display:none} /* Retire la loupe sur l'image du produit */
.single-product.left-sidebar .content-area {width:100%!important;}

/* Produits Woo Commerce (shop) */
.left-sidebar .widget-area {width:16.66%; float:left; margin-right:0;}
.left-sidebar .content-area {width: 83.34%; float:right; margin-right:0;}
h1.woocommerce-products-header__title, .archive h1  {margin-left:0;}
.storefront-sorting {display:none} /* Retire le commentaire de résultat sous la grille de produits/catégories */
ul.products {display:flex; flex-direction:row; flex-wrap:wrap; width:100%; justify-content:flex-start; margin-top: 50px;}
.site-main ul.products.columns-3 li.product { float:none; display: flex; flex-direction: column; flex-wrap: wrap; width: 32%; aspect-ratio: 1/1; position: relative; margin-bottom: 2%; overflow: hidden; margin-right:2%; }
a.button.product_type_simple {display:none;}
ul.products li.product img {display:block; margin:0; object-fit:cover; aspect-ratio:1/1; width:100%; height:100%;}
ul.products li.product .woocommerce-LoopProduct-link {display:block; width:100%; height:100%;}
ul.products li.product .woocommerce-loop-product__title { position:absolute; display:none; width:100%; height:100%; justify-content:center; align-items:center; background-color: rgba(247,156,124,0.8); color:#fff; text-align:center; font-family:'RoundedMplus1c-Medium'; line-height:1.1em; font-size:22px; top:0; left:0; font-weight:100; margin-bottom:0;}
ul.products li.product .woocommerce-LoopProduct-link:hover .woocommerce-loop-product__title {display:flex;}
.widget-area .widget li.current-category-item a {color:#e19174; text-decoration:none;}
.wp-block-woocommerce-product-categories li.current-category-item a {background:none;}


/* Responsive breakpoints */
@media (max-width: 1400px) {
	#shortcuts-overlay {width: 30%;}
}
@media (max-width: 1260px) {
	#shortcuts-overlay {width: 40%;}
	.flex-grid-holder {justify-content: inherit;}
	.flex-grid-items {width: 73.34%;}
	#logo {right:0px;}
	#content-circle-bkg {right:-201px;}
}
@media (max-width: 991px) {
	#footer-items {flex-direction:column; justify-content:flex-start; }
	#shortcuts-overlay {width: 50%;}
	.flex-grid-filters {width:33%;}
	.flex-grid-items {width:66%;}
	.flex-grid-filters ul {margin: 0;}
	.flex-grid-item {width: 49%;}
}
@media (min-width: 700px) {
	ul, ol {margin-bottom:0;}
}
@media (max-width: 767px) {
	#shortcuts-overlay {display:none;}
	#mobile-side-column {display:inline-block;}
	.notmobile {display: none;}
	h1 {font-size:2em; margin-left:0;}
	h2 {font-size:1.6em;}
	h3 {font-size:1.2em;}
	a.back-button {position:relative; margin:13px 0;}
	.bullet {display:none;}
	.retrait-heading {margin-left:0;}
	.backbutton {top:initial; left:0; bottom: -30px}
	.homeblocks-template-default .flex-columns-home-item:last-child .backbutton {bottom:150px; left:0; top:initial;}
	.seasonblocks-template-default .backbutton {top:inherit; left:0; bottom:-50px;}
	.page-template-template-season .backbutton {top:initial; left:0;  bottom:-20px;}
	body.admin-bar .flex-columns-home .flex-columns-home-item {padding-bottom: 50px;}
	
	#banner-logo {width:auto;}
	#banner-logo a {left:-10px; position:relative;}
	#banner-logo img {width:140px;}
	#mobile-homelink-area {display:inline-block; position:fixed; width:140px; height:65px; top:5px; margin:0 auto; right:20px; z-index: 32;}
	body.admin-bar #mobile-homelink-area, body.admin-bar .slicknav_menu, #shortcuts-overlay {top:48px;}
	body.admin-bar #wpadminbar {position: fixed;}
	#mobile-homelink-area img {width:100%; height:100%; object-fit:contain;}
	#main-body {flex-direction: column;}
	#main-body-holder {margin-top:100px;}
	.flex-columns-holder {flex-direction:column; margin: 30px 0;}
	.flex-column, .footer-columns-holder {width:100%; margin-bottom:20px;}
	.flex-column-inner, .flex-column-inner:first-child, .footer-column, .footer-column:first-child, .flex-column.full-width .flex-column-inner {width:100%; margin-top:10px;}
	.flex-column img {margin-bottom:10px;}
	#footer-picture {display:none;}
	
	.flex-columns-home .flex-columns-home-item:nth-child(odd) a.arrow {transform: rotate(0deg);}
	.flex-columns-home .flex-columns-holder, .flex-columns-home .flex-columns-home-item:first-child .flex-columns-holder, .flex-columns-home .flex-columns-home-item:nth-child(2n+1) .flex-columns-holder {flex-direction: column-reverse;}
	.flex-columns-home .flex-column {width:100%;}
	.flex-columns-home .flex-column img {margin:0;}
	.flex-columns-home .flex-columns-home-item:first-child .flex-columns-holder .flex-column:first-child {justify-content:flex-start;}
	.column-circle-bkg {opacity:30%;}
	
	.flex-column.side, .flex-column.side .flex-column-inner, .flex-column.picture {width:100%;}
	
	.flex-grid-holder, .flex-grid-items {flex-direction: column;}
	.flex-grid-filters, .flex-grid-items, .flex-grid-item {width: 100%;}
	.flex-grid-item {margin-bottom: 20px;}
	
	.single-product .flex-columns-holder {flex-direction: column-reverse;}
	.left-sidebar .content-area, .left-sidebar .widget-area, .site-main ul.products.columns-3 li.product {width: 100%;}
	.post-type-archive-product #main-body-holder .container, .tax-product_cat #main-body-holder .container {flex-direction: column-reverse; display: flex; z-index: 2;}
	.wc-block-product-categories {margin-top:20px;}
	
}
@media (max-width: 480px) {
	.seller-grid-item .exposant-visuel img {min-height:156px;}
}