/*
 * Ochanta — Boîte d'icône (the7_icon_box_widget) et éléments communs avec la grille.
 *
 * Position de l'icône : classes icon-position[-tablet|-mobile]-left|right|top ;
 * alignement : icon-vertical-align[-…]-start|center|end ; écart : --icon-spacing.
 */

.the7-box-wrapper {
	display: flex;
	flex-flow: row nowrap;
	overflow: hidden;
	color: inherit;
	text-decoration: none;
	transition: all .3s ease;
}

.the7-box-wrapper .box-content-wrapper,
.the7-box-grid-wrapper .box-content-wrapper {
	display: flex;
	width: 100%;
}

/* Icône */
.the7-box-wrapper .elementor-icon-div,
.the7-box-grid-wrapper .elementor-icon-div {
	display: inline-flex;
	margin: 0 var(--icon-spacing, 15px) 0 0;
}

.the7-box-wrapper .elementor-icon,
.the7-box-grid-wrapper .elementor-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: fit-content;
	border-color: var(--the7-accent-color);
	font-size: 32px;
	line-height: 1;
}

.elementor-icon-div i {
	color: var(--the7-accent-color);
	transition: color .3s ease;
}

.elementor-icon-div svg {
	height: auto;
	fill: var(--the7-accent-color);
	color: var(--the7-accent-color);
	transition: all .3s ease;
}

.the7-box-grid-wrapper .elementor-icon i::before,
.the7-box-grid-wrapper .elementor-icon svg::before {
	max-width: 100%;
}

/* Contenu */
[class*="elementor-widget-the7_icon_box"] .box-content {
	display: flex;
	flex-flow: column nowrap;
	flex-grow: 1;
	justify-content: center;
}

.the7-box-wrapper .box-heading,
.the7-box-grid-wrapper .box-heading {
	display: inline-block;
	margin-bottom: 0 !important;
	color: var(--the7-h4-color, var(--the7-title-color));
	font-family: var(--the7-h4-font-family);
	font-size: var(--the7-h4-font-size);
	font-style: var(--the7-h4-font-style, normal);
	font-weight: var(--the7-h4-font-weight);
	line-height: var(--the7-h4-line-height);
	text-decoration: none;
	text-transform: var(--the7-h4-text-transform, none);
	transition: color .3s ease;
}

.the7-box-wrapper .box-heading a,
.the7-box-grid-wrapper .box-heading a {
	color: inherit;
	transition: color .3s ease;
}

.the7-box-wrapper .box-heading a:hover,
a.the7-box-wrapper:hover .box-heading a,
.the7-box-grid-wrapper .box-heading a:hover {
	color: var(--the7-h4-color, var(--the7-title-color));
}

.the7-box-wrapper .box-description,
.the7-box-grid-wrapper .box-description {
	margin: 10px 0 0;
	color: var(--the7-base-color);
	transition: color .3s ease;
}

.the7-box-wrapper .box-description p,
.the7-box-grid-wrapper .box-description p {
	margin-bottom: 0;
}

.the7-box-wrapper .box-button,
.the7-box-grid-wrapper .box-button {
	margin-top: 15px;
	transition: all .3s ease;
}

/* ------------------------------------------------------------------ *
 * Position de l'icône (ordinateur, puis tablette et mobile)
 * ------------------------------------------------------------------ */

.icon-position-right .elementor-icon-div {
	order: 2;
	margin: 0 0 0 var(--icon-spacing, 15px);
}

.icon-position-top .elementor-icon-div {
	margin: 0 0 var(--icon-spacing, 15px) 0;
}

.icon-position-top .the7-box-wrapper,
.icon-position-top .box-content-wrapper {
	flex-wrap: wrap;
}

.icon-position-left .box-content-wrapper,
.icon-position-right .box-content-wrapper {
	flex-wrap: nowrap;
}

.icon-vertical-align-start.icon-position-top .box-content-wrapper { justify-content: flex-start; }
.icon-vertical-align-center.icon-position-top .box-content-wrapper { justify-content: center; }
.icon-vertical-align-end.icon-position-top .box-content-wrapper { justify-content: flex-end; }

@media (max-width: 1024px) {
	.icon-position-tablet-left .elementor-icon-div,
	.icon-position-tablet-top .elementor-icon-div { order: 0; }
	.icon-position-tablet-right .elementor-icon-div { order: 2; }

	.icon-position-tablet-left .elementor-icon-div { margin: 0 var(--icon-spacing, 15px) 0 0; }
	.icon-position-tablet-right .elementor-icon-div { margin: 0 0 0 var(--icon-spacing, 15px); }
	.icon-position-tablet-top .elementor-icon-div { margin: 0 0 var(--icon-spacing, 15px) 0; }

	.icon-position-tablet-top .box-content-wrapper { flex-wrap: wrap; }
	.icon-position-tablet-left .box-content-wrapper,
	.icon-position-tablet-right .box-content-wrapper { flex-wrap: nowrap; }
	.icon-position-tablet-left .the7-box-wrapper,
	.icon-position-tablet-right .the7-box-wrapper { flex-wrap: nowrap; }

	.icon-vertical-align-tablet-start.icon-position-tablet-top .box-content-wrapper { justify-content: flex-start; }
	.icon-vertical-align-tablet-center.icon-position-tablet-top .box-content-wrapper { justify-content: center; }
	.icon-vertical-align-tablet-end.icon-position-tablet-top .box-content-wrapper { justify-content: flex-end; }
}

@media (max-width: 767px) {
	.icon-position-mobile-left .elementor-icon-div,
	.icon-position-mobile-top .elementor-icon-div { order: 0; }
	.icon-position-mobile-right .elementor-icon-div { order: 2; }

	.icon-position-mobile-left .elementor-icon-div { margin: 0 var(--icon-spacing, 15px) 0 0; }
	.icon-position-mobile-right .elementor-icon-div { margin: 0 0 0 var(--icon-spacing, 15px); }
	.icon-position-mobile-top .elementor-icon-div { margin: 0 0 var(--icon-spacing, 15px) 0; }

	.icon-position-mobile-top .box-content-wrapper { flex-wrap: wrap; }
	.icon-position-mobile-left .box-content-wrapper,
	.icon-position-mobile-right .box-content-wrapper { flex-wrap: nowrap; }
	.icon-position-mobile-left .the7-box-wrapper,
	.icon-position-mobile-right .the7-box-wrapper { flex-wrap: nowrap; }

	.icon-vertical-align-mobile-start.icon-position-mobile-top .box-content-wrapper { justify-content: flex-start; }
	.icon-vertical-align-mobile-center.icon-position-mobile-top .box-content-wrapper { justify-content: center; }
	.icon-vertical-align-mobile-end.icon-position-mobile-top .box-content-wrapper { justify-content: flex-end; }
}