/*
Theme Name: Astra SPV
Theme URI: https://superplazavenezuela.com
Description: Child theme de Astra para Super Plaza Venezuela
Author: SPV Dev
Author URI: https://superplazavenezuela.com
Template: astra
Version: 1.2.0
Text Domain: astra-spv
*/

/* ============================================
   VARIABLES DE MARCA SPV
   ============================================ */
:root {
    --spv-verde: #006938;
    --spv-verde-oscuro: #004d2a;
    --spv-verde-claro: #00854a;
    --spv-amarillo: #F7BE00;
    --spv-amarillo-oscuro: #d4a300;
    --spv-blanco: #ffffff;
    --spv-gris-claro: #f5f5f5;
    --spv-gris: #333333;
    --spv-font: "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
}

/* ============================================
   1. TIPOGRAFÍA
   ============================================ */
body,
button,
input,
select,
textarea {
    font-family: var(--spv-font) !important;
    font-size: 16px;
    color: var(--spv-gris);
}

h1, .entry-content h1 { font-size: 36px !important; font-weight: 700; }
h2, .entry-content h2 { font-size: 28px !important; font-weight: 700; }
h3, .entry-content h3 { font-size: 22px !important; font-weight: 600; }
h4, .entry-content h4 { font-size: 18px !important; font-weight: 600; }

h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.woocommerce div.product .product_title {
    font-family: var(--spv-font) !important;
}

/* ============================================
   2. LAYOUT
   ============================================ */
.ast-container {
    max-width: 1200px !important;
}

.site-content > .ast-container {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* ============================================
   3. HEADER — Forzar verde, ocultar extras
   ============================================ */

/* Garantizar site-title oculto (backup del setting) */
.ast-site-title-wrap,
.site-title,
.ast-site-title-wrap .site-title {
    display: none !important;
}

/* Solo logo visible en site-branding */
.ast-site-identity {
    padding: 5px 0 !important;
}

/* Forzar verde en TODO el header area */
.ast-primary-header-bar,
.main-header-bar,
.ast-mobile-header-wrap .ast-primary-header-bar,
.ast-above-header-bar,
.ast-below-header-bar {
    background-color: var(--spv-verde) !important;
    border-bottom: none !important;
}

/* Menú desktop: blanco, inline */
.ast-builder-menu-1 .menu-item > .menu-link,
.main-header-menu > .menu-item > a {
    color: var(--spv-blanco) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    font-family: var(--spv-font) !important;
    padding: 0 16px !important;
}

.ast-builder-menu-1 .menu-item > .menu-link:hover,
.ast-builder-menu-1 .current-menu-item > .menu-link,
.main-header-menu > .menu-item > a:hover,
.main-header-menu > .menu-item.current-menu-item > a {
    color: var(--spv-amarillo) !important;
}

/* Submenús */
.ast-builder-menu-1 .sub-menu,
.main-header-menu .sub-menu {
    background-color: var(--spv-verde-oscuro) !important;
    border-top: 3px solid var(--spv-amarillo) !important;
}

.ast-builder-menu-1 .sub-menu .menu-link,
.main-header-menu .sub-menu a {
    color: var(--spv-blanco) !important;
    font-size: 14px !important;
    padding: 10px 20px !important;
}

.ast-builder-menu-1 .sub-menu .menu-link:hover,
.main-header-menu .sub-menu a:hover {
    color: var(--spv-amarillo) !important;
    background-color: rgba(255,255,255,0.08) !important;
}

/* Sticky header */
.main-header-bar-wrap {
    position: sticky;
    top: 0;
    z-index: 999;
}

/* ============================================
   4. MOBILE
   ============================================ */

/* Hamburger blanco */
[data-section="section-header-mobile-trigger"] .ast-button-wrap .ast-mobile-menu-trigger-minimal,
.ast-mobile-menu-trigger-minimal {
    color: var(--spv-blanco) !important;
    border: none !important;
}

/* Drawer / popup verde */
.ast-mobile-popup-drawer.active .ast-mobile-popup-inner,
.ast-mobile-header-content,
.ast-mobile-popup-content {
    background-color: var(--spv-verde) !important;
}

.ast-mobile-popup-drawer .menu-toggle-close,
.ast-mobile-popup-close {
    color: var(--spv-blanco) !important;
}

/* Mobile menu links */
.ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link,
.ast-mobile-header-content .menu-item a,
.ast-mobile-popup-content .menu-item a,
.ast-header-break-point .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item > .menu-link {
    color: var(--spv-blanco) !important;
    font-size: 15px !important;
    font-family: var(--spv-font) !important;
    border-bottom: 1px solid rgba(255,255,255,0.12) !important;
    background: transparent !important;
}

.ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link:hover,
.ast-builder-menu-mobile .main-header-menu .current-menu-item > .menu-link {
    color: var(--spv-amarillo) !important;
    background: rgba(255,255,255,0.08) !important;
}

/* Mobile menu toggle icon color */
.ast-builder-menu-mobile .menu-item > .ast-menu-toggle {
    color: var(--spv-blanco) !important;
}

/* Mobile menu background */
.ast-builder-menu-mobile .main-navigation .main-header-menu,
.ast-builder-menu-mobile .main-navigation .main-header-menu .sub-menu {
    background-color: var(--spv-verde) !important;
}

/* ============================================
   5. BOTONES
   ============================================ */
.ast-button,
.button,
button:not(.menu-toggle):not(.ast-mobile-menu-trigger-minimal):not(.menu-toggle-close),
input[type="button"],
input[type="submit"],
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    background-color: var(--spv-verde) !important;
    color: var(--spv-blanco) !important;
    border: 2px solid var(--spv-verde) !important;
    font-family: var(--spv-font) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
    padding: 10px 24px !important;
    transition: all 0.2s ease !important;
}

