/* =====================================================
   Visual Editor Pro — canvas.css
   Base neutra das páginas do Canvas.
   -----------------------------------------------------
   Este arquivo NÃO estiliza a página. Ele só garante que o resultado seja
   o mesmo em qualquer tema, fechando a última porta de herança.

   Como: VEP_Canvas::drop_theme_styles() remove as folhas do tema em páginas
   do Canvas, então sobra o estilo padrão do navegador (igual em todo lugar)
   mais o CSS da própria página. O que fica aqui é o mínimo que o navegador
   não normaliza sozinho.

   Regra de ouro: tudo usa :where(), que tem especificidade ZERO. Qualquer
   regra da própria página — inclusive as que a IA gera dentro de
   .vep-ai-page — vence sem precisar de !important. Se alguma coisa aqui
   brigasse com o conteúdo, o conteúdo ganharia. É de propósito.

   Não zeramos margens de <p>, <h1>…<h6>, listas etc. de propósito: o padrão
   do navegador já é idêntico entre Chrome, Firefox e Safari. Zerar mudaria
   a aparência de páginas já publicadas sem ganhar independência nenhuma.
   ===================================================== */

/* 1. box-sizing — o único ponto em que os temas divergem de fato e que muda
      a largura calculada de qualquer caixa com padding ou borda. */
:where(#vep-canvas-root),
:where(#vep-canvas-root) *,
:where(#vep-canvas-root) *::before,
:where(#vep-canvas-root) *::after {
    box-sizing: border-box;
}

/* 2. O container: temas aplicam largura máxima, colunas, padding lateral e
      float em .entry-content / main. Nada disso pode alcançar a página. */
:where(#vep-canvas-root) {
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
    float: none;
    clear: both;
    text-align: left;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #111;
    background: transparent;
}

/* 3. Mídia responsiva. O navegador não faz isso sozinho; os temas fazem, e a
      página passou a contar com isso. Mantemos o comportamento sem o tema. */
:where(#vep-canvas-root) :is(img, svg, video, canvas, iframe, embed, object) {
    max-width: 100%;
    height: auto;
}

/* 4. Tabelas: o padrão do navegador é `separate` com espaçamento herdado do
      tema em quase todo tema clássico. Fixamos o comportamento previsível. */
:where(#vep-canvas-root) table {
    border-collapse: collapse;
    width: auto;
    max-width: 100%;
}

/* 5. Controles de formulário não herdam fonte por padrão do navegador — sem
      isso, um <button> ou <input> da página sai com a fonte do sistema em vez
      da fonte da página, e o resultado muda conforme o SO do visitante. */
:where(#vep-canvas-root) :is(button, input, select, textarea) {
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
}
