/*
Theme Name: Prologistik
Theme URI: web-ia.com
Author: Boris Billy
Author URI: web-ia.com
Description: Theme WordPress pour Prologistik.
Tags: blog, portfolio, entertainment, grid-layout, one-column, two-columns, three-columns, four-columns, block-patterns, block-styles, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, full-width-template, rtl-language-support, style-variations, template-editing, theme-options, translation-ready, wide-blocks
Tested up to: 6.6
Requires PHP: 7.3
Version: 1.0.0
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gutzilla

Gutzilla WordPress Theme, (C) 2024 Boris Billy.
Gutzilla is distributed under the terms of the GNU GPL.
*/

/* CSS Reset
---------------------------------------------------------------------------- */

:root {
	--plyr-color-main: var(--wp--preset--color--primary);
}

*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	scroll-behavior: smooth;
	box-sizing: border-box;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

b,
strong {
	font-weight: var(--wp--custom--font-weight--semi-bold);
}

ol,
ul {
	padding: 0;
}

ol:where(:not([class*="wp-block"])),
ol:where(.wp-block-list),
ul:where(:not([class*="wp-block"])),
ul:where(.wp-block-list) {
	padding-inline-start: var(--wp--preset--spacing--medium);
}

body#tinymce.wp-editor ol:where(:not([class*="wp-block"])),
body#tinymce.wp-editor ol:where(.wp-block-list),
body#tinymce.wp-editor ul:where(:not([class*="wp-block"])),
body#tinymce.wp-editor ul:where(.wp-block-list) {
	padding-left: 1em !important;
	padding-inline-start: 1.5em !important;
}

div[class*="wp-block-"] figcaption {
	color: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--x-small);
	margin-bottom: 0;
	margin-top: 20px;
	text-align: center;
}

img,
figure {
	max-width: 100%;
	height: auto;
}


:root :where(.is-layout-constrained)>*,
:root :where(.editor-styles-wrapper) :where(.is-layout-constrained)>* {
	margin-block-start: 0;
}

.acf-block-component {
	padding: 0 !important;
}

/* Standardize form styling
--------------------------------------------- */

input,
button,
textarea,
select {
	font: inherit;
}

input[type="button"],
input[type="email"],
input[type="search"],
input[type="submit"],
input[type="text"],
textarea {
	-webkit-appearance: none;
}

input:not([type="submit"]),
select,
textarea,
.wp-block-post-comments-form input:not([type="submit"]):not([type="checkbox"]),
.wp-block-post-comments-form textarea {
	color: var(--wp--preset--color--main);
	border-radius: var(--wp--custom--radius--sm);
	border: solid 1px var(--wp--preset--color--main-accent);
	padding: .5em 1em;
	font-size: var(--wp--preset--font-size--small);
}

input:focus-visible,
textarea:focus-visible {
	outline-color: var(--wp--preset--color--primary);
}

input[type="checkbox"],
input[type="image"],
input[type="radio"] {
	width: auto;
}

label {
	width: 100%;
	display: block;
}

::placeholder {
	color: var(--wp--preset--color--main);
	font-size: var(--wp--preset--font-size--small);
	opacity: 0.75;
}

/* Helper styles that can't be done via theme.json
---------------------------------------------------------------------------- */

a.more-link {
	display: block;
}

/* Inline code */
*:not(.wp-block-code)>code {
	background-color: var(--wp--preset--color--tertiary);
	font-weight: var(--wp--custom--font-weight--medium);
	;
	padding: 3px 5px;
	position: relative;
	border-radius: 3px;
}

/* Adjust terms at bottom of posts */
.single .wp-block-group .wp-block-post-terms,
.blog .wp-block-group .wp-block-post-terms {
	margin-bottom: -8px !important;
}

/* Remove margin on term description on archive pages */
.wp-block-term-description p:last-child {
	margin-bottom: 0;
}

/* Remove last separator on post list */
.remove-border-and-padding .wp-block-post-template li:last-child .wp-block-separator {
	display: none;
}

