/* =========================================================
   Pagina Camere - galerie, facilități și booking
   ========================================================= */

/* Pagina Camere - galerie, facilități, booking și responsive */
.rooms-page{ padding-top: 10px; }

.rooms-hero{ padding: 26px 0 10px; }

.rooms-hero__grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  align-items: start;
}

.rooms-hero__text{
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--border);
  background: var(--card);
  box-shadow: var(--shadow);
}

.rooms-hero__badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(139,94,60,.10);
  border: 1px solid var(--border);
  font-weight: 900;
  margin-bottom: 12px;
}

.rooms-types{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin: 10px 0 14px;
}
.type-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: rgba(139,94,60,.07);
  font-weight: 900;
}

.rooms-hero__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* card galerie */
.rooms-hero__gallery{
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--border);
  background: var(--card);
  box-shadow: var(--shadow);
}

/* header galerie + controale */
.rooms-gallery-head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.rooms-gallery-title{
  font-weight: 900;
}
.rooms-gallery-controls{
  display:flex;
  align-items:center;
  gap: 10px;
}
.gal-counter{
  font-weight: 900;
  color: var(--muted);
  font-size: 13px;
}

/* butoane săgeți */
.gal-arrow{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: rgba(139,94,60,.08);
  display:grid;
  place-items:center;
  cursor:pointer;
  transition: transform .15s ease, background .15s ease;
}
.gal-arrow:hover{ transform: scale(1.06); background: rgba(139,94,60,.14); }
.gal-arrow:disabled{ opacity:.35; cursor:not-allowed; transform:none; }

.gal-arrow{
  color: #fff;                 /* sageata alba */
  background: rgba(255,255,255,.08);  /* fundal mai neutru */
  border: 1px solid rgba(255,255,255,.25);
}

.gal-arrow i{
  color: #fff;
  font-size: 16px;
}
/* GRID galerie */
.rooms-gallery{
  display:grid;
  gap: 10px;
}

/* imaginile */
.rooms-gallery figure{
  margin:0;
  border-radius:16px;
  overflow:hidden;
  border: 1px solid var(--border);
  background: rgba(0,0,0,.03);
}
.rooms-gallery img{
  width:100%;
  height: 190px;
  object-fit: cover;
  display:block;
  cursor: zoom-in;
  transition: transform .18s ease;
}
.rooms-gallery img:hover{ transform: scale(1.06); }

/* layout auto pe nr poze */
.rooms-gallery.is-4{ grid-template-columns: 1fr 1fr; }

.rooms-gallery.is-3{ grid-template-columns: 1fr 1fr; }
.rooms-gallery.is-3 figure:first-child{ grid-column: 1 / -1; }
.rooms-gallery.is-3 figure:first-child img{ height: 240px; }

.rooms-gallery.is-2{ grid-template-columns: 1fr 1fr; }

.rooms-gallery.is-1{ grid-template-columns: 1fr; }
.rooms-gallery.is-1 img{ height: 260px; }

.rooms-gallery__note{
  margin-top: 10px;
  font-weight: 800;
  color: var(--muted);
}

/* facilitati */
.amenities{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 14px;
}
.amenity{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: var(--card);
  box-shadow: var(--shadow);
  font-weight: 900;
}

/* booking */
.booking-wrap{
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--border);
  background: var(--card);
  box-shadow: var(--shadow);
}

/* ====== SĂGEȚI GALERIE: contrast bun pe TEMA ALBĂ ====== */
.rooms-gallery-shell .gal-arrow{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.10);
  box-shadow: 0 8px 22px rgba(0,0,0,.10);
  color: #111;                 /* culoarea chevron-ului */
}

.rooms-gallery-shell .gal-arrow i{
  color: currentColor;         /* forțează iconul să ia culoarea butonului */
}

.rooms-gallery-shell .gal-arrow:hover{
  background: #fff;
  border-color: rgba(0,0,0,.14);
  transform: scale(1.06);
}

/* când e disabled */
.rooms-gallery-shell .gal-arrow:disabled{
  opacity: .35;
  cursor: not-allowed;
  transform: none;
}

/* ====== Dacă ai clasă de dark mode, păstrează look-ul ok pe dark ======
   Alege UNA din variantele de mai jos, în funcție de cum ai implementat tema:
*/

/* VARIANTA A: dacă ai body.dark */
body.dark .rooms-gallery-shell .gal-arrow{
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: none;
  color: #fff;
}

/* VARIANTA B: dacă ai <html data-theme="dark"> */
html[data-theme="dark"] .rooms-gallery-shell .gal-arrow{
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: none;
  color: #fff;
}
.amenity{
  transition: transform .15s ease, box-shadow .15s ease;
}

.amenity:hover{
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}