/*
 Theme Name: Sauvegarde de la Marne - 2025
 Description: Un thème enfant décliné du thème parent RemSEO Flexo. Le thème parent intègre la gestion des éléments vitrines + actualités + évènements + lieux d'accueil. Le thème enfant intègre du style CSS personnalisé et personnalise certains gabarits du thème parent. L'ensemble est développé autour d'ACF + Elementor + Gutenberg
 Author: Rémi COLIN
 Template: remseowoocommerce
 Version: 1.0.0
*/

/*---------------------
    Primary HTML
----------------------*/
:root {
	--main-bg: #ffffff;
	--alt-bg: #ececec; /*Grey ~light*/
	--secondary-bg: #9a9a9a; /*Grey ~darker*/
	--dark-txt-color: #131313; /*Black*/
	--hovered-dark-txt: #868683; /*Black*/
	--light-txt-color: #f5f5f5; /*White ~greyish*/
	--hovered-light-txt: #E0E0E0; /*White ~more grey*/
	--title-color: #000000; /*Full Black*/
	--featured-color: #6CA130; /*Green (dark)*/
		--featured-color-50: rgba(108, 161, 48, 0.5);
		--featured-color-90: rgba(108, 161, 48, 0.9);
		--featured-color-darker: #557E26;
		--featured-color-lighter: #93CB52;
	--alt-featured-color: #F39200; /*Orange (light)*/
	--ctas-color: #E82D81; /*Rose (light)*/
	--ctas-darker-color: #CA1667; /*Rose darker*/
	--cf-submit-color: #6CA130; /*Green (=featured-color)*/
}

/*
Antonio-Regular - FjallaOne-Regular - LeagueGothic-Regular
*/
/*OLD font*/
@font-face {
	font-family:'LibreFranklin-Regular';
	src: url('./assets/fonts/LibreFranklin-Regular.ttf') format('TrueType');
	font-display: swap;
}

/*New fonts - Body TEST*/
@font-face {
	font-family:'Unna-Regular';
	src: url('./assets/fonts/Unna-Regular.ttf') format('TrueType');
	font-display: swap;
}

/*New fonts - Title TEST*/
@font-face {
	font-family:'LibreBodoni-Regular';
	src: url('./assets/fonts/LibreBodoni-Regular.ttf') format('TrueType');
	font-display: swap;
}
@font-face {
	font-family:'LibreBodoni-SemiBold';
	src: url('./assets/fonts/LibreBodoni-SemiBold.ttf') format('TrueType');
	font-display: swap;
}
@font-face {
	font-family:'LibreBodoni-Bold';
	src: url('./assets/fonts/LibreBodoni-Bold.ttf') format('TrueType');
	font-display: swap;
}

/*New fonts - Title TEST | CLASSIC*/
@font-face {
	font-family:'Roboto-Black';
	src: url('./assets/fonts/Roboto-Black.ttf') format('TrueType');
	font-display: swap;
}
@font-face {
	font-family:'Roboto-Bold';
	src: url('./assets/fonts/Roboto-Bold.ttf') format('TrueType');
	font-display: swap;
}
@font-face {
	font-family:'Roboto-Regular';
	src: url('./assets/fonts/Roboto-Regular.ttf') format('TrueType');
	font-display: swap;
}

body {
	font-weight: 400;
	font-size: 1.375rem;
	font-family: 'LibreFranklin-Regula', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Roboto-Regular', sans-serif;
}
h1 {font-size: 2.50rem;}
h1.intro-anim-title {font-size: 2.50rem;text-shadow: 1px 1px var(--dark-txt-color);}
h2 {font-size: 2.25rem;}
h3 {font-size: 2.00rem;}
h4 {font-size: 1.75rem;}
h5, h6 {font-size: 1.375rem; font-weight: 700;}

/*-----------------------------
  ## Leaflet
-------------------------------*/
.leaflet-popup-content .leaflet-marker-content .leaflet-submarker-content:before {
	content: '';
	position: relative;
	display: block;
	width: 100%;
	padding: 6px 0;
	border-top: 1px solid var(--dark-txt-color);
}
.leaflet-popup-content .leaflet-marker-content .leaflet-submarker-content {
	margin-top: 12px;
}

