/* ========================================= */
/* GENEL AYARLAR                             */
/* ========================================= */

/* Genel sayfa başlık düzenlemeleri */
.rideandgoo-page-header {
    text-align: center;
    margin: 120px 0 0 0;
}

/* ========================================= */
/* H1 BAŞLIK                                 */
/* ========================================= */

/* Ana sayfa H1 başlık */
.rideandgoo-page-header h1 {
    font-size: 36px;
    margin: -120px 0 0 0 !important;
}

/* H1 başlık alt çizgi */
.rideandgoo-page-header h1::after {
    content: '';
    display: block;
    width: 150px;
    height: 4px;
    background-color: #fe783d;
    margin: 5px auto 0;
    border-radius: 10px;
}

/* ========================================= */
/* H2 BAŞLIK                                 */
/* ========================================= */

/* Ana sayfa H2 başlık */
.rideandgoo-page-header h2 {
    font-size: 32px;
    margin: 0;
}

/* H2 başlık alt çizgi */
.rideandgoo-page-header h2::after {
    content: '';
    display: block;
    width: 80px;
    height: 3px;
    background-color: #fe783d;
    margin: 10px auto 0;
    border-radius: 2px;
}

/* H2 alt başlık */
.rideandgoo-page-header .subheading {
    font-size: 18px;
    font-weight: 400;
    color: #555;
    margin: 10px;
    line-height: 1.5;
}

/* H2 vurgulu metin */
.rideandgoo-page-header .subheading .highlight {
    font-weight: 600;
    color: #fe783d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 20px;
    display: inline-block;
    position: relative;
}

/* H2 açıklama metni */
.rideandgoo-page-header .description {
    font-size: 16px;
    color: #777;
    margin: 0 0 20px 0;
    line-height: 1;
}

/* ========================================= */
/* H3 BAŞLIK                                 */
/* ========================================= */

/* H3 başlık */
.rideandgoo-page-header h3 {
    font-size: 28px;
    text-align: left;
    font-weight: 700;
    color: #162432;
    margin: 0 0 40px 0;
}

/* H3 başlık alt çizgi */
.rideandgoo-page-header h3::after {
    content: '';
    display: block;
    width: 80px;
    height: 3px;
    background-color: #fe783d;
    margin: 10px 0 0;
    border-radius: 2px;
}

/* ========================================= */
/* SECTION H2 BAŞLIK                         */
/* ========================================= */

/* Genel alan */
.rideandgoo-section-header {
    text-align: left;
    color: #fff;
    padding: 20px;
    margin: 20px 0;
}

/* Giriş metni */
.rideandgoo-section-header .intro-text {
    font-size: 22px;
    font-weight: 600;
    color: #fe783d;
    margin-bottom: 5px;
    text-transform: uppercase;
}

/* Başlık */
.rideandgoo-section-header h2 {
    font-size: 29px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 10px;
}

/* H2 başlık içindeki vurgulu metin */
.rideandgoo-section-header h2 span {
    color: #fe783d;
    font-size: 34px;
}

/* Açıklama metni */
.rideandgoo-section-header .description {
    font-size: 16px;
    color: #ddd;
    line-height: 1.6;
    margin: 10px 0 0;
}

.ti-fade-container,
.ti-fade-container * {
    color: #ffffff !important;
}

/* ========================================= */
/* EKLENTİ DÜZENLEMELERİ */
/* ========================================= */

/* Bu CSS kodu, iki farklı rezervasyon formundaki alanları (Havaalanı ve Standart Transfer), HTML'i değiştirmeden, flexbox ve order özelliği kullanarak yeniden sıralar. */

/* --- TEMEL FLEXBOX AYARLARI (Değişiklik yok) --- */
div.ui-tabs-panel[aria-labelledby="ui-id-1"],
div.ui-tabs-panel[aria-labelledby="ui-id-6"] {
    display: flex;
    flex-direction: column;
}

div.ui-tabs-panel[aria-labelledby="ui-id-1"] > *,
div.ui-tabs-panel[aria-labelledby="ui-id-6"] > * {
    order: 99; /* Varsayılan sıra, belirtilmeyenler en sona gider */
}

/* --- HAVALİMANI TRANSFER FORMU SIRALAMASI (Değişiklik yok) --- */
div.ui-tabs-panel[aria-labelledby="ui-id-1"] > label.chbs-form-label-group:first-of-type { order: 1; }
div.ui-tabs-panel[aria-labelledby="ui-id-1"] .chbs-form-field-pickup-location { order: 2; }
div.ui-tabs-panel[aria-labelledby="ui-id-1"] .chbs-form-field-dropoff-location { order: 3; }
div.ui-tabs-panel[aria-labelledby="ui-id-1"] .chbs-form-field-pickup-date-time { order: 4; }
div.ui-tabs-panel[aria-labelledby="ui-id-1"] .chbs-form-field-transfer-type { order: 5; }
div.ui-tabs-panel[aria-labelledby="ui-id-1"] .chbs-form-field-return-date-time { order: 6; }
div.ui-tabs-panel[aria-labelledby="ui-id-1"] > label.chbs-form-label-group:nth-of-type(2) { order: 7; }
div.ui-tabs-panel[aria-labelledby="ui-id-1"] .chbs-form-field-passenger { order: 8; }


/* --- HER YERE TRANSFER FORMU SIRALAMASI (GÜNCELLENDİ) --- */
div.ui-tabs-panel[aria-labelledby="ui-id-6"] > label.chbs-form-label-group:first-of-type { order: 1; }
div.ui-tabs-panel[aria-labelledby="ui-id-6"] .chbs-form-field-pickup-location { order: 2; }

/* YENİ EKLENEN KURALLAR: Ara durak ve bekleme süresini alınış konumundan sonraya yerleştirir */
div.ui-tabs-panel[aria-labelledby="ui-id-6"] .chbs-form-field-waypoint,
div.ui-tabs-panel[aria-labelledby="ui-id-6"] .chbs-form-field-waypoint-duration { 
    order: 3; 
}

