/* Turkuaz Transfer — theme.css üzerine proje özelinde küçük düzeltmeler */

/* Ana sayfa/Hakkımızda'daki özellik şeridi artık panelden yönetiliyor ve
   admin istediği ikonu Font Awesome'dan seçebiliyor (temanın kendi
   "themeenergy" fontu sadece kullanılan birkaç ikonla sınırlandırıldığı
   için oradan serbestçe seçim yapılamıyor — bkz. icons.css). .circle .icon
   36px'ti (style.css), aynı görünüm için Font Awesome ikonuna da uygulanıyor. */
.circle .fa {
    font-size: 36px;
    color: #34394A;
}

/* style.css'teki .keyvisual img { position:absolute; top:-20%; left:0; }
   kuralı temanın kendi demo görseli tam konteyner boyutunda (1920x600 vb.)
   olduğu için genişlik vermeden işliyordu — panelden yüklenen, temanın
   demo görseliyle aynı orana/boyuta sahip olması beklenemeyecek gerçek
   görseller bu yüzden küçük/banal kalıyordu. object-fit:cover ile boyuttan
   bağımsız, her zaman konteyneri dolduran bir davranışa geçiliyor. */
.keyvisual img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Lokasyon içerik sayfasında banner (.keyvisual) ile altındaki metin
   arasında hiç boşluk yoktu, başlık banner'a yapışık duruyordu. */
.keyvisual + .wrap {
    padding-top: 40px;
}

/* Aynı sorun Hizmetler sayfasındaki araç görselinde de var: style.css'teki
   .three-fourth .single .entry-featured img kuralı genişlik vermeden
   position:absolute kullanıyor. Seçici burada BİREBİR aynı tutulmalı —
   daha düşük özgüllükte bir seçici (ör. sadece .single .entry-featured img)
   yazılırsa style.css'teki top:-30% kısmı yine kazanıp görseli konteynerin
   135px üstüne kaydırıyordu (üç sınıflı seçici iki sınıflıdan daha güçlü). */
.three-fourth .single .entry-featured img,
.one-half .single .entry-featured img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.logo a.text-logo {
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #191F26;
    text-decoration: none;
    letter-spacing: .5px;
}
.logo a.text-logo span {
    color: #29D9C2;
}

input[type="date"],
input[type="time"] {
    display: block;
    padding: 12px 15px;
    font-size: 15px;
    width: 100%;
    border: 1px solid #DFDFD0;
    color: #34394A;
    border-radius: 3px;
}
input[type="date"]:focus,
input[type="time"]:focus {
    border-color: #bbb;
}

.form-error {
    display: block;
    color: #D0021B;
    font-size: 12px;
    text-transform: none;
    padding-top: 6px;
}

.alert-box {
    padding: 15px 20px;
    border-radius: 3px;
    margin-bottom: 25px;
}
.alert-box.success {
    background: #E9FBF8;
    border: 1px solid #29D9C2;
    color: #14806f;
}
/* Arama sonucu "fiyat için bizi arayınız" ekranındaki WhatsApp butonu —
   .btn.large sabit 200px genişlikte, "WhatsApp'tan Yaz" + ikon bu genişliğe
   sığmayıp iki satıra bölünüyordu. */
.btn.large.whatsapp-inquiry-btn {
    width: auto;
    padding: 0 24px;
}

.alert-box.error {
    /* style.css'teki 404 sayfası ".error" kuralı (min-height:630px,
       padding:0, arka plan görseli) bu sınıfla çakışıyor ve daha spesifik
       olmayan özellikleri (min-height, padding, background-image) eziyor
       — burada açıkça sıfırlanıyor. */
    background: #FDEDEE none;
    border: 1px solid #D0021B;
    color: #D0021B;
    min-height: 0;
    padding: 15px 20px;
}

.steps-nav {
    list-style: none;
    margin: 0 0 30px;
    padding: 0;
    display: flex;
    gap: 10px;
}
.steps-nav li {
    flex: 1;
    text-align: center;
    padding: 12px 8px;
    background: #F4F4EE;
    border-radius: 3px;
    font-size: 13px;
    text-transform: uppercase;
    color: #858585;
}
.steps-nav li.active {
    background: #29D9C2;
    color: #fff;
}
.steps-nav li.done {
    background: #DFF7F4;
    color: #14806f;
}

/* ============ HERO SEARCH (ana sayfa rezervasyon kutusu) ============ */

.hero-search {
    position: relative;
    min-height: 720px;
    display: flex;
    align-items: center;
    overflow: hidden;
    float: left;
    width: 100%;
}
.hero-search-media {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: 50% 30%;
}
.hero-search-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 30%;
}
.hero-search-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(8, 16, 18, .6), rgba(8, 16, 18, .25) 45%, rgba(8, 16, 18, .7));
}
.hero-search-content {
    position: relative;
    z-index: 2;
    text-align: center;
    color: #fff;
    padding: 90px 20px 40px;
}
.hero-search-content h1 {
    text-transform: uppercase;
    font-size: 44px;
    margin: 0 0 8px;
}
.hero-search-content h2 {
    font-size: 18px;
    font-weight: 400;
    margin: 0;
    opacity: .9;
}

.hero-search-box-wrap {
    position: relative;
    z-index: 3;
    float: left;
    width: 100%;
    margin-top: -150px;
    padding: 0 20px;
}
/* Bir açılır panel (takvim/saat, yolcu, Nereden/Nereye) açıkken bu
   sarmalayıcı sabit WhatsApp butonunun (999) ve çerez bandının (1000)
   üstüne çıkar — aksi hâlde onlar panelin üzerine binip takvim
   günlerini tıklanamaz hâle getiriyordu. Sınıfı hero-search.js
   ekliyor/kaldırıyor, yani sadece panel açık olduğu sürece geçerli. */
body.hsb-dropdown-open .hero-search-box-wrap {
    z-index: 1001;
}
.hero-search-inner {
    max-width: 1360px;
    margin: 0 auto;
}

/* Sekmeler (Transfer / Saatlik Kiralama) — sadece Transfer aktif, ikincisi kapsam dışı */
.hero-tabs {
    display: flex;
    gap: 4px;
}
.hero-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 22px;
    border-radius: 10px 10px 0 0;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .02em;
    cursor: default;
}
.hero-tab .icon {
    font-size: 16px;
}
.hero-tab.active {
    background: #fff;
    color: #191F26;
}

.hero-search-box {
    background: #fff;
    border-radius: 0 14px 14px 14px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, .22);
}

.hsb-alerts {
    padding: 20px 28px 0;
}

/* Tek parça, bölmeli arama çubuğu: her alan ince bir dikey çizgiyle ayrılır,
   kutucuk/border yok — sağda tam yükseklikte "Rezervasyon Yap" butonu. */
.hsb-fields {
    display: flex;
    align-items: stretch;
    flex-wrap: nowrap;
}
/* Nereden/Nereye çift alanı yer adları için esner ve boşta kalan alanı
   üstlenir; tarih/yolcu gibi sabit-kısa değerli alanlar kendi içeriğine
   göre sıkı durur, aksi halde etraflarında orantısız boşluk oluşuyordu. */
.hsb-fields > .hsb-location-pair {
    flex: 1 1 0;
}
.hsb-fields > .hsb-group {
    flex: 0 0 auto;
}

