/* Page-specific dark theme corrections. Loaded after each page's own styles. */
html[data-theme="dark"] {
  --as-bg: #101214;
  --as-panel: #1a1d21;
  --as-text: #eceff3;
  --as-muted: #a9afb7;
  --as-line: #3a4048;
  --as-soft-line: #2b3036;
  --as-shadow: 0 12px 28px rgba(0, 0, 0, 0.3);
  --cp-bg: #101214;
  --cp-surface: #1a1d21;
  --cp-surface-soft: #16191d;
  --cp-line: #3a4048;
  --cp-line-strong: #515963;
  --cp-text: #eceff3;
  --cp-muted: #a9afb7;
  --cp-green-soft: #12362f;
  --cp-blue-soft: #172b47;
  --cp-red-soft: #3a1e28;
  --cp-amber-soft: #342a18;
  --cp-shadow: 0 12px 28px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] body:not(.login-page) :is(
  .panel,
  .metric-card,
  .admin-kpi,
  .po-box,
  .table-scroll,
  [class$="-modal-card"],
  [class*="-modal-card "],
  [class$="-popover"],
  [class*="-popover "],
  [class$="-dropdown"],
  [class*="-dropdown "],
  [class$="-suggest"],
  [class*="-suggest "],
  [class$="-chart-box"],
  [class*="-chart-box "],
  [class$="-chart-shell"],
  [class*="-chart-shell "]
) {
  border-color: var(--line);
  background-color: var(--bg-card);
  background-image: none;
  color: var(--text-main);
}

html[data-theme="dark"] body:not(.login-page) :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  select,
  textarea
) {
  border-color: #49515b;
  background-color: #15191d;
  color: #eceff3;
}

html[data-theme="dark"] body:not(.login-page) :is(input, textarea)::placeholder {
  color: #858d97;
  opacity: 1;
}

html[data-theme="dark"] body:not(.login-page) :is(input, select, textarea):focus {
  border-color: #60a5fa;
  background-color: #15191d;
  color: #f8fafc;
}

html[data-theme="dark"] :is(.compare-table, [class*="table"]) :is(th, td) {
  border-color: #3a4048;
}

html[data-theme="dark"] :is(.compare-table, [class*="table"]) thead th {
  background-color: #24292f;
  color: #e4e7eb;
}

/* Product orders and its Flatpickr calendar. */
html[data-theme="dark"] :is(#poStartDate, #poEndDate) {
  border-color: #49515b;
  background: #15191d;
  color: #eceff3;
}

html[data-theme="dark"] :is(
  .po-compare-wrap,
  .po-compare-item,
  .po-option-checks,
  .po-seller-check-grid
) {
  border-color: #49515b;
  background: #15191d;
  color: #eceff3;
}

html[data-theme="dark"] #poOptionChecks.po-option-checks {
  border-color: #49515b !important;
  background: #15191d !important;
}

html[data-theme="dark"] #poOptionChecks .po-option-check {
  color: #eceff3 !important;
}

html[data-theme="dark"] :is(
  .po-option-bulk-btn,
  .po-chart-tool-btn,
  .slow-stock-order-chart-tool-btn
) {
  border-color: #4b5561;
  background: #20252b;
  color: #d9dee5;
}

html[data-theme="dark"] :is(
  .po-option-bulk-btn,
  .po-chart-tool-btn,
  .slow-stock-order-chart-tool-btn
):not(:disabled):hover,
html[data-theme="dark"] :is(.po-chart-tool-btn, .slow-stock-order-chart-tool-btn).active {
  border-color: #60a5fa;
  background: #2a3139;
  color: #ffffff;
}

html[data-theme="dark"] .flatpickr-calendar {
  border: 1px solid #49515b;
  background: #1a1d21;
  color: #eceff3;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] :is(.flatpickr-months, .flatpickr-weekdays, span.flatpickr-weekday) {
  background: #1a1d21;
  color: #d3d7dd;
}

html[data-theme="dark"] :is(.flatpickr-current-month, .flatpickr-monthDropdown-months, .numInputWrapper input) {
  color: #eceff3;
}

html[data-theme="dark"] .flatpickr-day {
  color: #e1e5ea;
}

html[data-theme="dark"] .flatpickr-day:is(.prevMonthDay, .nextMonthDay) {
  color: #737b85;
}

html[data-theme="dark"] .flatpickr-day:hover {
  border-color: #49515b;
  background: #252b32;
}

