/**
 * Website layout and polish for company snapshot (Overview tab).
 * Scoped to .kse-quote-page — overrides mobile-first share-overview.css.
 */

/* Slim page header (symbol + name; price lives in .so-hero) */
.kse-quote-page .kse-quote-header {
  margin-bottom: 16px;
}

.kse-quote-page .kse-quote-header .kse-quote-title {
  margin-top: 6px;
}

/* Overview panel: light canvas inside white tab shell */
.kse-quote-page #SymbolDetail.kse-share-overview-wrap {
  padding: 18px 20px 22px;
  background: linear-gradient(180deg, #f6faff 0%, #f0f5fa 100%);
}

/* Reset mobile 8px side margins on all overview blocks */
.kse-quote-page .kse-share-overview-wrap .so-hero,
.kse-quote-page .kse-share-overview-wrap .so-card,
.kse-quote-page .kse-share-overview-wrap .so-perf-card,
.kse-quote-page .kse-share-overview-wrap .so-kpi-grid,
.kse-quote-page .kse-share-overview-wrap .so-pc-wrap,
.kse-quote-page .kse-share-overview-wrap .so-actions,
.kse-quote-page .kse-share-overview-wrap .so-tech-snapshot,
.kse-quote-page .kse-share-overview-wrap .so-circuit-card,
.kse-quote-page .kse-share-overview-wrap .so-ret-card,
.kse-quote-page .kse-share-overview-wrap .so-vol-card,
.kse-quote-page .kse-share-overview-wrap .so-rsi-card,
.kse-quote-page .kse-share-overview-wrap .so-pivot-card,
.kse-quote-page .kse-share-overview-wrap .so-beta-card,
.kse-quote-page .kse-share-overview-wrap .so-growth-card,
.kse-quote-page .kse-share-overview-wrap .so-fin-card {
  margin-left: 0;
  margin-right: 0;
}

