:root {
  --conf-primary-color: #005a9c; /* Blu primario da immagine */
  --conf-text-color: #4a4a4a;   /* Grigio scuro per testo */

}

.conference-info-grid {
  display: flex;
  justify-content: center;
  gap: 50px; /* Spazio tra le card */
  padding: 20px 40px;
  background-color: #C8D5DC4F;
  margin: 40px 0px;
  font-family: var(--e-global-typography-secondary-font-family), Sans-serif;
}

.conference-info-card {
  flex-basis: 350px;
  max-width: 100%; /* Impedisce overflow su container stretti */
  display: flex;
  flex-direction: column; /* Impila header e CTA verticalmente */
  justify-content: space-between; /* Spinge le CTA in basso (se altezze diverse) */
  min-height: 120px; /* Altezza minima per allineamento */
}

.card-header {
  display: flex;
  align-items: flex-start; /* Allinea icona e testo in alto */
  gap: 16px; /* Spazio tra icona e testo */
}

.card-icon {
  /* L'icona SVG usa 'currentColor' per ereditare il colore
    dal genitore, rendendolo facile da cambiare.
  */
  fill: var(--conf-primary-color);
  flex-shrink: 0; /* Impedisce all'icona di rimpicciolirsi */
  width: 44px; /* Dimensioni come da ispezione visiva */
  height: 44px;

}

.card-text {
    flex-grow: 1;

    display: flex;
    flex-direction: column;
}

.card-title {
  font-size: 20px;
  font-weight: 600;
  color: var(--conf-primary-color);
  margin: 0 0 4px 0; /* Spaziatura compatta */
  line-height: normal;
  min-height: 30px;
}

.card-description {
  font-size: 15px;
  color: var(--conf-text-color);
  margin: 0px;
  line-height: 1.4;
  min-height: 50px;
}

.card-cta-container {
  /* Contenitore per i pulsanti */
  display: flex;
  flex-wrap: wrap; /* Permette ai bottoni di andare a capo */
  gap: 12px; /* Spazio tra i bottoni (utile se ce ne fosse più di uno) */
}

.card-cta {
  /* Stile "pill" del pulsante */
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  background-color: var(--conf-primary-color);
  color: #ffffff!important;
  border-radius: 50px; /* Per la forma a pillola */
  padding: 0px 24px;
  cursor: pointer;
  /* Transizione per hover effect (best practice) */
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  white-space: nowrap;
}


/* Stato Hover/Focus (Performance & Accessibility)
  Prevediamo l'interazione utente.
*/
.card-cta:hover,
.card-cta:focus {
  background-color: var(--conf-primary-color);
  color: #ffffff;
  outline: 2px solid white; /* Rimuove l'outline di default */
  outline-offset: 2px; /* Spazio per focus-visible */
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12);
}

/* Migliora l'accessibilità della tastiera */
.card-cta:focus-visible {
   box-shadow: 0 0 0 2px var(--conf-primary-color);
}





.text-center {
  text-align: center;
}
/* Titoli principali del widget */
.widget-post-evento h2 {
    font-family: var(--e-global-typography-secondary-font-family), Sans-serif;
    font-size: var(--e-global-typography-secondary-font-size);
    font-weight: var(--e-global-typography-secondary-font-weight);
    font-style: var(--e-global-typography-secondary-font-style);
    text-decoration: var(--e-global-typography-secondary-text-decoration);
    line-height: var(--e-global-typography-secondary-line-height);
    letter-spacing: var(--e-global-typography-secondary-letter-spacing);
    color: var(--e-global-color-primary);
}

.widget-post-evento h3 {
    text-align: center;
    font-family: var(--e-global-typography-secondary-font-family), Sans-serif;
    font-size: var(--e-global-typography-secondary-font-size);
    font-weight:400;
    margin: 20px auto;
    color: var(--e-global-color-text);
}

/* --- Dettagli Evento (Data, Ora, Luogo) --- */

