/*
Theme Name:   Divi Enfant — Le Cabinet du Couple
Theme URI:    https://cabinetducouple.fr
Description:  Thème enfant Divi pour cabinetducouple.fr. Toute personnalisation durable vit ici — ne jamais modifier le thème Divi parent.
Author:       Florent Ferres
Template:     Divi
Version:      1.0.0
*/

/* ==========================================================================
   1. VARIABLES DE MARQUE
   Source unique des couleurs. Pour ajuster une teinte plus tard,
   modifier ici et uniquement ici.
   ========================================================================== */
:root {
  --cdc-fond: #F4F4F4;          /* blanc cassé — fond de page */
  --cdc-blanc: #FFFFFF;          /* sections alternées */
  --cdc-olive: #81B29A;          /* vert olive doux — aplats, fonds de section. JAMAIS pour du texte (contraste insuffisant) */
  --cdc-sauge: #A8C3A5;          /* vert sauge — cartes, pastilles, survols */
  --cdc-vert-profond: #3E5F4F;   /* déclinaison foncée — titres, liens, icônes */
  --cdc-texte: #333333;          /* gris foncé — texte courant */
  --cdc-terracotta: #B15E3B;     /* couleur de conversion — bouton RDV UNIQUEMENT */
  --cdc-terracotta-fonce: #944C2E; /* survol du bouton RDV */
}

/* ==========================================================================
   2. POLICE LOCALE — Lora (titres uniquement)
   Un seul fichier, une seule graisse : télécharger lora-600.woff2
   (voir guide de montage) et le déposer dans /fonts/ de ce thème enfant.
   Le corps de texte reste en pile système : rien à charger.
   ========================================================================== */
@font-face {
  font-family: 'Lora';
  src: url('fonts/lora-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap; /* le texte s'affiche immédiatement en police système, puis bascule */
}

/* ==========================================================================
   3. TYPOGRAPHIE GLOBALE
   Les tailles sont gérées par les préréglages Divi (voir guide) ;
   ici : familles, couleurs et rythme de lecture.
   ========================================================================== */
body,
#main-content {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    'Helvetica Neue', Arial, sans-serif;
  color: var(--cdc-texte);
  line-height: 1.65;
}

h1, h2, h3, h4 {
  font-family: 'Lora', Georgia, serif;
  font-weight: 600;
  color: var(--cdc-vert-profond);
  line-height: 1.25;
}

/* Liens dans le corps de texte */
#main-content a:not(.et_pb_button) {
  color: var(--cdc-vert-profond);
  text-decoration: underline;
  text-underline-offset: 2px;
}
#main-content a:not(.et_pb_button):hover {
  color: var(--cdc-terracotta);
}

/* ==========================================================================
   4. BOUTONS
   Le style de base est posé dans les préréglages Divi ; ces classes
   garantissent la constance si un module échappe aux préréglages.
   .cdc-btn-rdv  : action principale (terracotta) — une seule par écran
   .cdc-btn-sec  : action secondaire (contour vert profond)
   ========================================================================== */
.cdc-btn-rdv,
.et_pb_button.cdc-btn-rdv {
  background: var(--cdc-terracotta) !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 8px !important;
}
.cdc-btn-rdv:hover,
.et_pb_button.cdc-btn-rdv:hover {
  background: var(--cdc-terracotta-fonce) !important;
}

.cdc-btn-sec,
.et_pb_button.cdc-btn-sec {
  background: transparent !important;
  color: var(--cdc-vert-profond) !important;
  border: 1.5px solid var(--cdc-vert-profond) !important;
  border-radius: 8px !important;
}
.cdc-btn-sec:hover,
.et_pb_button.cdc-btn-sec:hover {
  background: var(--cdc-vert-profond) !important;
  color: #FFFFFF !important;
}

/* ==========================================================================
   5. PASTILLES D'ACCÈS RAPIDE (premier écran : Hyères · Paris · Visio)
   Utilisation : dans un module Texte, liens avec la classe cdc-pill,
   conteneur avec la classe cdc-pills.
   ========================================================================== */
.cdc-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}
.cdc-pills a.cdc-pill {
  background: var(--cdc-sauge);
  color: #2C4A3B; /* ton foncé de la sauge — contraste AA */
  padding: 7px 16px;
  border-radius: 16px;
  text-decoration: none;
  font-size: 15px;
}
.cdc-pills a.cdc-pill:hover {
  background: var(--cdc-vert-profond);
  color: #FFFFFF;
}

/* ==========================================================================
   6. TABLEAU DES TARIFS (page Déroulement et tarifs)
   Tableau HTML simple dans un module Texte, classe cdc-tarifs.
   ========================================================================== */
table.cdc-tarifs {
  width: 100%;
  border-collapse: collapse;
}
table.cdc-tarifs th,
table.cdc-tarifs td {
  padding: 12px 14px;
  border-bottom: 1px solid #DDDDD8;
  text-align: left;
}
table.cdc-tarifs td:last-child {
  text-align: right;
  white-space: nowrap;
  font-weight: 600;
  color: var(--cdc-vert-profond);
}

/* ==========================================================================
   7. ACCORDÉONS FAQ (module Bascule Divi)
   Contenu toujours présent dans le HTML — exigence de visibilité.
   ========================================================================== */
.et_pb_toggle {
  background: var(--cdc-blanc);
  border: 1px solid #E3E3DE;
  border-radius: 10px;
  padding: 18px 20px;
  margin-bottom: 12px;
}
.et_pb_toggle_title {
  color: var(--cdc-vert-profond) !important;
  font-family: 'Lora', Georgia, serif;
  font-weight: 600;
}

/* ==========================================================================
   8. BLOC URGENCES (pied de page)
   ========================================================================== */
.cdc-urgences {
  background: var(--cdc-blanc);
  border-left: 3px solid var(--cdc-terracotta);
  padding: 16px 20px;
  font-size: 15px;
}

/* ==========================================================================
   9. ACCESSIBILITÉ
   ========================================================================== */
/* Focus clavier toujours visible, y compris sur les boutons Divi */
a:focus-visible,
button:focus-visible,
.et_pb_button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--cdc-terracotta);
  outline-offset: 2px;
}

/* Respect du réglage « réduire les animations » du visiteur */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ==========================================================================
   10. MOBILE
   Divi gère les tailles responsives via les préréglages ; ici,
   uniquement les garde-fous.
   ========================================================================== */
@media (max-width: 767px) {
  /* Boutons principaux pleine largeur sur mobile (premier écran, CTA final) */
  .cdc-cta-mobile-full .et_pb_button {
    display: block;
    width: 100%;
    text-align: center;
  }
  /* Aucun débordement horizontal, jamais */
  html, body {
    overflow-x: hidden;
  }
}