﻿/* 1. RESET VE TEMEL AYARLAR */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Inter', sans-serif !important;
}

body {
    background: #f4f7f9;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Arka Plan Karartmalı Görsel */
.bg-london {
    background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url('london.jpg') center/cover fixed;
}

/* 2. HEADER TASARIMI */
/* style.css içinde bu bloğu bul ve değiştir */
.sticky-header {
    background: #f1f5f9; /* Modern, açık bir gri (Slate 100) */
    padding: 10px 0;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05); /* Gölgeyi de biraz yumuşattık */
}

.header-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
}

.main-logo {
    height: 48px;
    object-fit: contain;
}

.nav-links {
    display: flex;
    gap: 25px;
}

    .nav-links a {
        text-decoration: none;
        color: #1e293b;
        font-weight: 600;
        font-size: 14px;
        transition: color 0.2s;
    }

        .nav-links a:hover {
            color: #ff8c00;
        }

.phone-btn {
    background: #25d366;
    color: white !important;
    padding: 10px 20px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    box-shadow: 0 4px 10px rgba(37, 211, 102, 0.2);
}

/* 3. DİKEY REZERVASYON FORMU */
.main-content {
    margin-top: 110px;
    padding: 40px 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hero-section h2 {
    color: white;
    text-align: center;
    margin-top: -40px; /* Bu satırı ekle veya değeri ihtiyacına göre artır/azalt */
    margin-bottom: 35px;
    font-size: 44px;
    font-weight: 800;
    letter-spacing: -1.5px;
    text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

.booking-container.vertical {
    width: 100%;
    max-width: 480px;
    filter: drop-shadow(0 25px 40px rgba(0,0,0,0.4));
}

/* Sekmeler */
.booking-tabs {
    display: flex;
    width: 100%;
}

.tab-btn {
    flex: 1;
    background: #1e293b;
    color: white;
    border: none;
    padding: 18px;
    cursor: pointer;
    border-radius: 16px 16px 0 0;
    font-weight: 700;
    font-size: 16px;
    transition: all 0.3s;
}

    .tab-btn.active {
        background: #ff8c00;
    }

/* Form İç Alanı */
.search-master-wrapper.v-mode {
    background: white;
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.v-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .v-field label {
        font-size: 11px;
        font-weight: 800;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        padding-left: 2px;
    }

    .v-field input, .v-field select {
        border: 1.5px solid #e2e8f0;
        padding: 14px;
        border-radius: 12px;
        font-size: 16px;
        background: #f8fafc;
        color: #0f172a;
        outline: none;
        transition: all 0.2s;
    }

        .v-field input:focus, .v-field select:focus {
            border-color: #ff8c00;
            background: white;
            box-shadow: 0 0 0 4px rgba(255, 140, 0, 0.1);
        }

.v-field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

/* Dönüş Alanı Efekti */
#return-details {
    border-top: 1px dashed #e2e8f0;
    padding-top: 20px;
    margin-top: 5px;
    animation: slideDown 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-15px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 4. CHECKBOX VE BUTON */
.check-label {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 700;
    color: #475569;
    cursor: pointer;
}

#is-ret {
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: #ff8c00;
}

.quote-btn.v-btn {
    background: #ff8c00;
    color: white;
    border: none;
    padding: 20px;
    border-radius: 14px;
    font-weight: 800;
    font-size: 20px;
    cursor: pointer;
    text-transform: uppercase;
    box-shadow: 0 6px 20px rgba(255, 140, 0, 0.3);
    transition: all 0.3s;
    margin-top: 5px;
}

    .quote-btn.v-btn:hover {
        background: #f37a00;
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(255, 140, 0, 0.4);
    }

/* 5. SARI BİLGİ ŞERİDİ */
.info-strip {
    background: #fffbeb; /* Hafif altın sarısı tonu */
    padding: 18px;
    border-radius: 0 0 16px 16px;
    text-align: center;
    border-top: 1px solid rgba(255, 140, 0, 0.1);
    border-bottom: 3px solid #ff8c00; /* Alt kısma turuncu bir şerit çekerek vurguladık */
}

.info-content {
    font-size: 13px;
    font-weight: 800; /* Yazıyı biraz daha kalınlaştırdık */
    color: #1e293b;
    letter-spacing: 0.2px;
}

/* /* 6. HARİTA VE FOOTER (GÜNCELLENMİŞ - DAHA DAR) */
.map-container {
    width: 100%;
    max-width: 1100px;
    height: 420px;
    margin: 50px auto;
    border-radius: 28px;
    border: 8px solid white;
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
}

.main-footer {
    background: #0f172a;
    color: #94a3b8;
    padding: 20px 20px; /* 50px olan ilk değeri 25px yaptık, yükseklik yarıya indi */
    text-align: center;
    font-size: 13px; /* Yazıyı bir tık küçülterek zarafet kattık */
    border-top: 1px solid rgba(255,255,255,0.05); /* Üst kısma çok ince bir çizgi */
}

/* Linklerin arasındaki boşluğu da biraz daraltalım */
.footer-nav {
    margin-bottom: 12px; /* Altındaki telif yazısıyla mesafeyi daralttık */
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px; /* Linkler arası boşluğu 25'ten 20'ye çektik */
}

    .footer-nav a {
        color: #94a3b8;
        text-decoration: none;
        font-weight: 600;
        transition: color 0.2s;
    }

        .footer-nav a:hover {
            color: #ff8c00; /* Hover rengi turuncu yapıldı */
        }

/* Telif yazısı için ek stil */
.footer-copy {
    opacity: 0.7;
    font-weight: 400;
}
/* 7. MOBIL DÜZENLEMELERİ */
@media (max-width: 600px) {
    .sticky-header {
        padding: 5px 0; /* Header yüksekliğini biraz kıstık */
    }

    .header-container {
        flex-direction: column; /* Logo, Menü ve Butonu alt alta dizer */
        gap: 10px;
        padding: 10px;
    }

    .nav-links {
        display: none; /* Mobilde yer kaplayan menü yazılarını gizler */
    }

    .main-logo {
        height: 55px; /* Logoyu mobilde küçülttük */
    }

    .phone-btn {
        width: fit-content; /* Telefon butonunu tam genişlik yaparak basılmasını kolaylaştırdık */
        justify-content: center;
        font-size: 13px;
        padding: 8px 15px;
    }

    /* Hero başlığını da mobilde biraz küçültelim ki sığsın */
    .hero-section h2 {
        font-size: 28px;
        margin-bottom: 20px;
        padding: 0 10px;
    }
}
/* Başlıkların (Label) Stili - Görseldeki gibi */
.form-label {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 11px; /* Görseldeki gibi küçük ve vurgulu */
    font-weight: 700;
    color: #64748b; /* Slate gri tonu */
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    text-transform: uppercase;
}

/* Select Box Stili */
.custom-select {
    width: 100%;
    height: 50px;
    padding: 0 15px;
    background-color: #f8fafc; /* Çok hafif gri arka plan */
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #0f172a;
    appearance: none; /* Varsayılan ok işaretini kaldırır */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .custom-select:focus {
        outline: none;
        border-color: #cbd5e1;
        background-color: #ffffff;
    }

.form-group {
    margin-bottom: 12px; /* Tüm kutuların arasındaki dikey boşluğu eşitler */
}

.form-label {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    font-weight: 700;
    color: #64748b;
    letter-spacing: 0.5px;
    margin-bottom: 6px; /* Başlık ile kutu arasındaki mesafe */
    text-transform: uppercase;
}

.custom-select, .form-control {
    width: 100%;
    height: 50px; /* Tüm kutuların yüksekliği aynı olsun */
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    /* ...diğer özellikler aynı kalsın... */
}

/* --- REZERVASYON (BOOKING) SAYFASI ÖZEL AYARLARI --- */

/* Rezervasyon Kartı Genel Kapsayıcı */
.reservation-wrapper {
    max-width: 750px; /* Araç kutusu genişliğiyle eşitledik */
    margin: 20px auto;
    padding: 25px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
}

/* Yan yana duran alanlar için flex düzeni */
.v-field-row {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

/* Her bir input alanı */
.v-field {
    flex: 1; /* Alanları eşit genişliğe böler */
    display: flex;
    flex-direction: column;
}

    .v-field label {
        font-size: 11px;
        font-weight: 800;
        color: #64748b;
        text-transform: uppercase;
        margin-bottom: 6px;
    }

    .v-field input {
        height: 48px;
        padding: 10px 15px;
        border-radius: 10px;
        border: 1.5px solid #e2e8f0;
        background: #f8fafc;
        font-size: 15px;
        outline: none;
    }

        .v-field input:focus {
            border-color: #ff8c00;
        }

/* Mobil için alt alta dizilim */
@media (max-width: 600px) {
    .v-field-row {
        flex-direction: column;
        gap: 15px;
    }
}

/* --- ARAÇ LİSTESİ ANA DÜZEN --- */
.car-list {
    display: flex;
    flex-direction: column;
    gap: 15px; /* İki araç kutusu arasındaki boşluk */
}

.car-option {
    display: flex;
    align-items: center;
    padding: 25px 30px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    overflow: hidden; /* Taşmaları engelle */
 
}

    /* Seçili olan aracın stili */
    .car-option.selected {
        background: #fffbeb;
        border: 2px solid #ff8c00;
    }

/* 1. SÜTUN: RESİM (ASLA EZİLMEZ) */
.car-img-wrap {
    flex: 0 0 170px; /* 170px genişliği dondurduk, ne küçülür ne büyür */
    margin-right: 20px;
    display: flex;
    align-items: center;

}

    .car-img-wrap img {
        width: 100%;
        height: auto;
        object-fit: contain;
        filter: drop-shadow(0 8px 12px rgba(0,0,0,0.1));
    }

/* 2. SÜTUN: ARAÇ BİLGİSİ (ORTA ALAN) */
.car-info {
    flex: 1; /* Geri kalan tüm orta alanı kapla */
    display: flex;
    flex-direction: column;
    min-width: 0; /* Yazı çok uzunsa kutuyu patlatmasın */
}

    .car-info h4 {
        font-size: 20px;
        font-weight: 800;
        color: #1e293b;
        margin: 0;
    }

    .car-info span {
        font-size: 14px;
        color: #64748b;
        margin-top: 4px;
    }

/* 3. SÜTUN: FİYATLAR (EN SAĞ) */
.price-wrap {
    flex: 0 0 140px; /* Fiyat alanını 140px'e sabitledik */
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* İçeriği en sağa yasla */
    justify-content: center;
}

/* GÜNCEL FİYAT - DEV BOYUT */
.price {
    font-size: 28px;
    font-weight: 900;
    color: #25d366;
    line-height: 1.1;
}

/* ESKİ FİYAT */
.old-price {
    font-size: 15px;
    color: #94a3b8;
    text-decoration: line-through;
    font-weight: 600;
    margin-bottom: 4px;
}

/* MOBİL GÖRÜNÜM */
@media (max-width: 600px) {
    .car-option {
        flex-direction: column;
        text-align: center;
        padding: 20px;
    }

    .car-img-wrap {
        flex: 0 0 auto;
        width: 140px;
        margin-right: 0;
        margin-bottom: 15px;
    }

    .price-wrap {
        flex: 0 0 auto;
        align-items: center;
        margin-top: 15px;
    }
}

/* --- REZERVASYON FORMU TASARIMI --- */
.reservation-section {
    width: 100%;
    max-width: 750px; /* Araç kutusuyla aynı genişlik */
    margin: 20px auto 40px auto;
    background: white;
    padding: 30px;
    border-radius: 24px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
    border: 1px solid #e2e8f0;
}

/* Form Satır Düzeni (İsim ve Email yan yana, Yolcu ve Uçuş yan yana) */
.form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.form-group {
    flex: 1; /* Alanları eşit dağıtır */
    display: flex;
    flex-direction: column;
}

.form-label {
    font-size: 11px;
    font-weight: 800;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 8px;
    display: block;
}

.form-control {
    width: 100%;
    height: 50px;
    padding: 12px 18px;
    border-radius: 12px;
    border: 1.5px solid #e2e8f0;
    background: #f8fafc;
    font-size: 15px;
    color: #0f172a;
    outline: none;
    transition: all 0.2s;
}

    .form-control:focus {
        border-color: #ff8c00;
        background: #fff;
        box-shadow: 0 0 0 4px rgba(255, 140, 0, 0.1);
    }

/* Onayla Butonu */
.confirm-btn {
    width: 100%;
    height: 60px;
    background: #ff8c00;
    color: white;
    border: none;
    border-radius: 16px;
    font-size: 18px;
    font-weight: 800;
    cursor: pointer;
    text-transform: uppercase;
    transition: all 0.3s;
    margin-top: 10px;
}

    .confirm-btn:hover {
        background: #e67e00;
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(255, 140, 0, 0.3);
    }

/* Mobil Uyumluluk */
@media (max-width: 600px) {
    .form-row {
        flex-direction: column;
        gap: 15px;
    }
}

#summary-pax {
    font-size: 16px; /* 18px'den düşürüldü */
    font-weight: 600; /* Bir tık inceltildi */
    color: #ffffff;
    margin-top: 4px;
}
/* --- YEŞİL FİYAT VE TASARRUF BADGE'I GÜNCELLEMESİ --- */

/* 1. Güncel Fiyatların Yeşil Rengi */
.price {
    color: #25d366; /* Görseldeki yeşil tonu */
    font-weight: 800;
    font-size: 28px; /* Görseldeki gibi büyük puntolu */
}

/* 2. Tasarruf Tutarı Rengi (Promosyon kutusunun içindeki) */
#sum-savings strong {
    color: #25d366; /* Tasarruf miktarı yeşil */
    font-weight: 800;
}

/* 3. Özel Teklif Yazısı Rengi (Promosyon kutusunun içindeki) */
#sum-savings span {
    color: #ffffff; /* Ana metin beyaz kalabilir veya gri tonu verilebilir, görselde beyaz gibi duruyor */
}

/* 4. Promosyon Badgesinin Kendisi (Koyu arka planlı) */
/* Görseldeki Koyu Tasarruf Kutusu */
.savings-badge {
    grid-column: span 2;
    background: #0f172a; /* Çok koyu lacivert, görseldeki gibi */
    border-left: 4px solid #25d366; /* Soluna yeşil bir şerit */
    padding: 20px;
    border-radius: 12px;
    margin-top: 15px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

/* Araç Listesindeki Fiyatlar */
.price {
    font-size: 32px; /* Daha büyük ve vurgulu */
    font-weight: 900;
    letter-spacing: -1px;
}

/* Seçili kartın içindeki metinleri de düzeltelim */
.car-option.selected .price {
    color: #25d366;
}
.datetime-display {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 5px;
}

.date-val {
    font-size: 18px;
    font-weight: 800;
    color: #ffffff;
}

.time-val {
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    opacity: 0.9;
}

/* Dönüş tarihi turuncu vurgusu */
.return-style .date-val,
.return-style .time-val {
    color: #ff8c00;
}

/* Aradaki o dikey çizgi efektini ( | ) görseldeki gibi istersen 
   aşağıdaki JS'de tarih ve saati ayırarak basacağız */

.summary-box {
    position: relative !important;
}

    /* Resmin üzerine gelince hafif büyümesi için (İsteğe bağlı) */
    .summary-box a:hover img {
        transform: scale(1.1);
        filter: brightness(1.2);
    }
    .main-footer {
    background: #0f172a; /* Koyu lacivert/siyah tonu */
    color: #94a3b8;
    padding: 40px 20px;
    text-align: center;
    width: 100%;
    margin-top: auto; /* Sayfa kısa kalsa bile en altta tutar */
    border-top: 1px solid rgba(255,255,255,0.05);
}

.footer-nav {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.footer-nav a {
    color: #94a3b8;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: color 0.2s;
}

.footer-nav a:hover {
    color: #ff8c00; /* Turuncu vurgu */
}

.footer-copy {
    font-size: 13px;
    opacity: 0.6;
}

/* Sayfanın footer'ı hep en altta görmesi için body ayarı */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
/* --- KAYMAYI SIFIRLAYAN KESİN ÇÖZÜM --- */

.lang-dropdown {
    position: relative;
    /* KUTU BOYUTUNU SABİTLE: Metin değişse de bu kutu asla büyümez/küçülmez */
    width: 100px !important;
    flex-shrink: 0; /* Flexbox'ın bu kutuyu sıkıştırmasını engelle */
    display: flex;
    justify-content: center;
}

.lang-dropbtn {
    width: 100%; /* Kapsayıcı olan 100px'e tam otur */
    background: rgba(15, 23, 42, 0.05); /* Header açık renk olduğu için hafif belirginlik */
    color: #1e293b;
    padding: 8px 0; /* Sağ-sol padding'i sıfırladık, genişliği width yönetiyor */
    font-size: 13px;
    font-weight: 700;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: none !important; /* Geçiş efektleri kayma hissi yaratmasın */
}

.lang-content {
    display: none;
    position: absolute;
    top: 100%;
    /* Menü açıldığında ne sağa ne sola taşar, sadece aşağı sarkar */
    left: 50%;
    transform: translateX(-50%);
    background-color: #1e293b;
    min-width: 140px;
    box-shadow: 0px 8px 16px rgba(0,0,0,0.2);
    z-index: 99999;
    border-radius: 6px;
    margin-top: 5px;
}

/* Navigasyon barındaki diğer elemanlar için: */
.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    /* Elemanların genişlikleri değişse bile yerlerini koruması için */
    table-layout: fixed;
}

.nav-links {
    display: flex;
    gap: 25px;
    flex: 1; /* Orta alanı kaplasın ama butonları itmesin */
    justify-content: center;
}

/* Mobildeki zıplamayı kesmek için */
@media (max-width: 600px) {
    .header-container {
        display: grid; /* Flex yerine Grid kullanarak yerleri rezerve ediyoruz */
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .lang-dropdown {
        width: 80px !important;
        justify-self: end;
    }
}
/* Mobilde Dil Seçeneğini Gizle */
@media (max-width: 600px) {
    .lang-dropdown {
        display: none !important;
    }
}
@media (max-width: 600px) {
    /* 1. Navigasyon linklerini ve dil seçimini tamamen gizle */
    .nav-links,
    .lang-dropdown {
        display: none !important;
    }

    /* 2. Header içindeki elemanları yan yana düzgünce hizala */
    .header-container {
        flex-direction: row !important; /* Alt alta gelmesini engeller */
        justify-content: space-between !important; /* Logoyu sola, butonu sağa iter */
        align-items: center !important;
        padding: 10px 15px !important;
    }

    /* 3. Logo boyutunu mobilde optimize et */
    .main-logo {
        height: 40px !important;
        width: auto;
    }

    /* 4. WhatsApp butonunu mobilde daha kompakt hale getir */
    .phone-btn {
        padding: 8px 12px !important;
        font-size: 12px !important;
        width: auto !important;
    }
}
/* Masaüstü: Dil seçeneğini düzenle */
.lang-dropdown {
    position: relative;
    display: inline-block;
    z-index: 1001;
}

.lang-content {
    display: none; /* Varsayılan olarak kapalı */
    position: absolute;
    top: 100%;
    right: 0;
    background-color: #ffffff;
    min-width: 130px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.1);
    border-radius: 8px;
    margin-top: 5px;
    border: 1px solid #e2e8f0;
}

    /* JavaScript 'show' sınıfını ekleyince görünür yap */
    .lang-content.show {
        display: block !important;
    }

/* MOBİLDE TAMAMEN GİZLE */
@media (max-width: 600px) {
    .lang-dropdown {
        display: none !important;
    }
}
/* TÜRSAB Logosunu En Sağa Hizalama */
.tursab-logo-wrap {
    display: flex;
    justify-content: flex-end; /* İçeriği en sağa yanaştırır */
    padding-right: 20px; /* Sağdan biraz boşluk bırakır (opsiyonel) */
    margin-top: 20px; /* Üstten boşluk bırakır (opsiyonel) */
}

    .tursab-logo-wrap img {
        height: 70px; /* Görseldeki boyutu korur */
        width: auto;
        display: block; /* Sağda kalması için önemli */
    }
/* --- FOOTER TASARIM DÜZENLEMESİ --- */

/* Footer ana kapsayıcı */
footer.main-footer {
    display: flex;
    flex-direction: column; /* İçerikleri dikey olarak dizer */
    align-items: center; /* Tüm içerikleri yatayda ortalar */
    text-align: center;
    background: #0b1222; /* Görseldeki koyu lacivert arka plan */
    padding: 30px 20px; /* Üstten ve alttan boşluk bırakır */
    color: white;
}

/* Telif hakkı yazısı kapsayıcısı */
.footer-copy-wrap {
    margin-bottom: 25px; /* Yazı ile logo arasında 25px'lik boşluk bırakır */
}

/* Telif hakkı yazısı stili */
.footer-copy {
    color: #94a3b8; /* Yazı rengini okunabilir yapar */
    font-size: 13px;
    margin: 0;
}

/* TÜRSAB Logosunu Ortalar */
.tursab-logo-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

    /* TÜRSAB Logo görseli stili */
    .tursab-logo-wrap img.tursab-dvs {
        height: 70px; /* Görseldeki boyutu korur */
        width: auto;
        display: block;
    }

/* --- REZERVASYON ÖZETİ (LACİVERT & TURUNCU) --- */
.reservation-summary-container {
    background: #1e293b; /* Koyu Lacivert Arka Plan */
    border-radius: 24px;
    padding: 30px;
    color: white;
    width: 100%;
    max-width: 750px;
    margin: 20px auto;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

.summary-header-title {
    color: #ff8c00; /* Turuncu Başlık */
    text-align: center;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 25px;
    display: block;
}

.summary-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.summary-block label {
    display: block;
    color: #94a3b8; /* Gri alt başlıklar */
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.summary-block p {
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    line-height: 1.4;
}

/* Tarih ve Saat Yan Yana Görünümü */
.dt-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Dönüş Tarihi Turuncu Vurgusu */
.text-orange {
    color: #ff8c00 !important;
}

/* Alt Satır Ayırıcı */
.summary-divider {
    grid-column: span 2;
    border-top: 1px solid rgba(255,255,255,0.1);
    margin: 10px 0;
}

/* Tasarruf Badge'i */
.savings-banner {
    grid-column: span 2;
    background: rgba(37, 211, 102, 0.1);
    border: 1px solid #25d366;
    border-radius: 12px;
    padding: 15px;
    text-align: center;
    color: #25d366;
    font-weight: 800;
    font-size: 14px;
    margin-top: 10px;
}

/* Mobil Uyumluluk (Özet Alanı) */
@media (max-width: 600px) {
    .summary-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .summary-divider {
        display: none;
    }
}