.widget-post-evento .dettagli-evento {
    /* Separa i dettagli dagli speaker */
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.widget-post-evento .evento-meta-list {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    /* Allinea al centro come da tua modifica */
    justify-content: center;
    align-items: center;
    /* Spazio dal titolo */
    margin: 20px auto;
    width: 100%;
    gap: 20px;
}

.widget-post-evento .evento-meta-item {
    display: flex;
    align-items: center;
    gap: 8px; /* Spazio tra icona e testo */
}

.widget-post-evento .evento-meta-icon svg {
    width: 24px;
    height: 24px;
    /* Usa variabile globale come da tua modifica */
    fill: var( --e-global-color-9427822 );
}

.widget-post-evento .evento-meta-text {
    font-size: 1rem;
    font-weight: 500;
    color: #333;
}


/* --- Griglia Speaker --- */

#sidebar {
  .widget-post-evento .speaker-grid {
      display: grid;
      /* 4 colonne fisse su desktop */
      grid-template-columns: repeat(2, 1fr);
      gap: 10px; /* Spazio tra le card */
      margin-top: 40px;
  }
  .dettagli-evento {
    display: none;
  }
  .speaker-image-wrapper {
     width: 100%;
    height: 120px;
    object-fit: cover;
    padding-bottom: 0px;
  }
  .widget-post-evento .speaker-card {
      padding: 6px;
      position: relative;
  }
  .widget-post-evento h2, .widget-post-evento h3 {
    font-size: 1.5rem;
  }
  .widget-post-evento .speaker-card:hover {
      border-radius: 50px 0px;
  }
  .widget-post-evento .speaker-description {
    margin: 0 0 8px 0;
    display: none;
  }
  .widget-post-evento .speaker-name a {
    font-size: 1.2rem;
    max-width: 80%;
  }
  .widget-post-evento .speaker-link-button {
      font-size: medium;
      padding: 7px 17px;
      line-height: normal;
      margin-bottom: 8px;
  }

}
.widget-post-evento .speaker-grid {
  font-family: "Poppins", Sans-serif;
  font-size: 16px;
  display: flex;
  justify-content: center;
  gap: 24px;
  margin-top: 40px;
}


.widget-post-evento .speaker-grid > * {
    width: 22%;
    max-width: 100%;
}

.widget-post-evento .speaker-card {
    display: flex;
    flex-direction: column;
    align-items: center; /* Centra tutto */
    text-align: center;
    /* Assicura che la card occupi tutta l'altezza (per allineamento bottone) */
    height: 100%;
    transition: all 0.3s  ease;
    padding: 20px;
    position: relative;
}
.speaker-layout-container .speaker-grid .speaker-card {
  position: relative;
  color: var(--e-global-color-primary);
}
.speaker-layout-container .speaker-grid .speaker-card a {
    position: absolute;
    top: 0;
    right: 0;
    border-radius: 0px 0px 0px 20px;
}
.speaker-layout-container h3.speaker-description {
    margin-top: 0;
    font-size: 2rem;
    margin-bottom: 0;
    line-height: 1.9rem;
}
.speaker-cta-group {
    position: relative;
    display: flex;
    justify-content: flex-start;
    .speaker-cta-button {
    position: relative !important;
    padding: 10px 40px !important;
    display: inline-flex;
    color: #fff;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin: 20px auto;
    background-color: #154a6c;
    border-radius: 16px !important;
    &:hover {
      color:#fff;
      text-decoration: underline;
    }
    }
}

