/* =========================================================
   RICCI 1895 — Scheda prodotto (single product)
   Usa i token colore e i font definiti in home.css
========================================================= */

.sp-page { padding: 36px 0 90px; }

/* ---------- Breadcrumb ---------- */
.sp-breadcrumb { font-size: .85rem; color: var(--ric-muted); letter-spacing: .02em; margin-bottom: 2.4rem; }
.sp-breadcrumb a { color: var(--ric-muted); text-decoration: none; }
.sp-breadcrumb a:hover { color: var(--ric-orange); }
.sp-breadcrumb .sep { margin: 0 .5rem; color: #cfc7bc; }
.sp-breadcrumb .current { color: var(--ric-dark); }

/* ---------- Galleria ---------- */
.sp-gallery { display: flex; gap: 14px; }
.sp-thumbs { display: flex; flex-direction: column; gap: 12px; flex: 0 0 84px; width: 84px; }
.sp-thumb {
  width: 84px; height: 100px; object-fit: cover; cursor: pointer;
  background: #F6EEEA; border: 1px solid transparent; transition: border-color .2s;
}
.sp-thumb:hover, .sp-thumb.active { border-color: var(--ric-gold); }

.sp-main {
  flex: 1; min-height: 520px; padding: 28px;
  background: #fff;
  display: flex; align-items: center; justify-content: center;
}
.sp-main-img { width: 100%; height: 100%; max-height: 540px; object-fit: contain; display: block; }

/* ---------- Riepilogo ---------- */
.sp-summary { padding-left: clamp(0px, 2.5vw, 36px); }
.sp-title { font-size: clamp(2rem, 3.4vw, 2.9rem); margin-bottom: 1.2rem; }

.sp-price-row { display: flex; align-items: baseline; gap: 1.4rem; flex-wrap: wrap; margin-bottom: 1.6rem; }
.sp-price { font-family: var(--font-head); font-size: 1.5rem; color: var(--ric-dark); }
.sp-stock { font-size: .9rem; color: var(--ric-muted); }
.sp-stock strong { color: var(--ric-dark); font-weight: 600; }

.sp-desc { color: var(--ric-muted); line-height: 1.85; margin-bottom: 1.9rem; }

/* ---------- Azioni (quantità + carrello) ---------- */
.sp-actions { display: flex; gap: 14px; flex-wrap: wrap; align-items: stretch; margin-bottom: 1.8rem; }

.sp-qty { display: flex; align-items: stretch; border: 1px solid var(--ric-line); }
.sp-qty button {
  background: none; border: none; width: 44px; min-height: 50px; cursor: pointer;
  color: var(--ric-dark); font-size: 1.1rem; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.sp-qty button:hover { color: var(--ric-orange); }
.sp-qty .qty-input {
  width: 48px; border: none;
  border-left: 1px solid var(--ric-line); border-right: 1px solid var(--ric-line);
  text-align: center; font-family: var(--font-body); font-size: .95rem;
  color: var(--ric-dark); background: #fff; -moz-appearance: textfield; appearance: textfield;
}
.sp-qty .qty-input:focus { outline: none; }

.add-to-cart-btn {
  display: inline-flex; align-items: center; gap: .6rem;
  background: var(--ric-dark); color: #fff; border: 1px solid var(--ric-dark);
  padding: 0 2rem; min-height: 50px;
  font-family: var(--font-body); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase;
  cursor: pointer; transition: background .2s; white-space: nowrap;
}
.add-to-cart-btn:hover { background: #000; }
.add-to-cart-btn:disabled { opacity: .6; cursor: default; }

/* "Acquista ora" — a tutta larghezza, sotto "Aggiungi al carrello" */
.acquista-ora-btn {
  flex: 1 1 100%;
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  background: var(--ric-orange); color: #fff; border: 1px solid var(--ric-orange);
  min-height: 50px; padding: 0 1.5rem;
  font-family: var(--font-body); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase;
  cursor: pointer; transition: background .2s, border-color .2s; text-decoration: none;
}
.acquista-ora-btn:hover { background: #a8552f; border-color: #a8552f; color: #fff; }
.acquista-ora-btn:disabled { opacity: .6; cursor: default; }

/* ---------- Meta (SKU + condivisione) ---------- */
.sp-meta { font-size: .9rem; color: var(--ric-muted); margin-bottom: 1rem; }
.sp-meta strong { color: var(--ric-dark); font-weight: 600; }
.sp-share { font-size: .9rem; color: var(--ric-muted); display: flex; align-items: center; gap: .9rem; }
.sp-share a { color: var(--ric-dark); font-size: 1rem; text-decoration: none; }
.sp-share a:hover { color: var(--ric-orange); }

/* ---------- Tab (Descrizione / Info) ---------- */
.sp-tabs { margin-top: 70px; }
.sp-tab-nav { display: flex; gap: 2.4rem; border-bottom: 1px solid var(--ric-line); list-style: none; padding: 0; margin: 0 0 2rem; }
.sp-tab-nav .nav-link {
  font-family: var(--font-head); font-size: 1.25rem; color: var(--ric-muted);
  background: none; border: none; border-bottom: 2px solid transparent;
  padding: 0 0 1rem; margin-bottom: -1px; cursor: pointer;
}
.sp-tab-nav .nav-link:hover { color: var(--ric-dark); }
.sp-tab-nav .nav-link.active { color: var(--ric-dark); border-bottom-color: var(--ric-orange); }
.sp-tab-panel p { color: var(--ric-muted); line-height: 1.9; margin: 0; }

.sp-info-table { width: 100%; border-collapse: collapse; }
.sp-info-table th, .sp-info-table td { text-align: left; padding: .9rem 0; border-bottom: 1px solid var(--ric-line); }
.sp-info-table th { color: var(--ric-dark); font-family: var(--font-head); font-weight: 400; width: 220px; }
.sp-info-table td { color: var(--ric-muted); }

/* ---------- Prodotti correlati ---------- */
.sp-related { margin-top: 80px; }
.sp-related h2 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); margin-bottom: 2.4rem; }

.sp-card { text-decoration: none; display: block; }
.sp-card-media {
  position: relative; background: #F2EEE9; aspect-ratio: 4 / 5;
  display: flex; align-items: center; justify-content: center; padding: 18px; overflow: hidden;
}
.sp-card-media img { width: 100%; height: 100%; object-fit: contain; transition: transform .4s ease; }
.sp-card:hover .sp-card-media img { transform: scale(1.04); }
.sp-badge {
  position: absolute; top: 0; left: 0;
  background: var(--ric-orange); color: #fff;
  font-family: var(--font-body); font-size: .78rem; letter-spacing: .04em;
  padding: .35rem .75rem;
}
.sp-card-title { font-family: var(--font-head); font-size: 1.25rem; color: var(--ric-dark); text-align: center; margin: 1.1rem 0 .4rem; }
.sp-card-price { text-align: center; font-size: .95rem; color: var(--ric-dark); }
.sp-price-old { color: var(--ric-muted); text-decoration: line-through; margin-right: .55rem; }
.sp-price-sale { color: var(--ric-orange); }

button.option-button { background: #fff; margin: 5px 3px; }
button.option-button.selected { background: rgb(43, 39, 36); color:#fff; margin: 5px 3px; }


/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
  .sp-summary { padding-left: 0; margin-top: 2.4rem; }
  .sp-main { min-height: 420px; }
}
@media (max-width: 575.98px) {
  .sp-gallery { flex-direction: column-reverse; }
  .sp-thumbs { flex-direction: row; flex-wrap: wrap; width: auto; flex: none; }
  .sp-thumb { width: 64px; height: 76px; }
  .sp-actions { flex-direction: column; align-items: stretch; }
  .add-to-cart-btn { justify-content: center; }
}