/** Shopify CDN: Minification failed

Line 900:0 Unexpected "}"

**/
/* ══════════════════════════════════════════════════════════════
   SPIRITOSI 2026 — Global Style Override
   File: assets/spiritosi-global.css

   Caricato dopo base.css nel theme.liquid.
   Sovrascrive le variabili e la tipografia del tema Craft OS 2.0
   con il design system Spiritosi senza modificare il tema originale.

   NON modificare base.css direttamente.
   NON rimuovere i token --sp-* dalle sezioni custom esistenti.
   ══════════════════════════════════════════════════════════════ */


/* ── 1. GOOGLE FONTS ────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400&display=swap');

/* ── 2. DESIGN TOKENS ───────────────────────────────────────── */
:root {
  /* Colori brand */
  --sp-cream:       #f4f0d9;
  --sp-ink:         #1a1a0f;
  --sp-copper:      #c57a47;
  --sp-copper-deep: #a8633a;
  --sp-caramel:     #cda171;
  --sp-olive:       #606b3b;
  --sp-dark-green:  #515741;
  --sp-stone:       #b8b3a0;

  /* Font */
  --sp-font-display: 'Cormorant Garamond', Georgia, serif;
  --sp-font-mono:    'Space Mono', 'Courier New', monospace;
  --sp-font-body:    'Noto Sans', Arial, sans-serif;

  /* Override variabili Craft OS 2.0 */
  --color-background:           var(--sp-cream);
  --color-foreground:           var(--sp-ink);
  --color-base-background-1:    var(--sp-cream);
  --color-base-background-2:    #ece8d0;
  --color-base-text:            var(--sp-ink);
  --color-base-solid-button-labels: #ffffff;

  /* Bottone primario → copper */
  --color-button:               var(--sp-copper);
  --color-button-text:          #ffffff;

  /* Badge / tag */
  --color-badge-foreground-1:   var(--sp-ink);
  --color-badge-background-1:   rgba(197, 122, 71, 0.12);
  --color-badge-border-1:       rgba(197, 122, 71, 0.35);

  /* Bordi e separatori */
  --color-base-border:          rgba(26, 26, 15, 0.12);
  --border-radius-base:         2px;

  /* Tipografia Craft — font families */
  --font-heading-family:        'Cormorant Garamond', Georgia, serif;
  --font-heading-style:         italic;
  --font-heading-weight:        300;
  --font-body-family:           'Noto Sans', Arial, sans-serif;
  --font-body-style:            normal;
  --font-body-weight:           400;
  --font-body-weight-bold:      600;
}


/* ── 3. TIPOGRAFIA GLOBALE ──────────────────────────────────── */

/* Body */
body {
  font-family: var(--sp-font-body);
  color: var(--sp-ink);
  background-color: var(--sp-cream);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--sp-font-display);
  font-weight: 300;
  font-style: italic;
  letter-spacing: -0.015em;
  line-height: 1.1;
  color: var(--sp-ink);
}

h1, .h1 { font-size: clamp(32px, 5vw, 56px); }
h2, .h2 { font-size: clamp(26px, 4vw, 44px); }
h3, .h3 { font-size: clamp(22px, 3vw, 34px); }
h4, .h4 { font-size: clamp(18px, 2.5vw, 26px); }

/* Paragrafi */
p {
  font-family: var(--sp-font-body);
  font-size: clamp(14px, 1.4vw, 16px);
  line-height: 1.7;
  color: rgba(26, 26, 15, 0.80);
}

/* Link */
a {
  color: var(--sp-copper);
  transition: color 200ms ease;
}
a:hover { color: var(--sp-copper-deep); }