.leaflet-popup-content .leaflet-marker-content span.leaflet-marker-tel {
	display: inline-block;
	width: 100%;
}

/*-----------------------------
  ## Forminator FIX
-------------------------------*/
/*Avoid consentment checkbox text overlap*/
div.forminator-checkbox__label.forminator-consent__label > p {margin-top: 0;}

/*-----------------------------
  ## Elementor Generic
-------------------------------*/
.elementor-button {font-size: 1.375rem !important;}

.elementor-widget-video.img-disabled .elementor-custom-embed-image-overlay img {opacity: 0}
.elementor-element > .elementor-widget-shortcode > .elementor-widget-container > .elementor-shortcode > .theme-widget {
	padding: 0;
	margin: 0;
}
.elementor-testimonial-wrapper .elementor-testimonial-content {font-size: 1rem; font-style: italic;}
.elementor-counter .elementor-counter-number {
	background: var(--alt-featured-color);
	color: var(--light-txt-color);
	padding: 6px 12px;
	border-radius: 12px;
}

.elementor-element.elementor-widget-counter.custom-counter .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number {
	height: max-content;
	font-size: 2.5rem;
	font-weight: 700;
}

.elementor-element.elementor-widget-counter.custom-counter .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number-prefix,
.elementor-element.elementor-widget-counter.custom-counter .elementor-counter .elementor-counter-number-wrapper .elementor-counter-number-suffix {
	/* align-content: center; */
	font-size: 1.375rem;
	font-weight: 400;
}
/*-----------------------------
  ## Elementor custom CTA + Modal
-------------------------------*/
.elementor-element.elem-custom-cta > a {border-radius: 0px; transition: 400ms all ease-in-out;}
.elementor-element.elem-custom-cta > a:after {
	content: '';
	position: relative;
	display: block;
	bottom: -6px;
	left: 50%;
	width: 0%;
	border-bottom: 2px solid var(--light-txt-color);
	transition: 400ms all ease-in-out;
}
.elementor-element.elem-custom-cta:hover > a {border-radius: 24px;}
.elementor-element.elem-custom-cta:hover > a:after {
	width: 100%;
	left: 0%;
}

body:not(.elementor-editor-active) div.e-con.e-child > .modal {
	position: fixed;
}

/*Elementor modal management with materialize.css*/
.elementor > .elementor-element.e-con.e-parent .e-con.e-child.modal {
	display: none;
	width: 55%;
	padding: 0;
	margin: 0 auto;
	overflow-y: auto;
	border-radius: 2px;
}

/*-----------------------------
  ## ACF widgets FIX - SLIDER
-------------------------------*/
.slider-section .slider-wrapper {height: 275px;}

.slick-dots li button::before {font-size: 3rem;}

.slider-section .slider-wrapper .slider-container .slider-content .main-txt {text-align: left;}

.elementor-element.title-icons-fa .fa {padding-right: 12px; margin-bottom: auto;}
.elementor-element.title-icons-fa .fas {padding-right: 12px; margin-bottom: auto;}
.elementor-element.title-icons-fa .far {padding-right: 12px; margin-bottom: auto;}

/*-----------------------------
  ## ACF widgets FIX - TIMELINE
-------------------------------*/
.timeline-section.correctedH {height: 500px; transition: 400ms height ease-in-out;}
.timeline-section.correctedH:after {
  content: "Voir plus";
  background: var(--alt-bg);
  height: initial;
  width: initial;
  border: none;
  border-radius: 12px;
  position: absolute;
  right: calc(50% - 15px);
  bottom: -56px;
  padding: 4px 8px;
  z-index: 1;
  cursor: pointer;
}

.timeline-section.correctedH .timeline-content:nth-child(n+4) {
	opacity: 0;
	height: 0;
	transition: 400ms all ease-in-out;
}

.timeline-section.correctedH.expanded .timeline-content:nth-child(n+4) {
	opacity: 1;
	height: 162.4px;
}