/* GÜNCELLENEN SIRALAMA: Sonraki elemanların sırası birer artırıldı */
div.ui-tabs-panel[aria-labelledby="ui-id-6"] .chbs-form-field-dropoff-location { order: 4; }
div.ui-tabs-panel[aria-labelledby="ui-id-6"] .chbs-form-field-pickup-date-time { order: 5; }
div.ui-tabs-panel[aria-labelledby="ui-id-6"] > label.chbs-form-label-group:nth-of-type(2) { order: 6; }
div.ui-tabs-panel[aria-labelledby="ui-id-6"] .chbs-form-field-passenger { order: 7; }
div.ui-tabs-panel[aria-labelledby="ui-id-6"] > label.chbs-form-label-group:nth-of-type(3) { order: 8; }
div.ui-tabs-panel[aria-labelledby="ui-id-6"] .chbs-form-field-extra-time { order: 9; }
/* div.ui-tabs-panel[aria-labelledby="ui-id-6"] .chbs-form-field-transfer-type { display: none; } */ /* Gidiş-dönüş aktif */

/* EKLENTİ CHBS DÜZENLEMELERİ */
.chbs-main, .chbs-main input, .chbs-main select, .chbs-main textarea, 
.ui-menu .ui-menu-item, .ui-timepicker-wrapper, .chbs-datepicker.ui-datepicker th, 
.chbs-datepicker.ui-datepicker td, .chbs-datepicker.ui-datepicker td a, 
.chbs-datepicker.ui-datepicker td span, .chbs-datepicker.ui-datepicker .ui-datepicker-title {
    font-family: 'Poppins';
}

/* Gereksiz Elementlerin Gizlenmesi */
.ui-tabs-nav.ui-corner-all.ui-helper-reset.ui-helper-clearfix.ui-widget-header, 
.chbs-show-more-button,
a.chbs-button .chbs-meta-icon-tick, .chbs-vehicle-content-description-attribute.chbs-clear-fix {
    display: none !important;
}


/* SUMMURAY İÇERİSİNDEKİ GEREKSİZ BAŞLIKLARI GİZLER */
/* Formun 2. ve 3. adımlarındayken özet (summary) içindeki gereksiz başlıkları gizler */
.chbs-main-content-step-2 .chbs-summary > .chbs-summary-field:nth-of-type(2) .chbs-summary-field-value,
.chbs-main-content-step-3 .chbs-summary > .chbs-summary-field:nth-of-type(2) .chbs-summary-field-value {
    display: none;
}

.chbs-main-content-step-2 .chbs-summary > .chbs-summary-field:nth-of-type(3) .chbs-summary-field-name,
.chbs-main-content-step-3 .chbs-summary > .chbs-summary-field:nth-of-type(3) .chbs-summary-field-name {
    display: none;
}

.chbs-main-content-step-2 .chbs-summary > .chbs-summary-field:nth-of-type(2),
.chbs-main-content-step-3 .chbs-summary > .chbs-summary-field:nth-of-type(2) {
    border-bottom: none !important;
    padding-bottom: 0px !important;
    margin-bottom: -10px !important;
}

/* Seçilemeyen günler (sade gri tonları) */
.ui-datepicker-unselectable.ui-state-disabled .ui-state-default {
    background-color: #f2f2f2; /* Hafif gri arka plan */
    color: #b3b3b3; /* Gri metin rengi */
    cursor: not-allowed;
    border: 2px solid transparent; /* Normalde çerçeve yok */
    border-radius: 50%; /* Modern yuvarlak tasarım */
}

/* TAKVİM DÜZENLEMELERİ */
/* Seçilemeyen günler hover efekti (kırmızı) */
.ui-datepicker-unselectable.ui-state-disabled .ui-state-default:hover {
    background-color: #ffe6e6; /* Hafif kırmızı arka plan */
    color: #ff4d4d; /* Koyu kırmızı metin */
    border: 2px solid #ff4d4d; /* Kırmızı çerçeve */
}

/* Aktif günler (nötr tasarım) */
.ui-datepicker .ui-state-default {
    background-color: transparent;
    color: #333; /* Nötr metin rengi */
    font-weight: normal;
    border: 2px solid transparent; /* Seçilmemişken çerçeve yok */
    border-radius: 50%; /* Modern yuvarlak tasarım */
}

/* Hover efekti (aktif günler için) */
.ui-datepicker .ui-state-default:hover {
    background-color: #e6f7e6; /* Hafif açık yeşil ton */
    border: 2px solid #66cc66; /* Yeşil çerçeve */
    color: #333; /* Nötr metin rengi */
}

/* Seçilen gün */
.ui-datepicker .ui-state-hover,
.ui-datepicker .ui-state-focus {
    background-color: #d4edda; /* Hafif pastel yeşil */
    border: 2px solid #28a745; /* Daha belirgin yeşil çerçeve */
    color: #28a745; /* Yeşil metin rengi */
}


/* Form Uyarı Mesajı */
.alert-message {
    font-size: 1.2em; /* Biraz büyük font */
    font-weight: 500; /* Normal metin için daha ince bir kalınlık */
    color: #FFFFFF; /* Beyaz metin rengi */
    line-height: 1.6; /* Satırlar arasında ferah bir boşluk */
    text-align: center; /* Metni ortala */
}

.alert-message a {
    color: #25D366; /* WhatsApp yeşili */
    text-decoration: none; /* Alt çizgi yok */
    font-weight: 600; /* WhatsApp bağlantısı için biraz daha kalın */
    display: inline-flex;
    align-items: center;
}

.alert-message a:hover {
    color: #FF6600; /* Üzerine gelindiğinde turuncuya dönüşür */
    text-decoration: underline; /* Alt çizgiyle belirginlik sağlar */
}

.whatsapp-icon {
    width: 20px;
    height: 20px;
    margin-right: 5px; /* İkon ile numara arasında boşluk */
}

/* ETİKETLERİ KALIN PUNTO YAP */
.chbs-form-field label,
.chbs-summary-field-name {
    font-weight: bold !important;
}


/* --- LOKASYON DEĞİŞTİRME BUTONU (MİNİMALİST) --- */

.chbs-form-field-pickup-location {
    position: relative;
}

.chbs-location-swap-button {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    
    /* Minimalist Stil */
    background: #ffffff; /* Arka planı beyaz yapar */
    color: #555555; /* İkon rengini koyu gri yapar */
    border: 1px solid #dddddd; /* İnce, açık gri bir çerçeve */
    box-shadow: none; /* Gölgeyi kaldırır */
    
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: all 0.2s ease-in-out;
}

.chbs-location-swap-button:hover {
    /* Fare üzerine gelince çerçeve ve ikon rengi değişir */
    border-color: #f25c05;
    color: #f25c05;
    transform: translate(-50%, -50%) scale(1.1); /* Hafifçe büyür */
}

