/* ======================================================================== */
/* pos-v2 — brutalist monochrome (modeled on yeezy.com)                      */
/* ======================================================================== */
/*
 * Design intent
 * ──────────────
 * Pure black on pure white.  No color.  No radii.  No shadows.  No gradients.
 * Helvetica.  All-caps section labels.  Thin 1px black borders as the only
 * structural element.  Typography does every piece of heavy lifting.
 *
 * The POS shouldn't try to look friendly — it should look decisive.  A
 * cashier scans two numbers and presses Enter; the UI gets out of the way.
 *
 * Every class name stays pos-v2-native.  Only the visual tokens change.
 */

/* =======================  TOKENS  ======================================== */

:root {
  --bg:          #ffffff;
  --bg-sunken:   #f0f0f0;
  --surface:     #ffffff;
  --surface-2:   #fafafa;

  --ink:         #000000;
  --ink-soft:    #000000;
  --ink-muted:   #666666;
  --ink-faint:   #999999;
  --ink-subtle:  #cccccc;

  --line:        #000000;
  --line-soft:   #cccccc;

  --accent:      #000000;
  --accent-ink:  #ffffff;

  --primary:       #000000;
  --primary-hover: #1a1a1a;
  --primary-ink:   #ffffff;

  --ok:      #000000;
  --ok-soft: #f0f0f0;
  --warn:    #000000;
  --warn-soft:  #f0f0f0;
  --danger:     #d00000;
  --danger-soft:#ffeeee;

  --ring:      0 0 0 2px #000000;
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;
  --shadow-card: none;

  --radius:    0;
  --radius-sm: 0;
  --radius-lg: 0;

  /* Inter — loaded from Google Fonts via index.html.
     Helvetica Neue / Arial stay as fallbacks for the initial paint before
     Inter finishes loading, and for kiosks that are completely offline. */
  --font: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* =======================  RESET + BASE  ================================== */

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
html {
  -webkit-text-size-adjust: 100%;
  background: #ffffff;
}
body {
  color: #000;
  font-family: var(--font);
  font-size: 13px;
  line-height: 1.35;
  background: #ffffff;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height: 100vh;
  min-height: 100dvh;
  font-weight: 400;
  letter-spacing: 0.01em;
}
button { font: inherit; color: inherit; cursor: pointer; }
input, select, textarea {
  font: inherit;
  color: #000;
  width: 100%;
  border: 1px solid #000;
  background: #fff;
  border-radius: 0;
  padding: 10px 12px;
  transition: none;
}
/* Checkboxes and radios must escape the textbox-style defaults above —
   otherwise they render as giant 100%-wide boxes with borders and padding. */
input[type="checkbox"], input[type="radio"] {
  width: 14px;
  height: 14px;
  min-width: 14px;
  padding: 0;
  margin: 0;
  border: 1px solid #000;
  accent-color: #000;
  cursor: pointer;
  flex-shrink: 0;
}
input:focus-visible, select:focus-visible, textarea:focus-visible,
button:focus-visible {
  outline: 2px solid #000;
  outline-offset: -1px;
  box-shadow: none;
}
h1, h2, h3, h4 {
  margin: 0;
  font-weight: 700;
  letter-spacing: 0;
  color: #000;
}

#root {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background: #fff;
}