.widget-post-evento .speaker-card:hover  {
  background-color: #003a6b;
  border-radius: 60px 0px;
}
.widget-post-evento .speaker-card:hover  h4.speaker-name a, .widget-post-evento .speaker-card:hover .speaker-description {
  color: #fff;
}
.widget-post-evento .speaker-card:hover .speaker-image-wrapper {
  border-radius: 43px 0px;
}
.widget-post-evento .speaker-image-link {
    display: block;
    margin-bottom: 16px;
    width: 100%;
}
.data_singola {
    font-size: 1.5rem;
    margin: 12px auto;
    display: flex;
    gap: 8px;
}
.data_singola span {
  align-items: center;
}
.data_singola svg {
  fill: var(--e-global-color-accent);
}
.biografia_note {
    padding: 0px 20px 20px 20px;
        color: #cfe5f8;
        line-height: 1.5rem;
        font-size: 1rem;
        font-weight: normal;
    p {
      padding: 10px 0px!important;
      margin: 0px;
    }
}
.widget-post-evento .speaker-image-wrapper {
    width: 100%;
    padding-bottom: 100%; /* Crea un contenitore quadrato (aspect-ratio 1:1) */
    position: relative;
    overflow: hidden;
    background-color: #f0f0f0; /* Sfondo per placeholder */
}

.widget-post-evento .speaker-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Assicura che l'immagine copra lo spazio */

    /* Effetto bianco e nero come da screenshot */
    filter: grayscale(100%);
    transition: filter 0.3s ease, transform 0.3s ease;
}

.widget-post-evento .speaker-image-link:hover .speaker-image {
    filter: grayscale(0%); /* Rimuove il filtro all'hover */
    transform: scale(1.05);
}

/* Stile per il placeholder (se non c'è l'immagine in evidenza) */
.widget-post-evento .speaker-image-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 48px;
    font-weight: bold;
    color: #999;
}

.widget-post-evento .speaker-name {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 8px 0;

}

.widget-post-evento .speaker-name a {
    text-decoration: none;
    /* Usa variabili globali tipografia come da tua modifica */
    font-family: var(--e-global-typography-392b9e0-font-family), Sans-serif;
    font-size: var(--e-global-typography-392b9e0-font-size);
    font-weight: var(--e-global-typography-392b9e0-font-weight);
    font-style: var(--e-global-typography-392b9e0-font-style);
    text-decoration: var(--e-global-typography-392b9e0-text-decoration);
    line-height: var(--e-global-typography-392b9e0-line-height);
    letter-spacing: var(--e-global-typography-392b9e0-letter-spacing);
    color: var(--e-global-color-primary);
    transition: color 0.3s ease;
}

.widget-post-evento .speaker-name a:hover {
    color: #0073aa; /* Colore hover (puoi cambiarlo) */
}

.widget-post-evento .speaker-description {
    font-size: 0.9rem;
    color: #555;
    line-height: 1.5;
    margin: 0 0 16px 0;
    /* Limita la descrizione a 3 righe con "..." */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 4.05em; /* 1.5 * 3 (line-height * righe) */
    font-family: var(--e-global-typography-secondary-font-family), Sans-serif;
    /* MIGLIORAMENTO UX: (dalla tua modifica)
       Permette alla descrizione di crescere e spingere il bottone in basso */
    flex-grow: 1;
}

/* Pulsante "Scopri di più" (stile "ghost") */
.widget-post-evento .speaker-link-button {
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    color: #0073aa; /* Colore principale */
    border: 2px solid #0073aa;
    border-radius: 20px; /* Arrotondato */
    padding: 0px 24px;
    transition: all 0.3s ease;
    margin-top: auto;
    display: inline;
    font-family: var(--e-global-typography-secondary-font-family), Sans-serif;
}

.widget-post-evento .speaker-link-button:hover, .widget-post-evento .speaker-card:hover .speaker-link-button {
    background-color: #0073aa;
    color: #ffffff;
}
.file_download {
  display: flex;
  justify-content: center;
  margin: 60px auto;

}
.file_download a {
  background-color: var(--e-global-color-primary);
  fill: var(--e-global-color-d6cea4e);
  color: var(--e-global-color-d6cea4e);
  border-style: solid;
  border-width: 1px 1px 1px 1px;
  border-color: var(--e-global-color-accent);
  padding: 16px 35px 16px 35px;
}
.file_download a:hover {
  color: #fff;
}

.speaker-layout-container {
    display: flex;
    flex-wrap: wrap; /* Per gestire il responsive su mobile */
    gap: 60px; /* Spazio tra le colonne */
    margin: 80px auto;
}

