@import url("./inventario.buttons.css");
@import url("./inventario.modals.css");

/* =========================================================
   WIRTZ HUB · RECURSOS · INVENTARIO
   Stock operativo · depósitos · ML Full · kits · reposición
   Visual alineado a Dashboard · compacto · iconos centrados
   Fuente ATF Franklin Gothic · sin scroll horizontal
   ========================================================= */

/* =========================================================
   NORMALIZACIÓN GENERAL SOLO INVENTARIO
   ========================================================= */

.inventory-page {
  --inventory-border: rgba(15, 23, 42, 0.12);
  --inventory-border-soft: rgba(15, 23, 42, 0.08);
  --inventory-bg: color-mix(in srgb, var(--panel-solid) 97%, transparent);
  --inventory-bg-soft: rgba(15, 23, 42, 0.025);

  --inventory-info: #0891b2;
  --inventory-ok: #16a34a;
  --inventory-medium: #ca8a04;
  --inventory-high: #ea580c;
  --inventory-critical: #dc2626;

  display: grid;
  grid-auto-rows: max-content;
  align-content: start;
  gap: 8px;

  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: calc(100vh - var(--topbar-height) - 44px);

  color: var(--text);
  animation: fadeUp 0.22s ease both;
}

.inventory-page,
.inventory-page *,
.inventory-page *::before,
.inventory-page *::after,
.inventory-modal,
.inventory-modal *,
.inventory-modal *::before,
.inventory-modal *::after {
  box-sizing: border-box;
  font-family:
    "ATF Franklin Gothic",
    "Franklin Gothic Medium",
    "Franklin Gothic",
    "Arial Narrow",
    Arial,
    sans-serif !important;
}

html[data-theme="dark"] .inventory-page {
  --inventory-border: rgba(255, 255, 255, 0.11);
  --inventory-border-soft: rgba(255, 255, 255, 0.075);
  --inventory-bg: rgba(10, 10, 10, 0.9);
  --inventory-bg-soft: rgba(255, 255, 255, 0.025);

  --inventory-info: #67e8f9;
  --inventory-ok: #4ade80;
  --inventory-medium: #facc15;
  --inventory-high: #fb923c;
  --inventory-critical: #f87171;
}

/* =========================================================
   HEADER COMPACTO
   ========================================================= */

.inventory-head {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto;
  gap: 8px;
  align-items: center;

  min-width: 0;
  min-height: 62px;
  padding: 10px;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--inventory-bg);
  box-shadow: none;
  overflow: hidden;
}

html[data-theme="dark"] .inventory-head {
  border-color: var(--inventory-border);
  background: var(--inventory-bg);
}

.inventory-brand {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.inventory-brand__icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 34px;
  height: 34px;
  min-width: 34px;
  max-width: 34px;
  min-height: 34px;
  max-height: 34px;

  padding: 0;
  margin: 0;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--inventory-bg-soft);

  color: var(--text-strong);
  line-height: 0;
  text-align: center;
}

.inventory-brand__icon .icon,
.inventory-brand__icon svg {
  display: block;
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;

  margin: 0;
  padding: 0;

  stroke-width: 2.25;
  line-height: 0;
  position: static;
  transform: none;
}

html[data-theme="dark"] .inventory-brand__icon {
  border-color: var(--inventory-border);
  background: var(--inventory-bg-soft);
  color: rgba(255, 255, 255, 0.92);
}

.inventory-brand h2 {
  margin: 0;
  color: var(--text-strong);

  font-size: 19px;
  font-weight: 950;
  line-height: 1.05;
  letter-spacing: -0.065em;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.inventory-brand p {
  margin: 3px 0 0;
  max-width: 760px;

  color: var(--muted);

  font-size: 9px;
  font-weight: 760;
  line-height: 1.45;
}

html[data-theme="dark"] .inventory-brand h2 {
  color: rgba(255, 255, 255, 0.93);
}

html[data-theme="dark"] .inventory-brand p {
  color: rgba(255, 255, 255, 0.52);
}

.inventory-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  flex-wrap: wrap;
  min-width: 0;
}

/* =========================================================
   MÉTRICAS COMPACTAS
   ========================================================= */

.inventory-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--inventory-bg);
  box-shadow: none;
  overflow: hidden;
}

.inventory-metric {
  display: grid;
  align-content: center;
  gap: 4px;

  min-width: 0;
  min-height: 58px;
  padding: 9px;

  border-right: 1px solid var(--inventory-border-soft);
  overflow: hidden;
}

.inventory-metric:last-child {
  border-right: 0;
}

