/* ==========================================================================
   DIWALI THEME 2025 - Festival of Lights
   ========================================================================== */

/* Diwali Color Palette */
:root {
    --diwali-gold: #FFD700;
    --diwali-orange: #FF6600;
    --diwali-red: #DC143C;
    --diwali-yellow: #FFA500;
    --diwali-deep-orange: #FF4500;
    --diwali-purple: #8B008B;
    --diwali-dark: #1a0a00;
    --diwali-light: #FFF5E1;
}

/* Background Gradient with Festive Colors */
body {
    background: linear-gradient(135deg, #1a0a00 0%, #3d1f00 50%, #1a0a00 100%);
    position: relative;
    overflow-x: hidden;
}

/* Animated Diya/Lamp Border */
.dark_bg {
    background: linear-gradient(135deg, #1a0a00 0%, #2d1500 50%, #1a0a00 100%);
    position: relative;
}

/* Floating Diyas Animation */
@keyframes float-diya {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-20px) rotate(5deg); }
}

@keyframes glow-pulse {
    0%, 100% { box-shadow: 0 0 20px var(--diwali-gold), 0 0 40px var(--diwali-orange); }
    50% { box-shadow: 0 0 40px var(--diwali-gold), 0 0 80px var(--diwali-orange); }
}

/* Fireworks Background Animation */
@keyframes fireworks {
    0% { opacity: 0; transform: scale(0) rotate(0deg); }
    50% { opacity: 1; }
    100% { opacity: 0; transform: scale(1.5) rotate(360deg); }
}

/* Sparkle Effect */
@keyframes sparkle {
    0%, 100% { opacity: 0; transform: scale(0); }
    50% { opacity: 1; transform: scale(1); }
}

/* Rangoli Pattern Overlay */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 30%, rgba(255, 215, 0, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(255, 102, 0, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(220, 20, 60, 0.05) 0%, transparent 50%);
    pointer-events: none;
    z-index: 0;
}

/* Diwali Decorative Lights on Header */
.navbar {
    background: linear-gradient(135deg, rgba(26, 10, 0, 0.95) 0%, rgba(61, 31, 0, 0.95) 100%) !important;
    border-bottom: 3px solid var(--diwali-gold);
    box-shadow: 0 5px 30px rgba(255, 215, 0, 0.3);
    position: relative;
}

.navbar::after {
    content: '';
    position: absolute;
    bottom: -3px;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, 
        var(--diwali-red) 0%, 
        var(--diwali-orange) 25%, 
        var(--diwali-yellow) 50%, 
        var(--diwali-orange) 75%, 
        var(--diwali-red) 100%);
    animation: shimmer-lights 3s linear infinite;
}

@keyframes shimmer-lights {
    0% { background-position: -200% center; }
    100% { background-position: 200% center; }
}

/* Navbar Brand with Diwali Glow */
.navbar-brand span {
    color: var(--diwali-gold) !important;
    text-shadow: 0 0 10px var(--diwali-gold), 0 0 20px var(--diwali-orange);
    animation: glow-text 2s ease-in-out infinite;
}

@keyframes glow-text {
    0%, 100% { text-shadow: 0 0 10px var(--diwali-gold), 0 0 20px var(--diwali-orange); }
    50% { text-shadow: 0 0 20px var(--diwali-gold), 0 0 40px var(--diwali-orange), 0 0 60px var(--diwali-red); }
}

/* Nav Links with Festive Colors */
.dark_bg_menu .navbar-nav .nav-link {
    color: var(--diwali-light) !important;
    text-shadow: 0 0 5px rgba(255, 215, 0, 0.5);
    transition: all 0.3s ease;
}

.dark_bg_menu .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:hover {
    color: var(--diwali-gold) !important;
    text-shadow: 0 0 10px var(--diwali-gold);
    transform: translateY(-2px);
}

