/* ==========================================================================
   BrandGlows Theme — Additional CSS & Animations (theme.css)
   ========================================================================== */

/* Scroll Animations */
.animate-on-scroll { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease, transform 0.6s ease; }
.animate-on-scroll.animated { opacity: 1; transform: translateY(0); }
.fade-in-left { opacity: 0; transform: translateX(-30px); transition: all 0.6s ease; }
.fade-in-left.animated { opacity: 1; transform: translateX(0); }
.fade-in-right { opacity: 0; transform: translateX(30px); transition: all 0.6s ease; }
.fade-in-right.animated { opacity: 1; transform: translateX(0); }
.delay-1 { transition-delay: 0.1s; } .delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; } .delay-4 { transition-delay: 0.4s; }
.delay-5 { transition-delay: 0.5s; } .delay-6 { transition-delay: 0.6s; }

/* Header Scrolled */
.header-scrolled { background: rgba(11,15,25,0.95) !important; backdrop-filter: blur(20px); box-shadow: 0 4px 30px rgba(0,0,0,0.35); }

/* Page Transition */
.page-content, main { animation: fadeInUp 0.5s ease; }

/* Hover Enhancements - Premium SaaS Feel */
.glass-card, .service-card, .testimonial-card, .pricing-card {
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
    border: 1px solid var(--border);
    background: rgba(20, 22, 35, 0.4);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
.glass-card:hover, .service-card:hover, .testimonial-card:hover, .pricing-card:hover { 
    transform: translateY(-8px); 
    box-shadow: 0 20px 40px -10px rgba(139, 92, 246, 0.15), 0 0 20px rgba(6, 182, 212, 0.05);
    border-color: rgba(139, 92, 246, 0.3);
}
.btn {
    transition: all 0.3s ease;
}
.btn:active { transform: scale(0.95); }
.btn-primary:hover { 
    box-shadow: 0 14px 36px -8px rgba(139, 92, 246, 0.5); 
    transform: translateY(-2px);
}

/* Link Underline Slide */
.main-nav li a::after {
    content: ''; display: block; width: 0; height: 2px;
    background: var(--cyan); transition: width 0.3s; margin-top: 2px;
}
.main-nav li a:hover::after, .main-nav li.current-menu-item a::after { width: 100%; }

/* Selection */
::selection { background: rgba(6,182,212,0.3); color: var(--text); }

/* Loading Overlay */
.site-loader {
    position: fixed; inset: 0; z-index: 99999; background: var(--bg);
    display: flex; align-items: center; justify-content: center;
    transition: opacity 0.4s, visibility 0.4s;
}
.site-loader.loaded { opacity: 0; visibility: hidden; pointer-events: none; }
.site-loader .spinner {
    width: 36px; height: 36px; border: 3px solid var(--border);
    border-top-color: var(--cyan); border-radius: 50%; animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Custom Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.2); }

/* WP Admin Bar Fix */
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-header { top: 46px; } }

/* WP Block Editor Styles */
.wp-block-image img { border-radius: var(--r-lg); }
.wp-block-quote { border-left: 4px solid var(--violet); padding: 16px 24px; background: rgba(124,58,237,0.08); border-radius: 0 var(--r) var(--r) 0; }
.wp-block-button__link { background: var(--gradient-hero); color: #FFF; border-radius: 12px; padding: 12px 24px; font-weight: 700; }
.wp-block-separator { border-color: var(--border); }

/* Fluent Forms Override (Dark Theme) */
.fluentform .ff-el-input--label label { color: var(--text-secondary) !important; }
.fluentform input, .fluentform textarea, .fluentform select {
    background: rgba(255,255,255,0.04) !important; border: 1px solid var(--border) !important;
    color: var(--text) !important; border-radius: var(--r) !important;
}
.fluentform input:focus, .fluentform textarea:focus { border-color: var(--cyan) !important; box-shadow: 0 0 0 3px rgba(6,182,212,0.2) !important; }
.fluentform .ff-btn-submit { background: var(--gradient-hero) !important; border: none !important; border-radius: 12px !important; font-weight: 700 !important; }

/* WooCommerce Dark Theme */
.woocommerce .price { color: var(--cyan) !important; font-weight: 700; }
.woocommerce .button, .woocommerce .checkout-button { background: var(--gradient-hero) !important; color: #FFF !important; border-radius: 12px !important; border: none !important; }