.inventory-metric span {
  color: var(--muted);

  font-size: 7.5px;
  font-weight: 950;
  letter-spacing: 0.085em;
  line-height: 1;
  text-transform: uppercase;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.inventory-metric strong {
  color: var(--text-strong);

  font-size: 19px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: -0.065em;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.inventory-metric small {
  color: var(--muted-2);

  font-size: 7.7px;
  font-weight: 820;
  line-height: 1.15;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

html[data-theme="dark"] .inventory-metrics {
  border-color: var(--inventory-border);
  background: var(--inventory-bg);
}

html[data-theme="dark"] .inventory-metric {
  border-right-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-metric span,
html[data-theme="dark"] .inventory-metric small {
  color: rgba(255, 255, 255, 0.48);
}

html[data-theme="dark"] .inventory-metric strong {
  color: rgba(255, 255, 255, 0.92);
}

/* =========================================================
   PANEL PRINCIPAL
   ========================================================= */

.inventory-panel,
.inventory-flow {
  display: grid;
  min-width: 0;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--inventory-bg);
  box-shadow: none;
  overflow: hidden;
}

html[data-theme="dark"] .inventory-panel,
html[data-theme="dark"] .inventory-flow {
  border-color: var(--inventory-border);
  background: var(--inventory-bg);
}

.inventory-toolbar {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  gap: 8px;
  align-items: center;

  min-width: 0;
  padding: 8px;

  border-bottom: 1px solid var(--inventory-border-soft);
}

.inventory-title {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.inventory-title span {
  color: var(--muted);

  font-size: 7.4px;
  font-weight: 950;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.inventory-title strong {
  color: var(--text-strong);

  font-size: 11.8px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: -0.035em;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

html[data-theme="dark"] .inventory-toolbar {
  border-bottom-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-title span {
  color: rgba(255, 255, 255, 0.48);
}

html[data-theme="dark"] .inventory-title strong {
  color: rgba(255, 255, 255, 0.92);
}

/* =========================================================
   FILTROS
   ========================================================= */

.inventory-filters {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;

  min-width: 0;
  flex-wrap: wrap;
}

.inventory-search {
  display: flex;
  align-items: center;
  gap: 6px;

  width: min(390px, 100%);
  min-width: 240px;
  height: 28px;
  padding: 0 8px;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: #ffffff;

  color: var(--muted);

  transition:
    background var(--transition),
    border-color var(--transition);
}

.inventory-search:focus-within {
  border-color: rgba(15, 23, 42, 0.28);
  background: #f8fafc;
}

.inventory-search .icon,
.inventory-search svg {
  display: block;
  width: 12px;
  height: 12px;
  min-width: 12px;
  min-height: 12px;

  margin: 0;
  padding: 0;

  stroke-width: 2.25;
  line-height: 0;
  position: static;
  transform: none;
}

.inventory-search input {
  width: 100%;
  min-width: 0;

  border: 0;
  background: transparent;
  color: var(--text-strong);
  outline: none;

  font-size: 8.8px;
  font-weight: 780;
  line-height: 1;
}

.inventory-search input::placeholder {
  color: var(--muted-2);
}

.inventory-filters select {
  height: 28px;
  min-width: 96px;
  padding: 0 8px;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: #ffffff;

  color: var(--text-strong);
  outline: none;

  font-size: 8.5px;
  font-weight: 850;
  line-height: 1;
}

html[data-theme="dark"] .inventory-search,
html[data-theme="dark"] .inventory-filters select {
  border-color: var(--inventory-border);
  background: rgba(255, 255, 255, 0.055);
  color: rgba(255, 255, 255, 0.88);
}

html[data-theme="dark"] .inventory-search:focus-within {
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.075);
}

html[data-theme="dark"] .inventory-search input {
  color: rgba(255, 255, 255, 0.88);
}

html[data-theme="dark"] .inventory-search input::placeholder {
  color: rgba(255, 255, 255, 0.36);
}

/* =========================================================
   SELECCIÓN MASIVA
   ========================================================= */

.inventory-bulk {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;

  min-height: 0;
  max-height: 0;
  padding: 0 8px;

  border-bottom: 0 solid transparent;
  background: var(--inventory-bg-soft);

  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  transform: translateY(-3px);

  transition:
    max-height var(--transition),
    min-height var(--transition),
    padding var(--transition),
    opacity var(--transition),
    transform var(--transition),
    background var(--transition),
    border-color var(--transition);
}

.inventory-bulk.is-active {
  min-height: 40px;
  max-height: 78px;
  padding: 7px 8px;

  border-bottom: 1px solid var(--inventory-border-soft);

  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.inventory-bulk__info {
  display: inline-flex;
  align-items: center;
  gap: 6px;

  min-width: 0;
  color: var(--text-strong);
  white-space: nowrap;
}

.inventory-bulk__info .icon,
.inventory-bulk__info svg {
  display: block;
  width: 13px;
  height: 13px;
  min-width: 13px;
  min-height: 13px;

  margin: 0;
  padding: 0;

  color: var(--inventory-ok);
  stroke-width: 2.25;
  line-height: 0;
  position: static;
  transform: none;
}

.inventory-bulk__info strong {
  color: var(--text-strong);
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
}

.inventory-bulk__info span {
  color: var(--muted);

  font-size: 8px;
  font-weight: 850;
  line-height: 1;

  overflow: hidden;
  text-overflow: ellipsis;
}

.inventory-bulk__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  flex-wrap: wrap;
}

.inventory-bulk__actions .inventory-btn {
  min-height: 28px;
  padding: 0 8px;
  font-size: 7.8px;
}

.inventory-bulk__actions .inventory-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

.inventory-table tbody tr.is-selected {
  background: color-mix(in srgb, var(--yellow) 12%, transparent);
}

.inventory-table tbody tr.is-selected:hover {
  background: color-mix(in srgb, var(--yellow) 17%, transparent);
}

.inventory-check input,
.inventory-th.inventory-check input,
.inventory-mobile-item__check input {
  width: 13px;
  height: 13px;
  margin: 0;

  accent-color: var(--yellow);
  cursor: pointer;
}

.inventory-check input:focus-visible,
.inventory-th.inventory-check input:focus-visible,
.inventory-mobile-item__check input:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--yellow) 52%, transparent);
  outline-offset: 2px;
}

html[data-theme="dark"] .inventory-bulk {
  background: rgba(255, 255, 255, 0.035);
}

html[data-theme="dark"] .inventory-bulk.is-active {
  border-bottom-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-bulk__info strong {
  color: rgba(255, 255, 255, 0.92);
}

html[data-theme="dark"] .inventory-bulk__info span {
  color: rgba(255, 255, 255, 0.48);
}

html[data-theme="dark"] .inventory-table tbody tr.is-selected {
  background: rgba(250, 226, 50, 0.095);
}

html[data-theme="dark"] .inventory-table tbody tr.is-selected:hover {
  background: rgba(250, 226, 50, 0.135);
}

/* =========================================================
   TABLA · DESKTOP / TABLET
   ========================================================= */

.inventory-table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;

  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.inventory-table {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;

  table-layout: fixed !important;
  border-collapse: collapse;

  background: var(--inventory-bg);
}

.inventory-table th,
.inventory-table td {
  position: relative;

  height: 31px;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 6px;

  border-right: 0 !important;
  border-bottom: 1px solid var(--inventory-border-soft);
  box-shadow: none !important;

  color: var(--text);

  font-size: 8px;
  font-weight: 720;
  line-height: 1;
  text-align: left;
  white-space: nowrap;
  vertical-align: middle;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.inventory-table th {
  position: sticky;
  top: 0;
  z-index: 3;

  height: 31px;

  overflow: visible !important;

  background: var(--inventory-bg);
  color: var(--muted);

  font-size: 6.8px;
  font-weight: 950;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

.inventory-table th:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;

  width: 1px;
  height: 13px;
  border-radius: 999px;

  background: rgba(0, 0, 0, 0.14);
  transform: translateY(-50%);
}

.inventory-table td:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;

  width: 1px;
  height: 15px;
  border-radius: 999px;

  background: rgba(0, 0, 0, 0.09);
  transform: translateY(-50%);
}

.inventory-table tbody tr {
  transition:
    background var(--transition),
    color var(--transition);
}

.inventory-table tbody tr:hover {
  background: rgba(15, 23, 42, 0.035);
}

.inventory-table strong {
  color: var(--text-strong);
  font-weight: 920;
}

html[data-theme="dark"] .inventory-table {
  background: var(--inventory-bg);
}

html[data-theme="dark"] .inventory-table th,
html[data-theme="dark"] .inventory-table td {
  border-bottom-color: var(--inventory-border-soft);
  color: rgba(255, 255, 255, 0.72);
}

html[data-theme="dark"] .inventory-table th {
  background: rgba(10, 10, 10, 0.98);
  color: rgba(255, 255, 255, 0.46);
}

html[data-theme="dark"] .inventory-table th:not(:last-child)::after {
  background: rgba(255, 255, 255, 0.17);
}

html[data-theme="dark"] .inventory-table td:not(:last-child)::after {
  background: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .inventory-table tbody tr:hover {
  background: rgba(255, 255, 255, 0.055);
}

html[data-theme="dark"] .inventory-table strong {
  color: rgba(255, 255, 255, 0.88);
}

/* =========================================================
   MOBILE LIST · OCULTA EN DESKTOP
   ========================================================= */

.inventory-mobile-list {
  display: none;
}

/* =========================================================
   COLUMNAS · ANCHOS BASE
   ========================================================= */

.inventory-table th:nth-child(1),
.inventory-table td:nth-child(1) {
  width: 3% !important;
  text-align: center !important;
}

.inventory-table th:nth-child(2),
.inventory-table td:nth-child(2) {
  width: 6% !important;
}

.inventory-table th:nth-child(3),
.inventory-table td:nth-child(3) {
  width: 7% !important;
}

.inventory-table th:nth-child(4),
.inventory-table td:nth-child(4) {
  width: 17% !important;
}

.inventory-table th:nth-child(5),
.inventory-table td:nth-child(5) {
  width: 8% !important;
}

.inventory-table th:nth-child(6),
.inventory-table td:nth-child(6) {
  width: 5% !important;
  text-align: right !important;
}

.inventory-table th:nth-child(7),
.inventory-table td:nth-child(7) {
  width: 7% !important;
}

.inventory-table th:nth-child(8),
.inventory-table td:nth-child(8) {
  width: 8% !important;
}

.inventory-table th:nth-child(9),
.inventory-table td:nth-child(9) {
  width: 6% !important;
  text-align: right !important;
}

.inventory-table th:nth-child(10),
.inventory-table td:nth-child(10) {
  width: 6% !important;
  text-align: right !important;
}

.inventory-table th:nth-child(11),
.inventory-table td:nth-child(11) {
  width: 5% !important;
  text-align: center !important;
}

.inventory-table th:nth-child(12),
.inventory-table td:nth-child(12),
.inventory-table th:nth-child(13),
.inventory-table td:nth-child(13),
.inventory-table th:nth-child(14),
.inventory-table td:nth-child(14),
.inventory-table th:nth-child(15),
.inventory-table td:nth-child(15) {
  width: 5.5% !important;
  text-align: right !important;
}

.inventory-table th:nth-child(16),
.inventory-table td:nth-child(16) {
  width: 8% !important;
}

.inventory-table th:nth-child(17),
.inventory-table td:nth-child(17) {
  width: 7% !important;
}

.inventory-table th:nth-child(18),
.inventory-table td:nth-child(18) {
  width: 7% !important;
  text-align: center !important;
}

/* =========================================================
   HEADER ORDENABLE + RESIZE
   ========================================================= */

.inventory-th {
  position: sticky;
  top: 0;
  z-index: 4;

  overflow: visible !important;
}

.inventory-th__sort {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;

  width: calc(100% - 7px);
  min-width: 0;
  height: 100%;
  padding: 0;

  border: 0;
  background: transparent;
  color: inherit;

  font: inherit;
  text-align: left;
  text-transform: inherit;
  letter-spacing: inherit;

  cursor: pointer;
}

.inventory-th__sort:disabled {
  cursor: default;
}

.inventory-th__sort span {
  min-width: 0;

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inventory-th__sort .icon,
.inventory-th__sort svg {
  display: block;
  width: 9px;
  height: 9px;
  min-width: 9px;
  min-height: 9px;

  margin: 0;
  padding: 0;

  color: var(--muted);
  opacity: 0.68;

  stroke-width: 2.25;
  line-height: 0;
  position: static;
  transform: none;
}

.inventory-th.is-sorted .inventory-th__sort {
  color: var(--text-strong);
}

.inventory-th.is-sorted .inventory-th__sort .icon,
.inventory-th.is-sorted .inventory-th__sort svg {
  color: var(--text-strong);
  opacity: 1;
}

.inventory-th.is-right .inventory-th__sort,
.inventory-th.is-right .inventory-th__sort span {
  text-align: right;
}

.inventory-th.is-center .inventory-th__sort {
  justify-content: center;
  text-align: center;
}

.inventory-th.is-center .inventory-th__sort span {
  text-align: center;
}

.inventory-th__resize {
  position: absolute;
  top: 0;
  right: -3px;
  z-index: 8;

  width: 7px;
  height: 100%;

  cursor: col-resize;
  touch-action: none;
}

.inventory-th__resize::after {
  content: "";
  position: absolute;
  top: 7px;
  right: 3px;

  width: 1px;
  height: calc(100% - 14px);

  border-radius: 999px;
  background: rgba(0, 0, 0, 0.22);

  opacity: 0;

  transition:
    opacity var(--transition),
    background var(--transition);
}

.inventory-th:hover .inventory-th__resize::after,
body.is-resizing-inventory-column .inventory-th__resize::after {
  opacity: 1;
}

body.is-resizing-inventory-column,
body.is-resizing-inventory-column * {
  cursor: col-resize !important;
  user-select: none !important;
}

html[data-theme="dark"] .inventory-th.is-sorted .inventory-th__sort,
html[data-theme="dark"] .inventory-th.is-sorted .inventory-th__sort .icon,
html[data-theme="dark"] .inventory-th.is-sorted .inventory-th__sort svg {
  color: rgba(255, 255, 255, 0.92);
}

html[data-theme="dark"] .inventory-th__resize::after {
  background: rgba(255, 255, 255, 0.26);
}

/* =========================================================
   SACAR MINI-CARDS / PASTILLAS
   SKU · Stock · Estado · Fabricación · Kit
   ========================================================= */

.inventory-code,
.inventory-stock,
.inventory-status,
.inventory-kit {
  display: inline !important;

  min-height: auto !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;

  color: var(--text-strong) !important;

  font-size: 8px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: -0.015em !important;
}

.inventory-stock::before,
.inventory-status::before,
.inventory-kit::before {
  display: none !important;
}

.inventory-code {
  color: var(--muted) !important;
  font-weight: 850 !important;
}

.inventory-stock.is-ok {
  color: var(--inventory-ok) !important;
}

.inventory-stock.is-low {
  color: var(--inventory-medium) !important;
}

.inventory-stock.is-zero {
  color: var(--inventory-critical) !important;
}

.inventory-status.is-local,
.inventory-kit.is-no {
  color: var(--inventory-ok) !important;
}

.inventory-status.is-importado,
.inventory-kit.is-yes {
  color: var(--inventory-medium) !important;
}

html[data-theme="dark"] .inventory-code,
html[data-theme="dark"] .inventory-stock,
html[data-theme="dark"] .inventory-status,
html[data-theme="dark"] .inventory-kit {
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="dark"] .inventory-code {
  color: rgba(255, 255, 255, 0.56) !important;
}

html[data-theme="dark"] .inventory-stock.is-ok {
  color: #4ade80 !important;
}

html[data-theme="dark"] .inventory-stock.is-low {
  color: #facc15 !important;
}

html[data-theme="dark"] .inventory-stock.is-zero {
  color: #f87171 !important;
}

html[data-theme="dark"] .inventory-status.is-local,
html[data-theme="dark"] .inventory-kit.is-no {
  color: #4ade80 !important;
}

html[data-theme="dark"] .inventory-status.is-importado,
html[data-theme="dark"] .inventory-kit.is-yes {
  color: #facc15 !important;
}

/* =========================================================
   PRODUCTO / UBICACIÓN / NÚMEROS
   ========================================================= */

.inventory-product {
  display: inline-block;
  max-width: 100%;

  color: var(--text-strong);

  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
}

.inventory-location,
.inventory-number,
.inventory-kind {
  display: inline-flex;
  align-items: center;
  gap: 4px;

  max-width: 100%;

  color: var(--text-strong);
  font-size: 8px;
  font-weight: 860;
  line-height: 1;

  overflow: hidden;
  text-overflow: ellipsis;
}

.inventory-location .icon,
.inventory-location svg,
.inventory-kind .icon,
.inventory-kind svg {
  display: block;
  width: 10px;
  height: 10px;
  min-width: 10px;
  min-height: 10px;

  margin: 0;
  padding: 0;

  color: var(--muted);
  stroke-width: 2.25;
  line-height: 0;
  position: static;
  transform: none;
}

.inventory-check {
  width: 34px;
  text-align: center !important;
}

/* =========================================================
   ACCIONES FILA
   ========================================================= */

.inventory-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;

  width: 100%;
  max-width: 100%;
  min-width: 0;

  white-space: nowrap;
  overflow: hidden;
}

.inventory-row-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 24px;
  height: 24px;
  min-width: 24px;
  max-width: 24px;
  min-height: 24px;
  max-height: 24px;

  padding: 0 !important;
  margin: 0;

  border-radius: 0;

  line-height: 0 !important;
  text-align: center !important;
}

.inventory-row-btn .icon,
.inventory-row-btn svg {
  display: block !important;
  width: 11px !important;
  height: 11px !important;
  min-width: 11px !important;
  min-height: 11px !important;

  margin: 0 !important;
  padding: 0 !important;

  stroke-width: 2.25;
  line-height: 0 !important;
  position: static !important;
  transform: none !important;
  flex: 0 0 auto !important;
}

/* =========================================================
   PAGINACIÓN
   ========================================================= */

.inventory-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;

  min-height: 38px;
  padding: 7px 8px;

  border-top: 1px solid var(--inventory-border-soft);
}

.inventory-pagination strong {
  color: var(--muted);

  font-size: 7.6px;
  font-weight: 820;
  line-height: 1.25;
  text-align: center;
}

html[data-theme="dark"] .inventory-pagination {
  border-top-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-pagination strong {
  color: rgba(255, 255, 255, 0.46);
}

/* =========================================================
   HISTORIAL / FLUJO ABAJO
   ========================================================= */

.inventory-flow {
  align-content: start;
}

.inventory-flow__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;

  min-height: 42px;
  padding: 9px 10px;

  border-bottom: 1px solid var(--inventory-border-soft);
}

.inventory-flow__head span {
  color: var(--muted);

  font-size: 7.4px;
  font-weight: 950;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.inventory-flow__head strong {
  display: block;
  margin-top: 4px;

  color: var(--text-strong);

  font-size: 11.2px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: -0.035em;
}

.inventory-flow__head .icon,
.inventory-flow__head svg {
  display: block;
  width: 15px;
  height: 15px;
  min-width: 15px;
  min-height: 15px;

  margin: 0;
  padding: 0;

  color: var(--inventory-info);
  stroke-width: 2.25;
  line-height: 0;
  position: static;
  transform: none;
}

.inventory-timeline {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.inventory-event {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 9px;

  min-width: 0;
  min-height: 74px;
  padding: 10px;

  border-right: 1px solid var(--inventory-border-soft);
  color: var(--inventory-info);

  overflow: hidden;
}

.inventory-event:last-child {
  border-right: 0;
}

.inventory-event__icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 28px;
  height: 28px;
  min-width: 28px;
  max-width: 28px;
  min-height: 28px;
  max-height: 28px;

  padding: 0;
  margin: 0;

  border: 1px solid color-mix(in srgb, currentColor 34%, rgba(15, 23, 42, 0.12));
  border-radius: 0;
  background: color-mix(in srgb, currentColor 8%, transparent);

  color: currentColor;
  line-height: 0;
  text-align: center;
}

.inventory-event__icon .icon,
.inventory-event__icon svg {
  display: block;
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;

  margin: 0;
  padding: 0;

  stroke-width: 2.25;
  line-height: 0;
  position: static;
  transform: none;
}

.inventory-event__body {
  display: grid;
  align-content: start;
  gap: 4px;
  min-width: 0;
}

.inventory-event__body strong {
  color: var(--text-strong);

  font-size: 8.8px;
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -0.015em;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.inventory-event__body p {
  margin: 0;

  color: var(--muted);

  font-size: 7.8px;
  font-weight: 760;
  line-height: 1.34;
}

.inventory-event__body small {
  color: var(--muted-2);

  font-size: 7px;
  font-weight: 950;
  line-height: 1;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

html[data-theme="dark"] .inventory-flow__head {
  border-bottom-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-flow__head span,
html[data-theme="dark"] .inventory-event__body p,
html[data-theme="dark"] .inventory-event__body small {
  color: rgba(255, 255, 255, 0.48);
}

html[data-theme="dark"] .inventory-flow__head strong,
html[data-theme="dark"] .inventory-event__body strong {
  color: rgba(255, 255, 255, 0.92);
}

html[data-theme="dark"] .inventory-event {
  border-right-color: var(--inventory-border-soft);
}

/* =========================================================
   CARGA MASIVA INVENTARIO
   ========================================================= */

.inventory-import-help {
  display: grid;
  gap: 4px;

  padding: 9px;

  border-bottom: 1px solid var(--inventory-border-soft);
  background: var(--inventory-bg-soft);
}

.inventory-import-help strong {
  color: var(--text-strong);

  font-size: 8.8px;
  font-weight: 950;
  line-height: 1;
}

.inventory-import-help p {
  margin: 0;

  color: var(--muted);

  font-size: 7.8px;
  font-weight: 760;
  line-height: 1.34;
}

/* =========================================================
   MODALES OPERATIVOS NUEVOS
   ========================================================= */

.inventory-action-list {
  display: grid;
  gap: 0;

  min-width: 0;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--inventory-bg);
  overflow: hidden;
}

.inventory-action-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;

  min-width: 0;
  min-height: 72px;
  padding: 10px;

  border-bottom: 1px solid var(--inventory-border-soft);
  background: transparent;
}

.inventory-action-row:last-child {
  border-bottom: 0;
}

.inventory-action-row > div,
.inventory-action-row__buttons {
  min-width: 0;
}

.inventory-action-row strong {
  color: var(--text-strong);

  font-size: 8.8px;
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -0.015em;
}

.inventory-action-row p {
  margin: 6px 0 0;

  color: var(--muted);

  font-size: 7.8px;
  font-weight: 760;
  line-height: 1.34;
}

.inventory-action-row__buttons {
  display: flex;
  justify-content: flex-end;
  gap: 5px;
  flex-wrap: wrap;
}

.inventory-tools-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.inventory-tool-card {
  display: grid;
  align-content: start;
  gap: 7px;

  min-width: 0;
  min-height: 150px;
  padding: 10px;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--inventory-bg);
}

.inventory-tool-card > .icon,
.inventory-tool-card > svg {
  display: block;
  width: 17px;
  height: 17px;
  min-width: 17px;
  min-height: 17px;

  color: var(--inventory-critical);
  stroke-width: 2.25;
}

.inventory-tool-card strong {
  color: var(--text-strong);

  font-size: 9px;
  font-weight: 950;
  line-height: 1;
}

.inventory-tool-card p {
  margin: 0;

  color: var(--muted);

  font-size: 7.8px;
  font-weight: 760;
  line-height: 1.35;
}

.inventory-tool-card .inventory-btn {
  align-self: end;
  width: 100%;
  margin-top: auto;
}

/* =========================================================
   PLANTILLAS
   ========================================================= */

.inventory-templates-module {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
}

.inventory-templates-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.inventory-template-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  align-content: start;
  gap: 8px;

  min-width: 0;
  min-height: 150px;
  padding: 10px;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--inventory-bg);

  overflow: hidden;
}

.inventory-template-card > .icon,
.inventory-template-card > svg {
  display: block;
  width: 17px;
  height: 17px;
  min-width: 17px;
  min-height: 17px;

  color: var(--inventory-critical);
  stroke-width: 2.25;
}

.inventory-template-card strong {
  display: block;

  color: var(--text-strong);

  font-size: 9px;
  font-weight: 950;
  line-height: 1.08;
  letter-spacing: -0.025em;
}

.inventory-template-card p {
  margin: 4px 0 0;

  color: var(--muted);

  font-size: 7.8px;
  font-weight: 760;
  line-height: 1.32;
}

.inventory-template-card .inventory-btn {
  width: 100%;
  margin-top: auto;
}

html[data-theme="dark"] .inventory-template-card,
html[data-theme="dark"] .inventory-tool-card,
html[data-theme="dark"] .inventory-action-list {
  border-color: var(--inventory-border);
  background: var(--inventory-bg);
}

html[data-theme="dark"] .inventory-action-row {
  border-bottom-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-action-row strong,
html[data-theme="dark"] .inventory-tool-card strong,
html[data-theme="dark"] .inventory-template-card strong {
  color: rgba(255, 255, 255, 0.92);
}

html[data-theme="dark"] .inventory-action-row p,
html[data-theme="dark"] .inventory-tool-card p,
html[data-theme="dark"] .inventory-template-card p {
  color: rgba(255, 255, 255, 0.52);
}

/* =========================================================
   AUDITORÍA DESCUENTOS
   ========================================================= */

.inventory-audit-layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  min-height: 440px;
}

.inventory-audit-list {
  display: grid;
  align-content: start;
  gap: 0;

  padding: 10px;

  border-right: 1px solid var(--inventory-border-soft);
  overflow: auto;
}

.inventory-audit-detail {
  display: grid;
  align-content: start;
  gap: 0;

  padding: 10px;
  overflow: auto;
}

.inventory-mini-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;

  min-height: 42px;
  padding: 0 0 8px;

  border-bottom: 1px solid var(--inventory-border-soft);
}

.inventory-mini-head > div {
  min-width: 0;
}

.inventory-mini-head span {
  color: var(--inventory-critical);

  font-size: 7.4px;
  font-weight: 950;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.inventory-mini-head span::before {
  content: "";

  display: inline-block;
  width: 4px;
  height: 4px;
  margin-right: 6px;

  border-radius: 999px;
  background: currentColor;

  vertical-align: middle;
}

.inventory-mini-head strong {
  display: block;
  margin-top: 4px;

  color: var(--text-strong);

  font-size: 11.2px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: -0.035em;
}

.inventory-mini-head .icon,
.inventory-mini-head svg {
  display: block;
  width: 15px;
  height: 15px;
  min-width: 15px;
  min-height: 15px;

  margin: 0;
  padding: 0;

  color: var(--inventory-info);
  stroke-width: 2.25;
  line-height: 0;
  position: static;
  transform: none;
}

.inventory-audit-item {
  display: grid;
  gap: 3px;

  width: 100%;
  min-height: 52px;
  padding: 9px 0;

  border: 0;
  border-bottom: 1px solid var(--inventory-border-soft);
  background: transparent;

  color: inherit;
  text-align: left;

  cursor: pointer;
}

.inventory-audit-item:hover {
  background: rgba(15, 23, 42, 0.035);
}

.inventory-audit-item strong {
  color: var(--text-strong);

  font-size: 8.8px;
  font-weight: 950;
  line-height: 1.12;
}

.inventory-audit-item span {
  color: var(--muted);

  font-size: 7.8px;
  font-weight: 760;
  line-height: 1.2;
}

.inventory-audit-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));

  border-bottom: 1px solid var(--inventory-border-soft);
}

