/* cajas/css/cajas.css
   Estilos de cajas/operaciones/caja_movimientos.php movidos desde sus <style> inline (CSS por módulo, 2026-10-31).
   Selectores prefijados con .mod-cajas (raíz #resultado_movimiento_caja). Sin excepciones. */

	.mod-cajas .importe-tachado {
		color: var(--bs-secondary-color);
		text-decoration: line-through;
		text-decoration-color: var(--app-control-border);
		text-decoration-thickness: 1.5px;
		opacity: 1;
	}

	.mod-cajas#resultado_movimiento_caja .caj-mov-breadcrumb .breadcrumb { margin: 0; padding: 0; background: none; font-size: .78rem; }
	.mod-cajas#resultado_movimiento_caja .caj-mov-breadcrumb .breadcrumb-item,
	.mod-cajas#resultado_movimiento_caja .caj-mov-breadcrumb .breadcrumb-item a { color: var(--bs-secondary-color); text-decoration: none; }
	.mod-cajas#resultado_movimiento_caja .caj-mov-breadcrumb .breadcrumb-item.active { color: var(--bs-body-color); font-weight: 500; }
	.mod-cajas#resultado_movimiento_caja .caj-mov-breadcrumb .breadcrumb-item + .breadcrumb-item::before { content: "›"; }

.mod-cajas .tarjeta:hover { box-shadow: var(--app-shadow-md) !important; transition: box-shadow .2s; }

/* ── Indicador de movimiento con caja cerrada ────────────────────────────
   Antes se pintaba toda la fila (fondo sólido + texto blanco), lo que
   rompía el contraste en dark mode. Ahora se marca con un acento lateral
   sutil + una badge "Cerrada Nº X" (bi-lock-fill), theme-aware. */
.mod-cajas #table_movimientos_caja > tbody > tr.fila-caja-cerrada > td:first-child {
	border-left: 3px solid var(--app-primary);
}
.mod-cajas #table_movimientos_caja > tbody > tr.fila-caja-cerrada {
	background-color: color-mix(in srgb, var(--app-primary) 6%, transparent);
}

/* ── Barra de totales fija (movimientos de caja) ─────────────────────── */
.mod-cajas#resultado_movimiento_caja.con-barra-totales { padding-bottom: 4.25rem; }

.mod-cajas .barra-totales-fija {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1030;
	background: color-mix(in srgb, var(--bs-body-bg) 88%, transparent);
	backdrop-filter: blur(10px) saturate(1.4);
	-webkit-backdrop-filter: blur(10px) saturate(1.4);
	border-top: 1px solid var(--bs-border-color-translucent, rgba(0,0,0,.08));
	box-shadow: 0 -6px 24px rgba(15, 23, 42, .10);
	padding: .55rem 1.25rem;
	transform: translateY(100%);
	opacity: 0;
	pointer-events: none;
	transition: transform .32s cubic-bezier(.4,0,.2,1), opacity .32s ease;
}
.mod-cajas .barra-totales-fija.is-visible {
	transform: translateY(0);
	opacity: 1;
	pointer-events: auto;
}
body.nav-left .mod-cajas .barra-totales-fija { left: var(--sidebar-width); }
.mod-cajas .barra-totales-fija__inner {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	max-width: 1600px;
	margin: 0 auto;
	overflow-x: auto;
	scrollbar-width: thin;
}
.mod-cajas .barra-totales-fija__item { flex: 0 0 auto; }
.mod-cajas .barra-totales-fija__label {
	display: block;
	font-family: var(--app-mono);
	font-size: .75rem;
	color: var(--bs-secondary-color);
	margin-bottom: 1px;
}
.mod-cajas .barra-totales-fija__valor {
	font-family: var(--app-mono);
	font-size: .9rem;
	font-weight: 600;
	white-space: nowrap;
}
.mod-cajas .barra-totales-fija__item--deuda .barra-totales-fija__valor { color: var(--bs-danger); }
.mod-cajas .barra-totales-fija__item--total {
	margin-left: auto;
	background: var(--app-primary);
	border-radius: var(--app-radius);
	padding: .35rem .9rem;
}
.mod-cajas .barra-totales-fija__item--total .barra-totales-fija__label { color: var(--app-on-primary); }
.mod-cajas .barra-totales-fija__item--total .barra-totales-fija__valor { color: var(--app-on-primary); font-size: 1rem; font-weight: 700; }

@media (max-width: 576px) {
	.mod-cajas .barra-totales-fija { padding: .5rem .75rem; }
	.mod-cajas .barra-totales-fija__inner { gap: 1.1rem; }
	.mod-cajas .barra-totales-fija__label { font-size: .75rem; }
	.mod-cajas .barra-totales-fija__valor { font-size: .8rem; }
	.mod-cajas#resultado_movimiento_caja.con-barra-totales { padding-bottom: 3.75rem; }
}