/*
 * Ochanta — Menu vertical (the7_nav-menu).
 *
 * Sous-menus toujours dépliés (dt-sub-menu-display-always) ou dépliés au clic
 * (dt-sub-menu-display-on_click / on_item_click, gérés par assets/widgets/js/vertical-menu.js).
 */

.elementor-widget-the7_nav-menu .elementor-widget-container {
	overflow: hidden;
}

.dt-nav-menu {
	--icon-size: 1em;
	--icon-spacing: 5px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dt-nav-menu li {
	position: relative;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	width: 100%;
	list-style: none;
}

.dt-nav-menu a {
	position: relative;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	width: 100%;
	border: 0 solid;
	line-height: 1.2;
	text-decoration: none;
	transition: background .3s, border-color .3s, color .3s;
}

.dt-nav-menu > li > a {
	border-color: var(--the7-divider-color);
	color: var(--the7-title-color);
	font-size: var(--the7-text-big-font-size);
	line-height: var(--the7-text-big-line-height);
}

.vertical-sub-nav {
	--sub-icon-size: 1em;
	--sub-icon-spacing: 5px;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	transition: opacity .5s;
}

.content ul.vertical-sub-nav {
	margin: 0;
}

.vertical-sub-nav > li a {
	align-items: var(--sub-align-items, center);
	justify-content: var(--sub-justify-content);
	border-color: var(--the7-divider-color);
	color: var(--the7-title-color);
	font-size: var(--the7-base-font-size);
	line-height: var(--the7-base-line-height);
	text-align: var(--sub-text-align);
}

.vertical-sub-nav > li .item-content {
	align-items: var(--sub-item-align, center);
}

.the7-e-mega-menu-sub-nav .vertical-sub-nav {
	visibility: inherit !important;
	opacity: 1 !important;
}

.dt-nav-menu .subtitle-text {
	font-size: 70%;
}

.dt-nav-menu li .item-content {
	display: flex;
	flex-flow: var(--item-direction, row nowrap);
	align-items: var(--item-align, center);
	justify-content: var(--item-justify, inherit);
	order: 1;
}

.dt-nav-menu li .item-content > i,
.dt-nav-menu li .item-content img,
.dt-nav-menu li .item-content > svg {
	box-sizing: content-box;
	align-items: center;
	justify-content: center;
	order: var(--icon-order, 0);
	width: 1em;
	margin: var(--icon-margin);
	transition: all .3s;
}

.dt-nav-menu li .item-content .menu-item-text {
	order: 1;
	transition: color .3s;
}

/* Alignement (gauche, centre, droite) hérité des réglages */
.dt-nav-menu__align-center ul li,
.dt-nav-menu__align-center ul li a,
.dt-nav-menu__align-center ul li a > .item-content {
	align-items: inherit;
	justify-content: inherit;
	text-align: inherit;
}

.dt-nav-menu__align-right ul li,
.dt-nav-menu__align-right ul li a {
	justify-content: inherit;
}

/* Icônes d'éléments placées au-dessus du texte (réglages du méga-menu) */
.dt-nav-menu li > :is(.mega-menu-img-top, .mega-menu-img-top_align_left, .mega-menu-img-right_top, .mega-menu-img-left_top) .item-content {
	flex-flow: column wrap;
}

/* Séparateurs */
.widget-divider-yes .dt-nav-menu li:first-child::before,
.widget-divider-yes .dt-nav-menu li::after {
	position: absolute;
	bottom: calc((var(--grid-row-gap, 0px) - var(--divider-width, 0px)) / 2);
	left: 0;
	width: 100%;
	border-color: var(--the7-divider-color);
	border-top-width: var(--divider-width, 0px);
	border-bottom-width: 0;
	content: "";
}

.widget-divider-yes .dt-nav-menu > li:first-child::before {
	bottom: calc(100% - var(--divider-width, 0px));
}

.widget-divider-yes .dt-nav-menu li:last-child::after {
	bottom: calc(-1 * var(--divider-width, 0px) / 2);
}

.widget-divider-yes .dt-nav-menu--main:not(.last-item-border-hide) {
	padding-bottom: calc(var(--divider-width, 0px) / 2);
}

.sub-widget-divider-yes .vertical-sub-nav li:first-child::before,
.sub-widget-divider-yes .vertical-sub-nav li::after {
	position: absolute;
	bottom: calc((var(--sub-grid-row-gap, 0px) - var(--divider-sub-width, 0px)) / 2);
	left: 0;
	width: 100%;
	border-color: var(--the7-divider-color);
	border-top-width: var(--divider-sub-width, 0px);
	border-bottom-width: 0;
	content: "";
}

.sub-widget-divider-yes .vertical-sub-nav > li:first-child::before {
	bottom: calc(100% - var(--divider-sub-width, 0px));
}

.sub-widget-divider-yes .vertical-sub-nav li:last-child::after {
	bottom: calc(-1 * var(--divider-sub-width, 0px) / 2);
}

/* Icônes sur le côté */
.dt-icon-align-side.dt-icon-position-left .dt-nav-menu > li > a .item-content { margin-left: var(--icon-spacing); padding-left: var(--icon-size); }
.dt-icon-align-side.dt-icon-position-right .dt-nav-menu > li > a .item-content { margin-right: var(--icon-spacing); padding-right: var(--icon-size); }
.dt-nav-menu_align-center .dt-icon-align-side .dt-nav-menu > li > a .item-content { margin: 0 var(--icon-spacing); padding: 0 var(--icon-size); }
.dt-sub-icon-align-side.dt-sub-icon-position-left .vertical-sub-nav > li .item-content { margin-left: var(--sub-icon-spacing); padding-left: var(--sub-icon-size); }
.dt-sub-icon-align-side.dt-sub-icon-position-right .vertical-sub-nav > li .item-content { margin-right: var(--sub-icon-spacing); padding-right: var(--sub-icon-size); }
.dt-sub-menu_align-center .dt-sub-icon-align-side .vertical-sub-nav > li .item-content { margin: 0 var(--sub-icon-spacing); padding: 0 var(--sub-icon-size); }

/* ------------------------------------------------------------------ *
 * Sous-menus dépliés au clic
 * ------------------------------------------------------------------ */

/* Masqué jusqu'à l'initialisation du script, pour éviter un saut à l'affichage */
.dt-sub-menu-display-on_click,
.dt-sub-menu-display-on_item_click {
	visibility: hidden;
}

.dt-sub-menu-display-on_click.och-ready,
.dt-sub-menu-display-on_item_click.och-ready,
.the7-e-mega-menu :is(.dt-sub-menu-display-on_click, .dt-sub-menu-display-on_item_click),
.the7-e-sticky-spacer :is(.dt-sub-menu-display-on_click, .dt-sub-menu-display-on_item_click) {
	visibility: inherit !important;
}

.dt-sub-menu-display-on_click .dt-nav-menu li > .vertical-sub-nav,
.dt-sub-menu-display-on_item_click .dt-nav-menu li > .vertical-sub-nav {
	display: none;
}

.dt-sub-menu-display-on_click .dt-nav-menu li.act > .vertical-sub-nav,
.dt-sub-menu-display-on_item_click .dt-nav-menu li.act > .vertical-sub-nav {
	display: block;
}

/* Flèche de dépliage */
.dt-sub-menu-display-always .next-level-button,
.dt-sub-menu-display-on_click.indicator-off .next-level-button,
.dt-sub-menu-display-on_item_click.indicator-off li .next-level-button {
	display: none;
}

.dt-nav-menu .has-children > a .next-level-button {
	position: relative;
	display: flex;
	align-self: center;
	visibility: visible;
	line-height: 1.2;
	text-align: center;
	pointer-events: auto;
	transition: color .3s;
}

.dt-sub-menu-display-on_click li:not(.has-children) .next-level-button,
.dt-sub-menu-display-on_item_click li:not(.has-children) .next-level-button {
	visibility: hidden;
	pointer-events: none;
}

/* Zone de clic agrandie */
.dt-nav-menu .has-children > a .next-level-button::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	min-width: 50px;
	height: 100%;
	min-height: 30px;
	content: "";
	cursor: pointer;
	transform: translate3d(-50%, -50%, 0);
}