.chbs-location-swap-button svg {
    width: 18px;
    height: 18px;
}

/* --- YOLCU SAYISI SEÇİM ALANI (MİNİMALİST) --- */

.chbs-number-counter {
    display: flex;
    align-items: center;
}

/* Artı ve Eksi butonları */
.chbs-number-counter .chbs-counter-minus,
.chbs-number-counter .chbs-counter-plus {
    width: 40px;
    height: 38px;
    
    /* Butonları şeffaf yapar, sadece sembolü gösterir */
    background-color: transparent;
    color: #f25c05; /* Marka renginizde semboller */
    border: none;
    border-radius: 0;
    font-size: 24px; /* Sembolleri büyütür */
    font-weight: 300; /* Daha ince bir font ağırlığı */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    transition: background-color 0.2s ease;
}

/* Fare üzerine gelince hafif bir arka plan rengi */
.chbs-number-counter .chbs-counter-minus:hover,
.chbs-number-counter .chbs-counter-plus:hover {
    background-color: #f8f8f8;
}

/* Devre dışı buton stili */
.chbs-number-counter button:disabled {
    color: #cccccc;
    background-color: transparent;
    cursor: not-allowed;
}

/* Sayının gösterildiği input alanı */
.chbs-number-counter input[type="number"] {
    flex: 1;
    text-align: center;
    height: 35px;
    
    /* Odaklanılan sayı */
    font-size: 18px;
    font-weight: 600;
    color: #222222;
    
    /* Butonlar arasına dikey ayırıcı ekler */
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    
    padding: 0;
    margin: 0;
    appearance: textfield;
    -moz-appearance: textfield;
}

.chbs-number-counter input[type="number"]::-webkit-outer-spin-button,
.chbs-number-counter input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.ti-rating.ti-rating-large {
    display: none !important;
}

/* ========================================= */
/* Alınış Saatleri Genel Stilleri */
/* ========================================= */

/* Ana Kart Kapsayıcısı */
.chbs-transfer-card-v3 {
    background-color: #ffffff;
    border-radius: 12px;
    margin-top: 15px;
    padding: 12px;
}

/* Her bir yolculuk bacağı (Gidiş veya Dönüş) */
.chbs-trip-leg-v3 {
    padding: 8px 0;
}

/* Başlık alanı */
.chbs-leg-header-v3 h4 {
    margin: 0;
    font-size: 14px;
    color: #222;
    font-weight: 600;
    margin-bottom: 6px;
}