.hsb-group {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    padding: 18px 22px;
    border-right: 1px solid #ECECE3;
}
.hsb-group > label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #6B7268;
    padding: 0;
    margin: 0;
    white-space: nowrap;
}
.hsb-group > label .icon {
    font-size: 14px;
    color: #29D9C2;
    line-height: 1;
}

.hsb-pill {
    display: flex;
    align-items: center;
    gap: 8px;
}
.hsb-pill select,
.hsb-pill input[type="text"] {
    display: block;
    border: none;
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: #191F26;
    line-height: 1.3;
    width: auto;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.hsb-datetime input[type="text"] {
    cursor: pointer;
    flex: 0 0 auto;
}
#pickup_date,
#return_date {
    width: 9.5ch;
}
#pickup_time,
#return_time {
    width: 5ch;
}
.hsb-pill select {
    cursor: pointer;
    padding-right: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239AA098'/%3E%3C/svg%3E") right center no-repeat;
}
.hsb-pill select:focus,
.hsb-pill input:focus {
    outline: none;
}

.hsb-location-pair {
    display: flex;
    align-items: stretch;
    gap: 0;
    position: relative;
}
.hsb-location-pair .hsb-group:first-child {
    padding-left: 28px;
}
.hsb-location {
    flex: 1 1 190px;
    min-width: 170px;
}
.hsb-location .hsb-pill { width: 100%; cursor: pointer; }
.hsb-location .hsb-pill > input {
    min-width: 0;
    flex: 1;
    width: 100%;
    cursor: pointer;
    padding-right: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239AA098'/%3E%3C/svg%3E") right center no-repeat;
}

.hsb-datetime {
    gap: 12px;
}
.hsb-datetime > input + input {
    border-left: 1px solid #E3E5DA;
    padding-left: 12px;
}

.hsb-passengers-trigger {
    cursor: pointer;
    white-space: nowrap;
    border: none;
    background: transparent;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 700;
    color: #191F26;
}

.hsb-passenger-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 11px;
    background: #F0F1EA;
    color: #191F26;
    font-size: 13px;
    font-weight: 600;
}
.hsb-chevron {
    font-size: 10px;
    color: #9AA098;
}
.hsb-passengers-group {
    position: relative;
}

.hsb-submit {
    margin-left: auto;
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #29D9C2;
    color: #191F26;
    border: none;
    padding: 0 40px;
    border-radius: 0 14px 14px 0;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .04em;
    cursor: pointer;
    white-space: nowrap;
}
.hsb-submit:hover {
    background: #20b8a4;
}

.hsb-calendar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 600;
    color: #191F26;
    text-transform: capitalize;
}
.hsb-calendar-nav {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid #E4E6DC;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    line-height: 1;
    color: #55686d;
    padding: 0;
}
.hsb-calendar-nav:hover {
    border-color: #29D9C2;
    color: #14806f;
}
.hsb-calendar-daynames {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    margin-bottom: 4px;
}
.hsb-calendar-daynames span {
    text-align: center;
    font-size: 11px;
    color: #9AA098;
    text-transform: uppercase;
}
.hsb-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}
.hsb-calendar-day {
    width: 100%;
    aspect-ratio: 1 / 1;
    border: none;
    background: transparent;
    border-radius: 6px;
    font-size: 13px;
    color: #191F26;
    cursor: pointer;
}
.hsb-calendar-day:hover:not(.is-disabled) {
    background: #E9FBF8;
    color: #14806f;
}
.hsb-calendar-day.is-today {
    font-weight: 700;
    color: #14806f;
}
.hsb-calendar-day.is-selected {
    background: #29D9C2;
    color: #fff;
}
.hsb-calendar-day.is-disabled {
    color: #DADCD0;
    cursor: not-allowed;
}

.hsb-time-option {
    display: block;
    width: 100%;
    text-align: left;
    padding: 8px 10px;
    border: none;
    background: transparent;
    border-radius: 6px;
    font-size: 13px;
    color: #191F26;
    cursor: pointer;
}
.hsb-time-option:hover {
    background: #E9FBF8;
    color: #14806f;
}
.hsb-time-option.is-selected {
    background: #29D9C2;
    color: #fff;
}

@media (max-width: 900px) {
    .hero-search { min-height: 560px; }
    .hero-search-content { padding-top: 60px; }
    .hero-search-content h1 { font-size: 30px; }
    .hero-search-box-wrap { margin-top: -70px; }
    .hero-tabs { display: none; }

    /* Mobilde masaüstündeki tek parça bar yerine: alanlar kendi ince
       çerçeveli kutusunda alt alta, "Rezervasyon Yap" ise aralarında
       boşluk bırakan ayrı bir buton olarak altta durur. */
    .hero-search-box {
        background: transparent;
        box-shadow: none;
        border-radius: 0;
    }
    .hsb-alerts { padding: 0 0 12px; }

    .hsb-fields {
        flex-direction: column;
        background: #fff;
        border: 1px solid #E4E6DC;
        border-radius: 8px;
        box-shadow: 0 12px 30px rgba(0, 0, 0, .15);
    }
    .hsb-group {
        width: 100%;
        padding: 16px !important;
        border-right: none !important;
        border-bottom: 1px solid #ECECE3;
    }
    .hsb-location-pair { flex-direction: column; }
    /* Masaüstündeki "flex: 1 1 190px" GENİŞLİK tabanıdır; sütun yönünde ana
       eksen dikeye döndüğü için 190px'lik bir YÜKSEKLİK tabanına dönüşüp
       Nereden/Nereye alanlarını (içerikleri ~40px olmasına rağmen) 190px'lik
       dev kutulara çeviriyordu — panel gereksiz yere iki ekran boyu uzuyordu.
       Aynı tuzak için bkz. .reservation-approval-actions (max-width:600px). */
    .hsb-location {
        flex: 0 0 auto;
        min-width: 0;
    }

    .hsb-submit {
        width: 100%;
        margin: 14px 0 0;
        border-radius: 8px;
        padding: 18px;
        box-shadow: 0 12px 30px rgba(0, 0, 0, .15);
    }
    .hsb-passenger-popover { left: 0; right: auto; }

    /* Tarih/saat pilli mobilde tam genişlik olduğu için alanlar sabit
       karakter genişliği yerine orantılı olarak boşluğu paylaşsın. */
    .hsb-datetime input[type="text"] {
        flex: 1 1 0;
        width: auto;
        text-align: center;
    }
    #pickup_date, #return_date { flex-grow: 2; }
    #pickup_time, #return_time { flex-grow: 1; }
}

/* ============ ARAMA ÇUBUĞU: BARA BAĞLI AÇILIR PANELLER (Tarih/Yolcu) ============ */
/* Nereden/Nereye artık düz native <select> (ayrı bir panele ihtiyaçları
   yok). Alış Tarihi ve Yolcu, tıklanan alanın hemen altında küçük,
   bağımsız birer panel olarak açılıyor — bkz. hero-search.js
   setupDropdown(). Aynı anda sadece biri açık kalır. */
.hsb-dropdown-anchor {
    position: relative;
}
.hsb-inline-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    /* Sabit WhatsApp butonunun (999) ve çerez bandının (1000) ÜSTÜNDE
       olmalı: mobilde ikisi de açık panelin üzerine binip takvim
       günlerini (ör. ayın son satırı) tıklanamaz hâle getiriyordu.
       Panel kullanıcının kendi açtığı, kapanınca yok olan bir katman. */
    z-index: 1001;
    min-width: 280px;
    max-width: calc(100vw - 32px);
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, .18);
    padding: 18px;
}

