/* ==========================================================================
   HotelNerede — Villa detayı: derlemeden sonra eklenen bileşenler

   Sayfanın stilinin büyük bölümü tailwind.css içinde derlenmiş durumda.
   Bu dosya yalnız sonradan eklenen parçaları taşır; node_modules olmadığı
   için derlemeye dokunulmuyor.

   Şu an içinde: misafir seçici (yetişkin + çocuk açılır paneli).
   ========================================================================== */

.vd-misafir { position: relative; }

/* ---------- Açıcı düğme ----------
   Tarih alanlarıyla (.vd-tarih__alan) aynı ölçü ve çerçevede durmalı;
   ikisi rezervasyon kutusunda alt alta hizalanıyor. */
.vd-misafir__ac {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #ECECEC;
    border-radius: 10px;
    background: #FFFFFF;
    font-family: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}

.vd-misafir__ac:hover { border-color: #0692CF; }

.vd-misafir__ac[aria-expanded="true"] {
    border-color: #0692CF;
    box-shadow: 0 0 0 3px rgba(6, 146, 207, .12);
}

.vd-misafir__ac > i:first-child { color: #0692CF; font-size: 15px; flex-shrink: 0; }
.vd-misafir__ac > span { flex: 1; min-width: 0; }
.vd-misafir__ac strong { display: block; font-size: 14px; font-weight: 700; color: #333333; }

.vd-misafir__ok {
    font-size: 11px;
    color: #B1B1B1;
    flex-shrink: 0;
    transition: transform .18s;
}

.vd-misafir__ac[aria-expanded="true"] .vd-misafir__ok { transform: rotate(180deg); }

/* ---------- Panel ---------- */
.vd-misafir__panel {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 60;
    padding: 16px;
    border-radius: 14px;
    background: #FFFFFF;
    box-shadow: 0 18px 44px rgba(16, 24, 40, .18);
    border: 1px solid #ECECEC;
}

.vd-misafir__panel[hidden] { display: none; }

.vd-misafir__satir {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 0;
}

.vd-misafir__satir + .vd-misafir__satir { border-top: 1px solid #F2F4F7; }
.vd-misafir__satir strong { display: block; font-size: 14px; font-weight: 700; color: #333333; }
.vd-misafir__satir span { display: block; margin-top: 1px; font-size: 12px; color: #98A2B3; }

.vd-misafir__not {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 12px 0 0;
    padding: 10px 12px;
    border-radius: 9px;
    background: #F5FAFD;
    font-size: 12px;
    line-height: 1.55;
    color: #475467;
}

.vd-misafir__not i { margin-top: 2px; color: #0692CF; flex-shrink: 0; }

.vd-misafir__tamam {
    width: 100%;
    margin-top: 12px;
    padding: 11px;
    border: 0;
    border-radius: 10px;
    background: #0692CF;
    color: #FFFFFF;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s;
}

.vd-misafir__tamam:hover { background: #0578ab; }

/* Kapasite dolduğunda çıkan uyarı, panelin altında da okunur kalsın */
.vd-kisi__uyari[hidden] { display: none; }

/* ==========================================================================
   Takvim: çıkış beklenirken geçerli çıkış günleri

   Giriş seçildikten sonra takvimin geri kalanı soluklaşıyor; bu iyi, ama
   ziyaretçi "peki hangi güne basacağım" sorusuna görsel bir cevap bulamıyordu.
   Geçerli çıkış günleri bu yüzden ayrıca işaretlenir.

   Çıkış günü DOLU bir güne denk gelebilir (sıradaki rezervasyonun giriş günü).
   O günün üstü çizili gri stili burada eziliyor: seçilebilir olduğu halde
   "dolu" görünmesi yanıltıcıydı.
   ========================================================================== */
.vd-gun.is-cikis em {
    background: #EAF7FD;
    box-shadow: inset 0 0 0 1px #7FC9EA;
    color: #17324A;
    text-decoration: none;
}

.vd-gun.is-cikis .vd-gun__fiyat { color: #0692CF; }

/* ---------- Aramadan taşınan tarih bu villaya uymadığında ---------- */
.vd-tarih__uyari {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0 0 12px;
    padding: 10px 12px;
    border: 1px solid #FEDF89;
    border-radius: 10px;
    background: #FFFAEB;
    font-size: 12.5px;
    line-height: 1.55;
    color: #B54708;
}

.vd-tarih__uyari i { margin-top: 2px; flex-shrink: 0; }

@media (prefers-reduced-motion: reduce) {
    .vd-misafir__ok, .vd-misafir__ac, .vd-misafir__tamam { transition: none; }
}