/*
Theme Name:     Digisante-child
Theme URI:
Description:    Digisante child theme.
Author:         Digisanté
Author URI:     https://www.digisante.fr
Template:       digisante
Version:        0.1.0
*/

/*
WEBFONTS EN LOCAL : UTILISER CET OUTIL https://gwfh.mranftl.com/fonts
1/ Récupérer les graisses nécessaires puis télécharger l'archive avec Woff et Woff2 uniquement pour le subset Latin1
2/ Rajouter du font-display:swap pour chaque déclaration @font-face et modifier le chemin vers /fonts/
3/ Récupérer la fonte de fallback optimale ici : https://deploy-preview-15--upbeat-shirley-608546.netlify.app/perfect-ish-font-fallback/?font=Montserrat
4/ Modifier la déclaration générale avec une font-stack complète et un !important.
5/ Mettre en place le préchargement de la fonte utilisée en Regular et Bold via WP Rocket (dans sa version Woff2)
*/

html, body, main, footer {
    max-width: 100vw !important;
    min-width: 100vw !important;
    overflow-x : hidden!important;
}

body, input, textrea, .gfield_label, .gform-field-label {
    font-family: DM Sans, "DM Sans-fallback", Arial, sans-serif!important;
	font-weight: 300!important;
    color: #000a5f !important;
}

h1, h2, h3, h4  { font-family: Unbounded, "Unbounded-fallback", Verdana, sans-serif!important; }

strong, b, .gfield_label { font-weight: 600!important;}

@font-face {
    font-family: "DM Sans-fallback";
    size-adjust: 104.63%;
    src: local("Arial");
}

@font-face {
    font-family: "Unbounded-fallback";
    size-adjust: 102%;
    ascent-override: 90%;
    src: local("Verdana"); /* Verdana est plus large, plus proche d'Unbounded */
}

/* unbounded-600 - latin */
@font-face {
	font-display: swap; 
	font-family: 'Unbounded';
	font-style: normal;
	font-weight: 600;
	src: local(''),
	    url('./fonts/unbounded-v12-latin-600.woff2') format('woff2'), 
	    url('./fonts/unbounded-v12-latin-600.woff') format('woff');
}

/* dm-sans-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('./fonts/dm-sans-v17-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('./fonts/dm-sans-v17-latin-300.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
}
/* dm-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('./fonts/dm-sans-v17-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('./fonts/dm-sans-v17-latin-regular.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
}
/* dm-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('./fonts/dm-sans-v17-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('./fonts/dm-sans-v17-latin-700.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
}


/* Gradient Rose */
/* --- FONT & PICTO (Rose) --- */
.font-gradientrose, 
.font-gradientrose a, 
.font-hover-gradientrose:hover,
.picto-gradientrose { /* Attention: pour picto, fonctionne mieux sur icon-fonts */
    background: #e8d0ff; /* Fallback */
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(232, 208, 255, 1) 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    /* Pour les pictos SVG réels, le fill doit être géré via <defs> dans le SVG, ou cette classe appliquée sur un conteneur */
}

/* --- LINKS (Rose) --- */
.link-gradientrose a, 
.link-hover-gradientrose:hover {
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(232, 208, 255, 1) 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    text-decoration: underline;
    text-decoration-color: #e8d0ff; /* Le soulignement ne peut pas être un gradient facilement, on met la couleur dominante */
}

/* --- BACKGROUND (Rose) --- */
.bg-gradientrose, 
.bg-hover-gradientrose:hover {
    background: #e8d0ff !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(232, 208, 255, 1) 100%) !important;
}

/* --- BORDER (Rose) --- */
.border-gradientrose, 
.border-hover-gradientrose:hover {
    border: 1px solid transparent !important;
    border-image: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(232, 208, 255, 1) 100%);
    border-image-slice: 1 !important;
}

/* Gradient Vert */
/* --- FONT & PICTO (Vert) --- */
.font-gradientvert, 
.font-gradientvert a, 
.font-hover-gradientvert:hover,
.picto-gradientvert {
    background: #ABD8D2;
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(171, 216, 210, 1) 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}

