/* =======================
   Smartphones pequeños (vertical, < 576px)
   ======================= */
@media (max-width: 575.98px) {
    /* Ejemplo: ocultar una columna de DataTable */
    .datatable-hide-mobile {
        display: none !important;
    }
}

/* =======================
   Smartphones grandes (horizontal, >= 576px)
   ======================= */
@media (min-width: 576px) and (max-width: 767.98px) {
    /* Reglas específicas para móviles en apaisado */
}

/* =======================
   Tablets (vertical, >= 768px)
   ======================= */
@media (min-width: 768px) and (max-width: 991.98px) {
    /* Ejemplo: ajustar padding o fuentes */
}

/* =======================
   Escritorios pequeños (>= 992px)
   ======================= */
@media (min-width: 992px) and (max-width: 1199.98px) {
    /* Ajustes para pantallas medianas/grandes */
}

/* =======================
   Escritorios grandes (>= 1200px)
   ======================= */
@media (min-width: 1200px) {
    /* Aquí entran monitores grandes */
}

/* =======================
   Orientación: retrato
   ======================= */
@media screen and (orientation: portrait) {
    /* Reglas para dispositivos en vertical */
}

/* =======================
   Orientación: apaisado
   ======================= */
@media screen and (orientation: landscape) {
    /* Reglas para dispositivos en horizontal */
}