/*
Theme Name: Nós das Gravatas Child
Template: botiga
Description: Child theme do Botiga com a identidade visual da Nós das Gravatas (preto + creme, extraída do logo oficial).
Version: 1.0.0
Author: Cláudio
*/

:root {
  --ndg-cream: #F7F5D9;
  --ndg-ink: #171714;
  --ndg-muted: #56554B;
  --ndg-border: #E2E0C7;
}

/* ---------- Base ---------- */
body {
  background-color: var(--ndg-cream);
  color: var(--ndg-ink);
}

a {
  color: var(--ndg-ink);
}
a:hover {
  color: var(--ndg-muted);
}

/* ---------- Tipografia ---------- */
.site-title,
.woocommerce-loop-product__title,
.product_title,
h1, h2, h3, h4, h5, h6 {
  font-family: 'Cormorant Garamond', Georgia, serif;
  letter-spacing: 0.5px;
  font-weight: 600;
}

body,
.woocommerce-product-details__short-description,
p {
  font-family: 'Jost', -apple-system, sans-serif;
}

/* ---------- Cabeçalho ---------- */
#masthead,
.botiga-header,
header.site-header {
  background-color: var(--ndg-cream);
  border-bottom: 1px solid var(--ndg-border);
}

/* Menu principal */
#site-navigation a,
.main-navigation a,
.botiga-primary-menu a {
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 13px;
  color: var(--ndg-ink);
}

/* ---------- Botões ---------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce div.product form.cart .button,
.wp-block-button__link {
  background-color: var(--ndg-ink);
  color: var(--ndg-cream);
  border: 1px solid var(--ndg-ink);
  border-radius: 0;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 13px;
  padding: 12px 24px;
  transition: all 0.2s ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.wp-block-button__link:hover {
  background-color: transparent;
  color: var(--ndg-ink);
}

/* ---------- Preços e badges ---------- */
.woocommerce-Price-amount {
  color: var(--ndg-ink);
  font-weight: 500;
}

.onsale {
  background-color: var(--ndg-ink) !important;
  color: var(--ndg-cream) !important;
  border-radius: 0 !important;
  text-transform: uppercase;
  font-size: 11px !important;
  letter-spacing: 0.5px;
}

/* ---------- Rodapé ---------- */
#colophon,
.botiga-footer {
  background-color: var(--ndg-ink);
  color: var(--ndg-cream);
}
#colophon a,
.botiga-footer a {
  color: var(--ndg-cream);
}

/*
  Nota: nomes de classe podem variar levemente conforme a versão do Botiga
  e se você usa o Botiga Pro. Se algum trecho não aplicar visualmente,
  clique com o botão direito no elemento no navegador > Inspecionar,
  confirme a classe exata e ajuste o seletor aqui.
*/