/* --- LINKS (Vert) --- */
.link-gradientvert a, 
.link-hover-gradientvert:hover {
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(171, 216, 210, 1) 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    text-decoration: underline;
    text-decoration-color: #ABD8D2;
}

/* --- BACKGROUND (Vert) --- */
.bg-gradientvert, 
.bg-hover-gradientvert:hover {
    background: #ABD8D2 !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(171, 216, 210, 1) 100%) !important;
}

/* --- BORDER (Vert) --- */
.border-gradientvert, 
.border-hover-gradientvert:hover {
    border: 1px solid transparent !important;
    border-image: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(171, 216, 210, 1) 100%);
    border-image-slice: 1 !important;
}

/* Gradient Bleu */
/* --- FONT & PICTO (Bleu) --- */
.font-gradientbleu, 
.font-gradientbleu a, 
.font-hover-gradientbleu:hover,
.picto-gradientbleu {
    background: #5A78FF;
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(90, 120, 255, 1) 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}

/* --- LINKS (Bleu) --- */
.link-gradientbleu a, 
.link-hover-gradientbleu:hover {
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(90, 120, 255, 1) 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    text-decoration: underline;
    text-decoration-color: #5A78FF;
}

/* --- BACKGROUND (Bleu) --- */
.bg-gradientbleu, 
.bg-hover-gradientbleu:hover {
    background: #5A78FF !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(90, 120, 255, 1) 100%) !important;
}

/* --- BORDER (Bleu) --- */
.border-gradientbleu, 
.border-hover-gradientbleu:hover {
    border: 1px solid transparent !important;
    border-image: linear-gradient(145deg, rgba(255, 255, 255, 1) 50%, rgba(90, 120, 255, 1) 100%);
    border-image-slice: 1 !important;
}

