/*
 * el Cigronet — Identitat visual
 * Raisonne (logo/titulares) → Jost · Spezia Regular (texto) → Inter · Spezia Mono (claims) → DM Mono
 * Paleta: verde #42A85A · lima #E5FAB4 · negro #000000 · piedra #E4E3DB
 */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@400;500&family=DM+Mono:wght@400;500&display=swap');

:root {
  --dtb-primary: #42a85a;
  --dtb-secondary: #e4e3db;
  --dtb-hover: #37914d; /* primary, ~10% darker */
  --dtb-font-family: 'Inter'; /* Spezia Regular substitute, already loaded by main.scss */
  --dtb-color: #000000;

  --dtb-btn-color: #000000; /* white on the green is 3.01:1 (fails), black is 6.98:1 */
  --dtb-btn-bg: var(--dtb-primary);
  --dtb-btn-active-bg: var(--dtb-primary);
  --dtb-btn-active-color: var(--dtb-btn-color);
  --dtb-btn-hover-color: var(--dtb-btn-active-color);
  --dtb-btn-secondary: #e4e3db;
  --dtb-btn-secondary-color: #000000;

  --dtb-input-border-focus: var(--dtb-primary);
  /* green on white is 3.01:1, too low for link text — links stay black, deep green on hover (5.08:1) */
  --bs-link-color: #000000;
  --bs-link-hover-color: #2e7d43;

  --dtb-font-title: 'Jost', sans-serif; /* Raisonne substitute: logo, headings, product titles */
  --dtb-font-mono: 'DM Mono', monospace; /* Spezia Mono substitute: claims, labels, prices */
}

/* Titles: Raisonne-like geometric sans */
h1,
h2,
h3,
.dtb-item-list h2,
.dtb-item-title-grid,
#menu-item-modal .modal-title,
.modal-title {
  font-family: var(--dtb-font-title);
  font-weight: 500;
}

/* Product descriptions: Spezia Regular-like grotesk, distinct from the title */
.item-description,
.dtb-item-description-grid,
.dtb-item-description-modal {
  font-family: var(--dtb-font-family), var(--dtb-font-family-generic);
}

/* Claims/labels: Spezia Mono, uppercase with tracking like "CUINA CASOLANA" */
.btn,
.item-price,
#dtb-custom-nav-tabs .nav-link {
  font-family: var(--dtb-font-mono);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* main.scss uses --dtb-btn-secondary as the outline text/border color: stone on white is 1.29:1.
   Outline variant goes black (21:1) and fills with stone on hover (16.31:1). */
.btn-outline-secondary {
  --bs-btn-color: #000000;
  --bs-btn-border-color: #000000;
  --bs-btn-hover-color: #000000;
  --bs-btn-hover-bg: var(--dtb-secondary);
  --bs-btn-hover-border-color: #000000;
  --bs-btn-active-color: #000000;
  --bs-btn-active-bg: var(--dtb-secondary);
  --bs-btn-active-border-color: #000000;
}

/* Category tabs: stone pill, green when active (black text on both) */
#dtb-custom-nav-tabs li.nav-item a {
  color: #000000 !important;
  background-color: var(--dtb-secondary) !important;
  border-color: var(--dtb-secondary) !important;
}

#dtb-custom-nav-tabs li.nav-item a:hover {
  background-color: #e5fab4 !important;
  border-color: #e5fab4 !important;
}

#dtb-custom-nav-tabs li.nav-item a.active {
  background-color: var(--dtb-primary) !important;
  border-color: var(--dtb-primary) !important;
}