/*
Theme Name: Gama Blog
Theme URI: https://blog.gamaterapiasintegradas.com
Description: Child theme do Astra para o blog da Gama Terapias Integradas. Integra visualmente o blog com o site principal.
Author: Gabriel Melgar
Author URI: https://gamaterapiasintegradas.com
Template: astra
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: gama-blog
*/

/* ============================================
   GAMA TERAPIAS BLOG - CSS CUSTOMIZADO
   Estilo integrado com o site principal
   ============================================ */

/* ============================================
   1. LAYOUT GLOBAL - Conteudo + Sidebar
   ============================================ */
.ast-container {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* Layout flexbox: conteudo + sidebar (post individual) */
.ast-single-post .site-content > .ast-container {
  display: flex !important;
  gap: 48px !important;
  align-items: flex-start !important;
}

/* Conteudo principal ~70% */
#primary,
.ast-primary-content {
  flex: 1 !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Sidebar ~30% */
#secondary,
.widget-area,
.sidebar-main {
  width: 320px !important;
  min-width: 320px !important;
  position: sticky !important;
  top: 100px !important;
}

/* ============================================
   1B. SIDEBAR STYLING
   ============================================ */
#secondary .widget,
.widget-area .widget {
  background: #ffffff !important;
  border-radius: 10px !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

#secondary .widget-title,
.widget-area .widget-title {
  font-family: 'Inter', sans-serif !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: #1a1a2e !important;
  margin-bottom: 16px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid #00A3D6 !important;
  text-transform: none !important;
}

/* Posts recentes na sidebar */
#secondary .widget_recent_entries ul,
#secondary .wp-block-latest-posts__list {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 0 !important;
}

#secondary .widget_recent_entries li,
#secondary .wp-block-latest-posts__list li {
  margin-bottom: 0 !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

#secondary .widget_recent_entries li:first-child,
#secondary .wp-block-latest-posts__list li:first-child {
  padding-top: 0 !important;
}

#secondary .widget_recent_entries li:last-child,
#secondary .wp-block-latest-posts__list li:last-child {
  border-bottom: none !important;
  padding-bottom: 0 !important;
}

#secondary .widget_recent_entries a,
#secondary .wp-block-latest-posts__list a {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  color: #1a1a2e !important;
  text-decoration: none !important;
  line-height: 1.4 !important;
  display: block !important;
  transition: color 0.2s ease !important;
}

#secondary .widget_recent_entries a:hover,
#secondary .wp-block-latest-posts__list a:hover {
  color: #00A3D6 !important;
}

/* Sidebar - thumbnails */
#secondary .wp-block-latest-posts__featured-image {
  margin-bottom: 8px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

#secondary .wp-block-latest-posts__featured-image img {
  border-radius: 8px !important;
  margin-bottom: 0 !important;
  width: 100% !important;
  height: 140px !important;
  object-fit: cover !important;
  transition: transform 0.3s ease !important;
}

#secondary .wp-block-latest-posts__list li:hover img {
  transform: scale(1.03) !important;
}

/* Sidebar - categorias */
#secondary .widget_categories ul {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 0 !important;
}

#secondary .widget_categories li {
  margin-bottom: 0 !important;
}

#secondary .widget_categories li a {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.875rem !important;
  color: #374151 !important;
  text-decoration: none !important;
  display: flex !important;
  justify-content: space-between !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
  transition: color 0.2s ease !important;
}

#secondary .widget_categories li:last-child a {
  border-bottom: none !important;
}

#secondary .widget_categories li a:hover {
  color: #00A3D6 !important;
}

/* ============================================
   2. TIPOGRAFIA - Inter (igual ao site principal)
   ============================================ */
body,
body.flavor-flavor p,
.entry-content p,
.entry-content li,
.entry-content {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: #374151 !important;
  letter-spacing: -0.01em;
}

/* ============================================
   3. HEADINGS
   ============================================ */