/* Gradient Mesh */
/* --- FONT & PICTO (Mesh) --- */
.font-gradientmesh, 
.font-gradientmesh a, 
.font-hover-gradientmesh:hover,
.picto-gradientmesh {
    background-color: #ffffff; /* Fallback blanc */
    background-image: radial-gradient(at 42.4447% 93.2569%, rgb(255, 255, 255) 0px, transparent 50%), radial-gradient(at 10.0123% 6.98881%, rgb(171, 216, 210) 0px, transparent 50%), radial-gradient(at 40.8477% 32.1048%, rgb(171, 216, 210) 0px, transparent 50%), radial-gradient(at 6.20393% 24.8976%, rgb(90, 120, 255) 0px, transparent 50%), radial-gradient(at 92.3219% 51.9793%, rgb(90, 120, 255) 0px, transparent 50%), radial-gradient(at 90.8477% 11.3568%, rgb(232, 208, 255) 0px, transparent 50%), radial-gradient(at 81.3882% 82.3369%, rgb(232, 208, 255) 0px, transparent 50%), radial-gradient(at 17.629% 77.7505%, rgb(232, 208, 255) 0px, transparent 50%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}

/* --- LINKS (Mesh) --- */
.link-gradientmesh a, 
.link-hover-gradientmesh:hover {
    background-image: radial-gradient(at 42.4447% 93.2569%, rgb(255, 255, 255) 0px, transparent 50%), radial-gradient(at 10.0123% 6.98881%, rgb(171, 216, 210) 0px, transparent 50%), radial-gradient(at 40.8477% 32.1048%, rgb(171, 216, 210) 0px, transparent 50%), radial-gradient(at 6.20393% 24.8976%, rgb(90, 120, 255) 0px, transparent 50%), radial-gradient(at 92.3219% 51.9793%, rgb(90, 120, 255) 0px, transparent 50%), radial-gradient(at 90.8477% 11.3568%, rgb(232, 208, 255) 0px, transparent 50%), radial-gradient(at 81.3882% 82.3369%, rgb(232, 208, 255) 0px, transparent 50%), radial-gradient(at 17.629% 77.7505%, rgb(232, 208, 255) 0px, transparent 50%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    text-decoration: underline;
    text-decoration-color: #5A78FF; /* On choisit un bleu moyen pour le soulignement */
}

/* --- BACKGROUND (Mesh) --- */
.bg-gradientmesh, 
.bg-hover-gradientmesh:hover {
    background-color: #ffffff !important;
    background-image: radial-gradient(at 42.4447% 93.2569%, rgb(255, 255, 255) 0px, transparent 50%), radial-gradient(at 10.0123% 6.98881%, rgb(171, 216, 210) 0px, transparent 50%), radial-gradient(at 40.8477% 32.1048%, rgb(171, 216, 210) 0px, transparent 50%), radial-gradient(at 6.20393% 24.8976%, rgb(90, 120, 255) 0px, transparent 50%), radial-gradient(at 92.3219% 51.9793%, rgb(90, 120, 255) 0px, transparent 50%), radial-gradient(at 90.8477% 11.3568%, rgb(232, 208, 255) 0px, transparent 50%), radial-gradient(at 81.3882% 82.3369%, rgb(232, 208, 255) 0px, transparent 50%), radial-gradient(at 17.629% 77.7505%, rgb(232, 208, 255) 0px, transparent 50%) !important;
}

/* --- BORDER (Mesh) --- */
.border-gradientmesh, 
.border-hover-gradientmesh:hover {
    border: 1px solid transparent !important;
    border-image: radial-gradient(at 42.4447% 93.2569%, rgb(255, 255, 255) 0px, transparent 50%), radial-gradient(at 10.0123% 6.98881%, rgb(171, 216, 210) 0px, transparent 50%), radial-gradient(at 40.8477% 32.1048%, rgb(171, 216, 210) 0px, transparent 50%), radial-gradient(at 6.20393% 24.8976%, rgb(90, 120, 255) 0px, transparent 50%), radial-gradient(at 92.3219% 51.9793%, rgb(90, 120, 255) 0px, transparent 50%), radial-gradient(at 90.8477% 11.3568%, rgb(232, 208, 255) 0px, transparent 50%), radial-gradient(at 81.3882% 82.3369%, rgb(232, 208, 255) 0px, transparent 50%), radial-gradient(at 17.629% 77.7505%, rgb(232, 208, 255) 0px, transparent 50%);
    border-image-slice: 1 !important;
}


/* HEADER  */
#nav-content .btn-menu { 
    color: #ffffff !important;
    background-color: #5a78ff !important;
    border-color: #5a78ff;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    padding-right: 1rem !important;
    padding-left: 1rem !important;
    border-radius: 3rem !important;
    cursor: pointer!important;
    text-decoration: none!important;
}

#nav-content .btn-menu:hover {
    color: #ffffff !important;
    background-color: #000a5f !important;
    border-color: #000a5f!important;
}

#nav-content .btn-menu a, #nav-content .btn-menu:hover a {
    color: inherit !important;
    background-color: inherit !important;
    border-color: inherit !important;
    text-decoration: none!important;
}

/* BLOC */
.card {
    border-width: 2px !important;
}

/* CONTACT */
.gform_contact input[type=text], .gform_contact input[type=tel], .gform_contact input[type=email], .gform_contact textarea {
    border-radius: 1.25rem!important;
    border: 2px solid #5a78ff!important;
}

/* FORMATION A LA UNE */
.section_formationsalaune .swiper-container {
    overflow: visible!important;
    clip-path: inset(0 -9999px 0 0)!important;
    -webkit-clip-path: inset(0 -9999px 0 0)!important;
}

/* BTN  */
.btn { border-width: 2px!important; font-weight: 600!important; }

/* SINGLE FORMATION  */
.single-formation .parent {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 1.5rem;
}

@media (max-width: 767px) {
    .single-formation .parent {
        display: flex;
        flex-direction: column;
    }
}

.single-formation .div2 {
    grid-column-start: 1;
    grid-row-start: 2;
}

.single-formation .div3 {
    grid-row: span 2 / span 2;
    grid-column-start: 2;
    grid-row-start: 1;
}
        
.single-formation .gform_contact input[type=text], .single-formation .gform_contact input[type=tel], .single-formation .gform_contact input[type=email], .single-formation .gform_contact textarea {
    border-radius: 1.25rem !important;
    border: 0px solid #5a78ff !important;
}

