/* stocksight-fixups.css — loaded after stocksight.css.
   1. StockSight's tokens, re-pointed at the platform's red, grey and white.
   2. Undo platform rules that share a class name with StockSight (.btn, .badge,
      .modal, .table-wrap, .form-grid, .req, .spinner, .loading-wrap, .empty)
      and would otherwise leak properties StockSight's own rule doesn't set. */

.stocksight {
  --red: #c62f2f;
  --red-dark: #9e2424;
  --red-light: #fcebeb;
  --red-mid: #dc3a3a;
  --sidebar-active: #c62f2f;
  --border-focus: #c62f2f;
  --danger: #b42318;
  --danger-light: #fbe6e4;
  --bg: #f3f4f6;
  --surface-2: #f6f7f9;
  --border: #e2e4e8;
  --text-3: #6b7280;
  --radius-lg: 14px;
  --radius-xl: 16px;
}

/* The containers themselves: #content and the dialog portal are not a page body. */
#content.stocksight { height: auto; background: transparent; line-height: 1.5; }
#ss-portal.stocksight { height: 0; background: transparent; }
.ss-head.stocksight { height: auto; background: transparent; }

/* Shared class names */
.stocksight .req::after { content: none; }
.stocksight .table-wrap { min-height: 0; overflow: auto; }
.stocksight .modal { animation: ss-slideUp .18s ease; }
.stocksight .modal-body { padding: 20px 24px; }
.stocksight .loading-wrap { height: auto; }
.stocksight .spinner { border-top-color: var(--red); }
.stocksight .badge { gap: 4px; }
.stocksight .btn .li { width: 15px; height: 15px; }
.stocksight .empty { padding: 48px 24px; }

/* The header bar's action buttons sit outside #content but inside a .stocksight bar. */
.ss-head .btn { font-size: .82rem; }

/* Phones: drivers capture deliveries on a phone. */
@media (max-width: 640px) {
  .stocksight .form-grid, .stocksight .form-grid.cols-3 { grid-template-columns: 1fr; }
  .stocksight .col-span-2, .stocksight .col-span-3 { grid-column: auto; }
}

/* Dialogs sit above the platform's topbar and sidebar. */
#ss-portal .modal-backdrop { z-index: 3000; }