.pt-navbar {
  padding-top: 72px;
}

.h-inventory {
  height: calc(100dvh - 72px);
}

.td-min {
  white-space: nowrap;
  width: 0;
}

.inventory.expanded {
  padding-left: calc(var(--bs-gutter-x) * .5 + 20rem);
}

.inventory.expanded aside {
  width: 20rem;
  top: 3.5rem;
  min-height: 0;
}

@keyframes highlighted {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.6);
  }

  70% {
    box-shadow: 0 0 0 6px rgba(255, 193, 7, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 193, 7, 0);
  }
}

.highlighted {
  background-color: rgba(255, 193, 7, 0.2);
  animation: highlighted 1s ease-out;
}

@keyframes pulse-border {
  0% {
    box-shadow: 0 0 0 0 var(--bs-primary);
  }

  70% {
    box-shadow: 0 0 0 6px rgba(var(--bs-primary-rgb), 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(var(--bs-primary-rgb), 0);
  }
}

.attention {
  animation: pulse-border 1.5s ease-out infinite;
}

@media (min-width: 992px) {
  .pt-navbar {
    padding-top: 114px;
  }

  .h-inventory {
    height: calc(100dvh - 114px);
  }
}

.btn-plain {
  --bs-btn-color: #000;
  --bs-btn-bg: #f8f9fa;
  --bs-btn-border-color: #f8f9fa;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #d3d4d5;
  --bs-btn-hover-border-color: #c6c7c8;
  --bs-btn-focus-shadow-rgb: 211, 212, 213;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #c6c7c8;
  --bs-btn-active-border-color: #babbbc;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #000;
  --bs-btn-disabled-bg: #f8f9fa;
  --bs-btn-disabled-border-color: #f8f9fa
}

[data-bs-theme=dark] .btn-plain {
  --bs-btn-color: #fff;
  --bs-btn-bg: #212529;
  --bs-btn-border-color: #212529;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #424649;
  --bs-btn-hover-border-color: #373b3e;
  --bs-btn-focus-shadow-rgb: 66, 70, 73;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #4d5154;
  --bs-btn-active-border-color: #373b3e;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #212529;
  --bs-btn-disabled-border-color: #212529
}

.col-1_2 {
  flex: 0 0 auto;
  width: 4.16666666%
}

.col-divider {
  box-shadow: inset 1px 0 0 0 var(--bs-border-color);
}

/* Inventory table
   ---------------------------------------------------------------------------
   La tabla de ticket groups es una grilla de 9 columnas dentro de un
   contenedor con scroll propio (#ticket_groups_frame). Estas reglas son para
   poder leerla, no para decorarla. */

/* El encabezado scrollea junto con las filas, así que a las 15 filas ya no se
   sabe qué columna es cuál. El fondo opaco no es estético: sin él las filas se
   ven por debajo al pasar. */
.inventory-head {
  position: sticky;
  top: 0;
  z-index: 2;
  background-color: var(--bs-body-bg);
  font-size: .8125rem;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
}

/* Nueve columnas son más de las que el ojo sigue solo: la banda de hover es lo
   que permite leer una fila de punta a punta sin perder el renglón. */
.inventory-row:hover {
  background-color: var(--bs-tertiary-bg);
}

/* El flash de actualización tiene que ganarle al hover: si el usuario tiene el
   mouse encima justo cuando la fila cambia, el aviso es lo que importa. */
.inventory-row.highlighted,
.inventory-row.highlighted:hover {
  background-color: rgba(255, 193, 7, 0.2);
}

/* Dígitos de ancho fijo para que el importe no baile entre filas. La columna va
   centrada como el resto: alinearla a la derecha se probó y quedaba despegada
   de las demás. */
.inventory-amount {
  font-variant-numeric: tabular-nums;
}
/* Accounting reports
   ---------------------------------------------------------------------------
   Los dígitos tabulares mantienen los montos alineados entre filas; la tabla
   del P&L fija la columna de línea y marca dónde empiezan las columnas de
   total, para que un estado de 16 columnas se pueda seguir leyendo al
   scrollear de costado. */
.num {
  font-variant-numeric: tabular-nums;
}

.pl-table > :not(caption) > * > *:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  background-color: var(--bs-body-bg);
  box-shadow: inset -1px 0 0 var(--bs-border-color);
}

.pl-table > thead > tr > th:first-child {
  z-index: 3;
}

.fy-col {
  font-weight: 600;
}

.fy-start {
  border-left: 2px solid var(--bs-border-color);
}

/* Deja el destino de un link #ancla por debajo del navbar y la barra de
   pestañas fijos (98px) con aire. */
.scroll-mt-navbar {
  scroll-margin-top: 130px;
}
