/* ===== MEJORAS DE RESPONSIVIDAD PARA iOS - DATATABLES ===== */

/* Media queries específicas para iOS */
@media screen and (-webkit-min-device-pixel-ratio: 2) {
    /* Para dispositivos Retina */
    .dataTables_wrapper {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    
    .dataTable {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* Media queries para iPhone */
@media only screen 
    and (min-device-width: 320px) 
    and (max-device-width: 568px)
    and (-webkit-min-device-pixel-ratio: 2) {
    
    /* Ajustes para contenedor principal de DataTables */
    .dataTables_wrapper {
        font-size: 12px;
        margin-bottom: 15px;
    }
    
    /* Ajustes para controles de DataTables */
    .dataTables_length {
        margin-bottom: 10px;
        font-size: 12px;
    }
    
    .dataTables_length select {
        font-size: 14px !important;
        -webkit-appearance: none;
        border-radius: 6px;
        min-height: 36px;
        padding: 4px 8px;
    }
    
    .dataTables_filter {
        margin-bottom: 10px;
        font-size: 12px;
    }
    
    .dataTables_filter input {
        font-size: 14px !important;
        -webkit-appearance: none;
        border-radius: 6px;
        min-height: 36px;
        padding: 4px 8px;
        width: 100%;
        max-width: 200px;
    }
    
    /* Ajustes para la tabla principal */
    .dataTable {
        font-size: 11px;
        width: 100% !important;
    }
    
    .dataTable th,
    .dataTable td {
        padding: 6px 4px;
        font-size: 10px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 120px;
    }
    
    .dataTable th {
        font-weight: 600;
        background-color: #f8f9fa;
        border-bottom: 2px solid #dee2e6;
    }
    
    /* Ajustes para información de la tabla */
    .dataTables_info {
        font-size: 11px;
        margin-top: 10px;
        text-align: center;
    }
    
    /* Ajustes para paginación */
    .dataTables_paginate {
        margin-top: 10px;
        text-align: center;
    }
    
    .dataTables_paginate .paginate_button {
        padding: 4px 8px;
        font-size: 11px;
        min-height: 32px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0 2px;
        border-radius: 4px;
    }
    
    .dataTables_paginate .paginate_button.current {
        background-color: #007bff;
        color: white;
        border: 1px solid #007bff;
    }
    
    .dataTables_paginate .paginate_button:hover {
        background-color: #e9ecef;
        border: 1px solid #dee2e6;
    }
    
    /* Ajustes para botones de DataTables */
    .dt-buttons {
        margin-bottom: 10px;
        text-align: center;
    }
    
    .dt-button {
        font-size: 12px;
        padding: 6px 12px;
        min-height: 36px;
        -webkit-appearance: none;
        border-radius: 6px;
        margin: 2px;
    }
    
    /* Ajustes para tabla responsiva */
    .table-responsive {
        font-size: 11px;
        margin-bottom: 10px;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Ajustes para procesamiento */
    .dataTables_processing {
        font-size: 12px;
        padding: 10px;
    }
    
    /* Ajustes para elementos de ordenamiento */
    .sorting,
    .sorting_asc,
    .sorting_desc {
        position: relative;
        cursor: pointer;
    }
    
    .sorting:after,
    .sorting_asc:after,
    .sorting_desc:after {
        content: '';
        position: absolute;
        right: 4px;
        top: 50%;
        transform: translateY(-50%);
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
    }
    
    .sorting:after {
        border-bottom: 4px solid #999;
        margin-top: -2px;
    }
    
    .sorting_asc:after {
        border-bottom: 4px solid #333;
        margin-top: -2px;
    }
    
    .sorting_desc:after {
        border-top: 4px solid #333;
        margin-top: 2px;
    }
}

/* Media queries para iPhone Plus y dispositivos más grandes */
@media only screen 
    and (min-device-width: 414px) 
    and (max-device-width: 736px)
    and (-webkit-min-device-pixel-ratio: 3) {
    
    .dataTables_wrapper {
        font-size: 13px;
        margin-bottom: 20px;
    }
    
    .dataTables_length {
        margin-bottom: 12px;
        font-size: 13px;
    }
    
    .dataTables_length select {
        font-size: 14px !important;
        min-height: 40px;
        padding: 6px 10px;
    }
    
    .dataTables_filter {
        margin-bottom: 12px;
        font-size: 13px;
    }
    
    .dataTables_filter input {
        font-size: 14px !important;
        min-height: 40px;
        padding: 6px 10px;
        max-width: 250px;
    }
    
    .dataTable {
        font-size: 12px;
    }
    
    .dataTable th,
    .dataTable td {
        padding: 8px 6px;
        font-size: 11px;
        max-width: 150px;
    }
    
    .dataTables_info {
        font-size: 12px;
        margin-top: 12px;
    }
    
    .dataTables_paginate .paginate_button {
        padding: 6px 10px;
        font-size: 12px;
        min-height: 36px;
        margin: 0 3px;
    }
    
    .dt-button {
        font-size: 13px;
        padding: 8px 14px;
        min-height: 40px;
        margin: 3px;
    }
}

/* Media queries para iPad */
@media only screen 
    and (min-device-width: 768px) 
    and (max-device-width: 1024px)
    and (-webkit-min-device-pixel-ratio: 2) {
    
    .dataTables_wrapper {
        font-size: 14px;
        margin-bottom: 25px;
    }
    
    .dataTables_length {
        margin-bottom: 15px;
        font-size: 14px;
    }
    
    .dataTables_length select {
        font-size: 14px !important;
        min-height: 44px;
        padding: 8px 12px;
    }
    
    .dataTables_filter {
        margin-bottom: 15px;
        font-size: 14px;
    }
    
    .dataTables_filter input {
        font-size: 14px !important;
        min-height: 44px;
        padding: 8px 12px;
        max-width: 300px;
    }
    
    .dataTable {
        font-size: 13px;
    }
    
    .dataTable th,
    .dataTable td {
        padding: 10px 8px;
        font-size: 12px;
        max-width: 200px;
    }
    
    .dataTables_info {
        font-size: 13px;
        margin-top: 15px;
    }
    
    .dataTables_paginate .paginate_button {
        padding: 8px 12px;
        font-size: 13px;
        min-height: 40px;
        margin: 0 4px;
    }
    
    .dt-button {
        font-size: 14px;
        padding: 10px 16px;
        min-height: 44px;
        margin: 4px;
    }
}

/* Ajustes específicos para Safari en iOS */
@supports (-webkit-touch-callout: none) {
    .dataTables_wrapper {
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
    }
    
    .dataTable {
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
    }
    
    .dataTables_length select,
    .dataTables_filter input {
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
    }
    
    .dt-button {
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
    }
    
    .dataTables_paginate .paginate_button {
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
    }
    
    .table-responsive {
        -webkit-overflow-scrolling: touch;
    }
}

/* Ajustes para orientación landscape en iOS */
@media screen and (orientation: landscape) and (max-height: 500px) {
    .dataTables_wrapper {
        font-size: 11px;
        margin-bottom: 10px;
    }
    
    .dataTables_length {
        margin-bottom: 8px;
        font-size: 11px;
    }
    
    .dataTables_length select {
        font-size: 14px !important;
        min-height: 32px;
        padding: 3px 6px;
    }
    
    .dataTables_filter {
        margin-bottom: 8px;
        font-size: 11px;
    }
    
    .dataTables_filter input {
        font-size: 14px !important;
        min-height: 32px;
        padding: 3px 6px;
        max-width: 150px;
    }
    
    .dataTable {
        font-size: 10px;
    }
    
    .dataTable th,
    .dataTable td {
        padding: 4px 3px;
        font-size: 9px;
        max-width: 80px;
    }
    
    .dataTables_info {
        font-size: 10px;
        margin-top: 8px;
    }
    
    .dataTables_paginate .paginate_button {
        padding: 3px 6px;
        font-size: 10px;
        min-height: 28px;
        margin: 0 1px;
    }
    
    .dt-button {
        font-size: 11px;
        padding: 4px 8px;
        min-height: 32px;
        margin: 1px;
    }
}

/* Mejoras para elementos interactivos específicos en iOS */
@media only screen 
    and (min-device-width: 320px) 
    and (max-device-width: 568px)
    and (-webkit-min-device-pixel-ratio: 2) {
    
    /* Ajustes para botones de exportación */
    .buttons-collection {
        font-size: 12px;
        border-radius: 6px;
    }
    
    .buttons-collection .dt-button {
        font-size: 12px;
        padding: 8px 12px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Ajustes para tooltips de DataTables */
    .dataTables_wrapper .tooltip {
        font-size: 10px;
    }
    
    /* Ajustes para elementos de búsqueda avanzada */
    .dtsb-data {
        font-size: 12px;
    }
    
    .dtsb-title {
        font-size: 13px;
        font-weight: 600;
    }
    
    .dtsb-titleRow {
        margin-bottom: 8px;
    }
    
    .dtsb-titleRow select,
    .dtsb-titleRow input {
        font-size: 14px !important;
        min-height: 36px;
        padding: 4px 8px;
        border-radius: 6px;
        -webkit-appearance: none;
    }
}

/* Ajustes para impresión de DataTables en iOS */
@media print and (-webkit-min-device-pixel-ratio: 2) {
    .dataTables_wrapper {
        font-size: 10pt;
    }
    
    .dataTable {
        font-size: 9pt !important;
        width: 100% !important;
    }
    
    .dataTable th,
    .dataTable td {
        padding: 3px 4px !important;
        font-size: 8pt !important;
        border: 1px solid #000 !important;
    }
    
    .dataTables_length,
    .dataTables_filter,
    .dataTables_paginate,
    .dt-buttons {
        display: none !important;
    }
    
    .dataTables_info {
        font-size: 9pt !important;
        text-align: center !important;
    }
}

/* Ajustes para contenedores responsivos de DataTables */
@media only screen 
    and (min-device-width: 320px) 
    and (max-device-width: 568px)
    and (-webkit-min-device-pixel-ratio: 2) {
    
    /* Ajustes para múltiples tablas en una página */
    .datatables-container {
        margin-bottom: 20px;
    }
    
    .datatables-container .dataTables_wrapper {
        margin-bottom: 15px;
    }
    
    /* Ajustes para tablas con scroll horizontal */
    .dataTables_scroll {
        -webkit-overflow-scrolling: touch;
    }
    
    .dataTables_scrollHead {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .dataTables_scrollBody {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Ajustes para tablas con columnas fijas */
    .DTFC_Cloned {
        font-size: 11px;
    }
    
    .DTFC_Cloned th,
    .DTFC_Cloned td {
        padding: 6px 4px;
        font-size: 10px;
    }
}

/* Ajustes para DataTables en iPad */
@media only screen 
    and (min-device-width: 768px) 
    and (max-device-width: 1024px)
    and (-webkit-min-device-pixel-ratio: 2) {
    
    .datatables-container {
        margin-bottom: 30px;
    }
    
    .datatables-container .dataTables_wrapper {
        margin-bottom: 20px;
    }
}