/* Ad and stock forecast board. */
html[data-theme="dark"] body.ad-stock-page {
  background: var(--as-bg);
  color: var(--as-text);
}

html[data-theme="dark"] .ad-stock-page :is(
  .as-toolbar,
  .as-kpis,
  .as-product-summary-panel,
  .as-detail-panel,
  .as-scenario-panel,
  .as-grid-panel,
  .as-product-list,
  .as-product-row,
  .as-modal-panel,
  .as-option-scenario-chart-wrap,
  .as-order-ledger-summary
) {
  border-color: var(--as-line);
  background: var(--as-panel);
  color: var(--as-text);
}

html[data-theme="dark"] .ad-stock-page :is(
  .as-product-row-head,
  .as-scenario-head,
  .as-forecast-grid thead th,
  .as-option-scenario-grid thead th,
  .as-leadtime-table thead th
) {
  border-color: var(--as-line);
  background: #24292f;
  color: #e4e7eb;
}

html[data-theme="dark"] .ad-stock-page .as-chart-option-bar {
  border-color: var(--as-line);
  background: #16191d;
  background-image: none;
  color: var(--as-text);
}

html[data-theme="dark"] .ad-stock-page :is(.as-chart-option-title, .as-chart-option-barcode) {
  color: #d3d7dd;
}

html[data-theme="dark"] .ad-stock-page .as-chart-option-count {
  background: #2a2f35;
  color: #d9dee5;
}

html[data-theme="dark"] .ad-stock-page :is(
  .as-product-row[role="button"]:hover,
  .as-product-row.active,
  .as-product-row.pinned,
  .as-kpis article:hover,
  .as-kpis article:focus-visible
) {
  background: #252b32;
}

html[data-theme="dark"] .ad-stock-page :is(
  .as-btn:not(.as-primary):not(.as-global-reset-btn),
  .as-product-expand-btn,
  .as-option-leadtime-button,
  .as-scenario-reset-btn,
  .as-scenario-today-btn,
  .as-scenario-auto-btn,
  .as-chart-option-btn,
  .as-chart-option-toggle,
  .as-grid-option-manage-btn,
  .as-row-info,
  .as-date-event-choice,
  .as-modal-close,
  .as-leadtime-override-clear,
  .as-share-clear-all,
  .as-share-save
) {
  border-color: #4b5561;
  background: #20252b;
  color: #d9dee5;
}

html[data-theme="dark"] .ad-stock-page .as-global-reset-btn {
  border-color: #854d62;
  background: #3a1e28;
  color: #fecdd3;
}

html[data-theme="dark"] .ad-stock-page :is(
  .as-forecast-grid th,
  .as-forecast-grid td,
  .as-option-scenario-grid th,
  .as-option-scenario-grid td,
  .as-leadtime-table th,
  .as-leadtime-table td,
  .as-share-table th,
  .as-share-table td
) {
  border-color: var(--as-line);
  background: #16191d;
  color: #d9dee5;
}

html[data-theme="dark"] .ad-stock-page :is(
  .as-scenario-grid .as-scenario-editable,
  .as-option-scenario-grid .as-scenario-editable,
  .as-forecast-grid .as-grid-editable input,
  .as-leadtime-override-input input,
  .as-share-table input
) {
  border-color: #49515b;
  background: #15191d;
  color: #eceff3;
}

html[data-theme="dark"] .ad-stock-page .as-risk.idle {
  background: #2a2f35;
  color: #d1d5db;
}

html[data-theme="dark"] .ad-stock-page .as-leadtime-button {
  border-color: #3f6598;
  background: #172b47;
  color: #bfdbfe;
}

html[data-theme="dark"] .ad-stock-page .as-cell-coupang {
  background: #12303e !important;
  color: #bae6fd;
}

html[data-theme="dark"] .ad-stock-page :is(
  .as-stockout-button,
  .as-row-action.danger,
  .as-forecast-grid thead th.as-weekend-col
) {
  background: #3a1e28;
  color: #fecdd3;
}

html[data-theme="dark"] .ad-stock-page :is(.as-forecast-grid .as-shared-inbound-draft, .as-cell-tight) {
  background: #342a18 !important;
  color: #fde68a;
}

/* Slow-stock summary and selection states. */
html[data-theme="dark"] .slow-stock-kpis {
  border-color: #3a4048;
  background: #16191d;
}

