
/* ============================================================================
   MODERN VISUAL LAYER  -  Newspaper 12.6.7
   ----------------------------------------------------------------------------
   Camada exclusivamente estética, carregada POR CIMA do tema pelo plugin
   Newspaper Modern Layer. O tema original nao e modificado.

   Esta camada NÃO altera:
   - fontes (familia, tamanho, peso, line-height, espacamento de letras)
   - dimensoes (width, height, margin, padding, border-width)
   - posicionamento, display, float, ordem ou estrutura do DOM
   - seletores, IDs, classes, JS, PHP, hooks ou carregamento de recursos

   Usa somente: cor, background, border-color, box-shadow, border-radius,
   opacity, transition, outline e filter.
   Para desfazer: desative o plugin Newspaper Modern Layer.
   ============================================================================ */

/* ---------- 1. Tokens de cor (azul / branco / preto) ---------- */
:root {
  --tdm-white: #FFFFFF;
  --tdm-white-soft: #F8FAFC;
  --tdm-surface: #F1F5F9;
  --tdm-border: #E2E8F0;
  --tdm-border-strong: #CBD5E1;
  --tdm-muted: #64748B;
  --tdm-ink: #0B1220;
  --tdm-black: #000000;
  --tdm-blue: #2563EB;
  --tdm-blue-deep: #1D4ED8;
  --tdm-blue-soft: #DBEAFE;
  --tdm-blue-tint: #EFF6FF;
  --tdm-ring: rgba(37, 99, 235, 0.18);
  --tdm-shadow-xs: 0 1px 2px rgba(11, 18, 32, 0.05);
  --tdm-shadow-sm: 0 2px 8px rgba(11, 18, 32, 0.06);
  --tdm-shadow-md: 0 10px 30px rgba(11, 18, 32, 0.10);
  --tdm-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Reaproveita as variaveis de cor que o proprio tema ja consome.
   (Familia tipografica NAO e tocada.) */
:root:root {
  --td_theme_color: #2563EB;
  --td_black: #0B1220;
  --td_text_color: #0B1220;
  --td_grid_border_color: #E2E8F0;
  --td_header_color: #0B1220;
  --td_mobile_gradient_one_mob: #0B1220;
  --td_mobile_gradient_two_mob: #1D4ED8;
}

/* ---------- 2. Base ---------- */
body {
  color: var(--tdm-ink);
  background-color: var(--tdm-white-soft);
}
#td-outer-wrap,
.td-main-content-wrap,
.td-container-wrap {
  background-color: var(--tdm-white);
}
::selection {
  background: var(--tdm-blue-soft);
  color: var(--tdm-ink);
}
a {
  transition: color 0.2s var(--tdm-ease), background-color 0.2s var(--tdm-ease),
              border-color 0.2s var(--tdm-ease), box-shadow 0.2s var(--tdm-ease),
              opacity 0.2s var(--tdm-ease);
}
a:hover {
  color: var(--tdm-blue-deep);
}
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input[type=submit]:focus-visible {
  outline: 2px solid var(--tdm-blue);
  outline-offset: 2px;
  border-radius: 6px;
}
hr,
.wp-block-separator {
  border-color: var(--tdm-border);
}

/* ---------- 3. Header / logo ---------- */
.td-logo-text-container .td-logo-text {
  color: var(--tdm-ink);
}
.td-logo-text-container .td-tagline-text {
  color: var(--tdm-muted);
}
/* ---------- 4. Menu principal ---------- */
.sf-menu > li > a {
  color: var(--tdm-ink);
  transition: color 0.2s var(--tdm-ease);
}
.sf-menu > li > a:hover,
.sf-menu > .sfHover > a,
.sf-menu > .current-menu-item > a,
.sf-menu > .current-menu-ancestor > a,
.sf-menu > .current-category-ancestor > a {
  color: var(--tdm-blue);
}
.sf-menu > li > a:after,
.tagdiv-small-theme-menu > li > a:before {
  border-radius: 3px 3px 0 0;
}
.sf-menu > .current-menu-item > a:after,
.sf-menu > .current-menu-ancestor > a:after,
.sf-menu > .current-category-ancestor > a:after,
.sf-menu > li:hover > a:after,
.sf-menu > .sfHover > a:after,
.tagdiv-small-theme-menu > .current-menu-item > a:before,
.tagdiv-small-theme-menu > .current-menu-ancestor > a:before,
.tagdiv-small-theme-menu > .current-category-ancestor > a:before,
.tagdiv-small-theme-menu > li:hover > a:before,
.tagdiv-small-theme-menu > .sfHover > a:before {
  background-color: var(--tdm-blue);
}

/* Submenus */
.sf-menu ul,
.td-normal-menu ul,
.tagdiv-small-theme-menu .menu-item-has-children ul {
  background-color: var(--tdm-white);
  border-radius: 0 0 14px 14px;
  box-shadow: var(--tdm-shadow-md);
}
.sf-menu ul .td-menu-item > a,
.tagdiv-small-theme-menu .menu-item-has-children ul .menu-item > a {
  color: var(--tdm-ink);
  transition: color 0.18s var(--tdm-ease), background-color 0.18s var(--tdm-ease);
}
.sf-menu ul .td-menu-item > a:hover,
.sf-menu ul .sfHover > a,
.sf-menu ul .current-menu-item > a,
.tagdiv-small-theme-menu .menu-item-has-children ul .menu-item:hover > a {
  color: var(--tdm-blue-deep);
  background-color: var(--tdm-blue-tint);
}
.td-menu-badge {
  background-color: var(--tdm-blue);
  border-radius: 4px;
}

/* ---------- 5. Busca ---------- */
.header-search-wrap .td-icon-search,
.td-header-style-1 .header-search-wrap .td-icon-search {
  color: var(--tdm-ink);
  transition: color 0.2s var(--tdm-ease);
}
.header-search-wrap .td-icon-search:hover {
  color: var(--tdm-blue);
}
.td-header-wrap .td-drop-down-search {
  background-color: var(--tdm-white);
  border-radius: 0 0 14px 14px;
  -webkit-box-shadow: var(--tdm-shadow-md);
  box-shadow: var(--tdm-shadow-md);
}
.td-header-wrap #td-header-search {
  border-color: var(--tdm-border) !important;
  border-radius: 8px 0 0 8px;
}
.td-header-wrap .td-drop-down-search .btn {
  background-color: var(--tdm-ink);
  color: var(--tdm-white);
  border-radius: 0 8px 8px 0;
}
.td-header-wrap .td-drop-down-search .btn:hover {
  background-color: var(--tdm-blue);
}
.td-search-form-widget .td-widget-search-input {
  border-color: var(--tdm-border);
  border-radius: 8px 0 0 8px;
}
.td-search-form-widget .wpb_button {
  background-color: var(--tdm-ink);
  border-radius: 0 8px 8px 0;
}
.td-search-form-widget .wpb_button:hover {
  background-color: var(--tdm-blue);
}

