/* Shared report typography and controls, based on the daily-gainers view.
   Legacy inline styles require targeted important rules; data colors and layout stay owned by each module. */
:root {
  --abc-font: 'Inter', -apple-system, 'PingFang SC', 'Helvetica Neue', 'Microsoft YaHei', sans-serif;
  --abc-text: #1f2937;
  --abc-muted: #6b7280;
  --abc-primary: #4f46e5;
  --abc-border: #e5e7eb;
  --abc-surface: #fafbfc;
  --abc-selected: #eff6ff;
  --abc-table-size: 12px;
  --abc-caption-size: 12px;
}
body[data-ui="daily-gainers"] { font-family: var(--abc-font); color: var(--abc-text); letter-spacing: 0; }
body[data-ui="daily-gainers"] :is(h1,h2,h3,h4,.section-title,.stock-name,.report-summary h2) { letter-spacing: 0 !important; }
body[data-ui="daily-gainers"] :is(button,input,select,textarea) { font-family: var(--abc-font) !important; letter-spacing: 0 !important; }

/* The ID alternatives intentionally outrank the isolated screener stylesheet. */
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) :is(select,input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"])) {
  box-sizing: border-box; min-height: 32px; max-width: 100%; padding: 5px 8px !important;
  border: 1px solid var(--abc-border) !important; border-radius: 6px !important;
  font-size: var(--abc-caption-size) !important; line-height: 20px; color: var(--abc-text); background-color: #fff;
}
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) button {
  font-size: 12px !important; line-height: 20px; font-weight: 600;
  border-radius: 8px !important; min-height: 32px; padding: 5px 12px; cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s;
}
body[data-ui="daily-gainers"] :is(.mvf-btn,.ol-chip,.control-button,.sc-preset) {
  border: 1px solid var(--abc-border); background: var(--abc-surface); color: var(--abc-muted);
}
body[data-ui="daily-gainers"] :is(.mvf-btn,.ol-chip,.control-button).active,
body[data-ui="daily-gainers"] :is(#screenerV2,.screener-panel) .sc-preset {
  background: var(--abc-selected) !important; border-color: #6366f1 !important; color: var(--abc-primary) !important;
}
body[data-ui="daily-gainers"] :is(.refresh-btn,.sc-primary,.sc-query) {
  background: var(--abc-primary) !important; border-color: var(--abc-primary) !important; color: #fff !important;
}
body[data-ui="daily-gainers"] :is(button,input,select,textarea,summary,a):focus-visible {
  outline: 2px solid #6366f1 !important; outline-offset: 2px !important;
}
body[data-ui="daily-gainers"] button:disabled { opacity: .5; cursor: not-allowed !important; }
body[data-ui="daily-gainers"] :is(.control-button,.mvf-btn,.ol-chip):hover:not(:disabled) { border-color: #a5b4fc; }
body[data-ui="daily-gainers"] :is(.tab-pane,.content,#screenerV2) label {
  font-size: 12px !important; line-height: 1.5; color: var(--abc-muted); letter-spacing: 0;
}
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.content,#screenerV2) :is(summary,.sc-muted,.control-status,.stock-code,.sector-count,.gl) {
  font-size: 12px !important; line-height: 1.5;
}

body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) table {
  border-collapse: collapse; font-family: var(--abc-font); font-size: var(--abc-table-size) !important;
  font-variant-numeric: tabular-nums; line-height: 1.6;
}
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) th {
  font-size: 12px !important; font-weight: 500 !important; color: var(--abc-muted) !important;
  background: var(--abc-surface) !important; text-align: left; padding: 7px 8px !important;
  border-bottom: 1px solid var(--abc-border) !important; vertical-align: middle;
}
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) td {
  font-size: 12px !important; font-weight: 400; line-height: 1.5; padding: 6px 8px !important; border-bottom: 1px solid #f3f4f6; vertical-align: top;
}
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) th :is(button,span) {
  font-size: 12px !important; font-weight: 500; color: inherit;
}
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) th button {
  min-height: 24px; padding: 0 !important; border: 0; background: transparent; border-radius: 0 !important;
}
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) tbody tr:hover:not(.qualified-row) { background-color: #f3f4f6; }
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) td :is(small,.stock-code,.sc-muted,details,summary) { font-size: 12px !important; }
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) td :is(b,strong,.stock-name) { font-size: 12px !important; font-weight: 500 !important; }
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.content,#screenerV2,#incomeLayerDetailPanel) td :is(span,a,div) { font-size: 12px !important; }
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.content,#screenerV2,#incomeLayerDetailPanel) td :is(b,strong,span,a) { font-weight: 500 !important; }
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.content,#screenerV2,#incomeLayerDetailPanel) td :is(span,a,div)[style*="font-size:10px"],
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.content,#screenerV2,#incomeLayerDetailPanel) td :is(span,a,div)[style*="font-size:11px"],
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.content,#screenerV2,#incomeLayerDetailPanel) td :is(span,a,div)[style*="font-size: 11px"] { font-size: 12px !important; }
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.layer-modal,.content,#screenerV2,#incomeLayerDetailPanel) td button,
body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.content,#screenerV2) [data-chart] {
  min-height: 24px; padding: 1px 6px; border-radius: 4px !important; white-space: nowrap;
}
body[data-ui="daily-gainers"] :is(.modal-close,.funnel-detail-close,.layer-close-btn) {
  width: 32px; height: 32px; min-width: 32px; padding: 0 !important; flex-shrink: 0;
}
/* Keep the income detail's deliberately compact, wrapping column layout. */
body[data-ui="daily-gainers"] #incomeLayerDetailTable :is(th,td) { padding: 7px 6px; }
body[data-ui="daily-gainers"] #tab-stockflow > div[style*="grid-template-columns"] { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
body[data-ui="daily-gainers"] #tab-stockflow > div[style*="grid-template-columns"] > div { min-width: 0; }
body[data-ui="daily-gainers"] #tab-stockflow table { min-width: 640px; }
body[data-ui="daily-gainers"] #tab-stockflow td:first-child { min-width: 110px; }
@media (max-width: 768px) {
  body[data-ui="daily-gainers"] #tab-stockflow > div[style*="grid-template-columns"] { grid-template-columns: minmax(0,1fr) !important; }
  body[data-ui="daily-gainers"] :is(.tab-pane,.modal-box,.ci-panel,.funnel-detail,.content,#screenerV2) :is(th,td) { padding: 7px 8px; }
  body[data-ui="daily-gainers"] .gainers-table td:first-child { background-color: #fff; }
  body[data-ui="daily-gainers"] .gainers-table tr.qualified-row td:first-child { background-color: #d1fae5; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-ui="daily-gainers"] button { transition: none !important; }
}