/*
 * Tema üstü özel stiller.
 *
 * style-8.css derlenmiş (purge edilmiş) bir Tailwind çıktısıdır ve kaynak projesi
 * repoda yoktur; içinde bulunmayan bir Tailwind sınıfı yazılamaz. Derlenmiş çıktıda
 * karşılığı olmayan her stil bu dosyaya eklenir. style-8.css'ten sonra yüklenir.
 */

/* --------------------------------------------------------------------------
 * Pinterest ikonu
 * iconfont'ta pinterest glifi yok. Font yeniden üretilemediği için ikon,
 * maske olarak gömülü SVG ile çiziliyor; boyutu font-size'dan, rengi
 * currentColor'dan aldığı için diğer .icon-* sınıflarıyla aynı davranır.
 * Glif: Simple Icons (CC0 1.0).
 * ----------------------------------------------------------------------- */
.icon-pinterest {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: var(--icon-pinterest) center / contain no-repeat;
    mask: var(--icon-pinterest) center / contain no-repeat;
}

:root {
    --icon-pinterest: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C5.373 0 0 5.372 0 12c0 5.084 3.163 9.426 7.627 11.174-.105-.949-.2-2.405.042-3.441.218-.937 1.407-5.965 1.407-5.965s-.359-.719-.359-1.782c0-1.668.967-2.914 2.171-2.914 1.023 0 1.518.769 1.518 1.69 0 1.029-.655 2.568-.994 3.995-.283 1.194.599 2.169 1.777 2.169 2.133 0 3.772-2.249 3.772-5.495 0-2.873-2.064-4.882-5.012-4.882-3.414 0-5.418 2.561-5.418 5.207 0 1.031.397 2.138.893 2.738a.36.36 0 0 1 .083.345l-.333 1.36c-.053.22-.174.267-.402.161-1.499-.698-2.436-2.889-2.436-4.649 0-3.785 2.75-7.262 7.929-7.262 4.163 0 7.398 2.967 7.398 6.931 0 4.136-2.607 7.464-6.227 7.464-1.216 0-2.359-.631-2.75-1.378l-.748 2.853c-.271 1.043-1.002 2.35-1.492 3.146C9.57 23.812 10.763 24 12 24c6.627 0 12-5.373 12-12S18.627 0 12 0z'/%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
 * Browse by City
 * Derlenmis Tailwind ciktisinda grid-cols-6 bulunmadigi icin bolumun sutun
 * duzeni burada tanimlanir. Referans tasarim genis ekranda 6 sutundur.
 * ----------------------------------------------------------------------- */
.browse-by-city {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    column-gap: 2rem;
    row-gap: 2.5rem;
}

@media (max-width: 1279px) {
    .browse-by-city { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1023px) {
    .browse-by-city { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .browse-by-city { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 479px) {
    .browse-by-city { grid-template-columns: minmax(0, 1fr); }
}

.city-text {
    background-color: #fff;
    border: 1px solid rgb(229, 231, 235);
    border-radius: 18px;
    padding: clamp(20px, 3vw, 40px);
}

.city-text__content {
    max-height: 360px;
    overflow-y: auto;
    padding-right: 16px;
    color: rgb(93, 93, 93);
    font-size: 16px;
    line-height: 1.66;
    scrollbar-width: thin;
    scrollbar-color: rgb(75, 50, 146) rgb(241, 243, 245);
}

.city-text__content::-webkit-scrollbar {
    width: 6px;
}

.city-text__content::-webkit-scrollbar-track {
    background: rgb(241, 243, 245);
    border-radius: 9999px;
}

.city-text__content::-webkit-scrollbar-thumb {
    background: rgb(75, 50, 146);
    border-radius: 9999px;
}

.city-text__content > * + * {
    margin-top: 1em;
}

.city-text__content h1,
.city-text__content h2,
.city-text__content h3,
.city-text__content h4,
.city-text__content h5,
.city-text__content h6 {
    color: rgb(6, 3, 15);
    font-weight: 500;
    line-height: 1.3;
}

.city-text__content * + h1,
.city-text__content * + h2,
.city-text__content * + h3,
.city-text__content * + h4,
.city-text__content * + h5,
.city-text__content * + h6 {
    margin-top: 1.5em;
}

.city-text__content h1 { font-size: clamp(24px, 2.4vw, 32px); }
.city-text__content h2 { font-size: clamp(22px, 2vw, 28px); }
.city-text__content h3 { font-size: clamp(20px, 1.6vw, 22px); }
.city-text__content h4,
.city-text__content h5,
.city-text__content h6 { font-size: 18px; }

.city-text__content ul,
.city-text__content ol {
    padding-left: 1.25em;
}

.city-text__content ul { list-style: disc; }
.city-text__content ol { list-style: decimal; }

.city-text__content li + li {
    margin-top: 0.4em;
}

.city-text__content a {
    color: rgb(75, 50, 146);
    text-decoration: underline;
}

.city-text__content strong,
.city-text__content b {
    color: rgb(6, 3, 15);
    font-weight: 600;
}

@media (max-width: 767px) {
    .city-text__content {
        max-height: 300px;
        font-size: 15px;
    }
}