/* Hide post meta div if no tags assigned */
.single .wp-block-group:has(> .post-meta:empty) {
	display: none;
}

.wp-block-group:empty:has(+ .comment-respond) {
	display: none;
}

.row-logos>figure {
	flex-shrink: 1 !important;
}

@media (max-width: 781px) {
	.gutzilla-hide-on-mobile {
		display: none;
	}
}


/* 1 - Header */
body {
	&.has-top-bar {
		position: relative;

		#header_bar,
		main.site-content {
			transition: var(--wp--custom--transition--base);
		}
	}
}

.js-close {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 10;
	margin: 0 auto;
	width: 100px;
	border: none;
	background-color: rgba(255, 255, 255, 0.25);
	border-radius: 0 0 6px 6px;
	color: #fff;
	transition: var(--wp--custom--transition--base);
	font-size: var(--wp--preset--font-size--small);

	&:hover {
		cursor: pointer;
		background-color: rgba(255, 255, 255, 0.35);
	}

	&.active {
		opacity: .4;

		&:hover {
			opacity: 1;
		}
	}
}

.site-header {
	background-color: var(--wp--preset--color--base);
	position: sticky;
	top: 0;
	z-index: 100;

	#top_bar {
		.is-style-level3 {

			a {
				font-size: var(--wp--preset--font-size--x-small);
				color: inherit;
			}
		}
	}

	.header__navigation {
		.wp-block-navigation__container {
			margin: 0 auto;
			justify-content: space-around;

			.current-menu-item {
				>a {
					color: var(--wp--preset--color--primary);
					text-decoration: none;
				}
			}
		}
	}

	/* Menu */
	.menu-nav{
		min-width: 100vw;
		background: var(--wp--preset--color--border-light);
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		margin: 0;

		nav {
			width: 59%;


		}
	}
}

@media (width <=781px) {
	.site-header {
		.header__navigation {
			justify-content: flex-end;

			.wp-block-buttons {
				justify-content: flex-start;
			}
		}

		.header-buttons {
			display: none;
		}
	}
}

.wp-pagenavi {
	text-align: center;
	margin: 0 0 1em 0;

	.pages {
		display: none;
	}

	span,
	a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: .4em .8em;
		margin: .5em;
		font-size: var(--wp--preset--font-size--x-small);
		text-decoration: none;
		border: solid 1px var(--wp--preset--color--main-accent);
		color: var(--wp--preset--color--secondary);
		background: transparent;
		transition: var(--wp--custom--transition--base);
		border-radius: var(--wp--custom--radius--circle);
		width: 40px;
		height: 40px;
	}

	.current {
		background: var(--wp--preset--color--main);
		border-color: var(--wp--preset--color--main);
		color: var(--wp--preset--color--white);
	}

	a:hover {
		background: var(--wp--preset--color--main-accent);
		border-color: var(--wp--preset--color--main-accent);
		color: #fff !important;
		text-decoration: none;
	}
}

/* Card defaut */

.card-default {
	border: none;
	overflow: hidden;
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	background-color: #fff;

	.card-header {
		text-align: center;
		padding: 0;

		img {
			max-height: 250px;
			width: 100%;
			object-fit: cover;
			aspect-ratio: 4/3;
			margin: 0 auto;
		}
	}

	.card-body {
		padding: 0;
		flex: 1 1 auto;
	}

	.card-footer {
		padding: 0;
	}
}

/* Card actu */