.timeline-section.correctedH.expanded {height: initial;}
.timeline-section.correctedH.expanded:after {
  content: "";
  background: var(--main-bg);
  height: 30px;
  width: 30px;
  border: 5px solid;
  border-radius: 50%;
  position: absolute;
  right: calc(50% - 15px);
  bottom: -12.5px;
  z-index: 1;
}

/*-----------------------------
  ## Organigramme (Elementor)
-------------------------------*/
.remseo-org-chart .chart-title:after {
	content: '';
	position: absolute;
	left: calc(50% - 1px);
	top: 105%;
	height: 2rem;
	border-right: 2px solid;
}
.remseo-org-chart .chart-grid:not(.no-top) {
	padding-top: 1.75rem;
}
.remseo-org-chart .chart-grid:not(.no-top):before {
	content: '';
	position: absolute;
	left: 0;
	top: 14px;
	width: 100%;
	border-top: 2px solid;
}
.remseo-org-chart .chart-grid:not(.no-top) .chart-card-container:before {
	content: '';
	position: absolute;
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	background-color: var(--featured-color);
	left: calc(50% - 0.5rem);
	z-index: 2;
}
.remseo-org-chart .chart-grid .chart-card-container {
	padding-top: 1.75rem;
}

.remseo-org-chart .chart-grid .chart-card-container.downed {
	top: 48px;
}
.remseo-org-chart .chart-grid .chart-card-container.downed-big {
	top: 72px;
}

.remseo-org-chart .chart-grid .chart-card-container .up-line {
	position: absolute;
	max-width: 28px !important;
	top: -16px;
	left: calc(50% - 14.5px);
	transform: rotateZ(90deg);
}
.remseo-org-chart .chart-grid .chart-card-container.downed .up-line {
	max-width: 72px !important;
	top: -40px;
	left: calc(50% - 36px);
}

.remseo-org-chart .chart-grid.no-top .chart-card-container .up-line {
	display: none;
}

.remseo-org-chart .chart-grid:not(.no-top) .chart-card-container p {
	margin: 0;
}

.remseo-org-chart .chart-grid-box {height: 100%;}

/*---------------------
  ## Header
----------------------*/
/*Top line*/
.header-top-line {
	height: max-content;
	padding: 12px 0;
}

.header-top-line ul.call-to-actions {
	flex-basis: 25% !important;
	margin-right: 12px;
	justify-content: center;
}

.header-top-line ul.call-to-actions li.item {
	background-color: transparent;
	border: 2px solid var(--alt-featured-color);
}
.header-top-line ul.call-to-actions li.item:hover {
	background-color: var(--alt-featured-color);
}

.header-top-line ul.call-to-actions li.item a {
	color: var(--light-txt-color);
	text-decoration: none;
}
.header-top-line ul.call-to-actions li.item a > i {
	color: var(--light-txt-color);
	padding: 0 4px;
}

/*Sticky navigation*/
.site-navigation .menu-item.fixed-only {
	width: 0px;
	margin: 0px;
	opacity: 0;
	transition: 400ms all ease-in-out;
}

.site-navigation.sticky .menu-item.fixed-only {
	width: 100%;
	margin: 0 auto;
	opacity: 1;
}

/*Generic navigation*/
.main-menu li a:not(.linkedin) {
	font-size: 1.40rem;
}
.main-menu li:not(.branding) a:hover, .main-menu li a:active, .main-menu li a:focus {
	font-size: 1.45rem;
}

/*Navigation submenus*/
.site-navigation ul.main-menu ul.sub-menu {
	background: initial;
	background-color: var(--featured-color);
	padding: 0px 12px 0px 12px;
}

.site-navigation ul.main-menu > li.menu-item-has-children > .sub-menu::before {
	border-left-color: var(--alt-featured-color);
	border-bottom-color: var(--featured-color);
}

.main-menu li.current-menu-item:not(.featured-nav) a {border-color: transparent;}

/*-----------------------------
  ## Job offer CPT - Archives
-------------------------------*/
section.post-feed span.posts-counter {
	display: block;
	margin: 12px 0;
	font-size: 1rem;
	font-style: italic;
}

