/* Tamaduni Trends Events - Custom Stylesheet 
    This file supplements Tailwind CSS for advanced effects.
*/

/* 1. SMOOTH SCROLLING */
html {
    scroll-behavior: smooth;
}

/* 2. BRAND COLOR VARIABLES */
:root {
    --tamaduni-orange: #FF6B35;
    --tamaduni-navy: #1B2845;
    --tamaduni-gold: #FFD700;
}

/* 3. NAVIGATION GLASS EFFECT */
.glass-nav {
    background: rgba(27, 40, 69, 0.95); /* Navy with transparency */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: all 0.3s ease-in-out;
}

/* 4. CUSTOM BUTTON ANIMATIONS */
.btn-hover-effect {
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-hover-effect:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 15px -3px rgba(255, 107, 53, 0.3);
}

/* 5. SLIDER TRANSITIONS */
/* Ensures the fade effect on the homepage is buttery smooth */
.fade-enter {
    opacity: 0;
}
.fade-enter-active {
    opacity: 1;
    transition: opacity 1000ms ease-in;
}

/* 6. IMAGE HOVER GLOW */
/* Adds a subtle gold glow when hovering over gallery or service images */
.image-glow:hover {
    outline: 3px solid var(--tamaduni-gold);
    outline-offset: -10px;
}

/* 7. WHATSAPP FLOATING BUTTON PULSE */
/* Makes the WhatsApp button "throb" slightly to catch the eye */
@keyframes pulse-whatsapp {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }
    70% { transform: scale(1.05); box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

.whatsapp-float {
    animation: pulse-whatsapp 2s infinite;
}

/* 8. MOBILE MENU TRANSITION */
[x-cloak] { display: none !important; }

/* 9. SEO HIERARCHY HELPERS */
h1, h2, h3 {
    text-wrap: balance;
}

/* 10. CUSTOM SCROLLBAR (Optional - matches brand colors) */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
    background: var(--tamaduni-navy);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--tamaduni-orange);
}