/* Hero — primary price card */
.kse-quote-page .kse-share-overview-wrap .so-hero {
  margin-bottom: 16px;
  padding: 20px 22px;
  border-radius: 16px;
  border: 1px solid #c8dcf2;
  background:
    radial-gradient(circle at 100% 0%, rgba(14, 116, 210, 0.08), transparent 45%),
    linear-gradient(135deg, #ffffff 0%, #f3f8ff 100%);
  box-shadow: 0 10px 28px rgba(8, 52, 98, 0.08);
}

.kse-quote-page .kse-share-overview-wrap .so-hero-top {
  min-width: 0;
}

.kse-quote-page .kse-share-overview-wrap .so-hero-top > * {
  min-width: 0;
}

.kse-quote-page .kse-share-overview-wrap .so-hero-symbol {
  font-size: 1.55rem;
  color: #0a3d6b;
}

.kse-quote-page .kse-share-overview-wrap .so-hero-name {
  font-size: 0.82rem;
  color: #5a7489;
}

.kse-quote-page .kse-share-overview-wrap .so-hero-price {
  font-size: 2.15rem;
  color: #092b47;
}

.kse-quote-page .kse-share-overview-wrap .so-hero-change {
  font-size: 0.88rem;
  padding: 4px 12px;
}

.kse-quote-page .kse-share-overview-wrap .so-hero-stat {
  font-size: 0.78rem;
}

/* KPI strip */
.kse-quote-page .kse-share-overview-wrap .so-kpi-grid {
  gap: 10px;
  margin-bottom: 18px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.kse-quote-page .kse-share-overview-wrap .so-kpi {
  margin: 0;
  padding: 12px 10px;
  min-height: 68px;
  min-width: 0;
  border-radius: 12px;
  border-color: #d5e4f1;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(8, 36, 64, 0.04);
}

.kse-quote-page .kse-share-overview-wrap .so-kpi-label {
  font-size: 0.68rem;
  letter-spacing: 0.5px;
}

.kse-quote-page .kse-share-overview-wrap .so-kpi-value {
  font-size: 1rem;
}

/* Two-column body: fundamentals left, technicals right */
.kse-quote-page .kse-so-body {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.kse-quote-page .kse-so-main,
.kse-quote-page .kse-so-sidebar {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

.kse-quote-page .kse-so-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: stretch;
}

.kse-quote-page .kse-so-row-2 > div {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.kse-quote-page .kse-so-row-2 > div > .so-card {
  flex: 1;
  margin-bottom: 0;
}

/* Unified card styling */
.kse-quote-page .kse-share-overview-wrap .so-card,
.kse-quote-page .kse-share-overview-wrap .so-perf-card,
.kse-quote-page .kse-share-overview-wrap .so-tech-snapshot,
.kse-quote-page .kse-share-overview-wrap .so-circuit-card,
.kse-quote-page .kse-share-overview-wrap .so-ret-card,
.kse-quote-page .kse-share-overview-wrap .so-vol-card,
.kse-quote-page .kse-share-overview-wrap .so-rsi-card,
.kse-quote-page .kse-share-overview-wrap .so-pivot-card,
.kse-quote-page .kse-share-overview-wrap .so-beta-card,
.kse-quote-page .kse-share-overview-wrap .so-growth-card,
.kse-quote-page .kse-share-overview-wrap .so-fin-card {
  margin-bottom: 0;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid #d5e4f1;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(7, 35, 62, 0.06);
}

.kse-quote-page .kse-share-overview-wrap .so-section-title {
  font-size: 0.78rem;
  letter-spacing: 0.7px;
  color: #0d4f8a;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid #e8f0f7;
}

/* Pros & cons */
.kse-quote-page .kse-share-overview-wrap .so-pc-wrap {
  gap: 14px;
  margin-bottom: 0;
}

.kse-quote-page .kse-share-overview-wrap .so-pc-card {
  margin: 0;
  padding: 14px 16px;
  border-radius: 14px;
  border-color: #d5e4f1;
  min-width: 0;
}

.kse-quote-page .kse-share-overview-wrap .so-pc-list li {
  font-size: 0.86rem;
  padding: 5px 0 5px 18px;
}

/* Performance bars */
.kse-quote-page .kse-share-overview-wrap .so-perf-row {
  grid-template-columns: 44px 1fr 72px;
  margin-bottom: 8px;
}

.kse-quote-page .kse-share-overview-wrap .so-perf-label,
.kse-quote-page .kse-share-overview-wrap .so-perf-value {
  font-size: 0.84rem;
}

/* Mini grids inside cards */
.kse-quote-page .kse-share-overview-wrap .so-mini-cell {
  margin: 0;
  padding: 10px 8px;
  border-radius: 10px;
  background: #f7fbff;
  border-color: #e3edf7;
}

.kse-quote-page .kse-share-overview-wrap .so-mini-label {
  font-size: 0.68rem;
}

.kse-quote-page .kse-share-overview-wrap .so-mini-value {
  font-size: 0.92rem;
}

/* Sidebar: quick actions + technicals */
.kse-quote-page .kse-so-sidebar {
  position: sticky;
  top: 88px;
}

.kse-quote-page .kse-so-sidebar::before {
  content: "Technicals & Actions";
  display: block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #5a7489;
  margin-bottom: 2px;
}

.kse-quote-page .kse-share-overview-wrap .so-actions {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 0;
}

.kse-quote-page .kse-share-overview-wrap .so-action-btn {
  margin: 0;
  padding: 12px 8px !important;
  font-size: 0.78rem !important;
  border-radius: 12px !important;
  background: #f7fbff !important;
  color: #0d4f8a !important;
  border: 1px solid #c7def8 !important;
  box-shadow: 0 2px 8px rgba(8, 52, 98, 0.06) !important;
}

.kse-quote-page .kse-share-overview-wrap .so-action-btn.so-alert {
  background: linear-gradient(135deg, #fff7ed, #ffedd5) !important;
  color: #9a3412 !important;
  border-color: #fed7aa !important;
}

.kse-quote-page .kse-share-overview-wrap .so-action-btn.so-watch {
  background: linear-gradient(135deg, #ecfdf5, #d1fae5) !important;
  color: #065f46 !important;
  border-color: #a7f3d0 !important;
}

.kse-quote-page .kse-share-overview-wrap .so-action-btn.so-portfolio {
  background: linear-gradient(135deg, #f5f3ff, #ede9fe) !important;
  color: #5b21b6 !important;
  border-color: #ddd6fe !important;
}

.kse-quote-page .kse-share-overview-wrap .so-tech-snapshot {
  grid-template-columns: 1fr;
  margin: 0;
}

.kse-quote-page .kse-share-overview-wrap .so-tech-item {
  margin: 0;
  padding: 8px 10px;
  border-radius: 10px;
  background: #f7fbff;
  border: 1px solid #e8f0f7;
}

.kse-quote-page .kse-share-overview-wrap .so-tech-item-label {
  font-size: 0.68rem;
}

.kse-quote-page .kse-share-overview-wrap .so-tech-item-value {
  font-size: 0.92rem;
}

/* RSI / pivot / beta cards in sidebar */
.kse-quote-page .kse-so-sidebar .so-card {
  margin-bottom: 0;
}

/* Circuit limits bar */
.kse-quote-page .kse-share-overview-wrap .so-circuit-card {
  margin-bottom: 0;
}

.kse-quote-page .kse-share-overview-wrap .so-circuit-bar {
  height: 10px;
  margin: 4px 0 8px;
}

.kse-quote-page .kse-share-overview-wrap .so-circuit-mark-val,
.kse-quote-page .kse-share-overview-wrap .so-circuit-curr-price {
  font-size: 0.88rem;
}

/* Price returns — readable percentage text */
.kse-quote-page .kse-share-overview-wrap .so-ret-row {
  margin-bottom: 8px;
}

.kse-quote-page .kse-share-overview-wrap .so-ret-label {
  flex: 0 0 36px;
  font-size: 0.78rem;
}

.kse-quote-page .kse-share-overview-wrap .so-ret-val {
  flex: 0 0 64px;
  font-size: 0.84rem;
}

/* Volume chart — taller bars on desktop */
.kse-quote-page .kse-share-overview-wrap .so-vol-chart {
  height: 110px;
  gap: 8px;
}

.kse-quote-page .kse-share-overview-wrap .so-vol-val {
  font-size: 0.68rem;
}

.kse-quote-page .kse-share-overview-wrap .so-vol-lbl {
  font-size: 0.65rem;
}

/* Market pulse — 3-column grid on wide screens */
.kse-quote-page .kse-so-main .so-mini-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

/* Growth metrics — wider label column */
.kse-quote-page .kse-share-overview-wrap .so-growth-label {
  flex: 0 0 140px;
  font-size: 0.72rem;
}

.kse-quote-page .kse-share-overview-wrap .so-growth-val {
  font-size: 0.84rem;
}

/* Financials snapshot */
.kse-quote-page .kse-share-overview-wrap .so-fin-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.kse-quote-page .kse-share-overview-wrap .so-fin-item {
  background: #f7fbff;
  border-color: #e3edf7;
  padding: 12px;
}

.kse-quote-page .kse-share-overview-wrap .so-fin-label {
  font-size: 0.68rem;
}

.kse-quote-page .kse-share-overview-wrap .so-fin-val {
  font-size: 1rem;
}

/* Payout card metrics — fix float layout */
.kse-quote-page .kse-share-overview-wrap .so-pm-cell {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
}

.kse-quote-page .kse-share-overview-wrap .so-pm-label,
.kse-quote-page .kse-share-overview-wrap .so-pm-val {
  float: none;
}

.kse-quote-page .kse-share-overview-wrap .so-pm-val {
  font-size: 0.88rem;
}

/* Sidebar: beta 2x2, RSI centered */
.kse-quote-page .kse-so-sidebar .so-beta-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.kse-quote-page .kse-so-sidebar .so-rsi-gauge-wrap svg {
  max-width: 220px;
  margin: 0 auto;
}

/* Recent activity */
.kse-quote-page .kse-share-overview-wrap .so-act-title {
  font-size: 0.86rem;
  white-space: normal;
}

.kse-quote-page .kse-share-overview-wrap .so-act-meta {
  font-size: 0.72rem;
}

/* Dividend bars */
.kse-quote-page .kse-share-overview-wrap .so-divbar-track {
  height: 72px;
}

/* Hero sparkline */
.kse-quote-page .kse-share-overview-wrap .so-hero .so-spark {
  height: 56px;
  border-radius: 10px;
}

.kse-quote-page .kse-share-overview-wrap .so-history-chart {
  min-height: 168px;
  overflow: visible;
}

.kse-quote-page .kse-share-overview-wrap .so-history-wrap .so-spark-label {
  margin-bottom: 6px;
}

.kse-quote-page .kse-share-overview-wrap .so-range-bar {
  height: 8px;
}

.kse-quote-page .kse-share-overview-wrap .so-hero-sector {
  font-size: 0.68rem;
}

/* Chips */
.kse-quote-page .kse-share-overview-wrap .so-chip {
  font-size: 0.72rem;
  padding: 3px 10px;
}

/* Empty containers should not leave gaps */
.kse-quote-page .kse-share-overview-wrap [id^="so-"]:empty {
  display: none;
}

@media (max-width: 1100px) {
  .kse-quote-page .kse-so-body {
    grid-template-columns: 1fr;
  }

  .kse-quote-page .kse-so-sidebar {
    position: static;
  }

  .kse-quote-page .kse-so-sidebar::before {
    margin-top: 4px;
  }

  .kse-quote-page .kse-share-overview-wrap .so-tech-snapshot {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .kse-quote-page #SymbolDetail.kse-share-overview-wrap {
    padding: 12px 10px 16px;
  }

  .kse-quote-page .kse-share-overview-wrap .so-hero {
    padding: 14px;
  }

  .kse-quote-page .kse-share-overview-wrap .so-hero-top {
    flex-direction: column;
    gap: 8px;
  }

  .kse-quote-page .kse-share-overview-wrap .so-hero-price-col {
    text-align: left;
  }

  .kse-quote-page .kse-share-overview-wrap .so-kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .kse-quote-page .kse-so-row-2 {
    grid-template-columns: 1fr;
  }

  .kse-quote-page .kse-share-overview-wrap .so-pc-wrap {
    grid-template-columns: 1fr;
  }

  .kse-quote-page .kse-share-overview-wrap .so-fin-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .kse-quote-page .kse-so-main .so-mini-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .kse-quote-page .kse-share-overview-wrap .so-actions {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .kse-quote-page .kse-share-overview-wrap .so-kpi-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Fundamentals, Income, Balance, Announcements, Payout, Insider — app-style tabs */
.kse-quote-page .kse-quote-panels > .tab-pane:not(#SymbolDetail) {
  padding: 16px 18px 20px;
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.kse-quote-page .so-tab-enhanced {
  margin-bottom: 14px;
}

.kse-quote-page .so-tab-enhanced .so-card {
  margin: 0 0 14px;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid #d5e4f1;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(7, 35, 62, 0.06);
}

.kse-quote-page .so-tab-enhanced .so-section-title {
  font-size: 0.78rem;
  letter-spacing: 0.7px;
  color: #0d4f8a;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid #e8f0f7;
}

.kse-quote-page .so-tab-enhanced .so-mini-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.kse-quote-page .so-tab-enhanced .so-mini-cell {
  margin: 0;
  padding: 10px 8px;
  border-radius: 10px;
  background: #f7fbff;
  border: 1px solid #e3edf7;
}

.kse-quote-page .so-tab-enhanced .so-filter-chips {
  margin-bottom: 10px;
}

@media (max-width: 768px) {
  .kse-quote-page .so-tab-enhanced .so-mini-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}