.inventory-audit-metrics article {
  display: grid;
  align-content: center;
  gap: 4px;

  min-height: 58px;
  padding: 9px;

  border-right: 1px solid var(--inventory-border-soft);
}

.inventory-audit-metrics article:last-child {
  border-right: 0;
}

.inventory-audit-metrics span {
  color: var(--inventory-critical);

  font-size: 7.2px;
  font-weight: 950;
  letter-spacing: 0.09em;
  line-height: 1;
  text-transform: uppercase;
}

.inventory-audit-metrics strong {
  color: var(--text-strong);

  font-size: 17px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: -0.06em;
}

html[data-theme="dark"] .inventory-audit-list {
  border-right-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-mini-head {
  border-bottom-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-mini-head strong,
html[data-theme="dark"] .inventory-audit-item strong,
html[data-theme="dark"] .inventory-audit-metrics strong {
  color: rgba(255, 255, 255, 0.92);
}

html[data-theme="dark"] .inventory-audit-item span {
  color: rgba(255, 255, 255, 0.48);
}

/* =========================================================
   REMITOS
   ========================================================= */

.inventory-remito-types {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;

  padding: 10px 0;

  border-bottom: 1px solid var(--inventory-border-soft);
}

.inventory-remito-types article,
.inventory-remito-types button {
  display: grid;
  align-content: start;
  gap: 5px;

  min-height: 66px;
  padding: 10px;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--inventory-bg);

  color: inherit;
  text-align: left;

  cursor: pointer;
}

.inventory-remito-types article.is-selected,
.inventory-remito-types button.is-selected {
  border-color: var(--text-strong);
  background: var(--text-strong);
}

.inventory-remito-types strong {
  color: var(--text-strong);

  font-size: 9px;
  font-weight: 950;
  line-height: 1;
}

.inventory-remito-types p {
  margin: 0;

  color: var(--muted);

  font-size: 7.8px;
  font-weight: 760;
  line-height: 1.35;
}

.inventory-remito-types article.is-selected strong,
.inventory-remito-types button.is-selected strong {
  color: var(--white);
}

.inventory-remito-types article.is-selected p,
.inventory-remito-types button.is-selected p {
  color: rgba(255, 255, 255, 0.68);
}

html[data-theme="dark"] .inventory-remito-types {
  border-bottom-color: var(--inventory-border-soft);
}

html[data-theme="dark"] .inventory-remito-types article,
html[data-theme="dark"] .inventory-remito-types button {
  border-color: var(--inventory-border);
  background: var(--inventory-bg);
}

html[data-theme="dark"] .inventory-remito-types article.is-selected strong,
html[data-theme="dark"] .inventory-remito-types button.is-selected strong {
  color: #090b10;
}

html[data-theme="dark"] .inventory-remito-types article.is-selected p,
html[data-theme="dark"] .inventory-remito-types button.is-selected p {
  color: rgba(9, 11, 16, 0.66);
}

/* =========================================================
   BASE DE DATOS / ZONA CRÍTICA
   ========================================================= */

.inventory-critical-zone {
  display: grid;
  gap: 8px;

  margin-top: 10px;
  padding: 10px;

  border: 1px solid rgba(220, 38, 38, 0.25);
  border-radius: 0;
  background: rgba(220, 38, 38, 0.035);

  opacity: 0.65;
  pointer-events: none;

  transition:
    opacity var(--transition),
    background var(--transition),
    border-color var(--transition);
}

.inventory-critical-zone.is-enabled {
  opacity: 1;
  pointer-events: auto;
  border-color: rgba(220, 38, 38, 0.45);
  background: rgba(220, 38, 38, 0.055);
}

.inventory-critical-zone__head {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}

.inventory-critical-zone__head .icon,
.inventory-critical-zone__head svg {
  display: block;
  width: 17px;
  height: 17px;
  min-width: 17px;
  min-height: 17px;

  color: var(--inventory-critical);
  stroke-width: 2.25;
}

.inventory-critical-zone__head strong {
  color: var(--text-strong);

  font-size: 9px;
  font-weight: 950;
  line-height: 1;
}

.inventory-critical-zone__head p {
  margin: 4px 0 0;

  color: var(--muted);

  font-size: 7.8px;
  font-weight: 760;
  line-height: 1.35;
}

.inventory-db-status {
  margin: 0;
  padding: 8px 0 0;

  border-top: 1px solid var(--inventory-border-soft);

  color: var(--muted);

  font-size: 7.8px;
  font-weight: 850;
  line-height: 1.35;
}

/* =========================================================
   TOAST
   ========================================================= */

.inventory-toast {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 250;

  max-width: min(360px, calc(100vw - 28px));
  padding: 10px 12px;

  border: 1px solid var(--inventory-border);
  border-radius: 0;
  background: var(--text-strong);

  color: var(--white);

  font-size: 8.8px;
  font-weight: 850;
  line-height: 1.35;

  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);

  transition:
    opacity var(--transition),
    transform var(--transition);
}

