/* SPUN theme — adatta admin & storefront allo stile della landing (frontend) */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,600;12..96,700;12..96,800&family=Instrument+Sans:wght@400;500;600;700&display=swap');

:root { --spun-ink:#141414; --spun-green:#25D366; }

/* ---- Tipografia ---- */
body, .font-rubik, input, select, textarea, button, .font-public {
  font-family:'Instrument Sans','Rubik',system-ui,sans-serif;
}
h1, h2, h3, h4, h5, h6 {
  font-family:'Bricolage Grotesque','Rubik',sans-serif !important;
  letter-spacing:-0.015em;
}

/* ---- Card: bordo ink + hard shadow (stile brutalist della landing) ---- */
.shadow-db-card, .shadow-card, .shadow-paper, .shadow-cardCart, .shadow-filter {
  border:2px solid var(--spun-ink) !important;
  box-shadow:5px 5px 0 var(--spun-ink) !important;
  border-radius:16px !important;
}

/* ---- Bottoni primari: pillola + hard shadow ---- */
a.bg-primary, button.bg-primary {
  border:2px solid var(--spun-ink) !important;
  box-shadow:3px 3px 0 var(--spun-ink) !important;
  border-radius:9999px !important;
  color:#04210f !important;
  transition:transform .15s ease, box-shadow .15s ease;
}
a.bg-primary:hover, button.bg-primary:hover {
  transform:translate(-2px,-2px);
  box-shadow:5px 5px 0 var(--spun-ink) !important;
}

/* ---- Categoria tabs: pill con bordo (stile screenshot allegato) ---- */
.menu-slides .swiper-slide { width:auto !important; }

/* pill base */
.menu-slides a {
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  padding:9px 22px !important;
  border-radius:9999px !important;
  border:2px solid var(--spun-ink) !important;
  border-bottom-width:2px !important; /* annulla border-b-2 di Tailwind */
  background:#fff8ea !important;
  box-shadow:3px 3px 0 var(--spun-ink) !important;
  transition:transform .12s ease, box-shadow .12s ease !important;
  gap:0 !important;
  flex-direction:row !important;
}

/* nasconde la thumbnail (mostra solo testo) */
.menu-slides a img { display:none !important; }

/* testo del tab */
.menu-slides a h3 {
  font-size:0.9rem !important;
  font-weight:700 !important;
  line-height:1 !important;
  color:var(--spun-ink) !important;
  white-space:nowrap !important;
}

/* tab attivo → riempimento nero */
.menu-slides a.menu-category-active,
.menu-slides .menu-category-active {
  background:var(--spun-ink) !important;
  box-shadow:none !important;
  transform:translate(2px,2px) !important;
}
.menu-slides a.menu-category-active h3,
.menu-slides .menu-category-active h3 { color:#fff8ea !important; }

/* hover su non-attivo */
.menu-slides a:hover:not(.menu-category-active) {
  transform:translate(2px,2px) !important;
  box-shadow:1px 1px 0 var(--spun-ink) !important;
}

/* ---- Selezione testo coerente col brand ---- */
::selection { background:var(--spun-green); color:#04210f; }