.dt-nav-menu .has-children > a .next-level-button i {
	width: 1em;
}

.dt-nav-menu li > a .next-level-button svg {
	width: 1em;
	height: auto;
	fill: var(--the7-title-color);
	color: var(--the7-title-color);
	transition: all .3s;
}

/* Deux icônes : fermé / ouvert */
.dt-nav-menu li.has-children > a .next-level-button > :nth-child(1) { visibility: visible; opacity: 1; }
.dt-nav-menu li.has-children > a .next-level-button > :nth-child(2) { position: absolute; visibility: hidden; opacity: 0; }
.dt-nav-menu li.has-children.open-sub > a .next-level-button > :nth-child(1) { visibility: hidden; opacity: 0; }
.dt-nav-menu li.has-children.open-sub > a .next-level-button > :nth-child(2) { visibility: visible; opacity: 1; }

.dt-icon-position-left .dt-nav-menu > li > a .next-level-button,
.dt-sub-icon-position-left .vertical-sub-nav .next-level-button {
	order: 0;
	margin-right: 5px;
}

.dt-icon-position-right .dt-nav-menu > li > a .next-level-button,
.dt-sub-icon-position-right .vertical-sub-nav .next-level-button {
	order: 2;
	margin-left: 5px;
}

.dt-icon-align-side .dt-nav-menu > .has-children > a .next-level-button,
.dt-sub-icon-align-side .vertical-sub-nav > .has-children a .next-level-button {
	position: absolute;
}

.dt-icon-position-left.dt-icon-align-side .dt-nav-menu > .has-children > a .next-level-button,
.dt-sub-icon-position-left.dt-sub-icon-align-side .vertical-sub-nav > .has-children a .next-level-button {
	left: 0;
}

.dt-icon-position-right.dt-icon-align-side .dt-nav-menu > .has-children > a .next-level-button,
.dt-sub-icon-position-right.dt-sub-icon-align-side .vertical-sub-nav > .has-children a .next-level-button {
	right: 0;
}

/* Dans un méga-menu, flèches visibles seulement à l'ouverture */
.the7-e-mega-menu .dt-nav-menu .has-children > a .next-level-button {
	display: none;
}

.the7-e-mega-menu.dt-hovered .dt-nav-menu .has-children > a .next-level-button {
	display: flex;
}