.inventory-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

html[data-theme="dark"] .inventory-toast {
  border-color: rgba(255, 255, 255, 0.13);
  background: rgba(255, 255, 255, 0.9);
  color: #090b10;
}

/* =========================================================
   ICONOS · FIX CENTRADO GLOBAL INVENTARIO
   ========================================================= */

.inventory-page .inventory-brand__icon,
.inventory-page .inventory-event__icon,
.inventory-page .inventory-row-btn,
.inventory-page .inventory-btn,
.inventory-page .inventory-search,
.inventory-page .inventory-mini-head,
.inventory-page .inventory-flow__head {
  align-items: center !important;
}

.inventory-page .inventory-brand__icon,
.inventory-page .inventory-event__icon,
.inventory-page .inventory-row-btn {
  display: flex !important;
  justify-content: center !important;
  place-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
  text-align: center !important;
  flex: 0 0 auto !important;
  vertical-align: middle !important;
}

.inventory-page svg,
.inventory-page .icon {
  position: static !important;
  transform: none !important;
}

/* =========================================================
   RESPONSIVE · TABLET
   ========================================================= */

@media (max-width: 1380px) {
  .inventory-head {
    grid-template-columns: 1fr;
  }

  .inventory-actions {
    justify-content: flex-start;
  }

  .inventory-toolbar {
    grid-template-columns: 1fr;
  }

  .inventory-filters {
    justify-content: flex-start;
  }

  .inventory-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inventory-event:nth-child(2n) {
    border-right: 0;
  }

  .inventory-event:nth-child(n + 3) {
    border-top: 1px solid var(--inventory-border-soft);
  }

  .inventory-templates-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .inventory-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .inventory-metric:nth-child(3n) {
    border-right: 0;
  }

  .inventory-metric:nth-child(n + 4) {
    border-top: 1px solid var(--inventory-border-soft);
  }

  .inventory-audit-layout {
    grid-template-columns: 1fr;
  }

  .inventory-audit-list {
    max-height: 220px;
    border-right: 0;
    border-bottom: 1px solid var(--inventory-border-soft);
  }

  .inventory-tools-grid,
  .inventory-templates-grid {
    grid-template-columns: 1fr;
  }

  .inventory-table th,
  .inventory-table td {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 7.6px;
  }

  .inventory-table th {
    font-size: 6.2px;
  }

  .inventory-location .icon,
  .inventory-location svg,
  .inventory-th__sort .icon,
  .inventory-th__sort svg {
    display: none !important;
  }
}

@media (max-width: 760px) {
  .inventory-brand h2 {
    font-size: 16px;
  }

  .inventory-brand p {
    font-size: 8.4px;
  }

  .inventory-pagination {
    display: grid;
    grid-template-columns: 1fr;
  }

  .inventory-pagination .inventory-btn {
    width: 100%;
  }

  .inventory-action-row {
    grid-template-columns: 1fr;
  }

  .inventory-action-row__buttons {
    justify-content: stretch;
  }

  .inventory-action-row__buttons .inventory-btn {
    width: 100%;
  }

  .inventory-audit-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inventory-audit-metrics article:nth-child(2n) {
    border-right: 0;
  }

  .inventory-audit-metrics article:nth-child(n + 3) {
    border-top: 1px solid var(--inventory-border-soft);
  }

  .inventory-remito-types {
    grid-template-columns: 1fr;
  }

  .inventory-table th,
  .inventory-table td {
    padding-left: 4px;
    padding-right: 4px;
    font-size: 6.9px;
  }

  .inventory-table th {
    font-size: 5.7px;
    letter-spacing: 0.045em;
  }

  .inventory-row-btn {
    width: 23px;
    height: 23px;
    min-width: 23px;
    max-width: 23px;
  }

  .inventory-bulk.is-active {
    grid-template-columns: 1fr;
    max-height: 130px;
  }

  .inventory-bulk__actions {
    justify-content: flex-start;
  }
}

/* =========================================================
   RESPONSIVE · MOBILE REAL
   Tabla oculta + lista mobile desde JS
   ========================================================= */