section.feat-posts {
	background-color: var(--featured-color);
	padding: 24px 10% 0 10%;
}
section.feat-posts > h2 {
	color: var(--light-txt-color);
	margin-bottom: 16px;
}

.panel-post.card .card-thumb {
	display: flex;
	background-color: var(--alt-bg);
}
.panel-post .card-thumb img.img-cover {
	object-fit: contain;
	width: auto;
	height: auto;
	margin: auto;
}

.panel-post.card .card-title h3 {
	font-size: 1.75rem;
}

.panel-post.card .card-body {
	height: 245px;
	border-top: 1px solid var(--alt-featured-color);
}

.panel-post.card .card-description ul {
	margin: 0;
}

/*WTF Bug fix*/
.panel-post.card .card-description p,
.panel-post.card .card-description ul,
.panel-post.card .card-description li,
.panel-post.card .card-description em,
.panel-post.card .card-description span {
	font-weight: 400 !important;
}

.panel-post .card-date {
  position: absolute;
	background: var(--featured-color);
  top: 20px;
  right: 20px;
  width: max-content;
  height: max-content;
  color: var(--light-txt-color);
  text-align: center;
	border-radius: 12px;
  line-height: 13px;
	padding: 6px 8px;
}
.panel-post .card-date .date-prefix {

}
.panel-post .card-date .published-date {
	font-weight: 700;
}
.panel-post .card-date-day {
  display: block;
  font-size: 14px;
  margin-top: 10px;
}
.panel-post .card-date-month {
  display: block;
	background: var(--featured-color);
  font-size: 10px;
  text-transform: uppercase;
}

.panel-post .card-title .card-interaction-helper {
  padding: 0 0 10px 0;
  margin: 0;
  font-size: 0.9rem;
  color: #bababa;
	opacity: 1;
	transition: 400ms all ease-in-out;
}
.panel-post.card:hover .card-title .card-interaction-helper {
  opacity: 0;
}

.panel-post .card-category,
.panel-post .card-tag {
	top: -26px !important;
}

.panel-post .card-category {
	background-color: var(--alt-featured-color) !important;
}

.panel-post .card-tag {
	left: initial !important;
	right: 0;
	background-color: var(--featured-color) !important;
}
/*-----------------------------
  ## Job offer CPT - Single
-------------------------------*/
.cpt-post-single #cpt-post-details .additional-info.col-12 div.main-desc {
	width: 80%;
	max-width: 1140px;
	margin: 0 auto;
}

.cpt-post-single #cpt-post-details .additional-info.col-12 div.main-desc p {
	text-align: justify;
}

.cpt-post-single #cpt-post-details .additional-info.col-12 div.main-desc ul {
	list-style-type: disc;
	padding-left: 16px;
}
.cpt-post-single #cpt-post-details .additional-info.col-12 div.main-desc ul li {
	list-style-type: disc;
	line-height: 32px;
}

.material-cta.job-offer-cta {
	padding: 12px 32px;
	margin: 12px auto;
}

@media all and (max-width: 768px) {
	.cpt-post-single #cpt-post-details .additional-info.col-12 div.main-desc {
		width: 90%;
		max-width: max-content;
	}
}

/*---------------------
  ## ACF widgets
----------------------*/
/*Bloc nav widget*/
.acf-blocs-nav {
  display: flex;
  flex-flow: row wrap;
	justify-content: center;
  position: relative;
  width: 1024px;
  margin: 0 auto !important;
  padding: 0;
  height: auto;
  list-style: none;
}

.acf-blocs-nav.vertical {flex-direction: column;}

.acf-blocs-nav li {
  position: relative;
  flex-basis: 50%;
	max-width: 240px;
  top: 0;
  text-align: center;
  font-weight: 700;
  color: var(--light-txt-color);
  margin : 3% 0;
  filter: contrast(100%);
  transition: 400ms all ease-in-out;
}
.acf-blocs-nav li.col33 {flex-basis: 33%;}
.acf-blocs-nav li.col25 {flex-basis: 25%;}
.acf-blocs-nav li.col20 {flex-basis: 20%;}

