/* movil.css — BolsaTrader en pantallas estrechas (móvil). La pone inc/bt.php en todas las páginas HTML, con movil.js.
   Solo hasta 760 px: en escritorio no cambia nada. Las páginas son las de siempre (tablas con anchos fijos); aquí solo
   lo que vale para todas: nada más ancho que la pantalla, y lo que movil.js marca:
   .bt-apila   tabla de maquetación (con tablas dentro) que no cabe: sus celdas, una debajo de otra
   .bt-desliza tabla de datos que no cabe: se desliza de lado ella sola, no la página entera */
@media (max-width: 760px) {
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { margin-left: 0 !important; margin-right: 0 !important; overflow-x: auto; }
  img { max-width: 100%; height: auto; }
  iframe, embed, object, video, input, select, textarea, div { max-width: 100%; }
  input, select, textarea, button { font-size: 16px; }   /* menos de 16 px: iOS se acerca solo al escribir */

  .bt-apila, .bt-apila > tbody, .bt-apila > thead, .bt-apila > tfoot,
  .bt-apila > tr, .bt-apila > tbody > tr, .bt-apila > thead > tr, .bt-apila > tfoot > tr,
  .bt-apila > tr > td, .bt-apila > tr > th, .bt-apila > tbody > tr > td, .bt-apila > tbody > tr > th,
  .bt-apila > thead > tr > td, .bt-apila > thead > tr > th, .bt-apila > tfoot > tr > td {
    display: block; width: auto !important; max-width: 100%; box-sizing: border-box;
  }
  .bt-apila > tr > td, .bt-apila > tbody > tr > td, .bt-apila > thead > tr > td { height: auto !important; }

  table.bt-desliza { display: block; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; max-width: 100%; width: auto !important; }
}