/**
 * AFV Auto Pages - Namespace Isolado
 * Version: 1.0.0
 *
 * Propósito: Isolar estilos da Home Page para evitar conflitos com AFV Form
 * Todas as classes têm prefixo único 'afvap-' (AFV Auto Pages)
 *
 * IMPORTANTE: Este CSS é apenas para shortcodes da Home Page
 * Não afeta shortcodes do AFV Form (Portal, Formulários, etc)
 */

:root {
    /* Namespace único: afvap (AFV Auto Pages) */
    --afvap-primary-gradient: linear-gradient(135deg, #6366f1, #8b5cf6, #ec4899);
    --afvap-bg-surface: #ffffff;
    --afvap-text-primary: #1e293b;
    --afvap-text-secondary: #475569;
    --afvap-border-color: #e2e8f0;
    --afvap-radius-xl: 20px;
    --afvap-radius-md: 12px;
    --afvap-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

    /* Compatibilidade - mantém variáveis do AFV Form intactas */
    --afv-container-max: 1280px;
}

/* ====================================
   CLASSES ISOLADAS - HOME PAGE ONLY
   Prefixo: afvap-
==================================== */

/* Header da Home Page */
.afvap-header {
    isolation: isolate;
}

/* ====================================
   HERO - FORÇA CENTRALIZAÇÃO TOTAL
   Corrige problema de temas WordPress que aplicam text-align: left
==================================== */

/* FORÇA centralização do hero section em TODOS os contextos */
body .afv-portal-hero,
.entry-content .afv-portal-hero,
.site-content .afv-portal-hero,
#content .afv-portal-hero,
main .afv-portal-hero,
article .afv-portal-hero,
.afv-portal-hero,
.afvap-hero,
.afvap-hero-centered,
.afvap-hero-split,
.afvap-hero-minimal {
    text-align: center !important;
    isolation: isolate;
}

/* FORÇA centralização de TODOS os elementos de texto dentro do hero */
body .afv-portal-hero h1,
body .afv-portal-hero h2,
body .afv-portal-hero h3,
body .afv-portal-hero p,
.afv-portal-hero h1,
.afv-portal-hero h2,
.afv-portal-hero h3,
.afv-portal-hero p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* FORÇA centralização dos botões e features */
.afv-portal-hero .hero-features,
body .afv-portal-hero .hero-features {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Services da Home Page */
.afvap-services,
.afvap-services-cards,
.afvap-services-list,
.afvap-services-boxes {
    isolation: isolate;
}

/* Footer da Home Page */
.afvap-footer,
.afvap-footer-full,
.afvap-footer-minimal,
.afvap-footer-social {
    isolation: isolate;
}

/* ====================================
   COMPATIBILIDADE COM AFV FORM
   Classes do AFV Form NUNCA são afetadas
==================================== */

/* Preservar 100% dos estilos do AFV Form */
.afv-portal-card,
.afv-checklist-container,
.afv-form-container,
.afv-upload-container,
.afv-portal-section.afv-form,
.afv-portal-section.afv-checklist {
    /* Estilos do AFV Form 2.1.0 preservados */
    isolation: auto;
}

/* ====================================
   ANTI-CONFLITO: Garante que AFV Form prevalece
==================================== */

/* Se AFV Form e Auto Pages estiverem na mesma página */
body:has(.afv-form-container) .afvap-hero,
body:has(.afv-checklist-container) .afvap-hero {
    /* Diminui impacto visual quando ambos estão presentes */
    margin-bottom: 2rem;
}

/* ====================================
   MOBILE RESPONSIVO
==================================== */
@media (max-width: 768px) {
    .afvap-hero,
    .afvap-services {
        padding: 2rem 1.5rem !important;
    }
}

/* ====================================
   INTEGRAÇÃO PERFEITA
   Permite que elementos .afv-portal-* coexistam
==================================== */

/* Wrappers isolados */
.afvap-wrapper {
    contain: layout style;
    isolation: isolate;
}

/* Resetar apenas quando necessário */
.afvap-wrapper * {
    /* Não reseta propriedades do AFV Form */
    all: revert-layer;
}

/* ====================================
   COMENTÁRIOS PARA DESENVOLVEDORES
==================================== */

/*
 * COMO USAR:
 *
 * 1. Home Page (Landing):
 *    <section class="afvap-hero afv-portal-hero">
 *    - Usa .afvap-hero para estilos isolados
 *    - Usa .afv-portal-hero para compatibilidade
 *
 * 2. Portal (AFV Form):
 *    <section class="afv-portal-section">
 *    - Apenas classes do AFV Form
 *    - NUNCA usar prefixo .afvap- aqui
 *
 * 3. Regra de Ouro:
 *    - Home Page = .afvap-* (isolado)
 *    - Portal = .afv-* (AFV Form)
 *    - Nunca misturar os dois
 */

/* ====================================
   DEBUG MODE (remover em produção)
==================================== */

/* Destacar elementos isolados durante desenvolvimento
.afvap-header,
.afvap-hero,
.afvap-services,
.afvap-footer {
    outline: 2px dashed #6366f1;
    outline-offset: 4px;
}
*/