.kategori-top{
    position:relative;
    min-height:220px;
    background:url("../images/index-adiyaman.webp") center center/cover no-repeat;
    overflow:hidden;
    margin:0px;
}
.kategori-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(90deg, rgb(0 0 0 / 80%), rgba(0, 0, 0, .35));
}
.kategori-container{
    position: relative;
    z-index: 2;
    max-width: 1300px;
    margin: 60px auto;
    min-height: 100px;
    padding: 0px;
}
.kategori-bilgi{
	width:35%;
	height:150px;
	background-color:transparent;
	float:left;
	margin-left:10px;
	margin-bottom:50px;
}
.kategori-bilgi h1{
	font-size:32px;
	color:#fff;
	font-weight:600;
}
.kategori-bilgi p{
	font-size:14px;
	color:#fff;
	float:left;
	padding-top:0px;
	padding-right:5px;
	font-weight:400;
}
.kategori-bilgi a{
	text-decoration:none;
	color:#fff;
}
.kategori-bilgi label{
	font-size:15px;
	color:#fff;
	float:left;
	padding-top:20px;
	font-weight:400;
}









/* =========================================
   ETKİNLİKLER SAYFASI
========================================= */

.etkinlikler-page{
    width:100%;
    max-width:1250px;
    margin:25px auto;
    color:#222;
    box-sizing:border-box;
}


/* =========================================
   ÜST FİLTRE
========================================= */

.etkinlik-filtre-alani{
    display:grid;
    grid-template-columns:1.5fr .9fr .9fr .9fr auto auto;
    gap:10px;
    align-items:end;
    background:#fff;
    border:1px solid #ececec;
    border-radius:9px;
    padding:12px;
    box-shadow:0 2px 10px rgba(0,0,0,.035);
}
.etkinlik-aramasi{
    height:39px;
    position:relative;
}
.etkinlik-aramasi input{
    width:100%;
    height:100%;
    box-sizing:border-box;
    border:1px solid #e5e5e5;
    border-radius:6px;
    padding:0 35px 0 11px;
    outline:none;
    font-size: 13px;
    color: #222;
    font-weight: 500;
}

.etkinlik-aramasi input::placeholder{
    color:#999;
}
.etkinlik-aramasi input:focus{
    border-color:#f63b54;
}
.etkinlik-aramasi i{
    position:absolute;
    right:11px;
    top:50%;
    transform:translateY(-50%);
    color:#555;
    font-size:11px;
}
.etkinlik-filtre{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.etkinlik-filtre label{
    font-size: 13px;
    color: #222;
    font-weight: 600;
}
.etkinlik-filtre select{
    width:100%;
    height:39px;
    border:1px solid #e5e5e5;
    border-radius:6px;
    background:#fff;
    padding:0 9px;
    font-weight: 500;
    color: #222;
    font-size: 13px;
    outline:none;
}

.etkinlik-filtre select:focus{
    border-color:#f63b54;
}
.etkinlik-filtrele{
    height:39px;
    padding:0 17px;
    border:1px solid #f63b54;
    background:#fff;
    border-radius:6px;
    color:#f63b54;
    font-size: 13px;
    font-weight: 600;
    cursor:pointer;
}

.etkinlik-filtrele:hover{
    background:#f63b54;
    color:#fff;
}

.etkinlik-temizle{
    height:39px;
    padding:0 14px;
    border:1px solid #e5e5e5;
    background:#fff;
    border-radius:6px;
    color:#666;
    font-size:13px;
    cursor:pointer;
}
.etkinlik-temizle:hover{
    border-color:#ccc;
    background:#fafafa;
}

/* =========================================
   KATEGORİLER
========================================= */

.etkinlik-kategoriler{
    display:flex;
    align-items:center;
    gap:8px;

    padding:12px 0;

    overflow-x:auto;
}

.etkinlik-kategoriler::-webkit-scrollbar{
    display:none;
}

.etkinlik-kategori{
    height: 34px;
    padding: 0 12px;
    border: 1px solid #e6e6e6;
    background: #fff;
    border-radius: 6px;
    color: #222;
    font-size: 14px;
    white-space: nowrap;
    cursor: pointer;
    font-weight: 500;
    transition: .2s;
}

.etkinlik-kategori i{
    margin-right:7px;
    font-size:14px;
}

.etkinlik-kategori:hover{
    border-color:#f63b54;
    color:#f63b54;
}

.etkinlik-kategori.active{
    background:#f63b54;
    border-color:#f63b54;
    color:#fff;
}


/* =========================================
   SONUÇ BAR
========================================= */

.etkinlik-sonuc-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;

    min-height:43px;

    border-top:1px solid #f0f0f0;
    border-bottom:1px solid #f0f0f0;

    margin-bottom:8px;
}

