/* theme-aware frontend styles */
:root{
  --brand:#ff6a3a;
  --brand-dark:#e85422;
  --accent:var(--brand);
  --accent-dark:var(--brand-dark);
  --dark:#121826;
  --text:#1f2937;
  --muted:#6b7280;
  --bg:#ffffff;
  --card:#ffffff;
  --panel:#ffffff;
  --surface:#ffffff;
  --surface-soft:#f8fafc;
  --line:#e6e9f0;
  --header-bg:#ffffff;
  --header-text:#121826;
  --footer-bg:#ff6a3a;
  --footer-text:#ffffff;
  --hero-start:#1d2433;
  --hero-end:#ee2e5c;
  --brand-rgb:255,106,58;
}
body{background:#ffffff;color:var(--dark);margin:0;padding:0}
a{text-decoration:none}

/* ===== HEADER ===== */
.site-header{
  position: sticky;
  top: 0;
  z-index: 1035;
  background: #fff;
}

.topbar{
  background: var(--header-bg);
  color: var(--header-text);
}

.topbar a,
.topbar span{
  color: var(--header-text);
}
.hotel-rating-badge{
    background: var(--brand) !important;
    color: #fff;
}
.topbar-inner{
  min-height: 64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  position:relative;
}

.logo-word{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding: 6px 18px;
  border-radius: 999px;
  background: rgba(255,255,255,0.15);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,0.22);
  font-size: 1.95rem;
  font-weight: 800;
  letter-spacing: 1px;
  line-height: 1;
  color:var(--header-text) !important;
  vertical-align: middle;
}

.topbar-inner.desktop-only{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:64px;
}

/* LEFT: LOGO */
.topbar-inner.desktop-only .logo-word{
  position:static;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  margin:0;
  flex:0 0 auto;
}

/* RIGHT: MENU */
.topbar-right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:28px;
  margin-left:auto;
  flex-wrap:wrap;
}

.top-link{
  font-size: .95rem;
  font-weight: 500;
  color:var(--header-text) !important;
  white-space: nowrap;
}

/* ===== MOBILE HEADER ===== */
.mobile-header-bar{
  display:none;
}

.mobile-menu-btn{
  border:0;
  background:transparent;
  color:var(--header-text) !important;
  font-size:1.9rem;
  line-height:1;
  padding:6px 8px;
  border-radius:10px;
}

.mobile-center-logo{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  text-align:center;
  white-space:nowrap;
}

.mobile-header-spacer{
  width:42px;
  height:42px;
  flex:0 0 42px;
}

/* ===== CITY HEADER STRIP ===== */
.city-nav-shell{
  background:#ececec;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid #dcdcdc;
  box-shadow:none;
}

.city-nav-shell .container{
  display:flex;
  justify-content:flex-start;
  align-items:center;
}
.city-nav-shell .container-fluid{
  display:flex;
  justify-content:flex-start;
}
.city-nav{
  display:flex;
  align-items:center;
  justify-content:flex-start; /* left start */
  gap:34px;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
  padding:11px 0;
  margin:0;
  width:100%;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.city-nav::-webkit-scrollbar{
  display:none;
}

.city-nav a{
  color:#2f3640;
  font-size: .95rem;
  font-weight: 600;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:4px;
  line-height:1.2;
}

.city-arrow-icon{
  font-size:13px;
  color:#444;
  position:relative;
  top:1px;
}

.city-nav a:hover{
  color:var(--brand);
}

/* ===== OFFCANVAS / SIDEBAR ===== */
.mobile-sidebar{
  background:#fff;
}

.mobile-sidebar .offcanvas-header{
  border-bottom:1px solid #e9ecef;
}

.mobile-sidebar .offcanvas-title{
  font-size:1.2rem;
  font-weight:700;
  color:#111827;
}

.mobile-sidebar .btn-close{
  box-shadow:none;
}

.mobile-sidebar-links{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.mobile-sidebar-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  border-radius:14px;
  color:#1f2937;
  font-weight:400;
  background:#f8fafc;
  border:1px solid #edf0f5;
}

.mobile-sidebar-link:hover{
  color:var(--brand);
  background:#fff7f3;
  border-color:#ffd9cb;
}

.mobile-city-accordion .accordion-item{
  border:1px solid #edf0f5;
  border-radius:16px !important;
  overflow:hidden;
  margin-top:8px;
}

.mobile-city-accordion .accordion-button{
  font-weight:500;
  box-shadow:none !important;
  background:#f8fafc;
}

.mobile-city-accordion .accordion-button:not(.collapsed){
  background:#fff7f3;
  color:var(--brand);
}

.mobile-city-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.mobile-city-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#374151;
  font-weight:400;
  padding:10px 12px;
  border-radius:12px;
  background:#fff;
  border:1px solid #edf0f5;
}

.mobile-city-link:hover{
  color:var(--brand);
  background:#fff7f3;
}