.speaker-layout-column-left {
    flex: 1; /* Occupa lo spazio disponibile */
    max-width: 350px;
}
.speaker-layout-column-left .speaker-description {display: none;}
.speaker-layout-column-right {
    flex: 1; /* Occupa lo spazio disponibile */
    min-width: 300px; /* Larghezza minima per il testo */
    position: sticky;
    top: 140px;
    height: 100%;
}
.speaker-layout-column-right .speaker-description {
  color: var(--e-global-color-primary);
}
.speaker-layout-column-left .speaker-card {
    background: linear-gradient(-43deg, #003a6b, #002f40);
        background-size: 400% 400%;
        animation: gradient 10s ease infinite;
    margin-bottom: 40px;
    border-radius: 60px 0px;
}
.speaker-layout-column-left img {
    width: 100%;
}
.speaker-layout-column-left h2.speaker-name {
    color: #fff;
    text-align: center;
    margin: 0;
    padding: 8px 0px;
    font-size: 20px;
}
.speaker-image-wrapper {
    display: flex;
}
ul.meta_information {
    list-style: none;
    margin: 20px 0px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-content: start;
    width: fit-content;
    text-align: left;
    padding: 8px;
    border: solid 1px #e5e8ed;
    border-radius: 16px;
}
ul.meta_information  li {
  padding: 8px;
  background-color: #F3F5F8;
  border-radius: 8px;
}
ul.meta_information li svg {
    width: 15px;
    fill: var(--e-global-color-primary);
    margin-right: 10px;
}
span.time {
    margin-left: 0px;
    padding: 5px 10px;
}
.speaker-layout-bio-text {
    background-color: #F3F5F8;
    padding: 40px;
    border-radius: 20px;
    position: relative;
    margin-top: 100px;
}
.speaker-layout-bio-text:before {
    content: "Qualcosa in più";
    font-size: 1.5rem;
    position: absolute;
    right: 30px;
    top: -35px;
    color: var(--e-global-color-primary);
    font-weight: 900;
}



/* 1. Rendi la card "relativa" per posizionare il bottone */
.event-card {
    position: relative;
    transition: background-color 0.3s ease;
}

/* 2. Stile del bottone (Icona) */
.event-accordion-toggle {
    position: absolute;
    top: 50%; /* Centrato verticalmente */
    right: 15px; /* Posizionato a destra */
    transform: translateY(-50%);

    /* Reset del bottone */
    background: #F3F5F8;
    border: none;
    padding: 10px;
    cursor: pointer;
    border-radius: 50%;

    /* Dimensioni dell'area cliccabile */
    width: 44px;
    height: 44px;

    /* Centra l'icona interna */
    display: flex;
    align-items: center;
    justify-content: center;

    transition: background-color 0.2s ease;
}

/* Stile al focus per A11Y */
.event-accordion-toggle:focus-visible {
    outline: 2px solid blue; /* O il tuo colore di focus */
    background-color: rgba(0, 0, 0, 0.05);
}

/* 3. L'icona "Chevron" (creata con CSS) */
.event-arrow-icon {
    display: block;
    width: 12px;
    height: 12px;
    border-style: solid;
    border-color: #333; /* Colore freccia */
    border-width: 0 2px 2px 0; /* Crea una L */
    transform: rotate(45deg); /* Trasforma L in V (chevron) */
    transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1); /* Animazione fluida */
}

/* 4. Stato Aperto (Rotazione) */
.event-card.is-open .event-arrow-icon {
    transform: rotate(225deg); /* 45 + 180 */
}

/* 5. Il pannello Contenuto */
.event-accordion-content {
    /* Transizione max-height (UIInnovator) */
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, padding 0.3s ease-out;

    /* Stile base (padding aggiunto solo quando aperto) */
    padding-left: 15px;
    padding-right: 15px;
    background-color: #F3F5F8; /* Sfondo leggermente diverso */
}

/* 6. Stato Aperto (Contenuto) */
.event-accordion-content.is-open {
    max-height: 1000px;
    padding: 12px 30px;
    transition: max-height 0.5s ease-in, padding 0.3s ease-in;
}

