/*
╔══════════════════════════════════════════════════════════════════════════════╗
║                                                                              ║
║                   MYCARTOSOINS - NAVIGATION MODULE                        ║
║                                                                              ║
║   Extrait de css-general.css - Sections: 3                          ║
║   Chargement conditionnel selon les pages                                    ║
║                                                                              ║
╚══════════════════════════════════════════════════════════════════════════════╝
*/

   ║  ██████╗  ██████╗   SECTION 3                                                ║
   ║  ██╔═══╝  ╚════██╗  HEADER & NAVIGATION                                      ║
   ║  ╚█████╗   █████╔╝  Navigation et en-tête                                    ║
   ║   ╚═══██╗  ╚═══██╗  .et_pb_section_0_tb_header, .icon-nav                    ║
   ║  ██████╔╝ ██████╔╝  .header-custom, .primary-menu                            ║
   ║  ╚═════╝  ╚═════╝                                                            ║
   ║                                                                              ║
   ╚══════════════════════════════════════════════════════════════════════════════╝ */

/* HEADER */

.et_pb_section_0_tb_header{
	border-bottom: 1px solid #eaeaea;
}

.menu-col ul.et-menu.nav {
	display: flex;
	flex-direction: column;
	align-content: flex-start;
}

.scrolled {
	position: initial !important;
	top: 0 !important;
	max-width: 200px !important;
}
.et_pb_image_0_tb_header.main-logo.scrolled{
	margin-top:initial!important
}

.icon-nav, .nav-icon-1 {
	width: 30px;
	height: 22px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	cursor: pointer;
	z-index: 1000;
}

.icon-nav span, .nav-icon-1 span {
	height: 4px;
	width: 100%;
	background: #121234;
	border-radius: 2px;
	transition: all 0.3s ease-in-out;
}

/* Animation "croix" */
.icon-nav.open span:nth-child(1), .nav-icon-1.open span:nth-child(1) {
	transform: translateY(9px) rotate(45deg);
	background:white
}

.icon-nav.open span:nth-child(2), .nav-icon-1.open span:nth-child(2) {
	opacity: 0;
}

.icon-nav.open span:nth-child(3), .nav-icon-1.open span:nth-child(3) {
	transform: translateY(-9px) rotate(-45deg);
	background:white
}

.header-custom a.btn-fiche:hover{
	color:white!important
}

.header-custom a.btn-fiche{
	width: fit-content;
	white-space: nowrap;
}
.header-custom {
	justify-content: space-between;
	align-items: center;
	margin-bottom:20px;
	padding-bottom:10px;
	border-bottom:1px solid #ececec
}

.et-db #et-boc .et-l .et_pb_row_0_tb_header {
	justify-content: space-between;
}

#et-main-area { transition: padding-top .2s ease; }

/* Conteneur du menu */
.primary-menu{
	margin: 0;
	padding: 0 8px;             /* petit retrait latéral pour que les traits ne collent pas aux bords */
	list-style: none;
	display: flex;
	flex-direction: column;
}

/* Éléments */
.primary-menu > li{
	margin: 0;
	position: relative;
	list-style: none !important; /* au cas où un thème ajoute des puces */
	border-bottom: 1px solid rgba(255,255,255,.7);  /* trait séparateur */
}

/* Lien */
.primary-menu > li > a{
	display: block;
	padding: 20px 0;            /* espace vertical entre les items */
	color: #fff;
	text-decoration: none;
	font-weight: 500;
	line-height: 1.3;
}

/* Hover / focus : léger slide + trait plus net */
.primary-menu > li > a:hover,
.primary-menu > li > a:focus{
	transform: translateX(4px);
	text-decoration: none;
}
.primary-menu > li:hover{
	border-bottom-color: #fff;
}

/* Option : pas de trait sous le dernier item */
.primary-menu > li:last-child{
	border-bottom: 1px solid rgba(255,255,255,.7); /* garde-le si tu veux le trait final */
	/* sinon commente la ligne au-dessus */
}

/* Sous-menus (si jamais tu en as) : on force vertical + style sobre */
.primary-menu .sub-menu{
	margin: 0 0 8px 0;
	padding: 0 0 0 14px;       /* léger retrait */
	list-style: none;
	border-left: 1px solid rgba(255,255,255,.3);
}
.primary-menu .sub-menu > li{
	border-bottom: none;
}
.primary-menu .sub-menu a{
	padding: 8px 0;
	color: rgba(255,255,255,.9);
	font-weight: 400;
}

.et-menu li{
	padding:10px;
	border-bottom:1px solid white
}

.menu-closed-open{
	overflow-y:scroll
}
.et_pb_livesearch_container{
	bottom:100%;
}
.et_pb_livesearch_inner{
	border-radius:20px
}




/* ╔══════════════════════════════════════════════════════════════════════════════╗