.card-actu {
	border: none;
	border-radius: var(--wp--custom--radius--base);
	overflow: hidden;
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	box-shadow: 4px 8px 30px 0 rgba(9, 116, 230, 0.10);
	background: var(--wp--preset--color--base);

	.card-header {
		text-align: center;
		padding: 0;

		img {
			height: 250px;
			width: 100%;
			margin: 0 auto;
			text-align: center;
			object-fit: cover;
		}
	}

	.card-body {
		padding: 1em 2em;
		flex: 1 1 auto;

		.card-actu__date {
			display: flex;
			align-items: start;
			gap: var(--wp--custom--gap--xs);
			font-size: 0.85em;
			color: var(--wp--preset--color--main);
			font-weight: var(--wp--custom--font-weight--light);
			margin-bottom: 0.75em;

			svg {
				flex-shrink: 0;
			}
		}

		.card-actu__titre {
			font-size: 1.15em;
			margin-bottom: 0.5em;
			color: var(--wp--preset--color--primary-darken);
		}

		.card-actu__texte {
			-webkit-line-clamp: 3;
			-webkit-box-orient: vertical;
			display: -webkit-box;
			overflow: hidden;
			font-size: 0.9em;
			color: var(--wp--preset--color--main);
		}
	}

	.card-footer {
		background: transparent;
		border-top: none;
		padding: 1em 2em 3em;

		.btn-link {
			color: var(--wp--preset--color--primary);
			font-weight: var(--wp--custom--font-weight--semi-bold);
			text-decoration: none;

			span {
				font-size: 1rem;
			}
		}
	}
}

/* card icon */
.card-icon {
	display: flex;
	flex-direction: column;
	background-color: transparent;
	padding: 0;
	min-width: inherit;
	border: none;

	@media(width < 781px) {

		.card-header {
			flex: 100px 0 0;
			margin-right: 0;
		}
	}

	.card-header {
		.card-header__icon {
			width: 140px;
			height: 140px;
			margin: 0 auto;
			padding: 0;
			display: flex;
			align-items: center;
			justify-content: center;

			img {
				width: auto;
				height: auto;
			}
		}
	}

	.card-body {
		text-align: center;
		padding: 0;
		font-size: 1.125rem;
		margin-top: 10px;
		/* @media(max-width: 781px) {
			text-align: left;
		} */

		.card-icon__titre {
			font-weight: var(--wp--custom--font-weight--bold);
			font-size: 1.125rem;
			color: var(--wp--preset--color--primary);
			margin: 0 0 5px;
		}

		.card-icon__texte {
			margin: 0;
			line-height: var(--wp--custom--line-height--snug);

			@media(width < 767px) {
				font-size: 1.125rem;
			}
		}
	}

}

/* card maillage */
.card-maillage {
	position: relative;
	aspect-ratio: 1/1;
	width: 280px;
	height: 280px;
	background-color: var(--wp--preset--color--secondary);
	overflow: hidden;
	border: none;
	padding: 0;

	@media(width < 991px) {
		width: 100%;
		height: auto;
	}

	.card-body {
		position: absolute;
		z-index: 1;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: rgba(255, 172, 102, 0.6);

		a {
			color: var(--wp--preset--color--base);
			align-items: center;
			font-family: var(--wp--preset--font-family--secondary);
			font-size: 1.3125rem;
			padding: 0;

			span {
				align-items: center;

				&:before {
					display: none;
				}
			}
		}
	}

	.card-bg {
		position: absolute;
		z-index: 0;
		height: 100%;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;

		img {
			height: 100%;
			object-fit: cover;
			transition: var(--wp--custom--transition--base);

			@media(width < 991px) {
				aspect-ratio: 1/1;
			}
		}
	}

	&:hover {
		.card-bg {
			img {
				scale: 1.05;
			}
		}

	}
}

