/* post.css: medidas dos widgets do CORPO do post (o Markdown vira widgets do Elementor em
   src/lib/postHtml.ts). Valores copiados de post-517.css (modelo do layout de post):
   H2/H3 Roboto 32/42 500, texto Inter 20/32 -0.2px, icon-list Inter 19/35, divider 4px #000 25%,
   video 16:9, pros/contras em 2 colunas. O resto (secoes, H1, byline, TOC, share, autora, recentes)
   esta em post-template.css; componentes custom em custom-css-widgets.css. */

/* Headings do corpo. Levantamento nos 117 posts originais (CSS post-<id>.css de cada um):
   H2 = Roboto 32/42 500, container padding-top 20px (638 de 670); mobile 30/36.
   H3 = Roboto 28/42 500, container padding-top 5px (477 de 511); mobile 24px.
   (O post 517 usava 32px nos H3 dos produtos: minoria, 21 ocorrencias no total.) */
.lk-post .lk-h2 .elementor-heading-title,
.lk-post .lk-h3 .elementor-heading-title,
.lk-post .lk-h4 .elementor-heading-title,
.lk-post .lk-h5 .elementor-heading-title,
.lk-post .lk-h6 .elementor-heading-title {
  font-family: "Roboto", Sans-serif;
  font-size: 32px;
  font-weight: 500;
  line-height: 42px;
  color: #000000;
}
.lk-post .lk-h3 .elementor-heading-title,
.lk-post .lk-h4 .elementor-heading-title,
.lk-post .lk-h5 .elementor-heading-title,
.lk-post .lk-h6 .elementor-heading-title { font-size: 28px; }
.lk-post .lk-h2 > .elementor-widget-container { padding: 20px 0px 0px 0px; }
.lk-post .lk-h3 > .elementor-widget-container,
.lk-post .lk-h4 > .elementor-widget-container,
.lk-post .lk-h5 > .elementor-widget-container,
.lk-post .lk-h6 > .elementor-widget-container { padding: 5px 0px 0px 0px; }

/* Texto (text-editor) */
.lk-post .lk-text {
  font-family: "Inter", Sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
  letter-spacing: -0.2px;
  color: #000000;
}
/* li.espaco do original (.espaco{padding-bottom:1.2em} no Customizer). Listas Markdown = todos os li tinham
   .espaco; listas cruas .sem-espaco / .mista (li.espaco so onde havia) reproduzem o original: li sem a classe
   nao tem padding nenhum (o p{padding-bottom:.9em} nao se aplica a li; Hello zera margin de li). */
.lk-post .lk-text li { padding-bottom: 1.2em; }
.lk-post .lk-text .sem-espaco li,
.lk-post .lk-text .mista li:not(.espaco) { padding-bottom: 0; }
/* lista "solta" do Markdown (li > p): sem o respiro extra do p */
.lk-post .lk-text li > p:only-child { margin-bottom: 0; padding-bottom: 0; }

/* Imagem (widget image, alinhada ao inicio) */
.lk-post .lk-image { text-align: start; }
.lk-post .lk-image img { vertical-align: middle; display: inline-block; }

/* Video YouTube 16:9 */
.lk-post .lk-video .elementor-wrapper { --video-aspect-ratio: 1.77777; aspect-ratio: var(--video-aspect-ratio); }
.lk-post .lk-video iframe { display: flex; height: 100%; width: 100%; border: none; background-color: #000; }

/* Divider entre produtos */
.lk-post .lk-divider {
  --divider-border-style: solid;
  --divider-color: #000;
  --divider-border-width: 4px;
}
.lk-post .lk-divider .elementor-divider-separator { width: 25%; }
.lk-post .lk-divider .elementor-divider { padding-block-start: 2px; padding-block-end: 2px; }
.lk-post .lk-divider > .elementor-widget-container { padding: 20px 0px 0px 0px; }

/* Pros / Contras: inner section 2 colunas, ambas com padding 20px (mobile: esquerda 0, direita 40px em cima) */
.lk-post .lk-col-pros > .elementor-element-populated,
.lk-post .lk-col-contras > .elementor-element-populated { padding: 20px 20px 20px 20px; }
.lk-post .lk-list-pros,
.lk-post .lk-list-contras {
  --e-icon-list-icon-size: 16px;
  --e-icon-list-icon-align: left;
  --e-icon-list-icon-margin: 0 calc(var(--e-icon-list-icon-size, 1em) * 0.25) 0 0;
  --icon-vertical-align: flex-start;
  --icon-vertical-offset: 0px;
}
.lk-post .lk-list-pros .elementor-icon-list-icon i { color: #30C55E; transition: color 0.3s; }
.lk-post .lk-list-contras .elementor-icon-list-icon i { color: #EF4444; transition: color 0.3s; }
.lk-post .lk-list-pros .elementor-icon-list-item > .elementor-icon-list-text,
.lk-post .lk-list-contras .elementor-icon-list-item > .elementor-icon-list-text {
  font-family: "Inter", Sans-serif;
  font-size: 19px;
  font-weight: 400;
  line-height: 35px;
}
.lk-post .lk-list-pros .elementor-icon-list-text,
.lk-post .lk-list-contras .elementor-icon-list-text { color: #111827; transition: color 0.3s; }
.lk-post .lk-list-contras > .elementor-widget-container { padding: 0px 0px 0px 10px; }
.lk-post .lk-list-contras .elementor-icon-list-icon { padding-inline-end: 0px; }
/* Custom CSS dos icon-list do original (9px nos pros, 10px nos contras; regra global, a ultima vence) */
.lk-post .elementor-icon-list-icon { margin-top: 10px !important; }

/* TOC minimizado em tablet/mobile antes do JS (o Customizer so cobria <=767px) */
@media (max-width: 1024px) {
  .lk-post .elementor-toc--minimized-on-tablet .elementor-toc__body { display: none; }
}

@media (max-width: 767px) {
  .lk-post .lk-h2 .elementor-heading-title { font-size: 30px; line-height: 36px; }
  .lk-post .lk-h3 .elementor-heading-title,
  .lk-post .lk-h4 .elementor-heading-title,
  .lk-post .lk-h5 .elementor-heading-title,
  .lk-post .lk-h6 .elementor-heading-title { font-size: 24px; }
  .lk-post .lk-text { font-size: 20px; line-height: 31px; letter-spacing: 0px; }
  .lk-post .lk-divider > .elementor-widget-container { padding: 20px 0px 0px 0px; } /* 33 de 66 dividers; 517 usava 40px */
  .lk-post .lk-proscontras { padding: 0px 0px 30px 0px; }
  .lk-post .lk-col-pros > .elementor-element-populated { padding: 0px 0px 0px 0px; }
  .lk-post .lk-col-contras > .elementor-element-populated { padding: 40px 0px 0px 0px; }
}