/* Nereden/Nereye — yazdıkça filtrelenen sonuç listesi (bkz.
   hero-search.js setupLocationCombobox(), maxResults). Diğer panellerden
   farklı olarak liste öğeleri düz görünsün diye ayrı, dar bir padding. */
.hsb-location-dropdown {
    padding: 6px;
    width: 100%;
    min-width: 240px;
}
/* `display`'i temel selector'de değil `:not([hidden])` altında
   tanımlıyoruz — aksi hâlde bu author kuralı `[hidden]{display:none}`
   UA kuralını ezip panel hiçbir zaman gerçekten gizlenemez (boş bir
   kutu olarak hep görünür kalır). bkz. .hsb-mega-overlay'deki aynı
   desen (yukarıda artık yok ama yorum burada geçerliliğini koruyor). */
.hsb-location-dropdown:not([hidden]) {
    display: flex;
    flex-direction: column;
    /* Liste kutuya sığmadığında kesilmesin, kendi içinde kaydırılsın —
       küçük ekranlarda ekranın yarısını aşmasın diye min() ile sınırlı.
       overscroll-behavior: liste sonuna gelince sayfanın arkadan
       kaymasını engeller. */
    max-height: min(360px, 50vh);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.hsb-location-dropdown .location-picker-item {
    display: block;
    width: 100%;
    border: none;
    background: transparent;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #191F26;
    text-align: left;
    cursor: pointer;
}
.hsb-location-dropdown .location-picker-item:hover {
    background: #F0FBFA;
}

.hsb-mega-col-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #6B7268;
    margin: 0 0 12px;
}
.hsb-mega-col-label .icon {
    color: #29D9C2;
    font-size: 14px;
}
.hsb-mega-time-label {
    margin-top: 18px;
}
.hsb-mega-time-list {
    max-height: 180px;
    overflow-y: auto;
}

/* Rezervasyon formundaki tekil adres alanları (mahalle/açık adres) için
   Mapbox öneri açılır listesi — bkz. booking/details.blade.php. */
.mapbox-text-autocomplete {
    position: relative;
}
.mapbox-address-suggestions {
    display: flex;
    flex-direction: column;
    margin-top: 4px;
    border: 1px solid #E4E6DC;
    border-radius: 6px;
    overflow: hidden;
}
.mapbox-address-suggestion {
    padding: 8px 10px;
    font-size: 13px;
    text-align: left;
    background: #FAFAF6;
    border: none;
    border-bottom: 1px solid #E4E6DC;
    cursor: pointer;
}
.mapbox-address-suggestion:last-child {
    border-bottom: none;
}
.mapbox-address-suggestion:hover {
    background: #EFF1E8;
}

.hsb-mega-stepper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}
.hsb-mega-stepper-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #DADCD0;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    color: #34394A;
    padding: 0;
}
.hsb-mega-stepper-btn:hover {
    border-color: #29D9C2;
    color: #14806f;
}
#hsb-mega-passenger-display {
    font-size: 22px;
    font-weight: 700;
    color: #191F26;
    min-width: 34px;
    text-align: center;
}

@media (max-width: 900px) {
    .hsb-inline-dropdown {
        left: 50%;
        transform: translateX(-50%);
        width: calc(100vw - 32px);
        /* Panel ne olursa olsun ekranı aşıp erişilemez hâle gelmesin —
           taşarsa kendi içinde kayar. */
        max-height: 78vh;
        overflow-y: auto;
    }
    /* Sadece takvim/yolcu panelleri: Nereden/Nereye listesinin kendi dar
       padding'i (6px, bkz. .hsb-location-dropdown) korunmalı. */
    .hsb-inline-dropdown:not(.hsb-location-dropdown) {
        padding: 14px;
    }
    /* Takvim hücreleri masaüstünde kare (aspect-ratio: 1/1); mobilde panel
       neredeyse tam genişlik olduğu için bu kural hücreleri 44px'e
       büyütüp takvimi (ve dolayısıyla tüm paneli) gereksiz yere
       uzatıyordu. Mobilde kareden vazgeçip sabit, kısa bir yükseklik. */
    .hsb-calendar-day {
        aspect-ratio: auto;
        height: 34px;
    }
    .hsb-mega-time-label {
        margin-top: 12px;
    }
    .hsb-mega-time-list {
        max-height: 132px;
    }
}

/* ============ LOKASYON KARTLARI (ana sayfa) ============ */

/* .one-fourth'un gutter padding'i sıfırlandığı için .row'un onu telafi eden
   -15px'lik negatif kenar boşluğuna artık gerek yok; bırakılırsa satır
   .wrap'in dışına taşar. */
#locations .row {
    margin: 0;
}

