/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Oz Reez
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.5.1763867353
Updated: 2025-11-23 03:09:13

*/

/**
 * AJAX Page Transitions CSS
 * Add this to your child theme's style.css
 */

/* Loading Bar Base Styles */
#ajax-loading-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 3px;
    background: linear-gradient(90deg, #3176ce, #6d9ad4);
    z-index: 999999;
    transition: width 0.3s ease, opacity 0.3s ease;
    opacity: 0;
    box-shadow: 0 0 10px rgba(49, 118, 206, 0.5);
}

/* Page Transition Animations */
#content,
main,
#primary {
    transition: opacity 300ms ease-in-out;
}

/* Ensure sticky player stays on top */
.sticky-audio-player,
#sticky-player,
[class*="sticky-player"] {
    position: fixed !important;
    z-index: 99999 !important;
    pointer-events: auto !important;
}

/* Smooth scrolling for page transitions */
html {
    scroll-behavior: smooth;
}

/* Optional: Add a subtle fade effect to page changes */
body.page-transitioning #content,
body.page-transitioning main,
body.page-transitioning #primary {
    opacity: 0.7;
}

/* Loading state cursor */
body.loading {
    cursor: wait;
}

/* Prevent content flash during transition */
#content > *,
main > *,
#primary > * {
    animation: fadeInContent 0.3s ease-in-out;
}

@keyframes fadeInContent {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile optimizations */
@media (max-width: 768px) {
    #ajax-loading-bar {
        height: 2px;
    }
}

/* ==========================================================
   WOO COMMERCE DARK THEME & BRAND COLORS - GLOBAL STYLES
   Add to: Child Theme style.css OR Customizer Additional CSS
   ========================================================== */

/* --- 1. GLOBAL BACKGROUND & TEXT COLOR OVERRIDES --- */
/* Scope note: all selectors below are wrapped with WooCommerce body classes to avoid affecting non-Woo pages. */
body.woocommerce,
body.woocommerce-page,
body.woocommerce-cart,
body.woocommerce-account,
body.single-product,
body.post-type-archive-product {
    background: #0A0A0A;
    color: #d8d8d8 !important;
}
/* CHECKOUT EXCLUDED: Removed body.woocommerce-checkout to allow default WooCommerce styling for Elementor rebuild */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product) :is(.woocommerce, .woocommerce-page) {
    color: #d8d8d8 !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product) :is(.woocommerce a, .woocommerce-page a) {
    color: #3176ce;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product) :is(.woocommerce a:hover, .woocommerce-page a:hover) {
    color: #2A63AE;
}

/* --- 2. BUTTONS --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(
        .woocommerce a.button,
        .woocommerce button.button,
        .woocommerce input.button,
        .woocommerce #respond input#submit,
        .woocommerce #payment #place_order,
        .woocommerce .woocommerce-cart .button,
        .woocommerce .woocommerce-message .button,
        .woocommerce .woocommerce-error .button,
        .woocommerce .woocommerce-info .button,
        .woocommerce .single_add_to_cart_button,
        .woocommerce .add_to_cart_button,
        .woocommerce .checkout-button,
        .woocommerce .return-to-shop .button,
        .woocommerce .woocommerce-form-login__submit,
        .woocommerce .woocommerce-Button,
        .woocommerce .woocommerce-form-register__submit
    ) {
    background: #3176ce !important;
    color: #fff !important;
    border: none !important;
    border-radius: 2px !important;
    transition: background 0.2s;
    box-shadow: none !important;
    font-weight: 600;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(
        .woocommerce a.button:hover,
        .woocommerce button.button:hover,
        .woocommerce input.button:hover,
        .woocommerce #respond input#submit:hover,
        .woocommerce #payment #place_order:hover,
        .woocommerce .woocommerce-cart .button:hover,
        .woocommerce .woocommerce-message .button:hover,
        .woocommerce .woocommerce-error .button:hover,
        .woocommerce .woocommerce-info .button:hover,
        .woocommerce .single_add_to_cart_button:hover,
        .woocommerce .add_to_cart_button:hover,
        .woocommerce .checkout-button:hover,
        .woocommerce .return-to-shop .button:hover,
        .woocommerce .woocommerce-form-login__submit:hover,
        .woocommerce .woocommerce-Button:hover,
        .woocommerce .woocommerce-form-register__submit:hover
    ) {
    background: #2A63AE !important;
    color: #fff !important;
}

/* --- 3. FORM INPUTS, SELECTS, TEXTAREAS --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(
        .woocommerce input[type="text"],
        .woocommerce input[type="email"],
        .woocommerce input[type="password"],
        .woocommerce input[type="number"],
        .woocommerce input[type="tel"],
        .woocommerce input[type="search"],
        .woocommerce select,
        .woocommerce textarea
    ) {
    background: #141414 !important;
    color: #d8d8d8 !important;
    border: 1px solid #383838 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
}
/* Edit Account page fields */
body.woocommerce-account
    :is(
        .woocommerce-MyAccount-content input[type="text"],
        .woocommerce-MyAccount-content input[type="email"],
        .woocommerce-MyAccount-content input[type="password"],
        .woocommerce-MyAccount-content input[type="number"],
        .woocommerce-MyAccount-content input[type="tel"],
        .woocommerce-MyAccount-content input[type="search"],
        .woocommerce-MyAccount-content select,
        .woocommerce-MyAccount-content textarea
    ) {
    background: #141414 !important;
    color: #d8d8d8 !important;
    border: 1px solid #383838 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
}

