/* responsive.css — capa de adaptación a teléfono y a puntero grueso.
 *
 * VIVE EN SU PROPIO ARCHIVO Y SE CARGA AL FINAL, después de theme-base.css y
 * del theme-<tema>.css activo. No es un capricho de organización: theme-base
 * declara `[data-theme-curated] .form-control { font-size: 13.5px !important }`
 * y `[data-theme-curated] .btn-sm { padding: 5px 10px !important }`. Las mismas
 * reglas escritas dentro de app.css (que se carga ANTES) pierden siempre, sin
 * importar el media query — se midió: los campos seguían en 13.5px.
 *
 * Por eso cada regla de aquí lleva la variante prefijada con
 * [data-theme-curated] y repite el !important donde el tema lo usa: es lo
 * mínimo para empatar especificidad y ganar por orden de carga.
 */

/* ---- Campos: 16px en teléfono ----
   Safari iOS hace zoom automático al enfocar un campo de menos de 16px y deja
   el viewport corrido. Es el estorbo más visible al capturar un correo en la
   pantalla de Acceso. */
@media (max-width: 768px) {
  .form-control, .form-select, .cmd-input, .campo-correo,
  [data-theme-curated] .form-control,
  [data-theme-curated] .form-select,
  [data-theme-curated] .cmd-input {
    font-size: 16px !important;
  }
}

/* ---- Objetivos táctiles ----
   La condición incluye (pointer: coarse) además del ancho: un portátil con
   pantalla táctil necesita el mismo tamaño de blanco aunque mida 1400px. */
@media (max-width: 768px), (pointer: coarse) {
  .topbar-toggle { width: 44px; height: 44px; font-size: 1.15rem; }

  .cmd-trigger,
  [data-theme-curated] .cmd-trigger {
    min-width: 44px; min-height: 44px; justify-content: center;
  }

  .btn, [data-theme-curated] .btn { min-height: 40px; }
  .btn-sm, [data-theme-curated] .btn-sm {
    min-height: 40px; padding: 8px 12px !important; font-size: 13px !important;
  }

  .sidebar-link { padding: .7rem .75rem; }

  /* Los botones de la celda Acciones se apilaban de tres en fondo y estiraban
     la fila a 110px. Dentro del envoltorio desplazable van en un solo renglón. */
  .acciones { gap: .5rem; flex-wrap: nowrap; }

  /* El checkbox nativo mide ~13px: el control más chico de toda la app y el
     único de la pantalla de Canales. */
  .chk-activo { width: 22px; height: 22px; }

  /* theme-base pinta las celdas con `[data-theme-curated] .table > :not(caption)
     > * > *` (especificidad 0-2-1); se empata y se gana por orden de carga. */
  .table th, .table td,
  [data-theme-curated] .table th,
  [data-theme-curated] .table td {
    padding: 10px 12px;
  }

  /* Dentro del envoltorio que ya se desplaza, partir el texto no gana nada:
     solo estira las filas. "Alvidrez Zavala, Monserrat del Carmen" en la
     columna Nombre levantaba la fila a ~100px de alto. Con el renglón entero
     la cuadrícula se lee de un vistazo y el ancho extra lo absorbe el
     desplazamiento horizontal, que es para lo que está. */
  .tabla-scroll .table th,
  .tabla-scroll .table td {
    white-space: nowrap;
  }
}