.single-formation .gform_contact input::placeholder , .single-formation .gform_contact textarea::placeholder {
  opacity:1;
  color: #000a5f ;
}

.single-formation .div1, .single-formation .div2, .single-formation .div3 {
  position: relative;
}

.single-formation .div1::after {
  content: "";
  position: absolute;
  
  width: 80px;  
  height: 81px; 
  
  /* Ajout de l'image */
  background-image: url('https://formation.digisante.fr/wp-content/uploads/2026/06/div1.png');
  background-size: contain;
  background-repeat: no-repeat;
  
  bottom: 20px; /* Décale l'image vers le bas */
  left: -40px;   /* Décale l'image vers la gauche */
  
  z-index: 10; 
}

.single-formation .div2::after {
  content: "";
  position: absolute;
  
  width: 80px;  
  height: 112px; 
  
  /* Ajout de l'image */
  background-image: url('https://formation.digisante.fr/wp-content/uploads/2026/06/div2.png');
  background-size: contain;
  background-repeat: no-repeat;
  
  bottom: 20px; /* Décale l'image vers le bas */
  left: -40px;   /* Décale l'image vers la gauche */
  
  z-index: 10; 
}

.single-formation .div3::after {
  content: "";
  position: absolute;
  
  width: 82px;  
  height: 82px; 
  
  /* Ajout de l'image */
  background-image: url('https://formation.digisante.fr/wp-content/uploads/2026/06/div3.png');
  background-size: contain;
  background-repeat: no-repeat;
  
  bottom: 20px; /* Décale l'image vers le bas */
  right: -40px;   /* Décale l'image vers la gauche */
  
  z-index: 10; 
}

.single-formation .div1::after, 
.single-formation .div2::after, 
.single-formation .div3::after {
  /* décalage-X | décalage-Y | flou | couleur */
  filter: drop-shadow(0px 4px 6px #000A5F26);
}


/* HOME TESTI */
.page-home .section_slider .col-10 { position: relative; }

.page-home .section_slider .swiper-container::before {
  content: "";
  position: absolute;
  
  width: 93px;  
  height: 85px; 
  
  /* Ajout de l'image */
  background-image: url('https://formation.digisante.fr/wp-content/uploads/2026/06/testi1.png');
  background-size: contain;
  background-repeat: no-repeat;
  
  top: 20px; /* Décale l'image vers le bas */
  left: -40px;   /* Décale l'image vers la gauche */
  
  z-index: 10; 
}

.page-home .section_slider .swiper-container::after {
  content: "";
  position: absolute;
  
  width: 93px;  
  height: 84px; 
  
  /* Ajout de l'image */
  background-image: url('https://formation.digisante.fr/wp-content/uploads/2026/06/testi2.png');
  background-size: contain;
  background-repeat: no-repeat;
  
  bottom: 20px; /* Décale l'image vers le bas */
  right: -40px;   /* Décale l'image vers la gauche */
  
  z-index: 10; 
}

.page-home .section_slider .swiper-container::before, 
.page-home .section_slider .swiper-container::after {
  /* décalage-X | décalage-Y | flou | couleur */
  filter: drop-shadow(0px 4px 6px #000A5F26);
}

/* HOME H1 */
.page-home .section_texteimage:first-of-type { position: relative; }

.page-home .section_texteimage:first-of-type .container-fluid::after {
  content: "";
  position: absolute;
  
  width: 130px;  
  height: 147px; 
  
  /* Ajout de l'image */
  background-image: url('https://formation.digisante.fr/wp-content/uploads/2026/06/learn.png');
  background-size: contain;
  background-repeat: no-repeat;
  
  bottom: -30px; /* Décale l'image vers le bas */
  right: 100px;   /* Décale l'image vers la gauche */
  
  z-index: 10; 
}

.page-home .section_texteimage:first-of-type .container-fluid::after {
  /* décalage-X | décalage-Y | flou | couleur */
  filter: drop-shadow(0px 4px 6px #000A5F26);
}