/* Bilgi satırı (Tarih ve Saat) - Tüm Ekranlar */
.chbs-leg-info-v3 {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    padding: 8px 10px;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.chbs-leg-info-time {
    order: 1;
    font-size: 16px;
    font-weight: 700;
    color: #000;
    margin-right: 12px;
}

.chbs-leg-info-date {
    order: 2;
    font-size: 13px;
    color: #666;
    white-space: nowrap;
}

/* Yolculuklar arası ayırıcı çizgi */
.chbs-leg-divider-v3 {
    border: none;
    border-top: 1px solid #f0f0f0;
    margin: 8px 0;
}

/* Kart altındaki uyarı notu */
.chbs-footnote-v3 {
    font-size: 12px;
    text-align: center;
    margin: 5px 0 0 0;
    padding: 8px 8px 4px 8px;
    border-top: 1px solid #f0f0f0;
    line-height: 1.5;
}

.chbs-footnote-shuttle, .chbs-footnote-private {
    color: #666;
    font-weight: 500;
}

/* Minimal Vehicle Description Collapsible Sections */
.vehicle-details-collapsible.expanded {
    margin: 15px 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.vehicle-details-toggle-btn {
    display: block;
    margin: 15px 0 0 0;
    align-items: center !important;
    justify-content: center !important;
    background: #00407c;
    color: white;
    padding: 8px 16px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    position: relative;
    overflow: hidden;
    text-align: center;
}

.vehicle-details-toggle-btn:hover {
    background: #005a87;
    color: white;
    text-decoration: none;
    transform: translateY(-1px);
}

/* Hide button (expanded state) - Red tones */
.vehicle-details-toggle-btn.expanded {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
}

.vehicle-details-toggle-btn .toggle-icon {
    display: inline-block;
    margin-left: 6px;
    font-size: 10px;
}

.vehicle-details-toggle-btn.expanded .toggle-icon {
    transform: rotate(1deg);
}

/* Minimal content styling for collapsible sections - No hover effects */
.vehicle-details-collapsible .vehicle-features,
.vehicle-details-collapsible .baggage-rules,
.vehicle-details-collapsible .transfer-benefits {
    margin: 8px;
    padding: 10px 10px;
    background: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid #007cba;
    transition: none;
}

/* Eklenti ikonunu gizleme */
.chbs-number-counter .chbs-meta-icon-2 {
    display: none !important;
}


.chbs-booking-extra-header span:last-of-type {
    /* Metnin kalın (bold) olmasını sağlar */
    font-weight: bold !important;
    
    /* Metnin asla satır atlamamasını sağlar */
    white-space: nowrap !important;
    
    /* Font boyutunu dinamik olarak ayarlar */
    /* Min: 16px, İdeal: Ekran genişliğinin %4'ü, Max: 22px */
    font-size: clamp(1rem, 4vw, 1.375rem) !important;
}

/* Mobil Duyarlı Navigasyon Butonları — Yazı ve Ok İkonu Ekran Boyutuna Göre Orantılı Küçülür/Büyür */
.chbs-main-content-navigation-button a.chbs-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: clamp(0.9rem, 2.5vw, 1.1rem) !important; /* ekran boyutuna göre orantılı font */
    padding: 1em 2em !important;
    gap: 0.5em !important;
    width: 100% !important;
    max-width: 100% !important;
    line-height: 1 !important;
}

.chbs-main-content-navigation-button .chbs-meta-icon-arrow-horizontal-large {
    font-size: clamp(1rem, 3vw, 1.3rem) !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
}

/* ========================================= */
/* CHBS ARAÇ VE REZERVASYON BİLGİLERİ */
/* ========================================= */

/* Araç Meta Bilgisi */
.chbs-vehicle-content-meta-info {
    display: flex !important;
    justify-content: space-around !important;
    width: 100% !important;
}

/* Araç Açıklaması */
.chbs-vehicle-content-description.chbs-state-open p {
    margin-right: 7px !important;
    margin-left: 7px !important;
}

.vehicle-select-button {
    padding: 10px 20px !important;
    font-size: 15px !important;
    color: #ffffff !important;
    background-color: #FF6629 !important;
    border: none !important;
    border-radius: 10px !important;
}

.vehicle-select-button:hover {
    transform: scale(1.05) !important;
}

.vehicle-select-button.selected {
    background-color: #2ecc71 !important; /* Yeşil */
    color: #ffffff !important;
    transform: scale(1.05) !important;
}

.vehicle-select-button.selected:hover {
    background-color: #27ae60 !important; /* Daha koyu yeşil */
}

.price-note {
    font-weight: bold;
    margin-bottom: 20px !important;
    margin-top: -30px !important;
    color: #009000;
}

.transfer-description {
    margin-bottom: 30px !important;
}

.baggage-rules, .transfer-benefits, .vehicle-features {
    font-weight: normal;
}

/* Ek Hizmetler ve Fiyat Özeti */
.chbs-booking-extra {
    margin-right: 15px !important;
    margin-left: 15px !important;
}

/* İkon ve Başlık Düzenlemeleri */
.vc_tta-icon {
    color: #152331;
    font-size: 20px !important;
}

.vc_tta-title-text {
    color: #152331;
    font-weight: bold;
    font-size: 22px;
}

/* Kalın Yazı Tipi Kullanımı */
.chbs-button.chbs-button, .chbs-form-label-group, .chbs-meta-icon-tick {
    font-weight: bold !important;
}

/* İkon Boyutlandırmaları */
.chbs-meta-icon-people, .chbs-meta-icon-bag {
    font-size: 40px !important;
}

/* Daire İkonları */
.chbs-circle {
    font-size: 22px !important;
}

/* İçerik Navigasyon Düğmesi */
.chbs-main-content-navigation-button {
    display: flex;
    justify-content: center;
}

/* Artı ve Eksi İkonları */
.chbs-meta-icon-plus, .chbs-meta-icon-minus {
    font-weight: 1000 !important;
    font-size: 24px !important;
}

/* Placeholder Yazı Stili */
.chbs-tab input[type="text"]::placeholder,
.chbs-box-shadow input[type="text"]::placeholder,
.ui-tabs input[type="text"]::placeholder,
.ui-corner-all input[type="text"]::placeholder,
.ui-widget input[type="text"]::placeholder,
.ui-widget-content input[type="text"]::placeholder,
.ui-selectmenu-text {
    font-size: 16px;
}

/* Araç markaları bölümü */

.vehicle-brands-section {
    margin-top: 15px;
}

.section-title {
    font-weight: 600;
    margin-bottom: 8px;
    display: block;
    font-size: 15px;
}

.vehicle-brand-list {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.vehicle-brand-card {
    background: linear-gradient(135deg, #ffffff, #f0f0f0);
    border-radius: 3px;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 500;
    color: #333;
}

.vehicle-info-note {
    font-size: 12.5px;
    color: #888;
    margin-bottom: 6px;
    line-height: 1.5;
    margin-left: 2px;
}

/* "Transfer for Anywhere" sekmesi içindeki "Return Transfer" kutusu - AKTİF */
/*
#anywhere-transfer-1 .chbs-form-field-transfer-type {
    display: none !important;
}
*/

/* ========================================= */
/* Her Yere Transfer Ok İşareti Bilgi Mesajı */
/* ========================================= */

/* Her bir transfer bölümü section'ı relative yapıldı */
#rideandgoo-transfer-section-1,
#rideandgoo-transfer-section-2 {
    position: relative;
}

/* Genel Ok ve Mesaj Tasarımı */
.arrow-message {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 10px; /* Ok ve metin arasındaki boşluk */
    font-size: 16px;
    font-weight: bold;
    z-index: 1000;
    min-height: 90px; /* Yer tutması için minimum yükseklik */
    padding: 0px 5px;
}

.arrow-icon {
    width: 80px; /* Ok boyutu */
    height: auto;
    transform: rotate(-30deg); /* Oku sağa döndür */
}

.arrow-text {
    max-width: 170px; /* Metin alanını daralt */
    font-size: 14px; /* Yazı boyutunu küçült */
    font-weight: bold; /* Kalın yazı */
    color: #4A4A4A; /* Yumuşak gri tonu */
    line-height: 1.2; /* Satır aralığını ayarla */
    text-align: left; /* Sola hizala */
    margin: 0; /* Varsayılan dış boşluğu kaldır */
}

/* Sekme butonundaki location ikonuna özel tanım */
.location-icon {
    margin-right: 2px;
}

/* Fade animasyonu (kullanılacaksa) */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========================================= */
/* Benefit Alanı */
/* ========================================= */

/* === Ana Benefit Alanı: Kartların dizildiği genel kapsayıcı === */
.rideandgoo-benefits {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    margin: 40px 0 20px;
}

/* === Benefit Kartları: Her bir kutunun temel stili === */
.benefit-box {
    position: relative;
    flex: 1 1 180px;
    min-width: 140px;
    max-width: 220px;
    text-align: center;
    background: #fff;
    border: 1px solid #eee;
    padding: 20px 12px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    cursor: pointer;
}

.benefit-box:hover {
    background-color: #f9f9f9;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.benefit-box i {
    font-size: 24px;
    color: #f25c05;
    margin-bottom: 10px;
    display: block;
}

.benefit-box p {
    margin: 0;
    font-weight: 500;
    font-size: 14px;
    color: #333;
}

/* === Sol Üst Etiket: Gift! gibi ibareler için === */
.benefit-label {
    position: absolute;
    top: 8px;
    left: 8px;
    background-color: #127c0b;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    padding: 2px 6px;
    border-radius: 15px;
    z-index: 2;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* === Tooltip (Soru işareti üzerine gelince bilgi çıkması) === */
.benefit-box .info-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #114;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    text-align: center;
    line-height: 18px;
    cursor: pointer;
}

.benefit-box .info-icon:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    top: -35px;
    right: 0;
    background-color: #333;
    color: #fff;
    padding: 6px 10px;
    font-size: 12px;
    white-space: nowrap;
    border-radius: 6px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    z-index: 100;
}

/* === Popup Overlay (Karanlık arka plan) === */
#benefitModalOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    z-index: 9998;
}