/* Announcement Ticker Diwali Theme */
.announcement-ticker {
    background: linear-gradient(135deg, #1a0a00 0%, #4d2600 50%, #1a0a00 100%);
    border-top: 2px solid var(--diwali-gold);
    border-bottom: 2px solid var(--diwali-gold);
    box-shadow: 0 2px 20px rgba(255, 215, 0, 0.5);
}

.announcement-ticker::before {
    background: linear-gradient(90deg, 
        rgba(255, 215, 0, 0.2) 0%, 
        rgba(255, 102, 0, 0.1) 50%, 
        rgba(255, 215, 0, 0.2) 100%);
}

.announcement-ticker .new-badge {
    background: linear-gradient(45deg, var(--diwali-red), var(--diwali-orange));
    box-shadow: 0 0 15px var(--diwali-orange);
}

.announcement-ticker .app-link {
    color: var(--diwali-gold);
}

.announcement-ticker .app-link:hover {
    color: var(--diwali-yellow);
    text-shadow: 0 0 15px var(--diwali-gold);
}

/* Hero Section Diwali Enhancement */
.banner_content h3 {
    color: var(--diwali-gold) !important;
    text-shadow: 0 0 10px var(--diwali-gold);
}

.banner_content h1 {
    background: linear-gradient(135deg, var(--diwali-gold) 0%, var(--diwali-orange) 50%, var(--diwali-red) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    filter: drop-shadow(0 0 20px rgba(255, 215, 0, 0.5));
}

.banner_content p {
    color: var(--diwali-light) !important;
}

/* Animated Headline Diwali Colors */
.cd-headline.clip .cd-words-wrapper b {
    background: linear-gradient(135deg, var(--diwali-gold), var(--diwali-orange));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Buttons with Diwali Theme */
.btn.btn-secondary,
.btn-secondary.banner_btn,
.btn-common {
    background: linear-gradient(135deg, var(--diwali-orange) 0%, var(--diwali-red) 100%);
    border: 2px solid var(--diwali-gold);
    color: #fff !important;
    box-shadow: 0 5px 20px rgba(255, 102, 0, 0.4);
    position: relative;
    overflow: hidden;
}

.btn.btn-secondary::before,
.btn-common::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(45deg, transparent, rgba(255, 215, 0, 0.3), transparent);
    transform: rotate(45deg);
    animation: shine 3s infinite;
}

@keyframes shine {
    0% { left: -100%; }
    50%, 100% { left: 100%; }
}

.btn.btn-secondary:hover,
.btn-common:hover {
    background: linear-gradient(135deg, var(--diwali-red) 0%, var(--diwali-orange) 100%);
    box-shadow: 0 10px 40px rgba(255, 215, 0, 0.6);
    transform: translateY(-3px);
}

/* Section Titles with Diwali Flair */
.section-title {
    color: var(--diwali-light) !important;
    text-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
}

.section-title span {
    background: linear-gradient(135deg, var(--diwali-gold), var(--diwali-orange));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.8));
}

/* Service Cards with Diwali Border */
.services-item {
    border: 2px solid var(--diwali-gold);
    background: linear-gradient(135deg, rgba(26, 10, 0, 0.8) 0%, rgba(61, 31, 0, 0.8) 100%);
    box-shadow: 0 5px 30px rgba(255, 215, 0, 0.3);
    position: relative;
    overflow: hidden;
}

.services-item::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255, 215, 0, 0.1) 0%, transparent 70%);
    animation: rotate-bg 10s linear infinite;
}