h1, h2, h3, h4, h5, h6,
.entry-title,
.entry-content h1,
.entry-content h2,
.entry-content h3 {
  font-family: 'Inter', sans-serif !important;
  color: #1a1a2e !important;
  letter-spacing: -0.02em;
}

h1.entry-title,
.entry-title {
  font-size: 2rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  margin-bottom: 12px !important;
  color: #1a1a2e !important;
}

.entry-content h2 {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  margin-top: 40px !important;
  margin-bottom: 16px !important;
  padding-bottom: 0 !important;
  border-bottom: none !important;
  color: #1a1a2e !important;
}

.entry-content h3 {
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  margin-top: 28px !important;
  margin-bottom: 10px !important;
  color: #2d2d4e !important;
}

/* ============================================
   4. PARAGRAFOS E LISTAS
   ============================================ */
.entry-content p {
  margin-bottom: 1.4em !important;
}

.entry-content ul,
.entry-content ol {
  margin-left: 1.2em !important;
  margin-bottom: 1.4em !important;
  padding-left: 0.5em !important;
}

.entry-content ul li,
.entry-content ol li {
  margin-bottom: 0.5em !important;
  padding-left: 0.3em !important;
  line-height: 1.7 !important;
}

.entry-content ul li::marker {
  color: #00A3D6 !important;
}

.entry-content ol li::marker {
  color: #00A3D6 !important;
  font-weight: 700 !important;
}

/* ============================================
   5. LINKS
   ============================================ */
.entry-content a {
  color: #00A3D6 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  transition: color 0.2s ease !important;
}

.entry-content a:hover {
  color: #007A9F !important;
  text-decoration: underline !important;
}

/* ============================================
   6. IMAGENS
   ============================================ */
.entry-content img,
.wp-post-image {
  border-radius: 8px !important;
  margin-top: 12px !important;
  margin-bottom: 20px !important;
  width: 100% !important;
  height: auto !important;
}

.entry-content figure {
  margin-bottom: 28px !important;
}

.entry-content figcaption {
  font-size: 0.8rem !important;
  color: #9ca3af !important;
  text-align: center !important;
  margin-top: 6px !important;
  font-style: italic !important;
}

/* ============================================
   7. FEATURED IMAGE
   ============================================ */
.ast-article-post .post-thumb-img-content,
.ast-article-single .post-thumb-img-content {
  border-radius: 10px !important;
  overflow: hidden !important;
  margin-bottom: 28px !important;
}

.ast-article-post .post-thumb-img-content img,
.ast-article-single .post-thumb-img-content img,
.post-thumb img,
.wp-post-image {
  width: 100% !important;
  height: auto !important;
  max-height: 480px !important;
  object-fit: cover !important;
}

/* ============================================
   8. POST META (autor, data)
   ============================================ */
.entry-meta,
.entry-meta * {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.8rem !important;
  color: #9ca3af !important;
}

.entry-meta a {
  color: #9ca3af !important;
  text-decoration: none !important;
}

.entry-meta a:hover {
  color: #00A3D6 !important;
}

