/*
 * PréArte — estilos próprios do portal, carregados depois do CSS do template
 * (conforme a documentação do News5: personalizações em arquivo separado do core).
 */
:root {
    --pa-primary: #d4252a;
    --pa-surface: #ffffff;
    --pa-soft: #f4f4f6;
    --pa-text: #18181b;
    --pa-muted: rgba(0, 0, 0, .58);
    --pa-border: rgba(0, 0, 0, .12);
    --pa-ok: #178d72;
    --pa-err: #c62828;
    --pa-gold: #b8860b;
}
.uc-dark {
    --pa-surface: #1c1c1f;
    --pa-soft: #26262a;
    --pa-text: #f2f2f3;
    --pa-muted: rgba(255, 255, 255, .62);
    --pa-border: rgba(255, 255, 255, .14);
}

/* Logotipo (PréArte): versão escura no fundo claro, versão branca dentro de .uc-dark (modo escuro e rodapé) */
.uc-logo img, .uc-logo svg, img.uc-logo, svg.uc-logo { width: 120px !important; height: 30px !important; }
.pa-logo { display: inline-flex; align-items: center; }
.pa-logo img, .uc-logo .pa-logo img { width: auto !important; height: 28px !important; max-width: none; }
.footer-logo .pa-logo img { height: 34px !important; }
.pa-logo .pa-logo-escuro { display: none; }
.uc-dark .pa-logo .pa-logo-claro { display: none; }
.uc-dark .pa-logo .pa-logo-escuro { display: inline; }