/* Etichette / caption */
.caption,
.product__badge,
.badge {
  font-family: var(--sp-font-mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}


/* ── 4. BOTTONI ─────────────────────────────────────────────── */

/* Bottone primario */
.button,
.button--primary,
button[type="submit"],
.shopify-payment-button__button {
  font-family: var(--sp-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  background-color: var(--sp-copper) !important;
  color: #ffffff !important;
  border: 1px solid var(--sp-copper) !important;
  border-radius: 2px !important;
  transition: background-color 200ms ease, border-color 200ms ease, transform 140ms ease !important;
}

.button:hover,
.button--primary:hover,
button[type="submit"]:hover {
  background-color: var(--sp-copper-deep) !important;
  border-color: var(--sp-copper-deep) !important;
    color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* Bottone secondario / outline */
.button--secondary {
  font-family: var(--sp-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  background-color: transparent !important;
  color: var(--sp-ink) !important;
  border: 1px solid rgba(26, 26, 15, 0.35) !important;
  border-radius: 2px !important;
  transition: background-color 200ms ease, border-color 200ms ease !important;
}

.button--secondary:hover {
  background-color: rgba(26, 26, 15, 0.05) !important;
  border-color: rgba(26, 26, 15, 0.65) !important;
}


/* ── 5. SCHEDA PRODOTTO (card) ───────────────────────────────── */

.card-wrapper,
.card {
  border-radius: 2px;
}

/* Titolo prodotto in card */
.card__heading,
.card__heading a {
  font-family: var(--sp-font-display);
  font-weight: 400;
  font-style: italic;
  color: var(--sp-ink);
  letter-spacing: -0.01em;
}

/* Prezzo */
.price,
.price__regular,
.price__sale {
  font-family: var(--sp-font-display);
  font-size: clamp(16px, 1.8vw, 20px);
  font-weight: 300;
  font-style: italic;
  color: var(--sp-ink);
}

.price__sale { color: var(--sp-copper); }

/* Badge "esaurito" / "in offerta" */
.badge {
  background: rgba(197, 122, 71, 0.12);
  color: var(--sp-ink);
  border: 0.5px solid rgba(197, 122, 71, 0.35);
  border-radius: 2px;
  font-family: var(--sp-font-mono);
  font-size: 8px;
  letter-spacing: 0.16em;
}


/* ── 6. PAGINE COLLEZIONE ────────────────────────────────────── */

/* Titolo collezione */
.collection__title,
.section-header__title {
  font-family: var(--sp-font-display);
  font-weight: 300;
  font-style: italic;
  color: var(--sp-ink);
}

/* Descrizione collezione */
.collection__description {
  font-family: var(--sp-font-body);
  color: rgba(26, 26, 15, 0.65);
  line-height: 1.7;
}

/* Filtri e ordinamento */
.facets__heading,
.facets label,
.active-facets__button {
  font-family: var(--sp-font-mono);
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}


/* ── 7. PAGINA PRODOTTO ──────────────────────────────────────── */

/* Titolo prodotto */
.product__title {
  font-family: var(--sp-font-display);
  font-size: clamp(28px, 4vw, 48px);
  font-weight: 300;
  font-style: italic;
  color: var(--sp-ink);
  letter-spacing: -0.015em;
  line-height: 1.08;
}

/* Vendor / fornitore */
.product__text.caption-with-letter-spacing,
.product__vendor {
  font-family: var(--sp-font-mono);
  font-size: 9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--sp-copper);
}

/* Descrizione prodotto */
.product__description {
  font-family: var(--sp-font-body);
  font-size: 15px;
  line-height: 1.75;
  color: rgba(26, 26, 15, 0.72);
}

/* Varianti */
.variant-selects label,
.product-form__input label {
  font-family: var(--sp-font-mono);
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sp-ink);
}


/* ── 8. BLOG E ARTICOLI ──────────────────────────────────────── */

/* Titolo articolo in lista */
.article-card__title,
.blog-article__title {
  font-family: var(--sp-font-display);
  font-weight: 400;
  font-style: italic;
  color: var(--sp-ink);
}

/* Data e autore */
.article-card__footer,
.article__date,
.article__author {
  font-family: var(--sp-font-mono);
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sp-stone);
}

/* Corpo articolo */
.article__content,
.rte {
  font-family: var(--sp-font-body);
  font-size: 16px;
  line-height: 1.8;
  color: rgba(26, 26, 15, 0.78);
}

.rte h1, .rte h2, .rte h3 {
  font-family: var(--sp-font-display);
  font-weight: 300;
  font-style: italic;
  color: var(--sp-ink);
  margin-top: 2em;
  margin-bottom: 0.5em;
}

.rte a {
  color: var(--sp-copper);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.rte blockquote {
  border-left: 3px solid var(--sp-copper);
  padding-left: 20px;
  font-family: var(--sp-font-display);
  font-style: italic;
  font-size: 1.15em;
  color: rgba(26, 26, 15, 0.65);
  margin: 2em 0;
}


/* ── 9. FORM E INPUT ─────────────────────────────────────────── */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="search"],
textarea,
select {
  font-family: var(--sp-font-body);
  font-size: 14px;
  color: var(--sp-ink);
  background: rgba(26, 26, 15, 0.03);
  border: 1px solid rgba(26, 26, 15, 0.18);
  border-radius: 2px;
  transition: border-color 200ms ease;
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--sp-copper);
  box-shadow: 0 0 0 2px rgba(197, 122, 71, 0.15);
}

