/*
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://google-webfonts-helper.herokuapp.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)
*/

body, input, textrea, .gfield_label, .ginput_complex label, .accordion-item {
    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; }

@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;
}


.btnmenu a, .btnmenu.font-noir a, .btnmenu.font-hover-noir:hover > a {
    color: #ffffff!important;
    background-color: #000a5f!important;
    padding-top: 0.5rem!important;
    padding-bottom: 0.5rem!important;
    padding-right: 1rem!important;
    padding-left: 1rem!important;
    border-radius: 3rem !important;
}

footer p { margin:0!important; padding:0!important }

/*FIX TAB*/
#faqTabs {
    border: none!important;
    justify-content: center!important;
}

.nav-link, .nav-link.active, .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
    color: #000a5f!important;
    border: none!important;
}

.nav-link {padding:0px!important}
.nav-item {padding: 8px 16px!important}

.nav-link.active { font-weight:700!important; }

/*FIX CONTACT FORM*/
.name_first {padding: 0px!important}
.gfield input, .gfield select, .gfield textarea, .gform_drop_area {border: none!important;padding-block:1rem!important; padding-inline: 2rem!important;color: #000a5f!important}
.gfield input::placeholder, .gfield select::placeholder, .gfield textarea::placeholder {color: #000a5f!important}
.gfield fieldset { height:fit-content; }
.gfield.shadow, .gfield input:not( [type="checkbox"]), .gfield select{border-radius: 3rem!important; overflow: hidden!important;}
.gfield.shadow.gfield--type-textarea, .gfield textarea {border-radius: 2rem!important; overflow: hidden!important;}
.gform_fileupload_rules {display: none!important}
.gform_drop_area {margin: 0px!important; background: #ffffff!important;padding-block:0px!important; display: flex!important; justify-content: space-between!important;}
.gform_drop_instructions {visibility: hidden;position: relative;margin: 0px!important}
.gform_drop_instructions:after {content:'Pièce(s) jointe(s)'; visibility: visible; display: block;position: absolute;top: 5px;left: 0;}
.gfield--type-fileupload { display:flex!important; align-items:center!important; }
.ginput_container_fileupload {width: 100%!important}
.gform_wrapper.gravity-theme .gform_footer {display: flex;justify-content: center!important;}
.gform_button_select_files {
    color: #5a78ff!important;
    background-color: #ffffff!important;
    border: 2px solid #5a78ff!important;
    padding-right: 1rem!important;
    padding-left: 1rem!important;
    border-radius: 3rem !important;
}

/*FIX ENCIRCLE*/
.encircleblanc{
  position:relative;
  z-index: 10;
  width: fit-content;
    display: inline-block;
    height: fit-content;
}

.encircleblanc:before{
    content: "";
    z-index: -10;
    border-width: 4px;
    border-style: solid;
    border-color: #ffffff;
    position: absolute;
    border-right-color: transparent;
    width: 100%;
    height: 1.5em;
    transform: rotate(178deg);
    border-radius: 50%;
}

.encircleblanc:after{
    content: "";
    z-index: -10;
    left: 0em;
    top: -0.5rem;
    border-width: 4px;
    border-style: solid;
    border-color: #ffffff;
    border-left-color: transparent;
    border-top-color: transparent;
    position: absolute;
    width: 100%;
    height: 1.5em;
    transform: rotate(-190deg);
    border-radius: 50%;
}

.encirclebleu{
  position:relative;
  z-index: 10;
  width: fit-content;
    display: inline-block;
    height: fit-content;
}

.encirclebleu:before{
    content: "";
    z-index: -10;
    border-width: 4px;
    border-style: solid;
    border-color: #5a78ff ;
    position: absolute;
    border-right-color: transparent;
    width: 100%;
    height: 1.5em;
    transform: rotate(178deg);
    border-radius: 50%;
}

.encirclebleu:after{
    content: "";
    z-index: -10;
    left: 0em;
    top: -0.5rem;
    border-width: 4px;
    border-style: solid;
    border-color: #5a78ff;
    border-left-color: transparent;
    border-top-color: transparent;
    position: absolute;
    width: 100%;
    height: 1.5em;
    transform: rotate(-190deg);
    border-radius: 50%;
}

.nav-link.active{
  position:relative;
  z-index: 10;
}

.nav-link.active:before{
    content: "";
    z-index: -10;
    border-width: 4px;
    border-style: solid;
    border-color: #5a78ff;
    position: absolute;
    border-right-color: transparent;
    width: 100%;
    height: 1.5em;
    transform: rotate(178deg);
    border-radius: 50%;
}

.nav-link.active:after{
    content: "";
    z-index: -10;
    left: 0em;
    top: -0.5rem;
    border-width: 4px;
    border-style: solid;
    border-color: #5a78ff;
    border-left-color: transparent;
    border-top-color: transparent;
    position: absolute;
    width: 100%;
    height: 1.5em;
    transform: rotate(-190deg);
    border-radius: 50%;
}

.gfield_validation_message { border:0px!important }

.paste {
    width: 100px;
    bottom: -22px;
    right: -10px;
}