@import url('https://fonts.cdnfonts.com/css/galano-grotesque-alt');

@font-face {
    font-family: 'RegularAlt';
    src: url('../../assets/public/fonts/GalanoGrotesqueAltRegular.otf') format('opentype');
    font-weight: 400;
}

@font-face {
    font-family: 'TKYF';
    src: url('../../assets/public/fonts/TKYF.otf') format('opentype');
    font-weight: 400;
}

@font-face {
    font-family: 'Galano600';
    src: url('../../assets/public/fonts/GalanoGrotesqueSemiBold.otf') format('opentype');
    font-weight: 600;
}

@font-face {
    font-family: 'Galano600Alt';
    src: url('../../assets/public/fonts/GalanoGrotesqueAltSemiBold.otf') format('opentype');
    font-weight: 600;
}

@font-face {
    font-family: 'Galano700Alt';
    src: url('../../assets/public/fonts/GalanoGrotesqueAltBold.otf') format('opentype');
    font-weight: 700;
}

@font-face {
    font-family: 'Galano500Alt';
    src: url('../../assets/public/fonts/GalanoGrotesqueAltMedium.otf') format('opentype');
    font-weight: 500;
}

@font-face {
    font-family: 'Galano850Alt';
    src: url('../../assets/public/fonts/GalanoGrotesqueAltExtraBold.otf') format('opentype');
    font-weight: 850;
}


:root {
    --main: #362E60;
    --pink: #ED3C6B;
    --RegularAlt: "RegularAlt";
    --title: "Galano700Alt";
    --Galano600: "Galano600";
    --Galano500: "Galano500Alt";
    --Galano850: "Galano850Alt";
    --Galano600Alt: "Galano600Alt";

    --shadow: 0 0 1.5px .5px #362e6011;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html,
body {
    overflow-x: hidden;
}


body {
    font-family: 'Galano Grotesque Alt' !important;
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: hidden;
    background-color: #fff;
    position: relative;
}

@media (min-width: 1400px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1070px;
    }

    .about-cont.container,
    .festival-cont.container {
        max-width: 1235px;
    }

    .container-fluid {
        padding: 0 3.5rem;
    }

    .container-fluid.ekstra-p {
        padding: 0 8rem;
    }

    .container-fluid.ekstra-p-two {
        padding: 0 12rem;
    }

    .container.xl-cont {
        max-width: 1200px;
    }
}

a {
    text-decoration: none;
}

ul {
    margin-bottom: 0;
    padding-left: 0;
}

.logo {
    /*width: 6.54788rem;*/
    width:12rem !important;
}

.logo2 {
    width: 5rem;
    margin-left: 1.7rem;
}

.menu-area {
    display: flex;
    padding: 2.5rem 4rem;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto;
}

.menu-item {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 0.75rem;
    padding: 1rem 1rem;
    background-color: #fff;
    box-shadow: var(--shadow);
}

.menu-item.footer {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 0.75rem;
    padding: 1rem 1rem;
    background-color: #fff;
    box-shadow: var(--shadow);
    width: 100%;
    margin: 1rem auto;
    margin-top: 2rem;
}

.menu-item ul {
    display: flex;
    margin-bottom: 0;
    padding-left: 0;
}

.menu-item ul li {
    margin: 0 .7rem;
    color: var(--pink);
    list-style: none;
}

.menu-item ul li a {
    color: var(--main);
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 600;
}


.menu-item ul li:first-child {
    list-style: none;
}

.menu-item ul li::marker {
    font-size: .5rem;
    display: flex;
    align-items: center;
    justify-content: space-between !important;
}

.menu-item ul li {
    list-style: none;
    position: relative;
    padding-left: 1.8rem;
}

.menu-item ul li:first-child {
    list-style: none;
    position: relative;
    padding-left: 0;
}

.menu-item ul li::before {
    content: "\2022";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: .7rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.menu-item ul li:first-child:before {
    display: none;
}

.search-lang {
    display: flex;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow);
}

.lang-div ul li {
    position: relative;
    display: inline-block;
    margin: 0 .4rem;
    color: var(--pink);
    list-style: none;
    padding-left: .8rem;
}

.event-search {
    display: flex;
    align-items: center;
}

.event-search a {
    color: var(--pink);
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 600;
    padding-left: .5rem;
    margin-right: 2rem;
}