.location-card {
    background: #F6F7F2;
    border-radius: 10px;
    overflow: hidden;
    cursor: default;
    height: 400px;
    display: flex;
    flex-direction: column;
    /* .services.boxed article{padding:0} temanın kendi kuralı .one-fourth'un
       gutter padding'ini eziyor, o yüzden boşluğu doğrudan buraya veriyoruz. */
    margin: 0 15px 30px;
}
.location-card .featured-image {
    margin: 0;
    flex-shrink: 0;
}
.location-card .featured-image img {
    display: block;
    width: 100%;
    height: 190px;
    object-fit: cover;
}
.location-card .details {
    border-right: none !important;
    padding: 18px 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.location-card .details h4 {
    margin: 0 0 8px;
    color: #191F26;
    font-size: 15px;
    flex-shrink: 0;
}
.location-card .details p {
    margin: 0;
    color: #55686d;
    font-size: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex-shrink: 0;
}

.location-card .details .btn-link {
    margin-top: auto;
    padding-top: 10px;
    display: inline-block;
    color: #14806f;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .02em;
}
.location-card .details .btn-link:hover {
    color: #29D9C2;
}

/* Görselsiz kart varyantı — ör. anasayfa "Popüler Lokasyonlar" (bkz.
   partials/location-cards.blade.php, $showImage=false). Sabit 400px
   yüksekliği kaldırıp içeriğe göre daralıyoruz. */
.location-card.location-card--no-image {
    height: auto;
}
.location-card--no-image .details {
    flex: none;
    min-height: 190px;
    justify-content: center;
}

/* Sadece başlık gösterilen kart varyantı — ör. anasayfa "Popüler
   Lokasyonlar" (bkz. partials/location-cards.blade.php, $titleOnly=true).
   Tüm kart tıklanabilir bir link, açıklama/buton yok. */
.location-card--title-only {
    /* Sabit yükseklik şart: .one-fourth (float:left) tabanlı grid, satırlar
       arası yükseklik eşitlemesi yapmıyor — kart boyu içerik uzunluğuna göre
       değişirse (ör. 2 satıra düşen uzun başlıklar) sonraki satırlardaki
       kartlar kayıyor/boşluk oluşuyor. */
    height: 90px;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 12px 16px;
    text-decoration: none;
    border: 1px solid transparent;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.location-card--title-only h4 {
    margin: 0;
    color: #191F26;
    font-size: 15px;
    transition: color .2s ease;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.location-card--title-only:hover {
    background: #ffffff;
    border-color: #29D9C2;
    box-shadow: 0 10px 24px rgba(20, 128, 111, .14);
    transform: translateY(-3px);
}
.location-card--title-only:hover h4 {
    color: #14806f;
}

/* Popüler lokasyonlar arama kutusu (bkz. $searchable=true). */
.location-search {
    max-width: 420px;
    margin: 0 auto 30px;
}
.location-search-input {
    width: 100%;
    padding: 12px 20px;
    border-radius: 30px;
    border: 1px solid #DFE3E0;
    background: #F6F7F2;
    font-size: 14px;
    outline: none;
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.location-search-input:focus {
    background: #ffffff;
    border-color: #29D9C2;
    box-shadow: 0 0 0 3px rgba(41, 217, 194, .15);
}
.location-search-empty {
    width: 100%;
    text-align: center;
    color: #55686d;
    padding: 20px 0;
}

/* ============ BAŞLIKLI BÖLÜM ÜST YAZISI (section-heading) ============ */

.section-heading {
    text-align: center;
    margin: 0 0 40px;
}
.section-heading h2 {
    margin: 0;
    color: #191F26;
}

/* ============ MÜŞTERİ YORUMLARI (testimonials) ============ */

/* Satır float yerine flex: kartlar satırdaki en uzun karta göre eşitlenir.
   Böylece kart yüksekliğini sabitlemeye gerek kalmıyor — fotoğraflı
   yorumlarda (bkz. .testimonial-gallery, 56px'lik görseller iki sıraya
   taşabiliyor) içerik sabit 280px'i aşıp karttan dışarı akıyordu. */
#testimonials .row {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}
#testimonials .row > article {
    display: flex;
}

.testimonial-card {
    background: #F6F7F2;
    border-radius: 10px;
    padding: 30px 28px;
    margin: 0 15px 30px;
    /* Sabit yükseklik değil: taban boy korunur, içerik uzarsa kart büyür. */
    min-height: 280px;
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.testimonial-card .quote-icon {
    color: #29D9C2;
    font-size: 22px;
    margin-bottom: 12px;
}
.testimonial-card .stars {
    color: #F5A623;
    font-size: 13px;
    margin-bottom: 12px;
}
.testimonial-card .stars i + i {
    margin-left: 2px;
}
.testimonial-card .quote-text {
    flex: 1;
    margin: 0 0 16px;
    color: #55686d;
    font-size: 14px;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.testimonial-card .testimonial-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 16px;
}
.testimonial-card .testimonial-gallery .vehicle-gallery-trigger {
    width: 56px;
    height: 56px;
    border-radius: 6px;
    overflow: hidden;
}
.testimonial-card .testimonial-gallery img {
    width: 56px;
    height: 56px;
    object-fit: cover;
    border-radius: 6px;
}
.testimonial-card .testimonial-author {
    margin: 0;
    color: #191F26;
    font-size: 14px;
    font-weight: 700;
}
.testimonial-card .testimonial-author span {
    display: block;
    color: #9AA098;
    font-size: 12px;
    font-weight: 400;
    text-transform: none;
    margin-top: 2px;
}

/* ============ SABİT WHATSAPP BUTONU ============ */

.whatsapp-float-btn {
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #25D366;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
    z-index: 999;
    transition: transform .15s ease, box-shadow .15s ease;
}
.whatsapp-float-btn:hover,
.whatsapp-float-btn:focus {
    color: #fff;
    transform: scale(1.06);
    box-shadow: 0 8px 26px rgba(0, 0, 0, .3);
}
@media (max-width: 900px) {
    .whatsapp-float-btn {
        right: 16px;
        bottom: 16px;
        width: 52px;
        height: 52px;
        font-size: 24px;
    }
}

/* ============ ÇEREZ ONAY BANDI ============ */

.cookie-consent-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    background: #191F26;
    color: #D6D9DC;
    box-shadow: 0 -6px 20px rgba(0, 0, 0, .2);
}
.cookie-consent-inner {
    max-width: 1360px;
    margin: 0 auto;
    padding: 18px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.cookie-consent-text {
    margin: 0;
    padding: 0;
    font-size: 13px;
    line-height: 1.6;
    flex: 1 1 auto;
    min-width: 240px;
}
.cookie-consent-text a {
    color: #29D9C2;
    text-decoration: underline;
}
.cookie-consent-actions {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}
.cookie-consent-btn {
    border: none;
    border-radius: 6px;
    padding: 10px 20px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .02em;
    cursor: pointer;
    transition: transform .15s ease, opacity .15s ease;
}
.cookie-consent-accept {
    background: #29D9C2;
    color: #191F26;
}
.cookie-consent-accept:hover {
    transform: translateY(-1px);
}
.cookie-consent-reject {
    background: transparent;
    color: #D6D9DC;
    border: 1px solid #3A414A;
}
.cookie-consent-reject:hover {
    opacity: .8;
}

body.has-cookie-consent-banner .whatsapp-float-btn {
    bottom: 140px;
}

@media (max-width: 900px) {
    .cookie-consent-inner {
        padding: 16px;
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }
    .cookie-consent-actions {
        justify-content: center;
    }
    body.has-cookie-consent-banner .whatsapp-float-btn {
        bottom: 200px;
    }
}

/* ============ REZERVASYON ÖZETİ FİYAT DÖKÜMÜ ============ */
/* Temanın .total sınıfı (style.css) display:table + table-cell kullanıyor;
   bu yalnızca TEK bir dt/dd çifti (örn. sade "Toplam: ₺X") için doğru
   çalışır — birden fazla çift eklendiğinde (Ara toplam/Ekstralar/Toplam)
   hepsi aynı satıra sıkışıyor. Grid'e çevirip her çifti kendi satırına
   dağıtıyoruz; tek çiftli kullanımı (booking/extras.blade.php) etkilemez. */

.total {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 16px;
    row-gap: 6px;
    align-items: baseline;
}
.total dt,
.total dd {
    display: block;
    float: none;
    width: auto;
}

/* Son çift ("Toplam") diğer kalemlerden görsel olarak ayrılsın. */
.total dt:last-of-type,
.total dd:last-of-type {
    padding-top: 8px;
    margin-top: 4px;
    border-top: 1px solid rgba(255, 255, 255, .2);
    font-weight: 700;
}

/* Seçilen ekstra hizmetlerin adı solda, fiyatı sağda hizalı görünsün. */
.summary dd.summary-line-item {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
}
.summary dd.summary-line-item span:last-child {
    flex-shrink: 0;
    color: #191F26;
    font-weight: 600;
}

/* Rezervasyon onay sayfasındaki ekstra hizmet satırları — aynı desen. */
.confirmation-extra-line {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
}
.confirmation-extra-line + .confirmation-extra-line {
    margin-top: 4px;
}
.confirmation-extra-line span:last-child {
    flex-shrink: 0;
    font-weight: 600;
}

/* Footer başlıkları erişilebilirlik için h6'dan h3'e taşındı (Lighthouse
   heading-order uyarısı) — eski h6 görünümü (büyük harf, küçük punto) korunuyor. */
.footer h3 {
    font-size: 17px;
    text-transform: uppercase;
    padding: 0 0 23px;
}

/* Kontrast düzeltmeleri (Lighthouse color-contrast uyarıları) — beyaz metin
   yerine sitenin koyu lacivert rengi kullanılıyor, teal arka plan aynı kalıyor. */
.cta.color p {
    color: #191F26;
}
.copy,
.copy a {
    color: #9CA3AF;
}
.copy a:hover,
.copy a:focus {
    color: #fff;
}

/* Anasayfa "Hızlı Rezervasyon" kartları — bkz. home/index.blade.php,
   HomeController ($quickRoutes) ve theme/js/hero-search.js (tıklanınca
   Nereden/Nereye arama kutusunu dolduran davranış). .services.boxed'ın
   kendi üst/alt boşluğu yok (temanın kendi kuralı) — hero arama kutusunun
   hemen altında sıkışık durmasın diye burada ayrıca veriyoruz, tıpkı
   .services.iconic'in kendi boşluğu gibi (bkz. style.css). */
.quick-reservation-section {
    padding: 70px 0 40px;
}
/* Satır float yerine flex (bkz. .feature-strip .row'daki aynı gerekçe):
   kartlar satırdaki en uzunuyla eşitlendiği için yüksekliği sabitlemeye
   gerek kalmıyor — uzun güzergah isimleri sabit 100px'i aşıp karttan
   dışarı taşıyordu. */
.quick-reservation-section .row,
#routes .row {
    display: flex;
    flex-wrap: wrap;
}
.quick-reservation-section .row > article,
#routes .row > article {
    display: flex;
}
.quick-route-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    /* width:100% BİLEREK yok — .location-card ile aynı desen: margin +
       width:auto, kartın kendi genişliğini ebeveynin (article.one-fourth)
       genişliğinden marjinleri çıkararak kendiliğinden hesaplamasını
       sağlıyor. width:100% eklenirse marj üstüne eklenip komşu karta
       taşıyor, aralardaki boşluk kayboluyordu — flex:1 aynı işi marjları
       hesaba katarak yapıyor. */
    flex: 1;
    min-width: 0;
    min-height: 100px;
    margin: 0 15px 30px;
    padding: 14px 18px;
    background: #F6F7F2;
    border: 1px solid transparent;
    border-radius: 10px;
    text-align: center;
    cursor: pointer;
    font-family: inherit;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.quick-route-title {
    font-weight: 600;
    font-size: 15px;
    color: #191F26;
}
.quick-route-meta {
    font-size: 13px;
    color: #55686d;
}
.quick-route-card:hover,
.quick-route-card:focus-visible {
    background: #ffffff;
    border-color: #29D9C2;
    box-shadow: 0 10px 24px rgba(20, 128, 111, .14);
    transform: translateY(-3px);
}

/* "Öne Çıkanlar" şeridi (bkz. partials/feature-strip.blade.php) — temanın
   .one-fourth'u float tabanlı ve satır içi yükseklik eşitlemesi yapmıyor;
   başlıklardan biri 2 satıra düşünce (ör. "Güvenilir Transfer") o sütunun
   metni bir sonraki elemanın altına/soluna taşıp "kaymış" görünüyordu.
   Bunun yerine flexbox + wrap: her öğe kendi içeriğine göre esniyor, en az
   240px'de bir sonraki satıra geçiyor (geniş ekranda en fazla 4 tanesi
   sığıyor), ve aynı satırdaki öğeler flex sayesinde otomatik aynı
   hizada kalıyor. */
.feature-strip .row {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    gap: 32px 24px;
}
.feature-strip-item {
    /* 260px'in altına inmeden esniyor, sığdığı kadar (geniş ekranda en
       fazla ~4 tane) yan yana diziliyor, kalanı otomatik alt satıra
       geçiyor. İkon + başlık/metin de kendi içinde flex — temanın
       .circle{float:left} kuralı burada override ediliyor, çünkü float +
       değişken satır sayılı metin karışımı, komşu öğenin kısa kalan
       satırının yanlış yere ("kaymış" görünecek şekilde) sarmasına yol
       açıyordu. */
    display: flex;
    align-items: flex-start;
    gap: 18px;
    flex: 1 1 260px;
    max-width: 320px;
}
.feature-strip-item .circle {
    float: none;
    flex-shrink: 0;
    margin: 0;
}
.feature-strip-body h3 {
    margin: 0 0 8px;
}
.feature-strip-body p {
    margin: 0;
}

/* bkz. resources/views/pages/gallery.blade.php — site galerisi sayfası,
   GalleryController/App\Models\GalleryPhoto. */
.site-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
    padding: 60px 0;
}
.site-gallery-item {
    margin: 0;
}
.site-gallery-item .vehicle-gallery-trigger {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 8px;
    overflow: hidden;
}
.site-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .25s ease;
}
.site-gallery-item .vehicle-gallery-trigger:hover img {
    transform: scale(1.05);
}
.site-gallery-item figcaption {
    margin-top: 6px;
    font-size: 13px;
    color: #55686d;
}