/* === Popup Kutusu (Ortada çıkan modal) === */
#benefitModal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    max-width: 500px;
    width: 90%;
    padding: 30px 25px;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    z-index: 9999;
    display: none;
}

/* === Modal Kapat Butonu === */
#benefitModal .close-button {
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 40px;
    color: #333;
    font-weight: bold;
    cursor: pointer;
    transition: color 0.2s;
    z-index: 10000; /* En üstte */
}

#benefitModal .close-button:hover {
    color: #f25c05;
}


/* ========================================= */
/* BLOG SAYFASI VE İÇİNDEKİLER BÖLÜMÜ TASARIMI */
/* ========================================= */

/* Blog Meta Bilgisi */
.cz_post_meta.mt10.mb10 {
    display: none;
}

/* İçindekiler Kutusu Genel Ayarlar */
.rideandgoo-blog-toc-box {
    border: 1px solid #ddd;
    padding: 20px;
    background: linear-gradient(135deg, #ffffff 60%, #f4f4f4);
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
    max-width: 100%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* İçindekiler Başlık Ayarları */
.rideandgoo-blog-toc-box-heading {
    font-size: 1.5em;
    font-weight: 700;
    margin-bottom: 15px;
    color: #172432;
    text-transform: uppercase;
    text-align: center;
}

/* İçindekiler Listesi */
.rideandgoo-blog-toc-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* İçindekiler Liste Öğeleri */
.rideandgoo-blog-toc-list-item {
    display: flex;
    align-items: center;
    margin: 10px 0;
    padding: 10px 0;
    border-bottom: 1px solid #e6e6e6;
    transition: background-color 0.3s ease;
}

/* Liste Öğesi İkonları */
.rideandgoo-blog-toc-icon {
    width: 10px;
    height: 10px;
    background: linear-gradient(135deg, #fe783d, #ffae00);
    border-radius: 50%;
    margin-right: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease;
}
.rideandgoo-blog-toc-list-item:hover .rideandgoo-blog-toc-icon {
    transform: scale(1.2); /* Hover durumunda ikonu büyütür. */
}

/* İçindekiler Bağlantıları */
.rideandgoo-blog-toc-link {
    color: #172432;
    text-decoration: none;
    font-weight: 600;
    font-size: 1em;
    transition: color 0.3s ease;
}
.rideandgoo-blog-toc-link:hover {
    color: #fe783d; /* Hover durumunda dikkat çekici bir renk değişimi yapılır. */
}

/* ========================================= */
/* KONTEYNER STİLLERİ */

/* Konteyner 1 Stilleri */
/* ========================================= */

/* Tab 1 için ana konteyner */
#transfer-tabs-1 {
    width: 100%;
    margin: 30px auto;
    border-radius: 25px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

/* Tab 1 için butonların bulunduğu alan */
#transfer-tabs-1 .tab-buttons {
    display: flex;
    justify-content: space-evenly;
    padding: 10px;
    background-color: #f9f9f9;
    border-bottom: 2px solid #ddd;
}

/* Tab 1 için her bir buton */
#transfer-tabs-1 .tab-button {
    background-color: transparent;
    border: none;
    font-size: 20px; /* Orijinal font boyutu */
    font-weight: bold;
    padding: 10px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: border-bottom 0.3s, color 0.3s;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    white-space: normal;
    color: #172432;
}

/* Tab 1 için buton içindeki ikonlar */
#transfer-tabs-1 .tab-button i {
    font-size: 24px; /* İkon boyutu */
    color: #172432;
    margin-bottom: 5px;
}

/* Tab 1 için buton başlıkları */
#transfer-tabs-1 .tab-button h2 {
    font-size: 18px; /* Başlık boyutu */
    font-weight: bold;
    margin: 0;
    line-height: 1.2; /* Başlık arası mesafe */
    color: #172432;
    text-align: center;
}

/* Tab 1 için aktif buton */
#transfer-tabs-1 .tab-button.active {
    border-bottom: 3px solid #fe783d;
    color: #fe783d;
}

/* Tab 1 için aktif buton ikonu */
#transfer-tabs-1 .tab-button.active i {
    color: #fe783d;
}

/* Tab 1 için aktif buton başlığı */
#transfer-tabs-1 .tab-button.active h2 {
    color: #fe783d;
}

/* Tab 1 için içerik alanı */
#transfer-tabs-1 .tab-content {
    display: none;
    padding: 30px;
    background-color: #f9f9f9;
}

/* Tab 1 için aktif içerik alanı */
#transfer-tabs-1 .tab-content.active {
    display: block;
}

/* ========================================= */
/* Konteyner 2 Stilleri */
/* ========================================= */


#transfer-tabs-1 .tab-content,
#transfer-tabs-2 .tab-content {
    min-height: 400px; /* Ortalama içerik boyutu kadar */
}

/* Tab 2 için ana konteyner */
#transfer-tabs-2 {
    width: 100%;
    margin: 20px auto;
    border-radius: 25px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

/* Tab 2 için butonların bulunduğu alan */
#transfer-tabs-2 .tab-buttons {
    display: flex;
    justify-content: space-around;
    padding: 10px;
    background-color: #f9f9f9;
    border-bottom: 2px solid #ddd;
}

/* Tab 2 için her bir buton */
#transfer-tabs-2 .tab-button {
    background-color: transparent;
    border: none;
    font-size: 20px; /* Orijinal font boyutu */
    font-weight: bold;
    padding: 10px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: border-bottom 0.3s, color 0.3s;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    white-space: normal;
    color: #172432;
}

/* Tab 2 için buton içindeki ikonlar */
#transfer-tabs-2 .tab-button i {
    font-size: 24px; /* İkon boyutu */
    color: #172432;
    margin-bottom: 5px;
}

/* Tab 2 için buton başlıkları */
#transfer-tabs-2 .tab-button h4 {
    font-size: 16px; /* Başlık boyutu */
    font-weight: bold;
    margin: 0;
    line-height: 1.2; /* Başlık arası mesafe */
    color: #172432;
    text-align: center;
}

/* Tab 2 için aktif buton */
#transfer-tabs-2 .tab-button.active {
    border-bottom: 3px solid #fe783d;
    color: #fe783d;
}

/* Tab 2 için aktif buton ikonu */
#transfer-tabs-2 .tab-button.active i {
    color: #fe783d;
}

/* Tab 2 için aktif buton başlığı */
#transfer-tabs-2 .tab-button.active h4 {
    color: #fe783d;
}

