@charset "utf-8";
/* CSS Document */

/* Wrapper */
.wrapper {
  text-align: center;
  padding: 30px;
  flex: 1;
}

/* Griglia eventi */
.grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr); /* 6 colonne su desktop */
  gap: 18px;
  justify-content: center;
  margin: 20px auto 40px;
  max-width: 1200px;
}

/* Pulsanti evento (tasselli) */
.event-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 12px;
  transition: all 0.3s ease;
  box-shadow: 0 2px 5px rgba(0,0,0,0.08);
  height: 150px;
  min-width: 150px;
  color: #fff; /* testo bianco di default */
}

/* Hover comune */
.event-button:hover {
  filter: brightness(1.15); /* schiarisce mantenendo il colore */
  box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  transform: translateY(-2px);
}

.event-button:hover .city,
.event-button:hover .date {
  color: #111; /* testo scuro */
}

/* Logo società (tondo) */
.event-logo {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  margin-bottom: 8px;
  object-fit: cover;
  border: 2px solid #eee;
  background: #fff;
}

/* Testo città */
.event-button .city {
  font-size: 0.95rem;
  font-weight: 600;
  margin-bottom: 3px;
  text-align: center;
}

/* Data */
.event-button .date {
  font-size: 0.8rem;
  text-align: center;
  opacity: 0.9;
}

/* Congresso nazionale SICOB - Pisa */
.event-button.pisa {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(rgba(0, 35, 70, 0.38), rgba(0, 20, 45, 0.62)),
    url("../images/logo_quadrato_pisa.png") center / cover no-repeat;
  border-color: rgba(255, 255, 255, 0.65);
}

.event-button.pisa .event-logo,
.event-button.pisa .city,
.event-button.pisa .date {
  position: relative;
  z-index: 1;
}

.event-button.pisa .city,
.event-button.pisa .date {
  color: #fff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.95);
}

.event-button.pisa:hover .city,
.event-button.pisa:hover .date {
  color: #fff;
}

/* Divider centrato */
.divider {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  font-weight: 600;
  font-size: 1rem;
  margin: 30px auto 15px;
  max-width: 500px;
}

.divider::before,
.divider::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #ccc;
}

.divider span {
  padding: 0 10px;
  white-space: nowrap;
  background: #fff; /* stesso sfondo pagina */
}

