.agpc-rail {
  position: relative;
  width: 100%;
}

.agpc-viewport {
  overflow: hidden;
  width: 100%;
}

.agpc-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 5rem) / 6); /* 6 card desktop con gap ~1rem */
  gap: 1rem;
  padding: .5rem 3rem; /* spazio per frecce */
  margin: 0;
  list-style: none;
  transition: transform .3s ease;
}

/* 2 card per volta su mobile */
@media (max-width: 767px) {
  .agpc-track {
    /*grid-auto-columns: calc((100% - 1rem) / 2);*/
    grid-auto-columns: calc(100% - .25rem);
    padding: .5rem 2.5rem;
  }
}

.agpc-card {
  position: relative;
  background: #fff;
  border-radius: .75rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  overflow: hidden;
}

/* overlay che rende cliccabile tutta la card */
.agpc-card-link{
  position: absolute;
  inset: 0;
  z-index: 2; /* sopra img e meta */
  pointer-events: auto;
}

/* immagine */
.agpc-imgwrap {
  position: relative;
  z-index: 1;            /* sotto all’overlay */
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #f6f6f6;
}
.agpc-img { width: 100%; height: 100%; object-fit: cover; display:block; }

/* badge sconto / progress: sopra overlay per restare visibili */
.agpc-badge {
  position: absolute;
  top: .5rem; right: .5rem;
  background: #000; color: #fff;
  border-radius: 999px;
  padding: .25rem .55rem;
  font-size: .75rem;
  z-index: 4;
}
.agpc-progress {
  position: absolute;
  left: .5rem; bottom: .5rem;
  background: rgba(0,0,0,.6); color: #fff;
  border-radius: .5rem;
  padding: .15rem .35rem;
  font-size: .7rem;
  display: none;
  z-index: 4;
}
@media (max-width: 767px){ .agpc-progress{ display:inline-block; } }

/* meta */
.agpc-meta {
  position: relative;
  z-index: 1;            /* sotto all’overlay */
  padding: .75rem;
  display: grid;
  gap: .5rem;
}
.agpc-title { margin: 0; font-size: .95rem; line-height: 1.2; }
.agpc-price { font-weight: 600; margin-top: 1em;}

.agpc-price .price ins {
  text-decoration: none;   /* rimuove underline */
  border: 0;               /* alcuni temi la simulano con border-bottom */
  background: none;        /* nel caso di highlight */
  display: inline;         /* assicurati di non ereditare display block */
  font-size: large;

}
.agpc-price .price del {
  opacity: .65;            /* stile più soft per il prezzo barrato */
  font-size: medium;
}

.agpc-price ins {
  text-decoration: none;   /* rimuove underline */
  border: 0;               /* alcuni temi la simulano con border-bottom */
  background: none;        /* nel caso di highlight */
  display: inline;         /* assicurati di non ereditare display block */
  font-size: large;

}
.agpc-price del {
  opacity: .65;            /* stile più soft per il prezzo barrato */
  font-size: medium;
}


/* Frecce */
.agpc-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px; height: 40px;
  border: none; padding: 0; margin: 0;
  background: transparent;
  cursor: pointer;
  z-index: 3;
}
.agpc-prev { left: .5rem; }
.agpc-next { right: .5rem; }

.agpc-nav-bg {
  position: absolute; inset: 0;
  background: rgba(0,0,0,0);
  border-radius: 999px;
  backdrop-filter: blur(2px);
}
.agpc-icon {
  position: relative;
  width: 60px; height: 60px;
  fill: none; stroke: #111; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
  z-index: 1;
  top: -40px; left: -10px;
}

.agpc-nav:disabled { opacity: .4; cursor: default; }