/**
 * Frontend Fixes - Resolves spacing and display issues
 * Created: 2025-11-12
 * Purpose: Quick fixes for reported frontend issues
 */

/* Fix 1: Reduce excessive padding between header and main content */
.main-content {
    padding-top: 20px !important;
    margin-top: 0 !important;
}

/* Fix 2: Ensure theme dropdown has proper z-index */
.theme-dropdown-nav {
    z-index: 10000 !important;  /* Above all content */
    position: fixed;
    background: var(--bg-secondary, rgba(20, 20, 20, 0.98));
    backdrop-filter: blur(10px);
}

.theme-dropdown-nav.active {
    display: block !important;
}

/* Fix 3: Improve stat card appearance */
.stat-card {
    background: linear-gradient(
        135deg,
        rgba(var(--accent-primary-rgb, 156, 39, 176), 0.08) 0%,
        rgba(var(--bg-secondary-rgb, 26, 26, 26), 0.95) 100%
    ) !important;
    border: 1px solid rgba(var(--accent-primary-rgb, 156, 39, 176), 0.3);
}

.stat-card:hover {
    background: linear-gradient(
        135deg,
        rgba(var(--accent-primary-rgb, 156, 39, 176), 0.15) 0%,
        rgba(var(--bg-secondary-rgb, 26, 26, 26), 0.95) 100%
    ) !important;
}

/* Fix 4: Reduce header glow effect */
.landing-header h1,
.hero-title {
    text-shadow: 0 0 10px rgba(var(--accent-primary-rgb, 156, 39, 176), 0.4) !important;
    /* Reduced from multiple stacked shadows */
}

/* Fix 5: Fix header spacing on dashboard */
.dashboard .main-content,
#dashboard.main-content {
    padding-top: 30px !important;
}

/* Fix 6: Profile page spacing adjustments */
.profile-container {
    padding-top: 20px !important;
}

/* Fix 7: Remove "user" prefix if it appears */
.username-display::before {
    content: "" !important;  /* Override any "user" prefix */
}

/* Fix 8: Ensure proper contrast for path chooser buttons */
.path-card:hover {
    background: rgba(var(--accent-primary-rgb, 156, 39, 176), 0.1);
    color: var(--text-primary, #ffffff) !important;
}

/* Fix 9: Theme selector button in header - better visibility */
.theme-btn-nav {
    background: rgba(var(--accent-primary-rgb, 156, 39, 176), 0.1);
    border: 1px solid var(--accent-primary, #9C27B0);
    padding: 8px 16px;
    border-radius: 25px;
    transition: all 0.3s ease;
}

.theme-btn-nav:hover {
    background: rgba(var(--accent-primary-rgb, 156, 39, 176), 0.2);
    transform: translateY(-1px);
}

/* Fix 10: Login page improvements */
.login-container,
.register-container {
    max-width: 500px;
    margin: 50px auto;
}

.login-card,
.register-card {
    background: rgba(var(--bg-secondary-rgb, 26, 26, 26), 0.95) !important;
    backdrop-filter: blur(20px);
    border: 1px solid var(--accent-primary, #9C27B0);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

/* Fix 11: Achievement page dropdown z-index */
.achievements-search .theme-dropdown,
.avatar-page .theme-dropdown {
    z-index: 10001 !important;
}

/* Fix 12: Remove excessive glow from cards globally */
.card, .post-card, .profile-card,
.achievement-card, .win-card, .group-card {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
}

.card:hover, .post-card:hover, .profile-card:hover,
.achievement-card:hover, .win-card:hover, .group-card:hover {
    box-shadow: 0 4px 15px rgba(var(--accent-primary-rgb, 156, 39, 176), 0.2) !important;
}

/* Fix 13: Ensure landing page doesn't have extra top space */
body.path-neon-dreams .hero,
body[class*="path-"] .hero {
    margin-top: 0 !important;
    padding-top: 60px !important;
}

/* Fix 14: Fix potential duplicate button spacing */
.post-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.post-actions button {
    flex: 0 0 auto;
}

/* Fix 15: Mobile responsive fixes */
@media (max-width: 768px) {
    .main-content {
        padding-top: 10px !important;
    }

    .hero {
        padding-top: 40px !important;
    }

    .stat-card {
        padding: 30px !important;
    }
}