label {
  font-family: var(--sp-font-mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sp-ink);
}


/* ── 10. CARRELLO ────────────────────────────────────────────── */

.cart__item-name,
.cart-item__name {
  font-family: var(--sp-font-display);
  font-style: italic;
  font-weight: 400;
  color: var(--sp-ink);
}

.cart__item-price,
.cart-item__price {
  font-family: var(--sp-font-display);
  font-style: italic;
  color: var(--sp-ink);
}

.totals__total {
  font-family: var(--sp-font-display);
  font-size: clamp(20px, 2.5vw, 28px);
  font-style: italic;
  font-weight: 300;
}


/* ── 11. PAGINAZIONE ─────────────────────────────────────────── */

.pagination__item a,
.pagination__item button {
  font-family: var(--sp-font-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--sp-ink);
  border: 1px solid rgba(26, 26, 15, 0.18);
  border-radius: 2px;
  transition: background 200ms, border-color 200ms;
}

.pagination__item--current a,
.pagination__item--current button {
  background: var(--sp-copper);
  color: #fff;
  border-color: var(--sp-copper);
}


/* ── 12. SEZIONI SP- CUSTOM ──────────────────────────────────── */
/*
   Le sezioni sp-* hanno i propri CSS scoped e non vengono
   modificate da questo file. Nessun override necessario.
*/

/* ── 13. ANNOUNCEMENT BAR ───────────────────────────────────── */
.announcement-bar {
  background-color: var(--sp-copper) !important;
}