.lang-div ul li::before {
    content: "\2022";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: .5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.lang-div a {
    color: #C3C0CF;
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 600;
}

.lang-div a.active {
    color: var(--main);
}

.bg-page {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
    width: 100%;
    height: 75rem;
    opacity: .9;
    background-image: url(../img/bg/BG-Desktop.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-clip: border-box;
}

.enter-section {
    background-image: url(../img/bg/Noise.png);
    background-position: top center;
    background-size: auto;
    background-repeat: no-repeat;
    background-clip: border-box;
    text-align: center;
    margin-top: 3rem;
}

.enter-section h1 {
    color: var(--pink);
    font-family: "Galano Grotesque Alt";
    font-size: 6.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 6.875rem;
}

.enter-section .enter-desc {
    width: 73%;
    display: flex;
    justify-content: center;
    margin: .5rem auto;
}

.enter-section .enter-desc p {
    color: #595666;
    font-family: "Galano Grotesque Alt";
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
}

.cards-flex-city {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
}

.card-col {
    flex: 0 0 calc(20% - 10px);
    margin: 0 .1rem;
    margin-bottom: 20px;

}


.citys-area .card {
    position: relative;
    width: 11.375rem;
    height: 6.25rem;
    border-radius: 1rem;
    border: 1px solid var(--grey-400, #E8E8E8);
    box-shadow: 0 4px 5px -1px rgba(0, 0, 0, 0.07), 0 1px 1px -2px rgba(0, 0, 0, 0.03);
    overflow: hidden;
    transition: all .3s linear;
}

.ribbon svg {
    position: absolute;
    top: -.3rem;
    right: -.8rem;
    transform: rotate(-16.135deg);
    width: 4.81113rem;
    height: 4.81113rem;
    transition: all .35s linear;
}

.card:hover .ribbon svg {
    width: 400%;
    height: 500%;
    top: -4rem;
    right: -14rem;
    transform: rotateZ(30deg);
    border-radius: 0;
}

.day-absolute {
    width: 100%;
    position: absolute;
    right: .7rem;
    top: .7rem;
    text-align: end;
}

.day-absolute p {
    line-height: .75rem;
    font-size: 0.75rem;
    color: #fff;
    font-family: "Galano Grotesque Alt";
    font-style: normal;
    font-weight: 500;
}

.day-absolute p span {
    font-family: "Galano Grotesque Alt";
    font-style: normal;
    font-weight: 850;
}

.card-content {
    z-index: 2;
    text-align: start;
    position: absolute;
    bottom: .9rem;
    left: 1rem;
}

.card-content h3 {
    color: var(--main);
    font-family: "Galano Grotesque Alt";
    font-size: 0.9375rem;
    font-style: normal;
    font-weight: 600;
    text-transform: uppercase;
    transition: all .3s linear;
}

.card-content p {
    margin-bottom: 0;
    color: #7F7B93;
    font-family: "Galano Grotesque Alt";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1rem;
    transition: all .3s linear;
}

.citys-area .card:hover .card-content h3,
.citys-area .card:hover .card-content p {
    color: #fff !important;
}

.citys-area {
    position: relative;
    margin-top: 2.5rem;
}

.video-area {
    border-radius: 1rem;
    margin-top: 3.5rem;
}

.video-area video {
    width: 100%;
    height: 36rem;
    border-radius: 1rem;
    object-fit: cover;
    cursor: pointer;
}

.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content {
    background: #fff;
    padding: 1rem;
    border-radius: 1rem;
    max-width: 90%;
    max-height: 90%;
    position: relative;
}

.modal-content video {
    width: 100%;
    height: 40rem;
    border-radius: 1rem;
}

#closeModal {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    background: transparent;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #333;
}

.card-festival-info {
    border-radius: 1rem;
    background: #FFF9F7;
    padding: 5rem 2.5rem;
    width: 17.5625rem;
    height: 20.1875rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.card-festival-info h3 {
    color: var(--pink);
    font-family: "Galano Grotesque Alt";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.card-festival-info h6 {
    color: var(--main);
    font-family: "Galano Grotesque Alt";
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}


/* Splide genişliği ve yerleşimi */
#fest-splide {
    max-width: 100%;
    margin: 0 auto;
    position: relative;
}

.card-festival {
    width: 21.5625rem;
    height: 20.0625rem;
    border-radius: 1rem;
    background: var(--main);
    position: relative;
    background-image: url(../img/card-bg.png);
    background-position: top left;
    background-size: auto;
    background-repeat: no-repeat;
    background-clip: border-box;
    overflow: hidden;
}

.card-festival img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6rem;
    transition: all .3s linear;
}

.card-festival:hover img {
    width: 8.3rem;
    filter: brightness(0) invert(1);
}

.card-festival .degrade {
    background: linear-gradient(-45deg, #ED185B 1%, transparent 100%);
    z-index: 1;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: all .3s ease;
}

.card-festival:hover .degrade {
    opacity: 1;
}


.card-festival h3 {
    color: #FFF9F7;
    font-family: "Galano Grotesque Alt";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    position: absolute;
    bottom: 1rem;
    left: 2rem;
}

/* Progress bar container */
.custom-progress-bar {
    position: relative;
    margin-top: 2rem;
    margin-bottom: 10rem;
    padding: 0 .5rem;
    width: 93%;
    height: 0.5625rem;
    background: rgba(54, 46, 96, 0.08);
    /* Gri bir arkaplan */
    border-radius: 10rem;
    overflow: hidden;
    display: flex;
    align-items: center;
}

/* İçini dolduran kısım */
.custom-progress-fill {
    background-color: var(--main);
    width: 100%;
    height: 0.1875rem;
    border-radius: 10rem;
    transition: width 0.3s ease;
}

.festival-slider-area {
    margin-top: 5rem;
    height: 25rem;
}

.absolute-bg {
    position: absolute;
    top: 31rem;
    left: -1rem;
    z-index: -10;
}

.relative-bar {
    position: relative;
}

.festival-slider-area .splide__arrow {
    opacity: 1;
    font-size: 1.6rem;
    background: none;
}

.festival-slider-area .splide__arrow i {
    color: var(--pink);
}

.festival-slider-area .splide__arrow[disabled] i,
.festival-slider-area .splide__arrow.is-disabled i {
    color: #292d3223;
}


.festival-slider-area .splide__arrow--prev {
    right: 2.5rem;
    left: auto;
}

.festival-slider-area .splide__arrow--next {
    right: 0;
    left: auto;
}

footer {
    width: 100%;
    background-color: var(--main);
    padding: .1rem 0;
    padding-top: 14rem;
    margin-top: 20rem;
    position: relative;
}

.social-footer ul {
    display: flex;
    justify-content: center;
    align-items: center;
}

.social-footer ul li {
    display: inline-block;
    margin: 1rem .5rem;
    margin-top: 0;
}

.social-footer ul li a {
    font-size: 1.2rem;
    color: #fff;
    font-weight: 100;
}

footer .absolute-news {
    position: absolute;
    background-color: var(--main);
    top: -10rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    max-width: 65rem;
    width: 100%;
    flex-direction: column;
    gap: 1.5rem;
    border-radius: 1.25rem;
    padding: 3.125rem 15.25rem 3.125rem 15.25rem;
    align-items: center;
    border-bottom: 1.5px solid #ce26f03f;
    border-left: 1.5px solid #ed185b52;
    border-right: 1.5px solid #ed185b52;
}

footer .absolute-news .content {
    text-align: center;
}

footer .absolute-news .content h3 {
    color: #FFF;
    text-align: center;
    font-family: "Galano Grotesque Alt";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 600;
    line-height: 2.875rem;
}

footer .absolute-news .content p {
    color: rgba(255, 255, 255, 0.78);
    text-align: center;
    font-family: "Galano Grotesque Alt";
    font-size: 1rem;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}

footer .form-control {
    box-shadow: none !important;
    border: 1px solid var(--main) !important;
    padding: 1rem;
    border-radius: 0.75rem;
    outline: none !important;
}

footer form {
    position: relative;
    margin-top: 2rem;
}

footer button {
    border-radius: .75rem;
    position: absolute;
    top: 50%;
    right: .6rem;
    transform: translateY(-50%);
    background: var(--pink);
    padding: .7rem 1.6875rem;
    border: 1px solid var(--pink);
    color: #FFF;
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    box-shadow: 0 -1px 1px 0 rgba(54, 46, 96, 0.04), 0px 0px 0px 1px rgba(54, 46, 96, 0.06), 0px 1px 1px -0.5px rgba(54, 46, 96, 0.08);
}

.kvkk-link ul {
    display: flex;
    justify-content: center;
    margin-bottom: 0;
    padding-left: 0;
}

.kvkk-link ul li {
    list-style: none;
    color: var(--main);
    position: relative;
    padding-left: 1.2rem;
    padding-right: 1rem;
}

.kvkk-link ul li:last-child {
    padding-right: 0rem;
}

.kvkk-link ul li a {
    color: var(--main);
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.kvkk-link ul li::before {
    content: "\2022";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.kvkk-link ul li:first-child {
    list-style: none !important;
    position: relative;
    padding-left: 0rem;
}

.kvkk-link ul li:first-child:before {
    display: none;
}

.copy-right p {
    text-align: end;
    margin-top: .5rem;
    color: var(--main);
    font-family: "Galano Grotesque";
    font-size: 0.8rem;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}

.footer-subs {
    background-color: #fff;
    padding: 2rem 0;
    padding-bottom: .5rem;
    margin-top: 3.5rem;
}

.flexed-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.footer-logo {
    width: 19.54788rem;
}

.basvuru-btn {
    background-color: var(--pink);
    color: #fff !important;
    border-radius: 0.375rem;
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 600;
    padding: .3rem 0.9375rem;
}

.flexed-about-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 3rem;
    margin-bottom: 5rem;
}

.left1 {
    width: 36.6875rem;
    height: auto;
    object-fit: contain;
}

.right1 {
    width: 50%;
    padding-left: 1.2rem;
}

.flexed-about-card p {
    color: #595666;
    font-family: "Galano Grotesque Alt";
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.about-area {
    margin-bottom: 30rem;
}

.about.absolute-bg {
    top: 25rem;
}

.citys-area.festival .card-col {
    flex: 0 0 calc(25% - 0px);
}

.citys-area.festival .card-col .card {
    width: 17.6875rem;
    height: 19.4375rem;
    border-radius: 1rem;
    background: radial-gradient(191.13% 165.94% at 172.25% -44.5%, rgba(85, 82, 163, 0.70) 0%, rgba(255, 255, 255, 0.35) 100%), #FFF;
    box-shadow: 0px 4px 5px -1px rgba(0, 0, 0, 0.07), 0px 1px 1px -2px rgba(0, 0, 0, 0.03);
}

.citys-area.festival .card-col .card .ribbon svg {
    left: 50%;
    transform: translateX(-50%);
    top: -1.8rem;
    width: 8.0625rem;
    height: 8.0625rem;
    transition: all .4s linear;
}

.citys-area.festival .card-col .card:hover .ribbon svg {
    width: 200%;
    height: 200%;
    top: -5rem;
}

.citys-area.festival .card-col .card .day-absolute {
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}

.citys-area.festival .card-content {
    text-align: center;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

.citys-area.festival .card-content h2 {
    font-family: "Galano Grotesque Alt";
    font-size: 1rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    transition: all .3s ease;
}

.citys-area.festival .card-content h3 {
    margin-top: 1.5rem;
    text-transform: lowercase !important;
}

.citys-area.festival .card-content h3::first-letter {
    text-transform: uppercase !important;
}


.citys-area.festival .card-content p {
    color: var(--main);
}

.span-timer h6 {
    border-radius: 0.5rem;
    background: rgba(120, 175, 99, 0.10);
    width: 9.3125rem;
    height: 1.9375rem;
    color: #78AF63;
    font-family: "Galano Grotesque Alt";
    font-size: 1rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    display: flex;
    justify-content: center;
    margin: 1.5rem auto;
    align-items: center;
    margin-bottom: 0;
    transition: all .3s ease;
}

.citys-area.festival .card:hover .card-content h2 {
    color: #fff !important;
    background: none;
    -webkit-text-fill-color: #fff;
    font-weight: 600;
}

.citys-area.festival .card:hover .span-timer h6 {
    color: #fff;
    background: rgba(255, 255, 255, 0.10);
}

.citys-area.festival .card-col {
    margin: 0;
    margin-bottom: 20px;
}

.flexed-filter {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.filter-drop {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dropdown.filt {
    margin-right: .55rem;
}

.dropdown.filt button {
    border: none;
    display: flex;
    min-width: 7.75rem;
    max-height: 59px;
    padding: 1.25rem;
    align-items: center;
    gap: 0.875rem;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.04), 0px 0px 0px 1px rgba(14, 63, 126, 0.06), 0px 1px 1px -0.5px rgba(42, 51, 70, 0.08);
    color: var(--main);
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.dropdown.filt .dropdown-toggle::after {
    display: none;
}

/* Checkbox'ın varsayılan stilini kaldırıyoruz */
#timer {
    text-align: center;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 1rem;
    height: 1rem;
    border-radius: 0.1875rem;
    border: 1px solid #dededef6;
    cursor: pointer;
    position: relative;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

/* Seçili değilken (default) */
#timer:not(:checked) {
    background-color: #fff;
}

/* Seçili olduğunda */
#timer:checked {
    background-color: #fff;
    border-color: var(--pink);
}

/* Seçili olduğunda check işaretini gösteriyoruz */
#timer:checked::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 5px;
    width: 4px;
    height: 9px;
    border: solid var(--pink);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.search-field {
    transition: transform 0.3s ease;
}

.search-field .form-control {
    width: 200px;
    transition: width 0.3s ease, transform 0.3s ease;
}

.search-field .form-control:focus {
    width: 250px;
}

.input-group-text {
    border: none;
    background: transparent;
}

.search-field {
    position: relative;
}

.search-field input {
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    line-height: -2rem;
}

.search-field input::placeholder {
    color: var(--main);
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.search-field input:focus {
    color: var(--pink);
    font-weight: 600;
}

.flatpickr-day {
    color: var(--main) !important;
    font-weight: 600 !important;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay,
.flatpickr-day:hover {
    background: var(--pink) !important;
    border-color: var(--pink) !important;
    color: #fff !important;
    border-radius: 100rem;
    box-shadow: none !important;
}

.flatpickr-day.inRange {
    box-shadow: none !important;
    border-radius: 100rem;
}

.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus,
.flatpickr-day.selected.startRange,
.flatpickr-day.startRange.startRange,
.flatpickr-day.endRange.startRange,
.flatpickr-day.selected.endRange,
.flatpickr-day.startRange.endRange,
.flatpickr-day.endRange.endRange {
    background: var(--pink) !important;
    border-color: var(--pink) !important;
    color: #fff !important;
    border-radius: .3rem;
    padding: 0 !important;
    box-shadow: none !important;
}

.flatpickr-calendar {
    padding: 1rem;
    width: 350px;
}

span.flatpickr-weekday {
    color: #7F7B93 !important;
}

.filter-area {
    margin-top: 2.5rem;
}

.filter-area .dropdown-menu {
    border: none;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.04), 0px 0px 0px 1px rgba(14, 63, 126, 0.06), 0px 1px 1px -0.5px rgba(42, 51, 70, 0.08);
    max-height: 300px;
    overflow-y: auto;
    margin-top: .5rem !important;
}

.opacity-drop {
    position: absolute !important;
    top: -3rem !important;
    left: -1rem !important;
    opacity: 0 !important;
}

.dropdown.filt img {
    transition: all .2s linear;
}

.dropdown.filt.active img {
    transform: rotateZ(-90deg);
    fill: var(--main);
}

.filters-row {
    flex-wrap: wrap;
}

.selected-filters {
    display: flex;
    gap: .8rem;
    margin-top: 1rem;
    white-space: nowrap;
    overflow-x: auto;
    padding-bottom: 0.5rem;
}

.badge-filter {
    display: inline-flex;
    align-items: center;
    background: #fff;
    border: 1px solid #292d3223;
    border-radius: 100rem;
    padding: .3rem 1rem;
    font-size: .85rem;
    color: var(--main);
    font-weight: 700;
    white-space: nowrap;
}

.badge-filter .remove-selection {
    cursor: pointer;
    font-size: 1rem;
    color: var(--pink);
    margin-left: .3rem;
}

.dropdown-item {
    font-weight: 600;
    font-size: .9rem;
    color: var(--main);
}

.absolute-bg.activity-bg {
    top: 12rem;
}

.card-activ {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: .6rem;
    box-shadow: var(--shadow);
    border-radius: .75rem;
    height: 100%;
    width: 100%;
    background-color: #fff;
}

.card-activ img {
    width: 15.75rem;
    height: 11.875rem;
    border-radius: 0.75rem;
    object-fit: cover;
}

.content-activ .span-tag {
    display: flex;
    align-items: center;
}

.content-activ {
    margin-left: 1rem;
    width: 16.4375rem;
}

.content-activ .span-tag .city {
    display: flex;
    height: 1.1875rem;
    padding: 0.625rem 0.5625rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    align-self: stretch;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
}

.content-activ .span-tag .fee {
    display: flex;
    height: 1.1875rem;
    padding: 0.625rem 0.5625rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
    border-radius: 0.5rem;
    border: 1px solid rgba(120, 175, 99, 0.10);
    background: rgba(120, 175, 99, 0.10);
    color: #78AF63;
    font-size: 0.75rem;
    font-weight: 600;
    margin-left: 1rem;
}

.content-activ .span-tag .fee.true {
    color: #5552A3;
    border: 1px solid rgba(85, 82, 163, 0.10);
    background: rgba(85, 82, 163, 0.10);
}

.content-activ .title h2 {
    color: var(--main);
    font-family: "Galano Grotesque Alt";
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: .8rem 0;
}

.content-activ .details {
    color: var(--main);
    font-family: "Galano Grotesque Alt";
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.content-activ .details img {
    width: 1rem;
    height: auto;
    border-radius: 0;
    margin-right: .2rem;
}

.content-activ .details div {
    margin: .5rem 0;
}

.activity-cards-area {
    margin-top: 1.5rem;
}

.enter-section.tekil {
    background-image: url(../img/bg/Noise.png);
    background-position: top center;
    background-size: auto;
    background-repeat: no-repeat;
    background-clip: border-box;
}

.enter-section.tekil h1 {
    font-size: 3rem;
    font-weight: 400;
    line-height: 2.5rem;
}

.enter-section.tekil h2 {
    font-size: 6.5rem;
    font-style: normal;
    font-weight: 400;
    line-height: 6.875rem;
    font-family: 'TKYF';
}

.absolute-symbol {
    position: absolute;
    top: 14rem;
    right: -5rem;
    z-index: -1;
    opacity: .1;
}

.absolute-symbol img {
    width: 19.49731rem;
    height: 16.79525rem;
    flex-shrink: 0;
}

.enter-date {
    border-radius: 0.5rem;
    width: fit-content;
    padding: 0 .6rem;
    height: 1.9375rem;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 1.5rem auto;
    white-space: nowrap;
    /* Satır kaymasını engeller */
}

.enter-date span {
    font-size: 1rem;
    font-weight: 600;
}

.filter-area.e-detail {
    margin-top: 9rem;
}

.detail-etkinlik {
    margin-top: 5rem;
}

.detail-etkinlik h1 {
    font-size: 4rem;
    font-weight: 700;
}

.card-etkdet {
    margin-top: 2.275rem;
    padding: 1.5rem 1.7rem;
    flex-shrink: 0;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.04), 0px 0px 0px 1px rgba(14, 63, 126, 0.06), 0px 1px 1px -0.5px rgba(42, 51, 70, 0.08);
}

.card-news {
    height: 100%;
    padding: 1.2rem;
    padding-bottom: .2rem;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.04), 0px 0px 0px 1px rgba(14, 63, 126, 0.06), 0px 1px 1px -0.5px rgba(42, 51, 70, 0.08);
}

.card-news img {
    width: 100%;
    height: 20rem;
    object-fit: cover;
    border-radius: .75rem;
}

.card-news .content-news {
    margin: 1rem 0;
}

.news-span {
    display: inline-flex;
    height: 1.1875rem;
    padding: 0.625rem 0.5625rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
    border-radius: 0.5rem;
    border: 1px solid rgba(54, 46, 96, 0.10);
    background: rgba(54, 46, 96, 0.10);
    color: var(--main);
    font-size: 0.75rem;
    font-weight: 600;
}

.card-news .content-news h2 {
    color: var(--pink);
    font-size: 1.125rem;
    font-weight: 700;
    margin-top: 1rem;
}

.card-news .content-news p {
    color: #595666;
    font-size: 0.875rem;
    font-weight: 400;
    width: 80%;
}

.line-news {
    width: 100%;
    background: #F6F6F6;
    height: 0.0625rem;
    margin: 1rem 0;
}

.btn-pink {
    background-color: var(--pink);
    border: 1px solid var(--pink);
    color: #fff;
    border-radius: 0.75rem;
    box-shadow: 0px -1px 1px 0px rgba(54, 46, 96, 0.04), 0px 0px 0px 1px rgba(54, 46, 96, 0.06), 0px 1px 1px -0.5px rgba(54, 46, 96, 0.08);
    color: #FFF;
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.5rem 1.25rem;
}

.btn-pink:hover {
    background-color: var(--main);
    border: 1px solid var(--main);
    color: #fff;
}

.btn-purple {
    background-color: var(--main);
    border: 1px solid var(--main);
    color: #fff;
    border-radius: 0.75rem;
    box-shadow: 0px -1px 1px 0px rgba(54, 46, 96, 0.04), 0px 0px 0px 1px rgba(54, 46, 96, 0.06), 0px 1px 1px -0.5px rgba(54, 46, 96, 0.08);
    color: #FFF;
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.5rem 1.25rem;
}

.btn-purple:hover {
    background-color: var(--pink);
    border: 1px solid var(--pink);
    color: #fff;
}

.news-area {
    margin-top: 5rem;
}

.bar-crumb {
    display: flex;
}

.bar-crumb a,
.bar-crumb i {
    margin-right: .4rem;
    color: var(--main);
    font-size: 1rem;
    font-weight: 600;
}

.bar-crumb p {
    color: var(--main);
    font-size: 1rem;
    font-weight: 400;
}

.news-detail .main-img {
    width: 100%;
    height: 100%;
    border-radius: .75rem;
    object-fit: cover;
}

.content-news-detail {
    margin-top: 1rem;
}

.bread-crumb {
    margin-top: 2.5rem;
}

.news-detail h2 {
    color: var(--pink);
    font-size: 2.875rem;
    font-weight: 700;
    line-height: 3.4375rem;
    margin-top: 1rem;
    margin-bottom: 1.2rem;
}

.news-detail p {
    color: #595666;
    font-size: 1.125rem;
    font-weight: 400;
    margin: 0;
}

.news-detail h3 {
    color: var(--pink);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 3.4375rem;
    margin-bottom: 0;
    margin-top: 1.2rem;
}

.contact-area {
    margin-top: 5rem;
}

.card-contact-flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

.card-contact-flex .address {
    display: flex;
    padding: 1.5rem;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow);
    margin: 0 .5rem;
}

.card-contact-flex .email {
    display: flex;
    padding: 1.5rem;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow);
    margin: 0 .5rem;
}

.card-contact-flex h6 {
    color: var(--main);
    font-size: 0.875rem;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 0;
}

.card-contact-flex a {
    color: #595666;
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.map-embed {
    margin-top: 2.5rem;
}

.detail-etkinlik .main-img {
    border-radius: 1rem;
    object-fit: cover;
    width: 100%;
    margin-bottom: 1.5rem;
}

.content-sub {
    margin-top: 1.5rem;
}

.content-manage h3 {
    color: var(--pink);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 3.4375rem;
    margin-bottom: 0;
}

.content-manage p {
    color: #595666;
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.content-sub h3 {
    color: var(--pink);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 3.4375rem;
    margin-bottom: 0;
}

.content-sub h2 {
    color: var(--main);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: normal;
    margin-bottom: 0;
    margin-top: 1.2rem;
}

.content-sub span {
    color: #595666;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: normal;
}

.content-sub .map-area {
    margin-top: 2rem;
}

.share-area {
    text-align: end;
    margin-top: 1.5rem;
}

.share-area .span-bg {
    display: inline-flex;
    height: 1.9375rem;
    padding: 0.625rem 0.5625rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
    border-radius: 0.5rem;
    background: rgba(89, 86, 165, 0.10);
}

.share-area span {
    font-size: 1rem;
    font-weight: 600;
    line-height: normal;
    background: linear-gradient(180deg, #8680BC 0%, #5552A3 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.share-area .share-social {
    margin-top: 1rem;
    margin-bottom: 1rem;
    display: flex;
    justify-content: flex-end;
}

.share-area .share-social img {
    width: 1rem;
    height: 1rem;
}

.share-area .share-social a {
    border-radius: 10rem;
    background: rgba(157, 157, 157, 0.04);
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 1rem;
}

.share-area .share-social a:last-child {
    background: rgba(238, 108, 77, 0.08);
}

.card-etkdet h6 {
    color: var(--main);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: normal;
}

.card-etkdet span {
    display: flex;
    width: 40%;
    height: 1.1875rem;
    padding: 0.625rem 0.5625rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
    border-radius: 0.5rem;
    border: 1px solid rgba(120, 175, 99, 0.10);
    background: rgba(120, 175, 99, 0.10);
    color: #78AF63;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: normal;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}

.card-etkdet h2 {
    color: var(--pink);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: normal;
    margin-bottom: .1rem;
}

.card-etkdet p {
    color: var(--main);
    font-size: 0.83rem;
    font-weight: 400;
    line-height: normal;
}

.flexed-btn {
    margin-top: 3rem;
}

.seans-div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.2rem;
}

.seans-div h3 {
    color: var(--pink);
    font-size: 1rem;
    font-weight: 500;
    line-height: normal;
}

.seans-div>div {
    display: inline-flex;
    padding: 0.9375rem 1.6875rem;
    align-items: flex-start;
    border-radius: 0.75rem;
    background: rgba(237, 60, 107, 0.10);
}

.seans-div h4 {
    color: var(--pink);
    text-align: center;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: normal;
    margin: 0;
}

.card-etkdet.seans {
    margin-top: 1.2rem;
}

.enter-section.flavor h1 {
    color: #ED3C6B;
    text-align: center;
    font-size: 5.375rem !important;
    font-style: normal;
    font-weight: 700;
    line-height: 5.375rem;
    width: 85%;
    display: flex;
    justify-content: center;
    margin: 1rem auto;
}

.flavor-cards-area .main-img {
    width: 100%;
    border-radius: 1rem;
}

.enter-section.flavor .enter-desc {
    width: 85%;
    margin: 1.2rem auto;
}

.cards-flex-city.flavor-flex {
    justify-content: flex-start;
}

.cards-flex-city.flavor-flex .card {
    width: 17.6875rem;
}

.flavor-flex .info-btn {
    margin-right: .5rem;
}

.flavor-flex .info-btn a {
    display: flex;
    padding: .45rem 0.625rem;
    justify-content: center;
    align-items: center;
    color: #FFF;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: normal;
    border-radius: 0.375rem 0.5rem 0.375rem 0.375rem;
}

.flavor-flex .card-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.flavor-flex .card-content p {
    color: #656271;
    font-size: 0.625rem;
    font-weight: 400;
    line-height: normal;
}

.flavor-flex .city-info {
    width: 50%;
}

.flavor-flex .card-content {
    padding: .5rem;
}

.flavor-flex .card {
    padding: 1.25rem;
    border-radius: 0.75rem;
}

.flavor-flex .card h3 {
    text-transform: capitalize;
}

.flavor-flex .card {
    transition: background-color 0.5s ease, background-image 0.5s ease, all 0.5s ease !important;
    background-color: #fff;
}

.flavor-flex .card:hover {
    background-image: var(--hover-bg) !important;
    background-color: transparent;
}

.flavor-flex .card:hover .info-btn a {
    background: #fff !important;
    color: var(--card-color) !important;
    transition: color 0.5s ease;
}


.flavor-flex .card-col {
    margin: 0;
    margin-bottom: 20px;
    width: 10.6875rem;
    margin-right: .61rem;
}

.flavor-flex .card-col:last-child {
    margin-right: 0 !important;
}

.citys-area.flavor-area {
    margin-top: 1rem;
}

.flavor-cards-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
    gap: 1.25rem;
}

.card-flavor {
    position: relative;
    flex: 0 0 17.75rem;
    display: flex;
    flex-direction: column;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow);
    padding: 1.25rem;
}


.top-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.top-card h3 {
    width: 70%;
    color: var(--main);
    font-size: 1.125rem;
    font-weight: 700;
}

.top-card img {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 100rem;
    object-fit: contain;
}

.line-flavor-card {
    height: 1px;
    background: #F6F6F6;
    margin: .7rem 0;
}

.detail-flavor h6 {
    color: #595666;
    font-size: 0.75rem;
    font-weight: 700;
}

.detail-flavor p {
    color: #595666;
    font-size: 0.75rem;
    font-weight: 400;
}

.btn-map {
    display: inline-flex;
    height: 1.5625rem;
    padding: 0.9375rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
    border-radius: 0.375rem;
    background: rgba(237, 60, 107, 0.10);
    color: var(--pink);
    font-style: normal;
    font-weight: 500;
    font-size: .75rem;
    position: absolute;
    bottom: 1rem;
}


.page-item {
    margin: 0 0.31rem;
}

.page-item .page-link {
    color: var(--main);
    font-size: 0.875rem;
    font-weight: 400;
    display: flex;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0.4375rem 0rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    border: none;
    border-radius: 0.375rem;
    background: #FFF;
    box-shadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.04), 0px 0px 0px 1px rgba(14, 63, 126, 0.06), 0px 1px 1px -0.5px rgba(42, 51, 70, 0.08);
}

.page-item .page-link.active {
    color: var(--pink);
    font-weight: 700 !important;
}

.center-pagination {
    display: flex;
    justify-content: center;
    margin: 4rem auto;
}

.sponsor-area {
    margin-top: 7rem;
    text-align: center;
}

.sponsor-area h2 {
    color: #ED3C6B;
    text-align: center;
    font-style: normal;
    font-weight: 700;
    line-height: 5.375rem;
}

.sponsor-area img {
    object-fit: contain;
    width: 8.4375rem;
    height: 3rem;
    flex-shrink: 0;
    margin: 0rem 1.75rem;
}

.brands-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.brands-card {
    flex: 0 0 calc(16, 6666% - 0px);
}

.event-search input {
    border: none !important;
    box-shadow: none !important;
    margin-left: .5rem;
    outline: none !important;
    color: var(--pink);
    font-weight: 600;
    font-size: .875rem;
    width: 9rem;
    transition: all .25s linear;
}

.event-search input::placeholder {
    color: var(--pink);
    font-size: 0.875rem;
    font-weight: 600;
}

.event-search input:focus {
    border: none !important;
    box-shadow: none !important;
    margin-left: .5rem;
    outline: none !important;
    width: 11rem;
}

.mobile-menu button {
    background: none;
    border: none;
    outline: 0;
}

.mobile-menu button img {
    width: 1.6rem;
}


/* Overlay başlangıçta tamamen solda, görünmez */
.mobile-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: translateX(-100%);
    background-image: url(../img/bg/mobile-bg.png);
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
    background-clip: border-box;
    transition: transform 0.3s ease;
    z-index: 9999;
    overflow-y: auto;
}

/* Açık hâli: soldan 0’a kaydır */
.mobile-overlay.open {
    transform: translateX(0);
}

/* Kapatma butonu */
.close-btn {
    font-size: 2rem;
    background: none;
    border: none;
    cursor: pointer;
}

/* Menü içi listeleme */
.overlay-nav {
    margin-top: 1.5rem;
    text-align: start;
    padding: 0 1.5rem;
    overflow-y: auto;
}

.overlay-nav ul {
    list-style: none;
    padding: 0 1.2rem;
    margin-top: 1.5rem;
}

.overlay-nav li+li {
    margin-top: .8rem;
}

.overlay-nav li {
    border-bottom: 1px solid rgba(54, 46, 96, 0.04);
    padding-bottom: .8rem;
}

.overlay-nav a {
    color: #362E60;
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

@media (min-width: 992px) {

    .mobile-menu,
    .mobile-overlay,
    .mobile-kvkk,
    .mobile-filter {
        display: none !important;
    }
}

@media (max-width: 992px) {
    .search-lang.mobile {
        display: block;
        width: 100%;
        display: flex;
        justify-content: flex-start;
        margin: 0 auto;
        text-align: start;
    }

    .search-lang.mobile .event-search input,
    .search-lang.mobile .event-search input::placeholder {
        color: var(--main);
    }

    header {
        margin-top: 1.5rem;
    }

    .overlay-nav .lang-div ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0;
    }

    .overlay-nav .lang-div ul li {
        margin: 0rem !important;
        padding: 0;
    }

    .overlay-nav .lang-div ul li .active {
        color: var(--pink);
    }

    .overlay-nav .lang-div ul li a {
        display: flex;
        width: 9.5rem;
        height: 3.5rem;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        border-radius: 0.75rem;
        background: #FFF;
        box-shadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.04), 0px 0px 0px 1px rgba(14, 63, 126, 0.06), 0px 1px 1px -0.5px rgba(42, 51, 70, 0.08);
    }

    .lang-div ul li::before {
        display: none;
    }

    .bg-page {
        background-image: url(../img/bg/mobile-bg.png);
    }
}

.mobile-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    margin-top: 1.5rem;
}

.mobile-kvkk {
    text-align: center;
    margin-top: 2rem;
}

.mobile-kvkk ul li a {
    color: #FFF;
    font-family: "Galano Grotesque";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.mobile-kvkk ul li {
    list-style: none;
}

.mobile-kvkk ul li+li {
    margin-top: .5rem;
}

.mobile-kvkk .copy-mobile {
    color: #FFF;
    font-family: "Galano Grotesque";
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    opacity: 0.6;
    margin-top: 2.5rem;
    padding: 0rem 2.5rem;
}

.mobile-filter {
    display: flex;
    align-items: center;
    margin: 0 auto;
    margin-left: 0;
    justify-content: space-between;
    width: 100%;
}

.search-mobile {
    display: flex;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow);
    height: 3.5rem;
    align-items: center;
    flex-shrink: 0;
    margin-right: 1rem;
    width: 13.625rem;

}

.mobile-filter input {
    border: none !important;
    padding: 0 .5rem;
    box-shadow: none !important;
}

.mobile-filter input::placeholder {
    color: var(--main);
    font-size: 0.875rem;
    font-weight: 500;
    line-height: normal;
}

.mobile-filter img {
    padding: 0 1rem;
    padding-right: 0;
}

.btn-light {
    display: inline-flex;
    height: 3.5rem;
    padding: 1.3125rem 1.25rem 1.1875rem 1.25rem;
    justify-content: center;
    align-items: center;
    gap: 0.3125rem;
    flex-shrink: 0;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow);
}