/* 7. Nascondi il bottone se non c'è accordion (JS gestisce 'hidden') */
.event-card:not(.has-accordion) .event-accordion-toggle {
    display: none;
}

/* Nascondi il testo solo per screen reader (già presente in Elementor) */
.elementor-screen-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
}

/* 1. Contenitore della descrizione (Stato di default) */
.speaker-layout-description-text {
    /* La transizione 'morbida' (300ms) si applica solo a max-height */
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

/* 2. Classe 'is-collapsible' (Aggiunta da JS *solo* se il testo eccede 200px) */
.speaker-layout-description-text.is-collapsible {
    max-height:200px;
    position: relative; /* Necessario per la dissolvenza */
}

/* 3. (Opzionale) Dissolvenza per indicare troncamento */
.speaker-layout-description-text.is-collapsible:not(.is-expanded)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    /* Assumendo uno sfondo bianco. Cambiare se necessario. */
    background: linear-gradient(to bottom, transparent, white);
}

/* 4. Stato espanso (Aggiunto/Rimosso al click) */
.speaker-layout-description-text.is-expanded {
    /* Il max-height finale viene applicato inline via JS (per l'animazione) */

}

/* 5. Stile del pulsante "Continua" (Appare solo se .is-collapsible) */
.speaker-expand-toggle {
    background: none;
    border: none;
    padding: 8px 0;
    margin-top: 4px; /* Spazio dalla dissolvenza */
    cursor: pointer;

    /* Stile da "link" */
    color: #005177; /* Scegli un colore primario */
    font-weight: 600;
    text-decoration: underline;
}

.speaker-expand-toggle:hover {
    text-decoration: none;
}


/* Potresti voler che su mobile le colonne vadano una sotto l'altra */
@media (max-width: 767px) {
    .speaker-layout-container {
        flex-direction: column;
    }
}

/* --- Media Queries per la Responsività --- */

