.kmh-offers { margin: 2rem 0; }

.kmh-offers__head {
  display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:.75rem;
}
.kmh-offers__head h2 { margin:0; font-size:clamp(1.2rem,1.8vw,1.6rem); }
.kmh-offers__controls { display:flex; gap:.5rem; }
.kmh-offers__nav { border:1px solid #ddd; background:#fff; padding:.35rem .6rem; border-radius:.5rem; cursor:pointer; }
.kmh-offers__nav:disabled { opacity:.4; cursor:not-allowed; }

.kmh-offers__trackwrap { overflow:hidden; }

/* === DESKTOP/TABLET: flex track for JS translateX === */
.kmh-offers__track {
  display:flex;
  gap:1rem;
  transition: transform .35s ease;
  will-change: transform;
}
.kmh-offers__track > * { flex: 0 0 min(100%, 22rem); }

/* === Cards === */
.kmh-offer { border:1px solid #eee; border-radius:1rem; overflow:hidden; background:#fff; display:flex; flex-direction:column; height:100%; }
.kmh-offer__media { position:relative; aspect-ratio:16/9; background:#f6f6f6; overflow:hidden; }
.kmh-offer__media img { width:100%; height:100%; object-fit:cover; display:block; }

.kmh-offer__badge {
  position:absolute; left:.5rem; top:.5rem;
  font-size:.75rem; background:#222; color:#fff;
  padding:.35rem .6rem; border-radius:999px; font-weight:700;
}

.kmh-offer__body { padding:.9rem; display:flex; flex-direction:column; gap:.4rem; flex:1; }
.kmh-offer__title { margin:0; font-size:1.1rem; line-height:1.25; }
.kmh-offer__desc { margin:0; color:#444; font-size:.9rem; -webkit-line-clamp:2; display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; }
.kmh-offer__meta { display:flex; justify-content:space-between; align-items:center; gap:.5rem; font-size:.9rem; }
.kmh-offer__price { font-weight:600; }
.kmh-offer__countdown { color:#a00; }
.kmh-offer__cta { margin-top:auto; }
.kmh-offer__btn { display:inline-block; text-decoration:none; border:1px solid #111; padding:.5rem .75rem; border-radius:.5rem; font-weight:600; }


.kmh-offers__empty { padding:1rem; color:#666; }

/* Type-colour badges */
.kmh-offer--percent   .kmh-offer__badge { background:#ff3b30; } /* red */
.kmh-offer--freenights .kmh-offer__badge { background:#34c759; }/* green */
.kmh-offer--fixed     .kmh-offer__badge { background:#0a84ff; } /* blue */

/* No-image variant */
.kmh-offer--noimg .kmh-offer__media {
  background:linear-gradient(135deg,#fff3c4,#ffd6d6);
  display:grid; place-items:center;
}
.kmh-offer--noimg .kmh-offer__media::after {
  content:attr(data-big);
  font-size:clamp(1.2rem,4vw,2rem);
  font-weight:800; letter-spacing:.3px; color:#111;
  text-align:center; padding:.25rem .5rem; border-radius:.5rem;
}

/* === MOBILE: native swipe with scroll-snap === */
@media (max-width: 767px) {
  .kmh-offers__trackwrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .kmh-offers__track {
    display:flex;
    gap:1rem;
    scroll-snap-type:x mandatory;
    scroll-padding:1rem;
    will-change:scroll-position;
    transform:none !important; /* disable JS translateX in snap mode */
  }
  .kmh-offers__track > * { flex:0 0 85%; scroll-snap-align:start; }
  .kmh-offers__controls { display:none; }
}

/* Prevent background scroll when modal is open */
.kmh-no-scroll { overflow: hidden; }

/* Modal shell */
.kmh-offers__modal[hidden]{display:none!important;}
.kmh-offers__modal{
  position:fixed; inset:0; z-index:10000;
  display:flex; align-items:center; justify-content:center;
  padding:6vh 1rem;                 /* keeps it off the very top */
}
.kmh-offers__modal__backdrop{position:absolute; inset:0; background:rgba(0,0,0,.4);}

.kmh-offers__modal__dialog{
  position:relative; z-index:1; background:#fff; border-radius:1rem;
  width:min(92vw,560px);
  margin:0;                          /* center via flex, not margins */
  padding:1rem;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
  display:grid; gap:.75rem;
  max-height:90vh;                   /* never taller than viewport */
  overflow:auto;                     /* scroll inside if long */
}

/* Respect WP admin bar when logged in */
@media (min-width:782px){
  .admin-bar .kmh-offers__modal{ padding-top:calc(6vh + 32px); }
}

/* Mobile: start a bit lower for comfort */
@media (max-width:767px){
  .kmh-offers__modal{ align-items:flex-start; padding-top:10vh; }
}




@media (prefers-reduced-motion: reduce) {
  .kmh-offers__track { transition: none; }
}

