/* ====== Temel Değerler ====== */
:root{
  --bg: #0f1220;
  --fg: #ffffff;
  --muted: #9ba3af;
  --stroke: #1f2433;
  --accent: #6c5ce7;
  --accent-2: #00d4ff;
  --shadow: 0 12px 34px rgba(2,6,23,.22);
  --radius-xl: 18px;
  --radius-lg: 14px;
  --radius-md: 12px;
  --radius-sm: 10px;
}

@media (prefers-color-scheme: light){
  :root{
    --bg: #ffffff;
    --fg: #0f1220;
    --muted: #64748b;
    --stroke: #e5e7eb;
    --shadow: 0 10px 28px rgba(2,6,23,.06);
  }
}

.section-title{
  font-size: 22px;
  font-weight: 800;
  margin: 0 0 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* ====== Galeri ====== */
.room-gallery .room-item{
  padding: 10px;
}
.room-gallery .room-img{
  position: relative;
  border-radius: var(--radius-xl);
  overflow: hidden;
  border: 1px solid var(--stroke);
  background: linear-gradient(135deg,#0f1328,#0b0e1b);
  box-shadow: var(--shadow);
}
.room-gallery .room-img img{
  width: 100%; height: 360px; object-fit: cover; display: block;
  transform: scale(1.02);
  transition: transform .35s ease;
}
.room-gallery .room-img:hover img{ transform: scale(1.06); }

.media-overlay{
  pointer-events: none;
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.35), rgba(0,0,0,0) 45%);
}
.media-zoom{
  position: absolute; right: 12px; bottom: 12px;
  background: rgba(15,18,32,.75);
  color: #fff;
  border-radius: 999px;
  padding: 10px 12px;
  font-size: 14px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,.18);
}

/* ====== Hızlı Özellikler + Fiyat ====== */
.details-specs{
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  /*gap: 14px;*/
}
@media (max-width: 991.98px){
  .details-specs{ grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 575.98px){
  .details-specs{ grid-template-columns: 1fr; }
}

.spec-card{
  display: flex; align-items: center; gap: 14px;
  background: var(--bg);
  color: var(--fg);
  border: 1px solid var(--stroke);
  border-radius: var(--radius-xl);
  padding: 16px;
  box-shadow: var(--shadow);
}
.spec-icon{
  width: 46px; height: 46px; min-width: 46px;
  border-radius: 14px;
  display: grid; place-items: center;
  background: linear-gradient(135deg,var(--accent),var(--accent-2));
  color: #fff; font-size: 18px;
}
.spec-text span{
  display: block; font-size: 12px; color: var(--muted); font-weight: 700; letter-spacing: .2px;
}
.spec-text h2{
  margin: 2px 0 0; font-size: 20px; font-weight: 800;
}
.price-card .spec-icon{ box-shadow: 0 10px 22px rgba(0,212,255,.25); }
.price-large{
  font-size: 22px !important; letter-spacing: .2px;
  background: linear-gradient(135deg,var(--accent),var(--accent-2));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* CTA satırı */
.detail-cta{
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px;
}
.btn-ghost, .btn-whatsapp{
  display: inline-flex; align-items: center; gap: 8px;
  border-radius: var(--radius-md); padding: 10px 14px;
  text-decoration: none; font-weight: 800;
  border: 1px solid var(--stroke); color: var(--fg);
  transition: .2s ease;
}
.btn-ghost:hover{
  border-color: rgba(108,92,231,.45);
  background: linear-gradient(135deg,rgba(108,92,231,.1),rgba(0,212,255,.1));
}
.btn-whatsapp{
  border: none; color:#fff;
  background: linear-gradient(135deg,#25D366,#128C7E);
  margin: 0 auto;
}
.btn-whatsapp:hover{ filter: brightness(1.05); }

/* ====== Sol içerik ====== */
.room-description, .room-features{
  background: var(--bg);
  border: 1px solid var(--stroke);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow);
  padding: 18px;
  margin-bottom: 20px;
}
.rich-content p{ color: var(--fg); }
.rich-content, .features-rich{ line-height: 1.7; }
.features-rich ul{ list-style: none; padding-left: 0; }
.features-rich li{
  position: relative; padding-left: 26px; margin: 8px 0;
}
.features-rich li::before{
  content: "\f00c"; /* fa-check */
  font-family: "Font Awesome 6 Free"; font-weight: 900;
  position: absolute; left: 0; top: 2px;
  color: #22c55e;
}

/* ====== Rezervasyon kartı ====== */
.booking-card{
  position: sticky; top: 92px;
  background: var(--bg); color: var(--fg);
  border: 1px solid var(--stroke);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow);
  padding: 18px;
}
.booking-header h3{
  display: flex; align-items: center; gap: 10px;
  font-weight: 900; margin: 0 0 6px;
}
.booking-header p{ color: var(--muted); margin: 0 0 12px; }

.reform .input-group{ margin-bottom: 10px; }
.icon-input{
  position: relative;
}
.icon-input > i{
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  opacity: .8; font-size: 14px;
}
.icon-input input, .icon-input select{
  width: 100%;
  padding: 12px 12px 12px 36px;
  border-radius: var(--radius-md);
  border: 1px solid var(--stroke);
  background: #0b0f1d; color: #fff;
}
@media (prefers-color-scheme: light){
  .icon-input input, .icon-input select{ background: #fff; color: #0f1220; }
}
.icon-input input::placeholder{ color: #94a3b8; }

.theme-btn.btn-book{
  width: 100%;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 12px 14px;
  border-radius: var(--radius-md);
  border: 0; cursor: pointer;
  color: #fff; font-weight: 900;
  background: linear-gradient(135deg,var(--accent),var(--accent-2));
  box-shadow: 0 12px 24px rgba(108,92,231,.25);
  transition: transform .15s ease, filter .2s ease;
}
.theme-btn.btn-book:hover{ filter: brightness(1.05); transform: translateY(-1px); }

.btn-whatsapp-outline{
  margin-top: 8px;
  width: 100%; text-align: center;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 11px 14px;
  border-radius: var(--radius-md);
  text-decoration: none; font-weight: 800;
  border: 1px solid #1f7a58; color: #1f7a58;
  background: transparent;
  transition: .2s ease;
}
.btn-whatsapp-outline:hover{
  color:#fff; border-color: transparent;
  background: linear-gradient(135deg,#25D366,#128C7E);
}

/* Küçük düzenlemeler */
.wpo-hotel-details-section .wpo-hotel-details-wrap{
  border: none; background: transparent;
}