/* Generic UI */
.btn-primary{background:var(--brand);border-color:var(--brand)}
.btn-primary:hover,.btn-primary:focus{background:var(--brand-dark);border-color:var(--brand-dark)}
.btn-outline-primary{color:var(--brand);border-color:var(--brand)}
.btn-outline-primary:hover,.btn-outline-primary:focus{background:var(--brand);border-color:var(--brand);color:#fff}

.glass-card,.card{
  border:1px solid rgba(255,255,255,.3);
  border-radius:24px;
  background:rgba(255,255,255,.96);
  box-shadow:0 12px 32px rgba(15,23,42,.08);
}

.card-title-sm{
  font-size:.86rem;
  color:var(--muted);
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.hotel-img,.hero-img{
  height:220px;
  object-fit:cover;
  width:100%;
  border-radius:24px 24px 0 0;
}

.hero-img{
  height:100%;
  border-radius:24px;
}

.sidebar a{
  display:block;
  padding:11px 14px;
  border-radius:14px;
  color:#344054;
  font-weight:400;
  margin-bottom:6px;
}

.sidebar a:hover,.sidebar a.active{
  background:#111827;
  color:#fff;
}

.soft{color:var(--muted)}

.pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#fff2f5;
  color:var(--brand);
  padding:6px 12px;
  border-radius:999px;
  font-size:.86rem;
  font-weight:400;
}

.stat-card{padding:20px}
.stat-value{font-size:2rem;font-weight:700;line-height:1}

.rating-badge{
  background:#0f9d58;
  color:#fff;
  padding:6px 10px;
  border-radius:12px;
  font-weight:500;
  font-size:.85rem;
}

.filter-box{
  background:#fff;
  padding:18px;
  border-radius:20px;
  border:1px solid var(--line);
}

.table thead th{
  font-size:.82rem;
  text-transform:uppercase;
  color:var(--muted);
  border-bottom:1px solid var(--line);
}

.table td{vertical-align:middle}

.footer-shell{
  background:var(--footer-bg);
  color:var(--footer-text);
}

.footer-shell .soft,
.footer-shell .card-title-sm{
  color:rgba(255,255,255,.76);
}

.amenity-chip{
  display:inline-flex;
  gap:8px;
  align-items:center;
  background:#f8fafc;
  border:1px solid var(--line);
  padding:8px 12px;
  border-radius:999px;
}

/* Desktop / Tablet */
.desktop-only{display:block}
.mobile-only{display:none}

/* Tablet */
@media (max-width: 991.98px){
  .topbar-inner{
    min-height:auto;
    padding:14px 0;
    align-items:flex-start;
    flex-direction:column;
  }

  .topbar-right{
    gap:14px 18px;
    width:100%;
    justify-content:flex-start;
    margin-left:0;
  }

  .logo-word{
    font-size:1.9rem;
  }

  .city-nav{
    gap:22px;
    padding:10px 0;
  }

  .city-nav a{
    font-size:.92rem;
  }
}

/* Mobile */
@media (max-width: 767.98px){
  .hide-mobile{display:none !important}
  .desktop-only{display:none !important}
  .mobile-only{display:block !important}

  .topbar{
    padding:0;
  }

  .mobile-header-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:64px;
    position:relative;
  }

  .mobile-center-logo{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    text-align:center;
    white-space:nowrap;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .mobile-header-bar .logo-word{
    font-size:1.95rem;
    min-height:44px;
    padding:6px 18px;
    position:static;
    top:auto;
  }

  .city-nav-shell{
    display:none !important;
  }

  .partner-btn{
    display:none !important;
  }
}

/* views/header.php driven vars only - no hardcoded theme override */
:root{
  --accent:var(--brand);
  --accent-dark:var(--brand-dark);
  --text:#1f2937;
  --muted:#6b7280;
  --line:#e5e7eb;
  --panel:#ffffff;
  --soft:#f8fafc;
  --map-border:#dfe3e8;
}
html, body,
.hotel-page,
.main-wrap,
.top-gallery {
    background:#ffffff !important;
}
body{color:var(--text)}
.search-results-shell,
.search-layout,
.search-listing,
.search-filters,
.search-map-panel{background:#fff}
.search-results-shell{padding:0;background:#fff}
.search-layout{display:grid;grid-template-columns:300px minmax(0,1fr) minmax(420px,42%);gap:0;align-items:start;min-height:calc(100vh - 70px)}
.search-layout.map-off{grid-template-columns:300px minmax(0,1fr)}
.search-filters,.search-listing,.search-map-panel{min-height:calc(100vh - 70px)}
.search-filters{border-right:1px solid var(--line);padding:18px 16px 28px;position:sticky;top:70px;overflow:auto;max-height:calc(100vh - 70px)}
.filter-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.filter-title{font-size:18px;font-weight:800}
.clear-link{color:var(--accent);font-size:14px;font-weight:500;text-decoration:none}
.filter-group{padding:18px 0;border-bottom:1px solid var(--line)}
.filter-group:first-of-type{padding-top:6px}
/* label outside box */
.filter-label{
    font-size:14px;
    font-weight:500;
    color:#111827;
    margin-bottom:10px;
    display:block;
}

/* room adult child box */
.guest-summary-box{
    width:100%;
    min-height:50px;
    padding:10px 12px;
    background:#fff;
    border:1px solid #d1d5db !important;
    border-radius:8px;
    display:flex;
    align-items:center;
    line-height:1.4;
    font-size:14px !important;
    font-weight:400 !important;
    box-sizing:border-box;
}

/* text inside box */
.guest-summary-box,
.guest-summary-box span,
.guest-summary-box div,
.guest-summary-box p,
.guest-summary-box small{
    font-size:14px !important;
    font-weight:400 !important;
    color:#111827;
}

/* if field is clickable */
.guest-summary-box:hover,
.guest-summary-box:focus,
.guest-summary-box:active{
    border:1px solid #d1d5db !important;
    outline:none;
    box-shadow:none;
}
.filter-input,.filter-select{width:100%;height:50px;border:1px solid #d1d5db;background:#fff;padding:8px 12px;font-size:14px;border-radius:8px;outline:none}
.filter-input:focus,.filter-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--brand-rgb),.12)}
.destination-input-wrap{position:relative}
.city-suggestion-list{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 18px 40px rgba(15,23,42,.12);overflow:auto;z-index:40;display:none}
.city-suggestion-list.show{display:block}
.city-suggestion-item{padding:12px 14px;cursor:pointer;border-bottom:1px solid #f1f5f9;font-size:14px;color:#1f2937}
.city-suggestion-item:last-child{border-bottom:none}
.city-suggestion-item:hover,.city-suggestion-item.active{background:rgba(var(--brand-rgb),.08);color:var(--brand-dark)}
.filter-guest-pop{margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 32px rgba(15,23,42,.10);padding:14px;display:none}
.filter-guest-pop.show{display:block}
.guest-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid #eef2f6}
.guest-row:last-of-type{border-bottom:none}
.guest-row-title{font-size:15px;font-weight:700;color:#17212b;line-height:1.2}
.guest-row-sub{font-size:12px;color:#7b8794;margin-top:4px}
.guest-stepper{display:flex;align-items:center;gap:10px}
.guest-step-btn{width:34px;height:34px;border-radius:50%;border:1px solid #d9e1ea;background:#fff;color:#17212b;font-size:22px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer}
.guest-count{min-width:22px;text-align:center;font-size:16px;font-weight:700;color:#17212b}
.child-age-section{padding-top:12px}
.child-age-title{font-size:14px;font-weight:700;color:#17212b;margin-bottom:10px}
.child-age-wrap{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.child-age-select{width:100%;height:42px;border:1px solid #d9e1ea;border-radius:12px;padding:0 12px;background:#fff;font-size:14px;font-weight:400;color:#17212b;outline:none}
.child-age-note{font-size:12px;color:#7b8794;margin-top:8px}
.guest-pop-actions{display:flex;justify-content:space-between;gap:10px;margin-top:16px}
.guest-clear-btn,.guest-apply-btn{flex:1;height:44px;border-radius:12px;font-size:14px;font-weight:700;cursor:pointer;border:none}
.guest-clear-btn{background:var(--accent); color:#fff}
.guest-apply-btn{background:var(--accent);color:#fff}
.filter-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
.filter-check-item{display:flex;align-items:flex-start;gap:8px;font-size:14px;color:#374151}
.filter-check-item input{margin-top:3px}
.price-labels{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.price-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:64px;
  min-height:28px;
  padding:4px 10px;
  border-radius:999px;
  background:#f45d0c;
  color:#fff;
  font-size:14px;
  font-weight:600;
  line-height:1;
  white-space:nowrap;
}

.range-stack{
  position:relative;
  width:100%;
  height:42px;
}
.all-cities-hero{
  background:#fff;
  border:1px solid #eef2f7;
}

.all-cities-slider{
  position:relative;
  width:100%;
  height:320px;
  background:#fff;
  overflow:hidden;
}

.all-cities-slides{
  position:relative;
  width:100%;
  height:100%;
}

.all-cities-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition:opacity .35s ease, visibility .35s ease;
}

.all-cities-slide.active{
  opacity:1;
  visibility:visible;
  z-index:2;
}

.all-cities-slide-link{
  display:block;
  width:100%;
  height:100%;
  position:relative;
  text-decoration:none;
}

.all-cities-slide-image{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  background:#f8fafc;
}

.all-cities-slide-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.20) 40%, rgba(0,0,0,.08) 100%);
}

.all-cities-slide-content{
  position:absolute;
  left:24px;
  bottom:24px;
  z-index:3;
  color:#fff;
  max-width:70%;
}

.all-cities-slide-title{
  font-size:34px;
  font-weight:800;
  line-height:1.1;
  margin-bottom:8px;
}

.all-cities-slide-count,
.all-cities-slide-state{
  font-size:15px;
  font-weight:500;
  opacity:.96;
}

.all-cities-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:4;
  width:44px;
  height:44px;
  border:none;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  color:#111827;
  font-size:22px;
  font-weight:700;
  line-height:1;
  box-shadow:0 8px 20px rgba(0,0,0,.15);
  cursor:pointer;
}

.all-cities-prev{ left:16px; }
.all-cities-next{ right:16px; }

.all-cities-nav:hover{
  background:#fff;
}

.all-cities-dots{
  position:absolute;
  left:50%;
  bottom:16px;
  transform:translateX(-50%);
  z-index:4;
  display:flex;
  gap:8px;
}

.all-cities-dot{
  width:10px;
  height:10px;
  border:none;
  border-radius:50%;
  background:rgba(255,255,255,.55);
  cursor:pointer;
  padding:0;
}
.all-cities-dot.active{
  background:#fff;
  transform:scale(1.15);
}

.all-cities-hero-body{
  background:#fff;
}

.all-cities-pill{
  background:#fff3ea;
  color:#f26122;
  border:1px solid #ffd6bf;
}

@media (max-width: 768px){
  .all-cities-slider{
    height:240px;
  }

  .all-cities-slide-content{
    left:16px;
    right:16px;
    bottom:18px;
    max-width:calc(100% - 32px);
  }

  .all-cities-slide-title{
    font-size:24px;
  }

  .all-cities-nav{
    width:38px;
    height:38px;
    font-size:18px;
  }
}
.range-track{
  position:absolute;
  left:0;
  right:0;
  top:20px;
  height:3px;
  border-radius:999px;
  background:#e4e7ec;
  z-index:1;
}

.range-progress{
  position:absolute;
  top:20px;
  height:3px;
  border-radius:999px;
  background:#f45d0c;
  z-index:2;
  left:0;
  right:0;
}

.range-stack input[type="range"]{
  position:absolute;
  left:0;
  top:14px;
  width:100%;
  height:18px;
  margin:0;
  padding:0;
  background:transparent;
  -webkit-appearance:none;
  appearance:none;
  pointer-events:none;
  z-index:3;
}

.range-stack input[type="range"]::-webkit-slider-runnable-track{
  height:3px;
  background:transparent;
  border:none;
}

.range-stack input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#fff;
  border:2px solid #f45d0c;
  cursor:pointer;
  pointer-events:auto;
  margin-top:-8px;
  position:relative;
}

.range-stack input[type="range"]::-moz-range-track{
  height:3px;
  background:transparent;
  border:none;
}

.range-stack input[type="range"]::-moz-range-thumb{
  width:18px;
  height:18px;
  border-radius:50%;
  background:#fff;
  border:2px solid #f45d0c;
  cursor:pointer;
  pointer-events:auto;
}

.range-line{position:absolute;left:0;right:0;top:12px;height:2px;background:var(--accent)}
.search-listing{padding:12px 12px 28px;overflow:auto;max-height:calc(100vh - 70px)}
.results-top-strip{display:flex;align-items:center;gap:12px;padding:6px 0 16px;margin-bottom:2px}
.offer-strip{border:1px dashed #e5d087;background:#fffdf3;color:#444;padding:8px 12px;font-size:13px;display:inline-block;border-radius:8px}
.hotel-row{display:grid;grid-template-columns:460px minmax(0,1fr);gap:18px;padding:10px 0 18px;margin-bottom:14px;border-bottom:1px solid var(--line);background:#fff}
.search-layout.map-off .hotel-row{grid-template-columns:520px minmax(0,1fr)}
.hotel-media{display:grid;grid-template-columns:minmax(0,1fr) 78px;gap:3px;align-items:start}
.hotel-main-image{height:252px;border-radius:0;overflow:hidden;position:relative;background:#e5e7eb}
.search-layout.map-off .hotel-main-image{height:290px}
.hotel-main-image img{width:100%;height:100%;object-fit:cover;display:block}
.hotel-tag{position:absolute;left:10px;top:10px;background:#fff;color:#222;font-size:12px;font-weight:500;padding:4px 8px;border-radius:4px;z-index:2;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.hotel-thumbs{display:flex;flex-direction:column;gap:4px}
.hotel-thumb{height:55px;overflow:hidden;background:#e5e7eb;border:1px solid #f0f0f0}
.hotel-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.hotel-info-title{font-size:18px;line-height:1.25;font-weight:600;color:#111827;margin:0 0 4px}
.hotel-location{font-size:14px;color:#111827;margin-bottom:10px}
.hotel-location .dot{color:#ff6b3d;font-size:14px;vertical-align:1px}
.hotel-distance{font-size:14px;color:#111827;margin-bottom:10px}
.hotel-distance .dot{color:#ff6b3d;font-size:14px;vertical-align:1px}
.distance-value {color: #374151;font-weight: 500;}
.hotel-rating-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.rating-box{background:#93c948;color:#fff;border-radius:4px;padding:3px 8px;font-size:13px;font-weight:700;display:inline-flex;align-items:center;gap:4px;line-height:1}.hotel-tag-mid-range{ background:#ff6b3d; color:#fff;}
.rating-meta{font-size:13px;color:#555}
.amenity-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:14px;color:#222;margin-bottom:14px}
.amenity-row span{display:inline-flex;align-items:center;gap:6px}
.amenity-more{font-weight:500;color:#111827}
.membership-badge{display:inline-flex;align-items:center;gap:8px;border:1px solid #cfc7aa;background:#fffdf2;color:#1f2937;padding:6px 10px;border-radius:0;font-size:13px;font-weight:700;margin-bottom:14px}
.membership-badge .member-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:#1f1f1f;color:#d4b56f;font-weight:700;font-size:13px;line-height:1}
.hotel-bottom-row{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;}
.hotel-price-wrap{min-width:230px}
.hotel-current-price{font-size:24px;font-weight:700;color:#111827;line-height:1}
.hotel-old-price{font-size:20px;color:#8b8b8b;text-decoration:line-through;margin-left:2px;font-weight:600}
.hotel-off{font-size:17px;color:#f59e0b;font-weight:700;margin-left:2px}
.hotel-tax{font-size:14px;color:#6b7280;margin-top:6px;line-height:1.2}
.hotel-tax strong{color:#374151;font-weight:500}
.hotel-actions{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:12px;
    margin-top:14px;
    width:100%;
}

.btn-view-details,
.btn-book-now{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:42px;
    min-width:138px;
    padding:0 16px;
    border-radius:4px;
    font-size:15px;
    font-weight:500;
    text-decoration:none;
    white-space:nowrap;
    box-sizing:border-box;
}

.btn-view-details{
    background:#fff;
    color:#111827;
    border:1px solid #1f2937;
}

.btn-book-now{
    background:var(--brand) !important;
    color:#fff;
    border:1px solid #ff6b3d;
}

/* mobile */
@media (max-width: 768px){
    .hotel-actions{
        display:flex !important;         /* ✅ grid hatao */
        flex-direction:row;              /* ✅ side by side */
        gap:10px;
        width:100%;
    }

    .btn-view-details,
    .btn-book-now{
        flex:1;                          /* ✅ equal width */
        width:50%;
        min-width:0;
        height:42px;
        font-size:14px;
        margin:0;
    }
}
.flatpickr-day.startRange,
.flatpickr-day.endRange {
    background: #ff3d00;
    border-color: #ff3d00;
}

.flatpickr-day.inRange {
    background: #ffe5dd;
}
.search-map-panel{position:sticky;top:70px;border-left:1px solid var(--map-border);max-height:calc(100vh - 70px);display:block;background:#fff}
.search-layout.map-off .search-map-panel{display:none}
.map-toolbar{position:absolute;left:18px;top:16px;z-index:5;background:#fff;border-radius:4px;padding:14px 16px;box-shadow:0 6px 18px rgba(0,0,0,.10);font-size:14px;font-weight:700}
#searchResultsMap{height:calc(100vh - 70px);width:100%;background:#fff}
.map-fallback{height:calc(100vh - 70px);display:flex;align-items:center;justify-content:center;color:#666;padding:30px;text-align:center;background:#fff}
/* Container */
.empty-results{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:50px 20px;
    margin:20px 12px;
    background:#ffffff;
    border-radius:16px;
    border:1px solid #f1f5f9;
    box-shadow:0 8px 30px rgba(0,0,0,0.06);
}

/* Icon */
.empty-results .empty-icon{
    width:70px;
    height:70px;
    border-radius:50%;
    background:#fff4ef;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    color:#ff6b3d;
    margin-bottom:16px;
}

/* Title */
.empty-results h3{
    font-size:18px;
    font-weight:700;
    color:#111827;
    margin-bottom:6px;
}

/* Subtitle */
.empty-results .soft{
    font-size:14px;
    color:#6b7280;
    max-width:300px;
    line-height:1.5;
    margin-bottom:18px;
}

/* Action button */
.empty-results .empty-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 18px;
    border-radius:8px;
    background:#ff6b3d;
    color:#fff;
    font-weight:500;
    font-size:14px;
    text-decoration:none;
    transition:0.2s;
}

.empty-results .empty-btn:hover{
    background:#e85a2f;
}
.hotel-row{
    cursor:pointer;
}
.mobile-search-actions{display:none}
.mobile-filter-backdrop,.mobile-map-backdrop{display:none}
.hotel-row--compact{grid-template-columns:165px minmax(0,1fr);gap:12px;padding:12px 0 16px}
.hotel-row--compact .hotel-media{grid-template-columns:1fr}
.hotel-row--compact .hotel-main-image{height:170px;border-radius:6px}
.hotel-row--compact .hotel-thumbs{display:none}
.hotel-row--compact .hotel-info-title{font-size:17px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hotel-row--compact .hotel-location{font-size:13px;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.hotel-row--compact .hotel-rating-row{margin-bottom:8px}
.hotel-row--compact .amenity-row,.hotel-row--compact .membership-badge{display:none}
.hotel-row--compact .hotel-bottom-row{align-items:flex-start}
.hotel-row--compact .hotel-price-wrap{min-width:0}
.hotel-row--compact .hotel-current-price{font-size:20px}
.hotel-row--compact .hotel-tax{font-size:13px}
.hotel-row--compact .hotel-actions{display:none}
.hotel-gallery{position:relative;height:100%}
.hotel-slide{position:absolute;inset:0;opacity:0;transition:opacity .25s ease}
.hotel-slide.is-active{opacity:1;z-index:1}
.hotel-slide img{width:100%;height:100%;object-fit:cover;display:block}
.hotel-gallery-nav { 
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    border: none !important;
    outline: none;
    background: transparent !important;
    border-radius: 999px;
    color: #fff !important;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 3;
    font-weight: 900;     /* bold */
}

.hotel-gallery-nav.prev{left:10px}
.hotel-gallery-nav.next{right:10px}
.hotel-gallery-nav i{font-size:22px}
.hotel-thumb{position:relative;cursor:pointer}
.hotel-thumb.is-active::after{content:'';position:absolute;inset:0;border:2px solid var(--accent)}
.map-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:600}
.map-toggle input{display:none}
.map-toggle .slider{position:relative;width:44px;height:24px;background:#ccc;border-radius:50px;transition:0.3s}
.map-toggle .slider::before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:0.3s;box-shadow:0 2px 6px rgba(0,0,0,.2)}

.map-toggle input:checked + .slider{background:var(--brand)}
.map-toggle input:checked + .slider::before{transform:translateX(20px)}
.filter-actions{display:flex;gap:10px;margin-top:18px}.filter-actions .btn{flex:1}
.hotel-price-marker{display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1px solid #d1d5db;color:#111827;border-radius:8px;padding:8px 12px;font-size:13px;font-weight:700;box-shadow:0 6px 16px rgba(0,0,0,.12);white-space:nowrap}
.hotel-price-marker .brand{display:none}
@media (max-width: 1399px){.hotel-row{grid-template-columns:220px minmax(0,1fr)}.search-layout.map-off .hotel-row{grid-template-columns:460px minmax(0,1fr)}}
@media (max-width: 1199px){.search-layout,.search-layout.map-off{grid-template-columns:280px 1fr}.search-map-panel{display:none}.hotel-row,.search-layout.map-off .hotel-row{grid-template-columns:1fr}.hotel-row--compact,.search-layout.map-off .hotel-row--compact{grid-template-columns:150px minmax(0,1fr)}}

@media (max-width: 991px){
  #closeMobileFilters,#closeMobileMap{display:inline-flex!important}
  body.mobile-filter-open,body.mobile-map-open{overflow:hidden}
  .mobile-search-actions{display:flex;gap:10px;position:sticky;top:70px;z-index:15;padding:12px;background:#fff;border-bottom:1px solid var(--line)}
  .mobile-search-btn{flex:1;height:42px;border:1px solid #d1d5db;background:#fff;border-radius:10px;font-size:14px;font-weight:700;color:#111827;display:inline-flex;align-items:center;justify-content:center;gap:8px}
  .mobile-search-filters{height:42px;border:1px solid #d1d5db;background:#fff;border-radius:10px;font-size:14px;font-weight:700;color:#111827;display:inline-flex;align-items:center;justify-content:center;gap:8px}
  .search-layout,.search-layout.map-off{display:block}
  .search-listing{position:static;max-height:none;min-height:auto;padding:0 12px 28px}
  .search-filters{position:fixed;left:0;top:0;bottom:0;width:min(360px,92vw);max-height:none;z-index:60;transform:translateX(-102%);transition:transform .25s ease;background:#fff;overflow:auto;padding-top:86px}
  body.mobile-filter-open .search-filters{transform:translateX(0)}
  .mobile-filter-backdrop,.mobile-map-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.38);z-index:50}
  body.mobile-filter-open .mobile-filter-backdrop,body.mobile-map-open .mobile-map-backdrop{display:block}
  .search-map-panel{position:fixed!important;left:0;right:0;top:70px;bottom:0;max-height:none;border-left:none;z-index:65;transform:translateY(102%);transition:transform .25s ease}
  body.mobile-map-open .search-map-panel{display:block!important;transform:translateY(0)}
  .search-map-panel .map-toolbar{top:14px;left:14px;right:14px}
  
  #searchResultsMap,.map-fallback{height:100%}
  .hotel-row,.search-layout.map-off .hotel-row{grid-template-columns:1fr;padding:14px 0}
  .hotel-row--compact,.search-layout.map-off .hotel-row--compact{grid-template-columns:1fr}
  .hotel-media{grid-template-columns:1fr}
  .hotel-main-image{height:220px}
  .hotel-thumbs{display:grid;grid-template-columns:repeat(4,1fr)}
  .hotel-thumb{height:70px}
  .child-age-wrap{grid-template-columns:1fr}
  .hotel-actions{justify-content:flex-start;min-width:100%}
  .filter-top .map-toggle{display:none}
}

/* Tablet */
@media (max-width: 991px){
  .hotel-main-image{
    height:250px !important;
  }
}
 
/* Mobile */
@media (max-width: 767px){
  .hotel-main-image{
    height:270px !important; /* bigger image */
  }
  .results-top-strip{padding:8px 0 12px}
  .hotel-bottom-row{gap:12px}
  .btn-view-details,.btn-book-now{min-width:calc(50% - 8px)}
}

.footer-shell{
    background: var(--footer-bg);
    color: var(--footer-text);
    margin-top:40px;
    border-top:1px solid var(--footer-border);
    font-family:inherit;
  }

  .footer-shell a{
    color: var(--footer-text);
    text-decoration:none;
    transition:opacity .2s ease;
  }

  .footer-shell a:hover{
    color: var(--footer-text);
    opacity:.85;
  }

  .footer-banner-line{
    text-align:center;
    font-size:15px;
    line-height:1.4;
    font-weight:400;
    padding:14px 0 12px;
    border-bottom:1px solid var(--footer-border);
    color: var(--footer-text);
  }

  .footer-top-grid{
    padding:10px 0 4px;
  }

  .footer-col{
    min-height:142px;
  }

  .footer-col.has-divider{
    border-right:1px solid var(--footer-border);
  }

  .footer-heading{
    font-size:12px;
    font-weight:500;
    text-transform:uppercase;
    margin-bottom:12px;
    color: var(--footer-text);
  }

  .footer-links{
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .footer-links a,
  .footer-contact-item{
    font-size:14px;
    color: var(--footer-text);
    line-height:1.35;
  }

  .footer-contact-item{
    margin-bottom:14px;
  }

  .footer-city-wrap{
    border-top:1px solid var(--footer-border);
    padding-top:18px;
    margin-top:8px;
  }

  .footer-city-head{
    font-size:12px;
    font-weight:500;
    text-transform:uppercase;
    margin-bottom:10px;
    color: var(--footer-text);
  }

  .footer-city-grid{
    display:grid;
    grid-template-columns:repeat(7, minmax(0, 1fr));
    gap:8px 22px;
  }

  .footer-city-grid a{
    font-size:13px;
    line-height:1.3;
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    color: var(--footer-text);
  }

  .footer-bottom-bar{
    margin-top:14px;
    padding-top:14px;
    border-top:1px solid var(--footer-border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    flex-wrap:wrap;
  }

  .footer-socials{
    display:flex;
    align-items:center;
    gap:26px;
  }

  .footer-socials a{
    width:20px;
    height:20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    color: var(--footer-text);
  }

  .footer-copy{
    font-size:14px;
    color: var(--footer-text);
    white-space:nowrap;
  }

  .footer-mobile-accordion{
  display:none;
}

.footer-mobile-card{
  border-top:1px solid var(--footer-border);
  padding:14px 0;
}

.footer-mobile-card:first-child{
  border-top:0;
}

.footer-mobile-title{
  font-size:12px;
  font-weight:500;
  text-transform:uppercase;
  margin-bottom:10px;
  color:var(--footer-text);
  text-align:center;
}

.footer-mobile-links{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.footer-mobile-links-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  column-gap:28px;
  row-gap:8px;
  align-items:start;
}

.footer-mobile-links-grid a{
  display:block;
  color:var(--footer-text);
  font-size:13px;
  line-height:1.45;
  text-align:left;
  white-space:nowrap;
}

.footer-mobile-cities{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px 28px;
}

.footer-mobile-cities a{
  display:block;
  color:var(--footer-text);
  font-size:13px;
  line-height:1.45;
  text-align:left;
  white-space:nowrap;
}
.footer-bottom-bar {
    position: relative;
    bottom: 10px;
}
@media (max-width: 991.98px){
  .footer-desktop-view{
    display:none;
  }

  .footer-mobile-accordion{
    display:block;
    padding:10px 0 4px;
  }

  .footer-bottom-bar{
    flex-direction:column;
    align-items:flex-start;
  }

  .footer-copy{
    white-space:normal;
  }

  .footer-socials{
    gap:20px;
  }
}

@media (max-width: 575.98px){
  .footer-mobile-links-grid,
  .footer-mobile-cities{
    column-gap:22px;
    row-gap:8px;
  }

  .footer-mobile-links-grid a,
  .footer-mobile-cities a{
    font-size:12px;
  }
}

.home-hero-wrap{
    position:relative;
    min-height:180px;
    overflow:visible;
    background:linear-gradient(135deg, var(--hero-start), var(--hero-end));
}

.home-hero-single-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
}

/*.home-hero-single-bg::before{*/
/*    content:"";*/
/*    position:absolute;*/
/*    inset:0;*/
/*    background:linear-gradient(135deg, rgba(var(--hero-start-rgb),.28), rgba(var(--hero-end-rgb),.22)), linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.18) 42%, rgba(0,0,0,.28) 100%);*/
/*}*/

.home-hero-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,0)),
        radial-gradient(circle at top right, rgba(255,255,255,.10), transparent 30%);
    pointer-events:none;
}

.home-hero-content{
    position:relative;
    z-index:2;
    max-width:1240px;
    margin:0 auto;
    padding:95px 20px 48px;
}

.home-hero-copy{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
}

.home-hero-title{
    display:block !important;
    color:#fff !important;
    font-size:35px !important;
    line-height:1.05 !important;
    font-weight:800 !important;
    margin:0 auto 18px !important;
    letter-spacing:-1.4px !important;
    text-align:center !important;
    max-width:980px;
    width:100%;
    text-shadow:0 2px 12px rgba(0,0,0,.18);
}

@media (max-width: 1199px){
    .home-hero-title{
        font-size:48px !important;
        max-width:860px;
    }
}

@media (max-width: 991px){
    .home-hero-title{
        font-size:40px !important;
        line-height:1.1 !important;
        max-width:700px;
        letter-spacing:-0.8px !important;
    }
}

@media (max-width: 767px){
    .home-hero-title{
        font-size:30px !important;
        line-height:1.15 !important;
        max-width:95%;
        margin:0 auto 14px !important;
        letter-spacing:-0.4px !important;
    }
}

.home-search-grid{
    display:grid;
    grid-template-columns:minmax(250px,1.1fr) minmax(220px,.8fr) minmax(220px,.8fr) 210px;
    gap:12px;
    align-items:stretch;
    background:transparent;
    border-radius:20px;
    overflow:visible;
    border:none;
    box-shadow:none;
}

.home-search-item{
    min-height:78px;
    background:#fff;
    border:1px solid #e8edf3;
    border-radius:0px;
    padding:12px 18px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    box-shadow:0 8px 24px rgba(15,23,42,.06);
    overflow:visible;
}

.home-search-item:last-child{
    border-right:none;
}

.home-search-item--destination{
    padding:12px 16px 12px 18px;
    z-index:40;
}

.home-search-label{
    display:block !important;
    position:absolute;
    top:10px;
    left:18px;
    font-size:11px;
    line-height:1;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#8a94a6;
    pointer-events:none;
}

.location-field{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    width:100%;
    padding-top:16px;
}

.destination-input-wrap{
    position:relative;
    min-width:0;
    width:100%;
}

.destination-input{
    width:100%;
    border:none;
    border-radius:0;
    background:#fff;
    padding:0;
    font-size:16px;
    font-weight:600;
    color:#111827;
    outline:none;
    box-shadow:none;
}

.destination-input:focus{
    border:none;
    box-shadow:none;
}

.destination-input::placeholder{
    color:#6b7280;
    font-weight:500;
}

.near-me-chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:48px;
    min-width:48px;
    height:48px;
    padding:0;
    border:1px solid rgba(var(--brand-rgb),.28);
    border-radius:999px;
    background:linear-gradient(180deg,#fff7f4,#fff);
    color:var(--brand);
    font-size:0;
    font-weight:700;
    line-height:1;
    white-space:nowrap;
    text-align:center;
    transition:.2s ease;
    box-shadow:0 8px 18px rgba(var(--brand-rgb),.16);
    flex:0 0 48px;
}

.near-me-chip i{
    font-size:17px;
    margin:0;
}

.near-me-chip:hover{
    background:#fff1ea;
    border-color:rgba(var(--brand-rgb),.45);
    transform:translateY(-1px);
}

.home-search-input,
#guestToggle{
    width:100%;
    min-height:52px;
    border:none;
    outline:none;
    background:transparent;
    color:#111827;
    text-align:left;
    margin:0;
    box-shadow:none;
    display:flex;
    align-items:flex-end;
    padding:18px 0 0;
}

.home-search-input{
    font-size:16px;
    font-weight:700;
    line-height:1.3;
    white-space:nowrap;
    cursor:pointer;
}

#guestToggle{
    font-size:16px;
    font-weight:700;
    line-height:1.3;
    cursor:pointer;
    white-space:nowrap;
}

.search-button-wrap{
    align-self:stretch;
    padding:0;
    border:none !important;
    background:transparent;
    box-shadow:none;
}

/* search panel always above below image/cards */
.home-hero-wrap,
.home-hero-content,
.home-search-grid,
.home-search-item,
.home-search-item--destination,
.destination-input-wrap {
    position: relative;
}

.home-hero-content {
    z-index: 50;
}

.home-search-item--destination {
    z-index: 70;
}

.destination-input-wrap {
    z-index: 80;
}

.city-suggestion-list {
    z-index: 9999 !important;
}

.guest-pop {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 9999 !important;
}

.flatpickr-calendar {
    z-index: 9999 !important;
}

/* below image section should stay lower */
.home-top-static-images-wrap,
.home-top-static-images,
.home-top-image-box,
.home-top-img-box {
    position: relative;
    z-index: 1 !important;
}

.home-search-btn{
    width:100%;
    min-height:78px;
    height:100%;
    border:none;
    border-radius:22px;
    background:linear-gradient(135deg,#ff6a3a,#ff4d2d);
    color:#fff;
    font-size:17px;
    font-weight:600;
    box-shadow:0 16px 32px rgba(var(--brand-rgb),.28);
    transition:.2s ease;
}

.home-search-btn:hover{
    background:linear-gradient(135deg,#ff5d29,#ef4423);
}

@media (max-width: 1199px){
    .home-search-grid{
        grid-template-columns:1fr 1fr;
        gap:12px;
    }

    .home-search-item--destination,
    .search-button-wrap{
        grid-column:1 / -1;
    }

    .home-search-btn{
        min-height:60px;
    }
}

@media (max-width: 767px){
    .home-hero-content{
        padding:22px 12px 30px;
    }

    .home-search-grid{
        grid-template-columns:1fr;
        gap:10px;
    }

    .home-search-item,
    .home-search-item--destination{
        min-height:72px;
        padding:12px 14px;
        border-radius:18px;
    }

    .home-search-label{
        top:11px;
        left:14px;
        font-size:10px;
    }

    .location-field{
        padding-top:14px;
        gap:10px;
    }

    .destination-input,
    .home-search-input,
    #guestToggle{
        font-size:15px;
    }

    .home-search-input,
    #guestToggle{
        min-height:46px;
        padding-top:14px;
        white-space:normal;
        align-items:flex-end;
    }

    .near-me-chip{
        width:46px;
        min-width:46px;
        height:46px;
        flex:0 0 46px;
    }

    .search-button-wrap{
        grid-column:auto;
    }

    .home-search-btn{
        min-height:58px;
        border-radius:18px;
        font-size:16px;
    }
}

@media (max-width: 575px){
    
    .home-search-grid{
        gap:9px;
    }

    .home-search-item,
    .home-search-item--destination{
        min-height:68px;
        padding:11px 13px;
        border-radius:16px;
    }

    .home-search-label{
        left:13px;
    }

    .destination-input,
    .home-search-input,
    #guestToggle{
        font-size:14px;
    }

    .near-me-chip{
        width:44px;
        min-width:44px;
        height:44px;
        flex-basis:44px;
    }
}

.city-suggestion-list{
    position:absolute;
    top:calc(100% + 8px);
    left:70%;
    transform:translateX(-50%);
    width:150%;   /* thoda bada */
    max-width:600px; /* control */
    background:#fff;
    border:1px solid #d9d9d9;
    border-radius:12px;
    box-shadow:0 20px 40px rgba(0,0,0,.18);
    overflow-y:auto;
    z-index:9999;
}


.city-suggestion-item{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:14px 16px;
    font-size:14px;
    font-weight:400;
    color:#1f2937;
    background:#fff;
    border-bottom:1px solid #eceff3;
    cursor:pointer;
    line-height:1.45;
}


.city-suggestion-item:hover,
.city-suggestion-item.active{
    background:#f8fafc;
    color:#111827;
}

.city-suggestion-item i,
.city-suggestion-item .fa,
.city-suggestion-item .fas,
.city-suggestion-item .far{
    color:#6b7280;
    font-size:15px;
    flex:0 0 18px;
    margin-top:3px;
}

.city-suggestion-list::-webkit-scrollbar{
    width:8px;
}

.city-suggestion-list::-webkit-scrollbar-thumb{
    background:#c7c7c7;
    border-radius:10px;
}

.city-suggestion-list::-webkit-scrollbar-track{
    background:#f1f3f5;
}

.guest-pop{
    position:absolute;
    top:calc(85% + 10px);
    right:0;
    width:260px;
    max-width:calc(100vw - 30px);
    background:#fff;
    border:none;
    border-radius:5px;
    box-shadow:0 22px 60px rgba(15,23,42,.18);
    padding:16px;
    display:none;
    z-index:9999;
}

.guest-pop.show{
    display:block;
}

@media (max-width: 1199px){
    .home-search-grid{
        grid-template-columns:1fr 1fr;
    }

    .search-button-wrap{
        grid-column:1 / -1;
    }

    .home-search-btn{
        border-radius:0 0 10px 10px;
        min-height:58px;
    }
}

@media (max-width: 767px){
    .home-hero-content{
        padding:18px 14px 28px;
    }

    .home-search-grid{
        grid-template-columns:1fr;
        gap:0;
        border-radius:18px;
        overflow:hidden;
    }

    .home-search-item{
        min-height:auto;
        border-right:none;
        border-bottom:1px solid #e8ebef;
        padding:18px 16px;
        justify-content:flex-start;
    }

    .home-search-item:last-child{
        border-bottom:none;
    }

    .home-search-item--destination{
        padding:18px 16px 14px;
    }

    .location-field{
        grid-template-columns:1fr;
        gap:12px;
    }

    .destination-input{
        height:34px;
        font-size:15px;
    }

    .near-me-chip{
        width:100%;
        min-width:0;
        height:42px;
        border-radius:8px;
    }

    .home-search-input,
    #guestToggle{
        height:auto;
        min-height:28px;
        font-size:15px;
        white-space:normal;
    }

    .search-button-wrap{
        padding:14px 16px 18px;
        border-bottom:none !important;
        background:#fff;
    }

    .home-search-btn{
        min-height:54px;
        height:54px;
        border-radius:10px;
        font-size:17px;
    }

    .city-suggestion-list{
        top:calc(100% + 6px);
        border-radius:12px;
        max-height:240px;
    }

    .city-suggestion-item{
        padding:12px 14px;
        font-size:14px;
    }

    .guest-pop{
        position:absolute;
        top:calc(100% + 8px);
        left:0;
        right:0;
        width:auto;
        max-width:none;
        border-radius:16px;
    }
}

@media (max-width: 420px){
    .home-search-item{
        padding:16px 14px;
    }

    .search-button-wrap{
        padding:12px 14px 16px;
    }

    .home-search-btn{
        min-height:52px;
        font-size:16px;
    }

    .destination-input,
    .home-search-input,
    #guestToggle{
        font-size:14px;
    }
}


.guest-step-btn{
    width:34px;
    height:34px;
    border-radius:50%;
    border:1px solid #d9e1ea;
    background:#fff;
    color:#17212b;
    font-size:22px;
    font-weight:500;
    line-height:1;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:.2s ease;
}

.guest-step-btn:hover{
    border-color:var(--brand);
    color:var(--brand);
    background:#fff7f3;
}


.guest-clear-btn,
.guest-apply-btn{
    flex:1;
    height:44px;
    border-radius:12px;
    font-size:14px;
    font-weight:700;
    cursor:pointer;
    border:none;
}


.guest-apply-btn{
    background:var(--brand);
    color:#fff;
}

.guest-clear-btn:hover{
    background:#eaeef3;
}

.guest-apply-btn:hover{
    background:var(--brand-dark);
}

/* top images */
.home-top-static-images-wrap{
    position:relative;
    margin-top:-24px;
    margin-bottom:38px;
    padding:22px;
    border-radius:28px;
    overflow:hidden;
    min-height:320px;
    box-shadow:0 18px 45px rgba(15, 23, 42, .10);
    z-index:5;
}

.home-top-static-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.home-top-static-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(12,18,28,.20), rgba(12,18,28,.42));
    z-index:1;
}

.home-top-static-images{
    position:relative;
    z-index:2;
    margin:0;
}

.home-top-image-box{
    width:100%;
    background:#fff;
    border-radius:24px;
    padding:12px;
    box-shadow:0 14px 35px rgba(0,0,0,.16);
}

.home-top-image-inner{
    width:100%;
    height:250px;
    border-radius:18px;
    overflow:hidden;
    background:#eef2f6;
}

.home-top-image-box img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .4s ease;
}

.home-top-img-inner{
    width:100%;
    height:250px;
    border-radius:18px;
    overflow:hidden;
    background:#eef2f6;
    display:block;
    position:relative;
}

.home-top-img-box img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center; /* important */
    display:block;
}

.section-head{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:20px;
    margin-bottom:20px;
}

.section-title{
    margin:0;
    font-size:20px;
    font-weight:700;
    color:#111827;
    letter-spacing:-.4px;
}
.section-titles{
    margin:13;
    font-size:20px;
    font-weight:700;
    color:#111827;
    letter-spacing:-.4px;
}
.section-sub{
    margin-top:4px;
    color:var(--muted);
    font-size:14px;
}

.section-meta{
    color:var(--muted);
    font-size:14px;
    font-weight:500;
}

/* final hotel card only */
.hotel-card-final{
    background:#fff;
    border:none;
    border-radius:14px;
    overflow:hidden;
    box-shadow:0 4px 18px rgba(0,0,0,.10);
    height:100%;
    transition:.25s ease;
    display:flex;
    flex-direction:column;
}

.hotel-card-final:hover{
    transform:translateY(-4px);
    box-shadow:0 10px 24px rgba(0,0,0,.14);
}

.hotel-card-media-final{
    position:relative;
    height:220px;
    overflow:hidden;
    background:#ececec;
}

.hotel-card-image{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.hotel-top-tag{
    position:absolute;
    top:12px;
    left:12px;
    z-index:3;
    background:#ff6b3d;
    color:#fff;
    font-size:13px;
    font-weight:500;
    line-height:1;
    padding:8px 11px;
    border-radius:4px;
}

.hotel-media-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:3;
    width:34px;
    height:34px;
    border:none;
    border-radius:50%;
    background:rgba(255,255,255,.55);
    color:#fff;
    font-size:26px;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:.2s ease;
}

.hotel-media-arrow:hover{
    background:rgba(255,255,255,.75);
}

.hotel-media-arrow-left{
    left:10px;
}

.hotel-media-arrow-right{
    right:10px;
}

.hotel-card-content{
    padding:14px 16px 18px;
    background:#f5f5f5;
    display:flex;
    flex-direction:column;
    flex:1;
}

.hotel-name{
    margin:0 0 8px;
    font-size:17px;
    font-weight:600;
    color:#2f2f2f;
    line-height:1.4;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.hotel-location-row{
    display:flex;
    align-items:center;
    gap:6px;
    color:#8a929a;
    font-size:13px;
    margin-bottom:10px;
    min-width:0;
}

.hotel-location-row i{
    font-size:12px;
    flex:0 0 auto;
    color:#98a0a8;
}

.hotel-location-row span{
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}


.rating-box{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:38px;
    height:24px;
    padding:0 8px;
    background:#22b573;
    color:#fff;
    font-size:13px;
    font-weight:500;
    border-radius:5px;
    line-height:1;
}

.rating-text{
    color:#7f8790;
    font-size:13px;
    font-weight:700;
}

.rating-label-text{
    color:#7f8790;
    font-size:13px;
    font-weight:400;
}

.hotel-price-section{
    margin-top:auto;
}

.hotel-price-line{
    display:flex;
    align-items:baseline;
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:4px;
}

.hotel-main-price{
    font-size:18px;
    font-weight:700;
    color:#2d2d2d;
    line-height:1.1;
}

.hotel-old-price{
    font-size:16px;
    color:#8d8d8d;
    text-decoration:line-through;
    font-weight:600;
}

.hotel-discount{
    font-size:16px;
    font-weight:500;
    color:#f5a623;
}

.hotel-tax-line{
    font-size:14px;
    color:#8a929a;
    margin-bottom:14px;
    line-height:1.4;
}

.hotel-room-info{
    color:#9aa1a8;
}

.hotel-card-btn-wrap{
    display:flex;
    justify-content:center;
}

.hotel-details-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:98px;
    height:34px;
    padding:0 16px;
    border-radius:6px;
    background:#ff6b3d;
    color:var(--header-text) !important;
    text-decoration:none;
    font-size:14px;
    font-weight:500;
    border:none;
    transition:.2s ease;
}

.hotel-details-btn:hover{
    background:#f15e31;
    color:var(--header-text) !important;
    text-decoration:none;
}

.hotel-empty-card{
    background:#fff;
    border-radius:12px;
    padding:20px;
    box-shadow:0 3px 12px rgba(0,0,0,.08);
    font-size:15px;
    color:#555;
}

/* destination slider */
.destination-slider-wrap{
    position:relative;
    overflow:hidden;
    width:100%;
}

.destination-slider{
    display:flex;
    gap:24px;
    transition:transform .45s ease;
    will-change:transform;
}

.destination-slide{
    flex:0 0 calc((100% - 48px) / 3);
    min-width:calc((100% - 48px) / 3);
}

.destination-card{
    position:relative;
    display:block;
    height:240px;
    border-radius:20px;
    overflow:hidden;
    text-decoration:none;
    background:#ddd;
}

.destination-media{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    transition:transform .45s ease;
}

.destination-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top, rgba(0,0,0,.58), rgba(0,0,0,.15));
    z-index:1;
}

.destination-card:hover .destination-media{
    transform:scale(1.05);
}

.destination-content{
    position:absolute;
    top:40%;
    transform:translate(-5%, -5%);
    z-index:2;
    width:100%;
    text-align:center;
    padding:0 10px;
}

.destination-name{
    font-size:32px;
    font-weight:700;
    color:#fff;
    margin:0;
    letter-spacing:1px;
}

.destination-note{
    margin:0;
    color:rgba(255,255,255,.92);
    font-size:15px;
    line-height:1.4;
}

.destination-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:42px;
    height:42px;
    border:none;
    border-radius:50%;
    background:rgba(0,0,0,.55);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:10;
    transition:all .25s ease;
    box-shadow:0 8px 20px rgba(0,0,0,.18);
    font-size:28px;
}

.destination-arrow:hover{
    background:#0d6efd;
    color:#fff;
}

.destination-arrow:disabled{
    opacity:.35;
    cursor:not-allowed;
}

.destination-arrow-left{
    left:12px;
}

.destination-arrow-right{
    right:12px;
}

.blog-card{
    border:none !important;
    border-radius:24px !important;
    overflow:hidden;
    box-shadow:var(--shadow);
    background:#fff;
}

.blog-card .hotel-img{
    height:235px;
    width:100%;
    object-fit:cover;
    display:block;
}

.blog-meta{
    font-size:12px;
    font-weight:700;
    color:var(--brand);
    text-transform:uppercase;
    letter-spacing:.8px;
    margin-bottom:10px;
}

.blog-title{
    color:#667085;
    font-size:15px;
    line-height:1.7;
    margin-bottom:18px;
}

.blog-text{
    color:#667085;
    font-size:15px;
    line-height:1.7;
    margin-bottom:18px;
}

.blog-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    border:1px solid #ffd2c4;
    color:var(--brand);
    background:#fff7f3;
    text-decoration:none;
    padding:11px 16px;
    border-radius:999px;
    font-weight:700;
}

@media (max-width:991px){
    .home-hero-wrap{
        min-height:540px;
    }

    .home-hero-content{
        padding:72px 14px 34px;
    }

    .home-hero-title{
        font-size:36px;
    }

    .home-hero-sub{
        font-size:15px;
    }

    .home-search-grid{
        grid-template-columns:1fr;
        gap:0;
    }

    .home-search-item{
        min-height:56px;
    }

    .home-search-btn{
        height:54px;
        border-radius:0;
    }

    #guestToggle{
        font-size:15px;
    }

    .guest-pop{
        left:0;
        right:0;
        width:auto;
    }

    .child-age-wrap{
        grid-template-columns:1fr;
    }

    .home-top-static-images-wrap{
        margin-top:0;
        padding:14px;
        min-height:auto;
        border-radius:22px;
    }

    .home-top-image-inner{
        height:190px;
    }

    .hotel-card-media-final{
        height:210px;
    }

    .destination-slide{
        flex:0 0 calc((100% - 24px) / 2);
        min-width:calc((100% - 24px) / 2);
    }

    .destination-name{
        font-size:24px;
    }
}

@media (max-width:575px){
    .hotel-card-media-final{
        height:200px;
    }

    .hotel-name{
        font-size:14px;
    }

    .hotel-main-price{
        font-size:17px;
    }

    .hotel-tax-line{
        font-size:12px;
    }

    .destination-slider{
        gap:16px;
    }

    .destination-slide{
        flex:0 0 100%;
        min-width:100%;
    }

    .destination-card{
        height:220px;
        border-radius:20px;
    }

    .destination-arrow{
        width:36px;
        height:36px;
        font-size:24px;
    }

    .destination-arrow-left{
        left:8px;
    }

    .destination-arrow-right{
        right:8px;
    }
}

/* hotel.php */
.hotel-page{
    --accent:#ff6d3a;
    --accent-dark:#f25f2a;
    --text:#232323;
    --muted:#737373;
    --line:#ebebeb;
    --panel:#ffffff;
    --bg:#f3f3f3;
    background:var(--bg);
    padding:0 0 40px;
}
.hotel-page .container{max-width:1180px}
.hotel-page .top-gallery{
    background:#fff;
    border-left:1px solid var(--line);
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
}
.hotel-page .gallery-stage{
    position:relative;
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:0;
    min-height:430px;
    overflow:hidden;
    background:#ececec;
}
.hotel-page .gallery-tile{
    position:relative;
    min-height:330px;
    background:#ddd;
    border-right:1px solid rgba(255,255,255,.4);
}
.hotel-page .gallery-tile:last-child{border-right:none}
.hotel-page .gallery-tile img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.hotel-page .gallery-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:44px;
    height:44px;
    border:none;
    border-radius:50%;
    background:rgba(255,255,255,.85);
    color:#8b8b8b;
    box-shadow:0 2px 8px rgba(0,0,0,.15);
    z-index:5;
    font-size:26px;
    line-height:44px;
    cursor:pointer;
}

.hotel-page .gallery-arrow.prev{left:16px}
.hotel-page .gallery-arrow.next{right:16px}
.hotel-page .view-photos{
    position:absolute;
    right:22px;
    bottom:22px;
    border:none;
    background:rgba(255,255,255,.92);
    color:#444;
    font-weight:400;
    border-radius:4px;
    padding:8px 12px;
    font-size:14px;
}
.hotel-page .main-wrap{
    display:grid;
    grid-template-columns:minmax(0, 1fr) 300px;
    gap:30px;
    padding:20px 0 0;
}
.hotel-page .title-row{padding:0 0 0px}
.hotel-page .hotel-name{
    font-size:20px;
    line-height:1.35;
    font-weight:600;
    color:var(--text);
    margin:0 0 10px;
}
.hotel-page .featured-badge{
    display:inline-block;
    font-size:12px;
    color:#fff;
    background:var(--brand) !important;
    padding:4px 10px;
    border-radius:4px;
    margin-left:10px;
    vertical-align:middle;
}
.hotel-page .address-line,
.hotel-page .meta-line,
.hotel-page .review-line{
    color:var(--muted);
    font-size:14px;
    margin-bottom:10px;
}
.hotel-page .score-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:40px;
    height:24px;
    font-size:13px;
    font-weight:500;
    color:#fff;
    background:var(--brand) !important;
    border-radius:4px;
    margin-right:8px;
}
.hotel-page .section-block{margin:22px 0}
.hotel-page .section-head{ 
    font-size:18px;
    font-weight:600;
    color:#2a2a2a;
    margin:0 0 14px;
    display:flex;
    align-items:center;
    justify-content:flex-start; 
    text-align:left;        
    gap:10px;
}

.hotel-page .section-head::before{
    content:"";
    width:3px;
    height:28px;
    background:#f6a623;
    display:inline-block;
    flex-shrink:0; 
}
.hotel-page .detail-text,
.hotel-page .policy-text,
.hotel-page .faq-answer,
.hotel-page .nearby-text{
    color:#4b4b4b;
    font-size:15px;
    line-height:1.8;
}
.hotel-page .amenities-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px 24px;
}
.hotel-page .amenity-item{
    display:flex;
    align-items:center;
    gap:12px;
    color:#4f4f4f;
    font-size:15px;
}
.hotel-page .amenity-item i{
    font-size:22px;
    color:#666;
    width:26px;
}
.hotel-page .show-more-btn{
    background:none;
    border:none;
    color:var(--accent);
    font-weight:400;
    padding:0;
    margin-top:18px;
}
.search-results-shell .show-more-btn{
    background:none;
    border:none;
    color:var(--accent);
    font-weight:400;
    padding:0;
    margin-top:18px;
}
.hotel-page .policy-inline{
    display:flex;
    flex-wrap:wrap;
    gap:22px;
    color:#4f4f4f;
    font-size:15px;
    margin-bottom:16px;
}
.hotel-page .policy-inline .badge-ok{
    display:inline-block;
    background:#2fbf71;
    color:#fff;
    font-size:11px;
    border-radius:3px;
    padding:2px 8px;
    margin:0 6px;
    vertical-align:middle;
}
.hotel-page .map-box,
.hotel-page .video-box{
    background:#fff;
    border:1px solid var(--line);
    overflow:hidden;
}
.hotel-page .map-box iframe,
.hotel-page .map-box img{width:100%;height:370px;border:0;display:block;object-fit:cover;background:#eee}
.hotel-page .video-box{padding:16px}
.hotel-page .video-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.hotel-page .video-grid img{width:100%;height:140px;object-fit:cover;display:block;border:1px solid var(--line)}
.hotel-page .room-list{display:flex;flex-direction:column;gap:18px}
.hotel-page .room-card{
    background:#fff;
    border:1px solid var(--line);
    padding:18px;
}

.hotel-page .room-photo{width:100%;height:215px;object-fit:cover;display:block;background:#eee}
.hotel-page .room-title{font-size:19px;font-weight:500;margin:0 0 10px;color:#262626}
.hotel-page .room-meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.hotel-page .room-meta span{font-size:12px;padding:6px 10px;border:1px solid #ddd;border-radius:40px;color:#555;background:#fafafa}
.hotel-page .room-price-box{border:1px solid var(--line);padding:16px;height:100%;background:#fcfcfc}
.hotel-page .price-main{font-size:22px;font-weight:500;color:#2b2b2b;line-height:1.1}
.hotel-page .price-old{font-size:18px;text-decoration:line-through;color:#999}
.hotel-page .discount-inline{font-size:14px;color:var(--brand) !important;font-weight:700}
.hotel-page .book-btn,
.hotel-page .check-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    border:none;
    border-radius:4px;
    background:var(--brand) !important;
    color:#fff;
    font-size:15px;
    font-weight:500;
    text-decoration:none;
    min-height:46px;
}
.hotel-page .check-btn:hover,
.hotel-page .book-btn:hover{background:var(--accent-dark);color:#fff}
.hotel-page .booking-sticky {
    position: sticky;
    top: 20px; /* distance from top */
    align-self: flex-start;
}

.price-login-card {
    position: relative;
}

.hotel-page .price-login-card{
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 2px 10px rgba(0,0,0,.06);
    padding:18px;
}
.hotel-page .login-banner{
    background:var(--brand) !important;
    color:#fff;
    text-align:center;
    font-size:14px;
    padding:14px 10px;
    border-radius:4px;
    margin-bottom:14px;
}
.hotel-page .tabs{
    display:flex;
    border-bottom:1px solid var(--line);
    margin-bottom:14px;
}
.hotel-page .tab{flex:1;text-align:center;padding:0 0 12px;color:#666;font-size:14px}
.hotel-page .tab.active{color:var(--accent)}
.hotel-page .field-label{font-size:12px;color:#9a9a9a;font-weight:400;margin-bottom:6px;text-transform:uppercase}
.hotel-page .field-box{
    border:1px solid #d9d9d9;
    border-radius:4px;
    min-height:36px;
    padding:8px 12px;
    font-size:14px;
    color:#666;
    background:#fafafa;
}
.hotel-page .price-line{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:12px 0 4px}
.hotel-page .small-muted{font-size:12px;color:#8d8d8d}
.hotel-page .light-note{font-size:11px;color:#9f9f9f}
.hotel-page .review-summary{
    display:grid;
    grid-template-columns:130px 1fr;
    gap:22px;
    align-items:start;
    border-top:1px solid #d9d9d9;
    padding-top:20px;
    margin-top:8px;
}
.hotel-page .review-score-card{text-align:center}
.hotel-page .review-score-box{
    width:64px;height:40px;background:#3aa84f;color:#fff;font-size:18px;font-weight:500;border-radius:4px;
    display:flex;align-items:center;justify-content:center;margin:8px auto 6px;
}
.hotel-page .review-bars{display:flex;flex-direction:column;gap:10px;padding-top:4px}
.hotel-page .bar-row{display:grid;grid-template-columns:28px 1fr 42px;gap:12px;align-items:center;font-size:14px;color:#666}
.hotel-page .bar-track{height:8px;background:#e9e9e9;border-radius:10px;overflow:hidden}
.hotel-page .bar-fill{height:100%;background:#eda726}
.hotel-page .review-item{
    background:#fff;
    border:1px solid #f0f0f0;
    border-radius:10px;
    padding:16px;
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
    margin-top:16px;
}
.hotel-page .review-author{font-weight:400;color:#3a3a3a}
.hotel-page .review-avatar{width:38px;height:38px;border-radius:50%;background:#e7ebf2;display:inline-flex;align-items:center;justify-content:center;color:#6c7891;margin-right:10px;flex:0 0 auto}
.hotel-page .review-main{display:flex;gap:10px}
.hotel-page .review-rating-chip{background:#36ad58;color:#fff;border-radius:4px;padding:4px 8px;font-weight:500;font-size:14px;white-space:nowrap}
.hotel-page .faq-list,.hotel-page .nearby-list,.hotel-page .extra-grid{display:grid;gap:14px}
.hotel-page .faq-item,.hotel-page .nearby-item,.hotel-page .info-card{
    background:#fff;border:1px solid var(--line);padding:16px;
}
.hotel-page .info-card h4,.hotel-page .faq-item h4,.hotel-page .nearby-item h4{margin:0 0 8px;font-size:16px;color:#2f2f2f}
.hotel-page .info-card p,.hotel-page .faq-item p,.hotel-page .nearby-item p{margin:0;color:#555;line-height:1.7}
.hotel-page .inline-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.hotel-page .wishlist-btn{border-radius:999px}
.hotel-page .thumb-strip{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.hotel-page .thumb-strip img{width:88px;height:64px;object-fit:cover;border:1px solid var(--line);cursor:pointer}
@media (max-width: 991.98px){
    .hotel-page .main-wrap{grid-template-columns:1fr}
    .hotel-page .booking-sticky{position:static}
    .hotel-page .amenities-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .hotel-page .video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 767.98px){
    .hotel-page .gallery-stage{grid-template-columns:1fr;min-height:240px}
    .hotel-page .gallery-tile:nth-child(n+2){display:none}
    .hotel-page .gallery-tile{min-height:240px}
    .hotel-page .main-wrap{gap:20px}
    .hotel-page .amenities-grid,.hotel-page .video-grid{grid-template-columns:1fr}
    .hotel-page .review-summary{grid-template-columns:1fr}
    .hotel-page .bar-row{grid-template-columns:24px 1fr 36px;gap:8px}
}

.hotel-page .review-form-card{
    background:#fff;
    border:1px solid #ececec;
    border-radius:18px;
    padding:18px;
}
.hotel-page .review-upload-preview{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:12px;
}
.hotel-page .review-upload-empty{
    border:1px dashed #d7d7d7;
    border-radius:14px;
    background:#fff;
    color:#6c757d;
    padding:14px;
    min-height:68px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}
.hotel-page .review-upload-item{
    display:flex;
    align-items:center;
    gap:12px;
    background:#fff;
    border:1px solid #ececec;
    border-radius:14px;
    padding:10px;
}
.hotel-page .review-upload-thumb{
    width:64px;
    height:64px;
    object-fit:cover;
    border-radius:10px;
    flex:0 0 auto;
}
.hotel-page .review-upload-meta{
    min-width:0;
    flex:1 1 auto;
}
.hotel-page .review-upload-name{
    font-size:13px;
    font-weight:400;
    color:#343a40;
    word-break:break-word;
    margin-bottom:8px;
}
.hotel-page .review-upload-remove{
    border:1px solid #dc3545;
    background:#fff;
    color:#dc3545;
    border-radius:999px;
    padding:4px 10px;
    font-size:12px;
    font-weight:400;
}
.hotel-page .review-upload-remove:hover{
    background:#dc3545;
    color:#fff;
}

/*// new styel*/
.hero-search-panel-wrap {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 22px;
}

.hero-search-panel {
    width: 100%;
    max-width: 1030px;
}

/* ✅ OUTER CARD */
.hero-search-card {
    max-width: 1080px;
    margin: 0 auto;
    padding: 4px;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
}

/* ✅ INNER ROW (SAME COLOR) */
.hero-search-row {
    display: grid;
    grid-template-columns: 2.1fr 1.25fr 1.15fr 165px;
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    align-items: stretch;
}

/* ✅ ALL COLUMNS SAME COLOR */
.hero-search-col {
    position: relative;
    min-height: 60px;
    border-right: 1.5px solid #d1d5db; /* 🔥 stronger border */
    background: #ffffff;
}

.hero-search-col:last-child {
    border-right: none;
}

.hero-search-location {
    padding: 0 16px;
}

.hero-location-box {
    position: relative;
    display: flex;
    align-items: center;
    height: 60px;
}

.hero-search-input {
    width: 100%;
    height: 60px;
    border: none;
    outline: none;
    background: transparent;
    font-size: 16px;
    color: #43546a;
    padding: 0 120px 0 0;
    box-shadow: none;
}

.hero-search-input::placeholder {
    color: #617286;
    opacity: 1;
}

.card,.glass-card,.section-card,.customer-panel,.customer-stat-card,.room-hero-card,.room-form-card,.room-list-card,.booking-card,.booking-hero,.booking-stat,.mini-card,.sidebar {background:#ffffff !important;}
.container,.container-fluid{background:transparent;}


/* =========================================================
   RESPONSIVE POLISH LAYER
   Added for consistent visibility across desktop, tablet, mobile
   Keeps existing HTML/JS functionality intact
========================================================= */
html{
    -webkit-text-size-adjust:100%;
}

*, *::before, *::after{
    box-sizing:border-box;
}

img{
    max-width:100%;
    height:auto;
}

.home-hero-wrap{
    overflow:visible;
}

.home-hero-content{
    width:min(1240px, calc(100% - 32px));
}

.home-search-grid,
.home-search-item,
.home-search-item--destination,
.destination-input-wrap,
.location-field,
#guestToggle,
.guest-pop,
.city-suggestion-list{
    overflow:visible;
}

.home-search-grid{
    gap:0;
}

.home-search-item{
    min-width:0;
}

.destination-input-wrap,
.home-search-input,
#guestToggle{
    min-width:0;
}

.destination-input{
    width:100%;
    min-width:0;
    padding:0;
}

.home-search-input,
#guestToggle{
    padding:10;
}

.home-search-input{
    overflow:hidden;
    text-overflow:ellipsis;
}

#guestToggle{
    justify-content:flex-start;
    white-space:normal;
    line-height:1.45;
}

.near-me-chip,
.home-search-btn,
.guest-step-btn,
.guest-clear-btn,
.guest-apply-btn,
.btn-view-details,
.btn-book-now{
    -webkit-tap-highlight-color:transparent;
}

.near-me-chip{
    flex:0 0 auto;
    cursor:pointer;
}

.city-suggestion-list{
    left:0;
    right:auto;
    transform:none;
    width:100%;
    max-width:100%;
    max-height:280px;
}

.guest-pop{
    top:calc(100% + 10px);
    right:0;
    left:auto;
    width:320px;
    max-width:min(320px, calc(100vw - 24px));
    border:1px solid #e5e7eb;
    border-radius:18px;
    box-shadow:0 24px 60px rgba(15,23,42,.18);
}

.guest-row{
    align-items:center;
}

.guest-row > :first-child{
    min-width:0;
}

.guest-row-title,
.guest-row-sub,
.guest-count{
    word-break:break-word;
}

.search-layout,
.search-layout.map-off{
    width:100%;
}

.hotel-row,
.hotel-row--compact,
.home-top-static-images,
.footer-bottom-bar,
.footer-city-grid,
.destination-slider,
.row{
    min-width:0;
}

@media (min-width: 1200px){
    .home-search-grid{
        grid-template-columns:minmax(250px,1.2fr) minmax(250px,.85fr) minmax(250px,.85fr) minmax(220px,.55fr);
    }

    .home-search-item{
        min-height:66px;
    }

    .home-search-btn{
        min-height:66px;
        font-size:18px;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px){
    .home-hero-content{
        width:min(100%, calc(100% - 28px));
        padding:72px 14px 38px;
    }

    .home-hero-title{
        font-size:42px;
        line-height:1.12;
    }

    .home-hero-sub{
        font-size:16px;
        line-height:1.6;
        max-width:640px;
    }

    .home-search-grid{
        grid-template-columns:1fr 1fr;
        border-radius:18px;
        overflow:hidden;
    }

    .home-search-item{
        min-height:70px;
        padding:0 18px;
    }

    .home-search-item:nth-child(2){
        border-right:none;
    }

    .home-search-item:nth-child(1),
    .home-search-item:nth-child(2){
        border-bottom:1px solid #e6ebf1;
    }

    .home-search-item--destination{
        padding:0 16px 0 18px;
    }

    .location-field{
        grid-template-columns:minmax(0,1fr) auto;
        gap:10px;
    }

    .destination-input,
    .home-search-input,
    #guestToggle{
        font-size:15px;
    }

    .near-me-chip{
        min-width:116px;
        height:40px;
        border-radius:10px;
    }

    .search-button-wrap{
        grid-column:1 / -1;
        padding:0;
    }

    .home-search-btn{
        min-height:60px;
        height:60px;
        border-radius:0 0 18px 18px;
        font-size:18px;
    }

    .guest-pop{
        width:340px;
        max-width:min(340px, calc(100vw - 40px));
    }

    .search-layout,
    .search-layout.map-off{
        grid-template-columns:280px minmax(0,1fr);
    }

    .search-filters{
        padding:16px 14px 24px;
    }

    .hotel-row,
    .search-layout.map-off .hotel-row{
        grid-template-columns:1fr;
        gap:14px;
    }

    .hotel-media{
        grid-template-columns:minmax(0,1fr) 74px;
    }

    .hotel-main-image,
    .search-layout.map-off .hotel-main-image{
        height:250px;
    }

    .footer-city-grid{
        grid-template-columns:repeat(4, minmax(0, 1fr));
        gap:10px 16px;
    }
}

@media (max-width: 767.98px){
    .home-hero-wrap{
        min-height:auto;
    }

    .home-hero-content{
        width:min(100%, calc(100% - 20px));
        padding:16px 10px 28px;
    }

    .home-hero-copy{
        max-width:100%;
        margin-bottom:14px;
    }

    .home-hero-kicker{
        margin-bottom:12px;
        padding:7px 12px;
        font-size:12px;
    }

    .home-hero-title{
        font-size:28px;
        line-height:1.18;
        letter-spacing:-.4px;
        margin-bottom:8px;
    }

    .home-hero-sub{
        font-size:14px;
        line-height:1.5;
        max-width:100%;
    }

    .home-search-grid{
        display:grid;
        grid-template-columns:1fr;
        gap:0;
        border-radius:18px;
        overflow:visible !important;
    }

    .home-search-item{
        min-height:auto;
        padding:16px 14px;
        border-right:none !important;
        border-bottom:1px solid #eceff3;
        align-items:flex-start;
        justify-content:flex-start;
        overflow:visible !important;
    }

    .home-search-item:last-child{
        border-bottom:none;
    }

    .home-search-item--destination{
        padding:16px 14px 12px;
        z-index:70;
    }

    .location-field{
        grid-template-columns:1fr;
        gap:10px;
        align-items:stretch;
    }

    .destination-input-wrap{
        width:100%;
        z-index:80;
    }

    .destination-input{
        width:100%;
        height:auto;
        min-height:24px;
        font-size:15px;
        line-height:1.4;
    }

    .near-me-chip{
        width:100%;
        min-width:0;
        height:44px;
        border-radius:10px;
        font-size:15px;
        justify-content:center;
        gap:8px;
    }

    .home-search-input,
    #guestToggle{
        width:100%;
        min-height:30px;
        height:auto;
        font-size:15px;
        line-height:1.5;
        white-space:normal;
        display:block;
    }

    .city-suggestion-list{
        top:calc(100% + 8px);
        left:0;
        right:0;
        width:100%;
        max-width:none;
        border-radius:14px;
        max-height:240px;
        z-index:9999 !important;
    }

    .city-suggestion-item{
        padding:12px 14px;
        font-size:14px;
    }

    .guest-pop{
        position:absolute;
        top:calc(100% + 8px);
        left:0;
        right:0;
        width:100%;
        max-width:none;
        padding:14px;
        border-radius:16px;
        z-index:9999 !important;
    }

    .guest-row{
        gap:12px;
        padding:12px 0;
    }

    .guest-stepper{
        gap:10px;
        flex:0 0 auto;
    }

    .guest-step-btn{
        width:36px;
        height:36px;
    }

    .guest-count{
        min-width:18px;
        font-size:16px;
    }

    .child-age-wrap{
        grid-template-columns:1fr;
    }

    .guest-pop-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:10px;
    }

    .search-button-wrap{
        padding:14px;
        background:#fff;
        border-bottom:none !important;
    }

    .home-search-btn{
        width:100%;
        min-height:52px;
        height:52px;
        border-radius:12px;
        font-size:17px;
    }

    .mobile-search-actions{
        top:64px;
        padding:10px 12px;
    }

    .search-listing{
        padding:0 12px 24px;
        max-height:none;
    }

    .results-top-strip{
        gap:8px;
        padding:8px 0 12px;
        flex-wrap:wrap;
    }

    .hotel-row,
    .search-layout.map-off .hotel-row,
    .hotel-row--compact,
    .search-layout.map-off .hotel-row--compact{
        grid-template-columns:1fr;
        gap:12px;
        padding:14px 0 16px;
    }

    .hotel-media{
        grid-template-columns:1fr;
        gap:8px;
    }

    .hotel-main-image,
    .search-layout.map-off .hotel-main-image{
        height:230px;
    }

    .hotel-thumbs{
        display:grid;
        grid-template-columns:repeat(4,1fr);
        gap:6px;
    }

    .hotel-thumb{
        height:68px;
    }

    .hotel-bottom-row{
        flex-direction:column;
        align-items:flex-start;
        gap:12px;
    }

    .hotel-price-wrap{
        min-width:0;
        width:100%;
    }

    .hotel-actions{
        display:flex !important;         /* ✅ grid hatao */
        flex-direction:row;              /* ✅ side by side */
        gap:10px;
        width:100%;
    }

    .btn-view-details,
    .btn-book-now{
        flex:1;                          /* ✅ equal width */
        width:50%;
        min-width:0;
        height:42px;
        font-size:14px;
        margin:0;
    }

    .section-head{
        gap:10px;
        flex-wrap:wrap;
    }

    .footer-banner-line{
        padding:12px 10px;
        font-size:14px;
    }

    .footer-mobile-accordion{
        padding:10px 0 6px;
    }

    .footer-mobile-cities{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 480px){
    .home-hero-content{
        width:min(100%, calc(100% - 16px));
        padding:14px 8px 24px;
    }

    .home-search-item,
    .home-search-item--destination{
        padding-left:12px;
        padding-right:12px;
    }

    .search-button-wrap{
        padding:12px;
    }

    .destination-input,
    .home-search-input,
    #guestToggle,
    .near-me-chip{
        font-size:14px;
    }

    .guest-pop{
        padding:12px;
    }

    .guest-row{
        align-items:flex-start;
    }

    .guest-stepper{
        margin-left:auto;
    }

    .hotel-main-image,
    .search-layout.map-off .hotel-main-image{
        height:210px;
    }

    .hotel-thumb{
        height:60px;
    }

    .footer-mobile-cities{
        /*grid-template-columns:1fr;*/
    }
}
.booking-page{
    padding:24px 0 40px;
}

.booking-shell{
    max-width:1200px;
    margin:0 auto;
}

.booking-grid{
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:24px;
}

.booking-card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:20px;
    box-shadow:0 4px 16px rgba(15,23,42,.08);
    overflow:hidden;
}

.booking-card-header{
    padding:22px 24px 16px;
    border-bottom:1px solid var(--line);
}

.booking-card-body{
    padding:24px;
}

.booking-title{
    margin:0 0 4px;
    font-size:28px;
    font-weight:800;
    color:var(--dark);
    line-height:1.2;
}

.booking-subtitle{
    font-size:14px;
    color:var(--muted);
    line-height:1.5;
}

.info-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    background:var(--brand) !important;
    color:#fff !important; 
    border:1px solid #ffd7d4;
    border-radius:999px;
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
}

.booking-section-title{
    margin-bottom:18px;
    font-size:20px;
    font-weight:800;
    color:#111827;
}

.field-label{
    display:block;
    margin-bottom:8px;
    font-size:13px;
    font-weight:700;
    color:#111827;
    line-height:1.4;
}

.form-control,
.form-select,
.form-control[readonly]{
    min-height:48px;
    border:1px solid #dfe3e8;
    border-radius:14px !important;
    box-shadow:none !important;
}

.form-control:focus,
.form-select:focus{
    border-color:#9ca3af;
    box-shadow:none !important;
}

.booking-static-box{
    height:100%;
    padding:14px 16px;
    background:#f7f8fb;
    border:1px solid #e5e7eb;
    border-radius:16px;
}

.booking-static-label{
    margin-bottom:6px;
    font-size:12px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#6b7280;
}

.booking-static-value{
    font-size:15px;
    font-weight:700;
    color:#111827;
    line-height:1.4;
}

.summary-img{
    width:100%;
    height:220px;
    object-fit:cover;
    border:1px solid #ececec;
    border-radius:18px;
    display:block;
}

.hotel-name{
    margin:14px 0 6px;
    font-size:24px;
    font-weight:800;
    color:#111827;
    line-height:1.3;
}

.room-name{
    margin-bottom:8px;
    font-size:15px;
    font-weight:700;
    color:#374151;
    line-height:1.4;
}

.address-text{
    font-size:14px;
    color:#6b7280;
    line-height:1.5;
}

.price-box{
    margin-top:18px;
    padding:16px;
    background:#ffffff;
    border:1px solid #ececec;
    border-radius:18px;
}

.price-row{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
    padding:10px 0;
    border-bottom:1px dashed #e5e7eb;
    font-size:14px;
}

.price-row:last-child{
    border-bottom:none;
}

.price-key{
    color:#6b7280;
    font-weight:600;
    line-height:1.4;
}

.price-val{
    color:#111827;
    font-weight:700;
    text-align:right;
    line-height:1.4;
    word-break:break-word;
}

.price-old{
    color:#9ca3af;
    font-weight:600;
    text-decoration:line-through;
}

.price-green{
    color:var(--green);
}

.price-final{
    font-size:28px;
    font-weight:900;
    color:var(--dark);
    line-height:1.1;
}

.offer-badge{
    display:inline-flex;
    align-items:center;
    padding:6px 12px;
    background:#ecfdf3;
    color:#15803d;
    border:1px solid #bbf7d0;
    border-radius:999px;
    font-size:13px;
    font-weight:800;
}

.collapse-toggle{
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:14px 16px;
    background:#f9fafb;
    border:1px solid #e5e7eb;
    border-radius:16px;
    text-align:left;
    font-weight:800;
    color:#111827;
    cursor:pointer;
    transition:all .2s ease;
}

.collapse-toggle:hover{
    background:#f3f4f6;
}

.collapse-toggle .icon{
    transition:transform .25s ease;
    flex-shrink:0;
}

.collapse-toggle.active .icon{
    transform:rotate(180deg);
}

.optional-panel{
    display:none;
    margin-top:14px;
    padding:18px;
    background:#fbfcff;
    border:1px solid #eceff3;
    border-radius:18px;
}

.booking-submit-btn{
    min-height:52px;
    padding:12px 18px;
    background:var(--brand) !important;
    border:none;
    border-radius:16px;
    font-size:16px;
    font-weight:800;
    color:#ffffff;
    /*transition:background .2s ease, transform .2s ease;*/
}

.booking-submit-btn:hover{
    background:#000000;
}

.booking-submit-btn:focus{
    box-shadow:none !important;
}

.sticky-summary{
    position:sticky;
    top:90px;
}

@media (max-width: 991.98px){
    .booking-grid{
        grid-template-columns:1fr;
    }

    .sticky-summary{
        position:static;
        top:auto;
    }

    .booking-card-header,
    .booking-card-body{
        padding:18px;
    }

    .booking-title{
        font-size:24px;
    }

    .hotel-name{
        font-size:22px;
    }

    .price-final{
        font-size:24px;
    }
}

@media (max-width: 575.98px){
    .booking-page{
        padding:16px 0 28px;
    }

    .booking-card-header,
    .booking-card-body{
        padding:16px;
    }

    .booking-title{
        font-size:22px;
    }

    .booking-section-title{
        font-size:18px;
    }

    .summary-img{
        height:200px;
    }

    .hotel-name{
        font-size:20px;
    }

    .room-name,
    .address-text,
    .price-row,
    .price-key,
    .price-val{
        font-size:13px;
    }

    .price-final{
        font-size:22px;
    }

    .info-pill{
        font-size:12px;
        padding:7px 12px;
    }

    .collapse-toggle{
        padding:12px 14px;
        font-size:14px;
    }

    .optional-panel{
        padding:14px;
    }

    .booking-submit-btn{
        min-height:48px;
        font-size:15px;
        border-radius:14px;
    }
}

/* =========================
   Dynamic theme override
   ========================= */
body,
.site-shell,
.main-content,
.content-wrap,
.search-page-shell,
.search-results-shell,
.search-map-panel,
.table,
.table-responsive,
.offcanvas,
.dropdown-menu,
.modal-content,
.city-suggestion-list,
.filter-guest-pop,
.home-search-box,
.hero-search-box,
.room-form-card,
.room-list-card,
.room-hero-card,
.room-page-wrap,
.section-card,
.customer-panel,
.customer-stat-card,
.customer-booking-item,
.customer-quick-link,
.card,
.hotel-row,
.hotel-price-block,
.hotel-main-image,
.hotel-thumb,
.hotel-gallery-thumbs,
.hotel-book-card,
.booking-card,
.booking-hero,
.property-card,
.gallery-modal-content,
.gallery-strip,
.gallery-main,
.faq-item,
.invoice-card,
.auth-card{
  background:var(--panel);
  color:var(--text);
}

h1,h2,h3,h4,h5,h6,
.hotel-info-title,.hotel-location,.hotel-distance,.hotel-current-price,.hotel-tax strong,.amenity-row,.amenity-more,
.room-page-title,.room-section-title,.field-label,.customer-dashboard .dashboard-title,.customer-panel h2,.customer-stat-value,
.mobile-search-btn,.mobile-search-filters,.guest-row-title,.guest-count,.child-age-title,.child-age-select,.offer-strip,.hotel-tag,.membership-badge,
.membership-badge .member-icon,.price-detail strong,.search-summary-title,.search-summary-count,.hotel-name,.hotel-price-marker{
  color:var(--text);
}

p,small,span.text-muted,.soft,.booking-muted,.room-small-muted,.section-note,.form-help,.field-help,.room-help,.customer-dashboard .dashboard-subtitle,.customer-stat-label,.customer-booking-meta,.hotel-tax,.hotel-old-price,.hotel-rating-text,.rating-meta,.child-age-note,.guest-row-sub,.map-fallback,.hotel-distance .dot + span{
  color:var(--muted) !important;
}

a,.clear-link,.hotel-location .dot,.hotel-distance .dot,.hotel-off,.map-toggle-label,.search-filter-link,.search-view-link,.footer-shell a:hover{
  color:var(--brand);
}

.btn-primary,
.search-cta-btn,
.hero-search-btn,
.book-now-btn,
.hotel-book-btn,
.apply-btn,
.guest-apply-btn,
.price-pill,
.page-item.active .page-link,
.nav-pills .nav-link.active,
.nav-tabs .nav-link.active,
.map-toggle input:checked + .slider,
.hotel-tag-mid-range,
.mobile-apply-btn,
.filter-apply-btn{
  background:var(--brand) !important;
  border-color:var(--brand) !important;
  color:#fff !important;
}

.btn-primary:hover,.btn-primary:focus,
.search-cta-btn:hover,.hero-search-btn:hover,.book-now-btn:hover,.hotel-book-btn:hover,
.apply-btn:hover,.guest-apply-btn:hover,.top-link.partner-btn:hover,.mobile-apply-btn:hover,.filter-apply-btn:hover{
  background:var(--brand-dark) !important;
  border-color:var(--brand-dark) !important;
}

.btn-outline-primary,
.mobile-search-btn.active,
.mobile-search-filters.active,
.page-link,
.form-check-input:checked{
  color:var(--brand);
  border-color:var(--brand);
}

.btn-outline-primary:hover,.btn-outline-primary:focus{
  background:var(--brand) !important;
  border-color:var(--brand) !important;
  color:#fff !important;
}

.form-control:focus,.form-select:focus,.filter-input:focus,.filter-select:focus,.child-age-select:focus,
.destination-input:focus,.guest-input:focus,.search-input:focus{
  border-color:var(--brand) !important;
}

.sidebar a:hover,.sidebar a.active,
.mobile-sidebar-link:hover,.mobile-sidebar-link.active,
.mobile-city-link:hover,.mobile-city-link.active,
.city-suggestion-item:hover,.city-suggestion-item.active,
.customer-quick-link:hover,.customer-booking-status{
  background:rgba(var(--brand-rgb),.08) !important;
  color:var(--brand-dark) !important;
  border-color:rgba(var(--brand-rgb),.24) !important;
}

.offer-strip,.soft-box,.membership-badge,.hotel-discount-badge,.coupon-chip,.discount-chip{
  background:rgba(var(--brand-rgb),.06) !important;
  border-color:rgba(var(--brand-rgb),.24) !important;
  color:var(--text) !important;
}

.topbar{
  background:var(--header-bg) !important;
  color:var(--header-text) !important;
}
.logo-word,.top-link,.top-link i,.mobile-menu-btn,.mobile-center-logo .logo-word{
  color:var(--header-text) !important;
}

.home-hero-wrap,.hero-shell,.hero-banner,.hero-bg{
  background:linear-gradient(135deg, var(--hero-start), var(--hero-end)) !important;
}
.home-hero-single-bg::before,.hero-overlay::before{
  background:linear-gradient(135deg, rgba(var(--hero-start-rgb),.28), rgba(var(--hero-end-rgb),.22)), linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.18) 42%, rgba(0,0,0,.28) 100%) !important;
}
.hero-chip,.hero-title,.hero-subtitle,.hero-search-label,.hero-caption,.hero-count{
  color:#fff !important;
}

.footer-shell{
  background:var(--footer-bg) !important;
  color:var(--footer-text) !important;
}
.footer-shell *, .footer-shell a, .footer-shell p, .footer-shell h1, .footer-shell h2, .footer-shell h3, .footer-shell h4, .footer-shell h5, .footer-shell h6{
  color:var(--footer-text) !important;
}

.border,.table,.table td,.table th,.section-card,.card,.hotel-row,.customer-panel,.customer-stat-card,.customer-booking-item,.customer-quick-link,.form-control,.form-select,.filter-input,.filter-select,.child-age-select,.city-suggestion-list,.dropdown-menu,.modal-content,.gallery-thumb,.hotel-thumb,.search-map-panel{
  border-color:var(--line) !important;
  
}

.surface-soft,.soft-surface,.guest-clear-btn,.filter-card,.hotel-tag,.rating-box,.badge-soft{
  background:var(--brand) !important;
}

.rating-box{
  color:#fff !important;
  background:var(--brand) !important;
}

.hotel-current-price,.price-value,.amount-value,.booking-total,.final-price{
  color:var(--text) !important;
}
.hotel-old-price,.strike-price,.original-price{
  color:var(--muted) !important;
}
.hotel-off,.discount-text,.discount-percent{
  color:var(--brand) !important;
}

/* ===== Front-page theme sync patch: home/search/hotel only ===== */
/* Uses the 4 existing admin color settings:
   brand_color, brand_dark_color, hero_start_color, hero_end_color */

.home-hero-wrap,
.home-top-static-images-wrap{
    position:relative;
}
.home-hero-overlay,
.home-top-static-overlay{
    background:linear-gradient(135deg, rgba(var(--hero-start-rgb), .86), rgba(var(--hero-end-rgb), .60)) !important;
}
.home-hero-kicker{
    background:rgba(var(--brand-rgb), .14) !important;
    border:1px solid rgba(var(--brand-rgb), .28) !important;
    color:#fff !important;
}
.home-top-image-box,
.home-top-img-box{
    border:1px solid rgba(var(--brand-rgb), .12);
    box-shadow:0 14px 40px rgba(var(--brand-rgb), .10);
}
.home-search-label{
    color:var(--brand-dark) !important;
}
.home-search-input,
.destination-input,
#guestToggle,
#dateRange{
    border-color:rgba(var(--brand-rgb), .18) !important;
}
/*.home-search-input:focus,*/
/*.destination-input:focus,*/
/*#guestToggle:focus,*/
/*#dateRange:focus,*/
/*.home-search-item:focus-within{*/
/*    border-color:var(--brand) !important;*/
/*}*/
.near-me-chip,
.guest-apply-btn,
.home-search-btn,
.child-age-select:focus{
    border-color:var(--brand) !important;
}
.near-me-chip{
    background:rgba(var(--brand-rgb), .08) !important;
    color:var(--brand-dark) !important;
}
.near-me-chip:hover{
    background:var(--brand) !important;
    color:#fff !important;
}
.home-search-btn,
.guest-apply-btn{
    background:linear-gradient(135deg, var(--brand), var(--brand-dark)) !important;
    color:#fff !important;
    box-shadow:0 10px 24px rgba(var(--brand-rgb), .26);
}
.home-search-btn:hover,
.guest-apply-btn:hover{
    background:linear-gradient(135deg, var(--brand-dark), var(--brand-dark)) !important;
}
.show-more-btn,
.search-results-shell .show-more-btn,
.hotel-page .show-more-btn{
    color:var(--brand-dark) !important;
}
.guest-step-btn:hover,
.guest-step-btn:focus{
    border-color:var(--brand) !important;
    color:var(--brand-dark) !important;
    box-shadow:0 0 0 3px rgba(var(--brand-rgb), .10);
}
.child-age-select:focus,
.filter-input:focus,
.filter-select:focus,
.field-box:focus-within{
    box-shadow:0 0 0 3px rgba(var(--brand-rgb), .10) !important;
}
.city-suggestion-item:hover,
.city-suggestion-item.active{
    background:rgba(var(--brand-rgb), .08) !important;
    color:var(--brand-dark) !important;
}
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected{
    background:var(--brand) !important;
    border-color:var(--brand) !important;
}
.flatpickr-day.inRange{
    background:rgba(var(--brand-rgb), .14) !important;
    border-color:rgba(var(--brand-rgb), .14) !important;
}

.search-results-shell .search-filters,
.search-results-shell .hotel-card,
.search-results-shell .empty-results,
.search-results-shell .map-toolbar{
    border-color:rgba(var(--brand-rgb), .10);
}
.search-results-shell .filter-title,
.search-results-shell .sort-title,
.search-results-shell .result-count strong,
.search-results-shell .hotel-name,
.search-results-shell .hotel-title,
.search-results-shell .hotel-card-title,
.search-results-shell .price-value,
.search-results-shell .final-price,
.search-results-shell .current-price{
    color:var(--text) !important;
}
.search-results-shell .selected-filter,
.search-results-shell .active-filter,
.search-results-shell .filter-chip.active,
.search-results-shell .sort-chip.active,
.search-results-shell .sort-btn.active,
.search-results-shell .map-toggle.active,
.search-results-shell .pagination .active .page-link{
    background:var(--brand) !important;
    border-color:var(--brand) !important;
    color:#fff !important;
}
.search-results-shell .filter-chip:hover,
.search-results-shell .sort-chip:hover,
.search-results-shell .sort-btn:hover,
.search-results-shell .pagination .page-link:hover,
.search-results-shell .btn-book-now:hover,
.search-results-shell .btn-view-details:hover{
    border-color:var(--brand) !important;
    color:var(--brand-dark) !important;
}
.search-results-shell .hotel-rating-badge,
.search-results-shell .rating-box,
.search-results-shell .score-pill,
.search-results-shell .discount-badge,
.search-results-shell .discount-pill,
.search-results-shell .tag-offer,
.search-results-shell .hotel-badge--featured,
.search-results-shell .hotel-badge--discount,
.search-results-shell .promo-badge{
    background:var(--brand) !important;
    color:#fff !important;
    border-color:var(--brand) !important;
}
.search-results-shell .price-old,
.search-results-shell .old-price{
    color:#9ca3af !important;
}
.search-results-shell .discount-text,
.search-results-shell .save-text,
.search-results-shell .distance-text,
.search-results-shell .hotel-link,
.search-results-shell .map-link{
    color:var(--brand-dark) !important;
}
.search-results-shell .btn-book-now,
.search-results-shell .search-btn,
.search-results-shell .apply-btn,
.search-results-shell .reset-btn:hover{
    background:var(--brand) !important;
    border-color:var(--brand) !important;
    color:#fff !important;
}
.search-results-shell .btn-book-now:hover,
.search-results-shell .search-btn:hover,
.search-results-shell .apply-btn:hover{
    background:var(--brand-dark) !important;
    border-color:var(--brand-dark) !important;
    color:#fff !important;
}

.hotel-page .featured-badge,
.hotel-page .score-pill,
.hotel-page .login-banner,
.hotel-page .book-btn,
.hotel-page .check-btn,
.hotel-page .discount-inline,
.hotel-page .tag,
.hotel-page .badge-theme{
    border-color:var(--brand) !important;
}
.hotel-page .section-head{
    color:var(--text) !important;
}
.hotel-page .section-head::before{
    background:linear-gradient(180deg, var(--brand), var(--brand-dark)) !important;
    border-radius:999px;
}
.hotel-page .amenity-item i,
.hotel-page .tab.active,
.hotel-page .discount-inline,
.hotel-page .meta-link,
.hotel-page .show-more-btn,
.hotel-page a:not(.book-btn):not(.check-btn){
    color:var(--brand-dark);
}
.hotel-page .room-meta span,
.hotel-page .field-box,
.hotel-page .review-item,
.hotel-page .faq-item,
.hotel-page .nearby-item,
.hotel-page .info-card,
.hotel-page .room-card,
.hotel-page .room-price-box,
.hotel-page .price-login-card,
.hotel-page .map-box,
.hotel-page .video-box,
.hotel-page .video-grid img,
.hotel-page .thumb-strip img{
    border-color:rgba(var(--brand-rgb), .12) !important;
}
.hotel-page .book-btn,
.hotel-page .check-btn,
.hotel-page .featured-badge,
.hotel-page .score-pill,
.hotel-page .login-banner{
    background:linear-gradient(135deg, var(--brand), var(--brand-dark)) !important;
    color:#fff !important;
}
.hotel-page .book-btn:hover,
.hotel-page .check-btn:hover{
    background:linear-gradient(135deg, var(--brand-dark), var(--brand-dark)) !important;
    color:#fff !important;
}
.hotel-page .review-score-box,
.hotel-page .review-rating-chip,
.hotel-page .policy-inline .badge-ok,
.hotel-page .bar-fill{
    background:var(--brand) !important;
    color:#fff !important;
}
.hotel-page .tab.active{
    border-bottom:2px solid var(--brand);
}
.hotel-page .wishlist-btn:hover,
.hotel-page .inline-actions .btn:hover{
    border-color:var(--brand) !important;
    color:var(--brand-dark) !important;
}


/* homepage hero panels below banner */
/* ===== HOME FEATURE PANELS ===== */
.home-feature-panel{
    position:relative;
    margin-bottom:20px;
}

.home-feature-card{
    position:relative;
    width:100%;
    min-height:260px;
    border-radius:30px;
    overflow:hidden;
    box-shadow:0 20px 55px rgba(15,23,42,.14);
}

.home-feature-card img{
    width:100%;
    height:260px;
    display:block;
    object-fit:cover;
    transform:scale(1.01);
}

.home-feature-panel-overlay{
    position:absolute;
    inset:0;
    z-index:1;
}

.home-feature-panel-content{
    position:absolute;
    inset:0;
    z-index:2;
    display:flex;
    padding:30px;
}

.home-feature-copy{
    max-width:760px;
}

.home-hero-kicker{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:14px;
    padding:7px 14px;
    border-radius:999px;
    font-size:13px;
    font-weight:700;
    letter-spacing:.2px;
}

.home-feature-title{
    margin:0 0 10px;
    font-size:32px;
    line-height:1.1;
    font-weight:800;
}

.home-feature-sub{
    margin:0;
    font-size:16px;
    line-height:1.6;
    max-width:650px;
}

/* ===== VARIANT 1 : Right Side Glass Card ===== */
.feature-variant-1 .home-feature-panel-overlay{
    background:linear-gradient(90deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.18) 100%);
}

.feature-variant-1 .home-feature-panel-content{
    align-items:center;
    justify-content:flex-start; /* LEFT SIDE */
}

.feature-variant-1 .home-feature-copy{
    max-width:590px;
    background:rgba(255,255,255,.16);
    border:2px solid rgba(255,255,255,.24);
    backdrop-filter:blur(15px);
    padding:18px;
    border-radius:24px;
    box-shadow:0 12px 30px rgba(0,0,0,.14);
}

.feature-variant-1 .home-hero-kicker{
    background:rgba(255,255,255,.88);
    color:#111827;
    border:1px solid rgba(255,255,255,.9);
}

.feature-variant-1 .home-feature-title{
    color:#fff;
    text-shadow:0 2px 12px rgba(0,0,0,.25);
}

.feature-variant-1 .home-feature-sub{
    color:#ffffff !important;
}

/* ===== VARIANT 2 : Center Text ===== */
.feature-variant-2 .home-feature-panel-overlay{
    background:linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.52) 100%);
}

.feature-variant-2 .home-feature-panel-content{
    align-items:center;
    justify-content:center;
    text-align:center;
}

.feature-variant-2 .home-feature-copy{
    max-width:820px;
    margin:0 auto;
}

.feature-variant-2 .home-hero-kicker{
    background:rgba(255,255,255,.18);
    border:1px solid rgba(255,255,255,.34);
    color:#fff;
}

.feature-variant-2 .home-feature-title{
    color:#fff;
    text-shadow:0 4px 18px rgba(0,0,0,.35);
}

.feature-variant-2 .home-feature-sub{
    color:#ffffff !important;
    margin-left:auto;
    margin-right:auto;
}

/* ===== VARIANT 3 : Right Side Glass Card ===== */
.feature-variant-3 .home-feature-panel-overlay{
    background:linear-gradient(90deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.18) 100%);
}

.feature-variant-3 .home-feature-panel-content{
    align-items:center;
    justify-content:flex-end;
}

.feature-variant-3 .home-feature-copy{
    max-width:490px;
    background:rgba(255,255,255,.16);
    border:1px solid rgba(255,255,255,.24);
    backdrop-filter:blur(10px);
    padding:18px;
    border-radius:24px;
    box-shadow:0 12px 30px rgba(0,0,0,.14);
}

.feature-variant-3 .home-hero-kicker{
    background:rgba(255,255,255,.88);
    color:#111827;
    border:1px solid rgba(255,255,255,.9);
}

.feature-variant-3 .home-feature-title{
    color:#fff;
    text-shadow:0 2px 12px rgba(0,0,0,.25);
}

.feature-variant-3 .home-feature-sub{
     color:#ffffff !important;
}

/* ===== VARIANT 4 : Top Left Editorial ===== */
.feature-variant-4 .home-feature-panel-overlay{
    background:
        linear-gradient(135deg, rgba(15,23,42,.64) 0%, rgba(15,23,42,.18) 46%, rgba(15,23,42,.10) 100%);
}

.feature-variant-4 .home-feature-panel-content{
    align-items:flex-start;
    justify-content:flex-start;
}

.feature-variant-4 .home-feature-copy{
    max-width:620px;
    padding-top:6px;
}

.feature-variant-4 .home-hero-kicker{
    background:#fff;
    color:#111827;
    border:1px solid #fff;
}

.feature-variant-4 .home-feature-title{
    color:#fff;
    text-shadow:0 3px 14px rgba(0,0,0,.24);
}

.feature-variant-4 .home-feature-sub{
   color:#ffffff !important;
}

/* =========================
   MOBILE ONLY
========================= */
@media (max-width: 767.98px){

  .home-feature-panel{
    margin-bottom:18px;
  }

  .home-feature-card{
    min-height:238px !important;
    border-radius:22px !important;
  }

  .home-feature-card img{
    height:238px !important;
  }

  .home-feature-panel-content{
    padding:14px !important;
    align-items:flex-end !important;
  }

  .home-feature-copy{
    padding:14px 14px 12px !important;
    border-radius:18px !important;
    background:rgba(58,64,73,.46) !important;
    border:1px solid rgba(255,255,255,.12) !important;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }

  .home-hero-kicker{
    font-size:12px !important;
    padding:7px 12px !important;
    margin-bottom:10px !important;
  }

  .home-feature-title{
    font-size:17px !important;
    line-height:1.25 !important;
    margin:0 !important;
  }

  /* phone par subtitle hide */
  .home-feature-sub{
    display:none !important;
  }
}

/* =========================================
   BOOKING DETAILS PAGE RESPONSIVE STYLE FIX
   Added for booking-details.php layout
   ========================================= */

.booking-hero{
  background:#ffffff;
  border:1px solid #e8ecf2;
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 14px 40px rgba(15,23,42,.07);
}

.booking-hero-media{
  background:#f8fafc;
  min-height:100%;
}

.booking-hero-media img{
  width:100%;
  height:100%;
  min-height:340px;
  max-height:420px;
  object-fit:cover;
  display:block;
}

.booking-hero-body{
  padding:28px;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.booking-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(var(--brand-rgb), .10);
  color:var(--brand-dark);
  font-size:13px;
  font-weight:700;
  line-height:1;
  border:1px solid rgba(var(--brand-rgb), .18);
}

.booking-muted{
  color:#6b7280;
  font-size:14px;
  line-height:1.6;
}

.booking-card{
  background:#ffffff;
  border:1px solid #e8ecf2;
  border-radius:22px;
  padding:24px;
  box-shadow:0 10px 30px rgba(15,23,42,.05);
}

.booking-card h2{
  margin:0 0 18px;
  font-size:21px;
  line-height:1.3;
  font-weight:800;
  color:#111827;
}

.booking-list-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}

.booking-stat{
  background:#f8fafc;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:16px;
  min-height:88px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.booking-stat-label{
  font-size:12px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:#6b7280;
  margin-bottom:7px;
}

.booking-stat-value{
  font-size:17px;
  font-weight:700;
  line-height:1.35;
  color:#111827;
  word-break:break-word;
}

.booking-line{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  padding:13px 0;
  border-bottom:1px solid #edf1f5;
}

.booking-line:last-child{
  border-bottom:none;
  padding-bottom:0;
}

.booking-line span{
  flex:0 0 42%;
  min-width:0;
}

.booking-line strong{
  flex:1 1 auto;
  min-width:0;
  text-align:right;
  color:#111827;
  font-size:15px;
  line-height:1.55;
  word-break:break-word;
}

.booking-gallery{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}

.booking-gallery img{
  width:100%;
  height:170px;
  object-fit:cover;
  display:block;
  border-radius:16px;
  border:1px solid #edf1f5;
  background:#f8fafc;
}

.booking-card .btn{
  border-radius:12px;
  font-weight:700;
  min-height:42px;
  padding-left:14px;
  padding-right:14px;
}

@media (min-width: 1400px){
  .booking-hero-body{padding:34px;}
  .booking-stat-value{font-size:18px;}
  .booking-gallery img{height:190px;}
}

@media (max-width: 991.98px){
  .booking-hero{border-radius:20px;}
  .booking-hero-media img{min-height:280px;max-height:320px;}
  .booking-hero-body{padding:22px;}
  .booking-card{padding:20px;border-radius:18px;}
  .booking-list-grid{grid-template-columns:repeat(2, minmax(0, 1fr));gap:12px;}
  .booking-gallery{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .booking-gallery img{height:160px;}
}

@media (max-width: 767.98px){
  .booking-hero{border-radius:18px;}
  .booking-hero-media img{min-height:220px;max-height:240px;}
  .booking-hero-body{padding:18px 16px;}
  .booking-chip{font-size:12px;padding:6px 10px;}
  .booking-card{padding:16px;border-radius:16px;}
  .booking-card h2{font-size:18px;margin-bottom:14px;}
  .booking-list-grid{grid-template-columns:1fr;gap:10px;}
  .booking-stat{min-height:auto;padding:14px;border-radius:14px;}
  .booking-stat-value{font-size:15px;}
  .booking-line{flex-direction:column;gap:4px;padding:12px 0;}
  .booking-line span,
  .booking-line strong{flex:1 1 auto;text-align:left;}
  .booking-gallery{grid-template-columns:1fr 1fr;gap:10px;}
  .booking-gallery img{height:130px;border-radius:12px;}
}

@media (max-width: 479.98px){
  .booking-hero-media img{min-height:190px;max-height:210px;}
  .booking-gallery{grid-template-columns:1fr;}
  .booking-gallery img{height:180px;}
}


/* =========================================
   BOOKING DETAILS COMPACT OVERRIDE
   ========================================= */
.booking-details-page{
  padding:14px 0 26px;
}

.booking-details-page .row.g-3{
  --bs-gutter-x:14px;
  --bs-gutter-y:14px;
}

.booking-hero{
  border-radius:18px !important;
  box-shadow:0 8px 24px rgba(15,23,42,.06) !important;
}

.booking-hero .row{
  align-items:stretch;
}

.booking-hero-media{
  background:#f8fafc;
}

.booking-hero-media img{
  width:100%;
  height:100%;
  min-height:210px !important;
  max-height:240px !important;
  object-fit:cover;
  display:block;
}

.booking-hero-body{
  padding:18px 18px 16px !important;
}

.booking-hero-body .h2{
  font-size:24px;
  line-height:1.2;
  margin-bottom:6px !important;
}

.booking-chip,
.booking-hero .badge{
  font-size:12px !important;
  padding:6px 10px !important;
}

.booking-muted{
  font-size:13px;
  line-height:1.45;
}

.booking-card{
  padding:16px !important;
  border-radius:16px !important;
  box-shadow:0 6px 18px rgba(15,23,42,.04) !important;
}

.booking-card h2{
  font-size:18px !important;
  margin:0 0 12px !important;
}

.booking-list-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
}

.booking-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}

.booking-stat{
  padding:12px !important;
  min-height:auto !important;
  border-radius:14px !important;
}

.booking-stat-label{
  font-size:11px !important;
  margin-bottom:5px !important;
}

.booking-stat-value{
  font-size:15px !important;
  line-height:1.3 !important;
}

.booking-line{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px !important;
  padding:8px 0 !important;
}

.booking-line span{
  flex:0 0 42%;
}

.booking-line strong{
  font-size:14px !important;
  line-height:1.4 !important;
  text-align:right;
}

.booking-empty{
  padding:16px !important;
  border-radius:14px !important;
  font-size:13px !important;
}

.booking-timeline-item{
  padding:10px 0;
  border-bottom:1px solid #edf1f5;
}
.booking-timeline-item:last-child{
  border-bottom:none;
  padding-bottom:0;
}

.table-responsive table{
  margin-bottom:0;
}
.table-responsive th,
.table-responsive td{
  white-space:nowrap;
  font-size:13px;
}

@media (max-width: 991.98px){
  .booking-hero-media img{
    min-height:190px !important;
    max-height:220px !important;
  }
  .booking-hero-body{
    padding:16px !important;
  }
  .booking-list-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .booking-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 767.98px){
  .booking-details-page{
    padding:10px 0 20px;
  }
  .booking-hero-media img{
    min-height:170px !important;
    max-height:190px !important;
  }
  .booking-hero-body .h2{
    font-size:20px;
  }
  .booking-card{
    padding:14px !important;
  }
  .booking-list-grid,
  .booking-stats{
    grid-template-columns:1fr !important;
  }
  .booking-line{
    flex-direction:column;
    gap:3px !important;
    padding:9px 0 !important;
  }
  .booking-line span,
  .booking-line strong{
    flex:1 1 auto;
    text-align:left;
  }
}

/* =========================
   COMPACT PREMIUM HOTEL CARD
========================= */

.hotel-card-grid-row{
  --bs-gutter-x: 18px;
  --bs-gutter-y: 18px;
}

.hotel-card-custom{
  background:#fff;
  border:1px solid #eceff3;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(15,23,42,.07);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  height:100%;
  display:flex;
  flex-direction:column;
  position:relative;
}

.hotel-card-custom:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(15,23,42,.12);
  border-color:#ffd7ca;
}

.hotel-card-image-wrap{
  position:relative;
  display:block;
  overflow:hidden;
  background:#f3f4f6;
}

.hotel-card-image-main{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
  transition:transform .35s ease;
}

.hotel-card-custom:hover .hotel-card-image-main{
  transform:scale(1.04);
}

.hotel-type-badge{
  position:absolute;
  top:12px;
  left:12px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:5px 10px;
  border-radius:999px;
  background:var(--brand) !important;
  color:#fff;
  font-size:12px;
  font-weight:600;
  backdrop-filter:blur(6px);
}

.hotel-card-body{
  padding:14px 14px 16px;
  display:flex;
  flex-direction:column;
  flex:1;
}

.hotel-card-title{
  font-size:16px;
  line-height:1.35;
  font-weight:600;
  color:#111827;
  margin:0 0 8px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.hotel-card-location{
  display:flex;
  align-items:flex-start;
  gap:7px;
  font-size:13px;
  color:#6b7280;
  margin-bottom:8px;
  line-height:1.45;
}

.hotel-card-location i{
  color:var(--brand);
  font-size:13px;
  margin-top:2px;
  flex:0 0 auto;
}

.hotel-card-location span{
  display:-webkit-box;
  -webkit-line-clamp:1;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.hotel-distance-text{
  font-size:12px;
  font-weight:600;
  color:#ff6a3a;
  margin-bottom:10px;
}

.hotel-card-rating-row{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  margin-bottom:10px;
}


.hotel-rating-label{
  font-size:12px;
  padding:0 8px;
  font-weight:600;
  color:#111827;
}

.hotel-amenities-row{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:12px;
}

.hotel-amenity-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:6px 9px;
  border-radius:999px;
  background:#f8fafc;
  border:1px solid #edf1f5;
  color:#374151;
  font-size:11px;
  font-weight:500;
  line-height:1;
}

.hotel-price-block{
  margin-top:auto;
  padding-top:4px;
}

.hotel-price-line-main{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:5px;
}

.hotel-card-cta-row{
  margin-top:14px;
}

.hotel-card-btn{ 
  display:flex;              /* inline-flex → flex */
  align-items:center;
  justify-content:center;
  width:50%;
  height:40px;
  margin: 0 auto;           /* 🔥 center align */
  border-radius:12px;
  background:var(--brand) !important;
  color:#fff !important;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  border:none;
  box-shadow:0 10px 20px rgba(255,106,58,.22);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.hotel-card-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 26px rgba(255,106,58,.28);
  opacity:.98;
}

.hotel-empty-card{
  background:#fff;
  border:1px solid #eceff3;
  border-radius:18px;
  padding:28px 18px;
  text-align:center;
  color:#6b7280;
  box-shadow:0 10px 28px rgba(15,23,42,.05);
}

@media (max-width: 991.98px){
  .hotel-card-image-main{
   width:100%;
   height:180px;
  }

  .hotel-card-title{
    font-size:15px;
  }

  .hotel-current-price{
    font-size:18px;
  }
}

@media (max-width: 575.98px){
  .hotel-card-grid-row{
    --bs-gutter-x: 14px;
    --bs-gutter-y: 14px;
  }

  .hotel-card-image-main{
    height:250px;
  }

  .hotel-card-body{
    padding:12px 12px 14px;
  }

  .hotel-card-title{
    font-size:15px;
  }
}


















.hotel-card-location{
    display:flex;
    align-items:flex-start;
    gap:8px;
    font-size:13px;
    color:#6b7280;
    line-height:1.5;
}

.hotel-card-location i{
    color:#9ca3af;
    margin-top:2px;
}

.hotel-card-rating-row{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.hotel-rating-label{
    font-size:13px;
    color:#4b5563;
}

.hotel-amenities-row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.hotel-amenity-chip{
    display:inline-flex;
    align-items:center;
    gap:6px;
    border:1px solid #d8dee6;
    color:#556070;
    background:#f9fafb;
    border-radius:999px;
    padding:6px 10px;
    font-size:12px;
    white-space:nowrap;
}

.hotel-price-block{
    margin-top:2px;
}

.hotel-price-line-main{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.hotel-current-price{
    font-size:22px;
    font-weight:700;
    color:#111827;
    line-height:1.1;
}

.hotel-old-price{
    font-size:16px;
    color:#6b7280;
    text-decoration:line-through;
}

.hotel-discount-off{
    font-size:14px;
    font-weight:700;
    color:#f26122;
}

.hotel-tax-text{
    margin-top:5px;
    font-size:12px;
    color:#6b7280;
}

.hotel-btn-wrap{
    margin-top:8px;
    text-align:center;
}

.hotel-view-btn{
    display:inline-block;
    min-width:120px;
    background:#f26122;
    color:#fff !important;
    text-decoration:none;
    border-radius:8px;
    padding:10px 18px;
    font-size:14px;
    font-weight:600;
    transition:.2s ease;
}

.hotel-view-btn:hover{
    background:#dd5418;
    color:#fff !important;
}

@media (max-width: 767px){
    .hotel-card-image-wrap{
        height:200px;
    }

    .hotel-card-title{
        font-size:20px;
    }

    .hotel-current-price{
        font-size:24px;
    }
}

.city-page-shell{background:#f6f8fb;}
.city-hero{background-size:cover;background-position:center;color:#fff;position:relative;}
.city-hero__content{max-width:760px;padding:24px 0;}
.city-hero__eyebrow{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.16);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px;}
.city-hero h1{font-size:clamp(28px,4vw,46px);line-height:1.05;margin:0 0 14px;font-weight:800;color:#fff;}
.city-hero p{font-size:16px;line-height:1.7;color:rgba(255,255,255,.92);margin:0;max-width:680px;}
.city-hero__chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.city-hero__chips span{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.14);backdrop-filter:blur(6px);font-weight:600;font-size:13px;}
.city-copy-card,.city-content-card{background:#fff;border:1px solid #e6ebf2;border-radius:20px;box-shadow:0 12px 32px rgba(15,23,42,.06);}
.city-copy-card{padding:22px 24px;}
.city-copy-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:10px;}
.city-copy-card__eyebrow{display:inline-block;color:var(--brand);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;}
.city-copy-card h2,.city-content-card h2{margin:0;font-size:24px;line-height:1.2;color:#111827;font-weight:700;}
.city-copy-card p,.city-content-card p{margin:0;color:#4b5563;line-height:1.8;font-size:15px;}
.city-content-zone{display:grid;gap:18px;}
.city-content-card{padding:24px;}
.city-content-card__header{margin-bottom:14px;}
.city-faq-list{display:grid;gap:12px;}
.city-faq-item{border:1px solid #e7ebf2;border-radius:16px;background:#fbfcfe;padding:0 18px;overflow:hidden;}
.city-faq-item summary{list-style:none;cursor:pointer;padding:18px 28px 18px 0;font-weight:700;color:#111827;position:relative;}
.city-faq-item summary::-webkit-details-marker{display:none;}
.city-faq-item summary::after{content:'+';position:absolute;right:0;top:16px;font-size:22px;color:var(--brand);font-weight:500;}
.city-faq-item[open] summary::after{content:'−';}
.city-faq-answer{padding:0 0 18px;color:#4b5563;line-height:1.75;}
.city-link-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;}
.city-link-grid a{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-radius:14px;border:1px solid #e7ebf2;background:#fff;color:#111827;font-weight:600;text-decoration:none;transition:.2s ease;}
.city-link-grid a:hover{border-color:rgba(var(--brand-rgb),.35);box-shadow:0 10px 20px rgba(15,23,42,.05);transform:translateY(-1px);}
.city-link-grid a::after{content:'›';font-size:20px;color:var(--brand);}
@media (max-width: 991px){
  .city-page-results{padding:16px 0 0;}
  .city-copy-card{margin:0 12px 12px;padding:18px;}
  .city-copy-card__top{flex-direction:column;}
  .city-copy-card h2,.city-content-card h2{font-size:22px;}
  .city-content-card{padding:18px;}
}

.auth-shell{margin-top:32px;margin-bottom:32px}.auth-card{border-radius:28px}.auth-aside{background:linear-gradient(135deg,#111827 0%,#ef4444 100%)}.soft{color:#6b7280}.pill{display:inline-flex;padding:8px 14px;border-radius:999px;font-weight:700}


/* =========================================================
   RESPONSIVE FRONTEND UPGRADE
   Desktop / Tablet / Mobile for Header + Body + Footer
   ========================================================= */
html{
  scroll-behavior:smooth;
}

*,*::before,*::after{
  box-sizing:border-box;
}

img,
picture,
video,
canvas,
svg{
  max-width:100%;
  height:auto;
}

.container,
.container-fluid{
  width:100%;
}

.site-header{
  width:100%;
}

.topbar-inner,
.mobile-header-bar,
.footer-top-grid,
.footer-bottom-bar,
.home-hero-content,
.search-results-shell,
.search-listing,
.search-filters,
.hotel-row,
.hotel-bottom-row,
.home-search-grid,
.section-head{
  min-width:0;
}

.logo-word{
  max-width:100%;
}

.topbar-right a,
.city-nav a,
.footer-links a,
.footer-city-grid a,
.footer-mobile-links a,
.footer-mobile-cities a{
  word-break:break-word;
}

.home-hero-wrap,
.main-content,
.site-shell,
.content-wrap,
.search-page-shell,
.footer-shell{
  width:100%;
  overflow-x:clip;
}

.home-hero-content{
  padding-left:20px;
  padding-right:20px;
}

.home-search-grid{
  gap:0;
}

.home-search-item,
.search-button-wrap{
  min-width:0;
}

.destination-input,
.home-search-input,
#guestToggle,
.filter-input,
.filter-select{
  min-width:0;
}

.city-suggestion-list{
  max-height:320px;
}

.hotel-row,
.hotel-media,
.hotel-bottom-row,
.hotel-actions,
.amenity-row,
.hotel-rating-row,
.results-top-strip,
.footer-socials,
.footer-bottom-bar,
.footer-city-grid,
.home-top-static-images,
.section-head{
  min-width:0;
}

.hotel-info-title,
.hotel-location,
.hotel-distance,
.hotel-tax,
.footer-copy,
.footer-contact-item,
.all-cities-slide-title,
.home-hero-title{
  overflow-wrap:anywhere;
}

.footer-shell{
  position:relative;
}

.footer-top-grid,
.footer-city-wrap,
.footer-bottom-bar,
.footer-mobile-accordion{
  padding-left:0;
  padding-right:0;
}

.footer-col{
  min-width:0;
}

.footer-city-grid{
  grid-template-columns:repeat(7, minmax(0, 1fr));
}

.footer-socials{
  flex-wrap:wrap;
}
.footer-city-title {
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
}
/* Large tablet and down */
@media (max-width: 1199.98px){
  .topbar-inner.desktop-only{
    gap:16px;
  }

  .topbar-right{
    gap:18px;
  }

  .search-layout{
    grid-template-columns:280px minmax(0,1fr) minmax(340px,40%);
  }

  .search-layout.map-off{
    grid-template-columns:280px minmax(0,1fr);
  }

  .hotel-row,
  .search-layout.map-off .hotel-row{
    grid-template-columns:360px minmax(0,1fr);
  }

  .footer-city-grid{
    grid-template-columns:repeat(5, minmax(0, 1fr));
    gap:10px 18px;
  }
}

/* Tablet */
@media (max-width: 991.98px){
  .site-header{
    position:sticky;
  }

  .topbar-inner,
  .topbar-inner.desktop-only{
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:12px;
    min-height:auto;
    padding:14px 0;
  }

  .topbar-right{
    width:100%;
    justify-content:flex-start;
    gap:12px 16px;
    margin-left:0;
  }

  .top-link{
    font-size:.92rem;
  }

  .city-nav{
    gap:18px;
    padding:10px 0;
  }

  .home-hero-content{
    padding:72px 18px 36px;
  }

  .home-hero-title{
    font-size:38px !important;
    line-height:1.12 !important;
    max-width:760px;
  }

  .home-search-grid{
    grid-template-columns:1fr 1fr;
  }

  .search-button-wrap{
    grid-column:1 / -1;
  }

  .home-search-btn{
    border-radius:0 0 16px 16px;
    min-height:56px;
  }

  .search-layout,
  .search-layout.map-off{
    grid-template-columns:1fr;
  }

  .search-filters,
  .search-listing,
  .search-map-panel{
    max-height:none;
    min-height:auto;
  }

  .search-listing{
    padding:8px 12px 24px;
  }

  .hotel-row,
  .search-layout.map-off .hotel-row{
    grid-template-columns:1fr;
    gap:14px;
    padding:14px 0 18px;
  }

  .hotel-media{
    grid-template-columns:1fr;
  }

  .hotel-main-image,
  .search-layout.map-off .hotel-main-image{
    height:260px;
    border-radius:14px;
  }

  .hotel-thumbs{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:6px;
  }

  .hotel-thumb{
    height:72px;
  }

  .hotel-bottom-row{
    align-items:flex-start;
  }

  .hotel-price-wrap{
    min-width:0;
    width:100%;
  }

  .hotel-actions{
    justify-content:flex-start;
    width:100%;
  }

  .footer-col.has-divider{
    border-right:none;
  }

  .footer-banner-line{
    font-size:14px;
    padding:12px 8px;
  }

  .footer-city-grid{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:10px 16px;
  }

  .footer-bottom-bar{
    flex-direction:column;
    align-items:flex-start;
  }

  .footer-copy{
    white-space:normal;
  }
}

/* Mobile */
@media (max-width: 767.98px){
  body{
    font-size:14px;
  }

  .site-header{
    top:0;
  }

  .topbar{
    padding:0;
  }

  .mobile-header-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:60px;
    gap:10px;
    padding:0;
  }

  .mobile-header-bar .logo-word,
  .logo-word{
    font-size:1.35rem !important;
    padding:6px 14px;
    min-height:40px;
    letter-spacing:.4px;
  }

  .mobile-menu-btn{
    font-size:1.5rem;
    padding:6px;
  }

  .city-nav-shell{
    display:none !important;
  }

  .home-hero-wrap{
    min-height:auto;
  }

  .home-hero-content{
    padding:18px 14px 28px;
  }

  .home-hero-title{
    font-size:28px !important;
    line-height:1.16 !important;
    letter-spacing:-.3px !important;
    margin-bottom:14px !important;
  }

  .home-search-grid{
    grid-template-columns:1fr;
  }

  .home-search-item{
    padding:16px 14px;
    border-right:none;
    border-bottom:1px solid #e7ebf0;
  }

  .home-search-item:last-child{
    border-bottom:none;
  }

  .home-search-item--destination{
    padding:16px 14px 12px;
  }

  .location-field{
    grid-template-columns:1fr;
    gap:10px;
  }

  .destination-input,
  .home-search-input,
  #guestToggle{
    font-size:14px;
    white-space:normal;
  }

  .near-me-chip{
    width:100%;
    min-width:0;
    height:42px;
  }

  .search-button-wrap{
    padding:14px;
    background:#fff;
  }

  .home-search-btn{
    min-height:52px;
    border-radius:10px;
    font-size:15px;
  }

  .city-suggestion-list{
    left:0;
    right:0;
    transform:none;
    width:100%;
    max-width:none;
    max-height:240px;
    border-radius:12px;
  }

  .guest-pop,
  .filter-guest-pop{
    left:0;
    right:0;
    width:auto;
    max-width:none;
  }

  .results-top-strip{
    flex-wrap:wrap;
    gap:8px;
    padding:8px 0 12px;
  }

  .offer-strip{
    width:100%;
  }

  .search-listing{
    padding:0 10px 22px;
  }

  .hotel-row,
  .search-layout.map-off .hotel-row{
    gap:12px;
    padding:12px 0 16px;
  }

  .hotel-main-image,
  .search-layout.map-off .hotel-main-image{
    height:230px;
    border-radius:12px;
  }

  .hotel-thumbs{
    grid-template-columns:repeat(4,1fr);
  }

  .hotel-thumb{
    height:60px;
  }

  .hotel-info-title{
    font-size:17px;
    line-height:1.3;
  }

  .hotel-location,
  .hotel-distance,
  .rating-meta,
  .amenity-row,
  .hotel-tax{
    font-size:13px;
  }

  .hotel-current-price{
    font-size:22px;
  }

  .hotel-old-price{
    font-size:16px;
  }

  .hotel-off{
    font-size:15px;
  }

   .hotel-actions{
        display:flex !important;         /* ✅ grid hatao */
        flex-direction:row;              /* ✅ side by side */
        gap:10px;
        width:100%;
    }

    .btn-view-details,
    .btn-book-now{
        flex:1;                          /* ✅ equal width */
        width:50%;
        min-width:0;
        height:42px;
        font-size:14px;
        margin:0;
    }

  .footer-shell{
    margin-top:28px;
  }

  .footer-banner-line{
    font-size:13px;
    line-height:1.5;
    padding:12px 12px 10px;
  }

  .footer-mobile-accordion{
    display:block;
    padding:8px 0 0;
  }

  .footer-mobile-card{
    padding:5px 0;
  }

  .footer-mobile-title{
    font-size:12px;
    margin-bottom:8px;
  }

  .footer-mobile-links,
  .footer-mobile-cities{
    gap:8px 12px;
  }

  .footer-mobile-links a,
  .footer-mobile-links div,
  .footer-mobile-cities a,
  .footer-copy,
  .footer-contact-item{
    font-size:13px;
    line-height:1.45;
  }

  .footer-socials{
      
    gap:16px;
  }
}

/* Small mobile */
@media (max-width: 575.98px){
  .home-hero-content{
    padding:16px 12px 24px;
  }

  .home-hero-title{
    font-size:24px !important;
  }

  .mobile-header-bar .logo-word,
  .logo-word{
    /*font-size:1.15rem !important;*/
    padding:6px 12px;
  }

  .home-search-item,
  .home-search-item--destination,
  .search-button-wrap{
    padding-left:12px;
    padding-right:12px;
  }

  .hotel-main-image,
  .search-layout.map-off .hotel-main-image{
    height:210px;
  }

  .hotel-thumbs{
    gap:5px;
  }

  .hotel-thumb{
    height:54px;
  }

  .hotel-actions{
    grid-template-columns:1fr;
  }

  .footer-city-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .footer-bottom-bar{
    gap:12px;
    padding-top:12px;
  }
}



.premium-map-container{position:relative;height:100%}
.premium-map-overlay{position:absolute;top:14px;left:14px;right:14px;z-index:4;display:flex;flex-direction:column;align-items:flex-start;gap:10px;pointer-events:none}
.premium-map-overlay > *{pointer-events:auto}
.map-search-pill{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid #e5e7eb;border-radius:999px;padding:12px 18px;font-size:14px;font-weight:700;color:#111827;box-shadow:0 10px 30px rgba(15,23,42,.12)}
.map-search-pill input{width:18px;height:18px;accent-color:#16a34a}
.map-refresh-btn{border:none;background:#fff;color:#111827;border-radius:999px;padding:12px 18px;font-size:14px;font-weight:800;box-shadow:0 10px 30px rgba(15,23,42,.18)}
.map-refresh-btn:hover{transform:translateY(-1px)}
.hotel-row{transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease}
.hotel-row.is-map-active{border-color:#16a34a;box-shadow:0 14px 30px rgba(22,163,74,.12);transform:translateY(-1px)}
.hotel-price-pin{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:9px 12px;background:#fff;border:1px solid #d1d5db;border-radius:999px;box-shadow:0 8px 24px rgba(15,23,42,.16);font-size:13px;font-weight:800;color:#111827;white-space:nowrap;transform:translateY(-10px);transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, color .18s ease}
.hotel-price-pin::after{content:"";position:absolute;left:50%;bottom:-7px;width:12px;height:12px;background:inherit;border-right:inherit;border-bottom:inherit;transform:translateX(-50%) rotate(45deg)}
.hotel-price-pin.is-active{background:#111827;color:#fff;border-color:#111827;box-shadow:0 14px 30px rgba(15,23,42,.28);transform:translateY(-14px) scale(1.02)}
.hotel-cluster-pin{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 10px;border-radius:999px;
background:#fff; color:#111827;font-weight:800;font-size:14px;box-shadow:0 12px 28px rgba(15,23,42,.24);border:4px solid #fff}
.map-hotel-pop{max-width:240px;padding:4px 2px 2px}
.map-hotel-pop__title{font-size:15px;font-weight:800;color:#111827;line-height:1.35;margin-bottom:4px}
.map-hotel-pop__meta{font-size:12px;color:#4b5563;margin-bottom:8px}
.map-hotel-pop__price{font-size:18px;font-weight:800;color:#111827;margin-bottom:10px}
.map-hotel-pop__link{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#16a34a;color:#fff;padding:9px 14px;font-size:13px;font-weight:700;text-decoration:none}
@media (max-width: 991px){.premium-map-overlay{top:12px;left:12px;right:12px}.map-search-pill,.map-refresh-btn{padding:11px 16px;font-size:13px}}


/* =========================================================
   FINAL RESPONSIVE HOME SEARCH CARD OVERRIDE
   Full-width premium card for phone + tablet
   Near Me in round box on right side
========================================================= */

.home-search-grid{
    display:grid;
    grid-template-columns:minmax(220px,0.9fr) minmax(240px,0.8fr) minmax(240px,0.8fr) 220px;
    gap:0;
    align-items:stretch;
    background:#fff;
    border-radius:18px;
    overflow:visible;
}

.home-search-item{
    min-height:72px;
    min-width:0;
    background:#fff;
    border-right:1px solid #e5e7eb;
    border-radius:0px;
    padding:0 18px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    box-shadow:none;
    overflow:visible;
}

.home-search-item:last-child{
    border-right:none;
}

.home-search-item--destination{
    padding:0 16px 0 18px;
    z-index:40;
}

.location-field{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    width:100%;
    padding-top:0;
}

.destination-input-wrap{
    position:relative;
    min-width:0;
    width:100%;
}

.destination-input{
    width:100%;
    min-width:0;
    border:none;
    border-radius:0;
    background:#fff;
    padding:0;
    font-size:15px;
    font-weight:500;
    color:#111827;
    outline:none;
    box-shadow:none;
}

.destination-input:focus{
    border:none;
    box-shadow:none;
}

.destination-input::placeholder{
    color:#6b7280;
    font-weight:400;
}

.near-me-chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:42px;
    min-width:42px;
    height:42px;
    padding:0;
    gap:0;
    border:1px solid #d1d5db;
    border-radius:999px;
    background:#fff;
    color:#111827;
    font-size:0;
    font-weight:600;
    line-height:1;
    white-space:nowrap;
    text-align:center;
    transition:.2s ease;
    flex:0 0 42px;
    cursor:pointer;
}

.near-me-chip i{
    font-size:16px;
    margin:0;
}

.near-me-chip:hover{
    background:#f9fafb;
    border-color:#c5cad3;
}

.home-search-input,
#guestToggle{
    width:100%;
    height:52px;
    min-width:0;
    border:none;
    outline:none;
    background:transparent;
    color:#111827;
    text-align:left;
    margin:0;
    box-shadow:none;
    display:flex;
    align-items:center;
}

.home-search-input{
    font-size:15px;
    font-weight:600;
    line-height:1.3;
    white-space:nowrap;
    cursor:pointer;
}

#guestToggle{
    font-size:15px;
    font-weight:600;
    line-height:1.35;
    cursor:pointer;
    white-space:nowrap;
    justify-content:flex-start;
}

.search-button-wrap{
    align-self:stretch;
    padding:0;
    border-right:none !important;
}

.home-search-btn{
    width:100%;
    min-height:72px;
    height:100%;
    border:none;
    border-radius:0 0px 0px 0;
    background:var(--accent);
    color:#fff;
    font-size:16px;
    font-weight:700;
    box-shadow:none;
    transition:.2s ease;
}

.home-search-btn:hover{
    background:#17ae46;
}

.city-suggestion-list{
    left:0;
    right:auto;
    transform:none;
    width:100%;
    max-width:100%;
    max-height:320px;
    z-index:9999 !important;
}

.guest-pop{
    position:absolute;
    top:calc(85% + 10px);
    right:0;
    left:auto;
    width:320px;
    max-width:min(320px, calc(100vw - 24px));
    border:1px solid #e5e7eb;
    border-radius:18px;
    box-shadow:0 24px 60px rgba(15,23,42,.18);
    z-index:9999 !important;
}

@media (min-width: 992px){
    .near-me-chip{
        width:42px;
        min-width:42px;
        height:42px;
        padding:0;
        border-radius:999px;
        font-size:0;
        gap:0;
        flex:0 0 42px;
    }

    .near-me-chip i{
        font-size:16px;
    }
}

@media (max-width: 991.98px){
    .home-hero-content{
        padding:28px 18px 32px;
    }

    .home-search-grid{
        grid-template-columns:1fr 1fr;
        gap:0;
        border-radius:18px;
    }

    .home-search-item{
        min-height:74px;
        padding:0 16px;
        border-right:1px solid #e5e7eb;
        border-bottom:1px solid #e5e7eb;
    }

    .home-search-item:nth-child(2n){
        border-right:none;
    }

    .home-search-item--destination{
        grid-column:1 / -1;
        padding:0 16px;
    }

    .location-field{
        grid-template-columns:minmax(0,1fr) auto;
        gap:12px;
    }

    .destination-input{
        font-size:15px;
    }

    .near-me-chip{
        width:44px;
        min-width:44px;
        height:44px;
        flex:0 0 44px;
    }

    .search-button-wrap{
        grid-column:1 / -1;
        padding:0;
        border-bottom:none;
    }

    .home-search-btn{
        min-height:58px;
        border-radius:0 0 18px 18px;
        font-size:16px;
    }

    .guest-pop{
        top:calc(100% + 10px);
        right:0;
        left:auto;
        width:320px;
        max-width:min(320px, calc(100vw - 24px));
    }
}

@media (max-width: 767.98px){
    .home-hero-content{
        padding:18px 12px 26px;
    }

    .home-search-grid{
        grid-template-columns:1fr;
        border-radius:18px;
    }

    .home-search-item{
        min-height:auto;
        padding:14px;
        border-right:none;
        border-bottom:1px solid #edf1f5;
        justify-content:flex-start;
    }

    .home-search-item--destination{
        padding:14px;
    }

    .location-field{
        display:grid;
        grid-template-columns:minmax(0,1fr) auto;
        gap:10px;
        align-items:center;
        width:100%;
    }

    .destination-input-wrap{
        width:100%;
        min-width:0;
    }

    .destination-input{
        width:100%;
        min-height:24px;
        font-size:15px;
        font-weight:500;
    }

    .home-search-input,
    #guestToggle{
        height:auto;
        min-height:24px;
        font-size:14px;
        font-weight:600;
        white-space:normal;
        line-height:1.4;
        padding:0;
    }

    .near-me-chip{
        width:42px;
        min-width:42px;
        height:42px;
        border-radius:50%;
        flex:0 0 42px;
    }

    .near-me-chip i{
        font-size:15px;
    }

    .search-button-wrap{
        padding:0;
        border-bottom:none;
    }

    .home-search-btn{
        min-height:54px;
        border-radius:0 0 18px 18px;
        font-size:15px;
        font-weight:700;
    }

    .city-suggestion-list{
        left:0;
        right:0;
        transform:none;
        width:100%;
        max-width:none;
        top:calc(100% + 8px);
        border-radius:14px;
    }

    .guest-pop{
        top:calc(100% + 10px);
        left:0;
        right:0;
        width:100%;
        max-width:none;
        border-radius:16px;
    }
}


/* ===== 2026-04-09 responsive hero search card update ===== */
/* Desktop unchanged. Only tablet + mobile tuned. */
@media (max-width: 991.98px){
  /* hide headline text like "Hotels & Homes / Hotel & Home Stays" on tablet + phone */
  .home-hero-copy,
  .home-hero-kicker,
  .home-hero-title,
  .home-hero-sub{
    display:none !important;
  }

  .home-hero-wrap{
    min-height:auto !important;
    padding-bottom:12px;
  }

  .home-hero-content{
    width:min(100%, calc(100% - 24px)) !important;
    padding:20px 0 28px !important;
    display:block;
  }


  .home-search-grid{
    grid-template-columns:1fr 1fr !important;
    border-radius:22px !important;
    overflow:hidden !important;
  }

  .home-search-item{
    min-height:92px !important;
    padding:18px 18px !important;
    align-items:flex-start !important;
    justify-content:center !important;
    background:#fff;
  }

  .home-search-item:nth-child(1),
  .home-search-item:nth-child(2){
    border-bottom:1px solid #e8edf3 !important;
  }

  .home-search-item:nth-child(1),
  .home-search-item:nth-child(3){
    border-right:1px solid #e8edf3 !important;
  }

  .home-search-item--destination{
    padding:18px 18px !important;
    position:relative;
  }

  .home-search-label{
    font-size:11px !important;
    font-weight:800 !important;
    letter-spacing:.08em !important;
    color:#ef4f22 !important;
    margin-bottom:8px !important;
    text-transform:uppercase;
  }

  .location-field{
    display:block !important;
    position:relative;
    width:100%;
    min-height:40px;
    padding-right:58px;
  }

  .destination-input-wrap{
    width:100%;
    min-width:0;
  }

  .destination-input,
  .home-search-input,
  #guestToggle{
    width:100% !important;
    min-height:64px !important;
    height:auto !important;
    /*padding:0 !important;*/
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:15px !important;
    font-weight:400 !important;
    color:#111827 !important;
    line-height:1.42 !important;
    text-align:left;
  }

  #guestToggle{
    display:block !important;
  }

  .near-me-chip{
    position:absolute !important;
    top:10%;
    right:0;
    transform:translateY(-5%);
    width:42px !important;
    min-width:42px !important;
    height:42px !important;
    padding:0 !important;
    border-radius:999px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:0 !important;
    border:1.5px solid #ff5a2a !important;
    background:#fff7f3 !important;
    color:#ff5a2a !important;
    box-shadow:0 8px 20px rgba(255,106,58,.16) !important;
    font-size:0 !important;
    overflow:hidden;
  }

  .near-me-chip i{
    font-size:14px !important;
    margin:0 !important;
  }

  .search-button-wrap{
    grid-column:1 / -1 !important;
    padding:0 !important;
    background:transparent !important;
  }

  .home-search-btn{
    min-height:64px !important;
    height:64px !important;
    border-radius:0 0 22px 22px !important;
    font-size:18px !important;
    font-weight:800 !important;
    letter-spacing:.01em;
  }

  .city-suggestion-list{
    top:calc(100% + 10px) !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    max-width:none !important;
    border-radius:16px !important;
  }

  .guest-pop{
    top:calc(75% + 12px) !important;
    right:0 !important;
    left:auto !important;
    width:360px !important;
    max-width:min(360px, calc(100vw - 32px)) !important;
    border-radius:18px !important;
  }
}

@media (max-width: 767.98px){
  .home-hero-content{
    width:min(100%, calc(100% - 24px)) !important;
    padding:42px 0 28px !important;
  }

  .home-search-grid{
    grid-template-columns:1fr !important;
    border-radius:20px !important;
  }

  .home-search-item{
    min-height:78px !important;
    padding:16px 16px !important;
    border-right:none !important;
    border-bottom:1px solid #e8edf3 !important;
  }

  .home-search-item:nth-child(1),
  .home-search-item:nth-child(2){
    border-bottom:1px solid #e8edf3 !important;
  }

  .home-search-item:nth-child(1),
  .home-search-item:nth-child(3){
    border-right:none !important;
  }

  .home-search-item--destination{
    padding:14px 16px !important;
  }

  .location-field{
    padding-right:54px;
    min-height:42px;
  }

  .destination-input,
  .home-search-input,
  #guestToggle{
    font-size:14px !important;
    line-height:1.4 !important;
  }

  .near-me-chip{
    width:40px !important;
    min-width:40px !important;
    height:40px !important;
  }

  .search-button-wrap{
    border-bottom:none !important;
  }

  .home-search-btn{
    min-height:58px !important;
    height:58px !important;
    border-radius:0 0 20px 20px !important;
    font-size:17px !important;
  }

  .guest-pop{
    left:0 !important;
    right:0 !important;
    width:100% !important;
    max-width:none !important;
  }
}


/* ===== v4 mobile/tablet hero background sizing fix ===== */
@media (max-width: 991.98px){
  .home-hero-wrap{
    min-height:auto !important;
    background:none !important;
  }

  .home-hero-single-bg{
    inset:0 !important;
    background-size:cover !important;
    background-position:center center !important;
    transform:none !important;
  }

  .home-hero-content{
    max-width:760px !important;
    padding:18px 16px 24px !important;
  }
}

@media (max-width: 767.98px){
  .home-hero-wrap{
    min-height:auto !important;
    padding-bottom:10px !important;
  }

  .home-hero-single-bg{
    background-size:cover !important;
    background-position:center center !important;
  }

  .home-hero-content{
    padding:14px 12px 18px !important;
    max-width:420px !important;
  }
}

@media (max-width: 991.98px){
  .home-hero-wrap::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.04) 100%);
    pointer-events:none;
    z-index:1;
  }

  .home-hero-single-bg,
  .home-hero-overlay{
    z-index:0 !important;
  }

  .home-hero-content{
    position:relative;
    z-index:2 !important;
  }
}

@media (max-width: 767.98px){
  .guest-summary-box#guestToggle{
    width:100% !important;
    min-height:50px !important;
    padding:10px 12px !important;
    background:#fff !important;
    border:1px solid #d1d5db !important;
    border-radius:8px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    box-sizing:border-box !important;
    box-shadow:none !important;
    white-space:normal !important;
    line-height:1.4 !important;
    color:#111827 !important;
  }
}

@media (max-width: 767.98px){
  .search-filters .guest-summary-box#guestToggle{
    width:100% !important;
    min-height:50px !important;
    padding:10px 12px !important;
    background:#fff !important;
    border:1px solid #d1d5db !important;
    border-radius:8px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    box-sizing:border-box !important;
    box-shadow:none !important;
    white-space:normal !important;
    line-height:1.4 !important;
    color:#111827 !important;
  }
}
.home-search-card form::before{
    content: "";
    display: none;
}
.home-search-card form > span{
    display: none;
}
@media (max-width: 767px){

    .home-search-card form{
        position: relative;
        z-index: 2;
    }

    /* Background card behind form */
    .home-search-card form::before{
        content: "";
        display: block;
        position: absolute;
        top: -10px;
        left: -20px;
        right: -20px;
        bottom: -35px;
        background: rgba(255,255,255,0.95);
        border-radius: 20px;
        box-shadow: 0 20px 50px rgba(0,0,0,0.25);
        z-index: -1;
    }

    /* Near me Destination text style */
    .home-search-card form > span{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        margin: 0 0 12px;
        padding: 8px 16px;
        border-radius: 999px;
        background: linear-gradient(135deg, rgba(255,90,44,0.14), rgba(255,59,48,0.10));
        border: 1px solid rgba(255,90,44,0.22);
        color: #ff3b30;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 0.2px;
        line-height: 1;
        box-shadow: 0 8px 20px rgba(255,90,44,0.18);
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
        animation: pulseGlow 1.8s ease-in-out infinite;
    }

    .home-search-card form > span::before{
        content: "📍";
        font-size: 14px;
        line-height: 1;
        animation: bouncePin 1.5s ease-in-out infinite;
    }

    /* Main search grid */
    .home-search-grid{
        border: 1.2px solid #cbd5e1;
        border-radius: 14px;
        background: #fff;
        padding: 10px;
        box-shadow: 10 8px 24px rgba(15,23,42,0.08);
    }

    .container{
        border: 1.2px solid #cbd5e1;
        border-radius: 14px;
        background: #fff;
    }
}


/* =========================
   ANIMATIONS
   ========================= */
@keyframes pulseGlow{
    0%{
        box-shadow: 0 8px 20px rgba(255,90,44,0.18);
    }
    50%{
        box-shadow: 0 12px 26px rgba(255,90,44,0.30);
    }
    100%{
        box-shadow: 0 8px 20px rgba(255,90,44,0.18);
    }
}

@keyframes bouncePin{
    0%, 100%{
        transform: translateY(0);
    }
    50%{
        transform: translateY(-3px);
    }
}