body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(.woocommerce input:focus, .woocommerce select:focus, .woocommerce textarea:focus) {
    border-color: #3176ce !important;
    outline: none !important;
}

/* --- 4. PRODUCT CARDS (ARCHIVE/LISTINGS) --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(.woocommerce ul.products li.product, .woocommerce-page ul.products li.product) {
    background: #121212 !important;
    border-radius: 2px !important;
    border: 1px solid #121212 !important;
    box-shadow: 0 1px 6px rgba(0,0,0,0.07);
    color: #d8d8d8;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(.woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product .price) {
    color: #d8d8d8 !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce ul.products li.product .button {
    margin-top: 10px;
}

/* --- 5. SINGLE PRODUCT PAGE --- 
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce div.product {
    background: #181a1b !important;
    color: #d8d8d8 !important;
    border-radius: 2px;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(.woocommerce div.product .product_title, .woocommerce div.product .price) {
    color: #d8d8d8 !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: #232526 !important;
    border-radius: 2px 2px 0 0 !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background: #3176ce !important;
    color: #fff !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce div.product .woocommerce-tabs .panel {
    background: #232526 !important;
    color: #d8d8d8 !important;
    border-radius: 0 0 2px 2px !important;
} */

/* --- 6. CART PAGE --- Removed: Now handled by OZ Custom WC UI plugin */

/* --- 7. CHECKOUT PAGE --- Removed: Now handled by OZ Custom WC UI plugin */

/* --- 8. MY ACCOUNT PAGE --- Removed: Now handled by OZ Custom WC UI plugin */

/* --- 9. NOTICES (SUCCESS, ERROR, INFO) --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(.woocommerce-message, .woocommerce-error, .woocommerce-info) {
    background: #121212 !important;
    color: #d8d8d8 !important;
    border-radius: 2px !important;
    border: none !important;
    box-shadow: none !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce-message {
    border-left: 4px solid #3176ce !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce-error {
    border-left: 4px solid #e74c3c !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce-info {
    border-left: 4px solid #2A63AE !important;
}

/* --- 10. BREADCRUMBS --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce-breadcrumb {
    color: #b0b0b0 !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce-breadcrumb a {
    color: #3176ce !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce-breadcrumb a:hover {
    color: #2A63AE !important;
}

/* --- 11. PRICES --- */
/* Price color overrides removed to use default #d8d8d8 (inherited from body). */
/* No specific price color set here. */

