/* ============================================================
   MÓVIL COMPACTO (≤ 767px) — escala tipográfica y espaciados únicos
   para todo el panel. Se carga al final de los estilos para ganar a
   AdminLTE / responsive.css / mobile-pro.css / arounda-soft.css.

   Escala (solo celular):
     11px  ayudas, badges, botones de emisión rápida
     12px  etiquetas de formulario, tablas
     13px  texto base, botones, totales
     14px  campos de formulario, títulos de caja (h4)
     15px  títulos de sección (h3), botón principal de guardar
     17px  título de página / saludo (h1, h2)
     18px  cifras destacadas (KPI, totales grandes)
   Alturas: campos y botones 38px; botón principal 44px; botones xs 28px.
   ============================================================ */
@media (max-width: 767px) {

  /* ---------- Texto base ---------- */
  body, .content-wrapper { font-size: 13px !important; }
  .content-wrapper p { font-size: 13px; margin-bottom: 6px; }
  .content-wrapper small, .content-wrapper .help-block, .content-wrapper .text-muted small,
  .content-wrapper .small, .content-wrapper .ruta, .content-wrapper .label, .content-wrapper .badge {
    font-size: 11px !important;
  }
  .content-wrapper .badge-grande { font-size: 12px !important; padding: 4px 8px !important; }

  /* ---------- Títulos ---------- */
  .content-wrapper h1 { font-size: 17px !important; margin: 6px 0 !important; }
  .content-wrapper h2 { font-size: 16px !important; margin: 6px 0 !important; }
  .content-wrapper h3 { font-size: 15px !important; margin: 6px 0 !important; }
  .content-wrapper h4, .content-wrapper h5, .content-wrapper .box-title,
  .content-wrapper .oc-card h4, .content-wrapper .modal-title {
    font-size: 14px !important; margin: 4px 0 8px !important;
  }
  .ip-hero__welcome h2 { font-size: 17px !important; }
  .ip-hero__welcome p, .vp-hero__title p { font-size: 12px !important; }
  .vp-hero__title h2 { font-size: 15px !important; }
  .content-wrapper strong[style*="font-size"], .content-wrapper b[style*="font-size"] { font-size: 14px !important; }
  /* asteriscos de "obligatorio" escritos con estilo en línea (crear-guia) */
  .content-wrapper label span[style*="font-size"] { font-size: 13px !important; }

  /* ---------- Cifras destacadas (KPI) ---------- */
  .content-wrapper .mw-value, .content-wrapper .gp-val, .content-wrapper .valor-principal,
  .content-wrapper .info-box-number, .content-wrapper .small-box .inner h3,
  .content-wrapper .ocl-res .r b, .content-wrapper .oc-tot .total,
  .content-wrapper .kpi-valor, .content-wrapper .kpi-value, .content-wrapper .stat-value,
  .content-wrapper .box.box-solid .box-body h3, .content-wrapper .widget-user-header h3 {
    font-size: 18px !important; line-height: 1.2 !important;
  }
  .content-wrapper .info-box-text, .content-wrapper .small-box .inner p,
  .content-wrapper .gp-lbl, .content-wrapper .mw-label { font-size: 11px !important; }
  .content-wrapper .info-box-icon { font-size: 26px !important; width: 56px !important; height: 56px !important; line-height: 56px !important; }
  .content-wrapper .info-box-content { padding: 4px 8px !important; margin-left: 56px !important; }

  /* ---------- Etiquetas y campos ---------- */
  .content-wrapper label, .panel-medio-principal label, .panel-medio-principal .lbl-text {
    font-size: 12px !important; font-weight: 600 !important; margin-bottom: 3px !important; line-height: 1.2 !important;
  }
  .content-wrapper .form-control,
  .content-wrapper input[type="text"], .content-wrapper input[type="number"], .content-wrapper input[type="email"],
  .content-wrapper input[type="tel"], .content-wrapper input[type="date"], .content-wrapper input[type="password"],
  .content-wrapper input[type="search"], .content-wrapper select, .content-wrapper select.form-control,
  .panel-medio-principal .form-control, .panel-medio-principal select.form-control {
    font-size: 14px !important;
    min-height: 38px !important;
    height: 38px !important;
    padding: 6px 10px !important;
    line-height: 1.3 !important;
    border-radius: 8px !important;
  }
  .content-wrapper textarea.form-control, .panel-medio-principal textarea.form-control {
    height: auto !important; min-height: 60px !important; font-size: 14px !important; padding: 8px 10px !important;
  }
  .content-wrapper .input-group-addon { padding: 6px 9px !important; font-size: 13px !important; min-height: 38px !important; }
  .content-wrapper .input-group-btn .btn { min-height: 38px !important; height: 38px !important; }
  .content-wrapper .form-group { margin-bottom: 8px !important; }
  .content-wrapper .checkbox, .content-wrapper .radio { margin: 4px 0 !important; }

  /* Select2 */
  .content-wrapper .select2-container,
  .panel-medio-principal .select2-container { width: 100% !important; max-width: 100% !important; }
  .content-wrapper .select2-container .select2-selection--single,
  .panel-medio-principal .select2-container .select2-selection--single {
    min-height: 38px !important; height: 38px !important; border-radius: 8px !important;
  }
  .content-wrapper .select2-container .select2-selection--single .select2-selection__rendered,
  .panel-medio-principal .select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 36px !important; font-size: 14px !important; padding-left: 10px !important;
  }
  .content-wrapper .select2-container .select2-selection--single .select2-selection__arrow,
  .panel-medio-principal .select2-container .select2-selection--single .select2-selection__arrow { height: 36px !important; }
  .select2-results__option { font-size: 14px !important; padding: 7px 10px !important; }

  /* Campos cortos en pareja (col-md-1 / col-md-2 y los que ya traen col-xs-6) */
  .panel-medio-principal .col-md-1, .panel-medio-principal .col-md-2,
  .panel-medio-principal [class*="col-md-"].col-xs-6 {
    width: 50% !important; float: left !important;
  }
  .panel-medio-principal .col-md-1[style*="margin-top"], .panel-medio-principal .col-md-2[style*="margin-top"] {
    margin-top: 18px !important;   /* botones alineados a un campo: antes 25px de escritorio */
  }

  /* ---------- Botones ---------- */
  .content-wrapper .btn, .content-wrapper button.btn, .panel-medio-principal .btn,
  .panel-medio-principal .btn-default, .panel-medio-principal .btn-primary, .panel-medio-principal .btn-success,
  .panel-medio-principal .btn-danger, .panel-medio-principal .btn-warning, .panel-medio-principal .btn-info {
    min-height: 38px !important;
    padding: 7px 12px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    border-radius: 8px !important;
  }
  .content-wrapper .btn-sm, .panel-medio-principal .btn-sm { min-height: 32px !important; padding: 5px 10px !important; font-size: 12px !important; }
  .content-wrapper .btn-xs, .panel-medio-principal .btn-xs,
  .content-wrapper table .btn, .panel-medio-principal table .btn {
    min-height: 28px !important; padding: 3px 8px !important; font-size: 12px !important;
  }
  /* botón principal de guardar y de vaciar: 44px, no 58-65px */
  .panel-medio-principal .btnGuardarVenta, .panel-medio-principal .btnGuardarGuia,
  .panel-medio-principal .btnGuardarCompra, .panel-medio-principal .btnEliminarCarro,
  .panel-medio-principal .btnGuardarCotizacion, .panel-medio-principal .btnGuardarNota,
  .content-wrapper .btn-lg, .panel-medio-principal .btn-lg,
  .content-wrapper .btn-fac, .content-wrapper .btn-bol {
    min-height: 44px !important; height: auto !important; max-height: none !important;
    padding: 9px 14px !important; font-size: 15px !important; line-height: 1.2 !important;
  }
  .panel-medio-principal .btnEliminarCarro { font-size: 15px !important; }
  .panel-medio-principal .contenedor-btns-carrito { padding: 8px 6px !important; }
  /* botones de emisión rápida (cabecera azul y hero de ventas): mismo tamaño */
  .content-header.dashboard-header .btns-dash .btns-dash-modern a,
  .dashboard-header-modern .btns-dash-modern a,
  .vp-hero__actions a, .ip-emit-actions a {
    font-size: 11px !important;
  }
  .vp-hero__actions .btn-fac, .vp-hero__actions .btn-bol { min-height: 44px !important; padding: 6px 2px !important; font-size: 11px !important; }

  /* ---------- Tablas ---------- */
  .content-wrapper table td, .content-wrapper table th,
  .content-wrapper .table > tbody > tr > td, .content-wrapper .table > thead > tr > th {
    font-size: 12px !important; padding: 6px 5px !important; line-height: 1.3 !important;
  }
  .content-wrapper .tabla-items, .content-wrapper .tabla-items th, .content-wrapper .tabla-items td,
  .content-wrapper .tabla-items thead th, .content-wrapper .tabla-items tbody td {
    font-size: 12px !important; padding: 5px 4px !important;
  }
  .content-wrapper .tabla-totales, .content-wrapper .tabla-totales td, .content-wrapper .tabla-totales th {
    font-size: 13px !important; padding: 5px 6px !important;
  }
  .content-wrapper .tabla-totales td[style*="font-size"], .content-wrapper .tabla-totales tr.total td,
  .content-wrapper .tabla-totales .op-total td, .content-wrapper .tabla-totales td.total {
    font-size: 15px !important; font-weight: 700 !important;
  }
  .content-wrapper .tabla-totales input, .content-wrapper .tabla-totales .form-control {
    height: 32px !important; min-height: 32px !important; font-size: 13px !important; padding: 4px 8px !important; text-align: right;
  }
  .content-wrapper .table-responsive { margin-bottom: 8px !important; }
  /* tablas sueltas (sin .table-responsive) no deben ensanchar la página */
  .content-wrapper table.table:not(.dataTable):not(.tabla-items):not(.tabla-totales):not(.oc-items) {
    display: block; overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch;
  }
  .content-wrapper .dataTables_wrapper .dataTables_length select { min-height: 34px !important; height: 34px !important; }
  .content-wrapper .dataTables_wrapper .dataTables_filter input { min-height: 36px !important; height: 36px !important; }
  .content-wrapper .dataTables_wrapper .dataTables_info, .content-wrapper .dataTables_wrapper .dataTables_paginate { font-size: 12px !important; }
  .content-wrapper .dataTables_wrapper .paginate_button { min-height: 32px !important; padding: 4px 9px !important; }

  /* Filas "tarjeta" de DataTables responsive: datos en línea, botones de acción uno junto a otro */
  .content-wrapper .dtr-details { width: 100%; }
  .content-wrapper .dtr-details > li { padding: 3px 0 !important; border-bottom: 1px solid #f1f5f9 !important; }
  .content-wrapper .dtr-details .dtr-title { min-width: 92px !important; font-size: 11px !important; font-weight: 600 !important; }
  .content-wrapper .dtr-details .dtr-data { font-size: 12px !important; }
  .content-wrapper .dtr-details .dtr-data .btn,
  .content-wrapper .dtr-details .dtr-data button {
    display: inline-flex !important; width: auto !important; min-width: 36px; margin: 2px 2px 2px 0 !important;
  }
  .content-wrapper .dtr-details .dtr-data img { max-height: 44px !important; width: auto !important; }
  .content-wrapper .dtr-details .dtr-data .progress { margin: 0 !important; height: 18px !important; }

  /* ---------- Cajas y espaciados ---------- */
  .content-wrapper .box, .content-wrapper .box-body, .content-wrapper .panel-medio,
  .content-wrapper .oc-card, .content-wrapper .ocl-card, .content-wrapper .vp-card, .content-wrapper .ip-card,
  .content-wrapper .box-modern, .content-wrapper .card {
    padding: 10px !important; margin-bottom: 10px !important;
  }
  .content-wrapper .box-header, .content-wrapper .box-header.with-border { padding: 8px 10px !important; }
  .content-wrapper .box-footer { padding: 8px 10px !important; }
  .content-wrapper hr { margin: 8px 0 !important; }
  .content-wrapper .panel-medio-principal { padding: 6px !important; }
  .content-wrapper .nav-tabs > li > a { padding: 8px 10px !important; font-size: 13px !important; }
  .content-wrapper .alert { padding: 8px 10px !important; font-size: 12px !important; margin-bottom: 8px !important; }
  .content-wrapper .progress { height: 18px !important; }
  .content-wrapper .progress-bar { font-size: 11px !important; line-height: 18px !important; }

  /* Hero de Inicio y Ventas más bajos */
  .ip-hero { padding: 14px !important; gap: 10px !important; margin-bottom: 10px !important; }
  .ip-hero__actions a { padding: 8px 6px !important; font-size: 13px !important; }
  .vp-hero { padding: 10px 12px !important; gap: 8px !important; }
  .vp-legend { flex-wrap: wrap !important; gap: 6px !important; padding: 8px 10px !important; }
  .vp-legend__item { white-space: normal !important; font-size: 11px !important; padding: 4px 8px !important; }

  /* Buscadores de inventario/kardex: todo en una columna, sin desborde */
  .content-wrapper .contenedor-busqueda, .content-wrapper .input-group-search, .content-wrapper .input-group-searchkardex {
    display: flex !important; flex-wrap: wrap !important; gap: 6px !important; width: 100% !important;
  }
  .content-wrapper .contenedor-busqueda .input-search, .content-wrapper .input-group-search .input-search,
  .content-wrapper .input-group-searchkardex .input-search, .content-wrapper .contenedor-busqueda select {
    width: 100% !important; flex: 1 1 100% !important; margin-left: 0 !important;
  }

  /* Modales: mismo tamaño de texto que el resto */
  .modal-body, .modal-body label, .modal-body .form-control { font-size: 13px !important; }
  .modal-body .form-control { font-size: 14px !important; min-height: 38px !important; height: 38px !important; }
  .modal-body textarea.form-control { height: auto !important; }
  .modal-body .form-group { margin-bottom: 8px !important; }
  .modal-footer .btn { min-height: 38px !important; }

  /* SweetAlert */
  .swal2-popup { font-size: 13px !important; }
  .swal2-title { font-size: 17px !important; }
  .swal2-html-container { font-size: 13px !important; }
  .swal2-styled { font-size: 13px !important; padding: 8px 16px !important; }
  .swal2-input, .swal2-select, .swal2-textarea { font-size: 14px !important; height: 38px !important; }
  .swal2-textarea { height: auto !important; }
}

