/*
Theme Name: Astra Child - GTV
Theme URI: https://generaltv.xyz
Template: astra
Author: GTV Development Team
Author URI: https://generaltv.xyz
Description: Child theme for GTV e-commerce site. Optimized for performance.
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child-gtv
*/

/* ==========================================================================
   PERFORMANCE OPTIMIZATIONS
   ========================================================================== */

/* Use contain for layout isolation - only on custom GTV components */
.gtv-modal-content {
    contain: layout style;
}

/* Note: Removed will-change from multiple elements to prevent memory budget exceeded warning */

/* ==========================================================================
   CSS CUSTOM PROPERTIES
   ========================================================================== */
:root {
    /* Brand colors */
    --gtv-brand-gradient: linear-gradient(135deg, var(--ast-global-color-0, #0170b9), var(--ast-global-color-1, #3a3a3a));

    /* Shadows */
    --gtv-shadow-soft: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --gtv-shadow-medium: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

    /* Spacing */
    --gtv-border-radius: 8px;
    --gtv-transition: all 0.3s ease;

    /* Layout */
    --gtv-container-padding: 20px;
    --gtv-max-width: 1400px;
}

/* ==========================================================================
   CRITICAL FIX: WHITE BORDERS/SPACING ISSUE
   ========================================================================== */

/* Reset body and html margins */
html {
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden;
}

body {
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden;
}

/* WordPress admin bar spacing fix */
body.admin-bar {
    margin-top: 0 !important;
}

/* Remove Astra's default container padding that causes white space */
.ast-container,
.site-content .ast-container {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Remove padding from main content area */
#primary,
.site-main,
.site-content {
    padding: 0 !important;
    margin: 0 !important;
}

/* Full-width page builder content */
.ast-page-builder-template .site-content,
.ast-page-builder-template .entry-content {
    padding: 0 !important;
    margin: 0 !important;
}

/* Elementor full-width sections - NO white space */
.elementor-section.elementor-section-boxed > .elementor-container {
    max-width: var(--gtv-max-width);
    margin: 0 auto;
}

.elementor-section.elementor-section-full_width,
.elementor-section-stretched {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    position: relative !important;
}

/* Remove any article/post padding that creates white space */
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post {
    padding: 0 !important;
    margin: 0 !important;
}

/* Entry content full width */
.entry-content {
    max-width: 100% !important;
}

/* Remove WooCommerce container padding */
.woocommerce-page .site-content,
.woocommerce .site-content {
    padding: 0 !important;
}

/* ==========================================================================
   HEADER OPTIMIZATION
   ========================================================================== */

.main-header-bar,
.ast-primary-header-bar {
    padding-left: var(--gtv-container-padding);
    padding-right: var(--gtv-container-padding);
    max-width: 100%;
}

.site-header {
    width: 100%;
    margin: 0;
}

/* ==========================================================================
   FOOTER OPTIMIZATION
   ========================================================================== */

.site-footer {
    width: 100%;
    margin: 0;
    padding: 0;
}

.ast-footer-overlay {
    padding-left: var(--gtv-container-padding);
    padding-right: var(--gtv-container-padding);
}

/* ==========================================================================
   IMAGE OPTIMIZATION - CLS Prevention
   ========================================================================== */

/* Base image styles - prevent layout shifts */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Ensure images with width/height attributes reserve space */
img[width][height] {
    height: auto;
    aspect-ratio: attr(width) / attr(height);
}

/* Elementor image widget - ensure proper sizing */
.elementor-widget-image img,
.elementor-image img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
}

/* Elementor background images - proper fit */
.elementor-background-overlay,
[data-elementor-type="wp-page"] .elementor-section,
.elementor-section[data-element_type="section"] {
    background-size: cover;
    background-position: center;
}

/* Fix for zoomed/cropped images in Elementor containers */
.elementor-widget-container img {
    object-fit: contain;
    max-width: 100%;
    height: auto;
}

/* Swiper slide images - prevent CLS with aspect ratio */
.swiper-slide img,
img.swiper-slide-image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: contain;
}

/* Logo carousel images - fixed aspect ratio */
.elementor-image-carousel img,
.elementor-carousel-image img {
    max-height: 80px;
    width: auto;
    object-fit: contain;
}

/* Video/media embeds */
.elementor-video-container,
.elementor-custom-embed {
    max-width: 100%;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}

/* Prevent layout shift on entry content */
.entry-content {
    contain: layout style;
}

/* ==========================================================================
   BUTTON OPTIMIZATION
   ========================================================================== */

.ast-button,
.button,
.wp-block-button__link,
a.button,
.gtv-btn-primary {
    border-radius: var(--gtv-border-radius);
    transition: var(--gtv-transition);
    cursor: pointer;
    backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
}

/* Get Started button */
.ast-header-button-1 .ast-custom-button-link,
.ast-header-button-1 .menu-link {
    background: linear-gradient(135deg, #e91e63, #ff5722) !important;
    border: none !important;
    border-radius: 25px !important;
    padding: 10px 25px !important;
    color: #fff !important;
    font-weight: 600 !important;
}

.ast-header-button-1 .ast-custom-button-link:hover,
.ast-header-button-1 .menu-link:hover {
    opacity: 0.9;
}

/* ==========================================================================
   NAVIGATION OPTIMIZATION
   ========================================================================== */

.main-navigation ul li {
    white-space: nowrap;
}

.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a {
    color: var(--ast-global-color-0, #0170b9) !important;
}

/* ==========================================================================
   PRICING PAGE STYLES
   ========================================================================== */

.page-template-default.page .entry-content {
    max-width: var(--gtv-max-width);
    margin: 0 auto;
    padding: 40px var(--gtv-container-padding);
}

/* Dark theme compatibility */
body.gtv-theme .gtv-package-card {
    background: var(--ast-global-color-5, #1a1a2e);
    border-color: var(--ast-global-color-6, #2d2d44);
    color: var(--ast-global-color-8, #fff);
}

body.gtv-theme .gtv-package-name {
    color: var(--ast-global-color-8, #fff);
}

body.gtv-theme .gtv-package-features li {
    border-color: var(--ast-global-color-6, #2d2d44);
    color: var(--ast-global-color-8, #fff);
}

body.gtv-theme .gtv-price-amount {
    color: var(--ast-global-color-0, #00d4ff);
}

/* ==========================================================================
   UTILITY CLASSES
   ========================================================================== */

.gtv-full-width {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
}

.gtv-container {
    max-width: var(--gtv-max-width);
    margin: 0 auto;
    padding: 0 var(--gtv-container-padding);
}

.gtv-text-center {
    text-align: center;
}

.gtv-mt-0 { margin-top: 0 !important; }
.gtv-mb-0 { margin-bottom: 0 !important; }
.gtv-pt-0 { padding-top: 0 !important; }
.gtv-pb-0 { padding-bottom: 0 !important; }

/* ==========================================================================
   RESPONSIVE OPTIMIZATION
   ========================================================================== */

@media (max-width: 992px) {
    :root {
        --gtv-container-padding: 15px;
    }

    .main-header-bar,
    .ast-primary-header-bar {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (max-width: 544px) {
    :root {
        --gtv-container-padding: 10px;
    }

    .main-header-bar,
    .ast-primary-header-bar {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* ==========================================================================
   ACCESSIBILITY: REDUCED MOTION
   ========================================================================== */

/* Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

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

@media print {
    .site-header,
    .site-footer,
    .gtv-modal,
    nav,
    .cookie-notice {
        display: none !important;
    }

    body {
        background: #fff !important;
        color: #000 !important;
    }
}