/* ------------------------------------------------------------------
   ADIMLI REZERVASYON FORMU
   ------------------------------------------------------------------
   Mobil once yazildi: tek sutun taban, genis ekranda iki sutuna acilir.
   Kendi sinif adlarini (ctv-rez-*) kullanir; sitedeki mevcut .field /
   .form-grid kurallariyla catismaz.
   ------------------------------------------------------------------ */

/* hidden ozniteligi HER ZAMAN kazanmali.
   .ctv-rez-satir{display:grid} gibi kurallar tarayicinin varsayilan
   [hidden]{display:none} kuralini eziyordu; bu yuzden "Noktadan
   Noktaya" secilince gizlenmesi gereken ucus alani ekranda kaliyordu. */
.ctv-rez [hidden] { display: none !important; }

.ctv-rez {
    --rez-turuncu: #ff7a1a;
    --rez-lacivert: #0b1628;
    --rez-cizgi: #e6e9f0;
    --rez-gri: #64748b;
    display: block;
    color: #0b1628;
}

/* ---------- adim cubugu ---------- */
.ctv-rez-adimlar {
    display: flex;
    gap: 6px;
    list-style: none;
    margin: 0 0 18px;
    padding: 0;
    counter-reset: adim;
}
.ctv-rez-adim {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--rez-gri);
    padding: 9px 4px 12px;
    border-bottom: 3px solid var(--rez-cizgi);
    counter-increment: adim;
    min-width: 0;
}
.ctv-rez-adim::before {
    content: counter(adim);
    flex: 0 0 auto;
    width: 21px; height: 21px;
    border-radius: 999px;
    background: var(--rez-cizgi);
    color: #fff;
    display: grid; place-items: center;
    font-size: 11.5px;
}
.ctv-rez-adim span {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ctv-rez-adim.aktif { color: var(--rez-lacivert); border-bottom-color: var(--rez-turuncu); }
.ctv-rez-adim.aktif::before { background: var(--rez-turuncu); }
.ctv-rez-adim.tamam::before { background: #16a34a; }

/* ---------- transfer tipleri ---------- */
/* MOBILDE SARILIR, kaydirilmaz: yatay kaydirma cubugu telefonda
   gorunmedigi icin musteri diger transfer tiplerinin varligini
   fark etmiyordu. Genis ekranda tek satirda kalir. */
.ctv-rez-tipler {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    overflow-x: visible;
    padding-bottom: 4px;
    margin-bottom: 14px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.ctv-rez-tipler::-webkit-scrollbar { display: none; }
.ctv-rez-tip {
    flex: 0 1 auto;
    background: #f4f6f9;
    border: 1px solid var(--rez-cizgi);
    border-radius: 999px;
    padding: 9px 15px;
    font-size: 13px;
    font-weight: 700;
    color: #475569;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s, color .15s, border-color .15s;
}
.ctv-rez-tip:hover { border-color: #cbd5e1; }
.ctv-rez-tip.secili {
    background: var(--rez-lacivert);
    border-color: var(--rez-lacivert);
    color: #fff;
}

/* ---------- alanlar ---------- */
.ctv-rez-satir { display: grid; grid-template-columns: 1fr; gap: 12px; margin-bottom: 12px; }
.ctv-rez-alan { position: relative; margin-bottom: 12px; }
.ctv-rez-satir .ctv-rez-alan { margin-bottom: 0; }

.ctv-rez-alan label,
.ctv-rez-baslik {
    display: block;
    font-size: 12.5px;
    font-weight: 800;
    color: #475569;
    margin-bottom: 6px;
}
.ctv-rez-baslik { margin-top: 4px; }

.ctv-rez-alan input[type="text"],
.ctv-rez-alan input[type="email"],
.ctv-rez-alan input[type="number"],
.ctv-rez-alan input[type="date"],
.ctv-rez-alan input[type="time"],
.ctv-rez-alan select,
.ctv-rez-alan textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--rez-cizgi);
    border-radius: 11px;
    padding: 13px 14px;
    font: inherit;
    font-size: 16px;          /* 16px altinda iOS sayfayi yakinlastirir */
    background: #fff;
    color: #0b1628;
}
.ctv-rez-alan input:focus,
.ctv-rez-alan select:focus,
.ctv-rez-alan textarea:focus {
    outline: 0;
    border-color: var(--rez-turuncu);
    box-shadow: 0 0 0 3px rgba(255,122,26,.13);
}
.ctv-rez-alan input[readonly] { background: #f8fafc; color: var(--rez-gri); }

.ctv-rez-ipucu { font-size: 12px; color: var(--rez-gri); margin-top: 6px; line-height: 1.45; }
.ctv-rez-durum { font-size: 12px; margin-top: 5px; min-height: 1px; }
.ctv-rez-durum.ok { color: #15803d; }
.ctv-rez-durum.err { color: #b91c1c; }

/* ---------- konum onerileri ---------- */
.ctv-konum-liste {
    position: absolute;
    left: 0; right: 0;
    top: calc(100% + 4px);
    z-index: 40;
    background: #fff;
    border: 1px solid var(--rez-cizgi);
    border-radius: 13px;
    box-shadow: 0 18px 46px rgba(7,20,41,.18);
    max-height: 268px;
    overflow-y: auto;
    overflow-x: hidden;
}
.ctv-konum-satir {
    display: block;
    width: 100%;
    text-align: left;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #f1f5f9;
    padding: 11px 13px;
    cursor: pointer;
    color: #0b1628;
}
.ctv-konum-satir:last-child { border-bottom: 0; }
.ctv-konum-satir:hover, .ctv-konum-satir:focus { background: #fff7ed; outline: 0; }
.ctv-konum-satir strong { display: block; font-size: 13.5px; line-height: 1.35; font-weight: 700; }
.ctv-konum-satir small { display: block; margin-top: 3px; font-size: 12px; color: var(--rez-gri); }
.ctv-konum-satir.kayitli { background: #fbfffc; border-left: 3px solid #16a34a; }
.ctv-konum-satir.kayitli:hover { background: #f0fdf4; }
.ctv-konum-rozet {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 999px;
    background: #dcfce7;
    color: #15803d;
    font-size: 10px;
    font-weight: 800;
    vertical-align: middle;
}

/* ---------- tur duraklari ---------- */
.ctv-rez-durak { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; position: relative; }
.ctv-rez-durak input[type="text"] { flex: 1 1 auto; }
.ctv-rez-durak-sil {
    flex: 0 0 auto;
    width: 38px;
    align-self: stretch;      /* kutu yuksekligi input ile ayni olsun */
    border: 1px solid var(--rez-cizgi);
    background: #fff;
    border-radius: 10px;
    font-size: 19px;
    line-height: 1;
    color: #b91c1c;
    cursor: pointer;
}
.ctv-rez-ekle {
    background: #eef2ff;
    color: #3730a3;
    border: 0;
    border-radius: 10px;
    padding: 10px 14px;
    font-weight: 800;
    font-size: 13px;
    cursor: pointer;
}

/* ---------- sayaclar ---------- */
.ctv-rez .ctv-icon-counter {
    display: flex;
    align-items: center;
    gap: 0;
    border: 1px solid var(--rez-cizgi);
    border-radius: 11px;
    overflow: hidden;
    background: #fff;
}
.ctv-rez .ctv-icon-counter .ctv-rez-ikon {
    flex: 0 0 auto;
    margin: 0 10px;
    opacity: .85;
}
.ctv-rez .ctv-icon-counter input {
    flex: 1 1 auto;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: center;
    box-shadow: none !important;
    -moz-appearance: textfield;
}
.ctv-rez .ctv-icon-counter input::-webkit-outer-spin-button,
.ctv-rez .ctv-icon-counter input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ctv-rez .ctv-counter-btn {
    flex: 0 0 auto;
    width: 44px;
    align-self: stretch;
    border: 0;
    border-left: 1px solid var(--rez-cizgi);
    background: #f8fafc;
    font-size: 19px;
    color: #334155;
    cursor: pointer;
}
.ctv-rez .ctv-counter-btn:active { background: #eef2f7; }

.ctv-rez-koltuklar { display: grid; grid-template-columns: 1fr; gap: 10px; margin-bottom: 14px; }
.ctv-rez-koltuk label { font-size: 12px; font-weight: 700; color: var(--rez-gri); }

/* ---------- arac kartlari ---------- */
.ctv-rez-mesafe {
    background: #f4f6f9;
    border-radius: 11px;
    padding: 11px 14px;
    font-size: 13.5px;
    color: #334155;
    margin-bottom: 14px;
}
.ctv-rez-araclar { display: grid; grid-template-columns: 1fr; gap: 12px; margin-bottom: 14px; }
.ctv-rez-yukleniyor { padding: 26px 10px; text-align: center; color: var(--rez-gri); font-size: 13.5px; }

.ctv-arac {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    text-align: left;
    background: #fff;
    border: 2px solid var(--rez-cizgi);
    border-radius: 15px;
    padding: 10px;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}
.ctv-arac:hover { border-color: #cbd5e1; }
.ctv-arac.secili {
    border-color: var(--rez-turuncu);
    box-shadow: 0 0 0 3px rgba(255,122,26,.12);
}
/* DOGRUDAN cocuk secici sart: ".ctv-arac img" kartin icindeki
   kapasite ikonlarina da uyuyordu ve onlari 124 px yapiyordu. */
.ctv-arac > img {
    flex: 0 0 auto;
    width: 124px;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 10px;
    background: #f4f6f9;
}
.ctv-arac-govde { flex: 1 1 auto; min-width: 0; }
.ctv-arac-govde strong { display: block; font-size: 14.5px; color: var(--rez-lacivert); }
.ctv-arac-kapasite { display: flex; gap: 12px; margin: 5px 0 6px; font-size: 12.5px; color: var(--rez-gri); }
.ctv-arac-kapasite span { display: inline-flex; align-items: center; gap: 4px; }
.ctv-arac-kapasite img { width: 15px; height: 15px; flex: 0 0 auto; opacity: .75; }
.ctv-arac-aciklama { font-size: 12px; color: var(--rez-gri); line-height: 1.4; margin-bottom: 5px; }
.ctv-arac-fiyat { font-size: 13px; }
.ctv-arac-fiyat .enaz { color: var(--rez-gri); font-size: 12px; }
.ctv-arac-fiyat b { font-size: 17px; color: #16a34a; }
.ctv-arac-fiyat .teklif { color: #b45309; font-weight: 700; font-size: 12.5px; }

/* Admin tarafindan o tarihlerde kapatilmis arac */
.ctv-arac-kapali {
    opacity: .55;
    cursor: not-allowed;
    background: #f8fafc;
}
.ctv-arac-kapali:hover { border-color: var(--rez-cizgi); }
.ctv-arac-kapali > img { filter: grayscale(1); }
.ctv-arac-fiyat .kapali { color: #b91c1c; font-weight: 800; font-size: 12.5px; }
.ctv-arac-kapali-not { font-size: 11.5px; color: var(--rez-gri); margin-top: 3px; }

/* ---------- ozet / not / hata ---------- */
.ctv-rez-ozet {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 14px;
    font-size: 13.5px;
    line-height: 1.5;
}
.ctv-rez-ozet small { color: var(--rez-gri); }
.ctv-rez-not {
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 11px;
    padding: 10px 13px;
    font-size: 12.5px;
    color: #9a3412;
    margin-bottom: 14px;
}
.ctv-rez-hata {
    display: none;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 11px;
    padding: 10px 13px;
    font-size: 13px;
    color: #b91c1c;
    margin-bottom: 12px;
}

/* ---------- butonlar ---------- */
.ctv-rez-butonlar { display: flex; gap: 10px; flex-wrap: wrap; }
.ctv-rez-ileri, .ctv-rez-gonder {
    flex: 1 1 auto;
    border: 0;
    border-radius: 12px;
    padding: 15px 20px;
    font-size: 15px;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, var(--rez-turuncu), #ffb13b);
    cursor: pointer;
    box-shadow: 0 12px 26px rgba(255,122,26,.24);
}
.ctv-rez-geri {
    flex: 0 0 auto;
    border: 1px solid var(--rez-cizgi);
    background: #fff;
    border-radius: 12px;
    padding: 15px 20px;
    font-size: 14px;
    font-weight: 700;
    color: #475569;
    cursor: pointer;
}
.ctv-rez-ileri:active, .ctv-rez-gonder:active { transform: translateY(1px); }

/* ---------- genis ekran ---------- */
@media (min-width: 720px) {
    .ctv-rez-satir { grid-template-columns: 1fr 1fr; gap: 14px; }
    .ctv-rez-koltuklar { grid-template-columns: repeat(3, 1fr); }
    .ctv-rez-adim { font-size: 13px; }
    .ctv-arac > img { width: 168px; }
    .ctv-rez-butonlar { justify-content: flex-end; }
    .ctv-rez-ileri, .ctv-rez-gonder { flex: 0 0 auto; min-width: 210px; }
}

/* ---------- ESKI MOBIL CSS'LERINE KARSI KALKAN ----------
   Site kokundeki mobile-hamburger-overflow-hardfix.css su iki kurali
   iceriyor (ve !important ile geliyor):

       .booking-card input  { display:block!important; width:100%!important }
       .booking-card button:not(.nav-toggle) { width:100%!important }

   Yeni form .booking-card icinde durdugu icin sayaclar bozuluyordu:
   sayi kutusu tum satiri kapliyor, "+" dugmesi tasip overflow:hidden
   yuzunden GORUNMEZ oluyordu (telefonda sadece "-" gorunur).

   Asagisi SADECE bu bileseni geri alir; sitedeki diger formlara
   dokunmaz. Genislikler flex ile verildigi icin width:auto guvenli. */
/* Ozgulluk notu: en guclu eski kural
       form[action*="create-booking"] button:not(.nav-toggle)   -> (0,2,2)
   Ayni seviyeye cikmadan !important bile yetmiyor. Iki :not() ile
   (0,3,1) seviyesine cikiyoruz; boylece hem o kurali hem de
   ".booking-card button:not(.nav-toggle)" kuralini gecebiliyoruz.
   Genislikleri zaten flex veriyor, width:auto guvenli. */
.ctv-rez button:not(.nav-toggle):not(.ctv-arac) {
    width: auto !important;
    max-width: none !important;
}
.ctv-rez button.ctv-arac:not(.nav-toggle) { width: 100% !important; }
.ctv-rez button.ctv-counter-btn:not(.nav-toggle) {
    width: 44px !important;
    min-width: 44px !important;
    flex: 0 0 44px !important;
}
.ctv-rez button.ctv-rez-durak-sil:not(.nav-toggle) {
    width: 38px !important;
    min-width: 38px !important;
    flex: 0 0 38px !important;
}
.ctv-rez .ctv-icon-counter > input:not([type="hidden"]) {
    width: auto !important;
    max-width: none !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    /* Yolcu/valiz sayaclari .ctv-rez-alan icinde durdugu icin oradaki
       "font: inherit" kurali font-weight'i sifirliyordu: rakamlar ince,
       koltuk sayaclarininki kalin gorunuyordu. Alti sayac da ayni. */
    font: inherit !important;
    font-size: 16px !important;      /* 16 alti iOS'ta sayfayi yakinlastirir */
    font-weight: 800 !important;
    color: var(--rez-lacivert) !important;
    text-align: center !important;
}
.ctv-rez .ctv-rez-durak > input[type="text"] {
    width: auto !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

/* Ayni dosya formu ZORLA grid yapiyor:
       .booking-card form { display:grid!important; grid-template-columns:1fr!important;
                            overflow-x:hidden!important }
   "1fr" sutunun alt siniri min-content oldugu icin sutun kartin
   disina tasiyor, form da overflow:hidden ile fazlaligi kesiyordu.
   Kesilen bolge tam olarak sayacin "+" dugmesinin durdugu yerdi.
   minmax(0,1fr) bu alt siniri kaldirir. */
.ctv-rez { grid-template-columns: minmax(0, 1fr) !important; }
.ctv-rez > *,
.ctv-rez .ctv-rez-satir,
.ctv-rez .ctv-rez-alan,
.ctv-rez .ctv-rez-koltuklar,
.ctv-rez .ctv-rez-koltuk { min-width: 0 !important; max-width: 100% !important; }