.acf-blocs-nav.vertical a {
	flex-basis: initial;
	width: 175px;
}

.acf-blocs-nav > li:before {
  content: "";
  display: block;
  padding-top: 100%;
}

.acf-blocs-nav.with-gutter li {
  flex-basis: calc(50% - 2%);
  margin: 3% 1%;
}
.acf-blocs-nav.with-gutter li.col33 {flex-basis: calc(33% - 2%);}
.acf-blocs-nav.with-gutter li.col25 {flex-basis: calc(25% - 2%);}
.acf-blocs-nav.with-gutter li.col20 {flex-basis: calc(20% - 2%);}

.acf-blocs-nav li a {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  line-height: 100%;
  color: var(--dark-txt-color);
}

.acf-blocs-nav li:hover {
  filter: contrast(100%);
}

.acf-blocs-nav li:hover a {
  color: var(--light-txt-color);
}

.acf-blocs-nav.colored-on-hover a {
  background: var(--alt-bg);
  color: var(--dark-txt-color);
}

.acf-blocs-nav.colored-on-hover li a i {
  color: inherit;
  transition: 400ms color ease-in-out;
}

.acf-blocs-nav.colored-on-hover li:hover a i {
  color: var(--light-txt-color) !important;
}

.acf-blocs-nav li a i {
  font-size: 2.25rem;
  padding-bottom: 24px;
}

.acf-blocs-nav li:hover {
  color: #ececec !important;
  top: -5%;
}
.acf-blocs-nav.vertical li:hover {
	top: -2.5%;
}

@media all and (max-width: 980px) {
  /* .acf-blocs-nav a {flex-basis: 33%;} */
  .acf-blocs-nav li.col33 {flex-basis: 50%;}
  .acf-blocs-nav li.col25 {flex-basis: 33%;}
  .acf-blocs-nav li.col20 {flex-basis: 25%;}

  /* .acf-blocs-nav.with-gutter a {flex-basis: calc(33% - 2%);} */
  .acf-blocs-nav.with-gutter li.col33 {flex-basis: calc(50% - 2%);}
  .acf-blocs-nav.with-gutter li.col25 {flex-basis: calc(33% - 2%);}
  .acf-blocs-nav.with-gutter li.col20 {flex-basis: calc(25% - 2%);}
}

@media all and (max-width: 768px) {
  /* .acf-blocs-nav a {flex-basis: 33%;} */
  .acf-blocs-nav li.col33 {flex-basis: 50%;}
  .acf-blocs-nav li.col25 {flex-basis: 33%;}
  .acf-blocs-nav li.col20 {flex-basis: 25%;}

  .acf-blocs-nav.with-gutter li {flex-basis: calc(33% - 2%);}
  .acf-blocs-nav.with-gutter li.col33 {flex-basis: calc(50% - 2%);}
  .acf-blocs-nav.with-gutter li.col25 {flex-basis: calc(33% - 2%);}
  .acf-blocs-nav.with-gutter li.col20 {flex-basis: calc(33% - 2%);}
}

@media all and (max-width: 576px) {
  .acf-blocs-nav.vertical {
	align-content: center;
  }
  .acf-blocs-nav li,
  .acf-blocs-nav li.col33,
  .acf-blocs-nav li.col25,
  .acf-blocs-nav li.col20  {flex-basis: 50%;}

  .acf-blocs-nav.with-gutter li,
  .acf-blocs-nav.with-gutter li.col33,
  .acf-blocs-nav.with-gutter li.col25,
  .acf-blocs-nav.with-gutter li.col20  {flex-basis: calc(50% - 2%);}
}

/*---------------------
  ## Footer
----------------------*/
.main-footer {background-color: var(--featured-color)}
/* .main-footer div > img {height: 110px; background-color: var(--main-bg); padding: 6px; border-radius: 12px;} */

.main-footer div > img {
	background-color: var(--alt-bg);
	border-radius: 12px;
}

/*---------------------
  PLACEHOLDER
----------------------*/
