.leaflet-touch .leaflet-control-layers-toggle {
    width: 40px !important;
    height: 40px !important;
}
.leaflet-control-attribution.leaflet-control, .leaflet-control-attribution.leaflet-control a {
    display: none;
}
.leaflet-control-zoom-in, .leaflet-control-zoom-out, .leaflet-control-layers.leaflet-control {
    border-radius: 8px !important;
}
.leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar { border: none !important;}
/* -----------------------------------------------------------
  Hotel Archive
----------------------------------------------------------- */
/* ======================= Hero Banner ======================= */
.hotel-hero{
  width:100%;
  height:clamp(360px, 60vh, 560px);
  position:relative;
  overflow:hidden;
  border-radius: var(--card-radius) 0 0 0;
  isolation:isolate;
}
.hotel-hero-img{
  width:100%; height:100%;
  border-radius: inherit;
  transform: scale(1.02);
  transition: transform .9s ease;
}
.hotel-hero-img > *{
  width:100%; height:100%;
  object-fit:cover;
}
.tm-rd-1,.tm-rd-2,.tm-rd-3,.tm-rd-4{
  background: var(--color-bg, #fff);
  position:absolute;
  align-content:center; text-align:center;
  color: var(--color-text-strong);
}
.tm-rd-1{ width:620px; height:60px; top:0; right:0; border-radius:0 0 0 var(--card-radius); }
.tm-rd-2{ width:345px; height:60px; bottom:60px; left:0; border-radius:0 var(--card-radius) 0 0; }
.tm-rd-3{ width:470px; height:60px; bottom:0; left:0; border-radius:0 var(--card-radius) 0 0; }
.tm-rd-4{
  width:90px; height:180px; bottom:0; right:0;
  border-radius: var(--card-radius) 0 0 0;
  display:grid; gap:.5rem; z-index:500; align-content:end; padding-left: 6px;
}
.tm-rd-4 .btn { z-index: 99; }
.tm-rd-1::before,.tm-rd-1::after,.tm-rd-2::before,.tm-rd-2::after,
.tm-rd-3::before,.tm-rd-3::after,.tm-rd-4::before,.tm-rd-4::after{
  content:""; position:absolute; background:transparent; border-radius:var(--card-radius);
  box-shadow: 0 0 0 0 var(--color-bg); /* default; each overridden below */
}
.tm-rd-1::before{ width:50px;height:50px; top:0; right:100%; box-shadow:20px -20px var(--color-bg); }
.tm-rd-1::after { width:50px;height:50px; top:100%; right:0;  box-shadow:20px -20px var(--color-bg); }
.tm-rd-2::before{ width:50px;height:50px; bottom:100%; left:0; box-shadow:-20px 20px var(--color-bg); }
.tm-rd-2::after { width:50px;height:50px; bottom:0; left:100%; box-shadow:-20px 20px var(--color-bg); }
.tm-rd-3::before{ width:50px;height:50px; bottom:100%; left:0; box-shadow:-20px 20px var(--color-bg); }
.tm-rd-3::after { width:50px;height:50px; bottom:0; left:100%; box-shadow:-20px 20px var(--color-bg); }
.tm-rd-4::before{ width:50px;height:50px; bottom:100%; right:0; box-shadow:20px 20px var(--color-bg); }
.tm-rd-4::after { width:50px;height:50px; bottom:0; right:100%; box-shadow:20px 20px var(--color-bg); }
.tm-rd-1 span,
.tm-rd-2 span,
.tm-rd-3 span{
  font-size: var(--fs-h4);
  font-weight: var(--fw-strong);
}
.cm-tl-clr{ color: var(--color-primary); font-weight: var(--fw-strong); }
.rotating-wrap{
  display:inline-flex; align-items:center; justify-content:center;
  position:relative; min-width:9.2ch; height:1.2em; overflow:hidden; vertical-align:middle; text-align:center;
}
.rotating-word{
  position:absolute; inset:0; line-height:1.2em; text-align:center;
  transition: transform .6s ease, opacity .6s ease; will-change: transform, opacity;
}

@media (max-width:600px) {
  .tm-rd-1 { text-align: right; z-index: 1; width: 90%; height: auto; }
  .tm-rd-1::after { z-index: -1; }
  .tm-rd-2 { width: 100%; border-radius: 0; bottom: 20px;}
  .tm-rd-2::after {
    width: 50px;
    height: 50px;
    bottom: 100%;
    right: 0;
    box-shadow: 20px 20px #FFF;
  }
  .tm-rd-3 {
    width: 100%;
    height: auto;
  }
  .tm-rd-3::after, .tm-rd-3::before { display: none;}
  .tm-rd-4 { display: none; }
  #htl-crd-hotel-grid {  margin-top: 0 !important;}
  .tm-rd-1 span, .tm-rd-2 span, .tm-rd-3 span { font-size: var(--fs-h5); }
}

/* ======================= Hotel Grid ======================= */
#htl-crd-hotel-grid{
  display:grid; gap:16px; direction:rtl;
  grid-template-columns: repeat(4, 1fr);
}
@media (max-width:1024px){ #htl-crd-hotel-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:600px) { #htl-crd-hotel-grid{ grid-template-columns: 1fr; } }
.htl-crd-card{
  background: var(--color-bg, #fff);
  border: 1px solid var(--color-border);
  border-radius: var(--card-radius);
  overflow:hidden; display:flex; flex-direction:column; text-align:center;
  box-shadow: var(--cm-box-shadow);
}
.htl-crd-card .htl-crd-card__link{
  color: inherit; text-decoration:none; display:block; padding:4px; position:relative;
}
.htl-crd-card__img{
  width:100%; height:200px; object-fit:cover; display:block; border-radius: 12px;
}
.htl-crd-card__info{ padding:10px; }
.htl-crd-card__title{ font-size: var(--fs-h6); margin:5px 0 0 0; }
.htl-crd-card__name-en{ font-size:.85rem; color: var(--color-text-muted); }
.htl-crd-card__stars{
  position:absolute; top:0; left:0; z-index:99;
  background: var(--color-bg, #fff);
  width:120px; height:30px; padding:2px 0;
  border-radius: 0 0 30px 0;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}
.htl-crd-card__stars::after{
  content:""; position:absolute; top:100%; left:4px; width:35px; height:35px;
  border-radius: var(--card-radius); box-shadow:-20px -20px var(--color-bg);
}
.htl-crd-card__stars::before{
  content:""; position:absolute; top:4px; left:93%; width:70px; height:48px;
  border-radius:29px; box-shadow:-34px -35px var(--color-bg);
}
.htl-crd-card__stars svg{ margin:0 1px; z-index:100; }

/* =================== Hotel Archive Box ==================== */
.hotel-archive-box{
  padding:20px; background: var(--color-bg-sec);
  border-radius:16px; overflow:hidden; max-width:1400px; margin:0 auto;
  direction:rtl; box-sizing:border-box; border:1px solid var(--color-border);
}
@media (max-width: 640px){
  .hotel-archive-box{
    flex-direction: column;
  }
  .hab-aside {
    max-height: 440px;
  }
}
.hab-header{ height:100%; text-align:center; }
.hab-header h2{
  font-size: clamp(1.25rem, 2.2vw, 1.8rem);
  font-weight:700; color: var(--color-bg); margin-bottom:8px;
}
.hab-header p{ font-size:.95rem; color: var(--color-bg-sec); }
.hab-title{ display:flex; justify-content:space-between; align-items:center; }
.hab-title h3{ font-size:1.2rem; font-weight:600; color: var(--color-text-strong); }
.hab-scroll{
  display:flex; overflow-x:auto; cursor:grab; user-select:none;
  gap: var(--card-gap, 20px); align-items:start;
  scrollbar-width: thin; scroll-behavior: smooth; 
}
.hab-scroll.dragging{ cursor:grabbing; }
.hab-line { overflow-x: auto; height: fit-content;}
.hab-card{
  position:relative; flex:0 0 180px;
  background: var(--color-bg); border:1px solid var(--color-border);
  color:inherit; text-decoration:none; border-radius: var(--card-radius);
  overflow:hidden; box-shadow: var(--cm-box-shadow);
}
.hab-card img{
  width:100%; height:220px; object-fit:cover; display:block; pointer-events:none;
  transition: transform .3s ease;
}
.hab-card:hover img{ transform: scale(1.05); }
.hab-card-title{
  position:absolute; inset:auto 0 0 0; padding:10px 16px; z-index:9;
  color:#fff; font-weight:600; text-align:start; font-size: var(--fs-h6);
  background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0));
}
.btn-country{ cursor:pointer; }
.btn-country[aria-pressed="true"]{
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--focus-ring);
}
@media (max-width:991px){
  .hab-card{ flex:0 0 180px; }
  .hab-card img{ height:130px; }
  .hab-card-title{ font-size:.9rem; }
  .hotel-archive-box .full-width.d-grid.gap-4 { display: flex !important; flex-direction: column;}
}
@media (max-width:600px){
  .hab-card{ flex:0 0 160px; }
  .hab-card img{ height:120px; }
  .hab-card-title{ font-size:.8rem; }
}
@media (min-width:600px) and (max-width:991px) {
.hab-aside { max-height: 380px;}
}
/* ================= Aside video with overlay ================ */
.hab-aside{ width:30%; }
@media (max-width:992px){ .hab-aside{ width:100%; } }
.media-hero{
  position:relative; margin:0; border-radius: var(--card-radius); overflow:hidden;
  aspect-ratio: 9/16; background:#000; height:100%; width:100%;
}
.media-hero__video{ width:100%; height:100%; object-fit:cover; display:block; }
.media-hero__overlay{
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end;
  gap:.5rem; padding:1rem 1rem 1.25rem; color: var(--color-text-wte, #fff);
  background: linear-gradient(to top, rgba(0,0,0,.45), rgba(0,0,0,0) 50%);
}
.media-hero__title{
  margin:0; font-size:clamp(1rem, 2.5vw, 1.25rem);
  font-weight: var(--fw-heading, 600); line-height: var(--line-height-heading, 1.3);
  text-shadow: var(--cm-text-shadow);
}
.media-hero__subtitle{ margin:0; font-size:clamp(.85rem, 2vw, 1rem); color: rgba(255,255,255,.9); }
@media (prefers-reduced-motion: no-preference){
  .media-hero__overlay{ animation: fadeInUp 600ms ease forwards; }
}
#btn-show-all{
  font-weight: var(--fw-semibold,600);
  color: var(--color-text-muted);
  text-decoration: none;
  font-size: var(--fw-strong);
}
#btn-show-all:hover {
  color: var(--blue-500);
}

