/* ============================================================
   RESPONSIVE.CSS — Amor que Permanece
   Mobile-first: 320px → 480px → 768px → 992px → 1200px
   ============================================================ */

/* ============================================================
   VARIÁVEIS GLOBAIS
   ============================================================ */
:root {
    --red:    #C0392B;
    --gold:   #C9A84C;
    --dark:   #2C0A0A;
    --cream:  #FFF8F4;
    --rose:   #FDF0F0;
    --text:   #3D1515;
}

/* ============================================================
   BASE — evita overflow horizontal em qualquer tela
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html {
    overflow-x: hidden;
    scroll-behavior: smooth;
}
body {
    overflow-x: hidden;
    min-width: 320px;
}
img, video, iframe {
    max-width: 100%;
    height: auto;
}
table {
    width: 100%;
}

/* ============================================================
   HEADER / NAVBAR — responsivo
   ============================================================ */

/* Mobile: logo menor, menu hamburguer */
@media (max-width: 767px) {
    .aqp-header {
        padding: .4rem 0 !important;
    }
    .aqp-header-row {
        padding: 0 .75rem !important;
        min-height: 58px !important;
        gap: .5rem !important;
    }
    .aqp-logo-img {
        max-height: 48px !important;
        max-width: 160px !important;
    }
    .aqp-logo-script { font-size: 1.2rem !important; }
    .aqp-logo-serif  { font-size: .9rem !important; letter-spacing: 1px !important; }
    .aqp-logo-heart, .aqp-logo-heart-bg { width: 42px !important; height: 42px !important; }
    .aqp-logo-heart-bg i { font-size: 1.1rem !important; }

    /* O menu box é controlado pelo CSS inline do header.php com !important */
    /* NÃO sobrescrever aqui para não conflitar */

    .aqp-toggler { display: block !important; }
    .aqp-header-social { display: none !important; }
    .aqp-search input { width: 80px !important; }
    .aqp-btn-entrar { display: none !important; }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 991px) {
    .aqp-header-row { padding: 0 1.25rem !important; gap: .75rem !important; }
    .aqp-logo-script { font-size: 1.5rem !important; }
    .aqp-logo-serif  { font-size: 1.1rem !important; }
    .aqp-menu li a   { padding: .6rem .7rem !important; font-size: .85rem !important; }
    .aqp-search-box input { width: 80px !important; }
}

/* ============================================================
   HERO — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-hero { min-height: 55vh !important; }
    .aqp-hero h1 {
        font-size: 1.7rem !important;
        line-height: 1.25 !important;
    }
    .aqp-hero-content { padding: 2.5rem 0 1.5rem !important; }
    .aqp-hero-btn {
        padding: .65rem 1.6rem !important;
        font-size: .88rem !important;
    }
}
@media (max-width: 480px) {
    .aqp-hero { min-height: 50vh !important; }
    .aqp-hero h1 { font-size: 1.45rem !important; }
}

/* ============================================================
   CONTADOR — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-countdown-inner { gap: .75rem !important; }
    .aqp-countdown-num   { font-size: 2rem !important; }
    .aqp-countdown-lbl   { font-size: .7rem !important; }
    .aqp-countdown-dot   { font-size: 1.4rem !important; }
    .aqp-countdown-bar   { padding: 1rem 0 !important; }
}
@media (max-width: 380px) {
    .aqp-countdown-num { font-size: 1.6rem !important; }
    .aqp-countdown-dot { font-size: 1.1rem !important; }
}

/* ============================================================
   SEÇÃO DO EVENTO — responsivo
   ============================================================ */
@media (max-width: 991px) {
    .aqp-evento-section { padding: 2.5rem 0 3rem !important; }
}
@media (max-width: 767px) {
    /* Card do evento: coluna única */
    .aqp-evento-section .row.g-0 { flex-direction: column !important; }
    .aqp-evento-section .col-lg-6 { width: 100% !important; }

    /* Coluna de info */
    .aqp-evento-section .col-lg-6:first-child {
        padding: 1.5rem !important;
    }

    /* Foto + mapa empilhados */
    .aqp-evento-section .col-lg-6:last-child {
        min-height: auto !important;
    }
    .aqp-evento-section .col-lg-6:last-child > div:first-child {
        min-height: 200px !important;
    }

    /* Preço e botões */
    .aqp-evento-section [style*="font-size:1.8rem"] {
        font-size: 1.4rem !important;
    }
    .aqp-evento-section [style*="flex:1;min-width:160px"] {
        min-width: 100% !important;
    }
}
@media (max-width: 480px) {
    .aqp-evento-section .col-lg-6:first-child { padding: 1.25rem !important; }
    .aqp-ornament-line { max-width: 40px !important; }
    .aqp-evento-title  { font-size: 1.4rem !important; }
}

