/* =====================================================================
   BACCUSARDUS — GLOBAL DESIGN TOKENS
   ---------------------------------------------------------------------
   ===================================================================== */

/* ---------- Font del brand ---------- */

@font-face {
  font-family: "Colossalis";
  src:
    url("../fonts/Colossalis-Medium.woff2") format("woff2"),
    url("../fonts/Colossalis-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Colossalis";
  src:
    url("../fonts/Colossalis-Bold.woff2") format("woff2"),
    url("../fonts/Colossalis-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ---------- Variabili globali ---------- */
:root {
  /* Colori brand (mappare anche nei Global Colors di Elementor) */
  --bs-wine: #671b30;        /* Primario */
  --bs-wine-deep: #280a14;   /* Testo scuro su bottoni gold */
  --bs-gold: #e2ad46;        /* Accento / CTA */
  --bs-cream: #fff7ea;       /* Testo chiaro su sfondo scuro */
  --bs-paper: #fcf7ef;       /* Sfondo pagina */
  --bs-ink: #21191a;         /* Testo principale */
  --bs-muted: #74696a;       /* Testo secondario */
  --bs-line-light: rgba(255, 247, 234, 0.26);
  --bs-line-dark: rgba(103, 27, 48, 0.16);

  /* Tipografia (mappare anche nei Global Fonts di Elementor) */
  --bs-font-display: "Colossalis", Georgia, serif; /* Titoli / brand */
  --bs-font-body: Arial, Helvetica, sans-serif;    /* Testo */

  /* Spacing — ritmo verticale sezioni (S / M / L) */
  --bs-space-s: 60px;
  --bs-space-m: 92px;
  --bs-space-l: 132px;

  /* Layout */
  --bs-container: 1240px;
  --bs-gutter: 48px;         /* desktop */
  --bs-gutter-mobile: 18px;  /* <= 767px */

  /* Radius */
  --bs-radius: 4px;
  --bs-radius-round: 50%;
}

/* ---------- Gutter responsive (token, non layout) ---------- */
@media (max-width: 767px) {
  :root {
    --bs-gutter: var(--bs-gutter-mobile);
  }
}

/* ---------- Helper minimi (usare solo se Elementor non basta) ---------- */
.bs-font-display {
  font-family: var(--bs-font-display);
}

/* ---------- Header: stati di sfondo (vedi 08-header.md) ---------- */

/* Stato pieno chiaro: pagine senza hero scuro (classe a livello pagina). */
.bs-header-solid .bs-header {
  background: var(--bs-paper);
}
.bs-header-solid .bs-header,
.bs-header-solid .bs-header a,
.bs-header-solid .bs-brand {
  color: var(--bs-ink);
}

/* Stato sticky: dopo lo scroll, su tutte le pagine. */
.bs-header.elementor-sticky--effects {
  background: var(--bs-wine);
  transition: background 0.3s ease;
}


/* Bottoni Woo generici (qty, coupon, login, ecc.) */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background: var(--bs-gold) !important;
  color: var(--bs-wine-deep) !important;
  border: 0;
  border-radius: var(--bs-radius);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 13px;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  background: #cc9a3f !important;
  color: var(--bs-wine-deep) !important;
}

/* Titoli interni Woo (Dettagli fatturazione, Riepilogo ordine, ecc.) */
.woocommerce h2,
.woocommerce h3,
.woocommerce-Address-title h3 {
  font-family: var(--bs-font-display);
  color: var(--bs-wine);
  text-transform: uppercase;
}

/* Campi form (checkout, account, coupon) */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea,
.woocommerce .quantity .qty {
  background: var(--bs-cream);
  border: 1px solid var(--bs-line-dark);
  border-radius: 0;
  color: var(--bs-ink);
  min-height: 46px;
  padding: 0 12px;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus {
  border-color: var(--bs-wine);
  outline: none;
}

/* Tabelle (carrello, totali, ordini account) */
.woocommerce table.shop_table {
  border: 1px solid var(--bs-line-dark);
  border-radius: 0;
}
.woocommerce table.shop_table th {
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--bs-wine);
}
.woocommerce table.shop_table td,
.woocommerce table.shop_table th {
  border-color: var(--bs-line-dark);
}

/* Prezzi */
.woocommerce .price,
.woocommerce ul.products li.product .price {
  color: var(--bs-wine);
}

/* Tab prodotto (Descrizione / Recensioni) */
.woocommerce-tabs ul.tabs li a {
  font-family: var(--bs-font-display);
  text-transform: uppercase;
  color: var(--bs-wine);
}
.woocommerce-tabs ul.tabs li.active a {
  border-bottom: 2px solid var(--bs-gold);
}

/* Navigazione My Account */
.woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 12px 16px;
  border: 1px solid var(--bs-line-dark);
  margin-bottom: 8px;
  color: var(--bs-wine);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 13px;
}
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover {
  background: var(--bs-wine);
  color: var(--bs-cream);
}

/* Notice (messaggi, errori, info) */
.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--bs-gold);
}
.woocommerce-message::before,
.woocommerce-info::before {
  color: var(--bs-gold);
}
.woocommerce-error {
  border-top-color: var(--bs-wine);
}

