/*
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://www.industrialempathy.com/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;
}

body, input, textrea, .gfield_label {
    font-family: DM Sans, "DM Sans-fallback", Arial, sans-serif!important;
    line-height: 1.25!important;
}

  /* Make a custom fallback font based on the local Arial */
@font-face {
    font-family: "DM Sans-fallback";
    size-adjust: 104.63%;
    src: local("Arial");
}

/* 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+ */
}

/* MENU */
.list-group-item, .list-group-item .list-group-item {font-weight: 400 !important;}
#menu-menu-principal .btn {
    border: 2px solid #56678B !important;
    background-color: #56678B !important;
    color: #ffffff !important;
}

#menu-menu-principal .btn:hover {
    background-color: #ffffff !important;
    color: #56678B !important;
}

#menu-menu-principal .btn a {
    color: inherit !important;
}

.current-menu-item:not(.btn) > a, .current_page_parent:not(.btn) > a {
    border-bottom: 2px solid #161616 !important;
    display: inline-block!important;
}

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

/* COOKIE */
.wcc-btn { border-radius: 3rem !important; }

/* BODY  */
body {
    background-image: url(https://anesthesie-clinique-jules-verne.digisante.fr/wp-content/uploads/2026/03/Top-page.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 100%;
}

/* FOOTER  */
footer .btn-section a {
    border: 2px solid #FF9C9C !important;
    background-color: #FF9C9C !important;
    color: #161615  !important;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    padding-right: 1rem !important;
    padding-left: 1rem !important;
    border-radius: 3rem !important;
    border-width: 2px !important;
    display: inline-block;
    font-weight: 600 !important;
}

footer .btn-section a:hover {
    background-color: transparent !important;
    color: #FF9C9C !important;
}


/* Gradient Rose */
/* --- FONT & PICTO  --- */
.font-gradientphileas, 
.font-gradientphileas a, 
.font-hover-gradientphileas:hover,
.picto-gradientphileas { /* Attention: pour picto, fonctionne mieux sur icon-fonts */
    background-color:hsla(0,0%,100%,1);
    background-image:
    radial-gradient(at 73% 28%, hsla(204,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 100% 100%, hsla(0,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 0% 0%, hsla(0,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 0% 100%, hsla(204,100%,83%,1) 0px, transparent 50%);
    -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  --- */
.link-gradientphileas a, 
.link-hover-gradientphileas:hover {
    background-color:hsla(0,0%,100%,1);
    background-image:
    radial-gradient(at 73% 28%, hsla(204,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 100% 100%, hsla(0,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 0% 0%, hsla(0,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 0% 100%, hsla(204,100%,83%,1) 0px, transparent 50%);
    -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  --- */
.bg-gradientphileas, 
.bg-hover-gradientphileas:hover {
    background-color:hsla(0,0%,100%,1);
    background-image:
    radial-gradient(at 73% 28%, hsla(204,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 100% 100%, hsla(0,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 0% 0%, hsla(0,100%,83%,1) 0px, transparent 50%),
    radial-gradient(at 0% 100%, hsla(204,100%,83%,1) 0px, transparent 50%);
}

/* --- BORDER  --- */
.border-gradientphileas, 
.border-hover-gradientphileas:hover {
    /* 1. On crée une bordure transparente de l'épaisseur voulue */
    border: 20px solid transparent !important;
    
    /* 2. On définit deux couches de background séparées par une virgule */
    background: 
        /* Couche 1 : Le fond intérieur (ex: blanc). Le "padding-box" le limite à l'intérieur */
        linear-gradient(white, white) padding-box, 
        
        /* Couche 2 : Tes 4 gradients de bordure. Le "border-box" les étend sous la bordure */
        radial-gradient(at 73% 28%, hsla(204,100%,83%,1) 0px, transparent 50%) border-box,
        radial-gradient(at 100% 100%, hsla(0,100%,83%,1) 0px, transparent 50%) border-box,
        radial-gradient(at 0% 0%, hsla(0,100%,83%,1) 0px, transparent 50%) border-box,
        radial-gradient(at 0% 100%, hsla(204,100%,83%,1) 0px, transparent 50%) border-box 
        !important;
}


/* HOME */
.page-home .section_texteimage:first-child .row {
    border-radius: 3rem !important;
    background-color: hsla(0, 0%, 100%, 1);
    background-image: radial-gradient(at 73% 28%, hsla(204, 100%, 83%, 1) 0px, transparent 50%), radial-gradient(at 100% 100%, hsla(0, 100%, 83%, 1) 0px, transparent 50%), radial-gradient(at 0% 0%, hsla(0, 100%, 83%, 1) 0px, transparent 50%), radial-gradient(at 0% 100%, hsla(204, 100%, 83%, 1) 0px, transparent 50%);
    padding: 1.5rem !important;
    gap: 4rem;
}

.page-home .section_texteimage:first-child h2 {
    font-weight: 400 !important;
}

/* BORDER ICON  */
/* 1. Base : On prépare le parent pour contenir l'élément absolu */
.border-icon, 
.border-md-icon, 
.border-lg-icon, 
.border-xl-icon {
  position: relative; 
}

/* On mutualise le style de l'icône pour garder un code propre et léger */
.border-icon::after,
.border-md-icon::after,
.border-lg-icon::after,
.border-xl-icon::after {
  position: absolute;
  right: -1rem;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath fill='%23161615' d='M64 320C64 461.4 178.6 576 320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320zM305 441C295.6 450.4 280.4 450.4 271.1 441C261.8 431.6 261.7 416.4 271.1 407.1L358.1 320.1L271.1 233.1C261.7 223.7 261.7 208.5 271.1 199.2C280.5 189.9 295.7 189.8 305 199.2L409 303C418.4 312.4 418.4 327.6 409 336.9L305 441z'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Toujours visible (mobile en premier) */
.border-icon::after {
  content: "";
  width: 2rem;
  height: 2rem;
}

/* Visible à partir de MD (≥ 768px) */
@media (min-width: 768px) {
  .border-md-icon::after {
    content: "";
    width: 2rem;
    height: 2rem;
  }
}

/* Visible à partir de LG (≥ 992px) */
@media (min-width: 992px) {
  .border-lg-icon::after {
    content: "";
    width: 2rem;
    height: 2rem;
  }
}

/* Visible à partir de XL (≥ 1200px) */
@media (min-width: 1200px) {
  .border-xl-icon::after {
    content: "";
    width: 2rem;
    height: 2rem;
  }
}

.min-h {
    aspect-ratio: 5 / 2;
}