/* ============================================================
   GALERIA — responsivo
   ============================================================ */
@media (max-width: 767px) {
    /* Grid de 1 foto: layout vertical */
    .aqp-evento-section + section [style*="grid-template-columns:1fr 1fr"],
    section [style*="grid-template-columns:1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }

    /* Grid masonry */
    .aqp-gallery-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
}
@media (max-width: 480px) {
    .aqp-gallery-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 6px !important;
    }
}

/* ============================================================
   DEPOIMENTOS — responsivo
   ============================================================ */
@media (max-width: 767px) {
    section [style*="grid-template-columns:repeat(auto-fill,minmax(300px"] {
        grid-template-columns: 1fr !important;
    }
}

/* ============================================================
   BLOG — responsivo
   ============================================================ */
@media (max-width: 767px) {
    section [style*="grid-template-columns:repeat(auto-fill,minmax(300px"] {
        grid-template-columns: 1fr !important;
    }
    article [style*="height:200px"] { height: 160px !important; }
}

/* ============================================================
   FOOTER — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-footer .row { flex-direction: column !important; }
    .aqp-footer .col-md-4,
    .aqp-footer .col-md-2,
    .aqp-footer .col-md-3 {
        width: 100% !important;
        padding-bottom: 1.5rem !important;
    }
    .aqp-footer-brand { font-size: 1.5rem !important; }

    /* Formas de pagamento */
    .aqp-footer [style*="margin-top:1.25rem"] { margin-top: .75rem !important; }
}

/* ============================================================
   BOTÕES FLUTUANTES — responsivo
   ============================================================ */
@media (max-width: 480px) {
    /* WhatsApp */
    #wppFloatBtn {
        width: 50px !important;
        height: 50px !important;
        bottom: 1rem !important;
        left: 1rem !important;
    }
    #wppFloatBtn i { font-size: 1.4rem !important; }
    #wppTooltip { display: none !important; }

    /* Agente Junior */
    #jrBtn  { bottom: 1rem !important; right: 1rem !important; }
    #jrChat { bottom: 7rem !important; right: .75rem !important; width: calc(100vw - 1.5rem) !important; }
}

/* ============================================================
   FORMULÁRIOS — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-form-card { padding: 1.25rem !important; border-radius: 12px !important; }
    .aqp-form-card .row { flex-direction: column !important; }
    .aqp-form-card .col-md-6,
    .aqp-form-card .col-md-4,
    .aqp-form-card .col-md-3,
    .aqp-form-card .col-md-8 { width: 100% !important; }
}

/* ============================================================
   INSCRIÇÃO — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-inscricao-hero h1 { font-size: 2rem !important; }
    .aqp-upload-area { padding: 1.25rem !important; }
}

/* ============================================================
   CHECKOUT — responsivo
   ============================================================ */
@media (max-width: 767px) {
    #checkout-card { margin: 0 .5rem !important; }
}

/* ============================================================
   DASHBOARD — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-dash-sidebar {
        display: none !important;
        position: fixed !important;
        top: 0 !important; left: 0 !important; bottom: 0 !important;
        width: 260px !important;
        z-index: 9000 !important;
        overflow-y: auto !important;
    }
    .aqp-dash-sidebar.open { display: block !important; }
    .container-fluid > .row > .col-lg-10,
    .container-fluid > .row > .col-md-9 {
        width: 100% !important;
        margin-left: 0 !important;
        padding: 1rem !important;
    }
    .aqp-stat-card .stat-num { font-size: 1.6rem !important; }
}

/* ============================================================
   ADMIN — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .adm-main { padding: .75rem !important; }
    .adm-stats { grid-template-columns: repeat(2, 1fr) !important; gap: .6rem !important; }
    .adm-stat-num { font-size: 1.4rem !important; }
    .adm-page-header { flex-direction: column !important; align-items: flex-start !important; }
    .adm-page-actions { width: 100% !important; }
    .adm-card-header { flex-wrap: wrap !important; gap: .5rem !important; }
    .adm-table { font-size: .78rem !important; }
    .adm-table thead th { padding: .5rem .6rem !important; }
    .adm-table tbody td { padding: .5rem .6rem !important; }

    /* Formulário de eventos */
    .col-lg-8, .col-lg-4 { width: 100% !important; }
}
@media (max-width: 480px) {
    .adm-stats { grid-template-columns: 1fr 1fr !important; }
    .adm-btn   { font-size: .78rem !important; padding: .4rem .9rem !important; }
}