.ast-button:hover,
.button:hover,
button:not(.menu-toggle):not(.ast-mobile-menu-trigger-minimal):not(.menu-toggle-close):hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
    background-color: var(--spv-amarillo) !important;
    color: var(--spv-verde) !important;
    border-color: var(--spv-amarillo) !important;
}

/* ============================================
   6. LINKS
   ============================================ */
a { color: var(--spv-verde); transition: color 0.2s ease; }
a:hover, a:focus { color: var(--spv-verde-oscuro); }

/* ============================================
   7. FOOTER
   ============================================ */
.site-footer,
.site-below-footer-wrap,
.ast-footer-overlay,
.ast-small-footer {
    background-color: var(--spv-verde) !important;
    color: var(--spv-blanco) !important;
    font-family: var(--spv-font) !important;
}

.site-footer a,
.ast-footer-copyright a {
    color: var(--spv-amarillo) !important;
}

.site-footer a:hover,
.ast-footer-copyright a:hover {
    color: var(--spv-blanco) !important;
}

.ast-footer-copyright {
    text-align: center;
    padding: 20px 0 !important;
}

/* ============================================
   8. WOOCOMMERCE
   ============================================ */
.woocommerce span.onsale {
    background-color: var(--spv-amarillo) !important;
    color: var(--spv-verde) !important;
    font-weight: bold;
}

.woocommerce .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--spv-verde) !important;
    font-weight: 700;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--spv-font) !important;
}

.woocommerce .star-rating span::before {
    color: var(--spv-amarillo) !important;
}

.woocommerce-message,
.woocommerce-info {
    border-top-color: var(--spv-verde) !important;
}

.woocommerce-message::before,
.woocommerce-info::before {
    color: var(--spv-verde) !important;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--spv-verde) !important;
    color: var(--spv-blanco) !important;
}

/* Carrito header */
.ast-site-header-cart .count {
    color: var(--spv-amarillo) !important;
}

/* ============================================
   9. RESPONSIVE — TABLET
   ============================================ */
@media (max-width: 1199px) and (min-width: 768px) {
    h1, .entry-content h1 { font-size: 30px !important; }
    h2, .entry-content h2 { font-size: 24px !important; }
    h3, .entry-content h3 { font-size: 20px !important; }

    .ast-builder-menu-1 .menu-item > .menu-link {
        font-size: 14px !important;
        padding: 0 12px !important;
    }
}

/* ============================================
   10. RESPONSIVE — MÓVIL
   ============================================ */
@media (max-width: 767px) {
    h1, .entry-content h1 { font-size: 26px !important; }
    h2, .entry-content h2 { font-size: 22px !important; }
    h3, .entry-content h3 { font-size: 19px !important; }

    body { font-size: 15px; }

    .site-content > .ast-container {
        padding-top: 24px;
        padding-bottom: 24px;
    }

    .woocommerce ul.products[class*="columns-"] li.product {
        width: 48% !important;
        margin-right: 4% !important;
    }
    .woocommerce ul.products[class*="columns-"] li.product:nth-child(2n) {
        margin-right: 0 !important;
    }
}