.table {
    font-size: 16px;
}

/* Estatus de punto OCULTAR_TALLA_COLOR: oculta en toda la app las columnas/celdas Talla y Color
   (para negocios cuyos productos no manejan esas caracteristicas, ej. restaurantes). El body recibe
   la clase "hide-talla-color-columns" desde _Layout.cshtml segun PointStatus.Equals(...); cualquier
   th/td/col/celda marcada con "talla-color-column" queda oculta automaticamente, incluida la que se
   agrega despues via JS (los templates ya incluyen la clase). */
body.hide-talla-color-columns .talla-color-column {
    display: none !important;
}

/* Tablas con table-layout:fixed calculan el ancho de cada columna a partir del <col>, no solo de su
   "display" (el soporte de display:none sobre <col> es menos confiable entre motores que sobre celdas
   normales) - sin fijar tambien su ancho en 0, quedaba un hueco en blanco donde estaban Talla/Color en
   vez de que las demas columnas se redistribuyeran (encontrado en "Traslado de Mercancia", 2026-09-25). */
body.hide-talla-color-columns col.talla-color-column {
    width: 0 !important;
}

/* Filas de "Totales" (Documents/TABLES_STYLES.md seccion 5.2): sin colspan, cada columna vacia entre
   la etiqueta "Totales" y las celdas con la sumatoria real muestra su propio borde, dando la
   apariencia de varias celdas vacias en blanco en vez de una sola region. Con border-collapse:collapse
   (heredado de MDB), el borde de una frontera vertical lo determina el border-right de la celda de
   la IZQUIERDA (verificado con Chrome real) - por eso basta con volver transparente el border-right de
   cada celda de la "corrida" en blanco, EXCEPTO la ultima (la que esta justo antes de la primera celda
   con un valor real), para que ahi si se conserve la linea divisoria. */
.total-row-borderless-right {
    border-right-color: transparent !important;
}

/* Cuando Talla/Color estan ocultas (OCULTAR_TALLA_COLOR), la celda que en la fila de totales
   normalmente conserva su borde por estar justo antes del par Talla/Color (ver seccion 5.3 de
   TABLES_STYLES.md: el borde de una frontera lo decide el border-right de la celda IZQUIERDA)
   desaparece junto con esas columnas, porque esa celda-frontera ES una de las hidden. Marcar
   ademas con "total-row-border-fallback" la ultima celda SIEMPRE visible antes del par Talla/Color
   (normalmente "Descripcion") para que recupere su borde derecho solo cuando esas columnas quedan
   ocultas (encontrado en "Ingreso de Mercancia", 2026-09-25). Especificidad (0,3,1), mas alta que
   la regla ".xxx-footer-table td.total-row-borderless-right" (0,2,1) de cada popup, para ganar sin
   importar el orden de carga. */
body.hide-talla-color-columns td.total-row-borderless-right.total-row-border-fallback {
    border-right-color: var(--mdb-border-color) !important;
}

.table thead {
    border-top: 1px solid #e0e0e0;
}

.table tbody {
    border-top: none !important;
}

.table-bordered> :not(caption)>* {
    border-width: 0;
}

.table-bordered> :not(caption)>*>* {
    border-width: 1px;
}

.table-focusable:focus {
    outline: none !important;
    box-shadow: none !important;
}

.table td,
.table th {
    padding-top: 0.2rem !important;
    padding-bottom: 0.2rem !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    line-height: 1.2;
    vertical-align: middle;
}

.table thead th {
    background: linear-gradient(to bottom, #ffffff, #eaf4ff);
    color: #333;
    border-bottom: 1px solid #e0e0e0;
    height: 34px !important;
    font-weight: normal !important;
    position: sticky;
    top: 0;
    z-index: 1;
}

.table-gray thead th {
    background: #6087a9;
    color: #fff;
    border-bottom: 1px solid #0d0f10;
}

.table th.head,
td.head {
    background: #f5f5f5;
    border-right: 1px solid #bdbdbd;
    text-align: left;
}

.table tbody tr {
    height: 30px !important;
    cursor: pointer;
}

.table tbody tr:not(.selected):not(.selected-light):hover>* {
    background-color: #fffefe !important;
}

.table tbody tr.focused>* {
    background-color: #f0f0f0 !important;
}

tbody.selectable tr.selected {
    background-color: #e8f0fe;
}

.table tbody tr.selected>* {
    background-color: #228ad6 !important;
    color: white !important;
}

table tbody tr.selected-light>* {
    background-color: #e9f7ff !important;
}

.table tbody tr.locked>* {
    background-color: #efefef !important;
    cursor: default !important;
}

.table tbody tr.locked:hover>* {
    background-color: #efefef !important;
}

.icon-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: #808080;
    font-size: 15px;
}

.icon-btn:hover {
    color: #dc3545;
}