/* ============================================================
   GALERIA PÚBLICA — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-gallery-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
    .nav-tabs .nav-link { font-size: .82rem !important; padding: .5rem .75rem !important; }
}

/* ============================================================
   LOGIN / RECUPERAÇÃO DE SENHA — responsivo
   ============================================================ */
@media (max-width: 480px) {
    .login-card { border-radius: 12px !important; margin: .5rem !important; }
    .login-card-header { padding: 1.75rem 1.25rem 1.5rem !important; }
    .login-card-body { padding: 1.25rem 1.25rem 1.75rem !important; }
    .login-site-name { font-size: 1.4rem !important; }
}

/* ============================================================
   BLOG — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-blog-card .card-img-top { height: 160px !important; }
    .post-content { font-size: .9rem !important; }
}

/* ============================================================
   SEÇÕES GERAIS — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-section { padding: 2.5rem 0 !important; }
    .aqp-section-title { font-size: 1.6rem !important; }
    .container { padding-left: 1rem !important; padding-right: 1rem !important; }
}
@media (max-width: 480px) {
    .aqp-section { padding: 2rem 0 !important; }
    .aqp-section-title { font-size: 1.4rem !important; }
}

/* ============================================================
   CTA FINAL — responsivo
   ============================================================ */
@media (max-width: 767px) {
    section[style*="padding:5rem 0;background:linear-gradient(135deg,#2C0A0A"] {
        padding: 3rem 0 !important;
    }
    section[style*="padding:5rem 0;background:linear-gradient(135deg,#2C0A0A"] h2 {
        font-size: 1.6rem !important;
    }
}

/* ============================================================
   UTILITÁRIOS RESPONSIVOS
   ============================================================ */
@media (max-width: 767px) {
    .d-mobile-none { display: none !important; }
    .d-mobile-block { display: block !important; }
    .text-mobile-center { text-align: center !important; }
    .w-mobile-100 { width: 100% !important; }
    .gap-mobile-sm { gap: .5rem !important; }
    .p-mobile-sm { padding: .75rem !important; }
    .mt-mobile-2 { margin-top: .5rem !important; }
    .mt-mobile-3 { margin-top: 1rem !important; }
}

/* ============================================================
   TOUCH — melhora UX em dispositivos touch
   ============================================================ */
@media (hover: none) and (pointer: coarse) {
    /* Aumenta área de toque dos botões */
    .aqp-btn-nav-red,
    .aqp-btn-nav-outline,
    .btn,
    .adm-btn {
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
    }
    /* Remove hover effects que ficam "presos" no touch */
    .aqp-gallery-item:hover img { transform: none !important; }
    .aqp-event-card:hover { transform: none !important; }
    .aqp-blog-card:hover { transform: none !important; }
    .adm-stat-card:hover { transform: none !important; }
}

/* ============================================================
   PRINT — impressão básica
   ============================================================ */
@media print {
    .aqp-header, .aqp-navbar-wrap, .aqp-footer,
    #jrBtn, #jrChat, #wppFloatBtn,
    .adm-sidebar, .adm-topbar { display: none !important; }
    body { background: #fff !important; color: #000 !important; }
    .container { max-width: 100% !important; }
}

/* ============================================================
   INSCRIÇÃO — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-form-card .row.g-3 > [class*="col-"] {
        width: 100% !important;
    }
    .aqp-upload-area { padding: 1rem !important; }
    .aqp-upload-preview { width: 90px !important; height: 90px !important; }
}

/* ============================================================
   EVENTOS PÚBLICO — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-event-card .card-img-top { height: 180px !important; }
    .aqp-price-badge { width: 80px !important; height: 80px !important; }
    .aqp-price-badge .price-val { font-size: 1rem !important; }
}

/* ============================================================
   CHECKOUT — responsivo
   ============================================================ */
@media (max-width: 480px) {
    .checkout-card { margin: 0 !important; border-radius: 12px !important; }
    .checkout-card [style*="padding:0 1.5rem"] { padding: 0 1rem !important; }
    .checkout-card [style*="padding:1.5rem"] { padding: 1rem !important; }
}

/* ============================================================
   GALERIA — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .aqp-gallery-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 6px !important;
    }
    /* Vídeos em coluna única */
    .galeria-videos .col-md-6 { width: 100% !important; }
}
@media (max-width: 380px) {
    .aqp-gallery-grid { grid-template-columns: 1fr 1fr !important; }
}