/* Araç fotoğraf galerisi (lightbox) — bkz.
   resources/views/partials/vehicle-gallery.blade.php,
   public/theme/js/vehicle-gallery.js. Galerisi olan araçlarda kapak
   fotoğrafı bir <button>'a sarılıyor; buton sıfırlanıp altındaki <img>
   temanın .entry-featured / .heightfix kurallarıyla aynı görünsün diye
   (aksi hâlde tarayıcının varsayılan buton çerçevesi/dolgusu araya girer). */
.vehicle-gallery-trigger {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    text-align: left;
}
.vehicle-gallery-trigger img {
    display: block;
}
.vehicle-gallery-badge {
    position: absolute;
    right: 10px;
    bottom: 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(15, 23, 21, 0.72);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
}
.vehicle-gallery-badge svg {
    display: block;
    flex-shrink: 0;
}

/* Lightbox overlay'i — tüm sayfada tek bir örneği yaratılıp yeniden
   kullanılıyor (bkz. vehicle-gallery.js buildOverlay()). */
html.vehicle-gallery-open,
html.vehicle-gallery-open body {
    overflow: hidden;
}
.vehicle-gallery-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 56px 16px;
    background: rgba(6, 12, 11, 0.92);
}
.vehicle-gallery-overlay[hidden] {
    display: none;
}
.vehicle-gallery-figure {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    max-width: 100%;
}
.vehicle-gallery-image {
    display: block;
    max-width: 100%;
    max-height: 80vh;
    border-radius: 10px;
    box-shadow: 0 30px 70px -20px rgba(0, 0, 0, 0.6);
}
.vehicle-gallery-counter {
    color: #dfeeec;
    font-size: 13px;
    letter-spacing: 0.02em;
}
.vehicle-gallery-close,
.vehicle-gallery-nav {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.vehicle-gallery-close:hover,
.vehicle-gallery-nav:hover {
    background: #29D9C2;
    color: #06110f;
}
.vehicle-gallery-close {
    top: 16px;
    right: 16px;
}
.vehicle-gallery-prev {
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
}
.vehicle-gallery-next {
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
}
@media (max-width: 640px) {
    .vehicle-gallery-overlay {
        padding: 72px 8px 24px;
    }
    .vehicle-gallery-close,
    .vehicle-gallery-nav {
        width: 38px;
        height: 38px;
        font-size: 17px;
    }
    .vehicle-gallery-prev {
        left: 6px;
    }
    .vehicle-gallery-next {
        right: 6px;
    }
}

/* Araçlar sayfasındaki satır içi carousel — bkz.
   resources/views/partials/vehicle-gallery-carousel.blade.php,
   public/theme/js/vehicle-gallery.js. */
.vehicle-carousel-arrow {
    position: absolute;
    top: 50%;
    z-index: 3;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    background: rgba(15, 23, 21, 0.55);
    color: #fff;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.vehicle-carousel-arrow:hover {
    background: #29D9C2;
    color: #06110f;
}
.vehicle-carousel-prev {
    left: 10px;
}
.vehicle-carousel-next {
    right: 10px;
}
.vehicle-carousel-image-btn {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}
/* Tema, .single .entry-featured img için sabit bir kırpma kural seti
   tanımlıyor (position:absolute;top:-30%) — birden fazla slide'ı üst üste
   koyup görünürlüğü class ile değiştirdiğimiz için bunu geçersiz kılmamız
   gerekiyor; ilgili seçici üç sınıf + eleman içerdiğinden (bkz.
   .three-fourth .single .entry-featured img) normal specificity ile
   ezilemiyor. */
.vehicle-carousel-slide {
    display: none !important;
    position: absolute !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
.vehicle-carousel-slide.is-active {
    display: block !important;
}
.vehicle-carousel-thumbs {
    clear: both;
    display: flex;
    gap: 8px;
    padding: 12px 25px 6px;
    overflow-x: auto;
    background: #fff;
}
.vehicle-carousel-thumb {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    opacity: 0.55;
    transition: opacity 0.15s ease, border-color 0.15s ease;
}
.vehicle-carousel-thumb:hover {
    opacity: 0.85;
}
.vehicle-carousel-thumb.is-active {
    opacity: 1;
    border-color: #29D9C2;
}
.vehicle-carousel-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Arama sonuçlarındaki "Detayları gör" paneli — tema zaten .trigger/
   .close/.information için bir aç/kapat mekanizması içeriyordu (bkz.
   public/theme/js/scripts.js, "SEARCH RESULTS" bölümü) ama hiç
   kullanılmıyordu; burada araç detayları için devreye alındı. .information
   JS ile (jQuery .hide()) gizleniyor ama sayfa yüklenirken kısa bir an
   görünüp kaybolmasın diye burada da varsayılan olarak gizli. */
.information {
    display: none;
}
/* Araç isminin (.result .one-half h3) yanında duran pil şeklinde buton.
   .result .trigger (style.css) width:20px;height:20px;position:absolute
   kuralı iki sınıflı bir seçici olduğu için bizimkinden daha özgüldü —
   metin o minik kutuya sığmaya çalışıp harf harf alt alta diziliyordu. Hem
   seçiciyi ".result .trigger" ile aynı özgüllüğe çıkarıp hem de kritik
   kuralları !important ile garantiye aldık; h3'ün text-transform:uppercase'i
   de burada bilinçli olarak iptal ediliyor (buton metni olduğu gibi kalsın
   diye). */
.result .vehicle-detail-toggle {
    position: static !important;
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    height: auto !important;
    white-space: nowrap;
    vertical-align: middle;
    margin-left: 10px;
    padding: 5px 14px;
    border: 1px solid #29D9C2;
    border-radius: 999px;
    background: rgba(41, 217, 194, 0.12);
    color: #0f1715;
    font-family: inherit;
    font-size: 11px;
    line-height: normal !important;
    font-weight: 700;
    text-transform: none !important;
    text-decoration: none;
    letter-spacing: 0.01em;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.result .vehicle-detail-toggle:hover {
    background: #29D9C2;
    color: #06110f;
}
.information .close {
    background: #0f1715;
    border: 0;
    cursor: pointer;
}
.information .close:hover {
    background: #29D9C2;
    color: #06110f;
}
.vehicle-detail-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.vehicle-detail-photo {
    flex: 0 0 220px;
    width: 220px;
    height: 160px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    background: #F4F4EE;
}
.vehicle-detail-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.vehicle-detail-info {
    flex: 1 1 260px;
    min-width: 220px;
}
.vehicle-detail-info h4 {
    margin: 0 0 4px;
    font-size: 17px;
}
.vehicle-detail-type {
    margin: 0 0 10px;
    color: #667c77;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.vehicle-detail-specs {
    margin: 0 0 10px;
    padding: 0;
    list-style: none;
}
.vehicle-detail-specs li {
    margin: 0 0 4px;
    padding: 0;
}
.vehicle-detail-specs li:before {
    display: none;
}
.vehicle-detail-features {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.5;
}
@media (max-width: 640px) {
    .vehicle-detail-photo {
        flex-basis: 100%;
        width: 100%;
    }
}

/* "Fiyat Teklifi İste" popup'ı — bkz.
   resources/views/partials/vehicle-inquiry-modal.blade.php,
   public/theme/js/vehicle-inquiry.js. Kartın kendi alan/kutucuk stilleri
   var (.vehicle-inquiry-field) — temanın .f-row/.one-half sınıflarına
   bilinçli olarak bağlı değil: onlar float tabanlı ve genişliği temanın
   geniş sayfa içeriği için ayarlı, bu modalin dar/geniş değişen konteyner
   genişliğinde (bkz. aşağıdaki @media) beklenmedik şekilde davranıyordu
   (ör. input[type=tel] hiç stillenmiyordu). */
.vehicle-inquiry-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 40px 16px;
    overflow-y: auto;
    background: rgba(6, 12, 11, 0.72);
}
.vehicle-inquiry-overlay[hidden] {
    display: none;
}
.vehicle-inquiry-card {
    position: relative;
    width: 100%;
    max-width: 880px;
    border-radius: 10px;
    background: #fff;
    padding: 32px 36px;
    box-shadow: 0 30px 70px -20px rgba(0, 0, 0, 0.5);
    box-sizing: border-box;
}
.vehicle-inquiry-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: #F4F4EE;
    color: #445551;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}
.vehicle-inquiry-close:hover {
    background: #29D9C2;
    color: #06110f;
}
.vehicle-inquiry-card h3 {
    margin: 0 0 4px;
}
.vehicle-inquiry-vehicle-name {
    margin: 0 0 20px;
    color: #29D9C2;
    font-weight: 700;
}

/* Geniş ekranda iki sütun (sol: iletişim bilgileri, sağ: ek hizmetler +
   mesaj) — dikeyde uzayıp gitmesin, ekrana sığsın diye. */
.vehicle-inquiry-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    margin-bottom: 4px;
}
.vehicle-inquiry-col {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.vehicle-inquiry-field {
    display: flex;
    flex-direction: column;
}
.vehicle-inquiry-field--grow {
    flex: 1;
}
.vehicle-inquiry-field label {
    margin: 0 0 6px;
    font-size: 12.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: #445551;
}
.vehicle-inquiry-field label small {
    text-transform: none;
    font-weight: 400;
    letter-spacing: normal;
    color: #9AA098;
}
.vehicle-inquiry-field input[type="text"],
.vehicle-inquiry-field input[type="email"] {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 11px 14px;
    border: 1px solid #DFDFD0;
    border-radius: 4px;
    font-size: 14px;
    color: #34394A;
    font-family: inherit;
}
.vehicle-inquiry-field input[type="text"]:focus,
.vehicle-inquiry-field input[type="email"]:focus {
    outline: none;
    border-color: #29D9C2;
}
.vehicle-inquiry-field--grow textarea {
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 100%;
    min-height: 150px;
    padding: 11px 14px;
    border: 1px solid #DFDFD0;
    border-radius: 4px;
    font-size: 14px;
    color: #34394A;
    font-family: inherit;
    resize: vertical;
}
.vehicle-inquiry-field--grow textarea:focus {
    outline: none;
    border-color: #29D9C2;
}
.vehicle-inquiry-extras {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 130px;
    overflow-y: auto;
    padding: 10px 12px;
    border: 1px solid #E1E1D6;
    border-radius: 6px;
}
.vehicle-inquiry-extra {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    font-weight: 400;
    text-transform: none;
    cursor: pointer;
}
.vehicle-inquiry-extra input {
    width: auto;
    margin: 0;
}
.vehicle-inquiry-extra-price {
    margin-left: auto;
    color: #667c77;
    font-size: 12px;
    white-space: nowrap;
}
.vehicle-inquiry-kvkk {
    margin: 20px 0 18px;
    padding-top: 18px;
    border-top: 1px solid #E1E1D6;
}
.vehicle-inquiry-kvkk label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    font-weight: 400;
    text-transform: none;
    letter-spacing: normal;
    color: #34394A;
    cursor: pointer;
}
.vehicle-inquiry-kvkk input {
    flex-shrink: 0;
    width: auto;
    margin: 3px 0 0;
}
.vehicle-inquiry-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px;
}
@media (max-width: 700px) {
    .vehicle-inquiry-overlay {
        padding: 20px 10px;
    }
    .vehicle-inquiry-card {
        padding: 26px 20px;
        max-height: calc(100vh - 40px);
        overflow-y: auto;
    }
    .vehicle-inquiry-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .vehicle-inquiry-actions {
        flex-direction: column-reverse;
    }
    .vehicle-inquiry-actions .btn {
        width: 100%;
        text-align: center;
    }
}

