/* Artful Product Cards - minimal shipped CSS (Tailwind-ish subset) */

/* Grid utilities */
.apc.grid{display:grid}
.apc.gap-0{gap:0}
.apc.gap-2{gap:.5rem}
.apc.gap-3{gap:.75rem}
.apc.gap-4{gap:1rem}
.apc.gap-6{gap:1.5rem}
.apc.gap-8{gap:2rem}

.apc.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.apc.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.apc.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.apc.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.apc.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.apc.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.apc.grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}
.apc.grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}

@media (min-width:768px){
  .apc.md\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
  .apc.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .apc.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .apc.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .apc.md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .apc.md\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media (min-width:1024px){
  .apc.lg\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
  .apc.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .apc.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .apc.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .apc.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .apc.lg\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
  .apc.lg\:grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}
  .apc.lg\:grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}
}

/* Card layout */
.apc .apc-card{display:flex;flex-direction:column;min-height:0}
.apc .h-full{height:100%}
.apc .flex{display:flex}
.apc .flex-col{flex-direction:column}
.apc .flex-1{flex:1 1 0%}
.apc .mt-auto{margin-top:auto}

.apc .apc-media{background:#f6f6f6;border-radius:.75rem}
.apc .relative{position:relative}
.apc .overflow-hidden{overflow:hidden}
.apc .absolute{position:absolute}
.apc .inset-0{top:0;right:0;bottom:0;left:0}
.apc .w-full{width:100%}
.apc .h-full{height:100%}
.apc .object-cover{object-fit:cover}

/* Aspect ratio helpers */
.apc .aspect-square{aspect-ratio:1/1}
.apc .aspect-4\/5{aspect-ratio:4/5}

/* Typography */
.apc .apc-body{padding:.75rem .25rem}
.apc .text-sm{font-size:.875rem;line-height:1.25rem}
.apc .opacity-70{opacity:.7}
.apc .font-semibold{font-weight:600}
.apc .leading-tight{line-height:1.25}
.apc .apc-title a{text-decoration:none;color:inherit}

/* Hover swap */
.apc .apc-img--hover{opacity:0;transition:opacity .2s ease}
.apc .apc-media:hover .apc-img--hover{opacity:1}
.apc .apc-media:hover .apc-img--main{opacity:0}

/* Price */
.apc .apc-price{padding-top:.5rem}