/* ============================================================
   BLOG POST — responsivo
   ============================================================ */
@media (max-width: 767px) {
    .post-content { font-size: .9rem !important; line-height: 1.7 !important; }
    .post-content h2 { font-size: 1.3rem !important; }
    .post-content h3 { font-size: 1.1rem !important; }
    .post-content img { border-radius: 8px !important; }
}

/* ============================================================
   DASHBOARD OUTRAS PÁGINAS — responsivo
   ============================================================ */
@media (max-width: 767px) {
    /* Fotos grid */
    .aqp-gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }

    /* Cards de ação rápida */
    .row.g-3 .col-sm-6 { width: 50% !important; }
    .row.g-3 .col-lg-3 { width: 50% !important; }

    /* Tabela de inscrições */
    .table-responsive { font-size: .78rem !important; }
}

/* ============================================================
   HEADER HERO — ajustes finos mobile
   ============================================================ */
@media (max-width: 360px) {
    .aqp-logo-script { font-size: 1.1rem !important; }
    .aqp-logo-serif  { font-size: .85rem !important; letter-spacing: .5px !important; }
    .aqp-logo-heart, .aqp-logo-heart-bg { width: 38px !important; height: 38px !important; }
    .aqp-logo-heart-bg i { font-size: 1rem !important; }
    .aqp-btn-nav-red { padding: .38rem 1rem !important; font-size: .8rem !important; }
}

/* ============================================================
   AGENTE JUNIOR — responsivo
   ============================================================ */
@media (max-width: 380px) {
    #jrChat { width: calc(100vw - 1rem) !important; right: .5rem !important; }
    #jrBtn  { right: .5rem !important; }
}

/* ============================================================
   ADMIN EVENTOS FORM — responsivo
   ============================================================ */
@media (max-width: 991px) {
    /* Coluna lateral vai para baixo */
    .col-lg-8, .col-lg-4 { width: 100% !important; }
    /* Grid de fotos do local: 2 colunas */
    #fotosLocalGrid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
    #fotosLocalGrid { grid-template-columns: repeat(2, 1fr) !important; gap: .5rem !important; }
}

/* ============================================================
   ADMIN TABELAS — scroll horizontal em mobile
   ============================================================ */
@media (max-width: 767px) {
    .adm-card .table-responsive,
    .adm-card-body-flush { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; }
    .adm-table { min-width: 500px !important; }
    /* Esconde colunas menos importantes */
    .adm-table .col-hide-mobile { display: none !important; }
}

/* ============================================================
   CONFIGURAÇÕES ADMIN — responsivo
   ============================================================ */
@media (max-width: 991px) {
    /* Sidebar de abas vira horizontal */
    .settings-tab-link { padding: .6rem .9rem !important; font-size: .82rem !important; }
    /* Grid de logos: 2 colunas */
    .row.g-4 .col-md-6 { width: 50% !important; }
}
@media (max-width: 767px) {
    .row.g-4 .col-md-6 { width: 100% !important; }
    .row.g-4 .col-12 { width: 100% !important; }
}

/* ============================================================
   FOOTER PAGAMENTOS — responsivo
   ============================================================ */
@media (max-width: 480px) {
    /* Bandeiras em linha */
    .aqp-footer [style*="display:flex;gap:.4rem"] {
        flex-wrap: wrap !important;
        gap: .3rem !important;
    }
}

/* ============================================================
   SEÇÃO EVENTO INDEX — responsivo extra
   ============================================================ */
@media (max-width: 575px) {
    /* Botões de inscrição em coluna */
    .aqp-evento-section [style*="display:flex;gap:.75rem;flex-wrap:wrap"] {
        flex-direction: column !important;
    }
    .aqp-evento-section [style*="flex:1;min-width:160px"] {
        width: 100% !important;
        min-width: unset !important;
    }
    /* Badge de preço centralizado */
    .aqp-price-circle-inner { width: 80px !important; height: 80px !important; }
    .aqp-price-val { font-size: .9rem !important; }
}

/* ============================================================
   SMOOTH SCROLL E FOCUS VISIBLE
   ============================================================ */
html { scroll-behavior: smooth; }

*:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ============================================================
   SELEÇÃO DE TEXTO
   ============================================================ */
::selection {
    background: rgba(192, 57, 43, .15);
    color: var(--dark);
}
