/* BUGRA · ajustes de 27/10/2026: site com fundo preto + palavra BUGRA na altura do ícone.
   Carregado por último em todas as páginas; o cabeçalho e as faixas que já eram escuras continuam iguais. */

/* ---------- fundo preto ---------- */
html, body { background: #000; color: #f4f2ee; }
.bg-paper { background-color: #000; }
.bg-bone, .hover\:bg-bone:hover { background-color: #141415; }
.bg-white:not(.btn) { background-color: #141415; }
.text-ink, .hover\:text-ink:hover { color: #f4f2ee; }
.text-ink\/80 { color: rgba(244, 242, 238, .8); }
.text-mute { color: #a3a3a9; }
.border-line, :where(.divide-line > :not(:last-child)) { border-color: #2a2a2d; }
.focus\:border-ink:focus { border-color: #f4f2ee; }
::selection { background: #f4f2ee; color: #000; }

/* botões: claros sobre o preto */
.btn-solid { background: #f4f2ee; color: #000; border-color: #f4f2ee; }
.btn-solid:hover { background: #fff; color: #000; border-color: #fff; }
.btn-outline { color: #f4f2ee; border-color: #f4f2ee; }
.btn-outline:hover { background: #f4f2ee; color: #000; }

/* setas e bolinhas dos carrosséis */
.car-arrow { color: #f4f2ee !important; border-color: #3a3a3e !important; }
.car-arrow:hover, .car-arrow:active { background: #f4f2ee !important; border-color: #f4f2ee !important; color: #000 !important; }
.dot { background: #3a3a3e !important; }
.dot.is-active { background: #f4f2ee !important; }

/* campos de formulário */
input, select, textarea { color: #f4f2ee; background-color: transparent; }
input::placeholder, textarea::placeholder { color: #8d8d93; }
select option { background: #141415; color: #f4f2ee; }

/* ---------- palavra BUGRA: imagem oficial (BUGRA BRANCO.png) na altura do ícone BG ---------- */
img[src="/brand/bg-branco.png"] + span,
img[src="/brand/bg-quadro.png"] + span {
  display: inline-block; font-size: 0 !important; line-height: 0; color: transparent; padding: 0 !important;
  background: url("/brand/bugra-texto-branco.png") left center / contain no-repeat;
}
img[src="/brand/bg-branco.png"].h-8 + span,
img[src="/brand/bg-quadro.png"].h-8 + span { width: 154px; height: 32px; }
img[src="/brand/bg-branco.png"].h-6 + span { width: 116px; height: 24px; }

/* componentes com cor própria (regras com [data-astro-cid], por isso !important) */
.field { background: #0f0f10 !important; border-color: #2e2e32 !important; color: #f4f2ee !important; }
.field:focus { border-color: #f4f2ee !important; }
.chip, .size-chip { border-color: #3a3a3e !important; color: #f4f2ee; }
.chip:hover, .size-chip:hover { border-color: #f4f2ee !important; }
.chip.is-active, .size-chip.is-active { background: #f4f2ee !important; color: #000 !important; border-color: #f4f2ee !important; }
.swatch { border-color: #3a3a3e !important; box-shadow: inset 0 0 0 3px #000 !important; }
.swatch.is-active { border-color: #f4f2ee !important; box-shadow: inset 0 0 0 3px #000, 0 0 0 1.5px #f4f2ee !important; }
.js-swatch[data-active=true] { box-shadow: inset 0 0 0 2px #fff, 0 0 0 2px #f4f2ee !important; }
.thumb { border-color: #2a2a2d !important; }
.thumb.is-active { border-color: #f4f2ee !important; }