/* Tablet (es. 1024px e inferiori) */
@media (max-width: 1024px) {
    .widget-post-evento .speaker-grid {
        /* 2 colonne su tablet */
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile (es. 767px e inferiori) */
@media (max-width: 767px) {
    .widget-post-evento .speaker-grid {
        /* 1 colonna su mobile */
        grid-template-columns: 1fr;
    }

    .widget-post-evento .evento-meta-list {
        /* Su mobile, impila i dettagli verticalmente */
        flex-direction: column;
        align-items: flex-center; /* Allinea a sinistra */
        gap: 12px; /* Meno spazio verticale */
    }

    .widget-post-evento .speaker-description {
       /* Su mobile non serve allineare i bottoni */
       flex-grow: 0;
       min-height: 0; /* Rimuovi altezza minima */
    }
}







/* Stile base per l'elemento della lista (presuppone che sia cliccabile) */
 .plan-event-widget-wrapper .events-container {
    max-width: 900px;
    margin: 0 auto;
}

.plan-event-widget-wrapper .events-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.plan-event-widget-wrapper .event-item {
    margin-bottom: 0; /* Il widget ora è la card stessa */
}

.plan-event-widget-wrapper .event-card {
    display: flex;
    flex-wrap: wrap; /* Aggiunto per responsività */
    align-items: center;
    gap: 1rem 1.5rem; /* Gap verticale e orizzontale */
    background-color: #ffffff;
    padding: 1.5rem;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
}

.plan-event-widget-wrapper .event-date {
    background-color: #F3F5F8; /* Colore rosa/salmone chiaro */
    border-radius: 8px;
    padding: 1rem;
    text-align: center;
    min-width: 90px;
    flex-shrink: 0;
}

.plan-event-widget-wrapper .event-date-range {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    line-height: normal;
    color: #cc5c00;
}

.plan-event-widget-wrapper .event-date-time {
    display: block;
    font-size: 1.75rem;
    font-weight: 800;
    color: #333;
    margin-top: 1.25rem;
}

.plan-event-widget-wrapper .event-details {
    flex-grow: 1;
    flex-basis: 300px; /* Larghezza minima prima di andare a capo */
    align-self: flex-center; /* Allinea i dettagli in alto */
}

.plan-event-widget-wrapper .event-title {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.35;
    color: #111;
    margin: 0 0 0.75rem 0;
}

/* --- NUOVI STILI PER LA LISTA SPEAKER --- */

.plan-event-widget-wrapper .session-speaker-list {
    margin-top: 10px;
    display: flex;
    flex-direction: row;

    gap: 0.75rem; /* Spazio tra gli speaker */
}

.plan-event-widget-wrapper .session-speaker-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.plan-event-widget-wrapper .session-speaker-item .speaker-image-small img {
    width: 62px;
    height: 62px;
    border-radius: 50%;
    object-fit: cover;
}

.plan-event-widget-wrapper .session-speaker-item .speaker-name {
    font-size: 0.95rem;
    font-weight: 600;
    color: #444;
}
.event-date-range::first-line {
    color: #a8a8a8 !important;
    font-weight: normal;
}
/* --- FINE NUOVI STILI --- */

.plan-event-widget-wrapper .event-action {
    margin-left: auto; /* Allinea a destra */
    flex-shrink: 0;
    white-space: nowrap;
    align-self: center; /* Allinea il link al centro verticalmente */
}

.plan-event-widget-wrapper .event-action a {
    text-decoration: none;
    font-weight: 700;
    font-size: 0.9rem;
    color: #555;
    transition: color 0.3s ease;
}

.plan-event-widget-wrapper .event-action a:hover {
    color: #000;
}

/* Stili per l'helper nell'editor */
.elementor-control-speaker_helper_inline_content .speaker-helper-inline-placeholder {
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid #e0e0e0;
    padding: 10px;
    border-radius: 4px;
}
.speaker-helper-item {
    display: flex; align-items: center; gap: 8px;
    padding: 5px; border-bottom: 1px solid #f0f0f0;
}
.speaker-helper-item img {
    width: 25px; height: 25px; border-radius: 50%;
}
.speaker-helper-details { font-size: 11px; }
.speaker-helper-details strong { display: block; font-size: 12px; color: #333; }
.speaker-helper-details span { color: #777; }






/* Media query per mobile */
@media (max-width: 767px) {
    .plan-event-widget-wrapper .event-card {
        flex-direction: column;
        align-items: flex-start;
    }
    .plan-event-widget-wrapper .event-action {
        margin-left: 0;
        margin-top: 1rem;
        align-self: flex-start;
    }
 
}

.plan-event-widget-wrapper .events-container {
    max-width: 100%;
    margin: 0 auto;
}

.plan-event-widget-wrapper .events-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.plan-event-widget-wrapper .event-item {
    margin-bottom: 0;
}

.plan-event-widget-wrapper .event-card {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 1.5rem;
    padding: 1.5rem;
    /* background-color, border-radius, box-shadow rimossi -> ora sono controlli */
}

.plan-event-widget-wrapper .event-date {
    padding: 1rem;
    text-align: center;
    min-width: 90px;
    flex-shrink: 0;
    /* background-color, border-radius rimossi -> ora sono controlli */
}


.plan-event-widget-wrapper .event-date-time {
    display: block;
    /* font-size, font-weight, color rimossi -> ora sono controlli */
}


.plan-event-widget-wrapper .event-title {
    /* font-size, font-weight, color, margin rimossi -> ora sono controlli */
     margin-bottom: 20px; /* Manteniamo questo per pulizia */
}
/* Questa è la tua regola base, invariata */
.bx_left_content .speaker-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 24px;

}
.meta_header ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
    svg {
      fill: #fff!important;
    }
}

/* =============================================
   SPEAKER CAROUSEL
   ============================================= */

.speaker-carousel-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Track: scroll-snap container */
.speaker-grid.speaker-carousel-track {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  gap: 16px;
  flex: 1 1 0%;
  padding: 8px 12px;
  justify-content: flex-start; /* ← AGGIUNGERE QUESTA RIGA */
}

.speaker-grid.speaker-carousel-track::-webkit-scrollbar {
  display: none;
}

/* Card width responsive via CSS custom property */
.speaker-grid.speaker-carousel-track .speaker-card {
  flex: 0 0 calc((100% - 3 * 16px) / 4); /* desktop: 4 */
  scroll-snap-align: start;
  box-sizing: border-box;
}

@media (max-width: 1024px) {
  .speaker-grid.speaker-carousel-track .speaker-card {
    flex: 0 0 calc((100% - 2 * 16px) / 3); /* tablet: 3 */
  }
}

@media (max-width: 767px) {
  .speaker-grid.speaker-carousel-track .speaker-card {
    flex: 0 0 100%; /* mobile: 1 */
  }
}

/* Frecce */
.speaker-carousel-btn {
  background: none;
  border: 1px solid currentColor;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.6;
  transition: opacity 0.2s;
}

.speaker-carousel-btn:hover {
  opacity: 1;
}

/* Dots */
.speaker-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
}

.speaker-carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: currentColor;
  opacity: 0.3;
  cursor: pointer;
  padding: 0;
  transition: opacity 0.2s;
}