@media (max-width: 620px) {
  .inventory-page {
    gap: 7px;
    min-height: auto;
  }

  .inventory-head {
    gap: 8px;
    min-height: 0;
    padding: 9px;
  }

  .inventory-brand {
    align-items: flex-start;
  }

  .inventory-brand p {
    display: none;
  }

  .inventory-actions,
  .inventory-filters {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    gap: 5px;
  }

  .inventory-search {
    width: 100%;
    min-width: 0;
  }

  .inventory-btn,
  .inventory-filters select,
  .inventory-search {
    width: 100%;
    min-height: 29px;
    height: 29px;
  }

  .inventory-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inventory-metric {
    min-height: 48px;
    padding: 8px;

    border-right: 1px solid var(--inventory-border-soft);
    border-top: 1px solid var(--inventory-border-soft);
  }

  .inventory-metric:nth-child(1),
  .inventory-metric:nth-child(2) {
    border-top: 0;
  }

  .inventory-metric:nth-child(2n) {
    border-right: 0;
  }

  .inventory-metric span {
    font-size: 7px;
  }

  .inventory-metric strong {
    font-size: 16px;
  }

  .inventory-metric small {
    font-size: 7px;
  }

  .inventory-toolbar {
    gap: 6px;
    padding: 8px;
  }

  .inventory-title {
    display: none;
  }

  .inventory-bulk.is-active {
    min-height: 0;
    max-height: 240px;
    padding: 8px;
    grid-template-columns: 1fr;
  }

  .inventory-bulk__actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .inventory-bulk__actions .inventory-btn {
    width: 100%;
  }

  .inventory-table-wrap {
    display: none !important;
  }

  .inventory-mobile-list {
    display: grid;
    gap: 0;

    width: 100%;

    background: var(--inventory-bg);
  }

  .inventory-mobile-empty {
    display: grid;
    align-content: center;

    min-height: 64px;
    padding: 10px;

    border-bottom: 1px solid var(--inventory-border-soft);
  }

  .inventory-mobile-empty strong {
    color: var(--text-strong);

    font-size: 9px;
    font-weight: 950;
    line-height: 1.2;
  }

  .inventory-mobile-item {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) 72px;
    gap: 7px;
    align-items: center;

    min-height: 70px;
    padding: 8px 7px;

    border-bottom: 1px solid var(--inventory-border-soft);
    background: transparent;

    transition:
      background var(--transition),
      border-color var(--transition);
  }

  .inventory-mobile-item:hover {
    background: rgba(15, 23, 42, 0.026);
  }

  .inventory-mobile-item.is-selected {
    background: rgba(250, 226, 50, 0.08);
  }

  .inventory-mobile-item__check {
    display: grid;
    place-items: center;
    min-width: 0;
  }

  .inventory-mobile-item__main {
    display: grid;
    gap: 4px;
    min-width: 0;
  }

  .inventory-mobile-item__main > strong {
    display: block;
    max-width: 100%;

    color: var(--text-strong);

    font-size: 9px;
    font-weight: 950;
    line-height: 1.08;
    letter-spacing: -0.025em;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .inventory-mobile-item__sku {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
  }

  .inventory-mobile-item__sku span {
    color: var(--muted);

    font-size: 6.8px;
    font-weight: 950;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
  }

  .inventory-mobile-item__sku b {
    display: block;
    min-width: 0;

    color: var(--text-strong);

    font-size: 7.8px;
    font-weight: 900;
    line-height: 1;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .inventory-mobile-item__meta {
    display: flex;
    align-items: center;
    gap: 4px;

    min-width: 0;
    overflow: hidden;
  }

  .inventory-mobile-item__meta span {
    display: inline-block;

    min-width: 0;
    max-width: 34%;

    color: var(--muted);

    font-size: 7px;
    font-weight: 760;
    line-height: 1;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .inventory-mobile-item__meta span:not(:last-child)::after {
    content: "·";
    margin-left: 4px;
    color: var(--muted-2);
  }

  .inventory-mobile-item__stock {
    display: flex;
    align-items: center;
    gap: 5px;

    min-width: 0;
    overflow: hidden;
  }

  .inventory-mobile-item__stock span {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    min-width: 0;

    color: var(--text-strong);

    font-size: 7.5px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
  }

  .inventory-mobile-item__stock b {
    color: var(--muted);

    font-size: 6.8px;
    font-weight: 950;
    letter-spacing: 0.045em;
    text-transform: uppercase;
  }

  .inventory-mobile-item__actions {
    display: flex;
    justify-content: flex-end;
    gap: 3px;
    min-width: 0;
  }

  .inventory-mobile-item__actions .inventory-row-btn {
    width: 21px !important;
    height: 21px !important;
    min-width: 21px !important;
    max-width: 21px !important;
  }

  .inventory-mobile-item__actions .inventory-row-btn .icon,
  .inventory-mobile-item__actions .inventory-row-btn svg {
    width: 10px !important;
    height: 10px !important;
    min-width: 10px !important;
    min-height: 10px !important;
  }

  .inventory-pagination {
    grid-template-columns: 1fr;
    gap: 5px;

    min-height: 0;
    padding: 7px;
  }

  .inventory-pagination strong {
    order: -1;
    font-size: 7.2px;
  }

  .inventory-flow {
    display: none;
  }

  .inventory-templates-grid {
    grid-template-columns: 1fr;
  }

  .inventory-template-card {
    min-height: 0;
    grid-template-columns: 18px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 7px;
    padding: 9px;
  }

  .inventory-template-card > .icon,
  .inventory-template-card > svg {
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 15px;
    height: 15px;
  }

  .inventory-template-card > div {
    grid-column: 2;
    min-width: 0;
  }

  .inventory-template-card .inventory-btn {
    grid-column: 1 / -1;
  }

  html[data-theme="dark"] .inventory-mobile-list {
    background: var(--inventory-bg);
  }

  html[data-theme="dark"] .inventory-mobile-item:hover {
    background: rgba(255, 255, 255, 0.045);
  }

  html[data-theme="dark"] .inventory-mobile-item.is-selected {
    background: rgba(250, 226, 50, 0.09);
  }

  html[data-theme="dark"] .inventory-mobile-item__main > strong {
    color: rgba(255, 255, 255, 0.92);
  }

  html[data-theme="dark"] .inventory-mobile-item__sku span,
  html[data-theme="dark"] .inventory-mobile-item__meta span,
  html[data-theme="dark"] .inventory-mobile-item__stock b {
    color: rgba(255, 255, 255, 0.46);
  }

  html[data-theme="dark"] .inventory-mobile-item__sku b,
  html[data-theme="dark"] .inventory-mobile-item__stock span {
    color: rgba(255, 255, 255, 0.82);
  }
}

/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  .inventory-page,
  .inventory-page *,
  .inventory-page *::before,
  .inventory-page *::after {
    animation: none !important;
    transition: none !important;
  }
}/* =========================================================
   INVENTARIO · OVERRIDE TAMAÑO MÁS GRANDE
   Misma línea Dashboard, pero más legible
   ========================================================= */

.inventory-page {
  font-size: 10px;
}

/* Header */
.inventory-brand h2 {
  font-size: 22px !important;
}

.inventory-brand p {
  font-size: 10.5px !important;
}

/* Métricas */
.inventory-metric {
  min-height: 66px !important;
  padding: 11px !important;
}

.inventory-metric span {
  font-size: 8.4px !important;
}

.inventory-metric strong {
  font-size: 22px !important;
}

.inventory-metric small {
  font-size: 8.6px !important;
}

/* Títulos internos */
.inventory-title span,
.inventory-flow__head span,
.inventory-mini-head span {
  font-size: 8.4px !important;
}

.inventory-title strong,
.inventory-flow__head strong,
.inventory-mini-head strong {
  font-size: 13.6px !important;
}

/* Filtros / inputs */
.inventory-search {
  height: 32px !important;
}

.inventory-search input,
.inventory-filters select,
.inventory-field input,
.inventory-field select,
.inventory-field textarea {
  font-size: 10.2px !important;
}

.inventory-filters select {
  height: 32px !important;
}

/* Botones */
.inventory-btn {
  min-height: 32px !important;
  padding: 0 12px !important;
  font-size: 10px !important;
}

.inventory-btn .icon,
.inventory-btn svg {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
  min-height: 13px !important;
}

/* Tabla */
.inventory-table th,
.inventory-table td {
  height: 35px !important;
  font-size: 9.8px !important;
}

.inventory-table th {
  font-size: 7.8px !important;
}

/* Textos especiales tabla */
.inventory-code,
.inventory-stock,
.inventory-status,
.inventory-kit,
.inventory-product,
.inventory-location,
.inventory-number,
.inventory-kind {
  font-size: 9.8px !important;
}

/* Iconos ubicación / tabla */
.inventory-location .icon,
.inventory-location svg,
.inventory-kind .icon,
.inventory-kind svg {
  width: 12px !important;
  height: 12px !important;
  min-width: 12px !important;
  min-height: 12px !important;
}

/* Acciones de fila */
.inventory-row-actions {
  gap: 5px !important;
  justify-content: center !important;
}

.inventory-row-btn {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
}

.inventory-row-btn .icon,
.inventory-row-btn svg {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
  min-height: 13px !important;
}

/* Paginación */
.inventory-pagination {
  min-height: 44px !important;
}

.inventory-pagination strong {
  font-size: 8.6px !important;
}

/* Timeline / flujo */
.inventory-event {
  min-height: 82px !important;
}

.inventory-event__body strong {
  font-size: 10px !important;
}

.inventory-event__body p {
  font-size: 8.8px !important;
}

.inventory-event__body small {
  font-size: 8px !important;
}

.inventory-event__icon {
  width: 31px !important;
  height: 31px !important;
  min-width: 31px !important;
  min-height: 31px !important;
}

.inventory-event__icon .icon,
.inventory-event__icon svg {
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  min-height: 15px !important;
}

/* Modales también más grandes */
.inventory-modal__head span {
  font-size: 8px !important;
}

.inventory-modal__head h3 {
  font-size: 15px !important;
}

.inventory-modal-text {
  font-size: 10px !important;
}

.inventory-modal .inventory-btn {
  min-height: 32px !important;
  font-size: 10px !important;
}

.inventory-modal .inventory-btn .icon,
.inventory-modal .inventory-btn svg {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
  min-height: 13px !important;
}

.inventory-modal .inventory-row-btn {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
}

.inventory-modal .inventory-row-btn .icon,
.inventory-modal .inventory-row-btn svg {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
  min-height: 13px !important;
}

/* Cards / filas auxiliares */
.inventory-action-row strong,
.inventory-tool-card strong,
.inventory-template-card strong {
  font-size: 10.2px !important;
}

.inventory-action-row p,
.inventory-tool-card p,
.inventory-template-card p {
  font-size: 8.8px !important;
}

/* Mobile */
@media (max-width: 620px) {
  .inventory-brand h2 {
    font-size: 18px !important;
  }

  .inventory-metric strong {
    font-size: 18px !important;
  }

  .inventory-mobile-item {
    min-height: 78px !important;
  }

  .inventory-mobile-item__main > strong {
    font-size: 10.4px !important;
  }

  .inventory-mobile-item__sku b,
  .inventory-mobile-item__stock span {
    font-size: 8.7px !important;
  }

  .inventory-mobile-item__sku span,
  .inventory-mobile-item__stock b,
  .inventory-mobile-item__meta span {
    font-size: 7.6px !important;
  }

  .inventory-mobile-item__actions .inventory-row-btn {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    max-width: 26px !important;
  }

  .inventory-mobile-item__actions .inventory-row-btn .icon,
  .inventory-mobile-item__actions .inventory-row-btn svg {
    width: 12px !important;
    height: 12px !important;
    min-width: 12px !important;
    min-height: 12px !important;
  }
}
/* =========================================================
   INVENTARIO · NUEVOS MÓDULOS
   Agregar al final de inventario.css
   ========================================================= */

/* =========================================================
   MODAL · SELECTOR DE COLUMNAS
   ========================================================= */

#inventoryColumnsModal .inventory-modal__card {
  width: min(620px, calc(100vw - 28px));
}

#inventoryColumnsModal .inventory-modal-body {
  gap: 10px;
}

.inventory-columns-selector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  min-width: 0;

  overflow: hidden;

  border: 1px solid var(--modal-border);
  border-radius: 14px;
  background: var(--modal-panel);
}

.inventory-column-option {
  display: flex;
  align-items: center;
  gap: 9px;

  min-width: 0;
  min-height: 42px;
  padding: 9px 11px;

  border-right: 1px solid var(--modal-border);
  border-bottom: 1px solid var(--modal-border);

  color: var(--modal-text);

  cursor: pointer;

  transition:
    background var(--transition),
    color var(--transition);
}

.inventory-column-option:nth-child(2n) {
  border-right: 0;
}

.inventory-column-option:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.inventory-column-option:hover {
  background: var(--modal-soft);
}

.inventory-column-option input {
  width: 15px;
  height: 15px;
  min-width: 15px;
  margin: 0;

  accent-color: var(--modal-dark);

  cursor: pointer;
}

.inventory-column-option span {
  min-width: 0;

  overflow: hidden;

  color: var(--modal-text);

  font-size: 9.5px;
  font-weight: 900;
  line-height: 1.15;

  white-space: nowrap;
  text-overflow: ellipsis;
}

html[data-theme="dark"] .inventory-column-option {
  border-color: var(--modal-border);
}

