/* Custom Styles */
body {
    -webkit-tap-highlight-color: transparent;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    /* Use a very light, almost white background with a subtle gradient/mesh */
    background: radial-gradient(at top left, #f7f9fc, #ffffff, #f0f4f8);
    background-attachment: fixed;
    background-size: cover;
    color: #1f2937; /* Text Main */
}

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

/* Glassmorphism Global Styles - White/Transparent Theme */
.glass {
    background: rgba(255, 255, 255, 0.4); /* More transparent */
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03); /* Subtle shadow */
}

.glass-dark {
    background: rgba(30, 41, 59, 0.7); /* Dark Slate with opacity */
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.glass-card {
    background: rgba(255, 255, 255, 0.85); /* Increased opacity from 0.55 to 0.85 */
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.05); /* Soft premium shadow */
    border-radius: 1rem; /* Consistent rounded corners */
}

/* Liquid/Organic Shapes for Backgrounds - Subtle and Flowing */
.liquid-shape {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px); /* Increased blur for smoother gradient */
    z-index: -1;
    opacity: 0.4; /* More subtle */
    animation: blob 10s infinite;
}

@keyframes blob {
    0% { transform: translate(0px, 0px) scale(1); }
    33% { transform: translate(30px, -50px) scale(1.1); }
    66% { transform: translate(-20px, 20px) scale(0.9); }
    100% { transform: translate(0px, 0px) scale(1); }
}

.animation-delay-2000 {
    animation-delay: 2s;
}
.animation-delay-4000 {
    animation-delay: 4s;
}

/* Commercial Color Palette - White/Transparent/Glass (Removing Blue dominance) */
:root {
    --primary-glass: rgba(255, 255, 255, 0.8);
    --primary-border: rgba(255, 255, 255, 0.9);
    --text-main: #1f2937; /* Gray-800 */
    --text-secondary: #6b7280; /* Gray-500 */
    --accent-color: #3b82f6; /* Keep a subtle blue for interactions only */
}

/* Button overrides - Glassy Buttons */
.btn-primary {
    background: rgba(255, 255, 255, 0.9);
    color: #1f2937; /* Dark text */
    border: 1px solid rgba(255, 255, 255, 1);
    backdrop-filter: blur(4px);
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    transition: all 0.3s ease;
}

.btn-primary:hover {
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transform: translateY(-1px);
}

.btn-primary:active {
    transform: translateY(0);
}

/* Override existing gradients to be transparent/glass */
.bg-gradient-to-r, .bg-gradient-to-b, .bg-gradient-to-br {
    background-image: none !important;
    background-color: transparent !important; 
}

/* Specific overrides to remove colors and use glass */
.bg-yellow-400, .bg-yellow-500, .bg-orange-400, .bg-orange-500, .bg-purple-500, .bg-purple-600, .bg-blue-600, .bg-green-500 {
    background-color: rgba(255, 255, 255, 0.6) !important; /* Glassy white */
    color: #1f2937 !important; /* Dark text */
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    backdrop-filter: blur(5px) !important;
}

/* Text colors - Keep them distinct but softer */
.text-yellow-500, .text-yellow-400, .text-orange-500 {
    color: #d97706 !important; /* Amber-600, readable orange */
}
.text-purple-500, .text-purple-600 {
    color: #4f46e5 !important; /* Indigo-600 */
}
.text-blue-600, .text-blue-500 {
    color: #2563eb !important; /* Blue-600 */
}
.text-green-500, .text-green-600 {
    color: #059669 !important; /* Emerald-600 */
}
.text-red-500 {
    color: #dc2626 !important;
}

/* Background tints to Glass */
.bg-yellow-50, .bg-purple-50, .bg-orange-50, .bg-blue-50, .bg-green-50, .bg-red-50, .bg-gray-50, .bg-white {
    background-color: rgba(255, 255, 255, 0.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    backdrop-filter: blur(5px);
}

/* Specific fix for inputs to remain readable */
input, textarea, select {
    background-color: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid rgba(209, 213, 219, 0.5) !important; /* Gray-300 with opacity */
}
input:focus, textarea:focus, select:focus {
    background-color: #ffffff !important;
    border-color: rgba(59, 130, 246, 0.5) !important; /* Blue-500 with opacity */
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

/* Bottom Nav - Glassy */
.fixed.bottom-4 {
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05) !important;
}

/* Active Nav Item */
.text-blue-600.font-bold {
    color: #1f2937 !important; /* Dark text for active state in monochrome theme? Or keep blue accent? */
    /* Let's keep accent color for active state for usability, but use the defined text overrides */
}