.speaker-carousel-dot.active {
  opacity: 1;
}


/* --- Biografia Note: Collapse Accordion --- */
.biografia_note {
    position: relative;
}

.biografia_note-inner {
    overflow: hidden;
    transition: max-height 0.35s ease;
}

.biografia_note-inner.is-clamped {
    /* ~5 righe: assumo line-height 1.6em */
    max-height: calc(1.6em * 5);
}

.biografia_note-inner.is-expanded {
    max-height: 2000px; /* valore alto, la transizione parte da is-clamped */
}

.biografia_note-toggle {
    display: inline-block;
    margin-top: 8px;
    font-size: 0.85em;
    font-weight: 600;
    cursor: pointer;
    color: #fff;
    background: none;
    border: none;
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.biografia_note-toggle:hover {
    opacity: 0.75;
}

/* Se il contenuto non supera 5 righe, il bottone viene nascosto via JS */
.biografia_note-toggle.is-hidden {
    display: none;
}






@container (min-width: 990px) {
    .bx_left_content .speaker-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    .single-evento  .bx_left_content .speaker-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .speaker-layout-bio-text {
        margin-top: 30px;
    }

}

@media (max-width: 1200px) {
   .widget-post-evento .speaker-grid {
  flex-wrap: wrap;
}
.widget-post-evento .speaker-grid > * {
    width: 31%;
    max-width: 100%;
}
 .speaker-grid.speaker-carousel-track {
   flex-wrap: nowrap;
 }
}
/* Media query per mobile */
@media (max-width: 780px) {
    .plan-event-widget-wrapper .event-card {
        flex-direction: column;
        align-items: flex-start;
    }
    .conference-info-card .card-header {
        flex-direction: column;
    }
    .conference-info-card .conference-info-grid {
        display: flex;
        flex-direction: column;
    }
    #conferenza .conference-info-grid {
        gap: 8px;
    }
}


@media (max-width: 550px) {
  .widget-post-evento .speaker-grid > * {
      width: 70%;
      max-width: 100%;
  }
 .conference-info-grid  {
        flex-direction: column;
    }
    .conference-info-grid  .conference-info-card {
        min-height: 60px;
        flex-basis: auto;
    }
    .speaker-layout-column-left {
        flex: 1;
        max-width: 100%;
    }
    ul.meta_information {
      flex-direction: column-reverse;
      width: 100%;
    }
    ul.meta_information li {
        width: 100%;
    }
}



/* v3.0.0 - Azienda per-speaker (A3/B1) */
.speaker-card .speaker-company {
    margin: 0 0 8px;
    font-size: 0.9em;
    font-weight: 600;
    opacity: 0.75;
    color: #fff;
    margin: auto;
    text-align: center;
}
.session-speaker-item .speaker-company {
    display: block;
    font-size: 0.8em;
    font-weight: 600;
    opacity: 0.75;
}
