/* Mobile UI Fixes - Only essential fixes */

/* 1. Hide problematic SVG wave decorations on mobile */
@media (max-width: 768px) {
    /* Hide specific SVG waves that cause layout issues */
    svg[viewBox="0 0 1440 320"] {
        display: none !important;
    }
    
    /* Hide decorative SVG elements in hero sections */
    .hero-section svg[viewBox*="1440"],
    .absolute.bottom-0 svg[viewBox*="1440"] {
        display: none !important;
    }
     
    /* Clean section transitions without broken waves */
    section.relative {
        overflow: hidden;
    }
}

/* 2. Login page specific fixes - Only apply to login pages */
@media (max-width: 768px) {
    /* Fix login page background gradients - Only for login pages */
    body.login-page .bg-gradient-to-br {
        background: linear-gradient(135deg, #f9a8d4 0%, #f472b6 100%) !important;
    }
    
    /* Ana sayfa hero section'ı mobilde düzgün görünsün - inline style'ı override et */
    .hero-section[style] {
        background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
    }
    
    /* Login form mobile improvements */
    .login-page input[type="email"],
    .login-page input[type="password"],
    .login-page input[type="text"] {
        font-size: 16px !important; /* Prevents zoom on iOS */
    }
    
    /* Make login tabs more mobile-friendly */
    .login-page .flex.space-x-1 {
        display: flex !important;
        width: 100% !important;
        gap: 0 !important;
    }
    
    .login-page .flex.space-x-1 a,
    .login-page .flex.space-x-1 button {
        flex: 1 !important;
        text-align: center !important;
        padding: 12px 8px !important;
    }
}

/* 3. Prevent horizontal scroll - Only for body/html */
@media (max-width: 768px) {
    body, html {
        overflow-x: hidden;
        max-width: 100vw;
    }
}

/* 4. Image responsiveness - Basic fix */
@media (max-width: 768px) {
    img {
        max-width: 100%;
        height: auto;
    }
}

/* That's it - no more aggressive rules that break the layout */