.entry-meta .posted-on,
.entry-meta .byline {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

/* ============================================
   9. BLOCKQUOTES
   ============================================ */
.entry-content blockquote {
  background: #f8fafc !important;
  border-left: 4px solid #00A3D6 !important;
  border-radius: 0 8px 8px 0 !important;
  padding: 20px 24px !important;
  margin: 28px 0 !important;
  font-style: italic !important;
  color: #374151 !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
}

.entry-content blockquote p {
  margin-bottom: 0 !important;
  color: #374151 !important;
}

/* ============================================
   10. CTA BOX
   ============================================ */
.wp-block-group.has-background,
.entry-content .wp-block-cover {
  border-radius: 10px !important;
  overflow: hidden !important;
}

.cta-box {
  background: linear-gradient(135deg, #00A3D6, #007A9F) !important;
  border-radius: 10px !important;
  padding: 36px 32px !important;
  text-align: center !important;
  margin: 40px 0 !important;
}

.cta-box h3,
.cta-box p {
  color: #ffffff !important;
}

.cta-box a.cta-button,
.wp-block-button .wp-block-button__link {
  display: inline-block !important;
  background: #FF6E7C !important;
  color: #ffffff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  padding: 12px 32px !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}

.cta-box a.cta-button:hover,
.wp-block-button .wp-block-button__link:hover {
  background: #ff5264 !important;
  transform: translateY(-2px) !important;
}

/* ============================================
   11. HEADER - Estilo do site principal (h-20 = 80px)
   ============================================ */
.ast-primary-header-bar,
.ast-header-break-point .ast-primary-header-bar {
  background: rgba(255, 255, 255, 0.70) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
  border-bottom: 1px solid rgba(15, 23, 42, 0.1) !important;
  min-height: 80px !important;
  height: 80px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Header container = max-w-7xl (1280px) + px-8 (32px) do site principal */
.ast-primary-header-bar .ast-builder-grid-row {
  max-width: 1280px !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
  margin: 0 auto !important;
}

/* Centralizar verticalmente todo conteudo do header */
.ast-primary-header-bar .site-primary-header-wrap,
.ast-primary-header-bar .ast-builder-grid-row,
.ast-primary-header-bar .ast-builder-grid-row .ast-builder-layout-element,
.ast-primary-header-bar .ast-flex,
.site-header-primary-section-left,
.site-header-primary-section-center,
.site-header-primary-section-right {
  min-height: 80px !important;
  height: 80px !important;
  align-items: center !important;
  display: flex !important;
}

/* Espaco entre items do menu - igual ao site principal */
.main-header-menu {
  display: flex !important;
  align-items: center !important;
}

.main-header-menu > .menu-item {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 80px !important;
}

/* Padding nos links controla o espacamento real entre itens */
.main-header-menu .menu-item > .menu-link {
  padding-left: 16px !important;
  padding-right: 16px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: 0.875rem !important;
}

.ast-header-break-point .ast-mobile-header-wrap .ast-primary-header-bar {
  background: rgba(255, 255, 255, 0.70) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

/* Menu items - tamanho igual ao site principal */
.main-header-menu a,
.ast-header-break-point .main-header-menu a {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: #334155 !important;
  text-decoration: none !important;
  text-transform: none !important;
  transition: color 0.2s ease !important;
}

.main-header-menu a:hover,
.ast-header-break-point .main-header-menu a:hover {
  color: #00A3D6 !important;
}

/* Pagina atual NAO deve ter destaque */
.main-header-menu .current-menu-item > a,
.main-header-menu .current_page_item > a {
  color: #334155 !important;
}

.main-header-menu .current-menu-item > a:hover,
.main-header-menu .current_page_item > a:hover {
  color: #00A3D6 !important;
}

/* Logo */
.ast-site-title-wrap a {
  font-family: 'Inter', sans-serif !important;
  color: #1a1a2e !important;
  font-weight: 700 !important;
}

.custom-logo {
  max-height: 40px !important;
  width: auto !important;
  max-width: 180px !important;
}

/* Header CTA button - pill shape igual ao site principal */
.ast-header-button-1 .ast-custom-button,
.ast-header-cta-button-1,
.ast-builder-button-wrap .ast-custom-button {
  background: #00A3D6 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 500px !important;
  padding: 10px 24px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 4px 15px rgba(0, 163, 214, 0.2) !important;
}

.ast-header-button-1 .ast-custom-button:hover,
.ast-header-cta-button-1:hover,
.ast-builder-button-wrap .ast-custom-button:hover {
  background: #007A9F !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(0, 163, 214, 0.3) !important;
}

/* ============================================
   12. FOOTER
   ============================================ */
.site-footer,
.ast-footer-overlay {
  background: #0F1419 !important;
  color: #94a3b8 !important;
}

.site-footer a {
  color: #00A3D6 !important;
  transition: color 0.2s ease !important;
}

.site-footer a:hover {
  color: #4DD0E1 !important;
}

.site-footer .ast-footer-copyright {
  color: #64748b !important;
  font-size: 0.8rem !important;
}

/* ============================================
   13. BACKGROUND E CORES GERAIS
   ============================================ */
body {
  background-color: #ffffff !important;
}

.site-content {
  background-color: #ffffff !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 40px 32px !important;
}

/* ============================================
   14. TABELA DE CONTEUDOS (Rank Math TOC)
   ============================================ */
.wp-block-rank-math-toc-block,
.rank-math-toc-block {
  background: #f8fafc !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  padding: 20px 24px !important;
  margin-bottom: 32px !important;
}

.wp-block-rank-math-toc-block h2,
.rank-math-toc-block h2 {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #1a1a2e !important;
  border-bottom: none !important;
  margin-top: 0 !important;
  margin-bottom: 10px !important;
  padding-bottom: 0 !important;
}

.wp-block-rank-math-toc-block a,
.rank-math-toc-block a {
  color: #00A3D6 !important;
  text-decoration: none !important;
  font-size: 0.875rem !important;
}

.wp-block-rank-math-toc-block a:hover,
.rank-math-toc-block a:hover {
  text-decoration: underline !important;
}

/* ============================================
   15. BLOG LISTING PAGE (homepage)
   ============================================ */
/* Posts sem card/caixa - layout limpo */
.ast-separate-container .ast-article-post {
  background: transparent !important;
  border-radius: 0 !important;
  border: none !important;
  border-bottom: 1px solid #e5e7eb !important;
  padding: 0 0 32px 0 !important;
  margin-bottom: 32px !important;
  box-shadow: none !important;
}

.ast-separate-container .ast-article-post:last-child {
  border-bottom: none !important;
}

.ast-separate-container .ast-article-post .entry-title a {
  font-family: 'Inter', sans-serif !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  color: #1a1a2e !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.ast-separate-container .ast-article-post .entry-title a:hover {
  color: #00A3D6 !important;
}

/* Category tags */
.cat-links a {
  background: #e0f2fe !important;
  color: #00A3D6 !important;
  padding: 3px 10px !important;
  border-radius: 6px !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.cat-links a:hover {
  background: #00A3D6 !important;
  color: #ffffff !important;
}

/* ============================================
   16. SEPARADOR HORIZONTAL
   ============================================ */
.entry-content hr {
  border: none !important;
  border-top: 1px solid #e5e7eb !important;
  margin: 32px 0 !important;
}

/* ============================================
   17. RESPONSIVO - MOBILE
   ============================================ */
@media (max-width: 921px) {
  .ast-single-post .site-content > .ast-container {
    flex-direction: column !important;
  }

  #secondary,
  .widget-area,
  .sidebar-main {
    width: 100% !important;
    min-width: 100% !important;
    position: static !important;
    margin-top: 32px !important;
  }

  .ast-container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .site-content {
    padding: 20px 16px !important;
  }

  h1.entry-title,
  .entry-title {
    font-size: 1.5rem !important;
  }

  .entry-content h2 {
    font-size: 1.25rem !important;
    margin-top: 32px !important;
  }

  .entry-content h3 {
    font-size: 1.05rem !important;
  }

  body,
  .entry-content p,
  .entry-content li,
  .entry-content {
    font-size: 15px !important;
  }

  .cta-box {
    padding: 24px 16px !important;
    margin: 28px 0 !important;
  }
}

/* ============================================
   18. SCROLL SUAVE
   ============================================ */
html {
  scroll-behavior: smooth !important;
}

/* ============================================
   19. SELECAO DE TEXTO
   ============================================ */
::selection {
  background: #00A3D6 !important;
  color: #ffffff !important;
}