:root{
  --lf-purple-dark:#5a3a78;
  --lf-purple-deep:#3d2856;
  --lf-lavender:#ecdff2;
  --lf-text:#3d2952;
}

/* ---------- Griglia card (shortcode) ---------- */
.lf-collezioni-grid{
  display:grid;
  grid-template-columns:repeat(var(--lf-cols, 4), 1fr);
  gap:1.5rem;
  margin:2rem 0;
}
@media (max-width:900px){
  .lf-collezioni-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){
  /* Due card per riga anche su mobile, invece di una a tutta larghezza */
  .lf-collezioni-grid{grid-template-columns:repeat(2,1fr);gap:.8rem;margin:1.2rem 0;}
}

.lf-collezione-card{
  position:relative;
  display:block;
  border-radius:6px;
  overflow:hidden; /* contiene sempre il contenuto dell'overlay dentro la card */
  aspect-ratio:3/4;
  text-decoration:none;
  color:#fff;
  box-shadow:0 6px 20px rgba(61,41,86,.15);
  container-type:inline-size; /* permette a titolo/bottone di scalare sulla larghezza reale della card */
  container-name:lf-card;
}
@media (max-width:560px){
  .lf-collezione-card{aspect-ratio:4/5;border-radius:4px;} /* card meno alta su mobile */
}

.lf-collezione-card-img,
.lf-collezione-card-img img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .4s ease;
}
.lf-collezione-card:hover .lf-collezione-card-img img{
  transform:scale(1.05);
}
.lf-collezione-card-placeholder{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  background:repeating-linear-gradient(45deg, rgba(90,58,120,.08) 0 10px, rgba(90,58,120,.14) 10px 20px);
  color:var(--lf-purple-deep);
  font-style:italic;
  text-align:center;
  padding:1rem;
}
.lf-collezione-card::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(to top, rgba(30,15,45,.75) 0%, rgba(30,15,45,.15) 55%, transparent 75%);
}

/* Il selettore parte da .lf-collezioni-grid per avere più specificità del CSS
   del tema, che altrimenti può sovrascrivere le dimensioni di h3/bottone. */
.lf-collezioni-grid .lf-collezione-card-overlay{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:1.1rem 1rem;
  z-index:2;
  text-align:center;
  overflow:hidden; /* seconda barriera anti-overflow */
  max-height:100%;
  box-sizing:border-box;
}
.lf-collezioni-grid .lf-collezione-card-overlay h3{
  font-size:1.15rem !important; /* fallback per browser senza container query */
  font-size:clamp(.8rem, 9.5cqi, 1.3rem) !important;
  line-height:1.15;
  margin:0 0 .3rem;
  font-weight:600;
  overflow-wrap:break-word;
}
.lf-collezioni-grid .lf-collezione-card-overlay p{
  font-size:.82rem; /* fallback */
  font-size:clamp(.62rem, 6cqi, .85rem);
  line-height:1.3;
  margin:0 0 .7rem;
  opacity:.92;
}
.lf-collezioni-grid .lf-collezione-btn{
  display:inline-block;
  background:rgba(236,223,242,.9);
  color:var(--lf-purple-deep);
  border-radius:999px;
  letter-spacing:.03em;
  text-transform:uppercase;
  font-weight:600;
  white-space:normal;   /* rete di sicurezza: se proprio non entra, va a capo invece di essere tagliato */
  max-width:100%;
  box-sizing:border-box;
  padding:.42rem 1.05rem !important; /* fallback */
  padding:clamp(.3rem,3.2cqi,.48rem) clamp(.6rem,6.5cqi,1.1rem) !important;
  font-size:.68rem !important; /* fallback */
  font-size:clamp(.58rem, 6.2cqi, .74rem) !important;
}

/* Card molto strette (es. 2 per riga su telefoni piccoli): nascondiamo la
   descrizione per lasciare più respiro a titolo e bottone, che restano sempre
   leggibili grazie al clamp() qui sopra. */
@container lf-card (max-width: 210px){
  .lf-collezioni-grid .lf-collezione-card-overlay{padding:.75rem .55rem;}
  .lf-collezioni-grid .lf-collezione-card-overlay p{display:none;}
}

/* ---------- Breadcrumb ---------- */
.lf-breadcrumb{
  font-size:.95rem;
  color:var(--lf-text);
  margin:1.5rem 0;
}
.lf-breadcrumb a{color:var(--lf-purple-dark);text-decoration:none;}
.lf-breadcrumb a:hover{text-decoration:underline;}
.lf-breadcrumb-sep{margin:0 .5rem;opacity:.6;}
.lf-breadcrumb-current{opacity:.75;}

/* ---------- Pagina singola collezione ---------- */
.lf-collezione-single{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:2.5rem;
  align-items:start;
}
@media (max-width:800px){
  .lf-collezione-single{grid-template-columns:1fr;}
}

.lf-collezione-intro h1{
  color:var(--lf-purple-dark);
  font-size:2.2rem;
  margin-bottom:.3rem;
}
.lf-heart-divider{
  color:var(--lf-purple-dark);
  opacity:.6;
  margin-bottom:1rem;
}
.lf-collezione-desc{
  color:var(--lf-text);
  margin-bottom:1.5rem;
}
.lf-collezione-back{
  display:inline-block;
  background:var(--lf-lavender);
  color:var(--lf-purple-deep);
  padding:.6rem 1.4rem;
  border-radius:999px;
  font-size:.85rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-weight:600;
  text-decoration:none;
}
.lf-collezione-back:hover{opacity:.85;}

.lf-collezione-gallery{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
  gap:1rem;
}
.lf-gallery-photo{
  display:block;
  border-radius:6px;
  overflow:hidden;
  aspect-ratio:3/4;
}
.lf-gallery-photo img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transition:transform .3s ease;
}
.lf-gallery-photo:hover img{transform:scale(1.04);}

.lf-collezione-empty{
  color:var(--lf-text);
  opacity:.7;
  font-style:italic;
}

/* ---------- Lightbox ---------- */
.lf-lightbox-overlay{
  position:fixed;inset:0;
  background:rgba(20,10,30,.9);
  display:none;
  align-items:center;justify-content:center;
  z-index:9999;
  padding:2rem;
}
.lf-lightbox-overlay img{
  max-width:90vw;max-height:85vh;
  border-radius:4px;
}
.lf-lightbox-close,
.lf-lightbox-prev,
.lf-lightbox-next{
  position:absolute;
  background:rgba(255,255,255,.15);
  color:#fff;
  border:none;
  cursor:pointer;
  font-size:1.6rem;
  padding:.5rem .9rem;
  border-radius:50%;
}
.lf-lightbox-close{top:1.5rem;right:1.5rem;}
.lf-lightbox-prev{left:1.5rem;top:50%;transform:translateY(-50%);}
.lf-lightbox-next{right:1.5rem;top:50%;transform:translateY(-50%);}