/* ---------- Carrello & Checkout: link, pulsanti, testi (no struttura) ---------- */
/* link di testo (esclusi pulsanti e rimuovi) */
.woocommerce-cart a:not(.button):not(.remove),
.woocommerce-checkout a:not(.button):not(.remove),
.woocommerce a.showcoupon,
.woocommerce-form-login-toggle a,
.woocommerce-form-coupon-toggle a {
  color: var(--bs-wine);
}
.woocommerce-cart a:not(.button):not(.remove):hover,
.woocommerce-checkout a:not(.button):not(.remove):hover,
.woocommerce a.showcoupon:hover {
  color: var(--bs-gold);
}

/* pulsante primario (Procedi al checkout / Effettua ordine) */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.wc-proceed-to-checkout a.checkout-button,
.woocommerce #place_order {
  background: var(--bs-gold) !important;
  color: var(--bs-wine-deep) !important;
  border: 0;
  border-radius: var(--bs-radius);
  font-weight: 700;
  text-transform: uppercase;
  min-height: 52px;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce #place_order:hover {
  background: #cc9a3f !important;
  color: var(--bs-wine-deep) !important;
}

/* rimuovi articolo (×) */
.woocommerce a.remove {
  color: var(--bs-wine) !important;
  border-color: var(--bs-wine);
}
.woocommerce a.remove:hover {
  background: var(--bs-wine);
  color: var(--bs-cream) !important;
}

/* importi e totale */
.woocommerce .cart_totals .order-total .amount,
.woocommerce-checkout .order-total .amount {
  color: var(--bs-wine);
}

/* testi e box pagamento */
.woocommerce-cart,
.woocommerce-checkout {
  color: var(--bs-ink);
}
.woocommerce-checkout #payment {
  background: var(--bs-cream);
  border-radius: 0;
}
.woocommerce-checkout #payment .payment_box {
  background: var(--bs-paper);
}
.woocommerce-checkout #payment .place-order {
  background: transparent;
}

/* ---------- Single product: titolo, prezzo, tab, link, rating ---------- */
.woocommerce div.product .product_title {
  color: var(--bs-wine);
  font-family: var(--bs-font-display);
  text-transform: uppercase;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce div.product p.price .amount,
.woocommerce div.product .summary .price .amount {
  color: var(--bs-wine) !important;
  font-family: var(--bs-font-display);
}
/* tab attiva */
.woocommerce-tabs ul.tabs li.active a {
  color: var(--bs-wine) !important;
}
/* link categoria/meta e breadcrumb */
.woocommerce .product_meta a,
.woocommerce-breadcrumb a,
.woocommerce-breadcrumb a:link,
.woocommerce-breadcrumb a:visited {
  color: var(--bs-wine) !important;
}
.woocommerce .product_meta a:hover,
.woocommerce-breadcrumb a:hover {
  color: var(--bs-gold) !important;
}
/* stelle valutazione */
.woocommerce .star-rating span::before,
.woocommerce p.stars a::before {
  color: var(--bs-gold);
}
/* prodotti correlati / upsell */
.woocommerce .related > h2,
.woocommerce .upsells > h2 {
  font-family: var(--bs-font-display);
  color: var(--bs-wine);
  text-transform: uppercase;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: var(--bs-wine);
  font-family: var(--bs-font-display);
  text-transform: uppercase;
}

/* Fascia wine sotto l'header — SOLO pagina prodotto singolo */
body.single-product .content-area {
  position: relative;
  padding-top: 150px;            /* spazio: contenuto sotto la fascia */
}
body.single-product .content-area::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 100vw;                  /* full-bleed a prescindere dal contenitore */
  transform: translateX(-50%);
  height: 110px;
  background: var(--bs-wine);
}


/* Wrapper tab: largo quanto i tab (i container Elementor nascono al 100%
   e il bordo sforerebbe oltre lo schermo) */
.bs-slide-tabs {
  width: fit-content !important;
}

/* Tab: stato attivo (replica .showcase-tab.is-active) e interazione */
.bs-slide-tab {
  cursor: pointer;
  transition: background 0.2s ease;
}
.bs-slide-tab.is-active {
  background: var(--bs-cream);
}
.bs-slide-tab.is-active .elementor-widget-heading:last-child .elementor-heading-title {
  color: var(--bs-wine) !important;
}

/* Pagination nativa: nascosta su desktop (la sostituiscono i tab),
   trattini semplici su mobile (come .slide-dot a 767px) */
@media (min-width: 768px) {
  .bs-hero-slider .swiper-pagination {
    display: none;
  }
}
@media (max-width: 767px) {
  .bs-hero-slider .swiper-pagination-bullet {
    width: 19px;
    height: 3px;
    border-radius: 0;
    background: rgba(255, 247, 234, 0.34);
    opacity: 1;
  }
  .bs-hero-slider .swiper-pagination-bullet-active {
    background: var(--bs-gold);
  }
}