/* Samsung Device Compatibility Fixes */

/* Fix for Samsung Internet Browser and older Android WebView */
@supports not (backdrop-filter: blur(10px)) {
    /* Fallback for backdrop-filter */
    .navbar-enhanced,
    .display-header,
    .queue-section,
    .stats-card,
    .stats-card-enhanced,
    .stats-item,
    .hero-nav-btn {
        background: rgba(255, 255, 255, 0.95) !important;
        border: 1px solid rgba(0, 0, 0, 0.1) !important;
    }
    
    /* Dark backgrounds for better contrast */
    .queue-section,
    .stats-card,
    .stats-card-enhanced {
        background: rgba(248, 249, 250, 0.95) !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
    }
}

/* Samsung Internet specific fixes */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    /* Fix for touch interactions */
    .btn, .form-control, .card {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        user-select: none;
    }
    
    /* Fix for input focus on Samsung keyboards */
    .form-control:focus {
        transform: none !important;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }
}

/* Fix for Samsung Galaxy viewport issues */
@media screen and (max-width: 480px) {
    /* Ensure proper scaling on small Samsung devices */
    .container-fluid {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    /* Fix for Samsung Edge browser button spacing */
    .btn-group .btn {
        margin: 1px !important;
        border-radius: 4px !important;
    }
    
    /* Fix for Samsung keyboard overlay issues */
    .bottom-nav {
        position: fixed !important;
        bottom: 0 !important;
        z-index: 9999 !important;
    }
    
    /* Prevent zoom on input focus (Samsung specific) */
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="password"],
    select,
    textarea {
        font-size: 16px !important;
        max-width: 100% !important;
    }
}

/* Samsung One UI compatibility - removed dark mode support */

/* Fix for Samsung Internet scrolling issues */
.queue-container,
.queue-body {
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
}

/* Fix for Samsung Galaxy S series notch/cutout */
@supports (padding: max(0px)) {
    .navbar {
        padding-left: max(15px, env(safe-area-inset-left)) !important;
        padding-right: max(15px, env(safe-area-inset-right)) !important;
    }
    
    .bottom-nav {
        padding-left: max(15px, env(safe-area-inset-left)) !important;
        padding-right: max(15px, env(safe-area-inset-right)) !important;
        padding-bottom: max(15px, env(safe-area-inset-bottom)) !important;
    }
}

/* Fix for Samsung DeX mode (desktop mode on mobile) */
@media screen and (min-width: 768px) and (pointer: coarse) {
    .btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }
    
    .form-control {
        min-height: 44px !important;
        padding: 8px 12px !important;
    }
}

/* Fix for Samsung Internet Reader Mode */
.queue-item,
.card,
.alert {
    page-break-inside: avoid;
    break-inside: avoid;
}

/* Fix for Samsung Galaxy Fold and flexible displays */
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    .col-md-6 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-bottom: 1rem !important;
    }
}

/* Performance optimizations for Samsung devices */
.queue-item,
.stats-card,
.card {
    will-change: auto;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
}

/* Fix for Samsung Internet form validation */
.was-validated .form-control:invalid,
.form-control.is-invalid {
    background-image: none !important;
}

.was-validated .form-control:valid,
.form-control.is-valid {
    background-image: none !important;
}

/* Fix for Samsung Galaxy Tab landscape mode */
@media screen and (min-width: 768px) and (orientation: landscape) {
    .queue-section {
        height: calc(100vh - 200px) !important;
        max-height: 600px !important;
    }
}