/* ---------- 6. Formularios ---------- */
body textarea,
body input[type=text],
body input[type=url],
body input[type=tel],
body input[type=email],
body input[type=password],
body input[type=search] {
  color: var(--tdm-ink);
  background-color: var(--tdm-white);
  border-color: var(--tdm-border);
  border-radius: 8px;
  box-shadow: var(--tdm-shadow-xs);
  transition: border-color 0.2s var(--tdm-ease), box-shadow 0.2s var(--tdm-ease),
              background-color 0.2s var(--tdm-ease);
}
body textarea::placeholder,
body input::placeholder {
  color: var(--tdm-muted);
  opacity: 0.8;
}
body textarea:hover,
body input[type=text]:hover,
body input[type=url]:hover,
body input[type=tel]:hover,
body input[type=email]:hover,
body input[type=password]:hover,
body input[type=search]:hover {
  border-color: var(--tdm-border-strong);
}
body textarea:focus,
body textarea:active,
body input[type=text]:focus,
body input[type=url]:focus,
body input[type=tel]:focus,
body input[type=email]:focus,
body input[type=password]:focus,
body input[type=search]:focus,
body input[type=text]:active,
body input[type=url]:active,
body input[type=tel]:active,
body input[type=email]:active {
  border-color: var(--tdm-blue) !important;
  box-shadow: 0 0 0 4px var(--tdm-ring);
}
body select,
.widget select {
  color: var(--tdm-ink);
  background-color: var(--tdm-white);
  border-color: var(--tdm-border);
  border-radius: 8px;
}
body input[type=submit],
body .comments .comment-form .submit {
  background-color: var(--tdm-ink);
  color: var(--tdm-white);
  border-radius: 8px;
  box-shadow: var(--tdm-shadow-sm);
  transition: background-color 0.25s var(--tdm-ease), box-shadow 0.25s var(--tdm-ease);
}
body input[type=submit]:hover,
body .comments .comment-form .submit:hover {
  background-color: var(--tdm-blue);
  box-shadow: 0 6px 18px rgba(37, 99, 235, 0.28);
}

