/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/


/* ------------------------------------------------------------
MENU MOBILE
------------------------------------------------------------ */


/*Affichage - navigation mobile vs desktop*/
@media screen and (max-width: 960px) {
  .header-main .hide-for-medium, .header-bottom .hide-for-medium {
    display: none !important;
  }

  .header-main .show-for-medium, .header-bottom .show-for-medium {
    display: flex !important;
  }

  .header-main .nav-right {
    margin-left: auto !important;
    margin-right: 0 !important;
  }
}

/* Cache le drapeau - mobile*/
.mobile-sidebar .wpml-ls-flag, .mobile-sidebar .iclflag, .mobile-sidebar img[src*="flags"] {
  display: none !important;
}

/* ------------------------------------------------------------
HEADER
------------------------------------------------------------ */
/* Header avec fond gris - Page détail de produit et la page Shop*/
.woocommerce-shop #masthead, .single-product #masthead {
    background-color: #A3A3A3 !important;
}

/* --- Sticky Header --- */
/* Couleur de fond du Header quand on scroll */
.header-wrapper.stuck {
  background-color: #a3a3a3 !important;
}

/* --- Logo - 2 dimensions selon sticky --- */
/* Logo - défaut */
body #logo img {
  max-width: 242px !important;
  max-height: 27px !important;
  height: auto !important;
  transition: all 0.2s ease !important; 
}

/* Logo - sticky */
body .stuck #logo img {
  max-width: 179px !important;
  max-height: 20px !important;
}

/* Garde le header toujours au-dessus du hero */
#header {
  position: relative !important;
  z-index: 999 !important; 
}
/* Section qui remonte (pour hero) */
.hero-header-section {
  margin-top: -120px !important;
}

/* Ajout padding sur les côtés*/
#header .header-inner {
  padding-left: 0.9375rem !important;
  padding-right: 0.9375rem !important;
}

/* Menu principal*/
/* Cache les fleche niveau 1 */
.header-nav li.has-dropdown > a > i, .header-nav li.has-dropdown > a::after {
	  display: none !important;
}
/* Cache le triangle de la boite de sous-menu */
.nav-dropdown-has-arrow .nav-dropdown,
.nav-dropdown-has-arrow .nav-dropdown::before,
.nav-dropdown-has-arrow .nav-dropdown::after,
.nav-dropdown-has-arrow li.has-dropdown::before,
.nav-dropdown-has-arrow li.has-dropdown::after {
  border: none !important;
}
.nav-dropdown-has-arrow .nav-dropdown::before,
.nav-dropdown-has-arrow .nav-dropdown::after {
  display: none !important;
}

/* Fait remonter la boîte déroulante par-dessus le fond gris du menu - uniquement pour le menu en mode Sticky*/
.stuck .header-nav .nav-dropdown,
.is-stuck .header-nav .nav-dropdown {
  margin-top: -15px !important; 
}

/*Cache le drapeau - menu langue*/
.header-language-dropdown .image-icon,
.header-language-dropdown .icon-image,
.header-language-dropdown img {
  display: none !important;
}


/* ------------------------------------------------------------
HEADER - HERO
------------------------------------------------------------ */

/* HERO - HOME*/
.homeTitle h1{
    font-family: Roboto;
    font-weight: 700;
    font-size: 3.2em;
	line-height: 1em;
	color: #fff;
}
.primary.heroBtn{
	font-family: Roboto;
	font-size: 1em;
	background-color: rgb(241, 101, 91);
	padding: 3px 30px;
}
.primary.heroBtn:a:hover{
	background-color: rgb(251, 133, 125);
}


/* Slogan */
.homeSlogan{
	padding: 1.5% 0;
}
.homeSlogan h2{
	line-height: 1em !important;
}

/* HERO - INTERIEUR*/
.heroTitle h1{
    font-family: Akatab, sans-serif !important;
    font-weight: 700;
    font-size: 3.2em;
	line-height: 1em;
	color: #fff;	
}


/* Animation du haut vers le bas - logo About */
@keyframes myFadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-30px); 
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.custom-fade-in-up {
  animation: myFadeInDown 0.9s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}


    

/* ------------------------------------------------------------
HOME PAGE - PRODUCT CATEGORIES
------------------------------------------------------------ */
.product-category .box {
  overflow: hidden !important;
  position: relative !important;
}

.box-text{font-size: 1em !important;}

/* Conteneur principal */
.product-category .box {
  overflow: hidden !important;
  position: relative !important;
}

