.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.hero-gradient {
    background: linear-gradient(rgba(11, 78, 107, 0.4), rgba(11, 78, 107, 0.7)), url('/images/bg_1.webp');
    background-size: cover;
    background-position: center;
}

.whisper-shadow {
    box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.05);
}

.text-balance {
    text-wrap: balance;
}

.custom-scrollbar::-webkit-scrollbar {
    height: 4px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #C5A059;
    border-radius: 10px;
}

.app-gradient {
    background: radial-gradient(circle at top right, rgba(197, 160, 89, 0.05), transparent), radial-gradient(circle at bottom left, rgba(11, 78, 107, 0.03), transparent);
}

.fb-community-gradient {
    background: linear-gradient(135deg, rgba(24, 119, 242, 0.05) 0%, rgba(255, 255, 255, 1) 100%);
}

.dark .fb-community-gradient {
    background: linear-gradient(135deg, rgba(24, 119, 242, 0.1) 0%, rgba(27, 30, 34, 1) 100%);
}

.search-glass {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.dark .search-glass {
    background: rgba(27, 30, 34, 0.85);
    backdrop-filter: blur(20px);
}

.gold-glow {
    box-shadow: 0 0 20px rgba(197, 160, 89, 0.4);
}

.gold-glow:hover {
    box-shadow: 0 0 30px rgba(197, 160, 89, 0.6);
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
}