/*
 * Szegedi események blokk
 *
 * Copyright: Dovi + ChatGPT Codex
 * Encoding: UTF-8
 */

/* ------------------------------------------------------------
   Címsor
   ------------------------------------------------------------ */

.st988 .eventsTitle {
    display: flex;
    align-items: center;
    gap: 8px;
}

.st988 .eventsTitleIcon {
    width: 30px;
    height: 30px;
    object-fit: contain;
    flex: 0 0 30px;
}

/* ------------------------------------------------------------
   Csoportok
   ------------------------------------------------------------ */

.st988 .eventsGroups {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.st988 .eventGroup {
    margin: 0;
}

.st988 .eventGroupTitle {
    margin: 0 0 8px;
    color: #2d5f8b;
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.2;
}

/* ------------------------------------------------------------
   Események
   ------------------------------------------------------------ */

.st988 .eventList {
    display: flex;
    flex-direction: column;
}

.st988 .eventItem {
    padding: 9px 10px;
    border-radius: 12px;
    background: #f6f8fb;
}

.st988 .eventItem + .eventItem {
    margin-top: 8px;
}

.st988 .eventName {
    color: #1f2937;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.3;
}

.st988 .eventMeta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 3px;
    color: #667085;
    font-size: 0.72rem;
    line-height: 1.3;
}

.st988 .eventSeparator {
    color: #98a2b3;
}

.st988 .eventLink {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #2d5f8b;
    font-size: 0.95rem;
    line-height: 1;
    text-decoration: none;
}

.st988 .eventLink:hover,
.st988 .eventLink:focus {
    color: #174a75;
    text-decoration: none;
}

.st988 .eventDescription {
    margin-top: 4px;
    color: #667085;
    font-size: 0.75rem;
    line-height: 1.35;
}

/* ------------------------------------------------------------
   Állapot
   ------------------------------------------------------------ */

.st988 .eventsState {
    margin: 4px 0 10px;
    color: #667085;
    font-weight: 600;
}

/* ------------------------------------------------------------
   Mobil
   ------------------------------------------------------------ */

@media (max-width: 575.98px) {
    .eventsGroups {
        gap: 13px;
    }

    .eventItem {
        padding: 8px 9px;
    }

    .eventName {
        font-size: 0.84rem;
    }

    .eventMeta,
    .eventDescription {
        font-size: 0.72rem;
    }
}


/* ------------------------------------------------------------
   Esemény képének megnyitása
   ------------------------------------------------------------ */

.st988 .eventImageButton {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: #2d5f8b;
    font-size: 0.95rem;
    line-height: 1;
    cursor: pointer;
}

.st988 .eventImageButton:hover,
.st988 .eventImageButton:focus {
    color: #174a75;
}

.st988 .eventImageModal .modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 14px;
    background: #ffffff;
}

.st988 .eventPopupImage {
    display: block;
    width: 100%;
    height: auto;
    max-height: 80vh;
    object-fit: contain;
}



/* ------------------------------------------------------------
   További események megjelenítése
   ------------------------------------------------------------ */

.st988 .eventGroupHidden {
    max-height: 0;
    margin: 0 !important;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.st988 .eventsGroups:not(.eventsCollapsed) .eventGroupHidden {
    max-height: 5000px;
    margin: 0 !important;
    opacity: 1;
    pointer-events: auto;
    transition: max-height 0.45s ease, opacity 0.3s ease;
}

.st988 .eventItemHidden {
    max-height: 0;
    margin-top: 0 !important;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-4px);
    pointer-events: none;
    transition: max-height 0.45s ease,
                margin-top 0.45s ease,
                padding 0.45s ease,
                opacity 0.3s ease,
                transform 0.45s ease;
}

.st988 .eventsExpand {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin: 8px 0 0;
    padding: 5px 0 3px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #2d5f8b;
    cursor: pointer;
    font-size: 0.9rem;
    line-height: 1;
}

.st988 .eventsExpand:hover,
.st988 .eventsExpand:focus-visible {
    background: #f1f5f9;
    color: #174a75;
}

.st988 .eventsExpand i {
    transition: transform 0.2s ease;
}

.st988 .eventsExpandOpen i {
    transform: rotate(180deg);
}

.st988 .eventsGroups:not(.eventsCollapsed) .eventItemHidden {
    max-height: 500px;
    margin-top: 8px !important;
    padding-top: 9px;
    padding-bottom: 9px;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

@media (max-width: 575.98px) {
    .eventsExpand {
        padding-top: 4px;
        padding-bottom: 2px;
    }
}
.st988, .st988-instance, .widget_szeged_tourinform_988, .widget_szeged_tourinform_988_widget { background:transparent; border:0; border-radius:0; margin:0; padding:0; box-shadow:none; }
.st988 .eventsFooter { display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-top:10px; color:#667085; font-size:11px; line-height:1.4; }
.st988 .eventsFooter > span:last-child { margin-left:auto; text-align:right; }
.st988 .eventsFooter a { color:inherit; }
.st988 .eventActionIcon {display:block; width:16px; height:16px; margin:0; padding:0; border:0; box-shadow:none; object-fit:contain;}
.st988 .title {font-size:1.05rem;font-weight:800;color:#1f2937;margin-bottom:14px;}
.st988 [hidden] {display:none !important;}
.st988 .eventsExpand {font-size:.9rem;}
.st988-dialog {border:0;border-radius:14px;padding:12px;max-width:min(90vw,900px);max-height:90vh;background:#fff;}
.st988-dialog::backdrop {background:rgba(0,0,0,.65);}
.st988-dialog img {display:block;max-width:100%;max-height:80vh;object-fit:contain;}
.st988-dialog button {display:block;margin-left:auto;border:0;background:#fff;color:#1f2937;font-size:24px;cursor:pointer;}