/* card big card */
.card-secondaire {
	border: none;
	padding: 0;
	min-width: none;
	max-width: none;
	min-height: 483px;
	height: 100%;
	background-color: var(--wp--preset--color--secondary);
	background-position: center;
	background-repeat: no-repeat;
	transition: var(--wp--custom--transition--base);
	position: relative;
	overflow: hidden;

	@media(width < 767px) {
		min-height: 242px;
		background-size: cover;
	}

	.card-secondaire__wrap {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-end;
		background: linear-gradient(360deg, #1E2034 0%, rgba(30, 32, 52, 0) 54.66%);
		padding: 50px 50px 46px;
		height: 100%;
		position: relative;
		z-index: 1;

		@media(width < 767px) {
			padding: 20px 20px 30px;
			background: linear-gradient(360deg, #1E2034 0%, rgba(30, 32, 52, 0) 68%);
		}

		.card-body {
			color: #fff;
			text-align: center;
			flex: auto 0 0;
		}
	}

	.card-secondaire__titre {
		color: #fff;
		font-size: 1.6875rem;
		margin: 0;
		font-weight: var(--wp--custom--font-weight--light);

		a {
			color: #fff;
			text-decoration: none;

			&:hover {
				text-decoration: none;
			}
		}
	}

	.card-secondaire__texte {
		margin: 0;
		line-height: var(--wp--custom--line-height--snug);

		@media(width < 767px) {
			display: none;
		}
	}

	.card-footer {
		padding: 14px 0 0;
		z-index: 1;
	}

	.card-secondaire__image {
		position: absolute;
		top: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 100%;

		img {
			height: 100%;
			width: 100%;
			object-fit: cover;
			transition: var(--wp--custom--transition--base);

		}
	}

	&:hover {
		.card-secondaire__image {
			img {
				transform: scale(1.05);
			}
		}
	}
}

/* card trombinoscope */
.card-trombinoscope {
	border-radius: var(--wp--custom--radius--sm);
	overflow: hidden;
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	border: 2px solid var(--wp--preset--color--primary);

	.card-header {
		text-align: center;
		padding: 1.25rem 1.25rem 0;

		img {
			height: 300px;
			aspect-ratio: 1/1;
			width: auto;
			margin: 0 auto;
			text-align: center;
			border-radius: 3px;
			object-fit: cover;
		}
	}

	.card-body {
		display: flex;
		flex-direction: row;
		padding: 1.5625rem 1.25rem 1.25rem;

		.card-trombinoscope__infos {
			flex: 1 1 auto;
		}

		.card-trombinoscope__links {
			flex: 0 0 auto;
			display: flex;
			align-items: center;

			a {
				font-size: 1.5rem;
				transition: var(--wp--custom--transition--base);

				&:hover {
					color: var(--wp--preset--color--primary);
				}
			}
		}

		.card-trombinoscope__nom {
			font-size: 1.25rem;
			margin: 0;
		}

		.card-trombinoscope__poste {
			font-weight: var(--wp--custom--font-weight--light);
			font-size: 1.125rem;
		}
	}

	.card-footer {
		display: flex;
		flex: 1 1 auto;
		padding: 0;
	}
}

/* Menu liste */
.menu__list {
	list-style: none;
	padding: 0;
	margin: 0;

	li {
		margin: 5px 0;

		a {
			text-decoration: none;

			&:hover {
				text-decoration: underline;
				color: var(--wp--preset--color--base);
			}
		}
	}
}

/* Utilities */

.btn-link {
	font-weight: var(--wp--custom--font-weight--bold);
	text-decoration: underline;
}

.wp-block-button__link {
	width: auto;
}

.stretched-link {
	&:after {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		top: 0;
	}

}

.text-center {
	text-align: center;
}

.buttons {
	display: flex;
	gap: 30px;
}

.more-content {
	position: relative;

	p:empty {
		display: none;
	}

	/* &:not(.open) {
		&::after {
			content: "";
			position: absolute;
			bottom: 0;
			left: 0;
			right: 0;
			height: 100px;
			background: rgb(255, 255, 255);
			background: linear-gradient(0deg,
					rgba(255, 255, 255, 1) 0%,
					rgba(255, 255, 255, 0) 100%);
		}
	} */
}

.link.open {
	display: none;
}

.read-more-content {
	overflow: hidden;
	height: 0;
	transition: height 200ms ease-in-out;



	&.open {
		height: 100%;
		transition: height 200ms ease-in-out;
	}
}

/**************/

.modal {
	.close {
		position: absolute;
		top: 15px;
		right: 15px;
	}

	.modal-header {
		padding: 40px 50px 0 50px;
		border: none;

		@media(width < 765px) {
			padding: 15px;
		}

		.modal-title {
			position: relative;
			font-weight: var(--wp--custom--font-weight--extra-bold);
			font-size: var(--wp--preset--font-size--large);
			font-family: var(--wp--preset--font-family--barlow);
			color: var(--wp--preset--color--primary);
		}
	}

	.modal-body {
		padding: 15px 50px 40px 50px;

		@media(width < 765px) {
			padding: 15px;
		}
	}
}

/* Typography Responsive */

@media (width < 767px) {
	h2 {
		font-weight: var(--wp--custom--font-weight--semi-bold);
	}
}

/* Block Elements */
p.element__surtitre {
	color: var(--wp--preset--color--primary);
	background-color: var(--wp--preset--color--primary-accent);
	font-family: var(--wp--preset--font-family--barlow);
	font-weight: var(--wp--custom--font-weight--regular);
	font-size: var(--wp--preset--font-size--medium);
	width: max-content;
	padding: 2px 8px;
	border-radius: var(--wp--custom--radius--base);
}

p.element__surtitre:not(.m-boucle__surtitre, .m-image-texte__surtitre, .m-parutions__surtitre, .m-derniers-sujets__surtitre, .m-formulaire__surtitre, .m-articles-lies__surtitre) {
	margin: 0 auto 1em;
}

p.element__surtitre.m-boucle__surtitre,
p.element__surtitre.m-image-texte__surtitre,
p.element__surtitre.m-parutions__surtitre,
p.element__surtitre.m-derniers-sujets__surtitre,
p.element__surtitre.m-formulaire__surtitre {
	margin: 0;
}

.has-primary-background-color .element__surtitre,
.has-main-background-color .element__surtitre,
.has-tertiary-background-color .element__surtitre,
.has-secondary-accent-background-color .element__surtitre {
	color: var(--wp--preset--color--main);
}

.has-secondary-accent-background-color .element__surtitre {
	background: var(--wp--preset--color--base);
}

p.element__surtitre+h2 {
	margin-top: 0.25em;
}

.has-secondary-accent-background-color .m-cta__titre--accent {
	color: var(--wp--preset--color--secondary);
}


/* Footer wave separator */
footer.wp-block-group {
	position: relative;
}

footer.site-footer.wp-block-template-part {
	padding-top: 167px !important;

	@media (width < 771px) {
		padding-top: 98px !important;
    }
}

/* Désactive l'ancien ::before */
footer .wp-block-group:first-child::before {
	display: none;
}

/* Supprime le ::after */
footer .wp-block-group:first-child::after {
	display: none;
}

footer.site-footer a{
	text-decoration: none;
}

footer.site-footer a:hover{
	color: var(--wp--preset--color--main-accent);
}

/* Wave dynamique */
.footer-wave-dynamic {
	position: absolute;
	top: -167px;
	left: 0;
	width: 100vw;
	height: 200px;
	pointer-events: none;
	z-index: 1;

	@media (width < 771px) {
		top: -98px;
		height: 100px;
    }
}

.footer-wave-dynamic svg {
	width: 100vw;
	height: 100%;
	display: block;
}

/* Bouton de contact flottant */
.floating-contact {
	position: fixed;
	bottom: 65px;
	right: 1.5%;
	z-index: 999;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.floating-contact__item {
	display: flex;
	align-items: center;
	gap: 12px;
	background-color: var(--wp--preset--color--primary-accent);
	color: var(--wp--preset--color--primary);
	padding: 8px 16px;
	border-radius: var(--wp--custom--radius--sm);
	border: 1px solid var(--wp--preset--color--primary);
	text-decoration: none;
	font-family: var(--wp--preset--font-family--barlow);
	font-size: 0.95rem;
	font-weight: var(--wp--custom--font-weight--semi-bold);
	box-shadow: 0 2px 6px rgba(10, 102, 194, 0.35);
	transition: var(--wp--custom--transition--base);
}

.floating-contact__item:hover {
	background-color: var(--wp--preset--color--base);
}

.floating-contact__item svg {
	flex-shrink: 0;
}

@media (width <=991px) {
	.floating-contact {
		bottom: 100px;
		right: 4%;
		gap: 8px;
	}

	.floating-contact__item {
		padding: 10px;
		border-radius: var(--wp--custom--radius--circle);
	}

	.floating-contact__item span {
		display: none;
	}

	.floating-contact__item--no-mobile {
		display: none;
	}
}
/* Background wave on the blocks */
.has-wave-bottom {
	position: relative;
	overflow: visible;
}

.m-cta.has-wave-bottom {
	overflow: hidden;
}

.bloc-wave-bottom {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	line-height: 0;
	pointer-events: none;
	z-index: 1;
}

.bloc-wave-bottom svg {
	width: 100%;
	height: auto;
	display: block;
}

.has-wave-bottom .m-image-texte__wrap,
.has-wave-bottom .m-cta__wrapper,
.has-wave-bottom .m-verbatim__wrap,
.has-wave-bottom .m-chiffres__wrap,
.has-wave-bottom .m-cards__grid,
.has-wave-bottom .m-video-texte__wrap,
.has-wave-bottom .m-cta-contact__grid,
.has-wave-bottom .m-logos__wrap,
.has-wave-bottom .m-boucle__loop,
.has-wave-bottom .m-image-texte__header,
.has-wave-bottom .m-image-texte__liens,
.has-wave-bottom .m-verbatim__header,
.has-wave-bottom .m-verbatim__boutons,
.has-wave-bottom .m-cards__boutons {
	position: relative;
	z-index: 2;
}

/* ===== Lien recherche header (FacetWP) ===== */
.m-header-search-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: var(--wp--custom--radius--circle);
	color: var(--wp--preset--color--primary-darken);
	transition: background-color 0.2s ease, color 0.2s ease;
}

.m-header-search-link:hover,
.m-header-search-link:focus-visible {
	color: var(--wp--preset--color--primary);
}

.m-header-search-link.icone-search::before {
	content: "";
	width: 1.25rem;
	height: 1.25rem;
	background-color: currentColor;
	-webkit-mask: center / contain no-repeat url('assets/icons/icon-search.svg');
	mask: center / contain no-repeat url('assets/icons/icon-search.svg');
}


/* ===== Grille des résultats de recherche (FacetWP + cards card-actu) ===== */
body.page-id-2454{
	background-color: var(--wp--preset--color--border-light);
}

.m-recherche__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wp--custom--gap--base);
}

@media (width <=991px) {
	.m-recherche__grid {
		grid-template-columns: 1fr;
	}
}

.m-recherche__vide {
	padding: 2rem 0;
	color: var(--wp--preset--color--main);
}

.facetwp-facet.facetwp-type-search{
	margin-top: 3rem;
	margin-bottom: 1rem;
}

.facetwp-facet-keywords,
.facetwp-template,
.facetwp-facet-type_contenu {
	max-width: 1140px;
}

.facetwp-facet-type_contenu.facetwp-type-checkboxes {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}

.facetwp-checkbox {
	font-size: 0.9rem;
}

.facetwp-input-wrap .facetwp-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-right: 2.5%;
}

.facetwp-input-wrap .facetwp-icon::before {
	background: unset;
	background-color: currentColor;
	width: 1.25rem;
	height: 1.25rem;
	-webkit-mask: center / contain no-repeat url('assets/icons/icon-search.svg');
	mask: center / contain no-repeat url('assets/icons/icon-search.svg');
}

/* Reset block */

/* Permettre d'avoir les images en contain sur le bloc cards (ex: certification) */
.img-contain img{
	object-fit: contain !important;
}