/* Tab 2 için içerik alanı */
#transfer-tabs-2 .tab-content {
    display: none;
    padding: 30px;
    background-color: #f9f9f9;
}

/* Tab 2 için aktif içerik alanı */
#transfer-tabs-2 .tab-content.active {
    display: block;
}


/* ========================================= */
/* POPÜLER ROTALAR - ROTA KUTULARI */
/* ========================================= */

/* Popüler Rotalar Daha Fazla Göster Butonu */
.rideandgoo-route-box {
    display: none;
}

.rideandgoo-load-more-btn {
    background-color: #ff5e14;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 12px 24px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
}

.rideandgoo-load-more-btn:hover {
    background-color: #e65010;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.rideandgoo-load-more-btn:active {
    transform: scale(0.98);
}

/* RideAndGoo Rotaları Konteyneri */
#rideandgoo-routes {
    background-color: #f4f4f4;
    padding: 20px;
}
.rideandgoo-route-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.rideandgoo-route-box {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    margin: 10px;
    padding: 20px;
    width: 250px;
    text-align: center;
    transition: transform 0.3s ease;
}
.rideandgoo-route-box h3 {
    font-size: 17px;
    margin: 0;
    color: #333;
    font-weight: 600;
    line-height: 1;
}
.rideandgoo-route-box .rideandgoo-arrow {
    font-size: 14px;
    display: block;
    color: #333;
    margin: 3px 0;
}
.rideandgoo-route-box .rideandgoo-destination {
    font-size: 17px;
    color: #333;
    font-weight: 600;
}
.rideandgoo-route-box p.rideandgoo-price-info {
    font-size: 14px;
    color: #283038;
    margin: 5px 0;
}
.rideandgoo-route-box a {
    text-decoration: none;
    color: #fe783d;
    font-weight: bold;
    font-size: 14px;
    transition: color 0.3s ease;
}
.rideandgoo-route-box:hover {
    transform: translateY(-5px);
}

/* ========================================= */
/* SIK SORULAN SORULAR (FAQ) SAYFASI */
/* ========================================= */

/* Kategori Başlıkları */
.rag-category {
    font-weight: bold;
    padding: 1em;
    border-radius: 20px 20px 0px 0px;
    margin-bottom: 0.1em;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s ease;
}

