/* ==========================================================================
   ZENTH TEMA — base
   base.css · v1.0.0
   --------------------------------------------------------------------------
   O reset.css do Hello Elementor esta desligado em functions.php, porque
   pintava link e botao de #c36 e brigava com o design system em cada hover.
   Este arquivo repoe o que aquele reset dava de util e o design system nao
   cobre: campo de formulario e tabela dentro de conteudo escrito no editor,
   mais alguns elementos de texto.

   Nada aqui estiliza componente. Tudo e seletor de elemento, dentro de
   .zt-texto ou solto, para nunca competir com uma classe zt-.
   ========================================================================== */

/* Botao sem classe: herda, em vez de inventar cor.
   --------------------------------------------------------------------------
   :where() aqui e obrigatorio, e por um motivo especifico: `[type="button"]`
   e um seletor de ATRIBUTO, que pesa igual a uma classe. Escrito solto, ele
   empata com `.zt-cap-btn` e ganha pela ordem, porque o CSS do tema carrega
   depois do CSS do plugin — foi assim que este arquivo zerou o recuo dos
   botoes de capacidade na ficha.

   Com :where() a regra vale zero e perde para qualquer componente, que e o
   comportamento correto de uma base. */
:where(button, [type="button"], [type="submit"], [type="reset"]) {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}
:where(button, [type="button"], [type="submit"], [type="reset"]):disabled { cursor: default; }

/* ---------------------------------------------------------------------------
   CONTEUDO ESCRITO NO EDITOR
   Vale dentro de .zt-texto, que e onde o cliente escreve garantia, trocas e
   privacidade. Fora dali, o componente manda.
   -------------------------------------------------------------------------- */

:where(.zt-texto) :where(table) {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--zt-txt-sm);
  margin-bottom: var(--zt-esp-5);
}
:where(.zt-texto) :where(th, td) {
  text-align: left;
  padding: var(--zt-esp-3);
  border: 1px solid var(--zt-neutro-200);
  vertical-align: top;
  line-height: var(--zt-lh-normal);
}
:where(.zt-texto) :where(th) { font-weight: var(--zt-peso-semi); background: var(--zt-neutro-100); }

:where(.zt-texto) :where(blockquote) {
  margin: 0 0 var(--zt-esp-5);
  padding-left: var(--zt-esp-5);
  border-left: 2px solid var(--zt-roxo-200);
  color: var(--zt-tinta-suave);
}
:where(.zt-texto) :where(code, kbd) { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.9em; }
:where(.zt-texto) :where(hr) { border: 0; border-top: var(--zt-regra); margin-block: var(--zt-esp-6); }
:where(.zt-texto) :where(figure) { margin: 0 0 var(--zt-esp-5); }
:where(.zt-texto) :where(figcaption) { font-size: var(--zt-txt-xs); color: var(--zt-tinta-tenue); margin-top: var(--zt-esp-2); }

/* Alinhamento do editor, que vinha do theme.css do Hello. */
.alignleft { float: left; margin: 0 var(--zt-esp-5) var(--zt-esp-4) 0; }
.alignright { float: right; margin: 0 0 var(--zt-esp-4) var(--zt-esp-5); }
.aligncenter { display: block; margin-inline: auto; }

/* Acessibilidade: o WordPress conta com esta classe existir. */
.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.screen-reader-text:focus {
  position: static !important;
  width: auto;
  height: auto;
  clip-path: none;
  padding: var(--zt-esp-3) var(--zt-esp-4);
  background: var(--zt-superficie);
}
