/* =============================================================
   FiesoleForYou – Agenda Eventi  |  Frontend Styles v1.6
   Iniettato nell'<head> con priorità 999 → carica dopo Divi
   Titolo 24px · Body 16px · Icone 21px
   ============================================================= */

.ffy-eventi-wrap {
    font-family: 'Open Sans', sans-serif;
    width: 100%;
}

.ffy-no-eventi {
    font-size: 16px;
    color: #888;
    font-style: italic;
    padding: 30px 0;
    text-align: center;
}

/* ============================================================
   GRIGLIA 4 COLONNE + FILETTI
   ============================================================ */
.ffy-layout-colonne {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 0;
    align-items: start;
}

.ffy-layout-colonne .ffy-evento {
    border-left:  3px solid #1a1a1a;
    border-right: 1px solid #d0d0d0;
    padding:      24px 28px;
    display:      flex;
    flex-direction: column;
    box-sizing:   border-box;
}

.ffy-layout-colonne .ffy-evento:nth-child(4n),
.ffy-layout-colonne .ffy-evento:last-child {
    border-right: none;
}

/* ============================================================
   TITOLO  24px
   ============================================================ */
.ffy-eventi-wrap .ffy-titolo {
    font-size:     24px;
    font-weight:   700;
    line-height:   1.3;
    color:         #1a1a1a;
    margin:        0 0 12px;
    padding:       0;
}

/* ============================================================
   DESCRIZIONE  16px
   ============================================================ */
.ffy-eventi-wrap .ffy-descrizione {
    font-size:     16px;
    line-height:   1.6;
    color:         #1a1a1a;
    margin:        0 0 16px;
    padding:       0;
}

/* ============================================================
   META LIST (data / luogo / ora)
   ============================================================ */
.ffy-eventi-wrap .ffy-meta-list {
    margin:  10px 0 14px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ffy-eventi-wrap .ffy-meta-item {
    display:     flex;
    align-items: flex-start;
    gap:         12px;
    font-size:   16px;
    line-height: 1.4;
    color:       #1a1a1a;
    margin:  0;
    padding: 0;
}

.ffy-eventi-wrap .ffy-meta-item svg {
    flex-shrink: 0;
    width:       21px;
    height:      21px;
    min-width:   21px;
    margin-top:  2px;
}

.ffy-eventi-wrap .ffy-meta-item span {
    flex: 1;
}

/* ============================================================
   DETTAGLI / NOTE  14px
   ============================================================ */
.ffy-eventi-wrap .ffy-dettagli {
    margin-top: 16px;
    display:    flex;
    flex-direction: column;
    gap: 6px;
}

.ffy-eventi-wrap .ffy-dettagli-testo {
    font-size:   14px;
    line-height: 1.5;
    color:       #444;
    margin:      0;
    padding:     0;
}

/* ============================================================
   LINK + EMAIL  #c0392b, 16px
   ============================================================ */
.ffy-eventi-wrap .ffy-link-wrap {
    margin:  0;
    padding: 0;
}

.ffy-eventi-wrap .ffy-link-dettagli {
    display:         inline-flex;
    align-items:     center;
    gap:             6px;
    color:           #c0392b;
    text-decoration: none;
    font-size:       16px;
    line-height:     1.4;
    margin-bottom:   2px;
    word-break:      break-all;
}

.ffy-eventi-wrap .ffy-link-dettagli:hover {
    text-decoration: underline;
    color:           #a93226;
}

.ffy-eventi-wrap .ffy-link-dettagli svg {
    flex-shrink: 0;
    width:       16px;
    height:      16px;
    min-width:   16px;
}

/* ---- PASSATI ---- */
.ffy-passato { opacity: .45; }

/* ============================================================
   LAYOUT TIMELINE
   ============================================================ */
.ffy-layout-timeline {
    display:        flex;
    flex-direction: column;
}

.ffy-layout-timeline .ffy-evento {
    padding:       20px 0 20px 20px;
    border-left:   3px solid #1a1a1a;
    border-right:  none;
    border-bottom: 1px solid #d0d0d0;
}

.ffy-layout-timeline .ffy-evento:last-child {
    border-bottom: none;
}

.ffy-month-divider { margin: 32px 0 10px; }

.ffy-month-divider h3 {
    font-size:      13px;
    font-weight:    700;
    color:          #1a1a1a;
    text-transform: uppercase;
    letter-spacing: .1em;
    border-bottom:  2px solid #1a1a1a;
    padding-bottom: 6px;
    margin:         0;
}

/* ============================================================
   WIDGET
   ============================================================ */
.ffy-widget-list {
    list-style: none;
    margin:     0;
    padding:    0;
}

.ffy-widget-item {
    display:        flex;
    flex-direction: column;
    padding:        10px 0;
    border-bottom:  1px solid #d0d0d0;
}

.ffy-widget-item:last-child { border-bottom: none; }

.ffy-w-data {
    font-size:      12px;
    font-weight:    700;
    color:          #1a1a1a;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom:  3px;
}

.ffy-w-titolo {
    font-size:       15px;
    font-weight:     600;
    color:           #1a1a1a;
    text-decoration: none;
    line-height:     1.35;
}

a.ffy-w-titolo:hover { color: #c0392b; }

.ffy-w-luogo {
    font-size:  13px;
    color:      #666;
    margin-top: 2px;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 980px) {
    .ffy-layout-colonne {
        grid-template-columns: repeat(2, 1fr);
    }

    .ffy-layout-colonne .ffy-evento {
        border-right:  none;
        border-bottom: 1px solid #d0d0d0;
    }

    .ffy-layout-colonne .ffy-evento:nth-child(4n) {
        border-right: none;
    }

    .ffy-layout-colonne .ffy-evento:last-child {
        border-bottom: none;
    }
}

@media (max-width: 479px) {
    .ffy-eventi-wrap .ffy-titolo {
        font-size: 20px;
    }

    .ffy-layout-colonne {
        grid-template-columns: 1fr;
    }

    .ffy-layout-colonne .ffy-evento {
        border-right: none;
    }
}