/* Bandeau catégorie en haut à gauche */
.product-category .box-text {
  position: absolute !important;
  top: 50px !important;
  left: 0 !important;
  bottom: auto !important;
  right: auto !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  z-index: 3 !important;
  pointer-events: none !important;
}
.product-category .box-overlay.dark .box-text{
	text-shadow: none !important;
}



/* Fond du bandeau catégorie */
.product-category .box-text::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-color: #ffffff !important;
  z-index: -1 !important;
  transform: translateY(0) translateX(0) !important;
  transition: transform 0.15s ease-in-out, opacity 0.15s ease-in-out !important;
}

/* Texte à l'intérieur du bandeau - en noir par défaut */
.product-category .box-text * {
  color: #666 !important; 
  margin: 0 !important;
  padding: 5px 10px !important;
  display: block !important;
  transition: color 0.15s ease-in-out !important; 
  white-space: nowrap !important;
}


/* ---------------------
AU SURVOL (HOVER)  
---------------------- */

/* Fait disparaître le fond blanc */
.product-category:hover .box-text::before {
  opacity: 0 !important;
  display: none !important;
}

/* Positionne le nom de la categorie au centre*/
.product-category:hover .box-text {
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  transition: none !important;
}
.product-category:hover .box-text h5.uppercase{
	text-transform: none !important;
	font-size: 2.5em !important;
}

/* Le nom de catégorie devient blanc lorsque au centre - force transition à ne pas afficher en noir */
.product-category:hover .box-text * {
  color: #ffffff !important; 
  font-weight: bold !important;
  text-transform: uppercase !important;
  font-size: 1.1em !important;
  transition: none !important; 
}


/* ------------------------------------------------------------
HOME - NEWEST PRODUCTS
------------------------------------------------------------ */
.wp-singular .title-wrapper p{
	font-size: 1.2em;
}

/* ------------------------------------------------------------
LISTING CATÉGORIES
------------------------------------------------------------ */
.price-wrapper{
	display:none !important;
}

/* ------------------------------------------------------------
PAGINATION
------------------------------------------------------------ */
.nav-pagination>li>.current{
	border:0 !important;
	background: none !important;
	color: #000 !important;
	font-size: 1em !important;
}
.nav-pagination>li>a{	
	border:0 !important;
	background: none !important;
	color: #8f8f8f !important;
	font-size: 1em !important;
}
.nav-pagination>li>a:hover{
	color: #000 !important;
}


/* ------------------------------------------------------------
CONTACT PAGE
------------------------------------------------------------ */
.contactTxt h3{
	font-size: 2.2em;
	color: #666;
}
.colFormContact input[type=submit], input[type=submit].button{
	background-color: #f1655b;
	border-radius: 35px;
	padding: 0 40px;
}
.colFormContact label{
	text-transform: uppercase;
	font-weight: 600;
	color: #666;
}

    
/* ------------------------------------------------------------
FOOTER
------------------------------------------------------------ */
.logoFooter .ux-logo-link{margin-left: 10px;}
.footerCol1 .social-icons{margin-left: 8px;}

@media only screen and (min-width: 1750px) {
	.logoFooter .ux-logo-link, .footerCol1 .social-icons{margin-left: 0;}
}

.footerCol1{
	padding: 0;
}
#footer .ux-logo img {
  max-width: 179px !important;
  max-height: 20px !important;
  height: auto !important;
}
.logoFooter{
	padding: 0 0 15px 0;
}
.social-icons.follow-icons a.plain{
	color: #fff;
}
.menu-menufooter-container ul{
  display: grid;
  grid-template-columns: repeat(4, 1fr); 
  gap: 0; 
  padding: 0;
  margin: 0;
  list-style: none;
}

.menu-menufooter-container ul li{
	text-transform: uppercase;
}

.menu-menufooter-container ul li a{
	color: #fff;
	font-size: 0.813em;
	font-weight: 600;
}
.menu-menufooter-container ul.menu>li+li {
	border-top:0;
}

/* 3 colonnes */
@media (max-width: 992px) {
  .menu-menufooter-container ul {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* 2 colonnes */
@media (max-width: 768px) {
  .menu-menufooter-container ul {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* 1 colonne */
@media (max-width: 480px) {
  .menu-menufooter-container ul {
    grid-template-columns: 1fr;
    gap: 10px 0; 
  }
}

/* Copyright */
.copyright a{
	color: #fff;
}
.copyright a:hover{
	color: #f1655b;
}

/* Absolute Footer*/
.absolute-footer{
	display: none;
}