/* Kategori Renkleri */
.general-info { background-color: #3498db; color: #ffffff; }
.reservation { background-color: #ff7a00; color: #ffffff; }
.cancellation { background-color: #2ecc71; color: #ffffff; }
.special-requests { background-color: #9b59b6; color: #ffffff; }
.shared-transfers { background-color: #e74c3c; color: #ffffff; }
.accessibility { background-color: #f39c12; color: #ffffff; }
.privacy-security { background-color: #16a085; color: #ffffff; }
.insurance { background-color: #34495e; color: #ffffff; }
.force-majeure { background-color: #7f8c8d; color: #ffffff; }

/* SSS İçeriği */
.rag-faq-section {
    background-color: #ffffff;
    border-radius: 0px 0px 20px 20px;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
    margin-bottom: 4em;
    overflow: hidden;
}

.rag-faq-question {
    padding: 0.9em;
    font-weight: bold;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #d5dbdb;
    transition: background-color 0.3s ease;
}

.rag-faq-question:hover {
    background-color: #e0e7ed;
}

.rag-faq-answer {
    padding: 1em;
    display: none;
    line-height: 1.6;
    background-color: #f9f9f9;
}

.rag-icon {
    font-size: 1.2em;
    transition: transform 0.3s ease;
    color: inherit;
}

.rag-category.active .rag-icon,
.rag-faq-question.active .rag-icon {
    transform: rotate(180deg);
}


/* ========================================= */
/* ANA SAYFA: EN POPÜLER BÖLGELER TASARIMI */
/* ========================================= */

/* Genel Alan */
.rideandgoo-location-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 35px;
    padding: 20px;
    text-align: center;
}

/* Her bir kart */
.rideandgoo-location-card {
    border-radius: 25px;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
    border: 2px solid #fe783d;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);

}

/* Siyah şeffaf kaplama */
.rideandgoo-location-card::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); /* Hafif şeffaf kaplama */
}

/* Metin ve arka plan */
.rideandgoo-location-card span {
    background-color: #fe783d; /* Turuncu arka plan */
    color: #fff; /* Beyaz metin */
    padding: 5px 13px;
    border-radius: 9px;
    font-size: 15px;
    font-weight: bold;
    position: absolute;
    bottom: 20px;
    text-align: center;
    z-index: 2;
}

/* Hover Durumu */
.rideandgoo-location-card:hover {
    transform: scale(1.03);
    box-shadow: 0 6px 10px rgba(254, 120, 61, 0.6); /* Daha güçlü turuncu gölge */
}

.rideandgoo-location-card:hover span {
    background-color: #162432; /* Lacivert arka plan */
}

/* ========================================= */
/* MOBİL CİHAZLAR İÇİN CSS (Maksimum 767px) */
/* ========================================= */

@media (max-width: 767px) {
    /* ========================================= */
    /* Sayfa Başlığı Stilleri */
    /* ========================================= */

    /* Alt Başlığı Gizle */
    .rideandgoo-page-header .subheading {
        display: none;
    }
	
    /* H1 Başlık Boyutu */
    .rideandgoo-page-header h1 {
        font-size: 26px;
    }

    /* H2 Başlık Boyutu ve Aralık */
    .rideandgoo-page-header h2 {
        font-size: 26px;
    }
    .rideandgoo-page-header h2::after {
        margin: 10px auto 10px;
    }

    /* ========================================= */
    /* Rezervasyon Adımları Margin Ayarları */
    /* ========================================= */

    /* Adım 1 Margin Ayarları */
    .chbs-main-content-step-1 {
        margin-top: -70px;
        margin-right: -20px;
        margin-left: -20px;
    }

    /* Adım 2 Margin Ayarları */
    .chbs-main-content-step-2 {
        margin-top: -40px;
        margin-right: -10px;
        margin-left: -10px;
    }

    /* Adım 3 ve 4 Margin Ayarları */
    .chbs-main-content-step-3,
    .chbs-main-content-step-4 {
        margin-top: -60px;
        margin-right: -20px;
        margin-left: -20px;
    }

    /* ========================================= */
    /* Navigasyon ve Gereksiz Elemanların Gizlenmesi */
    /* ========================================= */

    /* Navigasyon ve Oklar */
    .chbs-main-navigation-responsive.chbs-box-shadow.chbs-clear-fix,
    .slick-prev,
    .slick-arrow,
    .slick-dots,
    .chbs-vehicle-content-meta-info {
        display: none !important;
    }

    /* ========================================= */
    /* Araç Fiyat ve Başlık Düzenlemeleri */
    /* ========================================= */

    /* Fiyat ve Başlık Hizalaması */
    .chbs-vehicle-content-price span,
    .chbs-vehicle-content-header span {
        text-align: center !important;
        display: block !important;
        font-weight: 600 !important;
    }

    /* Araç Fiyat Hizalaması */
    .chbs-vehicle-content-price {
        text-align: center !important;
        display: block !important;
    }

    .price-note {
        text-align: center !important;
        font-size: 13px;
        margin-bottom: 10px;
    }

    .transfer-description, .baggage-rules, .baggage-rules, .transfer-benefits, .vehicle-features {
        text-align: center !important;
        font-size: 15px;
        margin-bottom: 15px !important;
    }

    .custom-select-button-container {
        text-align: center;
        margin-top: 30px;
        margin-bottom: 20px;
    }

    /* Araç Marka bölümü */
    .vehicle-brand-list {
        justify-content: center; /* mobilde ortala */
    }

    .vehicle-info-note {
        text-align: center;
    }

    /* ========================================= */
    /* Genel Arkaplan Renk Ayarları */
    /* ========================================= */

    /* Kolon Arkaplanını Beyaz Yap */
    .chbs-column-2 {
        background-color: #ffffff !important;
    }

    /* ========================================= */
    /* Placeholder Yazı Stili */
    /* ========================================= */

    /* Placeholder Yazı Boyutunu Küçült */
    .chbs-tab input[type="text"]::placeholder,
    .chbs-box-shadow input[type="text"]::placeholder,
    .ui-tabs input[type="text"]::placeholder,
    .ui-corner-all input[type="text"]::placeholder,
    .ui-widget input[type="text"]::placeholder,
    .ui-widget-content input[type="text"]::placeholder,
    .ui-selectmenu-text {
        font-size: 14px;
    }

    /* ========================================= */
    /* Rezervasyon Adımı 1 */
    /* ========================================= */

    /* Yetişkin ve Çocuk Alanları */
    .chbs-main-content-step-1 .chbs-clear-fix {
        display: flex;
        flex-wrap: wrap;
    }

    /* Ride Info Hizalaması */
    .chbs-main-content-step-1 .chbs-clear-fix .chbs-form-field.chbs-form-field-width-50 {
        flex: 1 1;
    }

    /* Ride Info Alanları */
    .chbs-main-content-step-1 .chbs-ride-info {
        display: flex !important;
        justify-content: space-around !important;
        align-items: center !important;
    }
    .chbs-main-content-step-1 .chbs-ride-info > div {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }
    .chbs-main-content-step-1 .chbs-ride-info > div span {
        margin: 5px 0 !important;
    }

    /* ========================================= */
    /* Transfer Tabs Genel Stilleri */
    /* ========================================= */

    #transfer-tabs-1 .tab-content,
    #transfer-tabs-2 .tab-content {
        min-height: 300px;
    }

    /* Tab İçerik Padding */
    #transfer-tabs-1 .tab-content,
    #transfer-tabs-2 .tab-content {
        padding-right: 20px;
        padding-left: 20px;
        padding-top: 8px;
        padding-bottom: 0px;
        margin-bottom: -10px;
    }

    /* Tab Butonları */
    #transfer-tabs-1 .tab-button,
    #transfer-tabs-2 .tab-button {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        font-size: 14px;
        padding: 8px;
        gap: 4px;
        text-align: center;
    }

    /* Tab İkon Stilleri */
    #transfer-tabs-1 .tab-button i,
    #transfer-tabs-2 .tab-button i {
        font-size: 18px;
        margin-bottom: 2px;
    }

    /* Tab Başlık Stilleri */
    #transfer-tabs-1 .tab-button h2,
    #transfer-tabs-2 .tab-button h4 {
        font-size: 12px;
        line-height: 1.3;
        margin: 0;
        white-space: normal;
    }

    /* ========================================= */
    /* Her Yere Transfer Ok İşareti (Mobil) */
    /* ========================================= */

    .arrow-icon {
        width: 40px; /* Mobilde ok boyutunu küçült */
        height: auto;
        aspect-ratio: 1/1; /* Görselin oranını belirt */
    }

    .arrow-text {
        font-size: 8px; /* Mobilde metin boyutunu küçült */
        max-width: 80px; /* Metin alanını daralt */
        transform: none;
    }

    .arrow-message {
        gap: 5px; /* Mobilde ok ve metin arasındaki boşluğu azalt */
        min-height: 60px;
        padding: 0px 0px;
    }

    /* ========================================= */
    /* Rota Kutuları (Mobil) */
    /* ========================================= */

    /* Rota Kutuları Genişlik */
    .rideandgoo-route-box {
        width: 100%;
    }

    /* Lokasyon Kartları */
    .rideandgoo-location-cards {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 11px;
    }

/* ========================================= */
/* Popüler Bölgeler (Mobil) */
/* ========================================= */

/* Lokasyon kartlarındaki resimleri mobil görünümde gizler */
.rideandgoo-location-card img {
    display: none;
}

/* Lokasyon kartlarının içindeki span elementlerinin konumunu ayarlar */
.rideandgoo-location-card span {
    position: relative;
    bottom: 0;
}

/* Lokasyon kartlarının öncesine eklenen pseudo-elementi gizler */
.rideandgoo-location-card::before {
    display: none;
}

/* Lokasyon kartlarındaki gölgeyi kaldırır */
.rideandgoo-location-card {
    box-shadow: none;
}

/* Lokasyon kartlarının üzerine gelindiğinde gölge efektini devre dışı bırakır */
    .rideandgoo-location-card:hover {
        box-shadow: none;
    }

    /* Araç Seçim Ekranı Ekstra Seçenekler Başlığı */
    .chbs-booking-extra-header {
        display: flex;
        align-items: center;
    }

    .chbs-booking-extra-header span:last-child {
        font-size: inherit !important;
        white-space: nowrap !important;
    }

    /* Form 3. adım düğme ve toplam bölümü kenar boşlukları */
    .chbs-summary-price-element,
    .chbs-main-content-navigation-button {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }

    .chbs-main-content-step-3 .chbs-layout-column-left .chbs-summary {
        display: none;
    }

    /* Araç Seç Butonunu Haritanın Üzerine Taşı */
    .chbs-main-content-step-1 {
        display: flex !important;
        flex-direction: column !important;
    }

    .chbs-main-content-step-1 > .chbs-layout-50x50 {
        display: contents !important;
    }

    /* Sağ sütun (Harita vb.) */
    .chbs-layout-column-right {
        order: 3 !important;
        margin-bottom: 10px !important;
    }

    .chbs-layout-column-left {
        margin-bottom: 0 !important;
    }

    .chbs-main-content-navigation-button {
        order: 2 !important;
        margin-top: 20px !important;
        margin-bottom: 30px !important;
    }

    /* Form Adım 1'deki belirli öğeleri, formun genel mevcut adımına göre gizle */

/* Form Adım 2'deyken gizlenecek Adım 1 öğeleri (harita ve yolcu sayısı başlığı dahil) */
form[name="chbs-form"]:has(input[name="chbs_step"][value="2"]) .chbs-main-content-step-1 .chbs-form-field-transfer-type,
form[name="chbs-form"]:has(input[name="chbs_step"][value="2"]) .chbs-main-content-step-1 .chbs-form-field-return-date-time,
form[name="chbs-form"]:has(input[name="chbs_step"][value="2"]) .chbs-main-content-step-1 .chbs-form-field-passenger,
form[name="chbs-form"]:has(input[name="chbs_step"][value="2"]) .chbs-main-content-step-1 .chbs-google-map,
form[name="chbs-form"]:has(input[name="chbs_step"][value="2"]) .chbs-main-content-step-1 #panel-1 > label.chbs-form-label-group:nth-of-type(2) {
    display: none !important;
}

/* Form Adım 3, Adım 4, Adım 5 (veya bu mantıkla kapsanan sonraki adımlar) durumundayken gizlenecek Adım 1 öğeleri */
form[name="chbs-form"]:has(input[name="chbs_step"]:is([value="3"], [value="4"], [value="5"])) .chbs-main-content-step-1 #panel-1,
form[name="chbs-form"]:has(input[name="chbs_step"]:is([value="3"], [value="4"], [value="5"])) .chbs-main-content-step-1 .chbs-main-content-navigation-button > .chbs-button-step-next,
form[name="chbs-form"]:has(input[name="chbs_step"]:is([value="3"], [value="4"], [value="5"])) .chbs-main-content-step-1 .chbs-google-map,
form[name="chbs-form"]:has(input[name="chbs_step"]:is([value="3"], [value="4"], [value="5"])) .chbs-main-content-step-1 .chbs-ride-info {
    display: none !important;
}

    /* ========================================= */
    /* BENEFIT KUTULARI VE POPUPLAR MOBİL */
    /* ========================================= */
    .rideandgoo-benefits {
        gap: 12px;
        padding: 0 12px;
        margin: 30px 0 15px;
    }

    .benefit-box {
        box-sizing: border-box;
        flex-grow: 0;
        flex-shrink: 0;
        flex-basis: calc(50% - 6px);
        max-width: calc(50% - 6px);
        padding: 15px 10px;
        min-width: auto;
    }

    .benefit-box i {
        font-size: 22px;
        margin-bottom: 8px;
    }

    .benefit-box p {
        font-size: 13px;
        line-height: 1.4;
    }

    .benefit-box:nth-child(5) {
        display: none;
    }

    .benefit-label {
        font-size: 10px;
        padding: 2px 5px;
    }

    #benefitModal {
        padding: 20px 18px;
    }

    #benefitModal .close-button {
        font-size: 40px !important;
        z-index: 10000; /* En üstte */
    }

    #chbs_google_map {
        height: 200px !important;
    }
}

