/* 20260701_12: final responsive layer for /shop-prints */

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

body {
  width: 100% !important;
}

img,
video,
canvas,
svg {
  max-width: 100% !important;
}

/* General page safety */
.fp-page,
.fp-section,
.fp-hero,
.fp-results,
#afmrCleanResults,
#afmrPrintResults {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

.fp-wrap,
.fp-shell,
.fp-container,
.fp-hero-inner,
.fp-section-inner,
#results,
#afmrCleanResults,
#afmrPrintResults {
  width: min(1180px, calc(100% - 32px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Hero and intro */
.fp-hero-grid,
.fp-hero .fp-grid,
.fp-upload-grid,
.fp-form-grid,
.fp-claim-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .85fr) !important;
  gap: clamp(20px, 4vw, 44px) !important;
  align-items: center !important;
}

.fp-hero h1,
.fp-section-head h2,
.afmr-clean-head h2,
.afmr-results-head h2 {
  font-size: clamp(38px, 8vw, 84px) !important;
  line-height: .92 !important;
  letter-spacing: -.06em !important;
  overflow-wrap: anywhere !important;
}

.fp-hero p,
.fp-section-head p,
.afmr-clean-head p,
.afmr-results-head p {
  font-size: clamp(15px, 2vw, 18px) !important;
  line-height: 1.6 !important;
}

.fp-ticket,
.fp-upload-card,
.fp-card,
.fp-selected,
.afmr-selected-panel {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.fp-ticket .fp-banner-img,
.fp-banner-img {
  width: 100% !important;
  height: clamp(240px, 42vw, 500px) !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* Forms */
.fp-form,
#freePrintForm {
  width: 100% !important;
  max-width: 100% !important;
}

.fp-form input,
.fp-form button,
#freePrintForm input,
#freePrintForm button,
.fp-buy-btn,
.fp-try-btn {
  max-width: 100% !important;
}

.fp-dropzone {
  width: 100% !important;
  max-width: 100% !important;
}

.fp-dropzone img,
#roomPreview {
  width: 100% !important;
  max-height: 360px !important;
  object-fit: contain !important;
}

/* Top print carousel can scroll horizontally, but must not break page width */
#printsCarousel,
.fp-carousel,
.fp-print-carousel {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  gap: 18px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory !important;
  -webkit-overflow-scrolling: touch !important;
  padding-bottom: 12px !important;
}

#printsCarousel article,
.fp-carousel article {
  flex: 0 0 clamp(220px, 72vw, 310px) !important;
  max-width: 310px !important;
  min-width: 220px !important;
  scroll-snap-align: center !important;
}

/* Results grids: desktop 3 columns, tablet 2, mobile 1 */
#afmrCleanGrid,
#afmrListingGrid,
#resultsGrid.fp-listing-grid,
#resultsGrid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(16px, 2.5vw, 24px) !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  overflow-x: visible !important;
  transform: none !important;
  scroll-snap-type: none !important;
}

#afmrCleanGrid > article,
#afmrListingGrid > article,
#resultsGrid > article,
.afmr-clean-item,
.afmr-print-item,
.fp-listing-item {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  transform: none !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
  overflow: hidden !important;
}

.afmr-clean-image,
.afmr-print-image,
.fp-listing-image,
.fp-result-image,
.fp-result-tile-image,
.fp-result-row-image {
  width: 100% !important;
  height: clamp(230px, 25vw, 285px) !important;
  min-height: 230px !important;
  max-height: 320px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

.afmr-clean-image img,
.afmr-print-image img,
.fp-listing-image img,
.fp-result-image img,
.fp-result-tile-image img,
.fp-result-row-image img {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
}

/* Room preview */
.fp-room-preview-panel,
#afmrRoomPreviewPanel {
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr) !important;
  gap: clamp(16px, 3vw, 28px) !important;
  width: 100% !important;
  max-width: 100% !important;
  align-items: start !important;
}

.fp-room-stage,
#afmrRoomStage {
  width: 100% !important;
  min-height: clamp(300px, 48vw, 520px) !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.fp-room-stage img,
#afmrStageRoomImage,
#stageRoomImage {
  width: 100% !important;
  height: 100% !important;
  min-height: clamp(300px, 48vw, 520px) !important;
  object-fit: cover !important;
}

.fp-movable-print,
#afmrMovablePrint {
  max-width: 78% !important;
  touch-action: none !important;
}

/* Text and buttons inside listings */
.afmr-clean-item h3,
.afmr-print-item h3,
.fp-listing-item h3,
#resultsGrid h3 {
  font-size: clamp(20px, 2.3vw, 24px) !important;
  line-height: 1.1 !important;
  overflow-wrap: anywhere !important;
}

.afmr-clean-actions,
.afmr-actions,
.fp-listing-actions,
.fp-card-actions {
  display: grid !important;
  gap: 9px !important;
  width: 100% !important;
}

.afmr-clean-actions button,
.afmr-actions button,
.fp-listing-actions button,
.fp-card-actions button {
  width: 100% !important;
  min-width: 0 !important;
  white-space: normal !important;
}

/* Tablet */
@media (max-width: 980px) {
  .fp-hero-grid,
  .fp-hero .fp-grid,
  .fp-upload-grid,
  .fp-form-grid,
  .fp-claim-grid {
    grid-template-columns: 1fr !important;
  }

  #afmrCleanGrid,
  #afmrListingGrid,
  #resultsGrid.fp-listing-grid,
  #resultsGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .fp-room-preview-panel,
  #afmrRoomPreviewPanel {
    grid-template-columns: 1fr !important;
  }
}

/* Mobile */
@media (max-width: 640px) {
  .fp-wrap,
  .fp-shell,
  .fp-container,
  .fp-hero-inner,
  .fp-section-inner,
  #results,
  #afmrCleanResults,
  #afmrPrintResults {
    width: min(100%, calc(100% - 22px)) !important;
  }

  .fp-hero,
  .fp-section,
  #afmrCleanResults,
  #afmrPrintResults {
    margin-top: 34px !important;
    margin-bottom: 34px !important;
  }

  .fp-hero h1,
  .fp-section-head h2,
  .afmr-clean-head h2,
  .afmr-results-head h2 {
    font-size: clamp(34px, 13vw, 54px) !important;
  }

  #afmrCleanGrid,
  #afmrListingGrid,
  #resultsGrid.fp-listing-grid,
  #resultsGrid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .afmr-clean-image,
  .afmr-print-image,
  .fp-listing-image,
  .fp-result-image,
  .fp-result-tile-image,
  .fp-result-row-image {
    height: 310px !important;
    min-height: 310px !important;
  }

  .fp-ticket .fp-banner-img,
  .fp-banner-img {
    height: 300px !important;
  }

  #printsCarousel article,
  .fp-carousel article {
    flex-basis: 82vw !important;
    min-width: 82vw !important;
    max-width: 82vw !important;
  }

  .fp-room-stage,
  #afmrRoomStage {
    min-height: 330px !important;
  }

  .fp-room-stage img,
  #afmrStageRoomImage,
  #stageRoomImage {
    min-height: 330px !important;
  }

  .fp-movable-print,
  #afmrMovablePrint {
    width: 145px !important;
    max-width: 82% !important;
  }
}