/* ============================================================
   Tablas convertidas en tarjetas (clientes-pro / productos-pro / ventas-pro)
   y restos detectados en la revisión
   ============================================================ */
@media (max-width: 767px) {
  /* Tarjetas: menos aire y una sola escala */
  .cp-card .tabla-clientes tbody tr, .pp-card .tablaProductos tbody tr, .vp-card .tablaVentas tbody tr {
    padding: 6px 10px !important; margin-bottom: 8px !important;
  }
  .cp-card .tabla-clientes tbody td, .pp-card .tablaProductos tbody td, .vp-card .tablaVentas tbody td {
    padding: 4px 0 !important; font-size: 12px !important; min-height: 0 !important; gap: 8px !important;
  }
  .cp-card .tabla-clientes tbody td::before, .pp-card .tablaProductos tbody td::before, .vp-card .tablaVentas tbody td::before {
    font-size: 11px !important;
  }
  .cp-card .tabla-clientes tbody td:nth-of-type(2), .pp-card .tablaProductos tbody td:nth-of-type(4),
  .vp-card .tablaVentas tbody td:nth-of-type(4) { font-size: 13px !important; }
  .pp-card .tablaProductos tbody td:nth-of-type(7), .vp-card .tablaVentas tbody td:nth-of-type(5) { font-size: 14px !important; }
  .pp-card .tablaProductos tbody td:nth-of-type(2) img { width: 44px !important; height: 44px !important; }
  .pp-card .tablaProductos tbody td .progress { margin: 0 !important; height: 18px !important; min-width: 120px; }

  /* Acciones: los botones en UNA fila (antes 4 botones apilados a todo el ancho) */
  .cp-card .tabla-clientes tbody td:nth-of-type(8), .pp-card .tablaProductos tbody td:nth-of-type(9),
  .vp-card .tablaVentas tbody td:nth-of-type(10) {
    flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important;
    justify-content: flex-end !important; gap: 6px !important; padding-top: 6px !important;
  }
  .cp-card .tabla-clientes tbody td:nth-of-type(8) .btn, .pp-card .tablaProductos tbody td:nth-of-type(9) .btn,
  .vp-card .tablaVentas tbody td:nth-of-type(10) .btn {
    width: auto !important; flex: 1 1 calc(25% - 6px) !important; max-width: 90px;
    min-height: 34px !important; height: 34px !important; padding: 4px 6px !important; font-size: 13px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
  }

  /* Botones del hero (Nuevo, Stock, ...) en Productos/Clientes: misma altura que el resto */
  .vp-hero__actions button, .vp-hero__actions .btn-fac, .vp-hero__actions .btn-bol, .cp-hero__actions .btn, .pp-hero__actions .btn {
    height: 44px !important; min-height: 44px !important; max-height: 44px !important;
    flex-direction: row !important; white-space: nowrap !important; padding: 0 8px !important; font-size: 11px !important;
  }
  .vp-hero__actions button i { margin-right: 4px; }

  /* Botón principal guardar / vaciar: exactamente 44px */
  .panel-medio-principal .btnGuardarVenta, .panel-medio-principal .btnGuardarGuia, .panel-medio-principal .btnGuardarCompra,
  .panel-medio-principal .btnEliminarCarro, .panel-medio-principal .btnGuardarCotizacion, .panel-medio-principal .btnGuardarNota {
    height: 44px !important; padding: 0 14px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
  }
  .panel-medio-principal .btnGuardarVenta i, .panel-medio-principal .btnGuardarGuia i, .panel-medio-principal .btnGuardarCompra i,
  .panel-medio-principal .btnEliminarCarro i { font-size: 18px !important; }

  /* DataTables sin .table-responsive (sucursales, usuarios, cajas...): desplazan dentro de su contenedor */
  .content-wrapper .dataTables_wrapper { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .content-wrapper .dataTables_wrapper .row { margin: 0 !important; }

  /* Textos fuera de escala */
  .entorno-unificado, .entorno-unificado * { font-size: 11px !important; }
  .content-wrapper .result-report { font-size: 12px !important; }
  .content-wrapper li > span.pull-right { font-size: 13px !important; }
}

@media (max-width: 767px) {
  /* Acciones dentro de .btn-group (productos, clientes...): en fila, no apiladas */
  .cp-card .tabla-clientes tbody td .btn-group, .pp-card .tablaProductos tbody td .btn-group,
  .vp-card .tablaVentas tbody td .btn-group {
    display: flex !important; flex-wrap: wrap !important; justify-content: flex-end !important; gap: 6px !important; width: 100%;
  }
  .pp-card .tablaProductos tbody td .btn-group .btn, .cp-card .tabla-clientes tbody td .btn-group .btn {
    float: none !important; width: auto !important; flex: 1 1 calc(25% - 6px) !important; max-width: 90px;
    min-height: 34px !important; height: 34px !important; padding: 4px 6px !important; border-radius: 8px !important;
  }
  /* Enlaces del hero (Factura, Boleta, Guía de Remisión...) sí pueden partir línea; solo los <button> van en una línea */
  .vp-hero__actions a, .vp-hero__actions a.btn-fac, .vp-hero__actions a.btn-bol {
    white-space: normal !important; height: auto !important; max-height: none !important; min-height: 44px !important;
    padding: 4px 3px !important; line-height: 1.15 !important; flex-direction: column !important;
  }
  /* Cabecera de caja con botón flotado a la derecha: título y botón en líneas separadas si no caben */
  .content-wrapper .box-header { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 6px !important; }
  .content-wrapper .box-header .box-title, .content-wrapper .box-header h3 { flex: 1 1 auto; margin: 0 !important; }
  .content-wrapper .box-header .pull-right { float: none !important; margin-left: auto; }
  .content-wrapper .box-header .btn { white-space: nowrap; }
  /* Porcentajes en listas (más vendidos) */
  .content-wrapper a > span.pull-right, .content-wrapper li span.pull-right { font-size: 13px !important; }
}

/* Ventas: el envío masivo antepone una celda de casilla a cada fila, así que las etiquetas
   de la tarjeta (ventas-pro.css) quedaban corridas una posición. Se remapean aquí. */
@media (max-width: 767px) {
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td.vp-bulk-cb-cell { display: flex !important; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td.vp-bulk-cb-cell::before { content: "Seleccionar"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td.vp-bulk-cb-cell input { width: 20px; height: 20px; margin: 0; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(2) { display: none !important; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(3)::before  { content: "Fecha"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(4)::before  { content: "Comprobante"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(5)::before  { content: "Cliente"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(6)::before  { content: "Total"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(7)::before  { content: "PDF"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(8)::before  { content: "XML"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(9)::before  { content: "CDR"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(10)::before { content: "SUNAT"; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(11)::before { content: "Acciones"; }
  /* estilos destacados corridos una posición */
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(3) { font-weight: 400 !important; color: inherit !important; font-size: 12px !important; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(4) { font-weight: 700 !important; color: var(--vp-primary, #0ea5e9) !important; font-size: 13px !important; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(5) { font-weight: 600 !important; color: var(--vp-text, #0f172a) !important; font-size: 13px !important; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(6) { font-weight: 700 !important; color: var(--vp-success, #16a34a) !important; font-size: 14px !important; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(10) { flex-direction: row !important; justify-content: space-between !important; }
  .vp-card .tablaVentas tbody tr:has(> td.vp-bulk-cb-cell) > td:nth-of-type(11) {
    flex-direction: row !important; flex-wrap: wrap !important; justify-content: flex-end !important; gap: 6px !important;
  }
}

/* Zona de cabecera del comprobante en móvil (moneda, serie, fechas, tipo de documento):
   campos en pareja con texto de 10 px y 32 px de alto, como pidió el cliente. */
@media (max-width: 767px) {
  .panel-medio-principal .col-xs-6 .input-group .form-control,
  .panel-medio-principal .col-xs-6 .input-group select.form-control,
  .panel-medio-principal .col-xs-6 .form-control,
  .panel-medio-principal .col-xs-6 .select2-container .select2-selection--single .select2-selection__rendered {
    font-size: 10px !important; height: 32px !important; min-height: 32px !important; padding: 4px 6px !important; line-height: 1.2 !important;
  }
  .panel-medio-principal .col-xs-6 .select2-container .select2-selection--single { height: 32px !important; min-height: 32px !important; }
  .panel-medio-principal .col-xs-6 .select2-container .select2-selection--single .select2-selection__rendered { line-height: 30px !important; }
  .panel-medio-principal .col-xs-6 .select2-container .select2-selection--single .select2-selection__arrow { height: 30px !important; }
  .panel-medio-principal .col-xs-6 .input-group .input-group-addon { font-size: 10px !important; padding: 4px 7px !important; min-height: 32px !important; }
  .panel-medio-principal .col-xs-6 .input-group .input-group-btn .btn { min-height: 32px !important; height: 32px !important; padding: 4px 8px !important; font-size: 10px !important; }
  .panel-medio-principal .col-xs-6 label { font-size: 10px !important; margin-bottom: 2px !important; }
  .panel-medio-principal .col-xs-6 .form-group { margin-bottom: 6px !important; }
  /* Tipo de documento del cliente y botón de ocultar: misma escala */
  .panel-medio-principal #tipoDoc, .panel-medio-principal #tipoComprobante, .panel-medio-principal #serie, .panel-medio-principal #moneda {
    font-size: 10px !important; height: 32px !important; min-height: 32px !important;
  }
}

/* Modal "Agregar productos o servicios" (#modalProductosVenta) en móvil: todo el texto a 8 px,
   tabla que cabe en la pantalla (se ocultan #, Categoría y Por mayor) y controles mínimos. */
@media (max-width: 767px) {
  #modalProductosVenta .modal-body { padding: 6px !important; }
  #modalProductosVenta .modal-body .col-12 { padding: 0 !important; }
  #modalProductosVenta, #modalProductosVenta .modal-body, #modalProductosVenta table, #modalProductosVenta td, #modalProductosVenta th,
  #modalProductosVenta input, #modalProductosVenta select, #modalProductosVenta button, #modalProductosVenta .btn,
  #modalProductosVenta label, #modalProductosVenta h3, #modalProductosVenta h4, #modalProductosVenta p, #modalProductosVenta span,
  #modalProductosVenta .form-control, #modalProductosVenta .select2-selection__rendered, #modalProductosVenta .desc-productos h3 {
    font-size: 8px !important; line-height: 1.2 !important;
  }
  #modalProductosVenta .form-control, #modalProductosVenta select.form-control, #modalProductosVenta input[type="search"] {
    height: 26px !important; min-height: 26px !important; padding: 2px 6px !important; margin-bottom: 4px !important;
  }
  #modalProductosVenta .form-group { margin-bottom: 4px !important; }
  #modalProductosVenta .table-responsive { border: 0 !important; margin: 0 !important; }
  #modalProductosVenta table.tabla-add { width: 100% !important; min-width: 0 !important; table-layout: auto !important; margin: 0 !important; }
  #modalProductosVenta table.tabla-add th, #modalProductosVenta table.tabla-add td {
    padding: 3px 3px !important; white-space: normal !important; word-break: break-word; vertical-align: middle !important;
  }
  /* Columnas: 1 # | 2 Código | 3 Descripción | 4 Categoría | 5 Stock | 6 Cantidad | 7 P. unit | 8 Por mayor | 9 + | 10 opciones */
  #modalProductosVenta table.tabla-add thead th:nth-child(1), #modalProductosVenta table.tabla-add tr.contenedor-items td:nth-child(1),
  #modalProductosVenta table.tabla-add thead th:nth-child(4), #modalProductosVenta table.tabla-add tr.contenedor-items td:nth-child(4),
  #modalProductosVenta table.tabla-add thead th:nth-child(8), #modalProductosVenta table.tabla-add tr.contenedor-items td:nth-child(8) {
    display: none !important;
  }
  #modalProductosVenta table.tabla-add tr.contenedor-items td:nth-child(2) { white-space: nowrap !important; }
  #modalProductosVenta table.tabla-add .cantidad-stock {
    width: 34px !important; height: 22px !important; min-height: 22px !important; padding: 1px 2px !important; text-align: center; font-size: 8px !important;
  }
  #modalProductosVenta table.tabla-add .btn-stock { padding: 2px 5px !important; min-height: 0 !important; height: 20px !important; font-size: 8px !important; border-radius: 5px !important; }
  #modalProductosVenta table.tabla-add .btn-prod .btn, #modalProductosVenta table.tabla-add .btn-prod .btn-group .btn {
    width: 24px !important; height: 24px !important; min-height: 24px !important; padding: 0 !important; margin: 0 !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 6px !important;
  }
  #modalProductosVenta table.tabla-add .btn-prod .btn i { font-size: 9px !important; }
  #modalProductosVenta table.tabla-add .btn-prod { width: 28px !important; }
  #modalProductosVenta .super-contenedor-precios { font-size: 8px !important; padding: 4px !important; }
  #modalProductosVenta .modal-footer { padding: 6px !important; }
  #modalProductosVenta .modal-footer .btn { min-height: 28px !important; height: 28px !important; padding: 2px 10px !important; }
  #modalProductosVenta .paginacion, #modalProductosVenta .pagination > li > a { font-size: 8px !important; padding: 2px 6px !important; min-height: 0 !important; }
}

/* El modal comparte la clase tablaVentas y responsive.css oculta sus columnas 7 y 8 en móvil: aquí se recupera Precio unitario */
@media (max-width: 767px) {
  #modalProductosVenta table.tabla-add thead th:nth-child(7), #modalProductosVenta table.tabla-add tr.contenedor-items td:nth-child(7) { display: table-cell !important; white-space: nowrap !important; }
}

/* pos.css fuerza height:42px en .input-group-addon; en móvil debe medir lo mismo que su campo */
@media (max-width: 767px) {
  .content-wrapper .input-group-addon { height: 38px !important; line-height: 1 !important; vertical-align: middle !important; }
  .panel-medio-principal .col-xs-6 .input-group .input-group-addon { height: 32px !important; }
  .content-wrapper .input-group-addon i { font-size: 12px !important; }
}

/* El icono junto a Tipo de documento / Moneda / Serie debe medir lo mismo que su select (32px) */
@media (max-width: 767px) {
  .panel-medio-principal .input-group:has(> #tipoDoc) .input-group-addon, .panel-medio-principal .input-group:has(> #moneda) .input-group-addon,
  .panel-medio-principal .input-group:has(> #serie) .input-group-addon, .panel-medio-principal .input-group:has(> #tipoComprobante) .input-group-addon { height: 32px !important; min-height: 32px !important; padding: 4px 7px !important; }
}