html[data-theme="dark"] .inventory-column-option:hover {
  background: rgba(255, 255, 255, 0.055);
}

/* =========================================================
   CAMPOS SOLO EDICIÓN / VER
   Peso y máximo
   ========================================================= */

[data-inventory-edit-only][hidden],
[data-inventory-edit-only][aria-hidden="true"] {
  display: none !important;
}

/* =========================================================
   FILA DE KIT
   ========================================================= */

.inventory-product-kit-label {
  display: block;

  max-width: 100%;
  margin-top: 3px;

  overflow: hidden;

  color: var(--inventory-medium);

  font-size: 7px;
  font-weight: 900;
  line-height: 1;

  white-space: nowrap;
  text-overflow: ellipsis;
}

.inventory-table tbody tr.is-kit-row {
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--inventory-medium) 5%, transparent),
      transparent 28%
    );
}

.inventory-table tbody tr.is-kit-row:hover {
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--inventory-medium) 9%, transparent),
      rgba(15, 23, 42, 0.025) 32%
    );
}

html[data-theme="dark"] .inventory-product-kit-label {
  color: #facc15;
}

html[data-theme="dark"] .inventory-table tbody tr.is-kit-row {
  background:
    linear-gradient(
      90deg,
      rgba(250, 204, 21, 0.055),
      transparent 28%
    );
}

html[data-theme="dark"] .inventory-table tbody tr.is-kit-row:hover {
  background:
    linear-gradient(
      90deg,
      rgba(250, 204, 21, 0.09),
      rgba(255, 255, 255, 0.025) 32%
    );
}

/* =========================================================
   TABLA · COLUMNAS DINÁMICAS
   Los anchos los controla inventario.tabla.js
   ========================================================= */

.inventory-table th[data-inventory-column],
.inventory-table td {
  min-width: 0 !important;
  max-width: none !important;
}

.inventory-table th[data-inventory-column] {
  overflow: visible !important;
}

.inventory-table th[data-inventory-column="select"],
.inventory-table th[data-inventory-column="acciones"] {
  text-align: center !important;
}

.inventory-table td.is-right {
  text-align: right !important;
}

.inventory-table td.is-center {
  text-align: center !important;
}

/* Desactiva los anchos antiguos por posición.
   Los nuevos anchos son colocados inline por JavaScript. */

.inventory-table th,
.inventory-table td {
  width: auto;
}

/* =========================================================
   REDIMENSIONADO DE COLUMNAS
   ========================================================= */

.inventory-th__resize {
  position: absolute;
  top: 0;
  right: -4px;
  z-index: 15;

  display: block;

  width: 9px;
  height: 100%;

  cursor: col-resize;
  touch-action: none;
}

.inventory-th__resize::before {
  content: "";

  position: absolute;
  top: 7px;
  bottom: 7px;
  left: 4px;

  width: 1px;

  background: transparent;

  transition:
    background var(--transition),
    opacity var(--transition);
}

.inventory-th:hover .inventory-th__resize::before,
body.is-resizing-inventory-column .inventory-th__resize::before {
  background: rgba(15, 23, 42, 0.4);
}

html[data-theme="dark"] .inventory-th:hover .inventory-th__resize::before,
html[data-theme="dark"]
  body.is-resizing-inventory-column
  .inventory-th__resize::before {
  background: rgba(255, 255, 255, 0.44);
}

body.is-resizing-inventory-column {
  cursor: col-resize !important;
  user-select: none !important;
}

body.is-resizing-inventory-column * {
  cursor: col-resize !important;
  user-select: none !important;
}

/* =========================================================
   EDICIÓN MASIVA
   ========================================================= */

#inventoryBulkEditModal .inventory-modal__card {
  width: min(1080px, calc(100vw - 32px));
}

#inventoryBulkEditModal .inventory-modal-text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#inventoryBulkEditModal .inventory-modal-text strong {
  color: var(--modal-text);

  font-size: 9px;
  font-weight: 950;
  line-height: 1;

  white-space: nowrap;
}

/* =========================================================
   BOTÓN COLUMNAS EN HEADER
   ========================================================= */

.inventory-actions
  [data-inventory-header-action="columns"] {
  border-style: dashed;
}

/* =========================================================
   ICONOS DE CARGA
   ========================================================= */

.inventory-modal [data-lucide="loader-circle"],
.inventory-page [data-lucide="loader-circle"] {
  animation: inventoryLoaderSpin 0.8s linear infinite;
}

@keyframes inventoryLoaderSpin {
  to {
    transform: rotate(360deg);
  }
}

/* =========================================================
   MODAL PRODUCTO · CAMPOS DE STOCK DEL KIT
   ========================================================= */

#inventoryProductModal
  [data-inventory-physical-stock-field].is-kit-disabled {
  opacity: 0.68;
}

#inventoryProductModal
  [data-inventory-physical-stock-field].is-kit-disabled
  input {
  pointer-events: none;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 620px) {
  .inventory-columns-selector {
    grid-template-columns: 1fr;
  }

  .inventory-column-option,
  .inventory-column-option:nth-child(2n),
  .inventory-column-option:nth-last-child(-n + 2) {
    border-right: 0;
    border-bottom: 1px solid var(--modal-border);
  }

  .inventory-column-option:last-child {
    border-bottom: 0;
  }

  #inventoryBulkEditModal .inventory-modal-text {
    display: grid;
    justify-content: stretch;
  }

  #inventoryBulkEditModal .inventory-modal-text strong {
    white-space: normal;
  }

  .inventory-product-kit-label {
    font-size: 6.8px;
  }
}/* =========================================================
   INVENTARIO · CORRECCIÓN MODAL COLUMNAS
   Agregar al final de inventario.css
   ========================================================= */

#inventoryColumnsModal {
  place-items: center;
  padding: 16px;
}

#inventoryColumnsModal .inventory-modal__card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;

  width: min(560px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  max-height: min(680px, calc(100vh - 32px));

  border-radius: 16px;
}

#inventoryColumnsModal .inventory-modal__head {
  min-height: 56px;
  padding: 12px 14px;
}

#inventoryColumnsModal .inventory-modal-body {
  gap: 10px;
  padding: 12px 14px;

  overflow-y: auto;
}

#inventoryColumnsModal .inventory-modal-text {
  padding: 10px 11px;

  border-radius: 10px;

  font-size: 9px !important;
  line-height: 1.35;
}

#inventoryColumnsModal .inventory-columns-selector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  border: 1px solid var(--modal-border);
  border-radius: 12px;
  overflow: hidden;
}

#inventoryColumnsModal .inventory-column-option {
  min-height: 40px;
  padding: 9px 11px;

  border-right: 1px solid var(--modal-border);
  border-bottom: 1px solid var(--modal-border);
  background: var(--modal-bg);
}

#inventoryColumnsModal .inventory-column-option:nth-child(2n) {
  border-right: 0;
}

#inventoryColumnsModal .inventory-column-option:nth-last-child(-n + 2) {
  border-bottom: 0;
}

#inventoryColumnsModal .inventory-column-option:hover {
  background: var(--modal-soft);
}

#inventoryColumnsModal .inventory-column-option input {
  width: 14px;
  height: 14px;
  min-width: 14px;
}

#inventoryColumnsModal .inventory-column-option span {
  font-size: 8.7px;
  font-weight: 900;
}

#inventoryColumnsModal .inventory-modal__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;

  padding: 10px 14px;

  border-top: 1px solid var(--modal-border);
  background: var(--modal-bg);
}

#inventoryColumnsModal .inventory-modal__footer .inventory-btn {
  min-height: 32px !important;
  padding: 0 11px !important;

  font-size: 8.8px !important;
}

@media (max-width: 620px) {
  #inventoryColumnsModal {
    padding: 0;
  }

  #inventoryColumnsModal .inventory-modal__card {
    width: 100vw;
    max-width: 100vw;
    height: 100vh;
    max-height: 100vh;

    border-radius: 0;
  }

  #inventoryColumnsModal .inventory-columns-selector {
    grid-template-columns: 1fr;
  }

  #inventoryColumnsModal .inventory-column-option,
  #inventoryColumnsModal .inventory-column-option:nth-child(2n),
  #inventoryColumnsModal .inventory-column-option:nth-last-child(-n + 2) {
    border-right: 0;
    border-bottom: 1px solid var(--modal-border);
  }

  #inventoryColumnsModal .inventory-column-option:last-child {
    border-bottom: 0;
  }

  #inventoryColumnsModal .inventory-modal__footer {
    display: grid;
    grid-template-columns: 1fr;

    padding: 8px;
  }

  #inventoryColumnsModal .inventory-modal__footer .inventory-btn {
    width: 100%;
  }
}/* =========================================================
   INVENTARIO · CORRECCIÓN VENTANA PRODUCTO / KIT
   Agregar al final de inventario.css
   ========================================================= */

#inventoryProductModal {
  padding: 14px;
  place-items: center;
}

#inventoryProductModal .inventory-modal__card--product {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);

  width: min(1180px, calc(100vw - 28px));
  max-width: min(1180px, calc(100vw - 28px));

  height: min(900px, calc(100vh - 28px));
  max-height: calc(100vh - 28px);

  border-radius: 16px;
  overflow: hidden;
}

#inventoryProductModal .inventory-modal__head {
  min-height: 62px;
  padding: 13px 16px;

  border-bottom: 1px solid var(--modal-border);
}

#inventoryProductModal .inventory-modal__head h3 {
  margin-top: 4px;

  font-size: 15px !important;
  line-height: 1.15;
}

#inventoryProductModal .inventory-form {
  display: grid;
  grid-auto-rows: max-content;
  align-content: start;
  gap: 12px;

  min-width: 0;
  min-height: 0;

  padding: 14px 16px 0;

  overflow-x: hidden;
  overflow-y: auto;
}

/* =========================================================
   GRILLAS DEL FORMULARIO
   ========================================================= */

#inventoryProductModal .inventory-form-grid {
  display: grid;
  align-items: start;
  gap: 10px;

  width: 100%;
  min-width: 0;
}

#inventoryProductModal .inventory-form-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#inventoryProductModal .inventory-form-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#inventoryProductModal .inventory-form-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* =========================================================
   CAMPOS
   ========================================================= */

#inventoryProductModal .inventory-field {
  display: grid;
  grid-template-rows: auto auto;
  align-content: start;
  gap: 6px;

  min-width: 0;
  min-height: 62px;
}

#inventoryProductModal .inventory-field[hidden] {
  display: none !important;
}

#inventoryProductModal .inventory-field label {
  display: block;

  margin: 0;

  color: var(--modal-muted);

  font-size: 8px !important;
  font-weight: 950;
  line-height: 1.1;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

#inventoryProductModal .inventory-field input,
#inventoryProductModal .inventory-field select,
#inventoryProductModal .inventory-field textarea {
  display: block;

  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 0 11px;

  border: 1px solid var(--modal-border);
  border-radius: 10px;
  background: var(--modal-bg);

  color: var(--modal-text);

  font-size: 10px !important;
  font-weight: 780;
  line-height: 1.3;

  outline: none;
}

