/* Tiles layout */
.amazon-tiles{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:12px;
  margin:8px 0 16px;
}
.amazon-tiles-wrap{ margin-bottom:8px; }
.amazon-tiles-heading{ margin:6px 0 6px; font-size:16px; font-weight:600; }
.amazon-selected-label{ margin-left:.5rem; font-weight:600; color:#111; }

/* Tile base — now square, with price pinned at bottom */
.amazon-tiles .amazon-tile{
  all:unset;
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:stretch;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:12px;
  cursor:pointer;
  transition: box-shadow .15s, border-color .15s, transform .05s;
  aspect-ratio:2/3;   /* square shape */
  overflow:hidden;
}

.amazon-tiles .amazon-tile:hover{ box-shadow:0 4px 12px rgba(0,0,0,.08); }
.amazon-tiles .amazon-tile.is-selected{ border-color:#ff9900; box-shadow:0 0 0 3px rgba(255,153,0,.18); }

/* Image tiles: crop neatly */
.amazon-tiles .amazon-tile img{
  width:100%;
  flex:1 1 auto;          /* fill vertical space */
  object-fit:cover;       /* crop to square */
  border-radius:10px;
  display:block;
  min-height:0;
}

/* Labels */
.amazon-tiles .tile-name{
  position:absolute; top:8px; left:8px;
  font-size:11px; font-weight:600;
  background:rgba(255,255,255,.92);
  padding:2px 6px; border-radius:6px;
  max-width:calc(100% - 16px);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* No-image tiles */
.amazon-tiles .amazon-tile.no-img{ padding:14px; }
.amazon-tiles .amazon-tile.no-img .tile-name{
  position:static; background:transparent; padding:0; margin-bottom:8px;
  font-size:13px; font-weight:700; color:#111;
}
.amazon-tiles .amazon-tile.no-img .tile-value{
  display:flex; align-items:center; justify-content:center; text-align:center;
  font-size:18px; font-weight:800; letter-spacing:.2px;
  padding:10px 8px; border-radius:10px; background:#fafafa; border:1px dashed #e5e7eb;
  min-height:54px;
  flex:1 1 auto;
}

/* Price pinned at bottom */
.amazon-tiles .tile-price{
  margin-top:auto;        /* push price to bottom */
  font-size:18px;
  font-weight:700;
  line-height:1.2;
  color:#111;
  min-height:1.25em;
}
.amazon-tiles .tile-price.is-muted{ color:#9ca3af; }
.amazon-tiles .tile-price del{ opacity:.45; margin-right:.35rem; }
.amazon-tiles .tile-price ins{ text-decoration:none; }

/* Mobile scroller (kept intact) */

@media (max-width:600px){
  .amazon-tiles{
    display:flex !important;
    overflow-x:auto; -webkit-overflow-scrolling:touch;
    gap:8px; scroll-snap-type:x mandatory;
    padding:4px 8px; margin:0 -8px;
  }
  .amazon-tiles .amazon-tile{
    /* show ~80% of the next card */
    flex:0 0 36%;
    max-width:36%;
    min-width:36%;
    scroll-snap-align:start;

    /* shape */
    aspect-ratio:3/4;   /* 3:4 on mobile */
    padding:8px;        /* your tighter mobile padding */
  }
  .amazon-tiles .amazon-tile img{
    flex:1 1 auto;
    width:100%;
    object-fit:cover;   /* crop neatly inside the 3:4 card */
    display:block;
    min-height:0;
  }
  .amazon-tiles::-webkit-scrollbar{ display:none; }
}

/* Disabled tiles */
.amazon-tile.is-disabled {
  opacity: 0.4;
  pointer-events: none;
  position: relative;
}
.amazon-tile.is-disabled::after {
  content: "✕";
  position: absolute;
  top: 4px;
  right: 6px;
  color: red;
  font-size: 1.2em;
  font-weight: bold;
}