/* ---------- 7. Botoes ---------- */
.td-read-more a,
.more-link-wrap a {
  background-color: var(--tdm-blue);
  border-radius: 8px;
  box-shadow: var(--tdm-shadow-sm);
}
.td-read-more a:hover,
.more-link-wrap a:hover {
  background-color: var(--tdm-ink) !important;
  box-shadow: var(--tdm-shadow-md);
}
.td_btn {
  transition: background-color 0.25s var(--tdm-ease), box-shadow 0.25s var(--tdm-ease),
              color 0.25s var(--tdm-ease), border-color 0.25s var(--tdm-ease);
}
.wp-block-button:not(.is-style-outline) a.wp-block-button__link:not([class*="has-background"]) {
  background-color: var(--tdm-blue);
  border-radius: 8px;
}
.wp-block-button:not(.is-style-outline) a.wp-block-button__link:not([class*="has-background"]):hover {
  background-color: var(--tdm-blue-deep);
}

/* ---------- 8. Modulos / cartoes de posts ---------- */
.td-module-thumb .entry-thumb,
.td-module-thumb img {
  border-radius: 8px;
}
.td_module_wrap .entry-title a {
  color: var(--tdm-ink);
}
.td_module_wrap:hover .entry-title a,
.td_module_15 .entry-title a:hover {
  color: var(--tdm-blue);
}
.td-post-category,
.td-category a,
.td-module-meta-info .td-post-category {
  background-color: var(--tdm-blue);
  color: var(--tdm-white);
  border-radius: 6px;
}
.td-post-category:hover,
.td-category a:hover {
  background-color: var(--tdm-ink);
  opacity: 1;
}
.td-module-meta-info,
.td-post-author-name,
.td-post-author-name a,
.td-post-date,
.td-module-comments a {
  color: var(--tdm-muted);
}
.td-post-author-name a:hover,
.td-module-comments a:hover {
  color: var(--tdm-blue);
}
.td-excerpt {
  color: var(--tdm-muted);
}
.td-video-play-ico {
  border-radius: 50%;
  box-shadow: var(--tdm-shadow-md);
}

/* ---------- 9. Titulos de bloco e de pagina ---------- */
.td-page-title,
.td-page-title h1,
.td-404-title,
.td-404-sub-title {
  color: var(--tdm-ink);
}
.td-404-sub-sub-title a {
  color: var(--tdm-blue);
}
.td-404-sub-sub-title a:hover {
  color: var(--tdm-blue-deep);
}

/* ---------- 10. Breadcrumbs ---------- */
.entry-crumbs,
.entry-crumbs a {
  color: var(--tdm-muted);
}
.entry-crumbs a:hover {
  color: var(--tdm-blue);
}