::selection { background: #000; color: #fff; }

/* =======================  APP SHELL  ===================================== */

.v2-shell {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
  /* Disable Chrome Android pull-to-refresh — the ↻ button in the topbar is
     the canonical hard-refresh and an accidental swipe-down would otherwise
     wipe an in-progress capture. */
  overscroll-behavior-y: contain;
}

/* "Nueva versión disponible" banner (updateCheck.js). Amber + black so it
   stands out against the monochrome chrome; renders below the sticky topbar. */
.v2-update-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 10px 16px;
  background: #ffe08a;
  color: #1a1300;
  border-bottom: 2px solid #000;
  font-weight: 700;
  font-size: 14px;
  text-align: center;
}
.v2-update-banner__text { line-height: 1.3; }
.v2-update-banner__btn {
  appearance: none;
  cursor: pointer;
  border: 2px solid #000;
  background: #000;
  color: #fff;
  font-weight: 800;
  padding: 7px 16px;
  border-radius: 8px;
  white-space: nowrap;
}
.v2-update-banner__btn:hover { background: #fff; color: #000; }

/* Manager announcement — red broadcast banner (dismissible). Bold RED text. */
.v2-announce-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  background: #fff5f5;
  border-bottom: 2px solid #d00000;
}
.v2-announce-banner__body { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.v2-announce-banner__icon { font-size: 16px; }
.v2-announce-banner__text { color: #d00000; font-weight: 800; font-size: 15px; line-height: 1.35; }
.v2-announce-banner__by { color: #a33; font-size: 12px; font-weight: 600; }
.v2-announce-banner__close {
  appearance: none; cursor: pointer; flex-shrink: 0;
  border: 2px solid #d00000; background: #fff; color: #d00000;
  font-weight: 800; width: 28px; height: 28px; border-radius: 8px; line-height: 1;
}
.v2-announce-banner__close:hover { background: #d00000; color: #fff; }

.v2-topbar {
  position: sticky;
  top: 0;
  z-index: 15;
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0;
  /* Clear iPhone Dynamic Island / status bar in standalone mode. No-op on
     desktop and on browsers without notches. */
  padding-top: env(safe-area-inset-top, 0px);
  background: #fff;
  border-bottom: 1px solid #000;
}

.v2-topbar__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-right: 1px solid #000;
}
.v2-topbar__brand-name {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #000;
}
.v2-topbar__brand-badge {
  display: inline-block;
  padding: 2px 6px;
  background: #000;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.v2-topbar__version {
  color: #666;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 14px 16px;
  border-right: 1px solid #000;
}

.v2-topbar__nav {
  display: flex;
  margin-left: 0;
  flex: 1;
}
.v2-topbar__nav button {
  background: transparent;
  border: 0;
  border-right: 1px solid #000;
  border-radius: 0;
  padding: 14px 20px;
  color: #000;
  font-weight: 500;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  transition: background 80ms;
  flex: 1;
  text-align: center;
}
/* Hover states for nav + chrome buttons are gated behind (hover: hover) so
   they don't stick after a tap on touch devices. */
@media (hover: hover) {
  .v2-topbar__nav button:hover { background: #f0f0f0; }
}
.v2-topbar__nav button[aria-current="page"] {
  background: #000;
  color: #fff;
}

.v2-topbar__weather {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  /* No border-left: the last nav button already draws a border-right here,
     and two adjacent 1px rules render as one doubled/bolder line. */
  margin-left: auto;
  white-space: nowrap;
  line-height: 1;
}
.v2-topbar__weather + .v2-topbar__cashier { margin-left: 0; }
.v2-topbar__weather-icon { font-size: 18px; }
.v2-topbar__weather-temp {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.v2-topbar__cashier {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 2px;
  padding: 8px 16px;
  border-left: 1px solid #000;
  margin-left: auto;
}
.v2-topbar__cashier-label {
  font-size: 9px;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 500;
}
.v2-topbar__cashier-name {
  font-weight: 700;
  font-size: 11px;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.v2-topbar__signout,
.v2-topbar__refresh {
  background: #fff;
  border: 0;
  border-left: 1px solid #000;
  border-radius: 0;
  padding: 14px 20px;
  font-size: 11px;
  font-weight: 500;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  cursor: pointer;
}
@media (hover: hover) {
  .v2-topbar__signout:hover,
  .v2-topbar__refresh:hover { background: #000; color: #fff; }
}
.v2-topbar__refresh {
  font-size: 16px;
  letter-spacing: 0;
  padding: 14px 16px;
}

/* ── Topbar mobile (≤ 720px): nav drops to its own row and scrolls
   horizontally; chrome (brand/version/cashier/refresh/salir) stays on row 1.
   Tested at 360px (Android Pixel 6a) and 402px (iPhone Air, Chrome iOS).
   --------------------------------------------------------------------- */
@media (max-width: 720px) {
  .v2-topbar { flex-wrap: wrap; }

  .v2-topbar__brand { padding: 12px 14px; gap: 8px; }
  .v2-topbar__brand-name { font-size: 13px; }

  /* Version stays visible on mobile — bumped to its own slim row beneath
     the brand/chrome so the user can verify cache-busting after a deploy
     ("am I actually on the version I just pushed?"). order: 50 puts it
     between row-1 items (order 0) and the nav scroll strip (order 99). */
  .v2-topbar__version {
    order: 50;
    flex: 1 1 100%;
    border-right: 0;
    border-top: 1px solid #cccccc;
    padding: 5px 14px;
    text-align: center;
    font-size: 10px;
    background: #fafafa;
    color: #666;
  }

  .v2-topbar__cashier {
    padding: 6px 10px;
    margin-left: auto;
    /* Truncate long emails / names so the row doesn't overflow. */
    max-width: 38vw;
    overflow: hidden;
  }
  .v2-topbar__cashier-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .v2-topbar__refresh,
  .v2-topbar__signout {
    /* ≥ 44pt tap target for iOS HIG / Android Material. */
    padding: 14px 16px;
    min-height: 44px;
  }

  /* Push the nav onto its own row, full bleed, scroll-snap so partial taps
     on a half-visible button don't cause weird snap behavior. */
  .v2-topbar__nav {
    order: 99;
    flex: 1 1 100%;
    overflow-x: auto;
    overflow-y: hidden;
    border-top: 1px solid #000;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    /* Hide the scrollbar track on iOS; Android Chrome auto-hides anyway. */
    scrollbar-width: none;
  }
  .v2-topbar__nav::-webkit-scrollbar { display: none; }
  .v2-topbar__nav button {
    flex: 0 0 auto;          /* don't stretch — natural width per label */
    padding: 14px 18px;
    min-height: 44px;
    scroll-snap-align: start;
  }
}

/* Even tighter — ≤ 480px hides the cashier label, leaves only the name.
   On a 360pt-wide Android phone the brand+name+chrome buttons need every px. */
@media (max-width: 480px) {
  .v2-topbar__brand { padding: 10px 12px; gap: 6px; }
  .v2-topbar__cashier-label { display: none; }
  .v2-topbar__cashier { padding: 6px 8px; max-width: 32vw; }
  .v2-topbar__refresh,
  .v2-topbar__signout { padding: 12px 12px; }
  .v2-topbar__signout { font-size: 10px; letter-spacing: 0.08em; }
}

/* Mobile input hygiene rule moved to the END of this file so it wins the
   cascade against the per-component font-size rules defined later (login,
   capture line, capture field, movements filter). See the block tagged
   "MOBILE INPUT HYGIENE" near the bottom of this stylesheet. */

.v2-main {
  flex: 1;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: none;
  width: 100%;
  margin: 0;
}
.v2-main > * + * { border-top: 1px solid #000; }

/* =======================  LOGIN  ========================================= */

.v2-login {
  max-width: 420px;
  margin: 120px auto;
  background: #fff;
  border: 1px solid #000;
  border-radius: 0;
  padding: 40px;
}
/* Mobile: the 120px top margin on a 360pt-wide / ~750pt-tall phone with
   the soft keyboard open (eats half the visible viewport) buries the
   form below the fold. Trim the margins and pad on a smaller phone so
   the form is reachable without scrolling. */
@media (max-width: 640px) {
  .v2-login {
    margin: 24px 12px 40px;
    padding: 28px 22px;
    max-width: none;
  }
}
.v2-login h1 {
  margin: 0 0 6px;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.v2-login p { margin: 0 0 28px; color: #666; font-size: 12px; letter-spacing: 0.02em; }
.v2-login label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin: 16px 0 6px;
}
.v2-login input { padding: 11px 12px; font-size: 13px; border: 1px solid #000; }
.v2-login button[type="submit"] {
  margin-top: 24px;
  width: 100%;
  padding: 14px;
  border: 1px solid #000;
  border-radius: 0;
  background: #000;
  color: #fff;
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  transition: background 80ms, color 80ms;
}
.v2-login button[type="submit"]:hover { background: #fff; color: #000; }
.v2-login button[type="submit"]:disabled { opacity: 0.4; cursor: wait; }
.v2-login__error {
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid #d00000;
  background: #fff;
  color: #d00000;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.v2-login__version {
  display: block;
  margin-top: 18px;
  text-align: center;
  font-size: 10px;
  color: #999;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}

/* =======================  WARNINGS / BOOT  =============================== */

.v2-warning {
  background: #fff;
  border: 1px solid #000;
  color: #000;
  padding: 14px 20px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.v2-warning__icon { font-size: 14px; line-height: 1.3; color: #000; font-weight: 700; }
.v2-warning__title {
  font-weight: 700;
  font-size: 11px;
  margin-bottom: 2px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.v2-warning__body { font-size: 12px; line-height: 1.5; letter-spacing: 0.01em; }

.v2-boot-error {
  max-width: 640px;
  margin: 60px auto;
  padding: 24px;
  border: 1px solid #d00000;
  background: #fff;
  color: #d00000;
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.v2-loading {
  text-align: center;
  padding: 64px;
  color: #666;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 500;
}

/* =======================  SHARED BUTTONS  ================================ */

.sale-btn {
  appearance: none;
  border: 1px solid #000;
  padding: 10px 16px;
  border-radius: 0;
  font-weight: 700;
  font-size: 11px;
  background: #fff;
  color: #000;
  transition: background 80ms, color 80ms;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.sale-btn:focus-visible { outline: 2px solid #000; outline-offset: 1px; }
.sale-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.sale-btn:hover:not(:disabled) { background: #000; color: #fff; }

.sale-btn--primary {
  background: #000;
  color: #fff;
  border-color: #000;
}
.sale-btn--primary:hover:not(:disabled) { background: #fff; color: #000; }

.sale-btn--accent {
  background: #000;
  color: #fff;
  border-color: #000;
}
.sale-btn--accent:hover:not(:disabled) { background: #fff; color: #000; }

.sale-btn--ghost { background: #fff; color: #000; }

.sale-btn--danger {
  background: #fff;
  color: #d00000;
  border-color: #d00000;
}
.sale-btn--danger:hover:not(:disabled) { background: #d00000; color: #fff; }

.sale-btn--sm { padding: 6px 10px; font-size: 10px; letter-spacing: 0.08em; }
.sale-btn--lg {
  padding: 16px 24px;
  font-size: 13px;
  width: 100%;
  font-weight: 700;
  letter-spacing: 0.18em;
}

/* =======================  SALE SCREEN  =================================== */

.sale { display: flex; flex-direction: column; gap: 0; padding-bottom: 120px; }
.sale > * + * { border-top: 1px solid #000; }

.sale-banner {
  display: flex;
  gap: 0;
  align-items: stretch;
  flex-wrap: wrap;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: #fff;
}
.sale-banner--warn {
  background: #fff;
  display: block;
  padding: 14px 20px;
}
.sale-banner__col {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 14px 20px;
  border-right: 1px solid #000;
}
.sale-banner__col:last-child { border-right: 0; }
.sale-banner__col--grow { flex: 1; }
.sale-banner__label {
  font-size: 9px;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 500;
}
.sale-banner__value {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-size: 13px;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sale-banner__title { font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; }
.sale-banner__body { font-size: 12px; margin-top: 4px; line-height: 1.5; }

.sale-notice {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 20px;
  border: 0;
  background: #fff;
  font-weight: 500;
  font-size: 12px;
  border-bottom: 1px solid #000;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sale-notice--ok    { background: #fff; color: #000; }
.sale-notice--warn  { background: #fff; color: #000; }
.sale-notice--error { background: #fff; color: #d00000; }
.sale-notice--error::before { content: "◆"; margin-right: 8px; }
.sale-notice__close {
  background: transparent;
  border: 0;
  color: inherit;
  opacity: 0.6;
  font-size: 14px;
  line-height: 1;
  padding: 0 4px;
  font-weight: 700;
}
.sale-notice__close:hover { opacity: 1; }

.sale-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 0;
  align-items: stretch;
}
@media (max-width: 1100px) { .sale-grid { grid-template-columns: 1fr; } }

.sale-panel {
  background: #fff;
  border: 0;
  border-right: 1px solid #000;
  border-radius: 0;
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.sale-panel--right {
  border-right: 0;
  border-left: 1px solid #000;
}
@media (max-width: 1100px) {
  .sale-panel { border-right: 0; }
  .sale-panel--right { border-left: 0; border-top: 1px solid #000; }
}

/* Floating SKU code entry — anchored bottom-right, always reachable.
   Modeled on v1's versa-sku-pad-mirror-shell but restyled for the
   brutalist monochrome language. */
.sale-code-float {
  position: fixed;
  right: 20px;
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  z-index: 30;
  width: 240px;
  background: #fff;
  border: 1px solid #000;
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: -2px -2px 0 #000, 4px 4px 0 rgba(0, 0, 0, 0.06);
}
.sale-code-float__label {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #000;
}
.sale-code-float__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px;
  gap: 0;
  align-items: stretch;
}
.sale-code-input {
  height: 46px;
  border-radius: 0;
  background: #fff;
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  font-variant-numeric: tabular-nums;
  padding: 4px 10px;
  border: 1px solid #000;
  border-right: 0;
  letter-spacing: 0.1em;
  min-width: 0;
}
.sale-code-input::placeholder {
  color: #ccc;
  font-weight: 500;
  letter-spacing: 0.2em;
}
.sale-code-input:focus {
  outline: 2px solid #000;
  outline-offset: -2px;
}
.sale-code-float__submit {
  height: 46px;
  border: 1px solid #000;
  background: #000;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  padding: 0;
  border-radius: 0;
  transition: background 80ms, color 80ms;
}
.sale-code-float__submit:hover { background: #fff; color: #000; }
.sale-code-float__submit:focus-visible {
  outline: 2px solid #000;
  outline-offset: -2px;
}

/* On narrow screens drop the float to a full-width strip at the bottom so
   it doesn't cover anything important. */
@media (max-width: 720px) {
  .sale-code-float {
    right: 0;
    bottom: 0;
    width: 100%;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    box-shadow: none;
    padding: 8px 12px 12px;
  }
}

/* Lines table */
.sale-lines { display: flex; flex-direction: column; gap: 10px; }
.sale-lines__header {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: space-between;
}
.sale-lines__title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
}
.sale-lines__badge {
  font-size: 10px;
  font-weight: 500;
  padding: 2px 8px;
  border: 1px solid #000;
  background: #fff;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.sale-lines__table {
  overflow: hidden;
  border: 1px solid #000;
  border-radius: 0;
  background: #fff;
}
.sale-lines__row {
  display: grid;
  grid-template-columns: minmax(220px, 2fr) minmax(160px, 1.4fr) 120px 140px 36px;
  gap: 14px;
  padding: 14px 16px;
  align-items: center;
  border-top: 1px solid #000;
}
.sale-lines__row:first-child { border-top: 0; }
.sale-lines__row--head {
  background: #000;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 10px 16px;
}
.sale-lines__row--head > div { color: #fff; }
.sale-lines__row--placeholder { color: #999; }
.sale-lines__row:hover:not(.sale-lines__row--head):not(.sale-lines__row--placeholder) {
  background: #fafafa;
}
.col-total {
  text-align: right;
  font-weight: 700;
  font-size: 18px;
  font-variant-numeric: tabular-nums;
  color: #000;
  letter-spacing: -0.01em;
}
.col-actions { display: flex; justify-content: flex-end; }

.sku-code {
  display: inline-block;
  margin-bottom: 4px;
  padding: 1px 6px;
  border: 1px solid #000;
  color: #000;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.sku-name {
  font-size: 14px;
  font-weight: 700;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.sku-product { font-size: 11px; color: #666; margin-top: 1px; letter-spacing: 0.02em; }

.qty-pair { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.qty-input {
  width: 76px;
  padding: 8px 10px;
  border: 1px solid #000;
  border-radius: 0;
  background: #fff;
  font-variant-numeric: tabular-nums;
  text-align: right;
  font-weight: 500;
  font-size: 13px;
}
.qty-input:focus { outline: 2px solid #000; outline-offset: -1px; }
.qty-input--price { width: 100%; font-weight: 700; font-size: 15px; }
.qty-sub {
  font-size: 10px;
  color: #666;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.sale-line-remove {
  background: #fff;
  border: 1px solid #000;
  color: #000;
  font-size: 14px;
  line-height: 1;
  width: 32px;
  height: 32px;
  border-radius: 0;
  padding: 0;
  font-weight: 700;
}
.sale-line-remove:hover { background: #000; color: #fff; }

.sale-line-discount {
  background: #fff;
  border: 1px solid #000;
  color: #000;
  font-size: 12px;
  line-height: 1;
  width: 32px;
  height: 32px;
  border-radius: 0;
  padding: 0;
  font-weight: 700;
  margin-right: 4px;
}
.sale-line-discount:hover { background: #000; color: #fff; }
.sale-line-discount--active { background: #000; color: #fff; }
.sale-line-discount--active:hover { background: #fff; color: #000; }
.col-actions { display: flex; align-items: center; justify-content: flex-end; }

/* Totals panel */
.sale-totals {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-bottom: 18px;
  border-bottom: 1px solid #000;
}
.sale-totals__row {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 500;
}
.sale-totals__value {
  font-variant-numeric: tabular-nums;
  color: #000;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.sale-totals__divider { display: none; }
.sale-totals__grand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 12px 0 0;
}
.sale-totals__grand-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: #000;
  font-weight: 700;
  margin-bottom: 4px;
}
.sale-totals__grand-value {
  font-size: 56px;
  line-height: 0.92;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #000;
  letter-spacing: -0.04em;
  align-self: flex-end;
}

/* Payment picker */
.sale-payment-picker { display: flex; flex-direction: column; gap: 8px; }
.sale-payment-picker__label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
  font-weight: 700;
}
.sale-payment-picker__buttons {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid #000;
}
.sale-payment-btn {
  padding: 12px 8px;
  border: 0;
  border-right: 1px solid #000;
  border-radius: 0;
  background: #fff;
  color: #000;
  font-weight: 500;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  transition: background 80ms, color 80ms;
}
.sale-payment-btn:last-child { border-right: 0; }
.sale-payment-btn:hover { background: #f0f0f0; }
.sale-payment-btn.is-active {
  background: #000;
  color: #fff;
}

/* Customer field */
.sale-customer { display: flex; flex-direction: column; gap: 6px; }
.sale-customer__label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
  font-weight: 700;
}
.sale-customer__picker { position: relative; }
.sale-customer__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 10px 12px;
  font-size: 13px;
  border: 1px solid #000;
  background: #fff;
  color: #000;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
  border-radius: 0;
}
.sale-customer__trigger:hover { background: #000; color: #fff; }
.sale-customer__trigger.is-placeholder { font-weight: 500; color: #666; }
.sale-customer__trigger.is-placeholder:hover { color: #fff; }
.sale-customer__trigger-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sale-customer__trigger-chevron { font-size: 10px; flex-shrink: 0; }
.sale-customer__backdrop {
  position: fixed;
  inset: 0;
  z-index: 39;
  background: transparent;
}
.sale-customer__dropdown {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 40;
  background: #fff;
  border: 1px solid #000;
  border-top: 0;
  display: flex;
  flex-direction: column;
  max-height: 380px;
}
.sale-customer__search {
  padding: 10px 12px;
  font-size: 13px;
  border: 0;
  border-bottom: 1px solid #000;
  background: #fff;
  outline: none;
  width: 100%;
}
.sale-customer__options {
  overflow-y: auto;
  max-height: 320px;
  display: flex;
  flex-direction: column;
}
.sale-customer__option {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid #000;
  background: #fff;
  color: #000;
  cursor: pointer;
  border-radius: 0;
}
.sale-customer__option:last-child { border-bottom: 0; }
.sale-customer__option:hover { background: #000; color: #fff; }
.sale-customer__option.is-selected { background: #fff5d9; }
.sale-customer__option.is-selected:hover { background: #000; color: #fff; }
.sale-customer__option--create { background: #fff5d9; }
.sale-customer__option--create .sale-customer__option-name { color: #8a5a00; font-weight: 700; }
.sale-customer__option--create:hover { background: #000; color: #fff; }
.sale-customer__option--create:hover .sale-customer__option-name { color: #fff; }
.sale-customer__option--create:hover .sale-customer__option-meta { color: #bbb; }
.sale-customer__option-name {
  display: block;
  font-weight: 700;
  font-size: 13px;
}
.sale-customer__option-meta {
  display: block;
  color: #666;
  font-size: 11px;
  margin-top: 2px;
}
.sale-customer__option:hover .sale-customer__option-meta { color: #bbb; }
.sale-customer__empty {
  padding: 16px 12px;
  color: #666;
  font-size: 12px;
  text-align: center;
}

.fiscal-form__profile-row { display: flex; align-items: flex-end; gap: 6px; flex-wrap: wrap; }
.fiscal-form__profile-row > .modal__field { flex: 1; min-width: 260px; }
.fiscal-form__new-profile,
.fiscal-form__edit-profile,
.fiscal-form__delete-profile { white-space: nowrap; padding: 10px 12px; }
.fiscal-form__delete-profile:hover { background: #8a1f1f; color: #fff; border-color: #8a1f1f; }
.fiscal-form__delete-confirm { display: flex; gap: 4px; align-items: center; }
.fiscal-form__delete-confirm-btn { background: #8a1f1f; color: #fff; border-color: #8a1f1f; }
.fiscal-form__delete-confirm-btn:hover:not(:disabled) { background: #fff; color: #8a1f1f; }
.modal--new-profile { width: min(720px, 100%); }
.modal--cancel-cfdi { width: min(680px, 100%); }
.modal__field--full { grid-column: 1 / -1; }
.fiscal-doc__cancel-btn:hover { background: #8a1f1f; color: #fff; border-color: #8a1f1f; }

.sale-actions { display: flex; gap: 0; margin-top: auto; }
.sale-actions .sale-btn { flex: 1; }

/* =======================  CHECKOUT MODAL  ================================ */

.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 48px 16px;
  z-index: 50;
}

/* Default footer-row layout for modal action buttons. Used by the cancel-
   movement dialog and re-usable for any future confirmation modal. */
.modal__actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 8px;
}

/* Mobile: turn modals into bottom sheets. The dimmed backdrop fills the
   space above; the sheet pins to the bottom edge with the safe-area
   inset honored so its inner content clears the iPhone home indicator.
   Action buttons stack vertically — Volver (escape) on top, the
   destructive Confirmar at the bottom for thumb reach but in a position
   that requires a deliberate tap. */
@media (max-width: 640px) {
  .modal-overlay {
    align-items: flex-end;
    padding: 0;
  }
  .modal {
    width: 100%;
    max-width: none;
    max-height: 90dvh;
    border: 0;
    border-top: 1px solid #000;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .modal__header { padding: 14px 18px; }
  .modal__body   { padding: 16px 18px 20px; }

  .modal__actions {
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
  }
  .modal__actions > .sale-btn {
    width: 100%;
    padding: 14px 16px;
    font-size: 13px;
  }
}
/* The 80ms fade-in was re-firing on every render pass (the whole .modal-overlay
   element is re-created by replaceChildren on each state change), so every
   keystroke inside an open modal flashed the overlay from opacity:0→1. Killed
   the animation; the modal simply appears. */
.modal {
  background: #fff;
  border-radius: 0;
  box-shadow: none;
  width: min(680px, 100%);
  max-height: calc(100vh - 96px);
  overflow: auto;
  display: flex;
  flex-direction: column;
  border: 1px solid #000;
}

.modal__header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 24px;
  border-bottom: 1px solid #000;
}
.modal__title {
  font-size: 14px;
  margin: 0;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.modal__total { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; }
.modal__total-label {
  font-size: 9px;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 500;
}
.modal__total-value {
  font-size: 28px;
  font-weight: 700;
  color: #000;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}
.modal__close {
  background: #fff;
  border: 1px solid #000;
  font-size: 16px;
  line-height: 1;
  color: #000;
  padding: 4px 10px;
  border-radius: 0;
  font-weight: 700;
}
.modal__close:hover { background: #000; color: #fff; }

.modal__body { padding: 20px 24px; display: flex; flex-direction: column; gap: 16px; }

.modal__tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid #000;
}
.modal__tab {
  padding: 10px;
  background: #fff;
  border: 0;
  border-right: 1px solid #000;
  border-radius: 0;
  font-weight: 500;
  color: #000;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.modal__tab:last-child { border-right: 0; }
.modal__tab.is-active { background: #000; color: #fff; }

.modal__section { display: flex; flex-direction: column; gap: 14px; }
.modal__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.modal__field { display: flex; flex-direction: column; gap: 4px; }
.modal__label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
  font-weight: 700;
}
.modal__input {
  padding: 10px 12px;
  font-size: 13px;
  border: 1px solid #000;
  border-radius: 0;
  background: #fff;
  font-variant-numeric: tabular-nums;
}
.modal__input--lg {
  font-size: 24px;
  font-weight: 700;
  padding: 16px 18px;
  text-align: right;
  letter-spacing: -0.02em;
}

.modal__tender-picker {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid #000;
}
.modal__tender-btn {
  padding: 10px;
  border: 0;
  border-right: 1px solid #000;
  border-radius: 0;
  background: #fff;
  color: #000;
  font-weight: 500;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.modal__tender-btn:last-child { border-right: 0; }
.modal__tender-btn.is-active { background: #000; color: #fff; }

.modal__shortcuts {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 6px;
  border: 1px solid #000;
}
.modal__shortcut {
  padding: 10px 8px;
  border: 0;
  border-right: 1px solid #000;
  border-radius: 0;
  background: #fff;
  text-align: center;
  transition: background 80ms, color 80ms;
}
.modal__shortcut:last-child { border-right: 0; }
.modal__shortcut:hover { background: #000; color: #fff; }
.modal__shortcut:hover .modal__shortcut-label,
.modal__shortcut:hover .modal__shortcut-value { color: #fff; }
.modal__shortcut-label {
  font-size: 9px;
  color: #666;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.modal__shortcut-value {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-size: 13px;
  margin-top: 2px;
  color: #000;
  letter-spacing: -0.01em;
}

.modal__summary {
  border: 1px solid #000;
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: #fff;
}
.modal__summary-row {
  display: flex;
  justify-content: space-between;
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 500;
}
.modal__summary-row.is-warn { color: #d00000; font-weight: 700; }
.modal__summary-value { font-weight: 700; color: #000; letter-spacing: 0; }

.modal__help {
  font-size: 11px;
  color: #000;
  background: #f0f0f0;
  padding: 12px 14px;
  border-radius: 0;
  margin: 0;
  line-height: 1.5;
  border-left: 2px solid #000;
}

.modal__error {
  border: 1px solid #d00000;
  background: #fff;
  color: #d00000;
  padding: 10px 12px;
  font-weight: 500;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.modal__footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 14px 24px;
  border-top: 1px solid #000;
  background: #fff;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

/* =======================  CAPTURE MODAL  ================================= */

.modal--capture { width: min(640px, 100%); }
.capture__header { gap: 16px; align-items: flex-start; padding: 18px 24px; }
.capture__eyebrow {
  font-size: 9px;
  color: #666;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.capture__product { font-size: 11px; color: #666; margin-top: 2px; letter-spacing: 0.04em; text-transform: uppercase; }
.capture__pill {
  margin-left: auto;
  align-self: center;
  padding: 8px 14px;
  border: 1px solid #000;
  background: #000;
  color: #fff;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.1em;
  font-variant-numeric: tabular-nums;
  text-transform: uppercase;
}

.capture__body { padding: 20px 24px; gap: 14px; }

.capture__grid { display: grid; gap: 10px; }
.capture__grid--kg {
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "weight price" "amount amount";
}
.capture__grid--box {
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-areas: "boxes weight price" "amount amount amount";
}
.capture__grid--box > label:nth-of-type(1) { grid-area: boxes; }
.capture__grid--box > label:nth-of-type(2) { grid-area: weight; }
.capture__grid--box > label:nth-of-type(3) { grid-area: price; }
.capture__grid--kg > label:nth-of-type(1)  { grid-area: weight; }
.capture__grid--kg > label:nth-of-type(2)  { grid-area: price; }

.capture__field { display: flex; flex-direction: column; gap: 4px; }
.capture__label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
}
.capture__input {
  padding: 14px 16px;
  font-size: 24px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: right;
  border: 1px solid #000;
  border-radius: 0;
  background: #fff;
  letter-spacing: -0.02em;
}
.capture__input:focus { outline: 2px solid #000; outline-offset: -1px; }
.capture__helper {
  font-size: 10px;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.capture__amount {
  grid-area: amount;
  background: #000;
  border: 1px solid #000;
  border-radius: 0;
  padding: 14px 18px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  color: #fff;
}
.capture__amount-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: #fff;
  font-weight: 700;
}
.capture__amount-value {
  font-size: 32px;
  font-weight: 700;
  color: #fff;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}
.capture__hint {
  font-size: 10px;
  color: #666;
  text-align: center;
  padding: 4px 0 0;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

/* =======================  APERTURA  ====================================== */

.apertura { display: flex; justify-content: center; padding: 32px; background: #fff; }
.apertura__card {
  background: #fff;
  border: 1px solid #000;
  border-radius: 0;
  padding: 32px;
  width: min(620px, 100%);
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.apertura__title { font-size: 20px; text-transform: uppercase; letter-spacing: 0.04em; }
.apertura__subtitle { margin: 2px 0 0; color: #666; font-size: 12px; line-height: 1.55; }
.apertura__form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.apertura__field { display: flex; flex-direction: column; gap: 4px; }
.apertura__field--wide { grid-column: 1 / -1; }
.apertura__label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
  font-weight: 700;
}
.apertura__input, .apertura__textarea {
  padding: 10px 12px;
  font-size: 13px;
  border: 1px solid #000;
  border-radius: 0;
  background: #fff;
  font-variant-numeric: tabular-nums;
}
.apertura__input[disabled] { color: #666; background: #f0f0f0; }
.apertura__textarea { resize: vertical; font-family: inherit; min-height: 60px; }
.apertura__actions { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.apertura__error {
  border: 1px solid #d00000;
  background: #fff;
  color: #d00000;
  padding: 10px 12px;
  font-weight: 500;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* =======================  CAJA TAB  ====================================== */

.cash { display: flex; flex-direction: column; gap: 0; }
.cash > * + * { border-top: 1px solid #000; }

.cash-header {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  align-items: stretch;
  background: #fff;
  border: 0;
  border-radius: 0;
  padding: 0;
}
.cash-header__left {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 18px 24px;
  border-right: 1px solid #000;
}
.cash-header__label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #666;
  font-weight: 500;
}
.cash-header__folio {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #000;
  font-variant-numeric: tabular-nums;
}
.cash-header__meta { color: #666; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; }
.cash-header__metrics {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  align-items: stretch;
  flex: 1;
}
.cash-header__actions {
  display: flex;
  gap: 0;
  align-items: stretch;
  border-left: 1px solid #000;
}
.cash-header__actions .sale-btn {
  border: 0;
  border-left: 1px solid #000;
  padding: 14px 20px;
  height: auto;
}
.cash-header__actions .sale-btn:first-child { border-left: 0; }

.cash-metric {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 18px 20px;
  border-right: 1px solid #000;
  min-width: 140px;
}
.cash-metric:last-child { border-right: 0; }
.cash-metric__label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #666;
  font-weight: 500;
}
.cash-metric__value {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-size: 18px;
  color: #000;
  letter-spacing: -0.01em;
}
.cash-metric.is-accent { background: #000; color: #fff; }
.cash-metric.is-accent .cash-metric__label { color: #fff; }
.cash-metric.is-accent .cash-metric__value { color: #fff; font-size: 22px; }

.cash-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
}
@media (max-width: 1100px) { .cash-grid { grid-template-columns: 1fr; } }
.cash-col {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-right: 1px solid #000;
}
.cash-col > * + * { border-top: 1px solid #000; }
.cash-col:last-child { border-right: 0; }
@media (max-width: 1100px) {
  .cash-col { border-right: 0; border-bottom: 1px solid #000; }
  .cash-col:last-child { border-bottom: 0; }
}

.cash-panel {
  background: #fff;
  border: 0;
  border-radius: 0;
  overflow: visible;
}
.cash-panel__header {
  padding: 12px 20px;
  border-bottom: 1px solid #000;
  background: #fff;
}
.cash-panel__header h3 {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #000;
  font-weight: 700;
}
.cash-panel__body { padding: 20px; display: flex; flex-direction: column; gap: 16px; }

/* Arqueo */
.cash-arqueo { display: flex; flex-direction: column; gap: 6px; }
.cash-arqueo__row {
  display: flex;
  justify-content: space-between;
  font-variant-numeric: tabular-nums;
  color: #000;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 500;
}
.cash-arqueo__value { font-weight: 700; color: #000; letter-spacing: 0; }
.cash-arqueo__divider { height: 1px; background: #000; margin: 6px 0; }
.cash-arqueo__grand { display: flex; justify-content: space-between; align-items: baseline; padding-top: 6px; border-top: 1px solid #000; margin-top: 6px; }
.cash-arqueo__grand > span:first-child {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #000;
  font-weight: 700;
}
.cash-arqueo__grand-value {
  font-size: 32px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #000;
  letter-spacing: -0.03em;
}
.cash-arqueo__note {
  margin-top: 8px;
  font-size: 11px;
  color: #666;
  padding: 10px 12px;
  border-left: 2px solid #000;
  background: #f0f0f0;
  line-height: 1.55;
}

/* Departments */
.cash-dept { display: flex; flex-direction: column; gap: 0; border: 1px solid #000; }
.cash-dept__row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 12px;
  align-items: baseline;
  padding: 10px 14px;
  border-bottom: 1px solid #000;
}
.cash-dept__row:last-child { border-bottom: 0; }
.cash-dept__label { font-weight: 700; color: #000; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; }
.cash-dept__meta { color: #666; font-size: 11px; font-variant-numeric: tabular-nums; text-transform: uppercase; letter-spacing: 0.04em; }
.cash-dept__value { font-variant-numeric: tabular-nums; font-weight: 700; font-size: 13px; color: #000; }

/* Forms */
.cash-form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cash-form__field { display: flex; flex-direction: column; gap: 4px; }
.cash-form__field--wide { grid-column: 1 / -1; }
.cash-form__label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
  font-weight: 700;
}
.cash-form__input {
  padding: 9px 11px;
  border: 1px solid #000;
  border-radius: 0;
  background: #fff;
  font-variant-numeric: tabular-nums;
  font-size: 13px;
}
.cash-form__actions { display: flex; justify-content: flex-end; gap: 6px; }
.cash-form__actions--wide { grid-column: 1 / -1; }

/* Lists */
.cash-list { display: flex; flex-direction: column; background: #fff; border-radius: 0; overflow: hidden; border: 1px solid #000; }
.cash-list__header {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  font-weight: 700;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  padding: 10px 14px;
  background: #000;
  color: #fff;
}
.cash-list__total { font-variant-numeric: tabular-nums; color: #fff; }
.cash-list__row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-top: 1px solid #000;
}
.cash-list__primary { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cash-list__label { font-weight: 700; color: #000; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; }
.cash-list__meta { font-size: 11px; color: #666; }
.cash-list__amount { font-variant-numeric: tabular-nums; font-weight: 700; font-size: 14px; letter-spacing: -0.01em; }
.cash-list__amount.is-positive { color: #000; }
.cash-list__amount.is-negative { color: #d00000; }
.cash-list__remove {
  background: #fff;
  border: 1px solid #000;
  color: #000;
  font-size: 14px;
  line-height: 1;
  padding: 4px 8px;
  border-radius: 0;
  font-weight: 700;
}
.cash-list__remove:hover { background: #d00000; color: #fff; border-color: #d00000; }

.cash-empty {
  margin: 0;
  padding: 20px;
  border: 1px solid #000;
  color: #666;
  text-align: center;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

/* Recent sessions */
.cash-history { display: flex; flex-direction: column; gap: 0; padding: 0; border: 1px solid #000; }
.cash-history__row {
  display: grid;
  grid-template-columns: auto 120px 1fr;
  gap: 12px;
  align-items: baseline;
  padding: 10px 14px;
  border-bottom: 1px solid #000;
  font-size: 12px;
}
.cash-history__row:last-child { border-bottom: 0; }
.cash-history__folio { font-weight: 700; font-variant-numeric: tabular-nums; color: #000; letter-spacing: -0.01em; }
.cash-history__date { color: #000; font-variant-numeric: tabular-nums; text-transform: uppercase; letter-spacing: 0.04em; }
.cash-history__status { color: #666; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; }

/* Clickable closed rows — inverts to black on hover/select, matching the
   topbar + button treatments used elsewhere in v2. */
.cash-history__row--clickable { cursor: pointer; transition: background 0.08s ease, color 0.08s ease; }
.cash-history__row--clickable:hover,
.cash-history__row--selected { background: #000; }
.cash-history__row--clickable:hover .cash-history__folio,
.cash-history__row--clickable:hover .cash-history__date,
.cash-history__row--selected .cash-history__folio,
.cash-history__row--selected .cash-history__date { color: #fff; }
.cash-history__row--clickable:hover .cash-history__status,
.cash-history__row--selected .cash-history__status { color: #bbb; }
.cash-history__row--clickable:focus-visible { outline: 2px solid #000; outline-offset: -2px; }

/* Closed-session detail panel */
.cash-detail .cash-panel__header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.cash-detail__header-actions { display: flex; gap: 4px; }
.cash-detail__body { gap: 16px; }
.cash-detail__meta {
  display: flex; flex-direction: column; gap: 4px;
  padding: 12px 14px; border: 1px solid #000; font-size: 12px; color: #000;
}
.cash-detail__observations { padding-top: 4px; font-style: italic; color: #666; }
.cash-detail__metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  border-top: 1px solid #000; border-left: 1px solid #000;
}
.cash-detail__metrics .cash-metric {
  border-right: 1px solid #000; border-bottom: 1px solid #000;
  min-width: 0; padding: 12px 14px;
}
.cash-detail__metrics .cash-metric.is-warn { background: #fff5d9; }
.cash-detail__metrics .cash-metric.is-warn .cash-metric__value { color: #8a5a00; }
.cash-detail__metrics .cash-metric.is-error { background: #fde6e6; }
.cash-detail__metrics .cash-metric.is-error .cash-metric__value { color: #d00000; }
.cash-detail__adjustments { display: flex; flex-direction: column; gap: 8px; }
.cash-detail__adjustments h4 {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em;
  font-weight: 700; color: #000; margin: 0;
}
.cash-detail__footnote { margin-top: 4px; font-size: 11px; color: #666; line-height: 1.5; }
.cash-detail__error { color: #d00000; font-size: 13px; margin-bottom: 8px; }

/* =======================  CORTE Z MODAL  ================================= */

.modal--cortez { width: min(960px, 100%); }

.cortez-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid #000;
}
.cortez-stat {
  display: flex;
  flex-direction: column;
  border: 0;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-radius: 0;
  padding: 10px 14px;
  gap: 2px;
  background: #fff;
}
.cortez-stat:nth-child(4n) { border-right: 0; }
.cortez-stat:nth-last-child(-n+4) { border-bottom: 0; }
.cortez-stat__label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #666;
  font-weight: 500;
}
.cortez-stat__value { font-weight: 700; font-variant-numeric: tabular-nums; font-size: 14px; color: #000; letter-spacing: -0.01em; }
.cortez-stat.is-accent { background: #000; }
.cortez-stat.is-accent .cortez-stat__label { color: #fff; }
.cortez-stat.is-accent .cortez-stat__value { color: #fff; }
.cortez-stat.is-pos .cortez-stat__value { color: #000; }
.cortez-stat.is-neg .cortez-stat__value { color: #d00000; }

.cortez-exchange { display: flex; gap: 12px; align-items: flex-end; max-width: 340px; }
.cortez-exchange .modal__label { min-width: 200px; }
.cortez-exchange .modal__input { flex: 1; }

.cortez-denoms {
  border: 1px solid #000;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.cortez-denoms__header { display: flex; justify-content: space-between; align-items: baseline; }
.cortez-denoms__header h3 {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
  font-weight: 700;
}
.cortez-denoms__total {
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #000;
  letter-spacing: -0.01em;
}
.cortez-denoms__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
}
.cortez-denoms__col {
  border: 1px solid #000;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: #fff;
}
.cortez-denoms__col-title {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
  padding: 4px 4px 8px;
  border-bottom: 1px solid #000;
  margin-bottom: 4px;
}
.cortez-denom-row {
  display: grid;
  grid-template-columns: 68px 78px 1fr;
  gap: 6px;
  align-items: center;
  padding: 4px;
  font-size: 12px;
}
.cortez-denom-row__denom { font-weight: 700; font-variant-numeric: tabular-nums; color: #000; }
.cortez-denom-row__qty {
  padding: 6px 8px;
  border: 1px solid #000;
  border-radius: 0;
  background: #fff;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  font-size: 12px;
}
.cortez-denom-row__line { text-align: right; color: #000; font-variant-numeric: tabular-nums; font-size: 12px; font-weight: 500; }
.cortez-handoff { display: flex; flex-direction: column; gap: 10px; }

/* =======================  HISTORY TAB  =================================== */

.history { display: flex; flex-direction: column; gap: 0; }
.history > * + * { border-top: 1px solid #000; }

.history-header {
  display: flex;
  gap: 0;
  align-items: stretch;
  background: #fff;
  border: 0;
  border-radius: 0;
  padding: 0;
  flex-wrap: wrap;
}
.history-header__left {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  padding: 14px 20px;
  border-right: 1px solid #000;
}
.history-header__label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #000;
}
.history-header__date {
  padding: 7px 10px;
  border: 1px solid #000;
  border-radius: 0;
  background: #fff;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  font-size: 13px;
}
.history-header__actions {
  margin-left: auto;
  display: flex;
  gap: 0;
  align-items: stretch;
}
.history-header__actions .sale-btn {
  border: 0;
  border-left: 1px solid #000;
  padding: 14px 20px;
  height: auto;
}

.history-grid {
  display: grid;
  grid-template-columns: minmax(380px, 1fr) minmax(0, 1.4fr);
  gap: 0;
  align-items: stretch;
}
@media (max-width: 1080px) { .history-grid { grid-template-columns: 1fr; } }

.history-list {
  background: #fff;
  border: 0;
  border-right: 1px solid #000;
  border-radius: 0;
  max-height: 780px;
  overflow: auto;
}
@media (max-width: 1080px) { .history-list { border-right: 0; border-bottom: 1px solid #000; } }
.history-list__header {
  display: flex;
  justify-content: space-between;
  padding: 10px 18px;
  border-bottom: 1px solid #000;
  background: #000;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  position: sticky;
  top: 0;
  z-index: 1;
}
.history-list__spinner { color: #fff; }
.history-list__rows { display: flex; flex-direction: column; }
.history-list__more {
  width: 100%;
  border-top: 1px solid #000;
  border-radius: 0;
}

.history-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  padding: 14px 18px;
  border: 0;
  border-top: 1px solid #000;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: background 80ms;
  align-items: start;
}
.history-row:first-child { border-top: 0; }
.history-row:hover { background: #f0f0f0; }
.history-row.is-selected { background: #000; color: #fff; }
.history-row.is-selected .history-row__folio,
.history-row.is-selected .history-row__customer,
.history-row.is-selected .history-row__total,
.history-row.is-selected .history-row__meta { color: #fff; }
.history-row.is-selected .history-row__method { border-color: #fff; color: #fff; }
.history-row.is-cancelled { opacity: 0.45; }
.history-row__main { display: flex; flex-direction: column; gap: 2px; grid-column: 1 / 2; grid-row: 1; }
.history-row__folio { font-weight: 700; font-variant-numeric: tabular-nums; font-size: 16px; color: #000; letter-spacing: -0.01em; }
.history-row__customer {
  font-size: 12px;
  color: #666;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.history-row__total { font-weight: 700; font-variant-numeric: tabular-nums; font-size: 16px; grid-column: 2; grid-row: 1; color: #000; letter-spacing: -0.01em; }
.history-row__meta {
  grid-column: 1 / -1;
  grid-row: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 10px;
  color: #666;
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.history-row__method {
  padding: 1px 6px;
  border: 1px solid #000;
  color: #000;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 9px;
}
.history-row__method.method-credit,
.history-row__method.method-transfer { background: #000; color: #fff; }
.history-row__time { font-variant-numeric: tabular-nums; }
.history-row__doc { font-weight: 700; letter-spacing: 0.08em; }
.history-row__doc.doc-stamped { color: #000; }
.history-row__doc.doc-stamp_error { color: #d00000; }
.history-row__needs { color: #000; font-weight: 700; }
.history-row__cancelled { color: #d00000; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; }

.history-detail {
  background: #fff;
  border: 0;
  border-radius: 0;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.history-detail--empty {
  align-items: center;
  justify-content: center;
  min-height: 280px;
  color: #999;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.history-detail__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid #000;
}
.history-detail__folio { font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; color: #000; letter-spacing: -0.03em; }
.history-detail__date { color: #666; font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; }
.history-detail__status {
  padding: 4px 10px;
  border: 1px solid #000;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
}
.history-detail__status.is-ok { background: #000; color: #fff; }
.history-detail__status.is-cancelled { background: #d00000; color: #fff; border-color: #d00000; }

.history-detail__meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 0;
  border: 1px solid #000;
}
.history-detail__meta-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
}
.history-detail__meta-row:nth-child(2n) { border-right: 0; }
.history-detail__meta-row:nth-last-child(-n+2) { border-bottom: 0; }
.history-detail__meta-row dt {
  font-size: 9px;
  color: #666;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.14em;
}
.history-detail__meta-row dd { margin: 0; font-weight: 700; text-align: right; color: #000; font-size: 12px; }

.history-detail__lines { display: flex; flex-direction: column; gap: 0; border: 1px solid #000; }
.history-detail__lines-title {
  display: none;
}
.history-detail__line {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid #000;
  font-size: 12px;
  align-items: baseline;
}
.history-detail__line:last-child { border-bottom: 0; }
.history-detail__line-name { font-weight: 700; color: #000; text-transform: uppercase; letter-spacing: 0.02em; }
.history-detail__line-qty { color: #666; font-variant-numeric: tabular-nums; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; }
.history-detail__line-total { font-weight: 700; font-variant-numeric: tabular-nums; }

.history-detail__totals {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 12px;
  border-top: 1px solid #000;
}
.history-detail__total-row {
  display: flex;
  justify-content: space-between;
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 500;
}
.history-detail__total-row.is-accent { color: #d00000; font-weight: 700; }
.history-detail__total-value { font-size: 28px; font-weight: 700; color: #000; letter-spacing: -0.03em; }

.history-detail__cancelled {
  border: 1px solid #d00000;
  color: #d00000;
  padding: 14px;
  background: #fff;
}
.history-detail__cancelled-title { font-weight: 700; text-transform: uppercase; letter-spacing: 0.14em; font-size: 11px; margin-bottom: 8px; }
.history-detail__cancelled .history-detail__meta-row dt { color: inherit; opacity: 0.75; }
.history-detail__cancelled .history-detail__meta-row dd { color: inherit; }

.history-detail__actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; border: 1px solid #000; }
.history-detail__actions .sale-btn { border: 0; border-right: 1px solid #000; border-bottom: 1px solid #000; padding: 12px; }
.history-detail__actions .sale-btn:nth-child(2n) { border-right: 0; }
.history-detail__actions .sale-btn:nth-last-child(-n+2) { border-bottom: 0; }
/* Placeholder cell paired with the manager-only Cancelar ticket button
   so the bottom-right grid corner isn't empty. Visually mute — no text,
   no hover, not focusable. */
.history-detail__actions .sale-btn--placeholder {
  background: #fff;
  color: transparent;
  cursor: default;
  pointer-events: none;
  opacity: 1;
}
.history-detail__actions .sale-btn--placeholder:hover { background: #fff; color: transparent; }

.history-sku-totals__grand { font-variant-numeric: tabular-nums; font-weight: 700; color: #000; font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; }
.history-sku-totals__grid { display: grid; grid-template-columns: 1fr; gap: 0; border: 1px solid #000; }
.history-sku-totals__row {
  display: grid;
  grid-template-columns: 60px 1fr auto auto;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid #000;
  align-items: baseline;
  font-size: 12px;
}
.history-sku-totals__row:last-child { border-bottom: 0; }
.history-sku-totals__code { font-weight: 500; font-variant-numeric: tabular-nums; color: #666; font-size: 11px; }
.history-sku-totals__name { font-weight: 700; color: #000; text-transform: uppercase; letter-spacing: 0.02em; }
.history-sku-totals__qty { font-variant-numeric: tabular-nums; color: #666; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; }
.history-sku-totals__amount { font-variant-numeric: tabular-nums; font-weight: 700; color: #000; }

.modal__checkbox {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid #000;
  background: #fff;
  cursor: pointer;
  font-weight: 500;
  color: #000;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.modal__checkbox input { margin-top: 2px; accent-color: #000; }

/* =======================  FISCAL TAB  ==================================== */

.fiscal { display: flex; flex-direction: column; gap: 0; }
.fiscal > * + * { border-top: 1px solid #000; }

.fiscal-readiness {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: #fff;
  border: 0;
  border-radius: 0;
  padding: 14px 24px;
}
.fiscal-readiness__left { display: flex; flex-direction: column; gap: 2px; }
.fiscal-readiness__label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #666;
  font-weight: 500;
}
.fiscal-readiness__body { font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; }
.fiscal-readiness__ok { color: #000; font-weight: 700; }
.fiscal-readiness__err { color: #d00000; font-weight: 500; }
.fiscal-readiness__providers { color: #666; font-variant-numeric: tabular-nums; }

.fiscal-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
  gap: 0;
  align-items: stretch;
}
.fiscal-panel {
  background: #fff;
  border: 0;
  border-right: 1px solid #000;
  border-radius: 0;
  overflow: hidden;
}
.fiscal-panel:last-child { border-right: 0; }
@media (max-width: 1100px) {
  .fiscal-panel { border-right: 0; border-bottom: 1px solid #000; }
  .fiscal-panel:last-child { border-bottom: 0; }
}
.fiscal-panel__header {
  padding: 12px 20px;
  border-bottom: 1px solid #000;
  background: #fff;
}
.fiscal-panel__header h3 {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #000;
  font-weight: 700;
}
.fiscal-panel__body { padding: 20px; display: flex; flex-direction: column; gap: 14px; }

.fiscal-find { display: flex; gap: 0; }
.fiscal-find__input {
  flex: 1;
  padding: 12px 14px;
  border: 1px solid #000;
  border-right: 0;
  border-radius: 0;
  background: #fff;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.04em;
}
.fiscal-find .sale-btn { border-radius: 0; }

.fiscal-sale {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px;
  border: 1px solid #000;
  background: #fff;
}
.fiscal-sale__primary { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.fiscal-sale__folio { font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; color: #000; letter-spacing: -0.02em; }
.fiscal-sale__customer { font-weight: 700; color: #000; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; }
.fiscal-sale__meta { font-size: 11px; color: #666; font-variant-numeric: tabular-nums; text-transform: uppercase; letter-spacing: 0.06em; }

.fiscal-docs { display: flex; flex-direction: column; gap: 0; margin-top: 6px; border: 1px solid #000; }
.fiscal-docs__title {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #fff;
  background: #000;
  padding: 8px 14px;
}
.fiscal-doc {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: 12px 14px;
  background: #fff;
  border: 0;
  border-top: 1px solid #000;
  border-radius: 0;
}
.fiscal-doc__left { display: flex; flex-direction: column; gap: 2px; }
.fiscal-doc:first-of-type { border-top: 0; }
.fiscal-doc.doc-stamped { background: #fff; }
.fiscal-doc.doc-stamp_error { background: #fde6e6; color: #8a1f1f; }
.fiscal-doc__label { font-weight: 700; color: inherit; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; }
.fiscal-doc__uuid { font-size: 10px; color: #666; font-variant-numeric: tabular-nums; letter-spacing: 0.02em; }
.fiscal-doc__error {
  margin-top: 6px;
  padding: 6px 8px;
  background: #fff;
  border: 1px solid #8a1f1f;
  font-size: 11px;
  line-height: 1.4;
}
.fiscal-doc__error-code { font-weight: 700; color: #8a1f1f; margin-bottom: 2px; }
.fiscal-doc__error-message { color: #8a1f1f; word-break: break-word; }
.fiscal-doc__links { display: flex; gap: 4px; flex-wrap: nowrap; justify-content: flex-start; }
.fiscal-doc__links .sale-btn { flex-shrink: 0; white-space: nowrap; }

.fiscal-form { display: grid; grid-template-columns: 1fr; gap: 10px; }
.fiscal-form__actions { display: flex; justify-content: space-between; gap: 8px; margin-top: 6px; }
.fiscal-form__hint {
  font-size: 11px;
  color: #000;
  background: #fff5d9;
  border: 1px solid #000;
  padding: 6px 8px;
  margin-top: -6px;
  font-weight: 500;
}
.complement-mode {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}
.complement-mode .sale-btn { border-radius: 0; }
.complement-mode .sale-btn:first-child { border-right: 0; }

/* =======================  PLACEHOLDERS  ================================== */

.v2-placeholder {
  background: #fff;
  border: 1px dashed #000;
  border-radius: 0;
  padding: 72px 32px;
  text-align: center;
  color: #666;
}
.v2-placeholder h2 {
  color: #000;
  margin: 0 0 6px;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
}
.v2-placeholder p { margin: 0; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; }

/* ==========================================================================
   Ajustes / Configuración tab
   ========================================================================== */
.ajustes {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px 24px 40px;
  max-width: 1100px;
  width: 100%;
  margin: 0 auto;
}
.ajustes__card {
  border: 1px solid #000;
  background: #fff;
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ajustes__card--muted { background: #f7f7f7; }
.ajustes__card-header { display: flex; flex-direction: column; gap: 4px; }
.ajustes__card-title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.ajustes__card-subtitle {
  margin: 0;
  font-size: 12px;
  color: #555;
}
.ajustes__grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.ajustes__kv {
  border: 1px solid #000;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: #fafafa;
}
.ajustes__kv-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #666;
}
.ajustes__kv-value { font-size: 13px; }
.ajustes__kv-value.mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
}
.ajustes__toolbar {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.ajustes__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ajustes__field-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #555;
}
.ajustes__notice {
  padding: 10px 12px;
  border: 1px solid #000;
  font-size: 12px;
  line-height: 1.4;
}
.ajustes__notice--ok { background: #eafbe7; }
.ajustes__notice--warn { background: #fff7d6; }
.ajustes__notice--error { background: #fde7e7; }
.ajustes__notice--info { background: #e9f0fb; }
.ajustes__empty {
  padding: 20px;
  border: 1px dashed #aaa;
  text-align: center;
  font-size: 12px;
  color: #666;
}

/* Price rows ------------------------------------------------------------ */
.ajustes__price-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 60vh;
  overflow-y: auto;
  border: 1px solid #000;
}
.ajustes__price-row {
  display: grid;
  grid-template-columns: 80px 1fr 180px 120px;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid #eee;
  background: #fff;
}
.ajustes__price-row:last-child { border-bottom: 0; }
.ajustes__price-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  font-weight: 600;
}
.ajustes__price-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ajustes__price-name {
  font-size: 13px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ajustes__price-meta {
  font-size: 11px;
  color: #666;
}
.ajustes__price-input { display: flex; flex-direction: column; gap: 4px; }
.ajustes__price-input .ajustes__field-label { font-size: 10px; }
.ajustes__price-actions { display: flex; justify-content: flex-end; }

/* Ownership help list --------------------------------------------------- */
.ajustes__help-list { display: flex; flex-direction: column; gap: 10px; }
.ajustes__help-item {
  border-left: 3px solid #000;
  padding: 8px 12px;
  background: #fafafa;
}
.ajustes__help-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 2px;
}
.ajustes__help-body { font-size: 12px; color: #333; line-height: 1.4; }

@media (max-width: 800px) {
  .ajustes__grid2 { grid-template-columns: 1fr; }
  .ajustes__price-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .ajustes__price-code { font-size: 14px; }
  .ajustes__price-actions { justify-content: flex-start; }
}

/* Ajustes bridge card — checkbox row + helper copy */
.ajustes__checkbox {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #000;
  padding: 10px 14px;
  background: #fafafa;
  font-size: 13px;
  line-height: 1.4;
  cursor: pointer;
}
.ajustes__field-helper {
  font-size: 11px;
  color: #666;
  line-height: 1.4;
}
.ajustes__card code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  background: #fff;
  border: 1px solid #ddd;
  padding: 1px 4px;
  border-radius: 2px;
}

/* Corte Z PIN confirmation pane (renders inside the Corte Z modal after
   the cashier clicks "Solicitar cierre Corte Z") */
.cortez-pin-pane {
  border-top: 2px solid #000;
  padding-top: 14px;
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cortez-pin-pane__banner {
  padding: 10px 14px;
  background: #fff7d6;
  border: 1px solid #000;
  font-size: 13px;
  line-height: 1.4;
}
.cortez-pin-pane__actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

/* Fiscal documents card in the history detail (invoices + complements) */
.history-detail__fiscal {
  border-top: 1px solid #000;
  padding-top: 10px;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.history-detail__fiscal-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.history-detail__fiscal-empty {
  font-size: 12px;
  color: #666;
}
.history-detail__fiscal-error {
  font-size: 12px;
  color: #8a1f1f;
  padding: 6px 8px;
  background: #fde7e7;
  border: 1px solid #000;
}
.history-detail__fiscal-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.history-detail__fiscal-row {
  padding: 8px 10px;
  border: 1px solid #000;
  background: #fafafa;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.history-detail__fiscal-line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 12px;
}
.history-detail__fiscal-kind {
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border: 1px solid #000;
  background: #fff;
}
.history-detail__fiscal-kind--ok { background: #eafbe7; }
.history-detail__fiscal-kind--warn { background: #fff7d6; }
.history-detail__fiscal-kind--error { background: #fde7e7; }
.history-detail__fiscal-meta { color: #333; }
.history-detail__fiscal-uuid {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 10px;
  color: #666;
}
.history-detail__fiscal-status {
  margin-left: auto;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 2px 6px;
  border: 1px solid #000;
}
.history-detail__fiscal-status--ok { background: #eafbe7; }
.history-detail__fiscal-status--warn { background: #fff7d6; }
.history-detail__fiscal-status--error { background: #fde7e7; }
.history-detail__fiscal-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

/* =======================  DISCOUNT MODAL  ================================ */
.modal--discount { width: min(640px, 100%); }
.discount-body { display: flex; flex-direction: column; gap: 14px; }
.discount-field { display: flex; flex-direction: column; gap: 4px; }
.discount-preview {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid #000;
  border-left: 1px solid #000;
  margin-top: 4px;
}
.discount-cell {
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: #fff;
  min-width: 0;
}
.discount-cell__label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #666;
  font-weight: 500;
}
.discount-cell__value {
  font-size: 16px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #000;
  letter-spacing: -0.01em;
}
.discount-cell.is-accent { background: #000; }
.discount-cell.is-accent .discount-cell__label { color: #fff; }
.discount-cell.is-accent .discount-cell__value { color: #fff; }
.modal__hint { font-size: 11px; color: #666; font-style: italic; }

/* ======================================================================== */
/* CAPTURE — Phase 2 Entrada MVP                                              */
/* ======================================================================== */

.v2-capture {
  padding: 32px 40px 48px;
  max-width: 720px;
}

.v2-capture__head {
  padding-bottom: 20px;
  border-bottom: 1px solid #000;
  margin-bottom: 24px;
}
.v2-capture__kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
  margin-bottom: 6px;
}
.v2-capture__title {
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0;
  text-transform: uppercase;
}
.v2-capture__sub {
  margin: 8px 0 0;
  color: #666;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.v2-capture__flash {
  padding: 12px 14px;
  margin-bottom: 20px;
  border: 1px solid #000;
  font-size: 12px;
  letter-spacing: 0.02em;
  cursor: pointer;
}
.v2-capture__flash--ok    { background: #f0f0f0; color: #000; }
.v2-capture__flash--error { background: #ffeeee; color: #d00000; border-color: #d00000; }

/* Restored-draft strip (v8-borradores-captura) — deliberately muted: it's
   an informational hint that the visible values are an unsaved draft, not
   an alarm. The discard button is styled as a quiet inline link. */
.v2-capture__draft-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 12px;
  padding: 8px 12px;
  border: 1px dashed #aaa;
  background: #fafafa;
  color: #666;
  font-size: 11px;
  letter-spacing: 0.02em;
}
.v2-capture__draft-discard {
  background: none;
  border: none;
  padding: 0;
  color: #666;
  font-size: 11px;
  letter-spacing: 0.02em;
  text-decoration: underline;
  cursor: pointer;
}
.v2-capture__draft-discard:hover { color: #000; }

.v2-capture__form { display: flex; flex-direction: column; gap: 18px; }

.v2-capture__row {
  display: grid;
  gap: 14px;
}
.v2-capture__row--1 { grid-template-columns: 1fr; }
.v2-capture__row--3 {
  grid-template-columns: 2fr 1fr 1fr;
}
@media (max-width: 640px) {
  .v2-capture__row--3 { grid-template-columns: 1fr; }
}

.v2-capture__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.v2-capture__field-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #000;
}
.v2-capture__field input,
.v2-capture__field select,
.v2-capture__field textarea {
  padding: 11px 12px;
  font-size: 14px;
  border: 1px solid #000;
}
.v2-capture__field textarea {
  resize: vertical;
  min-height: 60px;
  font-family: inherit;
}

.v2-capture__actions {
  display: flex;
  justify-content: flex-start;
  padding-top: 8px;
}

/* ── Phase 2b: mode pills + direction toggle ─────────────────────────────── */

.v2-capture__modes {
  display: flex;
  gap: 0;
  margin-bottom: 20px;
  border: 1px solid #000;
}

.v2-capture__mode-btn {
  appearance: none;
  background: #fff;
  color: #000;
  border: 0;
  border-right: 1px solid #000;
  padding: 10px 18px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  flex: 1;
  text-align: center;
}
.v2-capture__mode-btn:last-child { border-right: 0; }
.v2-capture__mode-btn:hover { background: #f0f0f0; }
.v2-capture__mode-btn.is-active {
  background: #000;
  color: #fff;
}

.v2-capture__row--2 {
  grid-template-columns: 2fr 1fr;
}
@media (max-width: 640px) {
  .v2-capture__row--2 { grid-template-columns: 1fr; }
}

.v2-capture__direction {
  border: 1px solid #000;
  padding: 10px 14px 12px;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.v2-capture__direction legend {
  padding: 0 6px;
  margin-left: -6px;
}
.v2-capture__direction-opt {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  cursor: pointer;
  padding: 2px 0;
}
.v2-capture__direction-opt input[type="radio"] {
  width: 14px;
  height: 14px;
}

/* ── Phase 2c: traspaso layouts ──────────────────────────────────────────── */

/* Mode-pill bar wraps to multiple rows on phones. With Traspaso Calidad
   hidden (HIDDEN_CAPTURE_MODES), the bar shows up to 4 pills:
   - Manager (4 pills): row 1 = Merma · Entrada · Ajuste, row 2 alone =
     Traspaso SKU full-width.
   - Employee (3 pills): row 1 = Merma · Entrada · Traspaso SKU, all
     three at 33% each on one row.
   The full-width rule is keyed off :nth-child(4) instead of :last-child
   so it only triggers when there's actually a 4th pill — otherwise it
   would wrongly wrap the 3rd pill to its own row in the employee case. */
@media (max-width: 640px) {
  .v2-capture__modes { flex-wrap: wrap; }
  .v2-capture__mode-btn {
    flex: 1 1 33%;
    border-bottom: 1px solid #000;
    padding: 8px 10px;
    font-size: 10px;
    letter-spacing: 0.08em;
  }
  .v2-capture__mode-btn:nth-child(4) {
    flex: 1 1 100%;
    border-right: 0;
    border-bottom: 0;
  }
}

.v2-capture__traspaso-calidad {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* ======================================================================== */
/* MOVIMIENTOS — Phase 3a read-only list                                      */
/* ======================================================================== */

.v2-movements {
  padding: 32px 40px 48px;
  max-width: none;
}

.v2-movements__table {
  border: 1px solid #000;
  margin-top: 24px;
}

.v2-movements__thead,
.v2-movements__row {
  display: grid;
  grid-template-columns: 80px 140px 120px 1fr 160px;
  align-items: center;
  gap: 0;
}

.v2-movements__thead {
  background: #f0f0f0;
  border-bottom: 1px solid #000;
  padding: 0;
}
.v2-movements__th {
  padding: 10px 14px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
  border-right: 1px solid #000;
}
.v2-movements__th:last-child { border-right: 0; }

.v2-movements__group {
  border-bottom: 1px solid #000;
}
.v2-movements__group:last-child { border-bottom: 0; }

.v2-movements__row {
  appearance: none;
  width: 100%;
  border: 0;
  background: #fff;
  color: #000;
  cursor: pointer;
  text-align: left;
  padding: 0;
  font: inherit;
  transition: background 80ms;
}
.v2-movements__row:hover { background: #f7f7f7; }
.v2-movements__row.is-expanded { background: #f0f0f0; }

.v2-movements__cell {
  padding: 12px 14px;
  font-size: 12px;
  border-right: 1px solid #cccccc;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.v2-movements__cell:last-child { border-right: 0; }
.v2-movements__cell--ref {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v2-movements__cell--date {
  font-variant-numeric: tabular-nums;
  color: #666;
  font-size: 11px;
}

.v2-movements__badge {
  display: inline-block;
  padding: 3px 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border: 1px solid #000;
  background: #fff;
}
.v2-movements__badge.is-venta    { background: #000; color: #fff; }
.v2-movements__badge.is-merma    { background: #ffeeee; color: #d00000; border-color: #d00000; }
.v2-movements__badge.is-ajuste   { background: #f0f0f0; }
.v2-movements__badge.is-traspaso_sku,
.v2-movements__badge.is-traspaso_calidad { background: #fff; }

.v2-movements__muted { color: #999; }

.v2-movements__detail {
  padding: 14px 14px 16px;
  background: #fafafa;
  border-top: 1px solid #cccccc;
}
.v2-movements__notes {
  font-size: 12px;
  margin-bottom: 10px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid #cccccc;
}
.v2-movements__notes-label {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
  margin-right: 10px;
}
.v2-movements__detail-loading {
  padding: 20px;
  text-align: center;
  color: #666;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.v2-movements__lines {
  border: 1px solid #000;
  background: #fff;
}
.v2-movements__lines-head,
.v2-movements__lines-row {
  display: grid;
  grid-template-columns: 180px 1fr 120px 90px 70px 90px;
  align-items: center;
  font-size: 11px;
}
.v2-movements__lines-head {
  background: #000;
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 9px;
}
.v2-movements__lines-head > div,
.v2-movements__lines-row > div {
  padding: 8px 10px;
  border-right: 1px solid #cccccc;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.v2-movements__lines-head > div { border-right-color: #333; }
.v2-movements__lines-head > div:last-child,
.v2-movements__lines-row > div:last-child { border-right: 0; }
.v2-movements__lines-row {
  border-top: 1px solid #cccccc;
}
.v2-movements__lines-row:first-child { border-top: 0; }

.v2-movements__num {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* Narrow screens: hide the employee column; detail still reveals it.
   Keep ref + type + date + summary. */
@media (max-width: 820px) {
  .v2-movements__thead,
  .v2-movements__row {
    grid-template-columns: 70px 120px 100px 1fr;
  }
  .v2-movements__thead .v2-movements__th:last-child,
  .v2-movements__row .v2-movements__cell:last-child { display: none; }
}

/* ── Movimientos card-per-row at narrow widths ──────────────────────────────
   Cards instead of a grid table below 560px. The same DOM still backs the
   list — each .v2-movements__row is still a single <button> click target —
   we just unstack the grid into a flex column so each cell sits on its own
   line. The thead is hidden (sort still controlled by the filter bar; column
   labels redundant on cards) and per-cell typography is rebalanced so the
   reference number is the visual anchor.

   The expanded detail panel's lines table also flattens to per-line cards
   so the Δkg + Después numbers sit on their own readable line. */
@media (max-width: 560px) {
  .v2-movements__thead { display: none; }

  .v2-movements__row {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 12px 14px;
    border-bottom: 0;       /* group already provides the bottom border */
  }
  .v2-movements__row.is-expanded { background: #f0f0f0; }

  .v2-movements__cell {
    border-right: 0;
    padding: 0;
    font-size: 14px;
    white-space: normal;
    line-height: 1.35;
  }
  .v2-movements__cell--ref {
    font-size: 13px;
    color: #666;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  /* The "summary" cell is the long descriptive line — give it more weight. */
  .v2-movements__cell:nth-child(4) {
    font-size: 14px;
    font-weight: 500;
    color: #000;
  }
  /* Date cell stays visible (hidden in the desktop 560px rule above; we
     undo that so the user gets the timestamp on the card). */
  .v2-movements__row .v2-movements__cell:nth-child(3) {
    display: block;
    font-size: 11px;
    color: #666;
  }

  /* Detail panel: lines render as compact cards too, not a tight grid. */
  .v2-movements__lines-head { display: none; }
  .v2-movements__lines-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 12px;
    border-top: 1px solid #cccccc;
  }
  .v2-movements__lines-row:first-child { border-top: 0; }
  .v2-movements__lines-row > div {
    border-right: 0;
    padding: 0;
    white-space: normal;
    font-size: 13px;
  }
  /* SKU label on top of the line card; numeric Δ + Después below in a
     spaced-out single line so the eye reads weight ↔ post-balance. */
  .v2-movements__lines-row > div:nth-child(1) {
    font-weight: 700;
  }
}

/* ── Phase 3b: detail-panel actions row ──────────────────────────────────── */

.v2-movements__detail-actions {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #cccccc;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* ── Phase 3b soft-cancel: status badges + cancelled-row treatment ──────── */

.v2-movements__badge--cancelled {
  margin-left: 6px;
  background: #d00000;
  color: #fff;
  border-color: #d00000;
}

.v2-movements__badge--reversal {
  margin-left: 6px;
  background: #f0f0f0;
  color: #666;
  border-color: #999;
}

/* Strike + dim cancelled rows so they're clearly inert without hiding
   them. Detail panel inherits the strikethrough; clear it back to
   normal for the lines table so numbers stay legible. */
.v2-movements__group.is-cancelled .v2-movements__cell {
  color: #999;
  text-decoration: line-through;
}
.v2-movements__group.is-cancelled .v2-movements__cell--ref { color: #666; }
.v2-movements__group.is-cancelled .v2-movements__detail,
.v2-movements__group.is-cancelled .v2-movements__detail * {
  text-decoration: none;
}

.v2-movements__group.is-reversal .v2-movements__cell--ref {
  color: #666;
  font-style: italic;
}

/* Detail-panel info note (e.g. "ventas se cancelan desde el POS"). */
.v2-movements__detail-note {
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px dashed #999;
  background: #fafafa;
  color: #666;
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.02em;
}

/* ======================================================================== */
/* INVENTARIO — Phase 4 read-only on-hand list                                */
/* ======================================================================== */

.v2-inventory {
  padding: 32px 40px 48px;
  max-width: none;
}

.v2-inventory__controls {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 0 16px;
  margin-top: 12px;
}

/* Historical-snapshot bar — sits above the showEmpty toggle, lets the
   user pick a moment and ask "what was on-hand then?". When inactive,
   "Ahora" is disabled and the banner is hidden. When active, the banner
   makes the historical mode obvious so the kg numbers below don't get
   confused for current values. */
.v2-inventory__snapshot {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 14px;
  padding: 14px;
  margin-top: 16px;
  border: 1px solid #000;
  background: #fafafa;
}
.v2-inventory__snapshot-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 200px;
  min-width: 0;
}
.v2-inventory__snapshot-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
}
.v2-inventory__snapshot-field input {
  padding: 10px 12px;
  font-size: 14px;
  border: 1px solid #000;
  background: #fff;
}
.v2-inventory__snapshot-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
.v2-inventory__snapshot-banner {
  flex: 1 1 100%;
  margin: 4px 0 0;
  padding: 8px 10px;
  border-left: 3px solid #000;
  background: #fff;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: 0.02em;
}
@media (max-width: 640px) {
  .v2-inventory__snapshot { padding: 12px; }
  .v2-inventory__snapshot-actions { flex: 1 1 100%; }
  .v2-inventory__snapshot-actions > .sale-btn { flex: 1 1 50%; }
}

.v2-inventory__toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
}
.v2-inventory__toggle input[type="checkbox"] {
  width: 14px;
  height: 14px;
  margin: 0;
}

.v2-inventory__table {
  border: 1px solid #000;
}

.v2-inventory__thead,
.v2-inventory__row,
.v2-inventory__tfoot {
  display: grid;
  /* SKUs (compact — codes are 3 digits, slash-joined) · Producto · Calidad · On-hand */
  grid-template-columns: 130px 2fr 110px 160px;
  align-items: stretch;
}

.v2-inventory__sku-cell {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}

.v2-inventory__thead {
  background: #000;
  color: #fff;
  border-bottom: 1px solid #000;
}
.v2-inventory__th {
  appearance: none;
  background: transparent;
  border: 0;
  border-right: 1px solid #333;
  color: #fff;
  padding: 10px 14px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  cursor: pointer;
  text-align: left;
  font: inherit;
  font-size: 9px;
  font-weight: 700;
}
.v2-inventory__th:last-child { border-right: 0; }
.v2-inventory__th.is-active { background: #1a1a1a; }
.v2-inventory__th:hover { background: #1a1a1a; }
.v2-inventory__th.v2-inventory__num { text-align: right; }

.v2-inventory__row {
  border-bottom: 1px solid #cccccc;
  background: #fff;
}
.v2-inventory__row:last-of-type { border-bottom: 0; }
.v2-inventory__row:hover { background: #fafafa; }

.v2-inventory__cell {
  padding: 10px 14px;
  font-size: 12px;
  font-weight: 700;
  border-right: 1px solid #cccccc;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.v2-inventory__cell:last-child { border-right: 0; }

.v2-inventory__num {
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.v2-inventory__num.is-negative { color: #d00000; }

.v2-inventory__tfoot {
  border-top: 1px solid #000;
  background: #f0f0f0;
  font-weight: 700;
}
.v2-inventory__tfoot .v2-inventory__cell {
  padding: 12px 14px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

@media (max-width: 760px) {
  .v2-inventory__thead,
  .v2-inventory__row,
  .v2-inventory__tfoot {
    grid-template-columns: 95px 1.5fr 80px 110px;
  }
}
@media (max-width: 520px) {
  /* Hide quality column on the smallest screens; SKU + Producto +
     On-hand stay so the at-a-glance read is still useful. */
  .v2-inventory__thead,
  .v2-inventory__row,
  .v2-inventory__tfoot {
    grid-template-columns: 90px 1fr 90px;
  }
  .v2-inventory__thead > *:nth-child(3),
  .v2-inventory__row > *:nth-child(3),
  .v2-inventory__tfoot > *:nth-child(3) { display: none; }
}

/* ── Inventario card-per-row at narrow widths ─────────────────────────────
   Below 480px each bucket renders as a card with the on-hand kg as the
   visual anchor. The thead stays as a row of 4 sort buttons across the top
   so the user can still reorder; tfoot collapses to a single "Total" line
   at the bottom of the card list.

   Visual hierarchy on each card:
     line 1:  [SKU codes]                       [on-hand kg, big]
     line 2:  Producto / Calidad
   --------------------------------------------------------------------- */
@media (max-width: 480px) {
  .v2-inventory { padding: 20px 16px 32px; }

  /* Sort header becomes 4 squeezed-but-readable buttons in a single row. */
  .v2-inventory__thead {
    display: flex;
    flex-wrap: nowrap;
    grid-template-columns: none;
  }
  .v2-inventory__th {
    flex: 1 1 25%;
    text-align: center;
    padding: 10px 6px;
  }
  .v2-inventory__thead > *:nth-child(3) { display: flex; }   /* re-show Calidad sort */

  /* Card layout. Producto and Calidad each get their OWN grid area on the
     second line — the previous version put BOTH in one area ("meta") and
     relied on display:inline to flow them together, but grid items are
     always blockified, so the two texts stacked on top of each other and
     were unreadable (operator report 2026-08-22). `prod` is auto-sized and
     `cal` takes the remaining width, so it still reads "Producto · Calidad"
     on one line and wraps cleanly when the product name is long. */
  .v2-inventory__row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-areas:
      "sku  sku kg"
      "prod cal cal";
    gap: 4px 6px;
    padding: 12px 14px;
    align-items: center;
  }
  .v2-inventory__cell {
    border-right: 0;
    padding: 0;
    font-size: 14px;
    white-space: normal;
  }
  .v2-inventory__row > .v2-inventory__cell:nth-child(1) { grid-area: sku; }
  .v2-inventory__row > .v2-inventory__cell:nth-child(2) {
    grid-area: prod;
    font-size: 12px;
    color: #666;
    font-weight: 500;
  }
  /* Explicit display:block overrides the ≤520px "hide quality" rule. */
  .v2-inventory__row > .v2-inventory__cell:nth-child(3) {
    display: block;
    grid-area: cal;
    font-size: 12px;
    color: #666;
    font-weight: 500;
  }
  .v2-inventory__row > .v2-inventory__cell:nth-child(3)::before {
    content: "· ";
    color: #999;
  }
  .v2-inventory__row > .v2-inventory__cell:nth-child(4) {
    grid-area: kg;
    font-size: 18px;
    font-weight: 700;
    text-align: right;
  }

  /* tfoot: single horizontal "Total xxx kg" line. */
  .v2-inventory__tfoot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 14px;
  }
  .v2-inventory__tfoot > .v2-inventory__cell {
    border-right: 0;
    padding: 0;
    font-size: 13px;
  }
  .v2-inventory__tfoot > .v2-inventory__cell:nth-child(1),
  .v2-inventory__tfoot > .v2-inventory__cell:nth-child(3) { display: none; }
  .v2-inventory__tfoot > .v2-inventory__cell:nth-child(4) {
    font-size: 16px;
    font-weight: 700;
  }
}

/* ======================================================================== */
/* MULTI-LINE CAPTURE — Phase 2d                                              */
/* ======================================================================== */

.v2-capture__lines-wrap {
  border: 1px solid #000;
}

.v2-capture__lines-head {
  display: grid;
  grid-template-columns: 1fr 140px 140px 36px;
  background: #000;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
/* Merma / Ajuste only render two data columns (SKU + Peso, no Boxes), so the
   head must use a 3-column template that mirrors `.v2-capture__line--2col`.
   Without this, the head defaulted to 4 columns and the empty remove
   placeholder landed in the Boxes slot — leaving an empty fourth cell on the
   right and shifting PESO out of alignment with the weight input below it. */
.v2-capture__lines-head.v2-capture__lines-head--2col {
  grid-template-columns: 1fr 140px 36px;
}
.v2-capture__lines-col {
  padding: 8px 12px;
  border-right: 1px solid #333;
}
.v2-capture__lines-col:last-child { border-right: 0; }
.v2-capture__lines-col--remove { padding: 8px 4px; }

.v2-capture__lines {
  display: flex;
  flex-direction: column;
}

.v2-capture__line {
  display: grid;
  grid-template-columns: 1fr 140px 140px 36px;
  border-bottom: 1px solid #cccccc;
}
.v2-capture__line--2col {
  /* merma / ajuste: no boxes column. Collapse the third grid column. */
  grid-template-columns: 1fr 140px 36px;
}
.v2-capture__line:last-child { border-bottom: 0; }

.v2-capture__line input {
  border: 0;
  border-right: 1px solid #cccccc;
  padding: 11px 12px;
  font-size: 14px;
  background: #fff;
  border-radius: 0;
  width: 100%;
  /* Without min-width: 0, CSS Grid treats each input's min-content (the
     typed value or placeholder) as the column's minimum. Typing a long
     SKU code or weight then visibly grows that column and shrinks the
     others. Forcing min-width: 0 keeps the 1fr 1fr 1fr distribution
     exactly equal regardless of content — boxes stay the same size as
     you type. (The outline shift the user sees is purely perceptual:
     outline doesn't take layout space, but the focus + simultaneous
     keypress made the column-resize feel like an outline effect.) */
  min-width: 0;
}
.v2-capture__line input:focus-visible {
  /* Focus indicator: light grey background instead of an inset outline.
     The previous `outline: 2px solid #000; outline-offset: -2px` drew a
     2px black frame INSIDE the input's edge, which doesn't change layout
     but visually eats 2px of interior on top + bottom — making the
     focused cell look shorter than its neighbors on the same line row.
     A background fill keeps every cell pixel-identical in size whether
     focused or not, while still providing a clear "this is the active
     input" cue. */
  outline: 0;
  background: #f0f0f0;
}
.v2-capture__line input:last-of-type {
  border-right: 0;
}

.v2-capture__line-remove {
  appearance: none;
  background: #fff;
  border: 0;
  border-left: 1px solid #cccccc;
  color: #999;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  transition: background 80ms;
}
.v2-capture__line-remove:hover {
  background: #d00000;
  color: #fff;
  border-left-color: #d00000;
}

.v2-capture__line-add {
  appearance: none;
  background: #fff;
  border: 0;
  border-top: 1px solid #000;
  width: 100%;
  padding: 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  color: #000;
}
.v2-capture__line-add:hover { background: #000; color: #fff; }

/* Mobile capture line layout. Proportions chosen by content:
     - SKU column (2fr): holds a long picked-label like "103 — Manzana Primera"
       after the SKU picker resolves. Needs the most room.
     - Weight (1fr) + Boxes (1fr): only ever show 4-5 chars like "12.50" or "8".
       1/4 of the row each is plenty.
     - Remove button: 36px fixed.
   Earlier this was 1fr 1fr 1fr (matched Traspaso SKU's balanced look pre-picker),
   but once the SKU picker landed the trigger label needed more space and weight
   ended up disproportionately wide for what it shows.
   Font-size on inputs stays at 16px via the MOBILE INPUT HYGIENE block at the
   bottom of this file (kills iOS auto-zoom on focus). */
@media (max-width: 640px) {
  .v2-capture__lines-head,
  .v2-capture__line {
    /* Weight + Boxes get fixed narrow widths sized for their typical
       content ("12.50", "8") instead of fr-shares that grew with
       viewport. Anything larger felt wasteful next to the SKU column,
       which absorbs all leftover space (1fr) so the picked-label has
       room to breathe. Weight is 90px (was 64px) so common values like
       "12.50" / "100.50" fit cleanly without internal scrolling. */
    grid-template-columns: 1fr 90px 56px 36px;
  }
  .v2-capture__line--2col,
  .v2-capture__lines-head.v2-capture__lines-head--2col {
    grid-template-columns: 1fr 90px 36px;
  }

  /* Header labels (SKU / PESO (KG) / CAJAS) at 9px+0.14em were wrapping
     mid-text inside the 64px columns — splitting "PESO (KG)" into a
     stacked two-line cell that didn't visually align with the single-line
     input cell underneath. Smaller font, tighter letter-spacing, tighter
     padding, plus white-space: nowrap so the row stays one line tall and
     the header cell shares the input row's height. Anything that still
     overflows clips with an ellipsis. */
  .v2-capture__lines-col {
    padding: 8px 6px;
    font-size: 8px;
    letter-spacing: 0.06em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* ── Phase 3c: movements filter bar + load-more ──────────────────────────── */

.v2-movements__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 14px;
  align-items: flex-end;
  margin: 16px 0 14px;
  padding: 12px 14px;
  border: 1px solid #000;
  background: #fafafa;
}

.v2-movements__filter {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 140px;
  min-width: 120px;
}

.v2-movements__filter-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
}

.v2-movements__filter input,
.v2-movements__filter select {
  padding: 8px 10px;
  font-size: 12px;
  border: 1px solid #000;
  background: #fff;
  border-radius: 0;
}

.v2-movements__empty {
  padding: 24px 16px;
  text-align: center;
  font-size: 12px;
  letter-spacing: 0.04em;
  color: #666;
  border-bottom: 1px solid #cccccc;
}

.v2-movements__load-more {
  display: flex;
  justify-content: center;
  margin-top: 14px;
}

@media (max-width: 640px) {
  .v2-movements__filter { flex: 1 1 100%; min-width: 0; }
}

/* ======================================================================== */
/* CAJA — Phase 5 read-only mirror                                            */
/* ======================================================================== */

.v2-cash {
  padding: 32px 40px 48px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.v2-cash__header {
  display: flex;
  align-items: stretch;
  border: 1px solid #000;
  background: #fff;
}

.v2-cash__header-left {
  padding: 18px 22px;
  border-right: 1px solid #000;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 240px;
}

.v2-cash__header-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
}
.v2-cash__header-folio {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.v2-cash__header-meta {
  font-size: 11px;
  color: #666;
  letter-spacing: 0.02em;
}

.v2-cash__header-metrics {
  display: flex;
  flex: 1;
}

.v2-cash__metric {
  flex: 1;
  padding: 16px 18px;
  border-right: 1px solid #000;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.v2-cash__metric:last-child { border-right: 0; }
.v2-cash__metric-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #666;
}
.v2-cash__metric-value {
  font-size: 18px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.v2-cash__metric.is-accent {
  background: #000;
  color: #fff;
}
.v2-cash__metric.is-accent .v2-cash__metric-label { color: #cccccc; }
.v2-cash__metric.is-accent .v2-cash__metric-value { color: #fff; }

.v2-cash__grid {
  display: grid;
  grid-template-columns: minmax(280px, 380px) 1fr;
  gap: 24px;
  align-items: start;
}

.v2-cash__card {
  border: 1px solid #000;
  background: #fff;
  padding: 18px 20px 16px;
}
.v2-cash__card-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin: 0 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid #000;
}

.v2-cash__arqueo-line {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 10px 0;
  border-bottom: 1px solid #cccccc;
  font-size: 13px;
}
.v2-cash__arqueo-line:last-child { border-bottom: 0; }
.v2-cash__arqueo-label {
  font-weight: 500;
  color: #000;
}
.v2-cash__arqueo-value {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.v2-cash__arqueo-line.is-negative .v2-cash__arqueo-value { color: #d00000; }
.v2-cash__arqueo-line.is-total {
  border-top: 1px solid #000;
  margin-top: 6px;
  padding-top: 12px;
  border-bottom: 0;
}
.v2-cash__arqueo-line.is-total .v2-cash__arqueo-label,
.v2-cash__arqueo-line.is-total .v2-cash__arqueo-value {
  font-size: 15px;
  font-weight: 700;
}

.v2-cash__sku-table {
  display: flex;
  flex-direction: column;
}

.v2-cash__sku-thead,
.v2-cash__sku-row,
.v2-cash__sku-tfoot {
  display: grid;
  grid-template-columns: 80px 1fr 100px 130px;
  align-items: center;
}

.v2-cash__sku-thead {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
  border-bottom: 1px solid #000;
}
.v2-cash__sku-thead > div {
  padding: 8px 10px;
  border-right: 1px solid #cccccc;
}
.v2-cash__sku-thead > div:last-child { border-right: 0; }

.v2-cash__sku-row {
  border-bottom: 1px solid #cccccc;
  font-size: 13px;
}
.v2-cash__sku-row > div {
  padding: 10px;
  border-right: 1px solid #f0f0f0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.v2-cash__sku-row > div:last-child { border-right: 0; }
.v2-cash__sku-row:last-of-type { border-bottom: 0; }
.v2-cash__sku-row:hover { background: #fafafa; }

.v2-cash__sku-code {
  font-family: var(--font-mono);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.v2-cash__sku-tfoot {
  border-top: 1px solid #000;
  background: #f0f0f0;
  font-weight: 700;
}
.v2-cash__sku-tfoot > div {
  padding: 12px 10px;
  font-size: 13px;
}

.v2-cash__num {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.v2-cash__empty {
  margin: 0;
  padding: 20px 0;
  text-align: center;
  color: #666;
  font-size: 12px;
  letter-spacing: 0.02em;
}

@media (max-width: 920px) {
  .v2-cash__grid { grid-template-columns: 1fr; }
  .v2-cash__header { flex-direction: column; }
  .v2-cash__header-left { border-right: 0; border-bottom: 1px solid #000; }
  .v2-cash__header-metrics { flex-wrap: wrap; }
  .v2-cash__metric { flex: 1 1 50%; border-bottom: 1px solid #000; }
  .v2-cash__metric:nth-child(2n) { border-right: 0; }
}

@media (max-width: 640px) {
  .v2-cash { padding: 20px 16px 32px; }
  .v2-cash__sku-thead,
  .v2-cash__sku-row,
  .v2-cash__sku-tfoot {
    grid-template-columns: 60px 1fr 90px;
  }
  /* Hide kg column on smallest; SKU + Producto + Importe stay. */
  .v2-cash__sku-thead > div:nth-child(3),
  .v2-cash__sku-row > div:nth-child(3),
  .v2-cash__sku-tfoot > div:nth-child(3) { display: none; }
}

/* ======================================================================== */
/* CORTES FÍSICOS — Phase 6                                                   */
/* ======================================================================== */

.v2-cortes {
  padding: 32px 40px 48px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.v2-cortes__newbar {
  display: flex;
  justify-content: flex-start;
}

.v2-cortes__form {
  border: 1px solid #000;
  background: #fafafa;
  padding: 18px 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.v2-cortes__form-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding-bottom: 8px;
  border-bottom: 1px solid #000;
  margin-bottom: 4px;
}

.v2-cortes__form-error {
  padding: 10px 12px;
  border: 1px solid #d00000;
  background: #ffeeee;
  color: #d00000;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.v2-cortes__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.v2-cortes__field-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #000;
}
.v2-cortes__field input,
.v2-cortes__field textarea {
  padding: 11px 12px;
  font-size: 14px;
  border: 1px solid #000;
  background: #fff;
  border-radius: 0;
}
.v2-cortes__field textarea {
  resize: vertical;
  min-height: 60px;
  font-family: inherit;
}

.v2-cortes__form-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding-top: 4px;
}

.v2-cortes__empty {
  margin: 8px 0 0;
  padding: 18px 16px;
  border: 1px dashed #cccccc;
  text-align: center;
  color: #666;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.v2-cortes__list {
  display: flex;
  flex-direction: column;
  border: 1px solid #000;
  background: #fff;
}

.v2-cortes__card {
  border-bottom: 1px solid #000;
  background: #fff;
}
.v2-cortes__card:last-child { border-bottom: 0; }
.v2-cortes__card.is-expanded { background: #f7f7f7; }

.v2-cortes__card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 14px 18px;
  background: transparent;
  border: 0;
  border-radius: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
@media (hover: hover) {
  .v2-cortes__card-head:hover { background: #fafafa; }
}

.v2-cortes__card-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.v2-cortes__card-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.v2-cortes__card-when {
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  color: #000;
}
.v2-cortes__card-meta {
  font-size: 11px;
  color: #666;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}

.v2-cortes__badge {
  display: inline-block;
  padding: 3px 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  border: 1px solid #000;
}
.v2-cortes__badge--active {
  background: #000;
  color: #fff;
}

.v2-cortes__card-chevron {
  font-size: 14px;
  color: #999;
  flex-shrink: 0;
}

.v2-cortes__detail {
  padding: 0 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-top: 1px solid #cccccc;
  margin-top: -1px;
}

.v2-cortes__notes {
  padding: 10px 12px;
  background: #fff;
  border: 1px solid #cccccc;
  font-size: 12px;
  line-height: 1.5;
  margin-top: 14px;
}
.v2-cortes__notes-label {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
  margin-right: 10px;
}
.v2-cortes__detail-empty {
  margin: 14px 0 0;
  font-size: 11px;
  color: #999;
  font-style: italic;
}
.v2-cortes__detail-stub {
  margin: 6px 0 4px;
  padding: 10px 12px;
  background: #fff;
  border: 1px dashed #cccccc;
  font-size: 11px;
  color: #666;
  letter-spacing: 0.02em;
}

@media (max-width: 640px) {
  .v2-cortes { padding: 20px 16px 32px; }
  .v2-cortes__form { padding: 16px 14px 14px; }
  .v2-cortes__form-actions { flex-direction: column-reverse; }
  .v2-cortes__form-actions > .sale-btn { width: 100%; }
}

/* ── Cortes: per-bucket measurement view (Phase 6b) ──────────────────────── */

.v2-cortes-measure {
  padding: 24px 40px 48px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.v2-cortes-measure__head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid #000;
  margin-bottom: 4px;
}
.v2-cortes-measure__back {
  appearance: none;
  background: #fff;
  border: 1px solid #000;
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
}
@media (hover: hover) {
  .v2-cortes-measure__back:hover { background: #000; color: #fff; }
}

.v2-cortes-measure__title-wrap {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.v2-cortes-measure__title {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}
.v2-cortes-measure__when {
  font-size: 11px;
  color: #666;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}

/* Composer — sticky at the top of the scrollable list area so the user
   can keep entering lines without scrolling back up after each save. */
.v2-cortes-measure__composer {
  position: sticky;
  top: 0;
  z-index: 4;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid #000;
}

.v2-cortes-measure__composer-row {
  display: grid;
  grid-template-columns: 1fr 110px;
  gap: 10px;
}
.v2-cortes-measure__composer-row > .v2-capture__sku-wrap,
.v2-cortes-measure__composer-row > input {
  width: 100%;
  min-width: 0;
}
.v2-cortes-measure__composer-row input {
  padding: 11px 12px;
  font-size: 14px;
  border: 1px solid #000;
  background: #fff;
  border-radius: 0;
}

.v2-cortes-measure__notes {
  width: 100%;
  padding: 10px 12px;
  font-size: 13px;
  border: 1px solid #000;
  background: #fff;
  border-radius: 0;
}

.v2-cortes-measure__submit {
  align-self: stretch;
}

.v2-cortes-measure__error {
  padding: 8px 10px;
  border: 1px solid #d00000;
  background: #ffeeee;
  color: #d00000;
  font-size: 12px;
  letter-spacing: 0.02em;
}

/* Subtotal strip — between composer and lines list. */
.v2-cortes-measure__totals {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 10px 14px;
  background: #f0f0f0;
  border: 1px solid #000;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.v2-cortes-measure__totals-kg {
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}

.v2-cortes-measure__empty {
  margin: 0;
  padding: 28px 16px;
  text-align: center;
  color: #666;
  font-size: 12px;
  border: 1px dashed #cccccc;
  letter-spacing: 0.02em;
}

/* Lines list — card-per-line, sku/name on top + meta + kg on the right. */
.v2-cortes-measure__lines {
  display: flex;
  flex-direction: column;
  border: 1px solid #000;
  background: #fff;
}

.v2-cortes-measure__line {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid #cccccc;
  align-items: center;
}
.v2-cortes-measure__line:last-child { border-bottom: 0; }
.v2-cortes-measure__line.is-pending { opacity: 0.55; }

.v2-cortes-measure__line-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.v2-cortes-measure__line-sku {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}
.v2-cortes-measure__line-code {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 16px;
  font-variant-numeric: tabular-nums;
}
.v2-cortes-measure__line-name {
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-cortes-measure__line-meta {
  display: flex;
  gap: 10px;
  font-size: 11px;
  color: #666;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.v2-cortes-measure__line-when {
  font-variant-numeric: tabular-nums;
  color: #999;
}
.v2-cortes-measure__line-notes {
  margin-top: 4px;
  font-size: 12px;
  color: #555;
  font-style: italic;
}

.v2-cortes-measure__line-side {
  display: flex;
  align-items: center;
  gap: 8px;
}
.v2-cortes-measure__line-kg {
  font-size: 16px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v2-cortes-measure__line-remove {
  appearance: none;
  background: #fff;
  border: 1px solid #cccccc;
  width: 32px;
  height: 32px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  color: #999;
  cursor: pointer;
}
@media (hover: hover) {
  .v2-cortes-measure__line-remove:hover {
    background: #d00000;
    color: #fff;
    border-color: #d00000;
  }
}

.v2-cortes-measure__close-section {
  margin-top: 12px;
  padding-top: 16px;
  border-top: 1px solid #cccccc;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: stretch;
}
.v2-cortes-measure__close-hint {
  margin: 0;
  font-size: 12px;
  color: #666;
  letter-spacing: 0.02em;
}

@media (max-width: 640px) {
  .v2-cortes-measure { padding: 16px 14px 32px; }
  .v2-cortes-measure__head { gap: 10px; }
  .v2-cortes-measure__title { font-size: 18px; }
  .v2-cortes-measure__composer { padding: 12px; }
  .v2-cortes-measure__composer-row {
    grid-template-columns: 1fr 96px;
  }
  .v2-cortes-measure__line { padding: 12px; gap: 8px; }
  .v2-cortes-measure__line-name { font-size: 12px; }
  .v2-cortes-measure__line-kg { font-size: 15px; }
}

/* ── Cortes: review + apply variance (Phase 6c) ──────────────────────────── */

.v2-cortes-review {
  padding: 24px 40px 96px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.v2-cortes-review__body {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.v2-cortes-review__section {
  display: flex;
  flex-direction: column;
  border: 1px solid #000;
  background: #fff;
}
.v2-cortes-review__section-title {
  padding: 8px 14px;
  background: #000;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.v2-cortes-review__row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px;
  border-bottom: 1px solid #cccccc;
}
.v2-cortes-review__row:last-child { border-bottom: 0; }
.v2-cortes-review__row.is-actionable { background: #fafafa; }

.v2-cortes-review__row-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.v2-cortes-review__row-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.v2-cortes-review__row-bucket {
  font-size: 14px;
  font-weight: 700;
  color: #000;
}
.v2-cortes-review__row-skus {
  font-size: 10px;
  color: #666;
  font-family: var(--font-mono);
  letter-spacing: 0.04em;
}

.v2-cortes-review__toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
  flex-shrink: 0;
}
.v2-cortes-review__toggle input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 0;
}

.v2-cortes-review__row-status {
  font-size: 10px;
  color: #999;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  flex-shrink: 0;
  padding-top: 2px;
}

.v2-cortes-review__metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.v2-cortes-review__metric {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid #cccccc;
}
.v2-cortes-review__metric-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #666;
}
.v2-cortes-review__metric-value {
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.v2-cortes-review__metric.is-pos .v2-cortes-review__metric-value { color: #006600; }
.v2-cortes-review__metric.is-neg .v2-cortes-review__metric-value { color: #d00000; }

/* Transparency note shown beneath the metric grid when in-window
   movements (during the count) affected this bucket's diff. Helps
   the manager reconcile "Físico − Sistema" vs the displayed
   Diferencia, which includes the in-window adjustment. */
.v2-cortes-review__inwindow {
  margin-top: 6px;
  padding: 6px 10px;
  border-left: 2px solid #999;
  background: #fafafa;
  font-size: 11px;
  color: #555;
  font-style: italic;
  letter-spacing: 0.02em;
}

.v2-cortes-review__footer {
  position: sticky;
  bottom: 0;
  z-index: 5;
  margin: 8px -40px -96px;
  padding: 14px 40px calc(14px + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #000;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.v2-cortes-review__footer-summary {
  margin: 0;
  font-size: 12px;
  color: #666;
  letter-spacing: 0.02em;
}

@media (max-width: 640px) {
  .v2-cortes-review { padding: 16px 14px 96px; }
  .v2-cortes-review__metrics {
    grid-template-columns: repeat(2, 1fr);
  }
  .v2-cortes-review__row { padding: 12px 14px; }
  .v2-cortes-review__row-bucket { font-size: 13px; }
  .v2-cortes-review__footer {
    margin: 8px -14px -96px;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  }
}

/* ======================================================================== */
/* SKUs / Precios tab                                                         */
/* ======================================================================== */

.v2-skus {
  padding: 24px 40px 48px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.v2-skus__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 14px;
  padding: 12px 14px;
  border: 1px solid #000;
  background: #fafafa;
}

.v2-skus__search {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 240px;
  min-width: 0;
}
.v2-skus__search-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
}
.v2-skus__search input {
  padding: 10px 12px;
  font-size: 14px;
  border: 1px solid #000;
  background: #fff;
  border-radius: 0;
}

.v2-skus__toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
}
.v2-skus__toggle input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
}

.v2-skus__banner {
  padding: 10px 12px;
  border: 1px solid #000;
  font-size: 12px;
  letter-spacing: 0.02em;
}
.v2-skus__banner--error {
  border-color: #d00000;
  background: #ffeeee;
  color: #d00000;
}

.v2-skus__empty {
  margin: 0;
  padding: 24px 16px;
  border: 1px dashed #cccccc;
  text-align: center;
  color: #666;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.v2-skus__list {
  display: flex;
  flex-direction: column;
  border: 1px solid #000;
  background: #fff;
}

.v2-skus__row {
  border-bottom: 1px solid #cccccc;
}
.v2-skus__row:last-child { border-bottom: 0; }
.v2-skus__row.is-expanded { background: #f7f7f7; }
.v2-skus__row.is-inactive .v2-skus__row-head { opacity: 0.55; }

.v2-skus__row-head {
  appearance: none;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  width: 100%;
  padding: 12px 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  align-items: center;
}
@media (hover: hover) {
  .v2-skus__row-head:hover { background: #fafafa; }
}

.v2-skus__row-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.v2-skus__row-sku {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}
.v2-skus__row-code {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
.v2-skus__row-name {
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-skus__row-meta {
  font-size: 11px;
  color: #666;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.v2-skus__row-price {
  flex-shrink: 0;
  text-align: right;
}
.v2-skus__price {
  font-size: 15px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v2-skus__price--empty {
  color: #999;
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.v2-skus__price-suffix {
  margin-left: 4px;
  font-size: 11px;
  font-weight: 500;
  color: #666;
}

.v2-skus__edit {
  padding: 14px;
  border-top: 1px solid #cccccc;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.v2-skus__edit-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #000;
}
.v2-skus__edit-label input {
  padding: 11px 12px;
  font-size: 14px;
  border: 1px solid #000;
  background: #fff;
  border-radius: 0;
  width: 100%;
}
.v2-skus__edit-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

@media (max-width: 640px) {
  .v2-skus { padding: 16px 14px 32px; }
  .v2-skus__controls { padding: 12px; }
  .v2-skus__row-head { padding: 12px; }
  .v2-skus__row-name { font-size: 12px; }
  .v2-skus__edit { padding: 12px; }
  .v2-skus__edit-actions { flex-direction: column-reverse; }
  .v2-skus__edit-actions > .sale-btn { width: 100%; }
}

/* ======================================================================== */
/* REPORTES — Phase 7                                                         */
/* ======================================================================== */

.v2-reportes {
  padding: 24px 40px 48px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Range picker — chips row + optional date inputs for custom range. */
.v2-reportes__picker {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid #000;
  background: #fafafa;
}
.v2-reportes__chips {
  display: flex;
  flex-wrap: wrap;
  /* Dividers come from the CONTAINER, not the chips: a black background
     showing through 1px gaps draws a line between every neighbour in both
     directions, so wrapping onto a second row (narrow windows) still gets a
     horizontal rule. The old per-chip border-right only separated columns —
     rows had no line between them (operator report 2026-08-22). */
  gap: 1px;
  background: #000;
  border: 1px solid #000;
}
.v2-reportes__chip {
  appearance: none;
  background: #fff;
  color: #000;
  border: 0;
  padding: 10px 14px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  flex: 1;
}
.v2-reportes__chip.is-active { background: #000; color: #fff; }
@media (hover: hover) {
  .v2-reportes__chip:hover:not(.is-active) { background: #f0f0f0; }
}

.v2-reportes__custom {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.v2-reportes__custom-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 140px;
  min-width: 0;
}
.v2-reportes__custom-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
}
.v2-reportes__custom-field input {
  padding: 10px 12px;
  font-size: 14px;
  border: 1px solid #000;
  background: #fff;
}

/* Per-section card. */
.v2-reportes__card {
  border: 1px solid #000;
  background: #fff;
  padding: 16px 18px 18px;
}
.v2-reportes__card-title {
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding-bottom: 10px;
  border-bottom: 1px solid #000;
}
.v2-reportes__card--error {
  border-color: #d00000;
  background: #fff;
}

/* Top metric strip — 4 cells (count / in / out / net). */
.v2-reportes__metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-bottom: 16px;
}
.v2-reportes__metric {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #cccccc;
  background: #fff;
}
.v2-reportes__metric-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
}
.v2-reportes__metric-value {
  font-size: 16px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.v2-reportes__metric.is-pos .v2-reportes__metric-value { color: #006600; }
.v2-reportes__metric.is-neg .v2-reportes__metric-value { color: #d00000; }

/* Per movement-type breakdown rows. Each row is a clickable button
   that expands to show per-bucket detail below it. */
.v2-reportes__movetype-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.v2-reportes__movetype-row {
  display: flex;
  flex-direction: column;
  border: 1px solid #cccccc;
  background: #fafafa;
}
.v2-reportes__movetype-row.is-expanded { background: #fff; }

.v2-reportes__movetype-trigger {
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: 0;
  width: 100%;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  position: relative;
}
.v2-reportes__movetype-trigger:disabled {
  cursor: default;
  opacity: 0.6;
}
@media (hover: hover) {
  .v2-reportes__movetype-trigger:not(:disabled):hover { background: rgba(0, 0, 0, 0.03); }
}

.v2-reportes__movetype-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.v2-reportes__movetype-label {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.v2-reportes__movetype-count {
  font-size: 10px;
  color: #666;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__movetype-numbers {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: #555;
}
.v2-reportes__movetype-numbers > span.is-pos { color: #006600; font-weight: 700; }
.v2-reportes__movetype-numbers > span.is-neg { color: #d00000; font-weight: 700; }
.v2-reportes__movetype-chevron {
  position: absolute;
  right: 12px;
  top: 10px;
  font-size: 13px;
  color: #999;
}

/* Drill-down panel — per (product, quality) bucket. */
.v2-reportes__breakdown {
  padding: 12px 14px 14px;
  border-top: 1px solid #cccccc;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.v2-reportes__breakdown-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #cccccc;
  background: #fafafa;
  align-items: center;
}
.v2-reportes__breakdown-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.v2-reportes__breakdown-sku {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__breakdown-meta {
  font-size: 11px;
  color: #666;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-reportes__breakdown-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.v2-reportes__breakdown-net {
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__breakdown-net.is-pos { color: #006600; }
.v2-reportes__breakdown-net.is-neg { color: #d00000; }
.v2-reportes__breakdown-count {
  font-size: 10px;
  color: #999;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__breakdown-empty {
  margin: 4px 0 0;
  color: #666;
  font-size: 12px;
  text-align: center;
}
.v2-reportes__breakdown-error {
  margin: 0 0 6px;
  padding: 8px 10px;
  border: 1px solid #d00000;
  background: #ffeeee;
  color: #d00000;
  font-size: 12px;
}

/* Drill-down level 2 — the bucket row becomes a clickable trigger with
   an inline panel listing the individual movements behind its total. */
.v2-reportes__breakdown-item {
  display: flex;
  flex-direction: column;
  border: 1px solid #cccccc;
  background: #fafafa;
}
.v2-reportes__breakdown-item.is-expanded { background: #fff; }
.v2-reportes__breakdown-trigger {
  appearance: none;
  border: 0;
  background: transparent;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.v2-reportes__breakdown-trigger:disabled { cursor: default; opacity: 0.6; }
@media (hover: hover) {
  .v2-reportes__breakdown-trigger:not(:disabled):hover { background: rgba(0, 0, 0, 0.03); }
}
.v2-reportes__breakdown-chevron { font-size: 12px; color: #999; }

.v2-reportes__detail {
  border-top: 1px solid #cccccc;
  background: #fff;
  padding: 4px 12px 10px;
  display: flex;
  flex-direction: column;
}
.v2-reportes__detail-row {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 7px 2px;
  border-top: 1px dashed #e2e2e2;
  font-size: 12px;
}
.v2-reportes__detail-row:first-child { border-top: 0; }
.v2-reportes__detail-top {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.v2-reportes__detail-date {
  color: #555;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.v2-reportes__detail-amounts {
  display: flex;
  gap: 8px;
  align-items: baseline;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__detail-kg { font-weight: 700; }
.v2-reportes__detail-kg.is-pos { color: #006600; }
.v2-reportes__detail-kg.is-neg { color: #d00000; }
.v2-reportes__detail-boxes { color: #999; font-size: 11px; }
.v2-reportes__detail-balance {
  margin-left: auto;
  color: #111;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.v2-reportes__detail-meta {
  color: #777;
  font-size: 11px;
  letter-spacing: 0.01em;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Reverted (cancelled) entradas — surfaced in Reportes so a manual stock
   reconciliation doesn't over-count cancelled in-flow. */
.v2-reportes__reverted-note {
  color: #b25a00;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}
.v2-reportes__reverted-note--row {
  display: block;
  padding: 4px 10px 0;
}
.v2-reportes__detail-row.is-reverted { opacity: 0.72; }
.v2-reportes__detail-kg.is-reverted {
  text-decoration: line-through;
  text-decoration-thickness: 1.5px;
  color: #b25a00 !important;
}
.v2-reportes__detail-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
.v2-reportes__detail-badge--reverted { background: #b25a00; color: #fff; }
.v2-reportes__detail-badge--reversal { background: #f0f0f0; color: #666; border: 1px solid #bbb; }
.v2-reportes__detail-footer {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid #e2e2e2;
  font-size: 11px;
  font-weight: 600;
  color: #b25a00;
}

/* ===========================================================================
   Hipotético — what-if scenario table
   =========================================================================== */
.v2-hipo { display: flex; flex-direction: column; gap: 12px; }
.v2-hipo__controls { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.v2-hipo__control { display: flex; flex-direction: column; gap: 4px; font-size: 12px; }
.v2-hipo__control > span { color: #555; font-weight: 600; }
.v2-hipo__control select { min-width: 150px; }
.v2-hipo__table { border: 1px solid #cccccc; overflow-x: auto; }
.v2-hipo__thead, .v2-hipo__row, .v2-hipo__tfoot {
  display: grid;
  grid-template-columns: minmax(170px, 2.2fr) repeat(8, minmax(66px, 1fr));
  align-items: center;
  min-width: 820px;
}
.v2-hipo__thead {
  background: #111; color: #fff;
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em;
}
.v2-hipo__th { padding: 8px; }
.v2-hipo__th.v2-hipo__num { text-align: right; }
.v2-hipo__row { border-top: 1px solid #e2e2e2; }
.v2-hipo__row:nth-child(even) { background: #fafafa; }
.v2-hipo__cell { padding: 7px 8px; font-size: 12px; min-width: 0; }
.v2-hipo__num { text-align: right; font-variant-numeric: tabular-nums; }
.v2-hipo__main { display: flex; flex-direction: column; gap: 1px; }
.v2-hipo__sku { font-family: var(--font-mono); font-weight: 700; font-size: 12px; }
.v2-hipo__meta {
  color: #666; font-size: 11px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.v2-hipo__input {
  width: 100%; max-width: 86px; box-sizing: border-box;
  text-align: right; padding: 4px 6px;
  border: 1px solid #cccccc; background: #fff; font: inherit; font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.v2-hipo__input:focus { outline: 2px solid #333; outline-offset: -1px; }
.v2-hipo__hipo { font-weight: 700; }
.v2-hipo__value { font-weight: 700; }
.v2-hipo__value.is-margin { color: #006600; }
.v2-hipo__num.is-neg, .v2-hipo__value.is-neg { color: #d00000; }
.v2-hipo__tfoot { border-top: 2px solid #111; background: #fff; font-weight: 700; }
.v2-hipo__tfoot .v2-hipo__cell { font-size: 13px; }
.v2-hipo__note { color: #777; font-size: 11px; line-height: 1.4; margin: 0; }

/* Cash flow card (Phase 7b). Three labeled sections (Ventas /
   Cobranza / Egresos) each with rows + a section total. The top
   strip uses the shared .v2-reportes__metrics grid. */
.v2-reportes__cf-section {
  margin-top: 12px;
  border: 1px solid #cccccc;
  background: #fafafa;
}
.v2-reportes__cf-section-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 8px 12px;
  background: #f0f0f0;
  border-bottom: 1px solid #cccccc;
}
.v2-reportes__cf-section-title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #000;
}
.v2-reportes__cf-section-count {
  font-size: 10px;
  color: #666;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__cf-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 7px 12px;
  border-bottom: 1px solid #eee;
  font-size: 13px;
}
.v2-reportes__cf-row:last-of-type { border-bottom: 0; }
.v2-reportes__cf-label { color: #333; }
.v2-reportes__cf-value {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__cf-value.is-pos { color: #006600; }
.v2-reportes__cf-value.is-neg { color: #d00000; }
.v2-reportes__cf-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 10px 12px;
  border-top: 1px solid #000;
  background: #fff;
}
.v2-reportes__cf-total-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.v2-reportes__cf-total-value {
  font-size: 15px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__cf-total-value.is-pos { color: #006600; }
.v2-reportes__cf-total-value.is-neg { color: #d00000; }

/* Top SKUs card (Phase 7c). Rank chip + bucket meta on the left,
   absolute kg + signed breakdown on the right. */
.v2-reportes__topsku-hint {
  margin: 0 0 10px;
  font-size: 11px;
  color: #666;
  letter-spacing: 0.02em;
}
.v2-reportes__topsku-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.v2-reportes__topsku-row {
  display: grid;
  grid-template-columns: 32px 1fr auto;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #cccccc;
  background: #fafafa;
  align-items: center;
}
.v2-reportes__topsku-rank {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 13px;
  color: #666;
  text-align: center;
}
.v2-reportes__topsku-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.v2-reportes__topsku-sku {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__topsku-meta {
  font-size: 11px;
  color: #666;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-reportes__topsku-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.v2-reportes__topsku-abs {
  font-size: 15px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__topsku-detail {
  display: flex;
  gap: 8px;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  color: #666;
}
.v2-reportes__topsku-detail .is-pos { color: #006600; font-weight: 700; }
.v2-reportes__topsku-detail .is-neg { color: #d00000; font-weight: 700; }
.v2-reportes__topsku-actions {
  margin-top: 10px;
  display: flex;
  justify-content: center;
}

/* Cortes variance card (Phase 7d). Summary metric strip + one row
   per corte. Tap a row with adjustments to see per-bucket detail. */
.v2-reportes__cortes-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.v2-reportes__cortes-row {
  border: 1px solid #cccccc;
  background: #fafafa;
}
.v2-reportes__cortes-row.is-expanded { background: #fff; }
.v2-reportes__cortes-trigger {
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: 0;
  width: 100%;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.v2-reportes__cortes-trigger:disabled { cursor: default; opacity: 0.7; }
@media (hover: hover) {
  .v2-reportes__cortes-trigger:not(:disabled):hover { background: rgba(0, 0, 0, 0.03); }
}
.v2-reportes__cortes-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.v2-reportes__cortes-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
}
.v2-reportes__cortes-when {
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.v2-reportes__cortes-shortid {
  font-family: var(--font-mono);
  font-size: 10px;
  color: #666;
  letter-spacing: 0.04em;
}
.v2-reportes__cortes-meta {
  font-size: 11px;
  color: #666;
  letter-spacing: 0.02em;
}
.v2-reportes__cortes-chevron {
  font-size: 13px;
  color: #999;
  flex-shrink: 0;
}
.v2-reportes__cortes-detail {
  padding: 8px 12px 12px;
  border-top: 1px solid #cccccc;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.v2-reportes__cortes-cutoffnotes {
  padding: 6px 10px;
  background: #f0f0f0;
  border-left: 3px solid #000;
  font-size: 11px;
  line-height: 1.4;
}
.v2-reportes__cortes-cutoffnotes-label {
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 9px;
  color: #666;
}
.v2-reportes__cortes-bucket {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid #f0f0f0;
  background: #fff;
  align-items: center;
}
.v2-reportes__cortes-bucket-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.v2-reportes__cortes-bucket-sku {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__cortes-bucket-meta {
  font-size: 11px;
  color: #666;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-reportes__cortes-bucket-variance {
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v2-reportes__cortes-bucket-variance.is-pos { color: #006600; }
.v2-reportes__cortes-bucket-variance.is-neg { color: #d00000; }

.v2-reportes__waiting {
  margin: 0;
  padding: 20px 16px;
  text-align: center;
  color: #666;
  font-size: 13px;
  border: 1px dashed #cccccc;
  background: #fafafa;
}

/* Placeholders for the yet-to-build phase 7b/7c/7d cards. */
.v2-reportes__placeholder {
  padding: 12px 14px;
  border: 1px dashed #cccccc;
  background: #fafafa;
  color: #666;
  font-size: 12px;
}
.v2-reportes__placeholder-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #000;
  margin-bottom: 4px;
}
.v2-reportes__placeholder p { margin: 0; line-height: 1.4; }

@media (max-width: 640px) {
  .v2-reportes { padding: 16px 14px 32px; }
  .v2-reportes__metrics { grid-template-columns: repeat(2, 1fr); }
  .v2-reportes__chip {
    flex: 1 1 33%;
    padding: 12px 8px;
    font-size: 10px;
    letter-spacing: 0.06em;
  }
}

/* ======================================================================== */
/* AJUSTES / CATÁLOGO                                                         */
/* ======================================================================== */

.v2-ajustes {
  padding: 24px 40px 48px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Segmented control — Productos / Calidades / SKUs. */
.v2-ajustes__sections {
  display: flex;
  border: 1px solid #000;
}
.v2-ajustes__section-pill {
  appearance: none;
  flex: 1;
  background: #fff;
  color: #000;
  border: 0;
  border-right: 1px solid #000;
  padding: 12px 14px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
}
.v2-ajustes__section-pill:last-child { border-right: 0; }
.v2-ajustes__section-pill.is-active { background: #000; color: #fff; }
@media (hover: hover) {
  .v2-ajustes__section-pill:hover:not(.is-active) { background: #f0f0f0; }
}

.v2-ajustes__banner {
  padding: 10px 12px;
  border: 1px solid #000;
  font-size: 12px;
  letter-spacing: 0.02em;
}
.v2-ajustes__banner--ok { background: #f0f0f0; }
.v2-ajustes__banner--error { border-color: #d00000; background: #ffeeee; color: #d00000; }

.v2-ajustes__body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.v2-ajustes__newbar { display: flex; }

/* Create / edit forms. */
.v2-ajustes__form {
  border: 1px solid #000;
  background: #fafafa;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.v2-ajustes__form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.v2-ajustes__field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.v2-ajustes__field-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #000;
}
.v2-ajustes__field input,
.v2-ajustes__field select {
  padding: 11px 12px;
  font-size: 14px;
  border: 1px solid #000;
  background: #fff;
  border-radius: 0;
  width: 100%;
  min-width: 0;
}
.v2-ajustes__active {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
}
.v2-ajustes__active input[type="checkbox"] { width: 18px; height: 18px; margin: 0; }
.v2-ajustes__form-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.v2-ajustes__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 14px;
}
.v2-ajustes__search {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 220px;
  min-width: 0;
}
.v2-ajustes__search-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #666;
}
.v2-ajustes__search input {
  padding: 10px 12px;
  font-size: 14px;
  border: 1px solid #000;
  background: #fff;
}
.v2-ajustes__toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
}
.v2-ajustes__toggle input[type="checkbox"] { width: 16px; height: 16px; margin: 0; }

.v2-ajustes__empty {
  margin: 0;
  padding: 24px 16px;
  border: 1px dashed #cccccc;
  text-align: center;
  color: #666;
  font-size: 12px;
}

/* List of catalog rows. */
.v2-ajustes__list {
  display: flex;
  flex-direction: column;
  border: 1px solid #000;
  background: #fff;
}
.v2-ajustes__row {
  border-bottom: 1px solid #cccccc;
}
.v2-ajustes__row:last-child { border-bottom: 0; }
.v2-ajustes__row.is-editing { background: #f7f7f7; }
.v2-ajustes__row.is-inactive .v2-ajustes__row-head { opacity: 0.55; }

.v2-ajustes__row-head {
  appearance: none;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 12px 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
@media (hover: hover) {
  .v2-ajustes__row-head:hover { background: #fafafa; }
}
.v2-ajustes__row-main { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.v2-ajustes__row-sku { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.v2-ajustes__row-code {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
.v2-ajustes__row-name {
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-ajustes__row-sub {
  font-size: 11px;
  color: #666;
  letter-spacing: 0.02em;
  margin-left: auto;
  white-space: nowrap;
}
.v2-ajustes__row-main .v2-ajustes__row-sub { margin-left: 0; }
.v2-ajustes__badge {
  display: inline-block;
  padding: 3px 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border: 1px solid #999;
  color: #666;
  flex-shrink: 0;
}

.v2-ajustes__edit {
  padding: 14px;
  border-top: 1px solid #cccccc;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.v2-ajustes__readonly {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.v2-ajustes__readonly-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #666;
}
.v2-ajustes__readonly-value {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}

/* Empleados / Accesos / Reglas (v1 CFG port, Aug 2026). */

/* The segmented control now carries six sections — let it wrap on narrow
   screens instead of squeezing every pill into an unreadable sliver. */
.v2-ajustes__sections { flex-wrap: wrap; }
.v2-ajustes__section-pill { flex: 1 0 33.333%; }
/* Six pills wrap into two rows of three: kill the right border at the end of
   each row and rule a line between the rows, so the block stays a clean grid. */
.v2-ajustes__section-pill:nth-child(3n) { border-right: 0; }
.v2-ajustes__section-pill:nth-child(-n + 3) { border-bottom: 1px solid #000; }

.v2-ajustes__note {
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  color: #666;
}

.v2-ajustes__subhead {
  margin: 10px 0 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* "Crear cuenta nueva" / "Ligar cuenta existente" switch. */
.v2-ajustes__modes { display: flex; border: 1px solid #000; }
.v2-ajustes__mode-pill {
  appearance: none;
  flex: 1;
  background: #fff;
  color: #000;
  border: 0;
  border-right: 1px solid #000;
  padding: 9px 12px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
}
.v2-ajustes__mode-pill:last-child { border-right: 0; }
.v2-ajustes__mode-pill.is-active { background: #000; color: #fff; }

.v2-ajustes__flags {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.v2-ajustes__active.is-disabled { opacity: 0.4; cursor: default; }

/* Password-reset block inside an access edit panel. */
.v2-ajustes__subform {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  border: 1px dashed #999;
  background: #fafafa;
}

.v2-ajustes__danger {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding-top: 4px;
  border-top: 1px solid #eee;
}

.v2-ajustes__badge--ok { border-color: #000; color: #000; }

.v2-ajustes__readonly-value--sm {
  font-size: 11px;
  font-weight: 400;
  word-break: break-all;
}

/* Access rows carry a long subtitle (correo · empleado · límite) plus up to
   three badges. Let the head wrap instead of running the subtitle under the
   badges — on a phone the badges drop to their own line. */
.v2-ajustes__row--access .v2-ajustes__row-head {
  flex-wrap: wrap;
  align-items: flex-start;
}
.v2-ajustes__row--access .v2-ajustes__row-main { flex: 1 1 60%; }
.v2-ajustes__row--access .v2-ajustes__row-name { white-space: normal; }
.v2-ajustes__row--access .v2-ajustes__row-sub {
  white-space: normal;
  overflow-wrap: anywhere;
}
.v2-ajustes__row--access .v2-ajustes__badge { align-self: center; }

/* Rule rows have no edit panel — title on the left, actions on the right. */
.v2-ajustes__row--rule {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
}
.v2-ajustes__row--rule .v2-ajustes__row-name { white-space: normal; }
.v2-ajustes__row--rule .v2-ajustes__row-sub { margin-left: 0; white-space: normal; }
.v2-ajustes__rule-actions { display: flex; gap: 8px; flex-shrink: 0; }

@media (max-width: 640px) {
  .v2-ajustes { padding: 16px 14px 32px; }
  .v2-ajustes__section-pill { padding: 12px 8px; font-size: 10px; letter-spacing: 0.06em; }
  .v2-ajustes__form-actions { flex-direction: column-reverse; }
  .v2-ajustes__form-actions > .sale-btn { width: 100%; }
  .v2-ajustes__row--rule { flex-direction: column; align-items: stretch; }
  .v2-ajustes__rule-actions > .sale-btn { flex: 1; }
  .v2-ajustes__danger { flex-direction: column-reverse; }
  .v2-ajustes__danger > .sale-btn { width: 100%; }
}

/* ======================================================================== */
/* MOBILE INPUT HYGIENE  (must stay at end-of-file)                          */
/* ======================================================================== */
/*
 * iOS WebKit (Safari + Chrome iOS) auto-zooms the page on focus when an
 * interactive input has font-size < 16px, and there is no JS API to zoom
 * back out on blur. Forcing every interactive input to 16px on mobile is
 * the canonical fix.
 *
 * IMPORTANT: this block lives at the bottom of the stylesheet on purpose.
 * Earlier versions (mobile-2-inputs) put the rule near the topbar mobile
 * styles (~line 350), where the per-component rules later in the file
 * (.v2-login input @ line 379, .v2-capture__line input @ ~line 3260,
 * .v2-movements__filter input/select @ ~line 3360) silently overrode it
 * because CSS cascade resolves "same specificity → later wins" regardless
 * of media-query nesting. Keeping this block last keeps it winning.
 *
 * Padding is bumped at the same time so each tap target lands ≥ 44pt tall
 * (iOS HIG / Android Material Design minimum).
 */
@media (max-width: 720px) {
  .v2-login input,
  .v2-capture__field input,
  .v2-capture__field select,
  .v2-capture__field textarea,
  .v2-capture__line input,
  .v2-movements__filter input,
  .v2-movements__filter select,
  .v2-cortes__field input,
  .v2-cortes__field textarea,
  .v2-cortes-measure__composer-row input,
  .v2-cortes-measure__notes,
  .v2-inventory__snapshot-field input,
  .v2-skus__search input,
  .v2-skus__edit-label input,
  .v2-reportes__custom-field input,
  .v2-ajustes__field input,
  .v2-ajustes__field select,
  .v2-ajustes__search input {
    font-size: 16px;
    padding: 14px 12px;
  }
  .v2-capture__field textarea { min-height: 80px; }
  /* iOS WebKit gives <input type="date"> an intrinsic min-content equal
     to "mm/dd/yyyy" + the picker chevron, which overrides width: 100%
     and overflows the filter bar's border. min-width: 0 forces the input
     to honor its parent's flex-basis instead of its own min-content. */
  .v2-movements__filter input,
  .v2-movements__filter select {
    min-width: 0;
    max-width: 100%;
  }
  /* min-width: 0 alone wasn't enough to shrink iOS native date inputs —
     they have an internal layout (chevron + spacer + text) that resists
     the parent's flex-basis. appearance: none strips the native chrome
     so the input shrinks like any other text input. iOS still opens the
     OS date picker on tap because it triggers off `type="date"`, not the
     visual styling. We lose the chevron icon, but the "Desde" / "Hasta"
     filter label tells the user what the field is. */
  .v2-movements__filter input[type="date"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    box-sizing: border-box;
  }
  /* Same overflow problem applies anywhere a native date / datetime
     picker shows up. Generalized to catch every type="date" and
     type="datetime-local" across the app so a future feature with a
     date input doesn't have to rediscover this. iOS still opens the
     OS picker on tap because the picker UI is gated off `type`, not
     visual styling. */
  input[type="date"],
  input[type="datetime-local"],
  input[type="time"],
  input[type="month"] {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
  }
}

/* ======================================================================== */
/* SKU PICKER  (mobile-first searchable combobox)                            */
/* ======================================================================== */
/*
 * Each SKU input on the capture screen is wrapped by withSkuPicker() in
 * render/capture.js, which produces:
 *
 *   <div class="v2-capture__sku-wrap">
 *     <input data-field="sku_code" />
 *     <button data-sku-picker-trigger>Selecciona SKU</button>
 *   </div>
 *
 * Desktop (≥ 721px): input is shown, trigger button is hidden — the
 * keyboard-typing flow stays exactly as it was before this commit.
 * Mobile (≤ 720px): input is hidden, trigger button is shown. Tapping
 * the trigger opens the SKU picker sheet (render/sku-picker.js).
 *
 * The wrapper carries the right-border separator that previously lived
 * on .v2-capture__line input, so neighboring cells in the line grid
 * keep their visual divider whether the input or the button is showing.
 */

.v2-capture__sku-wrap {
  position: relative;
  display: block;
  width: 100%;
  /* The wrapper claims the cell's right separator (the grey divider
     between the SKU column and the weight column) so it shows regardless
     of which child — the input or the trigger button — is visible.
     The wrapped input has border-right: 0 to avoid a double line. */
  border-right: 1px solid #cccccc;
  background: #fff;
  /* Grid items default to min-width: auto, which lets the trigger
     button's text content (which has white-space: nowrap and can be
     long after a SKU is picked, e.g. "103 — Manzana Primera") force
     the 1fr column to expand past its share. That eats into the
     weight + boxes columns and pushes them off-screen. min-width: 0
     tells CSS Grid to ignore the content's intrinsic min-content
     and respect the 1fr 1fr 1fr distribution; the button's
     text-overflow: ellipsis then clips the label visually within
     the budget. */
  min-width: 0;
}
/* No `:last-of-type { border-right: 0 }` rule here. Earlier I copied that
   pattern from `.v2-capture__line input:last-of-type` thinking it was
   analogous, but `:last-of-type` matches the last sibling of the same tag
   — and the wrapper is the only <div> child of `.v2-capture__line`, so
   the selector always matched and the right separator was silently being
   removed. The wrapper is never the rightmost cell anyway (the remove
   button is), so we always want the border-right to show. */

.v2-capture__sku-wrap > input {
  border-right: 0;       /* the wrapper has it */
}

.v2-capture__sku-trigger {
  display: none;            /* desktop default — input is the visible affordance */
  width: 100%;
  border: 0;
  background: #fff;
  text-align: left;
  padding: 14px 12px;
  font: inherit;
  font-size: 16px;
  color: #999;              /* placeholder-style until a value is picked */
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-capture__sku-trigger[data-has-value="1"] {
  color: #000;
  font-weight: 700;
}

@media (max-width: 720px) {
  .v2-capture__sku-wrap > input { display: none; }
  .v2-capture__sku-trigger { display: block; }

  /* Inline clear × on the SKU trigger. Hidden by default (no SKU picked)
     and revealed via the general-sibling combinator only when the trigger
     carries data-has-value="1". Sits absolutely at the right edge of the
     wrapper, padded with a thin grey divider so it reads as its own tap
     target distinct from the trigger area. */
  .v2-capture__sku-clear {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 36px;
    border: 0;
    border-left: 1px solid #f0f0f0;
    background: #fff;
    color: #999;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
    align-items: center;
    justify-content: center;
  }
  .v2-capture__sku-trigger[data-has-value="1"] ~ .v2-capture__sku-clear {
    display: flex;
  }
  /* Reserve room on the trigger so its label doesn't sit under the
     clear ×. Only added when has-value, so empty-state stays full-bleed. */
  .v2-capture__sku-trigger[data-has-value="1"] {
    padding-right: 44px;
  }
}

/* ── The picker sheet itself ──────────────────────────────────────────── */

.v2-sku-picker {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  flex-direction: column;
}
.v2-sku-picker[hidden] { display: none; }

/* When the picker is open, lock body scroll so background content doesn't
   bleed-scroll under the sheet on iOS. */
.v2-sku-picker-open { overflow: hidden; }
.v2-sku-picker-open body { overflow: hidden; }

.v2-sku-picker__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  border: 0;
  cursor: pointer;
}

.v2-sku-picker__sheet {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  background: #fff;
  width: 100%;
  height: 100%;
  /* iOS safe-area: head/footer of the sheet need to clear notches. */
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

/* Desktop: shrink the sheet into a centered modal so it doesn't fill the
   whole desktop viewport. Tablet+ breakpoint mirrors the topbar break. */
@media (min-width: 721px) {
  .v2-sku-picker__sheet {
    margin: 60px auto;
    max-width: 540px;
    max-height: calc(100vh - 120px);
    height: auto;
    border: 1px solid #000;
    padding-top: 0;       /* no notches on desktop */
    padding-bottom: 0;
  }
}

.v2-sku-picker__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid #000;
  flex-shrink: 0;
}
.v2-sku-picker__title {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.v2-sku-picker__close {
  width: 44px;
  height: 44px;
  border: 1px solid #000;
  background: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
}
@media (hover: hover) {
  .v2-sku-picker__close:hover { background: #000; color: #fff; }
}

.v2-sku-picker__searchwrap {
  padding: 12px 18px;
  border-bottom: 1px solid #000;
  background: #fafafa;
  flex-shrink: 0;
}
.v2-sku-picker__search {
  width: 100%;
  font-size: 16px;        /* always 16px — same iOS no-zoom rule */
  padding: 12px 14px;
  border: 1px solid #000;
  background: #fff;
}

.v2-sku-picker__list {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.v2-sku-picker__row {
  width: 100%;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 14px;
  align-items: center;
  padding: 12px 18px;
  min-height: 56px;
  border: 0;
  border-bottom: 1px solid #f0f0f0;
  background: #fff;
  text-align: left;
  font: inherit;
  color: #000;
  cursor: pointer;
}
.v2-sku-picker__row:active { background: #f0f0f0; }
@media (hover: hover) {
  .v2-sku-picker__row:hover { background: #fafafa; }
}

.v2-sku-picker__code {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 18px;
  font-variant-numeric: tabular-nums;
  color: #000;
}
.v2-sku-picker__main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.v2-sku-picker__name {
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-sku-picker__meta {
  font-size: 11px;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.v2-sku-picker__empty {
  padding: 32px 18px;
  text-align: center;
  color: #666;
  font-size: 13px;
}

/* ===========================================================================
   Costos — registro de costo todo-incluido ($/kg) por pool (producto,
   calidad): ride-along en la Entrada (Capturar), card de Costos + backfill
   retroactivo en Reportes, y prefill del Hipotético. Datos en
   pos_product_costs (patch #81).
   =========================================================================== */
.v2-costs-field input { max-width: 220px; }
.v2-costs-field__hint { color: #666; font-size: 11px; line-height: 1.4; }

.v2-costs__desc {
  margin: 0 0 10px;
  padding: 8px 10px;
  background: #f7f7f7;
  border: 1px dashed #cccccc;
  color: #555;
  font-size: 11px;
  line-height: 1.45;
}
.v2-costs__notice {
  display: block;
  color: #a05a00;
  font-size: 11px;
  font-style: italic;
  line-height: 1.4;
  margin: 4px 0 0;
}
.v2-costs__pool {
  border: 1px solid #dddddd;
  background: #fafafa;
  padding: 8px 10px;
  margin-top: 8px;
}
.v2-costs__pool-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.v2-costs__pool-name { font-weight: 700; font-size: 12px; }
.v2-costs__pool-meta {
  font-family: var(--font-mono);
  color: #666;
  font-size: 11px;
}
.v2-costs__current {
  font-weight: 700;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.v2-costs__current-date { font-weight: 400; color: #666; font-size: 11px; }
.v2-costs__current.is-empty { color: #d00000; font-weight: 600; }
.v2-costs__hist {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
  font-size: 11px;
  color: #444;
}
.v2-costs__hist li {
  display: flex;
  gap: 10px;
  align-items: baseline;
  padding: 3px 0;
  border-top: 1px dashed #e2e2e2;
}
.v2-costs__hist-date {
  font-family: var(--font-mono);
  color: #666;
  white-space: nowrap;
}
.v2-costs__hist-cost {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.v2-costs__hist-note {
  color: #777;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  flex: 1;
}
.v2-costs__hist-more { color: #999; font-style: italic; }
.v2-costs__del {
  background: none;
  border: none;
  padding: 0 2px;
  cursor: pointer;
  color: #b00000;
  font-size: 11px;
  text-decoration: underline;
  white-space: nowrap;
  margin-left: auto;
}
.v2-costs__del.is-confirm {
  background: #b00000;
  color: #ffffff;
  text-decoration: none;
  padding: 1px 6px;
  font-weight: 700;
}
.v2-costs__del[disabled] { opacity: 0.5; cursor: default; }
.v2-costs__add {
  margin-top: 12px;
  border-top: 1px solid #cccccc;
  padding-top: 10px;
}
.v2-costs__add-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #555;
  margin-bottom: 8px;
}
.v2-costs__add-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-end;
}
.v2-costs__add-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  color: #555;
}
.v2-costs__add-field .modal__input { min-width: 150px; }
.v2-costs__error {
  color: #d00000;
  font-size: 12px;
  margin-top: 6px;
  min-height: 1em;
}
.v2-hipo__tfoot--margin { border-top: 1px dashed #999999; font-weight: 700; }

/* ───── Liga a Orden de Compra en la Entrada ─────────────────────────────── */
.v2-costs-entrada {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.v2-costs-entrada select { max-width: 460px; }
.v2-costs-formula {
  display: block;
  font-family: var(--font-mono);
  font-size: 11px;
  color: #555;
  font-variant-numeric: tabular-nums;
  min-height: 1em;
}
.v2-costs-warn {
  display: block;
  color: #a05a00;
  font-size: 11px;
  line-height: 1.4;
  min-height: 1em;
}

/* ───── Backfill retroactivo (Reportes) ──────────────────────────────────── */
.v2-costbf__toggle {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-align: left;
}
.v2-costbf__title { margin: 0; }
.v2-costbf__chevron { color: #888; font-size: 12px; }
.v2-costbf__notice {
  color: #777;
  font-size: 12px;
  font-style: italic;
  margin: 8px 0 0;
}
.v2-costbf__list { margin-top: 8px; }
.v2-costbf__row {
  border: 1px solid #dddddd;
  background: #fafafa;
  margin-top: 6px;
}
.v2-costbf__row.is-expanded { background: #ffffff; border-color: #bbbbbb; }
.v2-costbf__row-trigger {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: none;
  border: none;
  padding: 8px 10px;
  cursor: pointer;
  text-align: left;
}
.v2-costbf__row-main { min-width: 0; }
.v2-costbf__row-head {
  display: flex;
  gap: 10px;
  align-items: baseline;
  flex-wrap: wrap;
}
.v2-costbf__date {
  font-family: var(--font-mono);
  font-size: 11px;
  color: #666;
  white-space: nowrap;
}
.v2-costbf__ref { font-weight: 700; font-size: 12px; white-space: nowrap; }
.v2-costbf__status {
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #1d6b1d;
  white-space: nowrap;
}
.v2-costbf__status.is-empty { color: #d00000; font-weight: 600; }
.v2-costbf__pools {
  font-size: 11px;
  color: #777;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-costbf__form-wrap {
  border-top: 1px dashed #cccccc;
  padding: 10px;
}
.v2-costbf__form {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-end;
}
.v2-costbf__linked { margin-bottom: 10px; }
.v2-costbf__linked-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #555;
}
.v2-costbf__hint {
  color: #7a5c00;
  font-size: 11px;
  line-height: 1.4;
  margin: 6px 0 0;
}
.v2-costbf__saved {
  margin-top: 8px;
  padding: 6px 8px;
  background: #eef7ee;
  border: 1px solid #bcd9bc;
  color: #1d6b1d;
  font-size: 12px;
  line-height: 1.4;
}
.v2-costbf__foot { margin-top: 10px; }