/* ============================================================
   style-ente.css — Portfolio pubblico ente (/ente?id=N)
   Integra la texture/palette globale di style.css.
   ============================================================ */

/* ── Reveal on scroll ── */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}


/* Aggiungi al CSS esistente */
.ente-hero-logo {
  overflow: hidden; /* necessario con object-cover per rispettare rounded-3xl */
}

/* ── Card vetro coerenti col resto del sito ── */
.ente-card {
  border-radius: 1rem;
  border: 1px solid rgba(15, 23, 42, .08);
  background: rgba(255, 255, 255, .72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.dark .ente-card {
  border-color: rgba(255, 255, 255, .09);
  background: rgba(255, 255, 255, .045);
}

/* Le card statistiche (stat-card / stat-tile / tinte) vivono nel
   file condiviso /css/stats-cards.css — usato anche da rete.html
   e profili-professionali.html. */

/* ── Mappa sedi (Leaflet, caricato lazy da ente.js) ── */
.sedi-map {
  position: relative;
  z-index: 0;            /* stacking context: i pannelli Leaflet (z-index interni fino a 1000)
                            non passano sopra navbar e bottom-nav della pagina */
  isolation: isolate;
  height: 320px;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, .08);
  background: #e9edf3;   /* placeholder finché le tile non arrivano */
}
@media (min-width: 768px) { .sedi-map { height: 400px; } }
.dark .sedi-map { border-color: rgba(255, 255, 255, .09); background: #111827; }
/* dark mode: le tile OSM sono chiare → inversione + rotazione dei toni */
.dark .sedi-map .leaflet-tile { filter: invert(1) hue-rotate(180deg) brightness(.85) contrast(.9) grayscale(.2); }
.dark .sedi-map .leaflet-control-zoom a { background: #1f2937; color: #e5e7eb; border-color: #374151; }
.dark .sedi-map .leaflet-control-attribution { background: rgba(17, 24, 39, .75); color: #9ca3af; }
.dark .sedi-map .leaflet-control-attribution a { color: #93c5fd; }

/* Badge al centro dei cerchi sulla mappa (L.divIcon in ente.js) */
.sede-cap-icon {
  display: flex; align-items: center; justify-content: center;
  border-radius: 9999px;
  background: #fff;
  border: 1.5px solid rgba(37, 99, 235, .45);
  box-shadow: 0 2px 8px rgba(15, 23, 42, .18);
  color: #2563eb;
}
.sede-cap-icon svg { width: 15px; height: 15px; }
.dark .sede-cap-icon {
  background: #1f2937;
  border-color: rgba(96, 165, 250, .5);
  color: #93c5fd;
}

/* ── Card sede (griglia sotto la mappa) ── */
.sede-item {
  display: flex; align-items: center; gap: .8rem;
  padding: .8rem 1rem;
  border-radius: 1rem;
  border: 1px solid rgba(15, 23, 42, .07);
  background: rgba(255, 255, 255, .6);
  transition: border-color .2s ease;
}
.sede-item:hover { border-color: rgba(147, 197, 253, .9); }
.dark .sede-item {
  border-color: rgba(255, 255, 255, .08);
  background: rgba(255, 255, 255, .04);
}
.dark .sede-item:hover { border-color: rgba(96, 165, 250, .5); }
/* card selezionata (cerchio acceso sulla mappa) */
.sede-item--active {
  border-color: rgba(37, 99, 235, .65);
  box-shadow: 0 0 0 1px rgba(37, 99, 235, .35);
}
.dark .sede-item--active {
  border-color: rgba(96, 165, 250, .65);
  box-shadow: 0 0 0 1px rgba(96, 165, 250, .35);
}
.sede-ic {
  width: 2.5rem; height: 2.5rem; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border-radius: .75rem;
  background: rgba(37, 99, 235, .08);
  border: 1px solid rgba(37, 99, 235, .14);
  color: #2563eb;
}
.sede-ic svg { width: 1.6rem; height: 1.6rem; }
.dark .sede-ic {
  background: rgba(96, 165, 250, .10);
  border-color: rgba(96, 165, 250, .20);
  color: #93c5fd;
}

/* Liste lunghe (corsi): scroll attivo ma scrollbar invisibile */
.ente-scroll { scrollbar-width: none; -ms-overflow-style: none; }
.ente-scroll::-webkit-scrollbar { display: none; }

/* Loader (stesso pattern del resto del sito) */
[x-cloak] { display: none !important; }

/* ── Social icon button (stesso stile di .soc in style-contatti.css) ── */
.soc {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.75rem; height: 2.75rem;
  border-radius: .75rem;
  border: 1px solid #e5e7eb;
  background: rgba(255,255,255,.6);
  color: #374151;
  transition: transform .15s, border-color .15s, color .15s, background-color .15s;
}
.soc:hover { transform: translateY(-2px); border-color: #93c5fd; color: #2563eb; }
.dark .soc { background: rgba(31,41,55,.55); border-color: #4b5563; color: #d1d5db; }
.dark .soc:hover { border-color: #60a5fa; color: #93c5fd; }