.announcement-bar__message,
.announcement-bar a {
  font-family: var(--sp-font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
}

/* ── 14. HEADER ─────────────────────────────────────────────── */
.header-wrapper,
.header {
  background-color: var(--sp-ink) !important;
  border-bottom: 1px solid rgba(197, 122, 71, 0.25) !important;
}

/* Voci menu */
.header__menu-item,
.header__menu-item span,
.list-menu__item {
  font-family: var(--sp-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--sp-cream) !important;
}

.header__menu-item:hover span,
.list-menu__item:hover {
  color: var(--sp-caramel) !important;
}

/* Icone carrello, account, ricerca */
.header__icon svg,
.header__icon .icon {
  color: var(--sp-cream) !important;
  fill: var(--sp-cream) !important;
}

.header__icon:hover svg {
  color: var(--sp-caramel) !important;
  fill: var(--sp-caramel) !important;
}
/* Dropdown menu — sfondo ink, testi cream */
.header__submenu,
.list-menu.list-menu--disclosure {
  background-color: var(--sp-ink) !important;
  border: 1px solid rgba(197, 122, 71, 0.25) !important;
}

.header__submenu .list-menu__item,
.list-menu.list-menu--disclosure .list-menu__item {
  color: var(--sp-cream) !important;
}

.header__submenu .list-menu__item:hover,
.list-menu.list-menu--disclosure .list-menu__item:hover {
  color: var(--sp-caramel) !important;
  background-color: rgba(244, 240, 217, 0.06) !important;
}

/* ── 15. FOOTER ─────────────────────────────────────────────── */
.color-background-1.gradient .footer,
.footer-section .footer,
[class*="shopify-section"] .footer,
.footer {
  background-color: var(--sp-ink) !important;
  color: var(--sp-cream) !important;
}

.footer__content-top,
.footer__content-bottom {
  border-color: rgba(244, 240, 217, 0.1) !important;
}

.footer p,
.footer li,
.footer a,
.footer__copyright {
  font-family: var(--sp-font-body) !important;
  color: rgba(244, 240, 217, 0.65) !important;
  font-size: 13px !important;
}

.footer a:hover {
  color: var(--sp-caramel) !important;
}

.footer__copyright {
  font-family: var(--sp-font-mono) !important;
  font-size: 9px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: rgba(244, 240, 217, 0.35) !important;
}
.footer h2,
.footer h3,
.footer__heading {
  color: var(--sp-cream) !important;
  font-family: var(--sp-font-display) !important;
  font-style: italic !important;
  font-weight: 300 !important;
}

/* ── 15.B FOOTER — ordine e gerarchia visiva ───────────────── */

/* (A) Su mobile, centra tutto il blocco testuale per allinearlo al logo */
@media (max-width: 749px) {
  .footer .footer-block {
    text-align: center !important;
  }
  .footer .footer-block a {
    text-align: center;
  }
}

/* (B) Spaziatura tra titolo, paragrafi e link Contatti */
.footer .footer-block__heading {
  margin-bottom: 20px !important;
}

.footer .footer-block p {
  margin-bottom: 14px !important;
}

.footer .footer-block p:last-of-type {
  margin-bottom: 18px !important;
}

.footer .footer-block a {
  display: inline-block;
  margin-top: 8px;
}

/* ── 16. ANNOUNCEMENT BAR — rotazione ──────────────────────── */
.announcement-bar__announcements {
  position: relative;
}

.announcement-bar__announcements > * {
  position: absolute;
  width: 100%;
  opacity: 0;
  transition: opacity 0.6s ease;
  pointer-events: none;
}

.announcement-bar__announcements > *.sp-banner-active {
  opacity: 1;
  position: relative;
  pointer-events: auto;
}
/* ── 17. PADDING SEZIONI ────────────────────────────────────── */
body section[class*="sp-"]:not(.sp-hero) {
  padding-top: clamp(40px, 3vw, 40px) !important;
  padding-bottom: clamp(40px, 3vw, 40px) !important;
}
/* ── 18. NEWSLETTER INPUT OVERRIDE ─────────────────────────── */
#newsletter .sp-newsletter__input {
  background: rgba(244, 240, 217, 0.07) !important;
  border: 0.5px solid rgba(244, 240, 217, 0.22) !important;
  color: var(--sp-cream) !important;
}

#newsletter .sp-newsletter__input::placeholder {
  color: rgba(244, 240, 217, 0.28) !important;
}

#newsletter .sp-newsletter__input:focus {
  border-color: var(--sp-copper) !important;
  background: rgba(244, 240, 217, 0.10) !important;
}
/* ── 19. FILTRI COLLEZIONE — dropdown ───────────────────────── */
.facets__disclosure-popup,
.facets .disclosure__list,
.facets__display {
  background-color: var(--sp-cream) !important;
  border: 1px solid rgba(26, 26, 15, 0.18) !important;
  box-shadow: 0 4px 16px rgba(26, 26, 15, 0.12) !important;
}

.facets__disclosure-popup .facets__item,
.facets .disclosure__list li,
.facets__display label {
  color: var(--sp-ink) !important;
}

.facets__disclosure-popup .facets__item:hover,
.facets .disclosure__list li:hover {
  background-color: rgba(26, 26, 15, 0.05) !important;
}

/* ── 20. MENU DRAWER MOBILE ─────────────────────────────────── */
/* Sfondo del drawer del menu mobile (era trasparente) */
.menu-drawer,
.menu-drawer__inner-container,
.menu-drawer__navigation {
  background-color: var(--sp-ink) !important;
  color: var(--sp-cream) !important;
}

/* Voci del menu mobile */
.menu-drawer__menu-item,
.menu-drawer__menu-item span,
.menu-drawer summary,
.menu-drawer a {
  color: var(--sp-cream) !important;
  font-family: var(--sp-font-mono) !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
}

.menu-drawer__menu-item:hover,
.menu-drawer__menu-item:hover span,
.menu-drawer summary:hover {
  color: var(--sp-caramel) !important;
  background-color: rgba(244, 240, 217, 0.06) !important;
}