/* ---------- 11. Paginacao ---------- */
.page-nav a,
.page-nav span {
  color: var(--tdm-muted);
  border-color: var(--tdm-border);
  border-radius: 8px;
  background-color: var(--tdm-white);
  transition: color 0.2s var(--tdm-ease), background-color 0.2s var(--tdm-ease),
              border-color 0.2s var(--tdm-ease), box-shadow 0.2s var(--tdm-ease);
}
.page-nav a:hover {
  color: var(--tdm-white);
  background-color: var(--tdm-blue);
  border-color: var(--tdm-blue);
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.25);
}
.page-nav .current {
  color: var(--tdm-white);
  background-color: var(--tdm-blue);
  border-color: var(--tdm-blue);
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.25);
}
.page-nav .extend,
.page-nav .pages {
  background-color: transparent;
  box-shadow: none;
}

/* ---------- 12. Post / pagina ---------- */
.td-post-content,
.td-page-content,
.tagdiv-type {
  color: var(--tdm-ink);
}
.td-post-content img,
.td-post-featured-image img,
.wp-block-image img,
.wp-caption img,
.gallery-item .gallery-icon img {
  border-radius: 12px;
}
.td-post-content a,
.td-page-content a,
.tagdiv-type a {
  color: var(--tdm-blue);
}
.td-post-content a:hover,
.td-page-content a:hover,
.tagdiv-type a:hover {
  color: var(--tdm-blue-deep);
}
.td-post-featured-image .wp-caption-text,
.wp-caption-dd,
.wp-block-image figcaption,
.gallery-item .gallery-caption {
  color: var(--tdm-muted);
}
.tagdiv-type blockquote,
.td-post-content blockquote {
  color: var(--tdm-ink);
  border-left-color: var(--tdm-blue);
}
.tagdiv-type .td_quote_box {
  background-color: var(--tdm-white-soft);
  border-left-color: var(--tdm-blue);
  border-radius: 0 12px 12px 0;
}
.tagdiv-type .td_quote_box p,
.tagdiv-type .td_quote_box cite {
  color: var(--tdm-muted);
}
.tagdiv-type .td-arrow-list li:before {
  color: var(--tdm-blue);
}
.dropcap1 {
  background-color: var(--tdm-ink);
}
.dropcap2,
.dropcap3 {
  color: var(--tdm-blue);
}
code,
pre {
  background-color: var(--tdm-surface);
  border-color: var(--tdm-border);
  color: var(--tdm-ink);
  border-radius: 8px;
}
table,
table th,
table td,
.td-post-content table,
.td-page-content table {
  border-color: var(--tdm-border);
}
table th {
  background-color: var(--tdm-surface);
  color: var(--tdm-ink);
}
.widget_calendar thead tr,
.widget_calendar th {
  background-color: var(--tdm-surface);
}
.widget_calendar #today {
  background-color: var(--tdm-blue);
  color: var(--tdm-white);
  border-radius: 6px;
}

/* ---------- 13. Tags, caixas e navegacao de post ---------- */
.td-post-small-box span {
  background-color: var(--tdm-ink);
  border-radius: 6px 0 0 6px;
}
.td-post-small-box a,
.td-tags a,
.widget_tag_cloud a,
.tagcloud a {
  color: var(--tdm-ink);
  border-color: var(--tdm-border);
  background-color: var(--tdm-white);
  border-radius: 6px;
  transition: color 0.2s var(--tdm-ease), background-color 0.2s var(--tdm-ease),
              border-color 0.2s var(--tdm-ease);
}
.td-post-small-box a:hover,
.td-tags a:hover,
.widget_tag_cloud a:hover,
.tagcloud a:hover {
  color: var(--tdm-white);
  background-color: var(--tdm-blue);
  border-color: var(--tdm-blue);
}
.td-tags span {
  background-color: var(--tdm-ink);
  border-radius: 6px;
}
.td-post-next-prev-content span {
  color: var(--tdm-muted);
}
.td-post-next-prev-content a {
  color: var(--tdm-ink);
}
.td-post-next-prev-content a:hover {
  color: var(--tdm-blue);
}
.td-post-source-tags a,
.td-post-source-via a {
  color: var(--tdm-blue);
}