.etkinlik-sonuc{
    color:#666;
    font-size:13px;
}

.etkinlik-sonuc strong{
    color:#f63b54;
    font-weight:700;
}

.etkinlik-sag-aksiyon{
    display:flex;
    align-items:center;
    gap:8px;
}


.etkinlik-gorunum{
    display:flex;

    border:1px solid #e5e5e5;
    border-radius:6px;

    overflow:hidden;
}

.gorunum-sec{
    height: 32px;
    padding: 0 20px;
    border: none;
    background: #fff;
    color: #666;
    font-size: 13px;
    cursor: pointer;
}

.gorunum-sec + .gorunum-sec{
    border-left:1px solid #eee;
}

.gorunum-sec i{
    margin-right:5px;
}

.gorunum-sec.active{
    color:#f63b54;
    background:#fffafa;
    font-weight:600;
}


.etkinlik-siralama{
    height: 32px;
    min-width: 130px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    background: #fff;
    padding: 0 8px;
    font-size: 13px;
    color: #666;
    outline: none;
}


/* =========================================
   ETKİNLİK LİSTESİ
========================================= */

.etkinlik-listesi{
    display:flex;
    flex-direction:column;

    border:1px solid #ececec;
    border-radius:8px;

    overflow:hidden;

    background:#fff;
}


/* =========================================
   ETKİNLİK SATIRI
========================================= */

.etkinlik-satir{
    min-height:105px;

    display:grid;

    grid-template-columns:125px minmax(180px,1.25fr) minmax(190px,1fr) 115px;

    align-items:center;

    gap:15px;

    padding:10px;

    border-bottom:1px solid #eeeeee;

    transition:.2s;
}

.etkinlik-satir:last-child{
    border-bottom:none;
}

.etkinlik-satir:hover{
    background:#fffafa;
}


/* =========================================
   ETKİNLİK GÖRSEL
========================================= */

.etkinlik-gorsel{
    height:78px;

    position:relative;

    overflow:hidden;

    border-radius:7px;

    background:#eee;
}

.etkinlik-gorsel img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

    transition:.3s;
}

.etkinlik-satir:hover .etkinlik-gorsel img{
    transform:scale(1.04);
}


.etkinlik-kategori-etiket{
	position: absolute;
    top: 6px;
    left: 6px;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
    background: #fff;
}


/* Kategori renkleri */

.etkinlik-kategori-etiket.muzik{
    color:#6951d8;
    background:#f0edff;
}

.etkinlik-kategori-etiket.yiyecek{
    color:#d66b16;
    background:#fff2e6;
}

.etkinlik-kategori-etiket.diger{
    color:#4da564;
    background:#eaf8ed;
}

.etkinlik-kategori-etiket.atoly{
    color:#b16a31;
    background:#fff0e4;
}

.etkinlik-kategori-etiket.spor{
    color:#4ca267;
    background:#e9f7ee;
}

.etkinlik-kategori-etiket.sanat{
    color:#c65353;
    background:#ffeded;
}

.etkinlik-kategori-etiket.kultur{
    color:#4772b9;
    background:#edf3ff;
}


/* =========================================
   ANA BİLGİ
========================================= */

.etkinlik-ana-bilgi{
    min-width:0;
}

.etkinlik-ana-bilgi h3{
    margin: 0 0 5px;
    font-size: 14px;
    font-weight: 700;
    color: #222;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.etkinlik-isletme{
	display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 500;
    color: #f63b54;
}

.etkinlik-isletme i{
    color:#f63b54;
    font-size:14px;
}

.etkinlik-ana-bilgi p{
    margin:0;

    color:#666;

    font-size:13px;
    line-height:1.45;

    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;

    overflow:hidden;
}


/* =========================================
   ETKİNLİK DETAY
========================================= */

.etkinlik-detay{
    display: flex;
    flex-direction: column;
    gap: 7px;
    font-size: 13px;
    color: #666;
}

.etkinlik-detay div{
    display:flex;
    align-items:center;

    gap:7px;

    white-space:nowrap;
}

.etkinlik-detay i{
	width: 15px;
    text-align: center;
    color: #f63b54;
    font-size: 14px;
}


/* =========================================
   AKSİYON
========================================= */