/* Müşteri fiyat onayı sayfası — bkz. resources/views/reservations/approve.blade.php */
/* Durum rozeti — bkz. reservations/detail.blade.php, reservations/lookup.blade.php */
.reservation-status-badge {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 30px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #fff;
    background: #7A7F8C;
    margin: 4px 0 6px;
}
.reservation-status-badge.is-pending {
    background: #D68A1F;
}
.reservation-status-badge.is-confirmed {
    background: #1EA97C;
}
.reservation-status-badge.is-completed {
    background: #29D9C2;
}
.reservation-status-badge.is-cancelled {
    background: #C0392B;
}
/* Rezervasyon özet/fiyat tablosu — bkz. partials/reservation-summary.blade.php.
   Fiyat onayı, salt-okunur detay ve "Rezervasyon Sorgula" sayfaları ortak
   kullanıyor. */
.reservation-summary {
    width: 100%;
    border-collapse: collapse;
    margin: 18px 0;
}
.reservation-summary th,
.reservation-summary td {
    text-align: left;
    padding: 8px 10px;
    border-bottom: 1px solid #DFDFD0;
    font-weight: 400;
    color: #34394A;
}
.reservation-summary th {
    width: 40%;
    color: #7A7F8C;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.reservation-summary-price .reservation-summary-total th,
.reservation-summary-price .reservation-summary-total td {
    font-weight: 700;
    font-size: 18px;
    border-bottom: none;
    padding-top: 12px;
}
.reservation-approval-form {
    margin-top: 24px;
}
.reservation-approval-note {
    margin: 20px 0 0;
}
.reservation-approval-note textarea {
    margin-top: 8px;
}
/* .btn.large'ın sabit 200px genişliğini ezip iki butonu eşit, geniş ve
   göze çarpan bir çift haline getiriyor — bkz. style.css .btn/.btn.large.
   Karar butonları formun en üstünde, fiyatın hemen altında — opsiyonel not
   alanı altta kalıyor ama aynı forma bağlı, hangi butona tıklanırsa o an
   yazılmış olan not birlikte gönderiliyor. */
.reservation-approval-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.reservation-approval-actions .btn {
    flex: 1 1 220px;
    width: auto !important;
    font-weight: 700;
    letter-spacing: .05em;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .12);
}
.reservation-approval-decline {
    background: #C0392B !important;
}
.reservation-approval-decline:hover,
.reservation-approval-decline:focus {
    background: #A5301F !important;
}
@media (max-width: 600px) {
    .reservation-approval-actions {
        flex-direction: column;
        gap: 10px;
    }
    .reservation-approval-actions .btn {
        /* flex-direction:column'da flex-basis ana eksen (dikey) boyunca
           uygulanıyor — masaüstündeki "flex: 1 1 220px" burada 220px
           YÜKSEKLİK'e dönüşüp butonları dev kutulara çeviriyordu, bu yüzden
           flex tamamen sıfırlanıyor. */
        flex: 0 0 auto;
        width: 100% !important;
        height: auto;
        line-height: normal;
        font-size: 14px;
        padding: 13px 14px;
    }
}