#inventoryProductModal .inventory-field input,
#inventoryProductModal .inventory-field select {
  height: 38px !important;
  min-height: 38px !important;
}

#inventoryProductModal .inventory-field textarea {
  min-height: 76px !important;
  padding-top: 10px;
  padding-bottom: 10px;

  resize: vertical;
}

#inventoryProductModal #inventoryProducto {
  min-height: 82px !important;
}

#inventoryProductModal #inventoryObservacion {
  min-height: 82px !important;
}

#inventoryProductModal .inventory-field input:focus,
#inventoryProductModal .inventory-field select:focus,
#inventoryProductModal .inventory-field textarea:focus {
  border-color: color-mix(
    in srgb,
    var(--modal-text) 35%,
    var(--modal-border)
  );

  background: var(--modal-panel);
}

/* =========================================================
   SWITCHES
   ========================================================= */

#inventoryProductModal .inventory-switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;

  min-width: 0;
  min-height: 62px;
  padding: 10px 12px;

  border: 1px solid var(--modal-border);
  border-radius: 10px;
  background: var(--modal-bg);
}

#inventoryProductModal .inventory-switch span {
  color: var(--modal-text);

  font-size: 9px;
  font-weight: 900;
  line-height: 1.15;
}

#inventoryProductModal .inventory-switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

#inventoryProductModal .inventory-switch b {
  position: relative;

  display: block;
  flex: 0 0 auto;

  width: 34px;
  height: 19px;

  border-radius: 999px;
  background: rgba(100, 116, 139, 0.25);

  transition: background var(--transition);
}

#inventoryProductModal .inventory-switch b::after {
  content: "";

  position: absolute;
  top: 3px;
  left: 3px;

  width: 13px;
  height: 13px;

  border-radius: 50%;
  background: #ffffff;

  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.2);

  transition: transform var(--transition);
}

#inventoryProductModal .inventory-switch input:checked + b {
  background: var(--modal-dark);
}

#inventoryProductModal .inventory-switch input:checked + b::after {
  transform: translateX(15px);
}

/* =========================================================
   SECCIÓN KIT
   ========================================================= */

#inventoryProductModal .inventory-kit-section {
  display: grid;
  grid-auto-rows: max-content;
  gap: 12px;

  min-width: 0;
  padding: 14px;

  border: 1px solid var(--modal-border);
  border-radius: 14px;
  background: var(--modal-soft);
}

#inventoryProductModal .inventory-kit-section[hidden] {
  display: none !important;
}

#inventoryProductModal .inventory-kit-section__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;

  min-width: 0;
  padding-bottom: 11px;

  border-bottom: 1px solid var(--modal-border);
}

#inventoryProductModal .inventory-kit-section__head > div {
  min-width: 0;
}

#inventoryProductModal .inventory-kit-section__head span {
  display: block;

  color: var(--modal-muted);

  font-size: 7.5px;
  font-weight: 950;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

#inventoryProductModal .inventory-kit-section__head strong {
  display: block;

  margin-top: 5px;

  color: var(--modal-text);

  font-size: 14px;
  font-weight: 950;
  line-height: 1.1;
}

#inventoryProductModal .inventory-kit-section__head p {
  margin: 5px 0 0;

  color: var(--modal-muted);

  font-size: 8.8px;
  font-weight: 760;
  line-height: 1.4;
}

#inventoryProductModal .inventory-kit-section__head > .icon,
#inventoryProductModal .inventory-kit-section__head > svg {
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
}

/* =========================================================
   MÉTRICAS DEL KIT
   ========================================================= */

#inventoryProductModal .inventory-kit-availability {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));

  min-width: 0;

  overflow: hidden;

  border: 1px solid var(--modal-border);
  border-radius: 12px;
  background: var(--modal-bg);
}

#inventoryProductModal .inventory-kit-metric {
  display: grid;
  align-content: center;
  gap: 5px;

  min-width: 0;
  min-height: 76px;
  padding: 11px 12px;

  border-right: 1px solid var(--modal-border);
}

#inventoryProductModal .inventory-kit-metric:last-child {
  border-right: 0;
}

#inventoryProductModal .inventory-kit-metric span {
  color: var(--modal-muted);

  font-size: 7px;
  font-weight: 950;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

#inventoryProductModal .inventory-kit-metric strong {
  color: var(--modal-text);

  font-size: 17px;
  font-weight: 950;
  line-height: 1;
}

#inventoryProductModal .inventory-kit-metric small {
  color: var(--modal-muted);

  font-size: 7.5px;
  font-weight: 760;
  line-height: 1.25;

  white-space: normal;
}

/* =========================================================
   BUSCADOR DEL KIT
   ========================================================= */

#inventoryProductModal .inventory-kit-search {
  position: relative;

  display: block;

  width: 100%;
  min-width: 0;
}

#inventoryProductModal .inventory-kit-search__input {
  width: 100%;
  min-width: 0;
  height: 40px !important;

  border-radius: 10px;
}

#inventoryProductModal .inventory-kit-search__input input {
  width: 100%;
  min-width: 0;
  height: 100%;

  font-size: 9.5px !important;
}

#inventoryProductModal .inventory-kit-search-results {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 30;

  max-height: 280px;

  overflow-y: auto;

  border: 1px solid var(--modal-border);
  border-radius: 12px;
  background: var(--modal-bg);

  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.14);
}

#inventoryProductModal .inventory-kit-search-results[hidden] {
  display: none !important;
}

#inventoryProductModal .inventory-kit-search-result {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto 18px;
  gap: 10px;
  align-items: center;

  width: 100%;
  min-width: 0;
  min-height: 58px;
  padding: 9px 11px;

  border: 0;
  border-bottom: 1px solid var(--modal-border);
  background: transparent;

  color: var(--modal-text);
  text-align: left;

  cursor: pointer;
}

#inventoryProductModal .inventory-kit-search-result:last-child {
  border-bottom: 0;
}

#inventoryProductModal .inventory-kit-search-result:hover {
  background: var(--modal-soft);
}

#inventoryProductModal .inventory-kit-search-result__main {
  display: grid;
  gap: 4px;

  min-width: 0;
}

#inventoryProductModal .inventory-kit-search-result__main strong,
#inventoryProductModal .inventory-kit-search-result__main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#inventoryProductModal .inventory-kit-search-result__main strong {
  font-size: 9px;
  font-weight: 950;
}

#inventoryProductModal .inventory-kit-search-result__main small {
  color: var(--modal-muted);

  font-size: 8px;
  font-weight: 760;
}

/* =========================================================
   COMPONENTES DEL KIT
   ========================================================= */

#inventoryProductModal .inventory-kit-components {
  display: grid;
  gap: 8px;

  min-width: 0;
}

#inventoryProductModal .inventory-kit-empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;

  min-height: 124px;
  padding: 18px;

  border: 1px dashed var(--modal-border);
  border-radius: 12px;
  background: var(--modal-bg);

  text-align: center;
}

#inventoryProductModal .inventory-kit-empty strong {
  color: var(--modal-text);

  font-size: 9.5px;
  font-weight: 950;
}

#inventoryProductModal .inventory-kit-empty span {
  color: var(--modal-muted);

  font-size: 8px;
  font-weight: 760;
}

#inventoryProductModal .inventory-kit-component {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 130px 32px;
  gap: 10px;
  align-items: center;

  min-width: 0;
  min-height: 80px;
  padding: 10px;

  border: 1px solid var(--modal-border);
  border-radius: 12px;
  background: var(--modal-bg);
}

#inventoryProductModal .inventory-kit-component__index {
  display: grid;
  place-items: center;

  width: 26px;
  height: 26px;

  border-radius: 8px;
  background: var(--modal-soft);

  color: var(--modal-text);

  font-size: 9px;
  font-weight: 950;
}

#inventoryProductModal .inventory-kit-component__main {
  display: grid;
  gap: 8px;

  min-width: 0;
}

#inventoryProductModal .inventory-kit-component__title {
  display: grid;
  gap: 4px;

  min-width: 0;
}

#inventoryProductModal .inventory-kit-component__title strong,
#inventoryProductModal .inventory-kit-component__title span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#inventoryProductModal .inventory-kit-component__title strong {
  color: var(--modal-text);

  font-size: 10px;
  font-weight: 950;
}

#inventoryProductModal .inventory-kit-component__title span {
  color: var(--modal-muted);

  font-size: 8.5px;
  font-weight: 760;
}

#inventoryProductModal .inventory-kit-component__stock {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;

  min-width: 0;
}

#inventoryProductModal .inventory-kit-component__stock span {
  color: var(--modal-text);

  font-size: 8px;
  font-weight: 850;
}

#inventoryProductModal .inventory-kit-component__stock b {
  margin-right: 3px;

  color: var(--modal-muted);

  font-size: 7px;
  font-weight: 950;
  text-transform: uppercase;
}

#inventoryProductModal .inventory-kit-component__quantity {
  display: grid;
  gap: 5px;

  min-width: 0;
}

#inventoryProductModal .inventory-kit-component__quantity label {
  color: var(--modal-muted);

  font-size: 7px;
  font-weight: 950;
  text-transform: uppercase;
}

#inventoryProductModal .inventory-kit-component__quantity input {
  width: 100%;
  height: 36px;
  padding: 0 9px;

  border: 1px solid var(--modal-border);
  border-radius: 9px;
  background: var(--modal-bg);

  color: var(--modal-text);

  font-size: 9px;
  font-weight: 900;
}

/* =========================================================
   PIE DEL KIT
   ========================================================= */

#inventoryProductModal .inventory-kit-section__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;

  padding-top: 2px;
}

/* =========================================================
   FOOTER PRINCIPAL
   ========================================================= */

#inventoryProductModal .inventory-modal__footer {
  position: sticky;
  bottom: 0;
  z-index: 12;

  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;

  margin: 0 -16px;
  padding: 11px 16px;

  border-top: 1px solid var(--modal-border);
  background: var(--modal-bg);
}

/* =========================================================
   MODO OSCURO
   ========================================================= */

html[data-theme="dark"]
  #inventoryProductModal
  .inventory-field input,
html[data-theme="dark"]
  #inventoryProductModal
  .inventory-field select,
html[data-theme="dark"]
  #inventoryProductModal
  .inventory-field textarea,
html[data-theme="dark"]
  #inventoryProductModal
  .inventory-kit-component,
html[data-theme="dark"]
  #inventoryProductModal
  .inventory-kit-empty,
html[data-theme="dark"]
  #inventoryProductModal
  .inventory-kit-availability,
html[data-theme="dark"]
  #inventoryProductModal
  .inventory-switch {
  background: rgba(255, 255, 255, 0.035);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 980px) {
  #inventoryProductModal .inventory-form-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #inventoryProductModal .inventory-form-grid--3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #inventoryProductModal .inventory-kit-availability {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #inventoryProductModal .inventory-kit-metric:nth-child(2n) {
    border-right: 0;
  }

  #inventoryProductModal .inventory-kit-metric:nth-child(n + 3) {
    border-top: 1px solid var(--modal-border);
  }

  #inventoryProductModal .inventory-kit-component {
    grid-template-columns: 28px minmax(0, 1fr) 110px 32px;
  }
}

