/* ═══════════════════════════════════════════════════════════════════════
   profil-synastrie.css — Uniformisation typo Partenaire idéal et Synastrie, jauges arrondies score synast
   ─────────────────────────────────────────────────────────
   Extrait de astro_app_V3.8.9.html lignes 4705-4850 (Phase 2 du refactoring).
   Cascade : ce fichier doit être chargé dans l'ordre indiqué dans index.html.
   ═══════════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════
   V3.8.3 — UNIFORMISATION TYPO : PARTENAIRE IDÉAL + SYNASTRIE
   Force DejaVu Sans (var --sans-reading) partout dans ces panneaux —
   en particulier dans les tableaux qui héritaient encore de Cormorant.
═══════════════════════════════════════════════════════════════════════ */
#profil-ideal-results,
#profil-ideal-results h1,
#profil-ideal-results h2,
#profil-ideal-results h3,
#profil-ideal-results h4,
#profil-ideal-results h5,
#profil-ideal-results h6,
#profil-ideal-results p,
#profil-ideal-results li,
#profil-ideal-results td,
#profil-ideal-results th,
#profil-ideal-results .astro-table,
#profil-ideal-results .astro-table td,
#profil-ideal-results .astro-table th,
#profil-ideal-results .person-name,
#profil-ideal-results .person-data,
#profil-ideal-results .signature,
#profil-ideal-results blockquote {
  font-family: var(--sans-reading);
}
#profil-ideal-results .astro-table {
  font-size: 0.94rem;
}
#profil-ideal-results .astro-table th {
  font-weight: 700;
  letter-spacing: 0.01em;
}
/* Synastrie : même traitement, surtout pour les tableaux */
#synastrie-results .astro-table,
#synastrie-results .astro-table td,
#synastrie-results .astro-table th {
  font-family: var(--sans-reading);
  font-size: 0.94rem;
}

/* ═══════════════════════════════════════════════════════════════════════
   V3.8.3 — JAUGES ARRONDIES POUR LE SCORE SYNASTRIE PAR DIMENSION
   Style "dashboard Adobe" : arc circulaire SVG + score central + lecture.
═══════════════════════════════════════════════════════════════════════ */
.syn-gauges-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  margin-top: 0.8rem;
}
.syn-gauge-card {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1rem 1.1rem;
  background: var(--ivoire);
  border: 1px solid var(--ivoire-fonce);
  border-radius: 6px;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.syn-gauge-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}
.syn-gauge-visual {
  position: relative;
  flex-shrink: 0;
  width: 84px;
  height: 84px;
}
.syn-gauge-svg {
  width: 84px;
  height: 84px;
  transform: rotate(-90deg); /* point de départ à 12h */
}
.syn-gauge-track {
  fill: none;
  stroke: var(--ivoire-fonce);
  stroke-width: 8;
}
.syn-gauge-fill {
  fill: none;
  stroke-width: 8;
  stroke-linecap: round;
  transition: stroke-dashoffset 0.6s ease;
}
.syn-gauge-center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.syn-gauge-value {
  font-family: var(--sans);
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1;
}
.syn-gauge-max {
  font-family: var(--sans);
  font-size: 0.7rem;
  color: var(--encre-clair);
  margin-top: 0.15rem;
  font-weight: 500;
}
.syn-gauge-content {
  flex: 1;
  min-width: 0;
}
.syn-gauge-label {
  font-family: var(--sans-reading);
  font-size: 0.96rem;
  font-weight: 700;
  color: var(--encre);
  margin: 0 0 0.15rem 0;
  letter-spacing: 0.005em;
  line-height: 1.3;
}
.syn-gauge-sub {
  font-family: var(--sans);
  font-size: 0.72rem;
  color: var(--encre-clair);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
  margin: 0 0 0.5rem 0;
}
.syn-gauge-lecture {
  font-family: var(--sans-reading);
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--encre-clair);
  font-style: italic;
  margin: 0;
}

@media (max-width: 720px) {
  .syn-gauges-grid { grid-template-columns: 1fr; }
  .syn-gauge-card { padding: 0.85rem 1rem; gap: 0.85rem; }
  .syn-gauge-visual { width: 72px; height: 72px; }
  .syn-gauge-svg { width: 72px; height: 72px; }
  .syn-gauge-value { font-size: 1.3rem; }
}