/*
Theme Name: O Presente
Theme URI: https://www.opresente.com.br
Author: Tioni de Oliveira
Author URI: https://tioni.net
Description: Notícias — Material, mobile-first, performance.
Version: 3.3
Text Domain: opresente.com.br
*/

/* ====== Material 3 tokens (claro) mapeados para Bootstrap + fonte ====== */
:root{
  /* Material 3 */
  --m3-surface:#000;--m3-on-surface:#fff;--m3-primary:#ffcd00;--m3-on-primary:#111;--m3-border:#1f2937;
  /* Bootstrap overrides */
  --bs-body-bg:#efefef;--bs-body-color:#0f172a;--bs-primary:var(--m3-primary);--bs-primary-rgb:255,205,0;--bs-link-color:#0f172a;--bs-border-color:#e5e7eb;
  /* Fonte */
	--font-text: "PT Sans", sans-serif;
  --serif-text: "PT Serif", serif;
}
html,body{font-family:var(--font-text);background:#efefef!important}
.card{
  background-color: #ffffff;
}
cite, blockquote, cite p, blockquote p, .op-entry-content blockquote, .op-entry-content cite{
  font-family: var(--serif-text)!important;
}
.card p{

}

.lead{
  font-family:var(--serif-text);
}
.op-entry-content *{
  font-family:var(--font-text);
}
.op-entry-content blockquote, .op-entry-content cite{
  font-family:var(--serif-text);
  font-weight: bold;
  font-style: italic;
  font-size: 1.7rem!important;
}
.op-entry-content ._ning_outer::after{
	content:' ';
  display:block;
  margin-bottom:0.75em;
  clear: both;
}
/* Header escuro */
.navbar-m3{background:var(--m3-surface)!important;color:var(--m3-on-surface)!important;border-bottom:1px solid var(--m3-border)}
.navbar-m3 .nav-link,.navbar-m3 .navbar-brand{color:var(--m3-on-surface)!important;opacity:.95}
.navbar-m3 .nav-link:hover{opacity:1}

.offcanvas .nav-item{
    font-size: 1.4em;
    padding: 0.5em 0;
    border-bottom: 1px solid #333!important;
}

/* Botão ícone (Material Symbols) */
.icon-btn{width:40px;height:40px;border-radius:.5rem;display:inline-flex;align-items:center;justify-content:center;color:#fff;background:transparent;border:1px solid transparent}
.icon-btn:hover{background:rgba(255,255,255,.08)}

/* Placeholder de anúncio */
.ad-slot{display:flex;align-items:center;justify-content:center;border:1px solid #9ca3af;border-radius:.75rem;min-height:96px;color:#6b7280;background:#f8fafc}

/* Footer */
.footer-dark{ background:#222; }
.footer-dark .custom-logo{ height:40px; width:auto; }
.footer-sep{ border-color: rgba(255,255,255,.08) !important; }
.footer-badge{ width:40px;height:40px;border-radius:9999px;background:rgba(255,193,7,.15);color:#ffc107; }
.footer-dark .widget .menu{ list-style:none;margin:0;padding:0 }
.footer-dark .widget .menu li{ margin:.25rem 0 }
.footer-dark .widget .menu a{ color:rgba(255,255,255,.8); text-decoration:none }
.footer-dark .widget .menu a:hover{ color:#ffc107 }
/* Social buttons no footer */
.op-social-btn{ width:36px; height:36px; }
.op-social-btn i{ font-size:18px; line-height:1; }
.footer-dark .op-social-btn:hover{ background:#ffc107; border-color:#ffc107; color:#111; }

/* ====== Line Clamp utilities ====== */
.text-clamp-2,.text-clamp-3,.text-clamp-4{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.text-clamp-2{-webkit-line-clamp:2}.text-clamp-3{-webkit-line-clamp:3}.text-clamp-4{-webkit-line-clamp:4}
.excerpt-sm{font-size:.9rem;line-height:1.35}

/* ------------- Font metric overrides (reduz CLS) ------------- */
@font-face{font-family:'Calibri';src:local('Arial');ascent-override:92%;descent-override:22%;line-gap-override:0%;size-adjust:103%;font-display:swap}
html{font-synthesis-weight:none;font-synthesis-style:none}
.material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24}

/* Seção Podcast: fundo branco + linhas sup/inf #ddd (3px) */
.podcast-section{background:#fff;border-top:3px solid #ddd;border-bottom:3px solid #ddd}

/* Espaçamento inferior dos cards (categorias) */
.op-cat-card{margin-bottom:20px}

/* ===== Hover-zoom ===== */
.hover-zoom .ratio,.hover-zoom .media-zoom{overflow:hidden;border-radius:.5rem}
.hover-zoom img{transition:transform .35s ease;will-change:transform}
.hover-zoom:hover img{transform:scale(1.06)}

/* ===== HERO: equal height + título maior ===== */
.hero-row{align-items:stretch}
.hero-col-left{display:flex}
.hero-card{flex:1 1 auto;height:100%}
@media (min-width:992px){.hero-title{font-size:1.8rem;line-height:1.2}}

/* HERO (lista direita): mobile empilhado + ajustes desktop */
@media (max-width:575.98px){
  .hero-side .post-row .thumb-col,.hero-side .post-row .content-col{
    flex:0 0 100%;max-width:100%
  }
}
@media (min-width:992px){
/*  .hero-side .excerpt{
    font-size:.8em;line-height:1.05
  }
  .hero-side article{
    margin-bottom: 10px;
  }*/
}

/* Cards full-width no mobile (seções) */
@media (max-width:575.98px){
  .card-col{
    flex:0 0 100%!important;max-width:100%!important
  }
}

.card .position-absolute.top-0.start-0.m-2{ z-index:2; }

.colunas .badge{
  font-size: 0.70em!important;
  padding:2px!important;
}

/* duas linhas com ellipsis */
.text-truncate-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* WhatsApp widget */
.op-wa-card{ border-color:#86efac!important; background:#e8f7ee!important; }
.op-wa-card .btn-success{ background:#16a34a; border-color:#16a34a; }
.op-wa-card .btn-success:hover{ background:#128a3b; border-color:#128a3b; }

/* duas linhas com ellipsis */
.text-truncate-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* zoom suave */
.media-zoom img{transition:transform .35s ease}
.media-zoom:hover img{transform:scale(1.03)}

/* Conteúdo do post: mídia responsiva */
.op-entry-content img { max-width:100%; height:auto; }
.op-entry-content figure { margin: 0 0 1rem; }
.op-entry-content figure.aligncenter, .op-entry-content img.aligncenter { display:block; margin-left:auto; margin-right:auto; }
.op-entry-content img.alignleft  { float:left;  margin:0 1rem .5rem 0; }
.op-entry-content img.alignright { float:right; margin:0 0 .5rem 1rem; }
@media (max-width: 767.98px){
  .op-entry-content img.alignleft,
  .op-entry-content img.alignright { float:none; margin:0 0 1rem 0; }
}

/* Ranking da lista do WPP (numerado via CSS counters) */
.op-wpp-list { counter-reset: wpp; }
.op-wpp-list > li { counter-increment: wpp; }
.op-wpp-list > li .op-wpp-rank::before { content: counter(wpp); }

.titulo-post{
  
}
.nav-item{
  text-decoration: none!important;
  border:0;
}
@media (max-width: 991.98px){
  .op-share-bottom{position:fixed;left:0;right:0;bottom:0;z-index:1040;background:#000;box-shadow:0 -6px 20px rgba(0,0,0,.15);}
  .op-share-bottom .btn{flex:1 1 33.333%;border-radius:0;padding:.8rem 0;font-size:1.15rem}
  .op-share-spacer{height:64px}
  .btn-wa{background:#25D366;color:#fff}
  .btn-fb{background:#1877F2;color:#fff}
  .btn-lk{background:#6c757d;color:#fff}
}
/* Legendas */
.op-featured-caption{font-size:.9rem;color:#6c757d;margin-top:.5rem;}
.op-entry-content figure figcaption,
.op-entry-content .wp-caption .wp-caption-text{font-size:.9rem;color:#6c757d;margin-top:.35rem;}

/* Wrapper responsivo para iframes de ads */
.op-ad-fluid{position:relative;width:100%;height:auto;overflow:hidden}
.op-ad-fluid > iframe{position:absolute;inset:0;width:100%!important;height:100%!important;border:0;display:block}

/* Helpers de razão (pode criar outras conforme seus formatos) */
.op-ad-970x250::before{content:"";display:block;padding-top:17.85%} /* 250/970 * 100 */
.op-ad-600x300::before {content:"";display:block;padding-top:50%}
.op-ad-300x300::before{content:"";display:block;padding-top:100%}

._ning_hidden, ._ning_hidden *{
	opacity: 1!important;
}


/* 1) Banner do topo: se não tiver mídia dentro, some */
/* Use o(s) seletor(es) reais do seu tema aqui: */
.ads:where(:not(:has(img,video,iframe,picture))) { display: none !important; }

/* 2) _ning_outer vazias (pseudo-elemento não conta para :empty) */
._ning_outer:where(:not(:has(img,video,iframe,picture))) { display: none !important; }