/* ---------- 14. Autor ---------- */
.author-box-wrap {
  background-color: var(--tdm-white-soft);
  border-color: var(--tdm-border);
  border-radius: 14px;
  box-shadow: var(--tdm-shadow-xs);
}
.author-box-wrap .avatar,
.td-author-page .avatar {
  border-radius: 50%;
}
.td-author-name a,
.td-author-url a,
.author-box-wrap .td-author-social a {
  color: var(--tdm-ink);
}
.td-author-name a:hover,
.td-author-url a:hover,
.author-box-wrap .td-author-social a:hover {
  color: var(--tdm-blue);
}
.td-author-counters span {
  color: var(--tdm-muted);
}

/* ---------- 15. Comentarios ---------- */
.comment {
  border-bottom-color: var(--tdm-border);
}
.comment .avatar {
  border-radius: 50%;
}
.comment .children {
  border-color: var(--tdm-border);
}
.comment-link,
.comment-edit-link,
.comment-meta,
.comment-meta a {
  color: var(--tdm-muted);
}
.comment-reply-link,
.logged-in-as a,
#cancel-comment-reply-link {
  color: var(--tdm-blue);
}
.comment-reply-link:hover,
.logged-in-as a:hover,
#cancel-comment-reply-link:hover,
.comment-edit-link:hover {
  color: var(--tdm-blue-deep);
}
.comment-pagination a {
  color: var(--tdm-blue);
}

/* ---------- 16. Widgets / sidebar ---------- */
.widget a {
  color: var(--tdm-ink);
}
.widget a:hover {
  color: var(--tdm-blue);
}
.widget li,
.widget_recent_entries li,
.td_wp_recentcomments .recentcomments,
.widget_rss li,
.wp-block-latest-posts:not(.is-grid) li,
.wp-block-archives li,
.wp-block-categories li {
  border-color: var(--tdm-border);
}
.widget_recent_entries .post-date,
.widget_rss li .rssSummary,
.widget_rss cite,
.wp-block-latest-posts:not(.is-grid) .wp-block-latest-posts__post-date {
  color: var(--tdm-muted);
}
.widget_categories .td-widget-no,
.wp-block-categories .td-widget-no {
  color: var(--tdm-muted);
}

/* ---------- 17. Galerias e sliders ---------- */
.td-gallery-slide-prev-next-but,
.td-doubleSlider-1 .td-slide-item .td-slide-caption {
  border-radius: 8px;
}
.td-doubleSlider-2 .td-button,
.td-slide-on-2-columns .td-button {
  border-radius: 8px;
}

/* ---------- 18. Rodape ---------- */
.td-sub-footer-container {
  background-color: var(--tdm-ink);
  color: #94A3B8;
}
.td-subfooter-menu li a {
  color: #CBD5E1;
}
.td-subfooter-menu li a:hover {
  color: #93C5FD;
}

/* ---------- 19. Menu e busca mobile (estrutura intacta) ---------- */
@media (max-width: 767px) {
  .td-header-wrap .td-header-menu-wrap-full,
  .td-header-wrap .td-header-menu-wrap,
  .td-header-wrap .td-header-main-menu {
    background-color: var(--tdm-ink) !important;
  }
  .td-header-style-1 .header-search-wrap .td-icon-search {
    color: var(--tdm-white);
  }
}
.td-menu-background:before {
  background: linear-gradient(to bottom, var(--tdm-ink) 0%, var(--tdm-blue-deep) 100%);
}
.td-mobile-content li a {
  transition: color 0.2s var(--tdm-ease), opacity 0.2s var(--tdm-ease);
}
.td-mobile-content .current-menu-item > a,
.td-mobile-content .current-category-ancestor > a {
  color: var(--tdm-blue-soft);
}
.td-search-wrap-mob .td-search-form .td-search-input:before,
.td-search-wrap-mob .td-search-form .td-search-input:after {
  background-color: var(--tdm-blue-soft);
}

/* ---------- 20. Acessibilidade de movimento ---------- */
@media (prefers-reduced-motion: reduce) {
  a,
  .page-nav a,
  .page-nav span {
    transition: none !important;
  }
}
/* ======================= FIM DA CAMADA VISUAL MODERNA ====================== */