:root{
  --ui-radius: var(--card-radius);
  --ui-border: var(--color-border);
  --ui-bg: var(--color-bg);
  --ui-bg-soft: var(--color-bg-sec);
  --ui-text: var(--color-text);
  --ui-text-strong: var(--color-text-strong);
  --ui-muted: var(--color-text-muted);
  --ui-primary: var(--color-primary);
  --ui-primary-hover: var(--color-primary-hover);
  --ui-shadow-sm: var(--cm-box-shadow);
  --ui-ring: var(--focus-ring);
}

/* ========================================================= هدر فیلتر ========================================================= */
.hotel-search__header{
  position: relative;
  border-radius: var(--ui-radius);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.86));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  backdrop-filter: blur(var(--glass-blur));
  border: 1px solid var(--ui-border);
  box-shadow: var(--ui-shadow-sm);
}
.hotel-search__header::before{
  content:"";
  position:absolute; inset:-1px; border-radius: calc(var(--ui-radius) + 2px);
  padding:1px;
  /* background: linear-gradient(180deg,
               color-mix(in oklab, var(--ui-primary) 40%, transparent),
               color-mix(in oklab, var(--ui-primary) 8%, transparent)); */
  --webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  --webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events:none;
}
.hotel-search__header .form-label{
  font-weight: var(--fw-strong);
  color: var(--ui-text-strong);
}
.hotel-search__header .input{
  height: 44px;
  border-radius: var(--radius);
  border: 1px solid var(--ui-border);
  background: var(--ui-bg);
  color: var(--ui-text);
  padding: 0 .8rem;
  transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
}
.hotel-search__header .input:focus{
  outline: none;
  border-color: color-mix(in oklab, var(--ui-primary) 55%, var(--ui-border));
  background: #fff;
}
#hf-reset.btn{
  height: 44px;
  border-radius: var(--radius);
  border-color: color-mix(in oklab, var(--ui-primary) 22%, var(--ui-border));
  color: var(--ui-text);
}
#hf-reset.btn:hover{
  border-color: color-mix(in oklab, var(--ui-primary) 55%, var(--ui-border));
  box-shadow: 0 0 0 4px var(--ui-ring);
}
.hf-chip{
  --chip-bg: var(--ui-bg-soft);
  --chip-bd: var(--ui-border);
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .45rem .8rem;
  border: 1px solid var(--chip-bd);
  border-radius: 12px;
  cursor: pointer; user-select: none;
  color: var(--ui-text);
  transition: background var(--transition), border-color var(--transition), transform .08s ease;
}
.hf-chip:hover{ background: var(--blue-500); transition: .3s ease-in; }
.hf-chip input{ display:none; }
.hf-chip input:checked + span{ color: #fff;}
.hf-chip input:checked ~ *{
  --chip-bg: color-mix(in oklab, var(--ui-primary) 12%, #fff);
  --chip-bd: color-mix(in oklab, var(--ui-primary) 55%, var(--ui-border));
}
.hf-chip.active{
  background:var(--blue-500);
  color:#fff;
}
.hf-amenities{
  border-radius: var(--radius);
  border: 1px dashed var(--ui-border);
  background: var(--ui-bg);
}
.hf-amenities > summary{
  list-style: none; cursor: pointer; user-select: none;
  font-weight: var(--fw-strong); color: var(--ui-text-strong);
  position: relative; padding-inline-start: 1.15rem;
}
.hf-amenities > summary::-webkit-details-marker{ display:none; }
.hf-amenities > summary::after{
  content:"";
  position:absolute; inset-inline-start: 0; top:.55rem;
  width:.6rem; height:.6rem; border-inline-start:2px solid currentColor; border-bottom:2px solid currentColor;
  transform: rotate(-45deg); opacity:.7; transition: transform var(--transition);
}
.hf-amenities[open] > summary::after{ transform: rotate(135deg); }
.hf-check{
  display:flex; align-items:center; gap:.55rem; cursor:pointer;
  border:1px dashed transparent; padding:.35rem .55rem; border-radius: var(--radius-sm);
  color: var(--ui-text);
  transition: border-color var(--transition), background var(--transition);
}
.hf-check:hover{
  border-color: var(--ui-border);
  background: color-mix(in oklab, var(--ui-primary) 6%, transparent);
}
@media (max-width: 900px){
  .hotel-search__header{
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
  }
  .hf-chip { padding: .25rem .5rem;}
  .hotel-search__header .d-flex{ flex-wrap: wrap; gap: .5rem !important; }
  .hf-amenities .d-grid.mt-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
.rating-number{
  background: var(--blue-500);
  color:#fff;
  font-weight:600;
  padding:2px 8px;
  border-radius:6px;
  font-size:.85rem;
}

/* =========================================================
   نتایج
========================================================= */
#hf-results.grid.grid-auto{
  display:flex;
  flex-direction: column;
  gap: 16px;
}
.hotel-card{
  width: 100%;
  max-height: 260px;
  background: var(--ui-bg);
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  overflow: hidden;
  transition: box-shadow var(--transition), transform .18s ease, border-color var(--transition);
  will-change: transform;
  transition: .2s ease-in;
}
.hotel-card:hover{
  border-color: color-mix(in oklab, var(--ui-primary) 35%, var(--ui-border));
  box-shadow: 0 14px 38px rgba(0,0,0,.10);
  transform: translateY(-2px); transition: .2s ease-in;
}
.hotel-card__link {
  display: flex;
  padding: 10px;
  position: relative;
}
.hotel-card__img{
  width:35%; height: 100%; object-fit:cover; display:block;
  transition: transform .35s ease; border-radius: var(--card-radius);
}
.hotel-search__results { align-content: start; }
.hotel-card__body{ width: 65%; padding:8px 14px 8px 8px; display: flex; flex-direction: column;  }
.hotel-card__title{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.hotel-card__title h3{ font-size: var(--fs-h6); margin:0; line-height: var(--line-height-heading); color: var(--ui-text-strong); }
.hotel-card__name-en{ color: var(--color-text-muted); font-size: .9rem; }
.hotel-card__stars svg{ vertical-align: middle; }
.hotel-card.ring{ outline: 2px solid color-mix(in oklab, var(--ui-primary) 55%, #9dd0ff); outline-offset: 2px; }
.hotel-card__title, .hotel-card__name-en, .hotel-card__stars { height: 20%; align-items: center; align-content: center; }
.hotel-card__amen {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  max-height: 44px;
  overflow: hidden;
  align-items: flex-end;
  margin-top: auto;
}
.hotel-card__amen .badge {
  background: #fff !important;
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 2px 6px;
  font-size: .75rem;
  white-space: nowrap;
}
.tm-rd-5{ width: 50px; height: 50px; top: 0; right: 0; border-radius: 0 0 0 var(--card-radius); position: absolute; background: #fff; z-index: 2; }
.tm-rd-5::before{ width:45px;height:50px; top:10px; right:100%; box-shadow:20px -20px var(--color-bg); }
.tm-rd-5::after { width:45px;height:50px; top:100%; right:10px;  box-shadow:20px -20px var(--color-bg); }
.tm-rd-5::before,.tm-rd-5::after
{
  content:""; position:absolute; background:transparent; border-radius:var(--card-radius);
}
/* پیش‌فرض: نسخه موبایل پنهان، نسخه inline فعال */
.hotel-card__amen--mobile {
  display: none;
}

@media (max-width: 768px) {

  .hotel-card {
    max-height: auto;
    display: flex;
    flex-direction: column;
  }

  /* نسخه داخل بدنه برای موبایل مخفی بشه */
  .hotel-card__amen--inline {
    display: none;
  }

  /* نسخه موبایل (زیر کارت) فعال و هم‌تراز با محتوا */
  .hotel-card__amen--mobile {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    max-height: none;
    padding: 0 10px 10px;    /* هم‌ردیف با padding لینک کارت */
    margin-top: 0;           /* به بدنه می‌چسبه */
  }

  .hotel-card__amen--mobile .badge {
    background: #fff !important;
    color: var(--color-text-muted);
    border: 1px solid var(--color-border);
    border-radius: 8px;
    padding: 2px 6px;
    font-size: .75rem;
    white-space: nowrap;
  }
}

/* =========================================================
   نقشه + گرید
========================================================= */
.hf-map-wrap{
  height: clamp(450px, 60vh, 600px);
  background: var(--ui-bg-soft);
  border-radius: var(--ui-radius);
  overflow: hidden;
  border: 1px solid var(--ui-border);
  box-shadow: var(--ui-shadow-sm);
  position: sticky; top: 115px; margin-bottom: 25px; z-index: 90;
}
#hf-map{ width:100%; height:100%; }
.leaflet-popup-content{ direction: rtl; width: 100%; min-width: 190px; max-width: 250px; margin: 4px !important; }
.leaflet-container a.btn.btn-link{ text-decoration: none; }
.leaflet-popup-close-button { top: 5px !important; right: 5px !important; background: #fff !important; border-radius: 4px;}

.leaflet-popup-content-wrapper { position: relative !important; overflow: hidden;}
.leaflet-container a.leaflet-popup-close-button { z-index: 10; background-color: transparent !important; transition: 0.3s ease;}
.leaflet-container a.leaflet-popup-close-button:hover { transform: scale(1.2); transition: 0.3s ease; }

.tm-rd-htlmdl::before, .tm-rd-htlmdl::after {
  content: "";
  position: absolute;
  background: transparent;
  border-radius: 4px;
}
.tm-rd-htlmdl {
  width: 30px;
  height: 30px;
  top: 0;
  right: 0;
  border-radius: 4px;
  position: absolute;
  background: #fff;
  z-index: 2;
}
.tm-rd-htlmdl::before { 
  width: 30px;
  height: 30px;
  top: 5px;
  right: 100%;
  box-shadow: 20px -20px var(--color-bg); 
}
.tm-rd-htlmdl::after { 
  width: 30px;
  height: 30px;
  top: 100%;
  right: 5px;
  box-shadow: 20px -20px var(--color-bg);
}

.hotel-search{
  display:grid; gap: 1rem;
  grid-template-columns: 40% 1fr;
}
@media (max-width: 1200px){
  .hotel-search{ grid-template-columns: 1fr !important; }
  .hf-map-wrap{ height: 400px; position: inherit; }
}
@media (max-width: 640px){
  .hf-map-wrap{ height: 340px; }
}

.hf-popup-img {
  width: 100%;
  height: 100%;
}
.map-popup .d-flex.gap-2 {
  flex-direction: column;
  text-align: initial;
}
.hf-popup-img { border-radius: 10px;}
.hf-popup-stars { margin-top: 5px; }
/* =========================================================
   صفحه‌بندی
========================================================= */
#hf-pagination{ gap: .5rem; }
#hf-pagination .btn{
  border-radius: var(--radius);
  border-color: var(--ui-border);
  background: var(--ui-bg);
  color: var(--ui-text);
}
#hf-pagination .btn:hover{
  border-color: color-mix(in oklab, var(--ui-primary) 45%, var(--ui-border));
  box-shadow: 0 0 0 4px var(--ui-ring);
}
#hf-pagination .btn[disabled]{ opacity:.6; cursor:not-allowed; }

/* =========================================================
   متفرقه
========================================================= */
#hf-summary{ min-height: 1lh; color: var(--ui-muted); }
@media (max-width: 520px){
  .hotel-card__img{ min-height: 130px; max-height: 130px; height: 100%; width: 45%; }
  .hotel-card__body { max-height: 130px; }
  .hotel-card__body { display: flex; flex-direction: column; align-content: first baseline; }
}
.leaflet-control-attribution.leaflet-control, .leaflet-control-attribution.leaflet-control a {
    display: none;
}
.leaflet-control-zoom-in, .leaflet-control-zoom-out, .leaflet-control-layers.leaflet-control {
    border-radius: 8px !important;
}
.leaflet-bar a:last-child, .leaflet-touch .leaflet-bar a:last-child {
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}
.hotel-card { position: relative; } 
.favorite-btn.overlay{
  position: absolute;
  top: 10px; right: 10px;
  z-index: 10;
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px;
  border-radius: 10px;
  background: none;
  backdrop-filter: blur(6px);
  transition: transform .18s ease, box-shadow .18s ease, border-color var(--transition), background var(--transition);
}
.favorite-btn.overlay:hover{
  border-color: color-mix(in oklab, var(--color-primary) 35%, var(--color-border));
}
.favorite-btn.overlay .heart-icon{ fill: #9aa3b2; transition: fill .2s ease; }
.favorite-btn.overlay:hover .heart-icon{ fill: var(--color-primary); cursor: pointer; }
.favorite-btn.overlay .heart-icon.active{ fill: var(--color-primary); animation: pulse .25s ease; }
.favorite-btn.overlay .favorite-count{
  position: absolute;
  inset: auto -6px -4px auto;
  min-width: 16px; height: 16px; display: inline-grid; place-items: center;
  font-size: 11px; line-height: 1;
  background: var(--color-primary); color: #fff;
  border-radius: 999px; padding: 0 4px; border: 1px solid #fff;
}

/* -----------------------------------------------------------
  Hotel Category
----------------------------------------------------------- */
.cat-hero {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 22px;
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
.cat-hero__img {
  position: relative;
}

.cat-hero__img img {
  width: 280px;
  height: 320px;
  border-radius: var(--radius-lg);
  object-fit: cover;
}

.cat-hero__text {
  flex: 1;
}

.cat-hero__title {
  font-size: var(--fs-h4);
  font-weight: var(--fw-heading);
  margin: 0 !important;
}

.cat-hero__desc p,
.cat-hero__desc ul { 
  margin-bottom: 10px; 
  color: var(--color-text-muted);
  line-height: var(--line-height);
}
@media(max-width: 768px) {
  .cat-hero {
    flex-direction: column;
  }
  .cat-hero__img img {
    width: 100%;
  }
}
.tm-rd-htlcat-1{ width: auto; height: 40px; top: 0; right: 0; border-radius: 0 0 0 var(--card-radius); position: absolute; background: #fff; z-index: 2; padding: 0 10px; align-content: center; }
.tm-rd-htlcat-1::before{ width:50px;height:50px; top:0; right:100%; box-shadow:20px -20px var(--color-bg); z-index: -1; }
.tm-rd-htlcat-1::after { width:50px;height:50px; top:100%; right:0;  box-shadow:20px -20px var(--color-bg); z-index: -1; }
.tm-rd-htlcat-1::before,.tm-rd-htlcat-1::after {
  content:""; position:absolute; background:transparent; border-radius:var(--card-radius);
}

.hotel-card { position: relative; }

/* دکمه را مطمئن کن همیشه بالاتر از لینک قرار می‌گیرد و کلیک‌پذیر است */
.favorite-btn.overlay{
  position: absolute;
  top: 10px; right: 10px;
  z-index: 9999;          /* از 10 به عدد خیلی بالاتر */
  pointer-events: auto;   /* صراحتاً کلیک‌پذیر */
}

/* لینکِ تمام‌کارت پایین‌تر از دکمه بماند */
.hotel-card__link{
  position: relative;
  z-index: 1;
}