/* Submenu mobile (voci COMPRA e BLOG che hanno la freccia) */
.menu-drawer__submenu {
  background-color: var(--sp-ink) !important;
}

/* Separatori tra le voci */
.menu-drawer__menu li,
.menu-drawer ul li {
  border-color: rgba(244, 240, 217, 0.10) !important;
}

/* Icone X chiusura e freccia → */
.menu-drawer .icon,
.menu-drawer svg {
  color: var(--sp-cream) !important;
  fill: var(--sp-cream) !important;
}


/* ── 21. SEARCH MODAL MOBILE ────────────────────────────────── */
/* Sfondo del modal di ricerca (era trasparente) */
.search-modal,
.search-modal__content,
.predictive-search {
  background-color: var(--sp-ink) !important;
}

/* Campo input della ricerca */
.search-modal .search__input,
.search-modal input[type="search"],
.search-modal input[type="text"] {
  background-color: rgba(244, 240, 217, 0.06) !important;
  border-color: rgba(197, 122, 71, 0.40) !important;
  color: var(--sp-cream) !important;
}

.search-modal .search__input::placeholder,
.search-modal input::placeholder {
  color: rgba(244, 240, 217, 0.45) !important;
}

/* Icone X e lente di ingrandimento dentro il modal ricerca */
.search-modal .icon,
.search-modal svg,
.search-modal button .icon {
  color: var(--sp-cream) !important;
  fill: var(--sp-cream) !important;
}

/* ── 22. POPUP NOTIFICA CARRELLO ────────────────────────────── */
cart-notification,
.cart-notification {
  background-color: var(--sp-cream) !important;
  color: var(--sp-ink) !important;
  border: 1px solid rgba(197, 122, 71, 0.25) !important; /* bordo color copper per staccare */
  box-shadow: 0 10px 30px rgba(26, 26, 15, 0.15) !important; /* ombra morbida */
  z-index: 999 !important; /* per sicurezza che stia sopra a tutto */
}

/* Assicuriamoci che il titolo "Articolo aggiunto al carrello" si legga bene */
.cart-notification__heading,
.cart-notification__heading .icon-success {
  color: var(--sp-ink) !important;
  font-family: var(--sp-font-body) !important;
}

/* Se c'è un pulsante di chiusura (X), lo rendiamo ben visibile */
.cart-notification__close {
  color: var(--sp-ink) !important;
}

/* ── 23. FIX CARRELLO MOBILE E FONT ────────────────────────── */
@media screen and (max-width: 749px) {
  
  /* 1. Rimpicciolisce il titolo "Il tuo carrello" */
  .cart__title, 
  .title-wrapper-with-link .title {
    font-size: clamp(24px, 6vw, 32px) !important;
    margin-bottom: 10px !important;
  }

  /* 2. Rimpicciolisce i titoli e i prezzi dei prodotti */
  .cart-item__name {
    font-size: 14px !important;
    line-height: 1.3 !important;
    margin-bottom: 4px !important;
  }
  .cart-item__price-wrapper .price {
    font-size: 14px !important;
  }

  /* 3. Allinea Selettore Quantità e Cestino sulla stessa riga */
  .cart-item__quantity-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px !important;
    margin-top: 10px !important;
  }
  
  /* Sistema l'icona del cestino per non farla deformare */
  cart-remove-button {
    margin: 0 !important;
  }
  cart-remove-button .button {
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* 4. Rimpicciolisce il testo del totale */
  .totals__subtotal {
    font-size: 14px !important;
  }
  .totals__subtotal-value {
    font-size: 18px !important;
  }
  
  /* 5. Diamo respiro al fondo pagina per non far coprire il bottone checkout dalle app */
  .cart__footer {
    padding-bottom: 80px !important; 
  }
}

/* ── 24. FIX TESTO TASSE E SPEDIZIONE PAGINA PRODOTTO ───────────────── */
.product__tax,
.tax-note {
  font-family: var(--sp-font-mono) !important;
  font-size: 9px !important; /* Misura piccola e discreta */
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: rgba(26, 26, 15, 0.65) !important; /* Colore scuro ma leggermente trasparente per non appesantire */
  margin-top: 8px !important;
  margin-bottom: 20px !important;
  line-height: 1.6 !important;
}

