﻿/* ---------------------------------------- */
/* 1) Container ve “Tüm Etkinlikler” Linki */
/* ---------------------------------------- */
.event-container {
    border-radius: 6px;
    position: relative;
    padding: 1rem;
    background-color: #fff;
    height: 500px;
    overflow: hidden; /* taştığında gizle */
    box-shadow: 0 0 10px rgba #0000001a (0, 0, 0, 0.1);
}

    .event-container .tum-events-link {
        position: absolute;
        right: 1rem;
        bottom: 1rem;
        font-weight: bold;
        color: #0d6efd;
        text-decoration: none;
    }

/* ---------------------------------------- */
/* 2) Başlık Stili                         */
/* ---------------------------------------- */
/* Hem .etkinlikler-header hem de .event-header için */
.etkinlikler-header .mainHeading,
.event-header .main-heading {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.etkinlikler-header .icon,
.event-header .icon.calendar {
    /* ikon stilinizi buraya ekleyin */
}

/* ---------------------------------------- */
/* 3) Carousel ve Kart Yükseklik Ayarları   */
/* ---------------------------------------- */
/* Sadece yükseklik zincirini %100 yapmak */
/* stage / item-container / item */
.event-carousel.owl-carousel,
.event-carousel.owl-carousel .owl-stage-outer,
.event-carousel.owl-carousel .owl-stage,
.event-carousel.owl-carousel .owl-item,
.event-carousel.owl-carousel .item-container {
}

    /* ---------------------------------------- */
    /* 4) Kart Kontaynırı (item-container)      */
    /* ---------------------------------------- */
    .event-carousel.owl-carousel .item-container {
        padding: 0;
        border: none;
        box-sizing: border-box;
        height: 90%;
    }

    /* ---------------------------------------- */
    /* 5) Tek Kart (item)                      */
    /* ---------------------------------------- */
    .event-carousel.owl-carousel .item {
        display: flex;
        flex-direction: column;
        background: #fff;
        border: 1px solid #ddd;
        border-radius: 6px;
        overflow: hidden;
        height: 100%;
    }

        /* ---------------------------------------- */
        /* 6) Resim / Metin Dağılımı (%95 / %5)     */
        /* ---------------------------------------- */
        .event-carousel.owl-carousel .item .thumb {
            flex: 0 0 90%;
            overflow: hidden;
        }

            .event-carousel.owl-carousel .item .thumb img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }

        .event-carousel.owl-carousel .item .event-detail {
            flex: 0 0 5%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0;
            font-size: 0.85rem;
        }

            .event-carousel.owl-carousel .item .event-detail .date {
                font-size: 0.9rem;
                color: #0d6efd;
                font-weight: 500;
            }

    /* ---------------------------------------- */
    /* 7) Kartlar Arası Boşluk ve Box-Sizing   */
    /*    (items:3 JS ayarı ile kullanılır)     */
    /* ---------------------------------------- */
    .event-carousel.owl-carousel .owl-item {
        /* JS tarafında items:3 olduğu sürece basta bu margin/paddingı ekleyin */
        padding: 0 0.5rem;
        box-sizing: border-box;
    }

/* NOT: Aşağıdaki satırları *kaldırın* ya da *devre dışı bırakın* 
   çünkü OwlCarousel JS’inizi bozuyor: */
/*
.event-carousel.owl-carousel .owl-stage {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -0.5rem;
}
*/

/* ---------------------------------------- */
/* 8) Sürükleme Anında Metin Ortalamak      */
/* ---------------------------------------- */
.owl-carousel.owl-drag .owl-item {
    text-align: center;
    font-size: 1rem;
    font-weight: 500;
}