@keyframes rotate-bg {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.services-item:hover {
    border-color: var(--diwali-orange);
    box-shadow: 0 10px 50px rgba(255, 215, 0, 0.6);
    transform: translateY(-10px) scale(1.02);
}

.services-item .services-content h3 a {
    color: var(--diwali-light) !important;
}

.services-item:hover .services-content h3 a {
    color: var(--diwali-gold) !important;
    text-shadow: 0 0 10px var(--diwali-gold);
}

/* Blog Cards Diwali Theme */
.blog-thumb {
    background: linear-gradient(135deg, rgba(26, 10, 0, 0.9) 0%, rgba(61, 31, 0, 0.9) 100%);
    border: 2px solid var(--diwali-gold);
    box-shadow: 0 5px 30px rgba(255, 215, 0, 0.3);
}

.blog-thumb:hover {
    box-shadow: 0 10px 50px rgba(255, 215, 0, 0.5);
    transform: translateY(-5px);
}

.blog-thumb small {
    color: var(--diwali-gold) !important;
}

.blog-thumb h4 {
    color: var(--diwali-light) !important;
}

.single_blog:hover .blog-thumb h4 {
    color: var(--diwali-gold) !important;
    text-shadow: 0 0 10px var(--diwali-gold);
}

.blog-info {
    box-shadow: 0 2px 20px rgba(255, 215, 0, 0.2);
}

/* Fun Facts with Diwali Colors */
.funfact {
    border: 2px solid var(--diwali-gold);
    background: linear-gradient(135deg, rgba(26, 10, 0, 0.8) 0%, rgba(61, 31, 0, 0.8) 100%);
    box-shadow: 0 5px 30px rgba(255, 215, 0, 0.3);
}

.funfact:hover {
    box-shadow: 0 10px 50px rgba(255, 215, 0, 0.5);
    transform: scale(1.05);
}

.funfact h3 {
    background: linear-gradient(135deg, var(--diwali-gold), var(--diwali-orange));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.funfact i {
    color: rgba(255, 215, 0, 0.2);
}

/* Contact Form Diwali Style */
.form-control {
    background: rgba(26, 10, 0, 0.6);
    border: 2px solid var(--diwali-gold);
    color: var(--diwali-light);
}

.form-control:focus {
    background: rgba(26, 10, 0, 0.8);
    border-color: var(--diwali-orange);
    box-shadow: 0 0 20px rgba(255, 215, 0, 0.3);
    color: var(--diwali-light);
}

.form-control::placeholder {
    color: rgba(255, 245, 225, 0.6);
}

/* Footer with Diwali Enhancement */
.footer-area {
    background: linear-gradient(135deg, #1a0a00 0%, #2d1500 100%);
    border-top: 3px solid var(--diwali-gold);
    box-shadow: 0 -5px 30px rgba(255, 215, 0, 0.3);
}

.footer-text p {
    color: var(--diwali-light);
}

/* Social Icons Diwali Glow */
.social-icon i {
    transition: all 0.3s ease;
}

.social-icon:hover i {
    color: var(--diwali-gold) !important;
    text-shadow: 0 0 20px var(--diwali-gold);
    transform: scale(1.2) rotate(360deg);
}

/* Back to Top Button */
a.back-to-top i {
    background: linear-gradient(135deg, var(--diwali-orange), var(--diwali-red));
    border: 2px solid var(--diwali-gold);
    box-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
}

a.back-to-top:hover i {
    box-shadow: 0 0 40px rgba(255, 215, 0, 0.8);
    transform: scale(1.1);
}

/* Preloader Diwali Theme */
.preloader {
    background: linear-gradient(135deg, #1a0a00 0%, #3d1f00 50%, #1a0a00 100%);
}

.preloader .loader .loader-outter {
    border: 4px solid var(--diwali-gold);
    border-left-color: var(--diwali-orange);
}

.preloader .loader .loader-inner {
    border: 4px solid var(--diwali-orange);
    border-top-color: var(--diwali-gold);
}

.preloader .loader span {
    background: linear-gradient(135deg, var(--diwali-gold), var(--diwali-orange));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Floating Diya Decorations */
.diwali-diya {
    position: fixed;
    width: 40px;
    height: 40px;
    pointer-events: none;
    z-index: 1;
    animation: float-diya 6s ease-in-out infinite;
}

/* Sparkle Effects */
.sparkle {
    position: fixed;
    width: 3px;
    height: 3px;
    background: var(--diwali-gold);
    border-radius: 50%;
    pointer-events: none;
    z-index: 1;
    animation: sparkle 2s ease-in-out infinite;
}

/* Festive Text Colors */
.dark_bg h1, .dark_bg h2, .dark_bg h3, .dark_bg h4, .dark_bg h5, .dark_bg h6 {
    color: var(--diwali-light) !important;
}

.dark_bg p {
    color: var(--diwali-light) !important;
}

/* Dropdown Menu Diwali Theme */
.dropdown-menu {
    background: linear-gradient(135deg, rgba(26, 10, 0, 0.95) 0%, rgba(61, 31, 0, 0.95) 100%);
    border: 2px solid var(--diwali-gold);
    box-shadow: 0 5px 30px rgba(255, 215, 0, 0.4);
}

.dropdown-item {
    color: var(--diwali-light) !important;
}

.dropdown-item:hover {
    background: rgba(255, 215, 0, 0.2);
    color: var(--diwali-gold) !important;
}

/* Image Filters for Festive Look */
.banner-images img {
    filter: drop-shadow(0 0 30px rgba(255, 215, 0, 0.3));
}

/* Particle.js Enhancement for Diwali */
#particles-js {
    background: transparent;
}

/* Special Diwali Message Banner */
.diwali-greeting {
    position: fixed;
    top: 100px;
    right: -350px;
    background: linear-gradient(135deg, var(--diwali-orange), var(--diwali-red));
    color: #fff;
    padding: 15px 25px;
    border-radius: 10px 0 0 10px;
    box-shadow: 0 5px 30px rgba(255, 215, 0, 0.5);
    z-index: 9998;
    transition: right 0.5s ease;
    border: 2px solid var(--diwali-gold);
}

.diwali-greeting:hover {
    right: 0;
}

.diwali-greeting h4 {
    margin: 0;
    font-size: 18px;
    color: #fff !important;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.diwali-greeting p {
    margin: 5px 0 0 0;
    font-size: 12px;
    color: var(--diwali-light) !important;
}

/* Firework Particles */
.firework {
    position: fixed;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    pointer-events: none;
    z-index: 1;
    animation: fireworks 2s ease-out infinite;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .diwali-greeting {
        display: none;
    }
}