/*
* ASHOKA Mobile-Specific Styles
* Additional mobile optimizations beyond Bootstrap responsive utilities
*/

/* Mobile-specific improvements for better touch experience */

/* Touch-friendly improvements */
@media (max-width: 768px) {
    /* Ensure all interactive elements are touch-friendly */
    .btn, .nav-link, .dropdown-item, .form-control, .form-select {
        min-height: 44px;
        touch-action: manipulation;
    }
    
    /* Prevent zoom on input focus (iOS) */
    input[type="text"], 
    input[type="email"], 
    input[type="password"], 
    input[type="number"],
    input[type="tel"],
    select,
    textarea {
        font-size: 16px !important;
    }
    
    /* Mobile-optimized dropdowns */
    .dropdown-menu {
        min-width: 200px;
        max-width: 90vw;
    }
    
    /* Mobile-optimized modals - simplified to prevent flickering */
    .modal-dialog {
        margin: 10px auto;
        max-width: calc(100vw - 20px);
    }
    
    .modal-body {
        padding: 1rem;
        max-height: 70vh;
        overflow-y: auto;
    }
    
    /* Remove custom backdrop CSS to prevent conflicts */
    
    /* Mobile-optimized alerts */
    .alert {
        margin-bottom: 1rem;
        padding: 1rem;
        font-size: 14px;
    }
    
    /* Mobile-optimized badges */
    .badge {
        font-size: 12px;
        padding: 6px 10px;
    }
    
    /* Mobile-optimized pagination */
    .pagination {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .pagination .page-link {
        padding: 12px 16px;
        min-width: 44px;
        text-align: center;
    }
    
    /* Mobile-optimized search */
    .search-input {
        font-size: 16px;
        padding: 12px;
    }
    
    /* Mobile-optimized DataTables */
    .dataTables_wrapper .dataTables_length,
    .dataTables_wrapper .dataTables_filter {
        margin-bottom: 1rem;
    }
    
    .dataTables_wrapper .dataTables_length select,
    .dataTables_wrapper .dataTables_filter input {
        min-height: 44px;
        font-size: 16px;
    }
    
    .dataTables_wrapper .dataTables_paginate .paginate_button {
        padding: 12px 16px;
        min-width: 44px;
    }
    
    /* Mobile-optimized tooltips */
    .tooltip {
        font-size: 12px;
    }
    
    /* Mobile-optimized popovers */
    .popover {
        max-width: 90vw;
    }
    
    /* Mobile-optimized tabs */
    .nav-tabs .nav-link {
        padding: 12px 16px;
        font-size: 14px;
    }
    
    /* Mobile-optimized accordion */
    .accordion-button {
        padding: 1rem;
        font-size: 16px;
    }
    
    /* Mobile-optimized list groups */
    .list-group-item {
        padding: 1rem;
        font-size: 16px;
    }
    
    /* Mobile-optimized breadcrumbs */
    .breadcrumb {
        font-size: 14px;
        padding: 0.75rem 1rem;
    }
    
    /* Mobile-optimized progress bars */
    .progress {
        height: 20px;
        margin-bottom: 1rem;
    }
    
    /* Mobile-optimized spinners */
    .spinner-border {
        width: 2rem;
        height: 2rem;
    }
    
    /* Mobile-optimized close buttons */
    .btn-close {
        width: 24px;
        height: 24px;
    }
    
    /* Mobile-optimized form validation */
    .invalid-feedback {
        font-size: 12px;
        margin-top: 0.25rem;
    }
    
    /* Mobile-optimized help text */
    .form-text {
        font-size: 12px;
        margin-top: 0.25rem;
    }
    
    /* Mobile-optimized input groups */
    .input-group-text {
        padding: 12px;
        font-size: 16px;
    }
    
    /* Mobile-optimized floating labels */
    .form-floating > .form-control,
    .form-floating > .form-select {
        height: 60px;
        padding-top: 1.625rem;
        padding-bottom: 0.625rem;
    }
    
    .form-floating > label {
        padding: 1rem 0.75rem;
    }
    
    /* Mobile-optimized switches */
    .form-check-input {
        width: 44px;
        height: 24px;
    }
    
    /* Mobile-optimized ranges */
    .form-range {
        height: 44px;
    }
    
    /* Mobile-optimized file inputs */
    .form-control[type="file"] {
        padding: 12px;
        font-size: 16px;
    }
    
    /* Mobile-optimized color inputs */
    .form-control[type="color"] {
        width: 60px;
        height: 44px;
    }
    
    /* Mobile-optimized date/time inputs */
    .form-control[type="date"],
    .form-control[type="time"],
    .form-control[type="datetime-local"] {
        font-size: 16px;
        padding: 12px;
    }
    
    /* Mobile-optimized number inputs */
    .form-control[type="number"] {
        font-size: 16px;
        padding: 12px;
    }
    
    /* Mobile-optimized search inputs */
    .form-control[type="search"] {
        font-size: 16px;
        padding: 12px;
    }
    
    /* Mobile-optimized tel inputs */
    .form-control[type="tel"] {
        font-size: 16px;
        padding: 12px;
    }
    
    /* Mobile-optimized url inputs */
    .form-control[type="url"] {
        font-size: 16px;
        padding: 12px;
    }
}

/* Very small screen optimizations */
@media (max-width: 480px) {
    /* Even more compact for very small screens */
    .btn, .nav-link, .dropdown-item, .form-control, .form-select {
        min-height: 40px;
        font-size: 14px;
        padding: 10px 14px;
    }
    
    /* Compact modals - simplified to prevent flickering */
    .modal-dialog {
        margin: 5px auto;
        max-width: calc(100vw - 10px);
    }
    
    .modal-body {
        padding: 0.75rem;
        max-height: 80vh;
    }
    
    /* Compact alerts */
    .alert {
        padding: 0.75rem;
        font-size: 13px;
    }
    
    /* Compact badges */
    .badge {
        font-size: 11px;
        padding: 4px 8px;
    }
    
    /* Compact pagination */
    .pagination .page-link {
        padding: 10px 14px;
        min-width: 40px;
        font-size: 14px;
    }
    
    /* Compact search */
    .search-input {
        font-size: 14px;
        padding: 10px;
    }
    
    /* Compact DataTables */
    .dataTables_wrapper .dataTables_length select,
    .dataTables_wrapper .dataTables_filter input {
        min-height: 40px;
        font-size: 14px;
    }
    
    .dataTables_wrapper .dataTables_paginate .paginate_button {
        padding: 10px 14px;
        min-width: 40px;
        font-size: 14px;
    }
    
    /* Compact tooltips */
    .tooltip {
        font-size: 11px;
    }
    
    /* Compact tabs */
    .nav-tabs .nav-link {
        padding: 10px 14px;
        font-size: 13px;
    }
    
    /* Compact accordion */
    .accordion-button {
        padding: 0.75rem;
        font-size: 14px;
    }
    
    /* Compact list groups */
    .list-group-item {
        padding: 0.75rem;
        font-size: 14px;
    }
    
    /* Compact breadcrumbs */
    .breadcrumb {
        font-size: 13px;
        padding: 0.5rem 0.75rem;
    }
    
    /* Compact progress bars */
    .progress {
        height: 16px;
        margin-bottom: 0.75rem;
    }
    
    /* Compact spinners */
    .spinner-border {
        width: 1.5rem;
        height: 1.5rem;
    }
    
    /* Compact close buttons */
    .btn-close {
        width: 20px;
        height: 20px;
    }
    
    /* Compact form validation */
    .invalid-feedback {
        font-size: 11px;
    }
    
    /* Compact help text */
    .form-text {
        font-size: 11px;
    }
    
    /* Compact input groups */
    .input-group-text {
        padding: 10px;
        font-size: 14px;
    }
    
    /* Compact floating labels */
    .form-floating > .form-control,
    .form-floating > .form-select {
        height: 56px;
        padding-top: 1.5rem;
        padding-bottom: 0.5rem;
    }
    
    .form-floating > label {
        padding: 0.75rem 0.5rem;
    }
    
    /* Compact switches */
    .form-check-input {
        width: 40px;
        height: 20px;
    }
    
    /* Compact ranges */
    .form-range {
        height: 40px;
    }
    
    /* Compact file inputs */
    .form-control[type="file"] {
        padding: 10px;
        font-size: 14px;
    }
    
    /* Compact color inputs */
    .form-control[type="color"] {
        width: 50px;
        height: 40px;
    }
    
    /* Compact date/time inputs */
    .form-control[type="date"],
    .form-control[type="time"],
    .form-control[type="datetime-local"] {
        font-size: 14px;
        padding: 10px;
    }
    
    /* Compact number inputs */
    .form-control[type="number"] {
        font-size: 14px;
        padding: 10px;
    }
    
    /* Compact search inputs */
    .form-control[type="search"] {
        font-size: 14px;
        padding: 10px;
    }
    
    /* Compact tel inputs */
    .form-control[type="tel"] {
        font-size: 14px;
        padding: 10px;
    }
    
    /* Compact url inputs */
    .form-control[type="url"] {
        font-size: 14px;
        padding: 10px;
    }
}

/* Landscape orientation optimizations */
@media (max-width: 768px) and (orientation: landscape) {
    /* Optimize for landscape mode */
    .modal-dialog {
        max-height: 90vh;
    }
    
    .modal-body {
        max-height: 60vh;
    }
    
    /* Reduce vertical spacing in landscape */
    .card {
        margin-bottom: 0.5rem;
    }
    
    .form-group {
        margin-bottom: 0.5rem;
    }
    
    /* Compact navigation in landscape */
    .navbar-nav .nav-link {
        padding: 8px 12px;
    }
}

/* High DPI display optimizations */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* Ensure crisp rendering on high DPI displays */
    .btn, .form-control, .form-select {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* Print styles for mobile */
@media print and (max-width: 768px) {
    /* Optimize for mobile printing */
    .no-print {
        display: none !important;
    }
    
    .container-fluid {
        padding: 0;
        margin: 0;
    }
    
    .card {
        border: none;
        box-shadow: none;
        margin-bottom: 1rem;
    }
    
    .table {
        font-size: 12px;
    }
    
    .table th,
    .table td {
        padding: 4px;
    }
}