/* public/assets/front/css/layout.patch.css
 * v14.2 - global responsive/overflow guard for Itamra front (including Teraz template pages)
 * - prevents horizontal overflow on mobile caused by off-canvas arrows/absolute elements
 * - keeps slider arrows inside viewport on small screens
 */

html, body {
  max-width: 100%;
  overflow-x: hidden;
}

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

/* ===== Itamra "it-" components (docs/life-info/etc) ===== */
.it-cards-slider {
  position: relative;
  overflow: hidden; /* prevent negative-position arrows from creating page overflow */
}

@media (max-width: 640px) {
  .it-prev { left: 6px !important; }
  .it-next { right: 6px !important; }
  .it-prev, .it-next {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    opacity: .95;
    touch-action: manipulation;
  }
}

/* ===== Teraz(main.css/slick) common guard ===== */
.slick-slider, .slick-list, .slick-track {
  max-width: 100%;
}

.slick-list { overflow: hidden; }

@media (max-width: 640px) {
  .slick-prev { left: 6px !important; }
  .slick-next { right: 6px !important; }
}

/* Some templates use custom arrow wrappers with negative offsets */
[class*="arrow"], [class*="Arrow"], [class*="btn-prev"], [class*="btn-next"] {
  max-width: 100%;
}