/* Selos */
.pa-lock { color: var(--pa-gold); font-size: .85em; vertical-align: baseline; }
.pa-badge-premium, .pa-badge-reg, .pa-kind, .pa-kicker {
    display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 3px;
    font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; text-decoration: none;
}
.pa-kicker { background: var(--pa-primary); color: #fff !important; }
.pa-kind { background: var(--pa-soft); color: var(--pa-text); }
.pa-badge-premium { background: var(--pa-gold); color: #fff; }
.pa-badge-reg { background: var(--pa-soft); color: var(--pa-text); }
.pa-subtitle { max-width: 760px; margin-inline: auto !important; }
.pa-byline a { color: inherit; }

/* Botões do cabeçalho */
.pa-subscribe-btn { font-weight: 700; letter-spacing: .02em; }
.pa-account-btn span { font-weight: 600; }

/* Faixa de urgentes */
.pa-breaking { background: var(--pa-primary); color: #fff; font-size: 14px; padding: 8px 16px; }
.pa-breaking-label { font-weight: 800; text-transform: uppercase; background: #fff; color: var(--pa-primary); padding: 0 8px; border-radius: 2px; flex-shrink: 0; }
.pa-breaking-items { display: flex; gap: 12px; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.pa-breaking-items a { color: #fff; text-decoration: none; font-weight: 600; }
.pa-breaking-items a:hover { text-decoration: underline; }

/* Paywall */
.pa-preview { position: relative; max-height: 520px; overflow: hidden; }
.pa-preview::after { content: ""; position: absolute; inset: auto 0 0 0; height: 160px; background: linear-gradient(to bottom, transparent, var(--pa-surface)); }
.uc-dark .pa-preview::after { background: linear-gradient(to bottom, transparent, #131313); }
.pa-paywall {
    margin: 24px 0; padding: 32px 24px; text-align: center; border: 2px solid var(--pa-primary); border-radius: 8px;
    background: var(--pa-soft); display: flex; flex-direction: column; gap: 12px; align-items: center;
}
.pa-paywall p { margin: 0; max-width: 520px; }
.pa-meter { background: var(--pa-soft); border-inline-start: 3px solid var(--pa-gold); padding: 8px 12px; border-radius: 4px; }
.pa-preview-banner { background: #fff3cd; color: #6b4e00; padding: 10px 14px; border-radius: 6px; margin-bottom: 16px; font-size: 14px; }

/* Anúncios */
.pa-ad { position: relative; text-align: center; }
.pa-ad img { max-width: 100%; height: auto; margin-inline: auto; }
.pa-ad-label { display: block; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--pa-muted); margin-bottom: 4px; }
.pa-ad-wrap { margin-block: 16px; }
.pa-ad-placeholder { display: block; padding: 32px; border: 1px dashed var(--pa-border); color: var(--pa-muted); text-decoration: none; border-radius: 6px; }

/* Avisos (toasts) */
.pa-toasts { position: fixed; z-index: 100000; left: 16px; bottom: 16px; display: flex; flex-direction: column; gap: 8px; max-width: min(440px, calc(100vw - 32px)); }
.pa-toast { position: relative; padding: 12px 40px 12px 16px; border-radius: 6px; background: var(--pa-surface); color: var(--pa-text); border-inline-start: 4px solid var(--pa-ok); box-shadow: 0 8px 28px rgba(0, 0, 0, .2); font-size: 15px; line-height: 1.45; animation: pa-in .2s ease-out; }
.pa-toast a { color: var(--pa-primary); text-decoration: underline; }
.pa-toast-erro { border-inline-start-color: var(--pa-err); }
.pa-toast-x { position: absolute; top: 6px; right: 8px; border: 0; background: none; color: inherit; font-size: 20px; opacity: .6; cursor: pointer; }
@keyframes pa-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.pa-busy { opacity: .6; pointer-events: none; }

/* Busca instantânea */
.pa-suggest { margin-top: 12px; display: flex; flex-direction: column; gap: 2px; max-height: 60vh; overflow: auto; text-align: start; }
.pa-suggest a { display: flex; gap: 12px; align-items: center; padding: 8px; border-radius: 6px; color: inherit; text-decoration: none; }
.pa-suggest a:hover { background: var(--pa-soft); }
.pa-suggest img { width: 64px; height: 44px; object-fit: cover; border-radius: 4px; flex-shrink: 0; }
.pa-suggest small { display: block; color: var(--pa-muted); font-size: 12px; }
.pa-suggest-all { justify-content: center; font-weight: 700; color: var(--pa-primary) !important; }

/* Salvos */
.uc-bookmark-toggle.pa-saved, .uc-bookmark-toggle.pa-saved i { color: var(--pa-primary) !important; }
.pa-fav-list { list-style: none; padding: 0; margin: 0; text-align: start; width: 100%; display: flex; flex-direction: column; gap: 8px; }

/* Comentários */
.pa-reply-note { font-size: 14px; color: var(--pa-muted); }
.pa-link { border: 0; background: none; padding: 0; color: var(--pa-primary); text-decoration: underline; cursor: pointer; }
.pa-report { color: inherit; }

/* Planos e checkout */
.pa-plans > div { display: flex; }
.pa-plan { position: relative; flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 28px 22px; border: 1px solid var(--pa-border); border-radius: 10px; background: var(--pa-surface); }
.pa-plan-highlight { border: 2px solid var(--pa-primary); box-shadow: 0 10px 30px rgba(212, 37, 42, .12); }
.pa-plan-tag { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--pa-primary); color: #fff; font-size: 12px; font-weight: 700; padding: 2px 12px; border-radius: 12px; white-space: nowrap; }
.pa-plan-price b { font-size: 32px; }
.pa-plan-price span { color: var(--pa-muted); }
.pa-plan .btn { margin-top: auto; }
.pa-plan-summary { margin-bottom: 16px; }
.pa-benefits { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.pa-benefits i { color: var(--pa-ok); }
.pa-faq { border-bottom: 1px solid var(--pa-border); padding: 12px 0; }
.pa-faq summary { cursor: pointer; font-weight: 700; }
.pa-methods label { display: inline-flex; gap: 6px; align-items: center; padding: 8px 12px; border: 1px solid var(--pa-border); border-radius: 6px; cursor: pointer; }
.pa-code { display: block; word-break: break-all; background: var(--pa-soft); padding: 10px; border-radius: 6px; font-size: 13px; }
.pa-notice { background: var(--pa-soft); border-inline-start: 4px solid var(--pa-gold); padding: 14px 16px; border-radius: 6px; margin-bottom: 16px; }
.pa-notice-ok { border-inline-start-color: var(--pa-ok); }

/* Minha conta */
.pa-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 24px; border-bottom: 1px solid var(--pa-border); padding-bottom: 12px; }
.pa-tabs a { padding: 6px 12px; border-radius: 20px; text-decoration: none; color: inherit; font-size: 15px; }
.pa-tabs a.active, .pa-tabs a:hover { background: var(--pa-primary); color: #fff; }
.pa-account label { display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.pa-account label.hstack { flex-direction: row; }
.pa-list { padding-left: 18px; display: flex; flex-direction: column; gap: 8px; }
.pa-table-wrap { overflow-x: auto; }
.pa-chips .btn { border-radius: 16px; }

/* Enquetes */
.pa-poll { border: 1px solid var(--pa-border); border-radius: 8px; padding: 16px; margin: 20px 0; }
.pa-poll-q { font-weight: 700; }
.pa-poll-opt { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }
.pa-poll-row { display: grid; grid-template-columns: 1fr 120px 48px; gap: 8px; align-items: center; margin-bottom: 6px; font-size: 15px; }
.pa-poll-bar { height: 8px; background: var(--pa-soft); border-radius: 4px; overflow: hidden; }
.pa-poll-bar span { display: block; height: 100%; background: var(--pa-primary); }

/* Conteúdo editorial */
.post-content blockquote { border-inline-start: 4px solid var(--pa-primary); padding: 4px 0 4px 18px; margin: 24px 0; font-style: italic; font-size: 1.1em; }
.post-content .olho { font-size: 1.25em; font-weight: 700; border-block: 2px solid var(--pa-primary); padding: 12px 0; margin: 24px 0; }
.post-content img { max-width: 100%; height: auto; border-radius: 6px; }
.post-content iframe { max-width: 100%; }
.post-content h3, .post-content h2 { margin-top: 28px; margin-bottom: 12px; }

@media (max-width: 640px) {
    .pa-poll-row { grid-template-columns: 1fr 80px 44px; }
    .pa-plan { padding: 22px 16px; }
}

/* Botão contornado com bom contraste nos dois temas */
.pa-btn-outline { border: 1px solid var(--pa-text) !important; color: var(--pa-text) !important; background: transparent; }
.pa-btn-outline:hover { background: var(--pa-text) !important; color: var(--pa-surface) !important; }

/* Lista de comentários */
#comentarios ol { list-style: none; padding-left: 0; }
#comentarios ol ol { padding-left: 48px; margin-top: 16px; }
#comentarios li { margin-bottom: 20px; }
#comentarios .avatar { float: left; margin-right: 12px; }
#comentarios .avatar img { width: 48px !important; height: 48px !important; border-radius: 50%; object-fit: cover; }
#comentarios .comment { margin-left: 60px; }

/* ---------------------------------------------------------------- Formulários do painel */
.pa-form-box { display: flex; flex-direction: column; gap: 14px; }
.pa-form, .post-content .pa-form-box { border: 1px solid var(--pa-border); border-radius: 10px; padding: 20px; margin: 24px 0; }
.pa-dyn-form { display: flex; flex-direction: column; gap: 16px; }
.pa-ff-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.pa-ff { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pa-ff-inteira { grid-column: 1 / -1; }
.pa-ff fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.pa-choice { display: flex; gap: 8px; align-items: flex-start; font-size: 15px; cursor: pointer; }
.pa-choice input { margin-top: 3px; }
.pa-help { color: var(--pa-muted); font-size: 13px; }
.pa-ff-error { color: var(--pa-err); font-size: 13px; font-weight: 600; }
.pa-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pa-form-intro p { margin-bottom: 8px; }
@media (max-width: 640px) { .pa-ff-grid { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------- Redes sociais */
.pa-sicon { display: inline-block; vertical-align: middle; }
.footer-social .pa-sicon { width: 22px; height: 22px; }
.footer-social .nav-x, .social-icons { flex-wrap: wrap; }

/* ---------------------------------------------------------------- Divulgação: carrossel */
.pa-promo { --pa-promo: #e3262f; padding: 32px 0; background: #0f0f10; color: #fff; }
.pa-promo .container { padding-inline: 16px; }
.pa-promo-head { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-bottom: 16px; }
.pa-promo-logo { height: 34px; width: auto; display: block; }
.pa-promo-sum { color: rgba(255, 255, 255, .75); flex: 1; min-width: 220px; }
.pa-promo-cta { color: #fff; background: var(--pa-promo); padding: 8px 16px; border-radius: 20px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.pa-promo-cta:hover { filter: brightness(1.1); color: #fff; }
.pa-promo-swiper { border-radius: 12px; overflow: hidden; }
.pa-slide { position: relative; display: block; aspect-ratio: 21 / 9; color: #fff; text-decoration: none; }
.pa-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pa-slide-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .78) 0%, rgba(0, 0, 0, .35) 55%, transparent 100%); }
.pa-slide-caption { position: absolute; left: 0; bottom: 0; top: 0; display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 24px 48px 24px 84px; max-width: 700px; }
.pa-slide-caption strong { font-size: clamp(22px, 3vw, 38px); line-height: 1.15; }
.pa-slide-caption span { font-size: clamp(14px, 1.4vw, 18px); color: rgba(255, 255, 255, .88); }
.pa-slide-caption em { color: #fff !important; font-style: normal; align-self: flex-start; background: var(--pa-promo); padding: 8px 16px; border-radius: 20px; font-weight: 700; font-size: 15px; }
.pa-promo-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .9); color: #111; font-size: 26px; line-height: 1; cursor: pointer; }
.pa-promo-prev { left: 12px; } .pa-promo-next { right: 12px; }
.pa-promo-dots { display: flex; justify-content: center; gap: 6px; margin-top: 12px; }
.pa-promo-dots .swiper-pagination-bullet { background: rgba(255, 255, 255, .5); opacity: 1; width: 8px; height: 8px; border-radius: 4px; transition: width .2s; }
.pa-promo-dots .swiper-pagination-bullet-active { background: var(--pa-promo); width: 22px; }
.pa-promo-inline .pa-promo { border-radius: 12px; margin: 32px 0; }
.pa-promo-inline .container { max-width: 100% !important; }
@media (max-width: 640px) {
    .pa-slide { aspect-ratio: 4 / 5; }
    .pa-slide-shade { background: linear-gradient(0deg, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .35) 60%, transparent 100%); }
    .pa-slide-caption { top: auto; padding: 20px; }
    .pa-promo-nav { display: none; }
}

/* ---------------------------------------------------------------- Parceiros (Conheça também) */
.pa-partners { padding: 32px 0 40px; background: var(--pa-soft); }
.pa-partners .container { padding-inline: 16px; }
.pa-partners-title { text-transform: uppercase; letter-spacing: .08em; color: var(--pa-muted); }
.pa-partner { --pa-promo: #333; height: 100%; display: flex; flex-direction: column; gap: 12px; padding: 20px; border-radius: 10px; background: var(--pa-surface); border: 1px solid var(--pa-border); border-top: 4px solid var(--pa-promo); }
.pa-partner-top { display: flex; align-items: center; gap: 12px; }
.pa-partner-logo { height: 44px; max-width: 150px; width: auto; object-fit: contain; background: var(--pa-promo); padding: 6px 10px; border-radius: 8px; }
.pa-partner-links { margin-top: auto; display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; }
.pa-partner-btn { background: var(--pa-promo); color: #fff !important; border: 0; }
.pa-partner-btn:hover { filter: brightness(1.12); }
.pa-partner-link { font-size: 14px; color: var(--pa-text); text-decoration: underline; }

.pa-ff select.form-select { height: 40px; min-height: 0; padding: 6px 36px 6px 12px; font-size: 15px; }

/* Cabeçalho: evita quebra de linha quando há muitos itens (redes ficam no rodapé e no menu lateral) */
.uc-navbar-nav { flex-wrap: nowrap; white-space: nowrap; }
.uc-navbar-right .pa-head-social, .uc-navbar-right .vr { display: none !important; }
@media (max-width: 1199px) { .uc-navbar-nav > li:nth-child(n+5) { display: none !important; } }

/* Barra dos sites da rede (PréArte, Coxia, VerticalFlix, Convertes, Chanzo), igual nos sites da rede */
.pa-rede { background: #17100f; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 13px; position: relative; z-index: 3; }
.pa-rede ul { display: flex; align-items: center; gap: 20px; max-width: 1248px; margin: 0 auto; padding: 0 16px; list-style: none; overflow-x: auto; scrollbar-width: none; }
.pa-rede a { display: flex; align-items: center; min-height: 32px; color: rgba(243,237,234,.75); text-decoration: none; white-space: nowrap; }
.pa-rede a:hover, .pa-rede a[aria-current="page"] { color: #f3edea; }
.pa-rede a[aria-current="page"] { font-weight: 600; }
.pa-rede a:focus-visible { outline: 2px solid #f3edea; outline-offset: 2px; }

/* QR Code do PIX no checkout */
.pa-pix-qr { display: block; width: 220px; height: 220px; margin: 8px 0; background: #fff; padding: 8px; border-radius: 8px; image-rendering: pixelated; }