/* ========================================= */
/* TABLETLER İÇİN CSS (Maksimum 1199px) */
/* ========================================= */

@media (min-width: 768px) and (max-width: 1199px) {
    /* Tablet için özel stiller buraya eklenecek */
}

/* ========================================= */
/* ERCIYES SHUTTLE TIME SELECTION            */
/* ========================================= */

.chbs-erciyes-time-options {
    display: flex;
    flex-direction: row;
    gap: 12px;
    margin-top: 15px;
    width: 100%;
}

.chbs-erciyes-option {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    min-height: 70px;
    padding: 14px 8px;
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    background: linear-gradient(180deg, #ffffff 0%, #f9fafb 100%);
    text-align: center;
}

.chbs-erciyes-option:hover {
    border-color: #fe783d;
    background: linear-gradient(180deg, #fff8f5 0%, #fff0ea 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(254, 120, 61, 0.15);
}

.chbs-erciyes-option.chbs-selected {
    border-color: #fe783d;
    background: linear-gradient(180deg, #fff8f5 0%, #ffe8dd 100%);
    box-shadow: 0 4px 16px rgba(254, 120, 61, 0.25), inset 0 0 0 1px rgba(254, 120, 61, 0.1);
    transform: translateY(-2px);
}

/* Hide radio input completely */
.chbs-erciyes-option input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

/* Time display - big and bold */
.chbs-erciyes-option .chbs-option-time {
    font-weight: 700;
    font-size: 16px;
    color: #1f2937;
    letter-spacing: -0.02em;
    line-height: 1.2;
    white-space: nowrap;
}

.chbs-erciyes-option.chbs-selected .chbs-option-time {
    color: #ea580c;
}

/* Erciyes leg container */
.chbs-erciyes-leg .chbs-leg-info-v3 {
    flex-direction: column;
    align-items: flex-start;
}

/* Footnote styling for shuttle */
.chbs-footnote-shuttle {
    display: block;
    margin-top: 12px;
    padding: 10px 14px;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-radius: 8px;
    border-left: 3px solid #f59e0b;
    font-size: 13px;
    color: #92400e;
}

/* ===== MOBILE RESPONSIVE ===== */
@media (max-width: 767px) {
    .chbs-erciyes-time-options {
        flex-direction: column;
        gap: 10px;
    }
    
    .chbs-erciyes-option {
        flex-direction: row;
        justify-content: center;
        align-items: center;
        min-height: auto;
        padding: 14px 16px;
    }
    
    .chbs-erciyes-option .chbs-option-time {
        font-size: 15px;
        white-space: nowrap;
    }
}