/* ============================================================
   stats-cards.css — componente card statistiche condiviso
   (ente.html, rete.html, profili-professionali.html)
   Card glass + velature radiali sulla palette Aspasia.
   ============================================================ */

/* Base glass, indipendente dalle .ente-card specifiche di pagina */
.stat-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, .08);
  background: rgba(255, 255, 255, .72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.dark .stat-card {
  border-color: rgba(255, 255, 255, .09);
  background: rgba(255, 255, 255, .045);
}
/* la velatura vive nel ::before sotto il contenuto: la card resta glass */
.stat-card::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none; z-index: 0;
}
.stat-card > * { position: relative; z-index: 1; }

@media (hover: hover) {
  .stat-card { transition: transform .25s ease, box-shadow .25s ease; }
  .stat-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 40px -18px rgba(59, 130, 246, .45);
  }
}

/* ── Card grande: headline + tile numeriche ──
   flex-col, così il blocco tile (mt-auto nel markup) resta ancorato
   in basso anche con headline di lunghezze diverse. */
.stat-card--feature {
  border-radius: 1.5rem;
  display: flex; flex-direction: column;
}
.stat-card--sky::before {
  background:
    radial-gradient(110% 95% at 12% -10%, rgba(56, 189, 248, .30), transparent 62%),
    radial-gradient(95% 90% at 95% 108%, rgba(45, 212, 191, .18), transparent 60%);
}
.stat-card--indigo::before {
  background:
    radial-gradient(110% 95% at 88% -10%, rgba(129, 140, 248, .30), transparent 62%),
    radial-gradient(95% 90% at 5% 108%, rgba(96, 165, 250, .20), transparent 60%);
}
.dark .stat-card--sky::before {
  background:
    radial-gradient(110% 95% at 12% -10%, rgba(56, 189, 248, .15), transparent 62%),
    radial-gradient(95% 90% at 95% 108%, rgba(45, 212, 191, .09), transparent 60%);
}
.dark .stat-card--indigo::before {
  background:
    radial-gradient(110% 95% at 88% -10%, rgba(129, 140, 248, .15), transparent 62%),
    radial-gradient(95% 90% at 5% 108%, rgba(96, 165, 250, .10), transparent 60%);
}

/* ── Tile numeriche dentro le card grandi ── */
.stat-tile {
  display: flex; flex-direction: column; justify-content: space-between;
  min-height: 7.25rem;
  padding: 1rem 1.15rem;
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, .55);
  background: rgba(255, 255, 255, .48);
}
.dark .stat-tile {
  border-color: rgba(255, 255, 255, .08);
  background: rgba(255, 255, 255, .05);
}
.stat-tile-num {
  font-size: 1.9rem; font-weight: 800; line-height: 1.1;
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
}
.stat-tile-label {
  margin-top: .75rem;
  font-size: .75rem; font-weight: 600;
  color: #64748b;
}
.dark .stat-tile-label { color: #94a3b8; }
@media (min-width: 768px) {
  .stat-tile { min-height: 8.25rem; }
  .stat-tile-num { font-size: 2.25rem; }
}

/* ── Mini card: nome in alto, numero in basso ── */
.stat-card--mini {
  border-radius: 1.25rem;
  min-height: 9rem;
  display: flex; flex-direction: column;
}

/* ── Velatura generica: riusabile su qualunque card glass ──
   .card-tint + una variante colore. Stessi gradienti delle mini
   stats (selettori uniti: i valori vivono in un posto solo). */
.card-tint { position: relative; overflow: hidden; }
.card-tint::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none; z-index: 0;
}
.card-tint > * { position: relative; z-index: 1; }

/* Velature leggere (la "d" resta neutra) */
.stat-tint-a::before, .card-tint--blue::before   { background: radial-gradient(130% 105% at 18% -8%, rgba(59, 130, 246, .16), transparent 65%); }
.stat-tint-b::before, .card-tint--sky::before    { background: radial-gradient(130% 105% at 18% -8%, rgba(56, 189, 248, .18), transparent 65%); }
.stat-tint-c::before, .card-tint--indigo::before { background: radial-gradient(130% 105% at 18% -8%, rgba(129, 140, 248, .18), transparent 65%); }
.dark .stat-tint-a::before, .dark .card-tint--blue::before   { background: radial-gradient(130% 105% at 18% -8%, rgba(59, 130, 246, .10), transparent 65%); }
.dark .stat-tint-b::before, .dark .card-tint--sky::before    { background: radial-gradient(130% 105% at 18% -8%, rgba(56, 189, 248, .10), transparent 65%); }
.dark .stat-tint-c::before, .dark .card-tint--indigo::before { background: radial-gradient(130% 105% at 18% -8%, rgba(129, 140, 248, .10), transparent 65%); }