/**
 * Shared workspace / “back to list” control (Purchasing/Lines pattern).
 * Elevated dark control: white text, subtle border, shadow. Icon mirrors in RTL.
 */
a.btn.tv-back-btn {
  --tv-back-btn-bg-top: rgba(51, 65, 85, 0.98);
  --tv-back-btn-bg-bottom: rgba(15, 23, 42, 0.98);
  --tv-back-btn-border: rgba(255, 255, 255, 0.22);
  --tv-back-btn-shadow: 0 1px 2px rgba(0, 0, 0, 0.14), 0 6px 16px rgba(0, 0, 0, 0.22);
  min-height: 2.25rem;
  padding-inline: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #fff !important;
  text-decoration: none;
  background: linear-gradient(180deg, var(--tv-back-btn-bg-top) 0%, var(--tv-back-btn-bg-bottom) 100%);
  border: 1px solid var(--tv-back-btn-border) !important;
  border-radius: var(--tv-radius-md, 0.5rem);
  box-shadow: var(--tv-back-btn-shadow);
  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1),
    filter 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

a.btn.tv-back-btn:hover {
  color: #fff !important;
  filter: brightness(1.09);
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16), 0 10px 24px rgba(0, 0, 0, 0.26);
}

a.btn.tv-back-btn:active {
  transform: translateY(0);
  filter: brightness(0.98);
}

a.btn.tv-back-btn:focus-visible {
  outline: none;
  box-shadow: var(--tv-back-btn-shadow), 0 0 0 2px var(--tv-surface, #fff), 0 0 0 4px rgba(37, 99, 235, 0.45);
}

html[data-theme="dark"] a.btn.tv-back-btn {
  --tv-back-btn-bg-top: rgba(71, 85, 105, 0.95);
  --tv-back-btn-bg-bottom: rgba(15, 23, 42, 0.98);
  --tv-back-btn-border: rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] a.btn.tv-back-btn:focus-visible {
  box-shadow: var(--tv-back-btn-shadow), 0 0 0 2px var(--tv-surface-elevated, #161b22), 0 0 0 4px rgba(96, 165, 250, 0.45);
}

.tv-back-btn__icon,
a.btn.tv-back-btn svg {
  width: 1rem;
  height: 1rem;
  display: block;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
}

/* Mirror directional icon in RTL after Lucide renders SVG */
[dir="rtl"] a.btn.tv-back-btn.tv-back-btn--mirror-rtl .tv-back-btn__icon,
[dir="rtl"] a.btn.tv-back-btn.tv-back-btn--mirror-rtl svg {
  transform: scaleX(-1);
}

/* -----------------------------------------------------------------------------
   Equal-width button groups
   - .tv-btn-stack: vertical stack (edit action bars, form footers)
   - .tv-btn-row-equal: horizontal row (report filters, toolbars)
   ----------------------------------------------------------------------------- */
.tv-btn-stack,
.tv-save-back-stack,
.tv-form-actions.tv-form-actions--stack,
.tv-edit-actionbar__actions.tv-edit-actionbar__actions--stack,
.tv-accounting-invoice-toolbar__actions.tv-accounting-invoice-toolbar__actions--stack {
  display: inline-grid;
  grid-auto-flow: row;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  justify-items: stretch;
  gap: 0.5rem;
  width: max-content;
  max-width: 100%;
  flex-direction: unset;
  flex-wrap: unset;
}

.tv-btn-stack > .btn,
.tv-btn-stack > a.btn,
.tv-save-back-stack > .btn,
.tv-save-back-stack > a.btn,
.tv-form-actions.tv-form-actions--stack > .btn,
.tv-form-actions.tv-form-actions--stack > a.btn,
.tv-edit-actionbar__actions.tv-edit-actionbar__actions--stack > .btn,
.tv-edit-actionbar__actions.tv-edit-actionbar__actions--stack > a.btn,
.tv-accounting-invoice-toolbar__actions.tv-accounting-invoice-toolbar__actions--stack > .btn,
.tv-accounting-invoice-toolbar__actions.tv-accounting-invoice-toolbar__actions--stack > a.btn {
  width: 100%;
  min-width: 0;
  justify-content: center;
  box-sizing: border-box;
}

.tv-btn-row-equal {
  display: inline-grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  align-items: stretch;
  gap: 0.5rem;
  width: max-content;
  max-width: 100%;
}

.tv-btn-row-equal > .btn,
.tv-btn-row-equal > a.btn {
  width: 100%;
  min-width: 0;
  justify-content: center;
  box-sizing: border-box;
  white-space: nowrap;
}