@media (max-width: 620px) {
  #inventoryProductModal {
    padding: 0;
  }

  #inventoryProductModal .inventory-modal__card--product {
    width: 100vw;
    max-width: 100vw;
    height: 100vh;
    max-height: 100vh;

    border-radius: 0;
  }

  #inventoryProductModal .inventory-form {
    padding: 10px 10px 0;
  }

  #inventoryProductModal .inventory-form-grid--2,
  #inventoryProductModal .inventory-form-grid--3,
  #inventoryProductModal .inventory-form-grid--4 {
    grid-template-columns: 1fr;
  }

  #inventoryProductModal .inventory-kit-availability {
    grid-template-columns: 1fr;
  }

  #inventoryProductModal .inventory-kit-metric,
  #inventoryProductModal .inventory-kit-metric:nth-child(2n) {
    border-right: 0;
    border-top: 1px solid var(--modal-border);
  }

  #inventoryProductModal .inventory-kit-metric:first-child {
    border-top: 0;
  }

  #inventoryProductModal .inventory-kit-component {
    grid-template-columns: 26px minmax(0, 1fr) 32px;
  }

  #inventoryProductModal .inventory-kit-component__quantity {
    grid-column: 2 / -1;
  }

  #inventoryProductModal .inventory-kit-section__footer,
  #inventoryProductModal .inventory-modal__footer {
    display: grid;
    grid-template-columns: 1fr;

    width: auto;
  }

  #inventoryProductModal .inventory-modal__footer {
    margin: 0 -10px;
    padding: 9px 10px;
  }

  #inventoryProductModal .inventory-kit-section__footer .inventory-btn,
  #inventoryProductModal .inventory-modal__footer .inventory-btn {
    width: 100%;
  }
}/* =========================================================
   INVENTARIO · MISMA ESCALA + TODO EL ANCHO HORIZONTAL
   Agregar al FINAL de inventario.css
   ========================================================= */

.app-content:has(.inventory-page) {
  width: 100% !important;
  max-width: none !important;

  padding-left: 10px !important;
  padding-right: 10px !important;
}

.inventory-page,
.inventory-head,
.inventory-metrics,
.inventory-panel,
.inventory-toolbar,
.inventory-filters,
.inventory-table-wrap,
.inventory-flow {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

.inventory-page {
  gap: 12px !important;
}

/* =========================================================
   CABECERA
   ========================================================= */

.inventory-head {
  grid-template-columns:
    minmax(280px, 1fr)
    auto !important;

  min-height: 92px !important;

  padding:
    15px
    17px !important;

  gap: 16px !important;

  border-radius: 13px !important;
}

.inventory-brand {
  gap: 13px !important;
}

.inventory-brand__icon {
  width: 46px !important;
  height: 46px !important;

  min-width: 46px !important;
  max-width: 46px !important;

  min-height: 46px !important;
  max-height: 46px !important;

  border-radius: 11px !important;
}

.inventory-brand__icon .icon,
.inventory-brand__icon svg {
  width: 21px !important;
  height: 21px !important;

  min-width: 21px !important;
  min-height: 21px !important;
}

.inventory-brand h2 {
  font-size:
    clamp(
      24px,
      2.1vw,
      30px
    ) !important;

  font-weight: 950 !important;
  line-height: 1 !important;
}

.inventory-brand p {
  margin-top: 6px !important;

  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
}

/* =========================================================
   MÉTRICAS
   ========================================================= */

.inventory-metrics {
  grid-template-columns:
    repeat(
      6,
      minmax(0, 1fr)
    ) !important;

  gap: 1px !important;

  border-radius: 13px !important;
}

.inventory-metric {
  min-height: 72px !important;

  padding:
    11px
    12px !important;
}

.inventory-metric span {
  font-size: 9px !important;
  font-weight: 900 !important;
}

.inventory-metric strong {
  font-size: 19px !important;
  font-weight: 950 !important;
}

.inventory-metric small {
  font-size: 9.5px !important;
  font-weight: 700 !important;
}

/* =========================================================
   PANEL Y TOOLBAR
   ========================================================= */

.inventory-panel,
.inventory-flow {
  border-radius: 13px !important;
}

.inventory-toolbar {
  grid-template-columns:
    minmax(190px, 0.25fr)
    minmax(0, 1fr) !important;

  gap: 12px !important;

  padding:
    12px !important;
}

.inventory-title span {
  font-size: 9px !important;
  font-weight: 900 !important;
}

.inventory-title strong {
  font-size: 16px !important;
  font-weight: 950 !important;
}

/* =========================================================
   FILTROS
   ========================================================= */

.inventory-filters {
  display: grid !important;

  grid-template-columns:
    minmax(280px, 1fr)
    repeat(7, minmax(92px, auto))
    auto
    auto !important;

  gap: 7px !important;

  justify-content: stretch !important;
}

.inventory-search,
.inventory-filters select {
  width: 100% !important;
  min-width: 0 !important;

  height: 36px !important;
  min-height: 36px !important;

  border-radius: 9px !important;
}

.inventory-search {
  padding:
    0
    10px !important;
}

.inventory-search input,
.inventory-filters select {
  font-size: 10.5px !important;
  font-weight: 800 !important;
}

.inventory-search .icon,
.inventory-search svg {
  width: 14px !important;
  height: 14px !important;

  min-width: 14px !important;
  min-height: 14px !important;
}

/* =========================================================
   TABLA · USAR TODO EL ANCHO
   ========================================================= */

.inventory-table-wrap {
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.inventory-table {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  table-layout: fixed !important;
}

.inventory-table th {
  height: 42px !important;

  padding:
    0
    7px !important;

  font-size: 7.8px !important;
  font-weight: 950 !important;
}

.inventory-table td {
  height: 48px !important;

  padding:
    0
    7px !important;

  font-size: 9.8px !important;
  font-weight: 760 !important;
}

.inventory-code,
.inventory-stock,
.inventory-status,
.inventory-kit,
.inventory-product,
.inventory-location,
.inventory-number,
.inventory-kind {
  font-size: 9.8px !important;
}

/* Acciones con ancho suficiente */

.inventory-table th:last-child,
.inventory-table td:last-child {
  width: 132px !important;
  min-width: 132px !important;
  max-width: 132px !important;

  overflow: visible !important;
}

.inventory-row-actions {
  justify-content: flex-start !important;

  width: 100% !important;

  gap: 5px !important;

  overflow: visible !important;
}

/* =========================================================
   PAGINACIÓN
   ========================================================= */

.inventory-pagination {
  min-height: 48px !important;

  padding:
    8px
    10px !important;
}

.inventory-pagination strong {
  font-size: 9px !important;
}

/* =========================================================
   FLUJO OPERATIVO
   ========================================================= */

.inventory-flow__head {
  min-height: 58px !important;

  padding:
    10px
    12px !important;
}

.inventory-flow__head span {
  font-size: 9px !important;
}

.inventory-flow__head strong {
  font-size: 14px !important;
}

.inventory-event {
  min-height: 84px !important;

  padding:
    11px !important;
}

.inventory-event__body strong {
  font-size: 10.5px !important;
}

.inventory-event__body p {
  font-size: 9px !important;
}

.inventory-event__body small {
  font-size: 8px !important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1500px) {
  .inventory-filters {
    grid-template-columns:
      minmax(280px, 1fr)
      repeat(
        4,
        minmax(110px, 1fr)
      ) !important;
  }
}

@media (max-width: 1180px) {
  .inventory-head,
  .inventory-toolbar {
    grid-template-columns: 1fr !important;
  }

  .inventory-actions,
  .inventory-filters {
    justify-content: flex-start !important;
  }

  .inventory-filters {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      ) !important;
  }

  .inventory-search {
    grid-column:
      1 /
      -1 !important;
  }

  .inventory-table {
    min-width: 1180px !important;
  }

  .inventory-table-wrap {
    overflow-x: auto !important;
  }
}

@media (max-width: 620px) {
  .inventory-head {
    min-height: 0 !important;

    padding:
      12px !important;
  }

  .inventory-brand h2 {
    font-size: 22px !important;
  }

  .inventory-brand p {
    font-size: 11px !important;
  }

  .inventory-filters {
    grid-template-columns: 1fr !important;
  }

  .inventory-search {
    grid-column: auto !important;
  }
}/* =========================================================
   INVENTARIO · CUADRÍCULA VISIBLE EN LA TABLA
   Agregar al FINAL de inventario.css
   ========================================================= */

.inventory-table {
  border-collapse: collapse !important;
  border-spacing: 0 !important;

  border:
    1px solid
    rgba(15, 23, 42, 0.18) !important;
}

/* Bordes visibles en todas las columnas y filas */

.inventory-table th,
.inventory-table td {
  border-right:
    1px solid
    rgba(15, 23, 42, 0.14) !important;

  border-bottom:
    1px solid
    rgba(15, 23, 42, 0.14) !important;
}

/* Última columna sin borde duplicado */

.inventory-table th:last-child,
.inventory-table td:last-child {
  border-right: 0 !important;
}

/* Encabezado un poco más marcado */

.inventory-table thead th {
  background:
    #f6f7f9 !important;

  border-bottom:
    1px solid
    rgba(15, 23, 42, 0.22) !important;
}

/* Eliminar las líneas decorativas anteriores */

.inventory-table th::after,
.inventory-table td::after {
  display: none !important;
}

/* Separación visual entre filas */

.inventory-table tbody tr:nth-child(even) td {
  background:
    rgba(
      15,
      23,
      42,
      0.018
    );
}

.inventory-table tbody tr:hover td {
  background:
    rgba(
      15,
      23,
      42,
      0.045
    ) !important;
}

/* =========================================================
   MODO OSCURO
   ========================================================= */

html[data-theme="dark"] .inventory-table {
  border-color:
    rgba(
      255,
      255,
      255,
      0.16
    ) !important;
}

html[data-theme="dark"] .inventory-table th,
html[data-theme="dark"] .inventory-table td {
  border-right-color:
    rgba(
      255,
      255,
      255,
      0.12
    ) !important;

  border-bottom-color:
    rgba(
      255,
      255,
      255,
      0.12
    ) !important;
}

html[data-theme="dark"] .inventory-table thead th {
  background:
    #111111 !important;

  border-bottom-color:
    rgba(
      255,
      255,
      255,
      0.2
    ) !important;
}

html[data-theme="dark"]
.inventory-table
tbody
tr:nth-child(even)
td {
  background:
    rgba(
      255,
      255,
      255,
      0.018
    );
}

html[data-theme="dark"]
.inventory-table
tbody
tr:hover
td {
  background:
    rgba(
      255,
      255,
      255,
      0.055
    ) !important;
}