html[data-theme="dark"] .slow-stock-change-kpi {
  border-color: #315b9f;
  background: #20252b !important;
  color: #eceff3;
}

html[data-theme="dark"] .slow-stock-change-kpi > strong,
html[data-theme="dark"] .slow-stock-kpis .admin-kpi strong {
  color: #f3f4f6;
}

html[data-theme="dark"] .slow-stock-kpi-card span,
html[data-theme="dark"] :is(.slow-stock-change-period, .slow-stock-kpi-meta) {
  color: #a9afb7;
}

html[data-theme="dark"] :is(.slow-stock-change-lines, .slow-stock-change-details) p {
  border-color: #3a4048;
  background: #20252b;
  color: #eceff3;
}

html[data-theme="dark"] :is(.slow-stock-change-lines, .slow-stock-change-details) p b {
  color: #eceff3;
}

html[data-theme="dark"] .slow-stock-change-chip {
  border-color: #49515b;
  background: #20252b;
  color: #eceff3;
}

html[data-theme="dark"] .slow-stock-zone-kpi-slow {
  border-color: #8a3c50;
  background: #3a1e28 !important;
}

html[data-theme="dark"] .slow-stock-zone-kpi-caution {
  border-color: #7b5c22;
  background: #342a18 !important;
}

html[data-theme="dark"] .slow-stock-zone-kpi-good {
  border-color: #276b58;
  background: #12362f !important;
}

html[data-theme="dark"] .slow-stock-zone-kpi-shortage {
  border-color: #315b9f;
  background: #172b47 !important;
}

html[data-theme="dark"] .slow-stock-product-cell {
  border-left-color: #be4059 !important;
  background: #3a1e28 !important;
  color: #fecdd3;
}

html[data-theme="dark"] .slow-stock-product-cell strong {
  color: #ffe4e6;
}

html[data-theme="dark"] .slow-stock-product-cell span {
  color: #fda4af;
}

html[data-theme="dark"] :is(.cp-ads-help-card, .slow-stock-help-card) {
  border-color: #4b5561;
  background: rgba(26, 29, 33, 0.99);
  color: #d9dee5;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.48);
}

html[data-theme="dark"] :is(.cp-ads-help-card, .slow-stock-help-card) :is(strong, b) {
  color: #f3f4f6;
}

html[data-theme="dark"] .slow-stock-segmented {
  border-color: #49515b;
  background: #15191d;
}

html[data-theme="dark"] .slow-stock-segmented button.active {
  border-color: #60a5fa;
  background: #2a3139;
  color: #bfdbfe;
}

html[data-theme="dark"] :is(.slow-stock-row:hover td, .slow-stock-row.active td) {
  background-color: #252b32;
}

/* Coupang v2 pages use a separate variable palette. */
html[data-theme="dark"] body.coupang-v2-page {
  background: var(--cp-bg);
  color: var(--cp-text);
}

html[data-theme="dark"] .coupang-v2-page :is(
  .cpv2-field select,
  .cpv2-chart-controls select,
  .cpv2-table-footer select,
  .cpv2-search-field,
  .cpv2-column-popover,
  .cpv2-campaign-values > span,
  .cpv2-campaign-identifiers
) {
  border-color: var(--cp-line);
  background: var(--cp-surface);
  color: var(--cp-text);
}

html[data-theme="dark"] .coupang-v2-page .cpv2-table :is(th, td) {
  border-color: var(--cp-line);
  background: var(--cp-surface);
  color: var(--cp-text);
}

html[data-theme="dark"] .coupang-v2-page .cpv2-detail-table .cpv2-option-issue-cell {
  background: var(--cp-red-soft);
  color: #fecdd3;
}

/* Common selected rows that otherwise retain light-only fills. */
html[data-theme="dark"] :is(
  .cp-inv-kpi-filter.active,
  .crm-cost-strategy-item.active,
  .fb-product-table tbody tr.active,
  .fb-product-table tbody tr.active td,
  .fb-variant-table tbody tr.active > td,
  .fb-raw-table tbody tr.active > td
) {
  border-color: #3b82f6;
  background: #252b32;
  color: #dbeafe;
}

html[data-theme="dark"] :is(
  .itsus-table tbody tr.active > td,
  .itsus-overview-table tbody tr.active > td,
  .itsus-overview-table tbody tr.active.itsus-map-hidden-row > td
) {
  background: #252b32 !important;
  color: #dbeafe;
}