/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 6,000+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.13.1762144416
Updated: 2025-11-03 04:33:36

*/

/* ========================================
   COLOR VARIABLES
   ======================================== */
:root {
    --primary-dark: #473A2E;
    --primary-light: #DEE2DA;
    --accent-green: #9CAF88;
    --bg-light: #F5F5F0;
}

/* Override Astra customizer variables that use #1e293b so text renders white
   These variables are used widely by the Astra theme; overriding them here
   avoids editing parent theme files. */
:root {
    --ast-customizer-text-color: #ffffff;
    --ast-customizer-color-4: #ffffff; /* title / heading */
    --ast-customizer-color-12: #ffffff; /* alt background / used as text in places */
}

/* ========================================
   GLOBAL STYLES
   ======================================== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    background: var(--bg-light);
    color: var(--primary-dark);
    line-height: 1.6;
}

a {
    color: var(--primary-dark);
    text-decoration: none;
    transition: opacity 0.3s;
}

a:hover {
    opacity: 0.7;
}

/* ========================================
   UTILITY CLASSES
   ======================================== */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.btn {
    display: inline-block;
    padding: 12px 24px;
    background: var(--primary-dark);
    color: var(--primary-light);
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 500;
    transition: transform 0.2s;
}

.btn:hover {
    transform: translateY(-2px);
}

.btn-secondary {
    background: var(--primary-light);
    color: var(--primary-dark);
}

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 768px) {
    .veyana-header nav {
        flex-direction: column;
        gap: 10px;
    }
    
    .member-sidebar {
        width: 100%;
        position: relative;
    }
}

/* ========================================
   PAGE BACKGROUND IMAGE (applies to all WP "pages")
   Uses the provided image URL so page templates keep the background
   ======================================== */
body.page, body.page-template {
    background-image: url('https://veyana.co/wp-content/uploads/2025/12/f760a98d-a6fe-46b1-be4f-246024a82110.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
}

/* Keep existing background color for non-page contexts; this rule only targets pages */

/* Ensure site/page wrapper elements are transparent so body background shows through
   Some themes or templates add a white background to top-level containers which
   can hide the body background-image. These rules make those wrappers transparent
   only on page templates. */
body.page .site, body.page-template .site,
body.page .site .ast-container, body.page-template .site .ast-container,
body.page .site-content, body.page-template .site-content,
body.page .site-main, body.page-template .site-main,
body.page .wrap, body.page-template .wrap {
    background: transparent !important;
    box-shadow: none !important;
}

/* If the theme sets a background on .site or other wrappers, ensure body image wins */
body.page, body.page-template {
    background-image: url('https://veyana.co/wp-content/uploads/2025/12/30157991_v690-sasi-08-1.jpg') !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-attachment: fixed !important;
}

/* If page-specific selectors are not applied by the theme, fall back to a global
   html/body background so the image shows on the frontend. This will apply to
   all front-end pages — choose this if you want the image site-wide. */
html, body {
    background-image: url('https://veyana.co/wp-content/uploads/2025/12/30157991_v690-sasi-08-1.jpg') !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-attachment: fixed !important;
}

/* Explicitly clear background colors on common Astra containers that may cover
   the body background. This targets a broad set of selectors used by Astra and
   many themes. */
.site, .ast-site, .ast-container, .site-content, .site-main, .content-area, .wrap,
.entry-content, .ast-article-post, .ast-post, .ast-separate-container, .page .entry-content {
    background: transparent !important;
    background-color: transparent !important;
}



/* Ensure links remain visually distinct when set to white; adjust hover state */
/* body a, .menu a {
    color: #ffffff !important;
} */
body a:hover, .menu a:hover {
    opacity: 0.85;
}

/* Improve text readability: optionally add a semi-opaque overlay for content
   blocks. Uncomment if needed. */
/* .container, .site-content, .content-area {
    background: rgba(255,255,255,0.88) !important;
} */