.etkinlik-aksiyon{
    display:flex;

    align-items:center;
    justify-content:flex-end;

    gap:8px;
}

.etkinlik-detay-btn{
        height: 34px;
    padding: 0 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f63b54;
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 500;
    font-size: 13px;
    white-space: nowrap;
    transition: .2s;
}

.etkinlik-detay-btn:hover{
    background:#b91f25;
	color:#fff;
}
.etkinlik-detay-btn:visited{
    color:#fff;
}.etkinlik-detay-btn:active{
    color:#fff;
}


.etkinlik-favori{
       width: 32px;
    height: 34px;
    border: 1px solid #e4e4e4;
    background: #fff;
    border-radius: 5px;
    color: #666;
    cursor: pointer;
    padding: 0 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .2s;
}

.etkinlik-favori:hover{
    color:#f63b54;
    border-color:#f63b54;
}


/* =========================================
   SAYFALAMA
========================================= */

.etkinlik-sayfalama{
    display:flex;

    align-items:center;
    justify-content:center;

    gap:5px;

    margin-top:15px;
}

.etkinlik-sayfalama a{
        min-width: 36px;
    height: 36px;
    border: 1px solid #e5e5e5;
    background: #fff;
    border-radius: 6px;
    color: #666;
    font-size: 13px;
    cursor: pointer;
    font-weight: 600;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.etkinlik-sayfalama a:hover{
    border-color:#f63b54;
    color:#f63b54;
}

.etkinlik-sayfalama a.active{
    background:#f63b54;
    border-color:#f63b54;
    color:#fff;
}

.etkinlik-sayfalama span{
    color:#888;
    font-size:11px;

    padding:0 3px;
}


/* =========================================
   TABLET
========================================= */

@media(max-width:1050px){

    .etkinlikler-page{
        padding:0 15px;
    }

    .etkinlik-filtre-alani{
        grid-template-columns:1fr 1fr 1fr;
    }

    .etkinlik-aramasi{
        grid-column:span 3;
    }

    .etkinlik-satir{
        grid-template-columns:120px 1fr 180px 100px;
        gap:12px;
    }

    .etkinlik-detay-btn{
        padding:0 9px;
    }

}


/* =========================================
   MOBİL
========================================= */

@media(max-width:750px){

    .etkinlikler-page{
        padding:0 10px;
        margin-top:15px;
    }

    .etkinlik-filtre-alani{
        grid-template-columns:1fr 1fr;
    }

    .etkinlik-aramasi{
        grid-column:span 2;
    }

    .etkinlik-filtrele,
    .etkinlik-temizle{
        width:100%;
    }


    .etkinlik-sonuc-bar{
        flex-direction:column;
        align-items:stretch;

        gap:10px;

        padding:10px 0;
    }

    .etkinlik-sag-aksiyon{
        justify-content:space-between;
    }


    .etkinlik-satir{
        grid-template-columns:100px 1fr;

        gap:12px;

        padding:10px;
    }

    .etkinlik-gorsel{
        height:80px;
        grid-row:span 2;
    }

    .etkinlik-ana-bilgi{
        align-self:center;
    }

    .etkinlik-detay{
        grid-column:2;
        padding-top:5px;
    }

    .etkinlik-aksiyon{
        grid-column:1 / -1;

        justify-content:flex-end;

        border-top:1px solid #eee;

        padding-top:9px;
    }

}


/* =========================================
   KÜÇÜK TELEFON
========================================= */

@media(max-width:500px){

    .etkinlik-filtre-alani{
        grid-template-columns:1fr;
    }

    .etkinlik-aramasi{
        grid-column:auto;
    }

    .etkinlik-kategoriler{
        margin-left:-10px;
        margin-right:-10px;
        padding-left:10px;
        padding-right:10px;
    }

    .etkinlik-siralama{
        flex:1;
        min-width:0;
    }

    .etkinlik-satir{
        grid-template-columns:90px 1fr;
    }

    .etkinlik-gorsel{
        height:75px;
    }

    .etkinlik-ana-bilgi h3{
        font-size:14px;
    }

    .etkinlik-ana-bilgi p{
        font-size:13px;
    }

    .etkinlik-detay{
        font-size:13px;
    }

    .etkinlik-sayfalama button{
        width:28px;
        height:28px;
    }
	.kategori-bilgi { width: 90%; padding: 0% 1%; margin-bottom: 0px; }
	.kategori-container { margin: 30px auto; }
	.kategori-top { min-height: 160px;
	
	}
}