/* Sistemiamo anche l'aspetto del link "Spese di spedizione" all'interno della frase */
.product__tax a,
.tax-note a {
  color: var(--sp-copper) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}
/* ── 25. FIX TESTI BARRA DI RICERCA ──────────────────────────── */
.search-modal__content, 
.predictive-search {
  background-color: var(--sp-ink) !important;
}

/* Colore dei titoli dei prodotti, prezzi e dicitura "Cerca" */
.predictive-search__item-heading,
.predictive-search__heading,
.predictive-search__item .price,
.search-modal__content .field__label {
  color: var(--sp-cream) !important;
}

/* Colore del brand/vendor nei risultati di ricerca */
.predictive-search__item-vendor {
  color: var(--sp-caramel) !important;
}

/* Hover sui risultati per far capire che sono cliccabili */
.predictive-search__item:hover,
.predictive-search__item--term:hover {
  background-color: rgba(244, 240, 217, 0.05) !important;
}


/* ── 26. COLORE EVIDENZIATORE TESTO SELEZIONATO ──────────────── */
/* Cambia il colore quando un utente seleziona/evidenzia il testo */
::selection {
  background-color: var(--sp-copper) !important; 
  color: #ffffff !important;
}
::-moz-selection { /* Per Firefox */
  background-color: var(--sp-copper) !important;
  color: #ffffff !important;
}


/* ── 27. FIX COLORI PAGINE ACCOUNT E LOGIN ───────────────────── */
/* Forza testi scuri su sfondo chiaro per la leggibilità */
.customer {
  color: var(--sp-ink) !important;
}

.customer h1, .customer h2, .customer h3 {
  color: var(--sp-ink) !important;
  font-family: var(--sp-font-display) !important;
}

.customer a {
  color: var(--sp-copper) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.customer a:hover {
  color: var(--sp-copper-deep) !important;
}

/* Stile dei campi di testo (email, password) */
.customer .field input {
  background-color: rgba(26, 26, 15, 0.03) !important;
  border: 1px solid rgba(26, 26, 15, 0.2) !important;
  color: var(--sp-ink) !important;
}

.customer .field label {
  color: rgba(26, 26, 15, 0.6) !important;
}

/* Bottoni dell'account (Accedi, Registrati, ecc.) */
.customer button {
  background-color: var(--sp-copper) !important;
  color: #ffffff !important;
  border: 1px solid var(--sp-copper) !important;
  border-radius: 3px !important;
  font-family: var(--sp-font-mono) !important;
  text-transform: uppercase;
  letter-spacing: 0.16em;
}

.customer button:hover {
  background-color: var(--sp-copper-deep) !important;
  border-color: var(--sp-copper-deep) !important;
}

/* Colore tabelle storico ordini */
.customer thead th, .customer tbody td {
  color: var(--sp-ink) !important;
  border-bottom: 1px solid rgba(26, 26, 15, 0.1) !important;
}

/* ── 27.B FIX PREZZI RICERCA PREDITTIVA ──────────────────────── */
/* Forza il colore crema su tutte le varianti di prezzo nella ricerca */
.predictive-search__item-price,
.predictive-search__item .price,
.predictive-search__item .price-item,
.predictive-search__item .price__regular,
.predictive-search__item .price__sale,
.predictive-search__item .price__sale .price-item--sale {
  color: var(--sp-cream) !important;
}
}
/* ── 28. CARD PILLOLE INTERAMENTE CLICCABILE ─────────────────── */
.blog-articles__article {
  position: relative !important;
}

/* Prende il link dentro l'articolo e lo espande su tutta la superficie */
.blog-articles__article a::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 10 !important;
}

/* Aggiungiamo un leggero effetto hover per far capire all'utente che può cliccare */
.blog-articles__article {
  transition: transform 0.25s ease !important;
}

.blog-articles__article:hover {
  transform: translateY(-4px) !important;
}

/* ── 29. RESTYLING PREMIUM CATALOGO E PRODOTTI (UNIFICATO) ──── */

