/**
 * TADİS Native App Mode CSS
 *
 * Minimal interference CSS for better browser compatibility
 * Works on iOS, Android, and Desktop browsers
 * Supports both portrait and landscape orientations
 */

/* Basic resets only */
html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow-x: hidden; /* Prevent horizontal scroll only */
    -webkit-text-size-adjust: 100%; /* Prevent text size adjustment on iOS */
}

body {
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh; /* Dynamic viewport height */
    overscroll-behavior-y: none; /* Prevent pull-to-refresh */
    -webkit-overflow-scrolling: touch;
}

/* iOS-specific viewport fix */
@supports (-webkit-touch-callout: none) {
    body {
        min-height: -webkit-fill-available;
    }
}

/* Prevent tap highlight on touch devices */
* {
    -webkit-tap-highlight-color: transparent;
}

/* Allow text selection for inputs only */
input,
textarea {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

/* Prevent zoom on input focus (iOS) */
@media screen and (max-width: 768px) {
    input,
    textarea,
    select {
        font-size: 16px !important;
    }
}

/* Hide scrollbars but keep scroll functionality */
::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

* {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

/* Fullscreen mode styles */
:fullscreen,
:-webkit-full-screen,
:-moz-full-screen,
:-ms-fullscreen {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

/* PWA standalone mode - only apply when installed */
@media (display-mode: standalone) {
    html {
        background-color: #4A6FA5;
    }

    body {
        overscroll-behavior: none; /* Full prevention when installed */
    }
}

@media (display-mode: fullscreen) {
    html {
        background-color: #4A6FA5;
    }

    body {
        overscroll-behavior: none;
    }
}

/* Safe area insets for notched devices (iOS) */
@supports (padding: env(safe-area-inset-top)) {
    body {
        padding-top: env(safe-area-inset-top);
        padding-right: env(safe-area-inset-right);
        padding-bottom: env(safe-area-inset-bottom);
        padding-left: env(safe-area-inset-left);
    }
}