/* ============ HEADER DİL SEÇİCİ ============ */
/* Bilerek .main-nav'ın <ul>'ü İÇİNDE DEĞİL, header .wrap içinde ondan
   ÖNCE gelen ayrı bir kardeş eleman (bkz. layouts/partials/header.blade.php)
   — .main-nav'ı mobilde hamburger menüye çeviren slicknav <ul>'ün
   içeriğini clone'luyor ve <button>+iç içe <ul> gibi standart olmayan
   bir yapıyı düzgün klonlayamıyordu, dil seçenekleri mobilde hiç
   görünmüyordu.

   float:right kullanılıyor — hem bu, hem .main-nav, hem de slicknav'ın
   oluşturduğu .slicknav_btn aynı şekilde float:right; float:right'ta
   DOM'da ÖNCE gelen eleman en sağa yerleşir. Masaüstünde bu, .main-nav'dan
   önce geldiği için navbar'ın en sağında görünür; mobilde slicknav kendi
   menüsünü .header .wrap'ın en başına eklediği (prependTo) için ondan
   sonra gelen bu eleman hamburger ikonunun hemen soluna düşer. */
.header-lang-switcher {
    position: relative;
    float: right;
    padding: 21px 0;
    margin-left: 24px;
}
.header-lang-trigger {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #29D9C2;
    border-radius: 3px;
    background: transparent;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: #29D9C2;
    cursor: pointer;
    padding: 8px 12px;
    transition: background-color .2s ease, color .2s ease;
}
.header-lang-trigger:hover,
.header-lang-trigger:focus {
    background: #29D9C2;
    color: #fff;
}
.header-lang-trigger .hsb-chevron {
    color: inherit;
}
.header-lang-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 50;
    min-width: 140px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 16px 36px rgba(0, 0, 0, .18);
    padding: 6px;
    list-style: none;
    margin: 0;
}
.header-lang-menu li + li {
    margin-top: 2px;
}
.header-lang-menu a {
    display: block;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    color: #191F26;
    text-decoration: none;
}
.header-lang-menu a:hover {
    background: #F0FBFA;
}
.header-lang-menu a.active {
    background: #E3F9F6;
    color: #14806f;
}

/* Bu override BURADA (temel kuraldan SONRA) durmalı — eşit özgüllükte
   CSS'te sonra gelen kural kazanır, bir @media içinde olması bunu
   değiştirmez; bir önceki denemede bu kural dosyanın ÜSTÜNDE bir yerdeydi
   ve temel .header-lang-switcher kuralı (yukarıda) tarafından eziliyordu.

   max-width:980px (bkz. style.css .logo kırılımı): bu genişlikte
   .slicknav_menu (hamburger'ı oluşturan eklenti elemanı) width:100% ile
   tüm satırı kaplıyor — ondan sonra gelen her float eleman satırın altına
   düşer. .logo da aynı sebeple bu genişlikte float yerine
   position:absolute kullanıyor; aynı tekniği burada da uyguluyoruz ki dil
   seçici hamburger'ın SOLUNDA, aynı satırda kalsın. right değeri
   hamburger ikonunun (40px çubuk + ~%4 sağ boşluk) yaklaşık genişliğine
   göre ayarlandı. */