.btn-light:hover,
.btn-light::selection,
.btn-light:first-child:active {
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow);
}

.mobile-filter .dropdown-toggle::after {
    display: none;
}

.filter-mobile-img {
    padding: 0 .3rem !important;
}

.other-news {
    margin-top: 5rem;
}

.other-news .on-text {
    color: var(--main);
    font-size: 2.875rem;
    font-style: normal;
    font-weight: 700;
    line-height: 3.4375rem;
    margin-bottom: 1.5rem;
}

.mobile-content {
    order: -2;
    display: none;
}

/* Modal header’ın kaynak back-arrow’u ve başlığı yanyana */
.filter-area .modal-header .btn-link {
    color: #333;
}

/* list-group üzerine hover efekti */
.list-group-flush>.list-group-item {
    display: inline-flex;
    height: 3.5rem;
    padding: 0rem 1rem;
    margin-bottom: 1rem;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow)
}

.filter-area .list-group-flush>.list-group-item span {
    color: var(--main);
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.modal-backdrop {
    z-index: -2;
}

.filter-area .modal-content {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    overflow-x: hidden;
    background-image: url(../img/bg/mobile-bg.png);
    z-index: -5;
}

.filter-area .modal-body {
    padding: 0;
    overflow-x: hidden;
}

.filter-area .flatpickr-calendar {
    width: 98%;
}

/* Listeler hover efekti */
.list-group-item-action:hover {
    background: #f8f9fa;
}

/* Başlık altı pill’lere biraz daha dar görünüm */
.filter-area .modal-header .btn-light {
    display: inline-flex;
    height: 3.5rem;
    padding: 0rem 1.25rem;
    justify-content: center;
    align-items: center;
    gap: 0.3125rem;
    flex-shrink: 0;
    border-radius: 0.75rem !important;
    background: #FFF;
    box-shadow: var(--shadow);
    color: var(--main);
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.filter-area .modal-header {
    padding: 0;
}

span.flatpickr-weekday {
    color: #9C9D9F !important;
    text-align: center;
    font-size: 0.8125rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.filter-area .modal-content {
    background-image: url('../img/bg/mobile-bg.png');
    background-size: cover;
}

.header-panel .panel-title {
    font-size: 1rem;
    font-weight: 500;
    color: #333;
}

.card {
    border-radius: 0.75rem;
    box-shadow: var(--shadow);
}

.card h6 {
    font-weight: 600;
}

.list-group-item {
    border: none;
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.filter-panel {
    background-color: #fff;
    padding: 1rem 2rem;
    border-radius: .75rem;
}

.filter-panel .li-div {
    border-top: 1px solid #F6F6F6;
    padding: 1rem 0;
}

.filter-panel .li-div a {
    color: var(--main);
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.filter-panel h6 {
    color: var(--pink);
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.filter-area .filter-date {
    display: grid;
    justify-content: center;
}

@media(min-width:644px) and (max-width:767.98px) {
    .flavor-flex .card-content {
        position: absolute !important;
        display: flex !important;
    }

    .cards-flex-city.flavor-flex .card {
        height: 6.25rem !important;
    }
}

.flexed-filter .input-group {
    border: none;
    min-width: 7.75rem;
    max-height: 59px;
    padding: 1.25rem;
    border-radius: 0.75rem;
    background: #FFF;
    box-shadow: var(--shadow);
    color: var(--main);
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.flexed-filter .input-group {
    display: flex;
    align-items: center;
    justify-content: start;
}

.flexed-filter .input-group-text {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    /* istersen daralt */
    margin-right: 0.5rem;
    background: transparent;
    border: none;
}

.flexed-filter .form-control {
    height: auto;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    line-height: 1.2;
}