/**
 * ALINHAMENTO DE TEXTO GLOBAL E LAYOUT
 * Blog Tec Perifa
 * 
 * REGRA GERAL:
 * - Todos os títulos, subtítulos, headings = text-align: left
 * - Apenas parágrafos (<p>) = text-align: justify
 * - Max-width sempre 100% para containers principais
 * 
 * SISTEMA DE NAMESPACES (CSS Architecture v2.0):
 * - .u-*                → Utilitários globais (utilities)
 * - .u-text-*           → Alinhamento de texto
 * - .u-mt-*, .u-mb-*    → Espaçamento (margin top/bottom)
 * 
 * IMPORTANTE: Este é um arquivo de UTILITÁRIOS GLOBAIS.
 * Classes aqui podem ser usadas tanto no admin quanto no blog público.
 */

/* ========================================
   LARGURA MÁXIMA - 100% APENAS EM MOBILE/TABLET
   ======================================== */

/* Desktop: Permitir que o grid funcione corretamente */
@media (min-width: 1024px) {
    .conteudoTemaY,
    .conteudoTema1,
    article.conteudoTemaY,
    article.conteudoTema1,
    #featured-posts-container,
    article#featured-posts-container {
        width: auto !important;
        box-sizing: border-box !important;
    }
}

/* Mobile/Tablet: Forçar 100% da largura quando sidebar está oculta */
@media (max-width: 1023px) {
    .conteudoTemaY,
    .conteudoTema1,
    article.conteudoTemaY,
    article.conteudoTema1,
    #featured-posts-container,
    article#featured-posts-container {
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* ========================================
   BADGES DE CATEGORIA - PERMITIR QUEBRA DE LINHA
   ======================================== */

.post-card-category,
.recent-post-category,
.featured-post-category,
.admin-category-badge,
.post-category-badge,
[class*="category-"],
#post-category-label {
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

/* ========================================
   TÍTULOS E HEADINGS - SEMPRE LEFT
   ======================================== */

h1, h2, h3, h4, h5, h6 {
    text-align: left !important;
}

/* Classes de títulos */
.title,
.titulo,
.heading,
.recent-posts-title,
.featured-category-title,
.category-title,
.post-title,
.recent-post-title,
.section-title,
.page-title,
.card-title,
.box-title,
[class*="title"],
[class*="titulo"],
[class*="heading"] {
    text-align: left !important;
}

/* IDs de títulos */
#post-title,
#page-title,
[id*="title"],
[id*="titulo"] {
    text-align: left !important;
}

/* Títulos dentro de containers específicos */
article h1,
article h2,
article h3,
article h4,
article h5,
article h6,
.conteudoBox h1,
.conteudoBox h2,
.conteudoBox h3,
.conteudoBox h4,
.conteudoBox h5,
.conteudoBox h6 {
    text-align: left !important;
}

/* ========================================
   PARÁGRAFOS - SEMPRE JUSTIFY
   ======================================== */

p {
    text-align: justify !important;
}

/* Parágrafos dentro de posts */
.post-content p,
.materia p,
article p,
.conteudoBox p {
    text-align: justify !important;
}

/* ========================================
   EXCEÇÕES - Elementos que devem ser CENTER
   ======================================== */

/* Estados de loading, erro, vazio */
.loading,
.loading-state,
.empty-state,
.error-state,
.no-content,
.loading p,
.loading-state p,
.empty-state p,
.error-state p,
.no-content p {
    text-align: center !important;
}

/* Botões e links de ação */
.lerMais,
.read-more,
.btn,
button {
    text-align: center !important;
}

/* Footer e copyright - Parágrafos também são justify */
footer p,
.copyright p {
    text-align: justify !important;
}

/* Footer container pode ser center para alinhar elementos */
footer,
.copyright {
    text-align: center !important;
}

/* Hero sections - Container e títulos center, mas parágrafos justify */
.hero,
.hero h1,
.hero h2,
#hero-section,
#hero-section h1,
#hero-section h2 {
    text-align: center !important;
}

.hero p,
#hero-section p {
    text-align: justify !important;
}

/* Stats e cards de estatísticas - Container e títulos center, mas parágrafos justify */
.stat-card,
.stat-card h3,
.stats-summary {
    text-align: center !important;
}

.stat-card p {
    text-align: justify !important;
}

/* Upload areas - Container center, mas parágrafos justify */
.upload-area {
    text-align: center !important;
}

.upload-area p {
    text-align: justify !important;
}

/* Social share title */
.social-share-section h3 {
    text-align: center !important;
}

/* ========================================
   EXCEÇÕES - Elementos que devem ser LEFT
   (não justify, mesmo sendo <p>)
   ======================================== */

/* Parágrafos de metadata, autor, data - Agora também justify */
.post-meta p,
.post-author p,
.post-date p,
.meta-item p {
    text-align: justify !important;
}

/* Elementos de metadata que não são parágrafos - Podem ser left */
.autor,
.data {
    text-align: left !important;
}

/* Parágrafos dentro de badges, labels - Agora também justify */
.badge p,
.label p,
.tag p {
    text-align: justify !important;
}

/* ========================================
   MOBILE - MANTER AS MESMAS REGRAS
   ======================================== */

@media (max-width: 1023px) {
    h1, h2, h3, h4, h5, h6,
    .title,
    .titulo,
    .heading,
    [class*="title"],
    [class*="titulo"] {
        text-align: left !important;
    }
    
    p {
        text-align: justify !important;
    }
    
    /* Exceções mobile */
    .loading,
    .loading-state,
    .empty-state,
    .error-state,
    .no-content,
    .loading p,
    .empty-state p,
    .error-state p,
    .no-content p {
        text-align: center !important;
    }
}

/* ========================================
   CORREÇÕES ESPECÍFICAS
   ======================================== */

/* Featured category title - CENTRO (exceção visual) */
.featured-category-title {
    text-align: center !important;
}

/* Featured category header - CENTRO (exceção visual) */
.featured-category-header {
    text-align: center !important;
}

/* Category title na sidebar - CENTRO (exceção visual) */
.category-title,
h4.category-title,
.category-group .category-title {
    text-align: center !important;
}

/* Social share section title */
.social-share-title {
    text-align: center !important;
}

/* ========================================
   PRINT
   ======================================== */

@media print {
    h1, h2, h3, h4, h5, h6 {
        text-align: left !important;
    }
    
    p {
        text-align: justify !important;
    }
}