@media (max-width: 980px) {
    .header-lang-switcher {
        position: absolute;
        top: 21px;
        /* Hamburger'ın genişliği SABİT DEĞİL: .slicknav_btn'in sağ
           padding'i yüzde (4%), çubukları ise 40px — yani toplam
           "40px + %4", 390px'te ~56px iken 979px'te ~79px oluyor. Sabit
           bir offset (önceden 60px) bu yüzden dar ekranda yapışık,
           geniş ekranda üst üste bırakıyordu. Aynı formülü kullanıp
           her genişlikte 12px'lik sabit bir boşluk bırakıyoruz. */
        right: calc(4% + 52px);
        float: none;
        margin-left: 0;
        padding: 0;
    }
    .header-lang-trigger {
        font-size: 13px;
    }
}

/* 420px altındaki dar ekranlarda logo + döviz + dil seçici + hamburger
   aynı satıra sığmıyor, metin logo dil kutusunun altına giriyordu (24px'te
   ~211px yer kaplıyor). Eşik önceden 360px'ti — döviz seçici eklenince
   (bkz. HEADER DÖVİZ SEÇİCİ) 361-420px arası da sıkışmaya başladı, o
   yüzden eşiği yukarı çektik. Logoyu bir tık küçültmek hepsini yan yana
   tutuyor. */
@media (max-width: 420px) {
    .logo a.text-logo {
        font-size: 20px;
    }
}

/* ============ HEADER DÖVİZ SEÇİCİ ============ */
/* Dil seçiciyle AYNI desen ve gerekçe (bkz. yukarıdaki "HEADER DİL
   SEÇİCİ" yorumları) — .header-lang-trigger/.header-lang-menu sınıfları
   zaten paylaşılıyor (bkz. header.blade.php), burada sadece SARMALAYICI
   konumlandırması ayrı: DOM'da dil seçiciden ÖNCE geldiği için
   float:right'ta ondan daha sağda oturuyor. */
.header-currency-switcher {
    position: relative;
    float: right;
    padding: 21px 0;
    margin-left: 12px;
}
@media (max-width: 980px) {
    .header-currency-switcher {
        position: absolute;
        top: 21px;
        /* Dil seçicinin kendi hamburger-temizleme formülüne (calc(4% +
           52px)), onun tahmini genişliğini (~60px, bkz. ölçüm) ve aradaki
           12px boşluğu ekliyoruz — böylece döviz seçici dil seçicinin
           HEMEN SOLUNDA duruyor, hamburger'a değmiyor. */
        right: calc(4% + 52px + 60px + 12px);
        float: none;
        margin-left: 0;
        padding: 0;
    }
    /* Logo (ör. "Turkuaz VIP Transfer") zaten dil seçici + hamburger'la
       aynı satırda dar kalıyordu (bkz. aşağıdaki 360px kuralı) — üçüncü
       bir eleman eklenince (döviz seçici) logoyla çakışmaya başladı.
       Dil seçicinin kendi metnine (TR/EN gibi 2 harf) dokunmadan, sadece
       döviz butonunu tek karakterlik sembole (₺/$/€/£) indirip oku
       gizliyoruz — genişliği ~51px'ten ~24px'e düşürüyor, logo alanını
       geri kazandırıyor. */
    .header-currency-switcher .header-lang-trigger {
        padding: 8px 10px;
    }
    .header-currency-switcher .hsb-chevron {
        display: none;
    }
}

/* 420px altında logonun (bkz. yukarıdaki kural) yanı sıra döviz
   seçicinin de iç boşluğunu biraz daha sıkıştırıyoruz — dördü (logo,
   döviz, dil, hamburger) yine de aynı satırda kalsın diye. */
@media (max-width: 420px) {
    .header-currency-switcher .header-lang-trigger {
        padding: 8px 6px;
    }
}

/* 345px gibi çok nadir görülen dar ekranlarda dördü (logo, döviz, dil,
   hamburger) hâlâ sığmıyor — logoyu bir tık daha, dil seçicinin okunu da
   döviz seçicideki gibi gizleyip küçültüyoruz. */
@media (max-width: 345px) {
    .logo a.text-logo {
        font-size: 17px;
    }
    .header-lang-switcher .hsb-chevron {
        display: none;
    }
    .header-lang-switcher .header-lang-trigger {
        padding: 8px 8px;
    }
    /* Dil seçici de bu eşikte artık ~37px (60px değil) — döviz seçicinin
       konum formülü hâlâ 60px varsayıp gereğinden fazla sola taşıyordu. */
    .header-currency-switcher {
        right: calc(4% + 52px + 37px + 12px);
    }
}

/* ============ NAVBAR TAŞMA GÜVENLİĞİ ============ */
/* Çeviriler Türkçe orijinalinden çok daha uzun olabiliyor (ör. Almanca
   "Reservierung abfragen", Fransızca "Consulter la réservation") — dil
   seçici de artık aynı satırda float:right ile yer kapladığı için, uzun
   çevirilerle birlikte navbar taşıp tuhaf bir şekilde alt satıra
   düşebiliyordu. Nav öğelerinin yatay boşluğunu ve yazı boyutunu biraz
   kısarak (bkz. header.blade.php'de "Rezervasyon Sorgula" nav etiketinin
   de kısaltılmış "Sorgula" haliyle değiştirilmesi) her dilde/çözünürlükte
   taşma riskini azaltıyoruz — tek bir dile özel bir yama değil, kalıcı bir
   güvenlik payı. */
.main-nav {
    font-size: 13px;
}
.main-nav ul > li {
    padding-left: 18px;
}
.header-lang-switcher {
    margin-left: 14px;
}

/* ============ YORUM FORMU: YILDIZ PUANLAMA ============ */
/* bkz. reviews/create.blade.php. Radyo düğmeleri DOM'da 5→1 sırasında;
   flex-direction:row-reverse ile görsel sıra 1→5'e dönüyor, böylece
   "işaretliden/hover'lıdan SONRA gelen kardeşleri de boya" (~) CSS
   tekniği, görsel olarak "hover'lanan yıldıza kadar SOLDAKİ tüm
   yıldızları doldur" davranışını JS'siz sağlıyor. */
.star-rating {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 2px;
}
.star-rating input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
}
.star-rating label {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    cursor: pointer;
}
.star-rating-icon {
    font-size: 34px;
    line-height: 1;
    color: #d8dcd6;
    transition: color .15s ease;
}
.star-rating-number {
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    color: #9AA098;
}
.star-rating input:checked ~ label .star-rating-icon,
.star-rating label:hover .star-rating-icon,
.star-rating label:hover ~ label .star-rating-icon {
    color: #f5b301;
}
.star-rating input:focus-visible + label {
    outline: 2px solid #29D9C2;
    outline-offset: 3px;
    border-radius: 3px;
}

/* bkz. resources/views/reviews/create.blade.php — seçilen fotoğrafların
   gönderim öncesi önizleme galerisi. */
.review-photo-previews {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}
.review-photo-previews img {
    width: 90px;
    height: 90px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid #e2e5e0;
}