/* Varianti colore */
.gray     { background: #f9f9f9; color: #333; }
.blue     { background: #3B82F6; }
.green    { background: #10B981; }
.amber    { background: #F59E0B; }
.red      { background: #EF4444; }
.violet   { background: #8B5CF6; }
.cyan     { background: #06B6D4; }
.lime     { background: #84CC16; }
.sky      { background: #0EA5E9; }
.pink     { background: #EC4899; }
.orange   { background: #F97316; }
.indigo   { background: #6366F1; }
.indigoviolet {background: #765FF4; }
.navy     { background: #1E40AF; }
.fuchsia  { background: #D946EF; }
.rose     { background: #DB2777; }

/* --- Classici --- */
.blue       { background: #3B82F6; }   /* blu */
.green      { background: #10B981; }   /* verde */
.red        { background: #EF4444; }   /* rosso */
.orange     { background: #F97316; }   /* arancio */
.amber      { background: #F59E0B; }   /* ambra */
.violet     { background: #8B5CF6; }   /* viola */
.indigo     { background: #6366F1; }   /* indaco */
.navy       { background: #1E40AF; }   /* blu scuro */

/* --- Vivaci --- */
.fuchsia    { background: #D946EF; }   /* fucsia */
.pink       { background: #EC4899; }   /* rosa vivo */
.rose       { background: #DB2777; }   /* rosa profondo */
.sky        { background: #0EA5E9; }   /* celeste */
.cyan       { background: #06B6D4; }   /* turchese */
.lime       { background: #84CC16; }   /* lime */
.teal       { background: #14B8A6; }   /* verde acqua */
.emerald    { background: #059669; }   /* verde smeraldo */
.turquoise  { background: #2DD4BF; }   /* acquamarina */

/* --- Nuove tonalità per il gradiente (nomi colore) --- */
/* giallo pieno, tra amber e lime */
.yellow     { background: #FACC15; color:#111; }

/* giallo pieno, tra amber e lime */
.yellowlight     { background: #FFEB18; color:#111; }

/* azzurro intermedio, tra sky e blue */
.azure      { background: #38BDF8; }

/* viola-magenta, tra violet e fuchsia */
.purple     { background: #A855F7; }

/* rosa acceso ma non neon, tra pink e rose */
.hotpink    { background: #E11D74; }

/* --- Metallici / Eleganti --- */
.gold       { background: linear-gradient(135deg, #D4AF37, #F1C40F); color: #111; }
.silver     { background: linear-gradient(135deg, #C0C0C0, #E5E7EB); color: #111; }
.bronze     { background: linear-gradient(135deg, #CD7F32, #D97706); color: #fff; }
.copper     { background: linear-gradient(135deg, #B87333, #E67E22); color: #fff; }
.platinum   { background: linear-gradient(135deg, #E5E4E2, #F9FAFB); color: #111; }
.steel      { background: linear-gradient(135deg, #7A7A7A, #A0AEC0); color: #fff; }

/* --- Pastello --- */
.mint       { background: #A7F3D0; color: #111; }
.lavender   { background: #C4B5FD; color: #111; }
.peach      { background: #FED7AA; color: #111; }
.coral      { background: #FB7185; color: #fff; }
.lemon      { background: #FDE68A; color: #111; }
.aqua       { background: #5EEAD4; color: #111; }
.sand       { background: #F5DEB3; color: #111; }

/* --- Neutri / Scuri --- */
.gray       { background: #6B7280; }
.slate      { background: #475569; }
.charcoal   { background: #36454F; }
.black      { background: #111827; }
.white      { background: #FFFFFF; color: #111; border: 1px solid #ddd; }

/* --- Effetti speciali (facoltativi) --- */
.gradient-sunset {
  background: linear-gradient(135deg, #F97316, #F43F5E);
}
.gradient-ocean {
  background: linear-gradient(135deg, #0EA5E9, #10B981);
}
.gradient-royal {
  background: linear-gradient(135deg, #4F46E5, #9333EA);
}
.gradient-flamingo {
  background: linear-gradient(135deg, #EC4899, #F59E0B);
}
.gradient-forest {
  background: linear-gradient(135deg, #15803D, #3F6212);
}

/* === PALETTE A GRADAZIONI PER BRAND === */
/* SICOB (blu) */
.sicob-1 { background:#E0ECFF; color:#111; }
.sicob-2 { background:#BBD3FF; color:#111; }
.sicob-3 { background:#8BB2FF; }
.sicob-4 { background:#5E93FF; }
.sicob-5 { background:#2F74FF; }

/* SICOP (azzurro/teal) */
.sicop-1 { background:#D5F4FF; color:#111; }
.sicop-2 { background:#AEEBFA; color:#111; }
.sicop-3 { background:#79D8F1; }
.sicop-4 { background:#42C4E6; }

/* SIPAD (fucsia) */
.sipad-1 { background:#FDE7FF; color:#111; }
.sipad-2 { background:#F7B9FF; color:#111; }
.sipad-3 { background:#EC8BFF; }
.sipad-4 { background:#D95CF2; }

/* SIRC (viola) */
.sirc-1 { background:#EFE6FF; color:#111; }
.sirc-2 { background:#CDB7FF; color:#111; }
.sirc-3 { background:#A788FF; }
.sirc-4 { background:#895CFF; }

/* VENDOR / INDUSTRY (indaco) */
.vendor-1 { background:#E9ECFF; color:#111; }
.vendor-2 { background:#C8CEFF; color:#111; }
.vendor-3 { background:#9FA9FF; }
.vendor-4 { background:#6F7BFF; }

/* SPECIAL (evento singolo) */
.special-1 { background:#F0E7FF; color:#111; }  /* violetto soft */
.special-2 { background:#BFA5FF; }              /* violetto medio */

/* Neutro accademico/istituzionale */
.neutral-1 { background:#F3F4F6; color:#111; }  /* grigio chiaro */

/* Stato disabilitato */
.disabled {
  pointer-events: none;
  opacity: 0.6;
}

/* 📱 Responsive */
@media (max-width: 1024px) {
  .grid {
    grid-template-columns: repeat(3, 1fr); /* tablet */
    max-width: 800px;
  }
}

@media (max-width: 600px) {
  .grid {
    grid-template-columns: repeat(2, 1fr); /* mobile */
    max-width: 400px;
  }
}

/* Titolo pagina */
.page-title {
  text-align: center;
  font-size: 2.2rem;
  font-weight: 700;
  margin: 2rem 0;
  color: #333;
  border: none;
}

/* Pulsante nel divider */
.divider-button {
  display: inline-block;
  background: #6B7280;   /* grigio neutro */
  color: #fff;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  padding: 8px 18px;
  border-radius: 25px;
  transition: all 0.3s ease;
}

.divider-button:hover {
  background: #9CA3AF;   /* grigio più chiaro in hover */
  color: #111;           /* testo scuro */
}

.event-button.pending {
    opacity: 0.55;              /* rende la card sbiadita */
    filter: grayscale(15%);     /* leggermente desaturata */
    cursor: default;            /* niente manina */
    pointer-events: none;       /* non cliccabile */
}