/* --- 12. SALE BADGE --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    .woocommerce span.onsale {
    background: #3176ce !important;
    color: #fff !important;
    border-radius: 2px !important;
}

/* --- 13. PAGINATION --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(.woocommerce nav.woocommerce-pagination ul li span, .woocommerce nav.woocommerce-pagination ul li a) {
    background: #121212 !important;
    color: #d8d8d8 !important;
    border-radius: 2px !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(.woocommerce nav.woocommerce-pagination ul li span.current, .woocommerce nav.woocommerce-pagination ul li a:hover) {
    background: #3176ce !important;
    color: #fff !important;
}

/* --- 14. MOBILE RESPONSIVENESS --- */
@media (max-width: 768px) {
    body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
        .woocommerce ul.products li.product,
    body.woocommerce-cart :is(table.cart, .cart-collaterals),
    body.woocommerce-account :is(.woocommerce-MyAccount-navigation, .woocommerce-MyAccount-content) {
        border-radius: 2px !important;
        font-size: 0.97em;
    }
    body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
        .woocommerce ul.products li.product {
        margin-bottom: 18px !important;
    }
    body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
        .woocommerce div.product {
        padding: 10px !important;
    }
    /* Responsive fix for cart content padding */
    body.woocommerce-cart .cart-collaterals {
        padding: 12px !important;
    }
}

/* --- REQUIRED FIELD ASTERISKS COLOR --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(.woocommerce form .required, .woocommerce form label .required, .woocommerce-MyAccount-content .required) {
    color: #d8d8d8 !important;
    opacity: 1 !important;
}

/* --- SHOW/HIDE PASSWORD TOGGLE ICON COLOR (ALL SELECTORS) --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(
        .woocommerce form .show-password-input,
        .woocommerce form .show-password-input:after,
        .woocommerce form .show-password-input:before,
        .woocommerce-password-toggle,
        .woocommerce-password-toggle button,
        .woocommerce-password-toggle svg,
        .password-input + button,
        .password-input + button svg
    ) {
    color: #d8d8d8 !important;
    fill: #d8d8d8 !important;
    opacity: 0.88 !important;
    stroke: #d8d8d8 !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(
        .woocommerce form .show-password-input:hover,
        .woocommerce form .show-password-input:after:hover,
        .woocommerce form .show-password-input:before:hover,
        .woocommerce-password-toggle:hover,
        .woocommerce-password-toggle button:hover,
        .woocommerce-password-toggle svg:hover,
        .password-input + button:hover,
        .password-input + button svg:hover
    ) {
    color: #fff !important;
    fill: #fff !important;
    stroke: #fff !important;
    opacity: 1 !important;
}


/* --- MY ACCOUNT LOGIN/REGISTER CONTAINER --- Removed: Now handled by OZ Custom WC UI plugin */


/* --- MY ACCOUNT NAVIGATION --- Removed: Now handled by OZ Custom WC UI plugin
   Note: Address tab hiding kept if needed */
body.woocommerce-account .woocommerce-MyAccount-navigation-link--edit-address {
    display: none !important;
}

/* --- VIEW CART PAGE FIXES --- Removed: Now handled by OZ Custom WC UI plugin */

/* --- CHECKOUT PAGE CONTENT PADDING & UI --- Removed: Now handled by OZ Custom WC UI plugin */


/* --- 15. ELEMENTOR COMPATIBILITY --- */
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(
        .elementor-widget-woocommerce,
        .elementor-widget-woocommerce-products,
        .elementor-widget-woocommerce-cart
    ) {
    background: transparent !important;
    color: inherit !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(
        .elementor .woocommerce a.button,
        .elementor .woocommerce button.button,
        .elementor .woocommerce input.button
    ) {
    background: #3176ce !important;
    color: #fff !important;
    border-radius: 2px !important;
}
body:where(.woocommerce, .woocommerce-page, .woocommerce-cart, .woocommerce-account, .single-product, .post-type-archive-product)
    :is(
        .elementor .woocommerce a.button:hover,
        .elementor .woocommerce button.button:hover,
        .elementor .woocommerce input.button:hover
    ) {
    background: #2A63AE !important;
    color: #fff !important;
}

/* My Account Wrapper & Navigation --- Removed: Now handled by OZ Custom WC UI plugin */