/* ============================================================
   EcrinVIP — front geneli (layout) stilleri. Tüm sayfalarda yüklenir.
   ============================================================ */

/* DateTimePicker teması (altın/siyah) */
.dtpicker-overlay { z-index: 2200; }
.dtpicker-cont { border: 1px solid #E5E5E5; border-radius: 16px; box-shadow: 0 18px 50px rgba(11,11,11,.20); overflow: hidden; }
.dtpicker-content { font-family: 'Inter', sans-serif; border-radius: 16px; }
.dtpicker-header .dtpicker-title { color: #0b0b0b; font-weight: 700; font-family: 'Montserrat', sans-serif; }
.dtpicker-header .dtpicker-value { color: #cd9c20; font-weight: 700; }
.dtpicker-header .dtpicker-close, .dtpicker-header .dtpicker-close:hover { color: #0b0b0b; }
.dtpicker-components .dtpicker-comp > * { color: #0b0b0b; }
.dtpicker-components .dtpicker-comp > :hover { color: #cd9c20; }
.dtpicker-components .dtpicker-compButton { color: #cd9c20; }
.dtpicker-overlay .dtpicker-compValue:focus { background: #f2f2f2; }
.dtpicker-buttonCont .dtpicker-button { border-radius: 10px; font-weight: 700; }
.dtpicker-buttonCont .dtpicker-buttonSet { background: #cd9c20; }
.dtpicker-buttonCont .dtpicker-buttonSet:hover { background: #c39a2f; }
.dtpicker-buttonCont .dtpicker-buttonClear { background: #0b0b0b; }
.dtpicker-buttonCont .dtpicker-buttonClear:hover { background: #2a2a2a; }

/* Gövde + tema bileşenleri */
body { background-color: #ffffff; color: #0b0b0b; font-family: 'Inter', sans-serif; }
h1,h2,h3,h4,h5,h6 { font-family: 'Montserrat', sans-serif; }
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
/* Rezervasyon kartı: net beyaz, kurumsal */
.glass-card { background: #ffffff; border: 1px solid #E5E5E5; box-shadow: 0 20px 50px rgba(11,11,11,.18); }
#main-nav.nav-scrolled { box-shadow: 0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -1px rgba(0,0,0,.06); }
/* Scroll-reveal animasyonu */
.reveal { opacity: 0; transform: translateY(26px);
  transition: opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--rd, 0ms); will-change: opacity, transform; }
.reveal.in-view { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1 !important; transform: none !important; transition: none !important; } }
/* Logo */
/* Logo kaynağı 200x50; net kalması için görüntü boyutu kaynağı aşmayacak şekilde sınırlandı.
   Daha büyük/keskin logo için en az ~400x100 px görsel yükleyin. */
.site-logo { height: 40px; width: auto; max-width: 200px; object-fit: contain; display: block;
             image-rendering: -webkit-optimize-contrast; backface-visibility: hidden; }
@media (min-width: 768px) { .site-logo { height: 44px; max-width: 200px; } }
@media (min-width: 1280px) { .site-logo { height: 48px; max-width: 200px; } }
/* Dil değiştirici */
.lang-switch { display: inline-flex; align-items: center; gap: 2px; padding: 3px;
               background: #f0f0f0; border: 1px solid rgba(11,11,11,.14); border-radius: 999px; }
.lang-opt { display: inline-flex; align-items: center; justify-content: center; min-width: 34px;
            padding: 5px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 700; letter-spacing: .04em;
            color: #43474d; line-height: 1; text-decoration: none; transition: color .15s, background .15s, box-shadow .15s; }
.lang-opt:hover { color: #0b0b0b; }
.lang-opt.is-active { background: #ffffff; color: #0b0b0b; box-shadow: 0 1px 2px rgba(11,11,11,.18); }
@media (max-width: 380px) { .lang-opt { min-width: 30px; padding: 5px 9px; font-size: 12px; } }
/* İçerik (prose) başlık hiyerarşisi */
.prose-content { color: #2b2f36; line-height: 1.75; font-size: 16px; }
.prose-content h1, .prose-content h2, .prose-content h3,
.prose-content h4, .prose-content h5, .prose-content h6 {
  font-family: "Montserrat", system-ui, sans-serif; color: #0b0b0b; font-weight: 700;
  line-height: 1.25; margin: 1.4em 0 .55em; letter-spacing: -.01em; }
.prose-content h1 { font-size: 32px; }
.prose-content h2 { font-size: 26px; padding-bottom: .3em; border-bottom: 1px solid rgba(17,20,26,.08); }
.prose-content h3 { font-size: 21px; }
.prose-content h4 { font-size: 18px; }
.prose-content h5 { font-size: 16px; text-transform: uppercase; letter-spacing: .04em; color: #45464d; }
.prose-content h6 { font-size: 14px; text-transform: uppercase; letter-spacing: .06em; color: #6b6d73; }
.prose-content h1:first-child, .prose-content h2:first-child, .prose-content h3:first-child { margin-top: 0; }
.prose-content p { margin-bottom: 1em; }
.prose-content strong { color: #11141a; font-weight: 700; }
.prose-content a { color: #cd9c20; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.prose-content ul { list-style: disc; padding-left: 1.5em; margin-bottom: 1em; }
.prose-content ol { list-style: decimal; padding-left: 1.5em; margin-bottom: 1em; }
.prose-content li { margin-bottom: .35em; }
@media (min-width: 768px) { .prose-content h1 { font-size: 38px; } .prose-content h2 { font-size: 28px; } }

/* Yatay carousel (popüler noktalar, yorumlar) */
.hcar { position: relative; }
.hcar-track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 6px 2px 16px; -ms-overflow-style: none; scrollbar-width: none; }
.hcar-track::-webkit-scrollbar { display: none; }
.hcar-item { scroll-snap-align: start; flex: 0 0 auto; }
.hcar-nav { position: absolute; top: 42%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 50%; background: #fff; border: 1px solid rgba(11,11,11,.12); box-shadow: 0 8px 22px rgba(11,11,11,.14); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 6; color: #0b0b0b; transition: background .15s, color .15s, opacity .15s; }
.hcar-nav:hover { background: #0b0b0b; color: #fff; }
.hcar-nav i { font-size: 22px; }
.hcar-prev { left: -10px; } .hcar-next { right: -10px; }
.hcar-nav[disabled] { opacity: .35; cursor: default; }
@media (max-width: 768px) { .hcar-nav { display: none; } }

/* Yukarı çık butonu — sağ alt, sayfa aşağı kayınca belirir (minimalist/modern) */
.scroll-top { position: fixed; right: 20px; bottom: 24px; z-index: 55; width: 50px; height: 50px; border: 0;
  border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center;
  background: #0b0b0b; color: #cd9c20; box-shadow: 0 8px 22px rgba(11,11,11,.28);
  opacity: 0; transform: translateY(18px) scale(.85); pointer-events: none;
  transition: opacity .35s cubic-bezier(.22,.61,.36,1), transform .35s cubic-bezier(.22,.61,.36,1), background .2s, color .2s; }
.scroll-top.show { opacity: 1; transform: none; pointer-events: auto; }
.scroll-top i { font-size: 24px; transition: transform .2s ease; }
.scroll-top:hover { background: #cd9c20; color: #0b0b0b; box-shadow: 0 12px 28px rgba(205,156,32,.4); transform: translateY(-3px); }
.scroll-top:hover i { transform: translateY(-2px); }
.scroll-top::after { content: ''; position: absolute; inset: -4px; border-radius: 50%; border: 1.5px solid rgba(205,156,32,.35);
  opacity: 0; transform: scale(.8); transition: opacity .35s, transform .35s; }
.scroll-top.show:hover::after { opacity: 1; transform: scale(1); }
@media (max-width: 640px) { .scroll-top { right: 14px; bottom: 16px; width: 46px; height: 46px; } }

/* Sabit iletişim butonları (float CTA) */
.float-cta { position: fixed; left: 18px; bottom: 22px; z-index: 50; display: flex; flex-direction: column; gap: 14px;
  opacity: 0; transform: translateY(16px) scale(.92); pointer-events: none;
  transition: opacity .45s cubic-bezier(.22,.61,.36,1), transform .45s cubic-bezier(.22,.61,.36,1); }
.float-cta.is-shown { opacity: 1; transform: none; pointer-events: auto; }
.fcta { position: relative; width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  color: #fff; text-decoration: none; box-shadow: 0 10px 26px rgba(17,20,26,.22);
  transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s ease; }
.fcta:hover { transform: translateY(-3px) scale(1.06); box-shadow: 0 16px 34px rgba(17,20,26,.30); }
.fcta:active { transform: scale(.96); }
.fcta-call { background: linear-gradient(135deg, #cd9c20 0%, #f5cb5c 120%); color: #ffffff; }
.fcta-wa { background: linear-gradient(135deg, #25D366 0%, #128C7E 130%); }
.fcta i { font-size: 26px; }
.fcta::before { content: ''; position: absolute; inset: 0; border-radius: 50%; z-index: -1;
  animation: fctaPulse 2.6s ease-out infinite; }
.fcta-wa::before { box-shadow: 0 0 0 0 rgba(37,211,102,.55); animation-delay: 1.3s; }
@keyframes fctaPulse { 0% { box-shadow: 0 0 0 0 currentColor; opacity: .5; } 70% { box-shadow: 0 0 0 16px currentColor; opacity: 0; } 100% { opacity: 0; } }
.fcta-call::before { color: rgba(205,156,32,.55); } .fcta-wa::before { color: rgba(37,211,102,.55); }
.fcta-label { position: absolute; left: 68px; white-space: nowrap; background: #1a1a1a; color: #fff;
  font-size: 13px; font-weight: 600; padding: 7px 13px; border-radius: 9px; opacity: 0; transform: translateX(-6px);
  pointer-events: none; transition: opacity .2s ease, transform .2s ease; box-shadow: 0 6px 16px rgba(0,0,0,.18); }
.fcta-label::before { content: ''; position: absolute; left: -5px; top: 50%; transform: translateY(-50%);
  border: 5px solid transparent; border-right-color: #1a1a1a; }
.fcta:hover .fcta-label { opacity: 1; transform: none; }
@media (max-width: 767px) { .fcta-label { display: none; } .float-cta { left: 14px; bottom: 16px; } }
@media (prefers-reduced-motion: reduce) { .fcta::before { animation: none; } .float-cta { transition: opacity .3s ease; transform: none; } }

/* ===================== Anasayfa bölüm arka planı (admin'den renk/resim) ===================== */
/* İç section kendi zeminini wrapper'a giydiriyoruz; wrapper'ın bg'si görünsün diye şeffaflaştır */
.hs-bg > section { background: transparent !important; }
.hs-bg-image { background-repeat: no-repeat; }

/* ===================== Sosyal paylaş butonları ===================== */
.share-box { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.share-label { font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #0b0b0b; margin-right: 2px; }
.share-btn { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: .25rem;
  border: 1.5px solid #d9d9d9; background: #fff; color: #0b0b0b; cursor: pointer; transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease; }
.share-btn i { font-size: 23px; }
.share-btn:hover { transform: translateY(-2px); color: #fff; box-shadow: 0 8px 18px rgba(11,11,11,.16); }
.share-btn.s-fb:hover { background: #1877f2; border-color: #1877f2; }
.share-btn.s-x:hover  { background: #0b0b0b; border-color: #0b0b0b; }
.share-btn.s-wa:hover { background: #25d366; border-color: #25d366; }
.share-btn.s-ig:hover { background: linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); border-color: #dc2743; }
.share-copied { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); background: #0b0b0b; color: #fff;
  padding: 10px 18px; border-radius: .25rem; font-size: 13px; font-weight: 600; z-index: 9999; opacity: 0; transition: opacity .2s; }
.share-copied.show { opacity: 1; }

/* ===================== Üst bar (topbar) ===================== */
.topbar { display: none; background: #0b0b0b; color: rgba(255,255,255,.72); font-size: 13.5px; }
@media (min-width: 768px) { .topbar { display: block; } }
.topbar-item { display: inline-flex; align-items: center; gap: .5rem; color: rgba(255,255,255,.75); text-decoration: none; white-space: nowrap; transition: color .15s ease; }
.topbar-item:hover { color: #cd9c20; }
.topbar-item i { color: #cd9c20; font-size: 16px; }
.topbar-social { display: inline-flex; align-items: center; justify-content: center; width: 35px; height: 35px; border-radius: .35rem;
  background: rgba(255,255,255,.10); color: #ffffff; border: 1px solid rgba(255,255,255,.14);
  transition: background .18s, color .18s, border-color .18s, transform .18s; }
.topbar-social:hover { background: #cd9c20; color: #0b0b0b; border-color: #cd9c20; transform: translateY(-1px); }
.topbar-social i { font-size: 18px; }
@media (max-width: 1100px) { .topbar-hide-md { display: none; } }
@media (max-width: 900px)  { .topbar-hide-sm { display: none; } }

/* ===================== Sticky / kayan modern menü ===================== */
.nav-inner { height: 80px; transition: height .28s cubic-bezier(.4,0,.2,1); }
/* Ortalı menüyü genişlet (logo sola, buton sağa kayar) */
@media (min-width: 1024px) { .nav-inner { max-width: 1390px; } }
#main-nav { box-shadow: 0 1px 0 rgba(11,11,11,.06);
  transition: background .28s ease, box-shadow .28s ease, backdrop-filter .28s ease; }
/* Aşağı kaydırınca: cam efekti + belirgin gölge + incelen yükseklik (modern) */
#main-nav.nav-scrolled { background: rgba(255,255,255,.94); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px rgba(11,11,11,.10); }
#main-nav.nav-scrolled .nav-inner { height: 62px; }
.site-logo { transition: height .28s cubic-bezier(.4,0,.2,1); }
#main-nav.nav-scrolled .site-logo { height: 34px; }
@media (min-width: 768px)  { #main-nav.nav-scrolled .site-logo { height: 38px; } }
@media (min-width: 1280px) { #main-nav.nav-scrolled .site-logo { height: 40px; } }

/* ===================== Free Quote / Rezervasyonum — düz (flat) buton ===================== */
.btn-quote { display: inline-flex; align-items: center; gap: .5rem; background: #cd9c20; color: #0b0b0b; border: 0;
  font-family: 'Inter', sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .03em; text-transform: uppercase;
  line-height: 1; text-decoration: none; padding: .95rem 1.7rem; border-radius: .25rem; cursor: pointer;
  transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease; }
.btn-quote:hover { background: #0b0b0b; color: #cd9c20; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(11,11,11,.22); }
.btn-quote i { font-size: 18px; }
/* Navbar'daki Rezervasyonum butonu mobilde gizli (yalnız logo + menü kalır; yatay kayma önlenir) */
@media (max-width: 1023px) { .nav-quote { display: none !important; } }
/* Yatay taşma güvenliği — overflow-x:clip sticky'yi bozmaz (hidden bozardı) */
html, body { max-width: 100%; overflow-x: clip; }

/* Koyu (Night) CTA bölümünde btn-primary hover'ı Night'a dönüp kaybolmasın → koyu altın kalsın */
.bg-primary-container .btn-primary:hover,
.bg-theme-dark .btn-primary:hover {
  background: #b8901f; color: #0b0b0b;
  box-shadow: 0 10px 26px rgba(245,203,92,.45); transform: translateY(-2px);
}