/* 1. Cornice Terracotta per foto catalogo, correlati e pagina prodotto */
.collection .card__inner,
.product-recommendations .card__inner,
.related-products .card__inner,
.product__media,
.thumbnail {
  border: 1px solid #c57a47 !important;
  border-radius: 0 !important;
}

/* Effetto scuro al passaggio del mouse sulle miniature della pagina prodotto */
.thumbnail:hover {
  border: 1px solid #1a1a0f !important;
}

/* 2. Effetto "Respiro" al passaggio del mouse sulle card */
.collection .card-wrapper,
.product-recommendations .card-wrapper,
.related-products .card-wrapper {
  transition: transform 0.4s ease !important;
}
.collection .card-wrapper:hover,
.product-recommendations .card-wrapper:hover,
.related-products .card-wrapper:hover {
  transform: translateY(-6px) !important;
}

/* 3. Prezzi base: Ink, monospace, grassetto */
.card-information .price-item,
.product-grid .price-item,
.collection .price-item,
.product-recommendations .price-item,
.related-products .price-item {
  font-family: 'Space Mono', 'Courier New', monospace !important;
  font-style: normal !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 0.1em !important;
  color: #1a1a0f !important; 
}

/* Prezzo un po' più grande solo per la singola pagina prodotto */
.product__info-container .price-item {
  font-family: 'Space Mono', 'Courier New', monospace !important;
  font-style: normal !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  letter-spacing: 0.1em !important;
  color: #1a1a0f !important;
}

/* Prezzo di listino barrato (Pieno, non più sbiadito) */
.price-item--regular {
  opacity: 1 !important; /* Riportato a 1 per togliere l'effetto sbiadito */
  font-weight: 400 !important;
}

/* Prezzo in saldo (Ink scuro, niente più Terracotta) */
.price__sale .price-item--sale {
  color: #1a1a0f !important; 
}

/* 4. Scritta "SCOPRI ➔" (Terracotta) */
.collection .card-information::after,
.product-recommendations .card-information::after,
.related-products .card-information::after {
  content: "SCOPRI ➔";
  display: block;
  font-family: 'Space Mono', 'Courier New', monospace !important;
  font-size: 11px !important;
  color: #c57a47 !important;
  letter-spacing: 0.15em !important;
  opacity: 0;
  transform: translateY(5px);
  transition: all 0.3s ease !important;
  margin-top: 10px !important;
}
.collection .card-wrapper:hover .card-information::after,
.product-recommendations .card-wrapper:hover .card-information::after,
.related-products .card-wrapper:hover .card-information::after {
  opacity: 1;
  transform: translateY(0);
}

/* 5. Badge "Esaurito/In Saldo" stile editoriale */
.card__badge .badge {
  font-family: 'Space Mono', 'Courier New', monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 6px 10px !important;
  border: none !important;
  
  /* Colore Terracotta di default per i badge (es. In Offerta) */
  background-color: #c57a47 !important; 
  color: #ffffff !important; 
}

/* Eccezione: Assicuriamoci che l'Esaurito resti nero scuro */
.card__badge .badge.color-inverse,
.card__badge .badge.color-background-1,
.card__badge .badge--sold-out {
  background-color: #1a1a0f !important; 
  color: #f4f0d9 !important; 
}

/* ── 30. NORMALIZZAZIONE BARRA FILTRI E ORDINAMENTO ──────────── */

/* 1. Etichette di comando rigorose (FILTRA, ORDINA PER) */
.facets__heading, 
.facet-filters__label label,
.facet-filters__label {
  font-family: 'Space Mono', 'Courier New', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #1a1a0f !important;
  opacity: 0.8 !important; /* Le attenua leggermente per non rubare la scena */
  margin-right: 15px !important;
}

/* 2. Testi dei menu a tendina e conteggio prodotti perfettamente allineati */
.facets__summary span,
.facet-filters__field .select__select,
.product-count__text {
  font-size: 14px !important; /* Misura unica e pulita per tutti i testi */
  color: #1a1a0f !important;
  letter-spacing: 0.05em !important;
  font-weight: 400 !important;
}

/* Rimuove i bordi brutti dai menu a tendina di Shopify se presenti */
.facet-filters__field .select__select {
  border: none !important;
  box-shadow: none !important;
}