/* KlassPuls Insight 2.8 — final light-theme contrast contract.
   Loaded after the Vite bundle so legacy route styles cannot restore the old
   dark-theme text colours on light surfaces. */
:root {
  --kp28-ink: #122c2b;
  --kp28-heading: #0d3d37;
  --kp28-copy: #435f59;
  --kp28-muted: #5c736e;
  --kp28-border: #d5e3dd;
  --kp28-row: #eef5f1;
  --kp28-card: #fffefb;
  --kp28-teal: #0b746c;
  --kp28-gold: #a66f08;
}

/* Baseline: normal application content is always dark on the light canvas. */
.app-shell__main {
  color: var(--kp28-ink) !important;
  --text-main: var(--kp28-ink) !important;
  --text-soft: var(--kp28-copy) !important;
  --text-muted: var(--kp28-muted) !important;
}
.app-shell__main h1,
.app-shell__main h2,
.app-shell__main h3,
.app-shell__main h4,
.app-shell__main h5,
.app-shell__main h6,
.app-shell__main strong { color: var(--kp28-heading) !important; }
.app-shell__main p,
.app-shell__main small,
.app-shell__main label,
.app-shell__main dt,
.app-shell__main figcaption { color: var(--kp28-copy) !important; }

/* Reusable light cards and data rows. */
.app-shell__main .page-card,
.app-shell__main .metric-card,
.app-shell__main .card,
.app-shell__main .report-list-card,
.app-shell__main .empty-panel,
.app-shell__main .loading-panel,
.app-shell__main .state-card {
  color: var(--kp28-ink) !important;
  border-color: var(--kp28-border) !important;
  background: var(--kp28-card) !important;
}
.app-shell__main .placeholder-row,
.app-shell__main [class$="__meta-item"],
.app-shell__main [class$="__stat"] {
  color: var(--kp28-copy) !important;
  border-color: #dce8e3 !important;
  background: var(--kp28-row) !important;
}

/* Dashboard. */
.executive-dashboard .executive-hero,
.executive-dashboard .executive-health,
.executive-dashboard .executive-kpi,
.executive-dashboard .executive-panel,
.executive-dashboard .executive-priority,
.executive-dashboard .executive-change,
.executive-dashboard .executive-focus,
.executive-dashboard .executive-ranking__item {
  color: var(--kp28-ink) !important;
  border-color: var(--kp28-border) !important;
  background: var(--kp28-card) !important;
  text-shadow: none !important;
}
.executive-dashboard .executive-hero {
  background: linear-gradient(135deg, #def3eb, #fff6e4) !important;
}
.executive-dashboard .executive-hero__eyebrow,
.executive-dashboard .executive-kpi__icon { color: var(--kp28-teal) !important; }
.executive-dashboard .executive-health__label,
.executive-dashboard .executive-health__delta,
.executive-dashboard .executive-kpi__label,
.executive-dashboard .executive-kpi__delta--neutral,
.executive-dashboard .executive-panel__description,
.executive-dashboard .executive-priority__description,
.executive-dashboard .executive-change__description,
.executive-dashboard .executive-focus__description,
.executive-dashboard .executive-ranking__stage { color: var(--kp28-copy) !important; }
.executive-dashboard .executive-health__value,
.executive-dashboard .executive-health__value span,
.executive-dashboard .executive-kpi__value,
.executive-dashboard .executive-panel__title,
.executive-dashboard .executive-priority__title,
.executive-dashboard .executive-focus__title,
.executive-dashboard .executive-ranking__name,
.executive-dashboard .executive-ranking__value,
.executive-dashboard .executive-risk-row__label { color: var(--kp28-heading) !important; }
.executive-dashboard .executive-health__track,
.executive-dashboard .executive-risk-row__track { background: #dce8e3 !important; }
.executive-trend__grid { stroke: #d9e4df !important; }
.executive-trend__label { fill: #526b66 !important; }
.executive-trend__value { fill: var(--kp28-heading) !important; }
.executive-trend__point { fill: #fffefb !important; }

/* Notifications. */
.notification-center .notification-center__hero,
.notification-center .notification-center__metrics article,
.notification-center .notification-center__toolbar,
.notification-center .notification-card,
.notification-center .notification-card.is-unread,
.notification-center .notification-center__empty {
  color: var(--kp28-ink) !important;
  border-color: var(--kp28-border) !important;
  background: var(--kp28-card) !important;
}
.notification-center .notification-center__hero {
  background: linear-gradient(135deg, #def3eb, #fff6e4) !important;
}
.notification-center .notification-center__eyebrow { color: var(--kp28-teal) !important; }
.notification-center .notification-center__metrics span,
.notification-center .notification-center__metrics small,
.notification-center .notification-card__topline p,
.notification-center .notification-card__meta { color: var(--kp28-copy) !important; }
.notification-center .notification-center__metrics strong,
.notification-center .notification-card__title-row h3 { color: var(--kp28-heading) !important; }
.notification-center .notification-center__search,
.notification-center .notification-center__search input {
  color: var(--kp28-ink) !important;
  -webkit-text-fill-color: var(--kp28-ink) !important;
}
.notification-center .notification-center__filters button { color: #35524d !important; }
.notification-center .notification-center__filters button.is-active {
  color: #07332f !important;
  border-color: #87cfc1 !important;
  background: #dff4ed !important;
}
.notification-center .notification-card__severity { color: #0b665f !important; background: #dff4ed !important; }
.notification-center .notification-card__read { color: #0b665f !important; }

/* Signals. */
.signals-page .signals-hero,
.signals-page .signals-hero__focus,
.signals-page .signals-metric,
.signals-page .signals-filter-card,
.signals-page .signal-card,
.signals-page .signals-side-card {
  color: var(--kp28-ink) !important;
  border-color: var(--kp28-border) !important;
  background: var(--kp28-card) !important;
}
.signals-page .signals-hero { background: linear-gradient(135deg, #def3eb, #fff6e4) !important; }
.signals-page .signals-hero__eyebrow { color: var(--kp28-teal) !important; }
.signals-page .signals-metric__label,
.signals-page .signals-metric__description,
.signals-page .signals-filter-group__label,
.signals-page .signal-card__location,
.signals-page .signal-card__summary,
.signals-page .signal-card__meta-item span,
.signals-page .signals-side-card p,
.signals-page .signals-checklist__item { color: var(--kp28-copy) !important; }
.signals-page .signals-metric__value,
.signals-page .signals-hero__focus-value,
.signals-page .signal-card__title,
.signals-page .signal-card__meta-item strong { color: var(--kp28-heading) !important; }

/* Action centre. */
.action-center .action-center__hero,
.action-center .action-center__metrics article,
.action-center .action-center__toolbar,
.action-center .action-plan-card,
.action-center .action-center__empty {
  color: var(--kp28-ink) !important;
  border-color: var(--kp28-border) !important;
  background: var(--kp28-card) !important;
}
.action-center .action-center__hero { background: linear-gradient(135deg, #def3eb, #fff6e4) !important; }
.action-center .action-center__eyebrow { color: var(--kp28-teal) !important; }
.action-center .action-center__metrics span,
.action-center .action-center__metrics small,
.action-center .action-center__empty p,
.action-center .action-plan-card p { color: var(--kp28-copy) !important; }
.action-center .action-center__metrics strong,
.action-center .action-center__empty h3,
.action-center .action-plan-card h3 { color: var(--kp28-heading) !important; }

/* Stage, class and measurement overview pages use shared inline cards. */
.app-shell__main .page-card span,
.app-shell__main .page-card li,
.app-shell__main .page-card td,
.app-shell__main .metric-card span { color: var(--kp28-copy) !important; }
.app-shell__main .page-card span:last-child,
.app-shell__main .metric-card strong,
.app-shell__main .placeholder-row span:last-child { color: var(--kp28-heading) !important; }
.app-shell__main .page-card a { color: var(--kp28-teal) !important; }

/* Reports: screen charts need explicit SVG paint, not only CSS text colour. */
.report-builder .report-definition,
.report-builder .report-builder__filters,
.report-document .report-cover,
.report-document .report-section,
.report-document .report-chart-card,
.report-document .report-summary-card,
.report-document .professional-analysis {
  color: var(--kp28-ink) !important;
  border-color: var(--kp28-border) !important;
  background: var(--kp28-card) !important;
}
.report-document .report-cover { background: linear-gradient(135deg, #def3eb, #fff6e4) !important; }
.report-document .report-cover__eyebrow { color: var(--kp28-teal) !important; }
.report-document .report-kpi__label,
.report-document .report-chart-card p,
.report-document .report-donut-legend__name,
.report-document .professional-analysis p,
.report-document .report-include-item { color: var(--kp28-copy) !important; }
.report-document .report-kpi__value,
.report-document .professional-analysis__headline { color: var(--kp28-heading) !important; }
.report-chart__axis,
.class-analysis-chart__axis { stroke: #a9bdb6 !important; }
.report-chart__grid,
.class-analysis-chart__grid { stroke: #dce7e2 !important; }
.report-chart__label,
.class-analysis-chart__axis-label,
.class-analysis-chart__x-label { fill: #536d67 !important; }
.report-chart__value,
.class-analysis-chart__value { fill: var(--kp28-heading) !important; }
.report-chart__point,
.class-analysis-chart__point { fill: #fffefb !important; }
.report-donut text,
.report-donut__value,
.report-donut__label { fill: var(--kp28-heading) !important; color: var(--kp28-heading) !important; }

/* Class analysis detail. */
.class-analysis-hero,
.class-analysis-hero__status,
.class-analysis-metric,
.class-analysis-panel,
.class-analysis-measurement {
  color: var(--kp28-ink) !important;
  border-color: var(--kp28-border) !important;
  background: var(--kp28-card) !important;
}
.class-analysis-hero { background: linear-gradient(135deg, #def3eb, #fff6e4) !important; }
.class-analysis-hero__eyebrow { color: var(--kp28-teal) !important; }
.class-analysis-metric__label,
.class-analysis-metric__description,
.class-analysis-panel__description,
.class-analysis-measurement__date,
.class-analysis-measurement__stat span { color: var(--kp28-copy) !important; }
.class-analysis-metric__value,
.class-analysis-panel__title,
.class-analysis-measurement__title,
.class-analysis-measurement__stat strong { color: var(--kp28-heading) !important; }

/* Social Explorer's light analysis panels. The brown story banner remains dark. */
.social-explorer .social-explorer-hero,
.social-explorer .network-analysis,
.social-explorer .network-analysis-panel,
.social-explorer .network-canvas,
.social-explorer .network-sidebar,
.social-explorer .network-change-row {
  color: var(--kp28-ink) !important;
  border-color: var(--kp28-border) !important;
}
.social-explorer .social-explorer-hero { background: linear-gradient(135deg, #def3eb, #fff6e4) !important; }
.social-explorer .network-analysis p,
.social-explorer .network-sidebar p,
.social-explorer .network-change-row p { color: var(--kp28-copy) !important; }

/* Batch 2.8.1: interactive stage cards stay light and readable. */
.app-shell__main a.page-card:hover,
.app-shell__main a.page-card:focus-visible {
  color: var(--kp28-ink) !important;
  border-color: #78cbbb !important;
  background: linear-gradient(145deg, #f5fffb 0%, #e5f7f1 100%) !important;
  box-shadow: 0 18px 38px rgba(13, 61, 55, .13) !important;
}
.app-shell__main a.page-card:hover .placeholder-row,
.app-shell__main a.page-card:focus-visible .placeholder-row {
  color: var(--kp28-copy) !important;
  border-color: #cce5dc !important;
  background: #fffefb !important;
}

/* Batch 2.8.1: Story Mode uses the KlassPuls green/teal palette. */
.app-shell__main .network-story,
.app-shell__main .network-story--priority,
.app-shell__main .network-story--watch {
  color: #ffffff !important;
  border-color: rgba(151, 229, 211, .42) !important;
  background: linear-gradient(135deg, #0b4a43 0%, #116c63 58%, #17887d 100%) !important;
  box-shadow: 0 20px 48px rgba(8, 72, 65, .22) !important;
}
.app-shell__main .network-story h2,
.app-shell__main .network-story p,
.app-shell__main .network-story strong,
.app-shell__main .network-story span,
.app-shell__main .network-story b,
.app-shell__main .network-story svg {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
.app-shell__main .network-story__intro p { color: #e3f5f0 !important; }
.app-shell__main .network-story__intro > div:last-child > span,
.app-shell__main .network-story__meta span,
.app-shell__main .network-story-mini span { color: #c9ebe3 !important; }
.app-shell__main .network-story__icon {
  border-color: rgba(255, 255, 255, .38) !important;
  background: rgba(255, 255, 255, .13) !important;
}
.app-shell__main .network-story__quick-cards {
  background: rgba(211, 245, 236, .24) !important;
}
.app-shell__main .network-story-mini {
  background: rgba(5, 48, 44, .35) !important;
}
.app-shell__main .network-story__open {
  color: #0d514a !important;
  border-color: #ffffff !important;
  background: #ffffff !important;
  -webkit-text-fill-color: #0d514a !important;
}
.app-shell__main .network-story__open svg {
  color: #0d514a !important;
  -webkit-text-fill-color: #0d514a !important;
}
.app-shell__main .network-story__open:hover {
  color: #083d38 !important;
  background: #e9f8f4 !important;
  -webkit-text-fill-color: #083d38 !important;
}

/* Controls, focus and disabled states. */
.app-shell__main input:not([type="checkbox"]):not([type="radio"]),
.app-shell__main textarea,
.app-shell__main select {
  color: #173f3a !important;
  border-color: #bfd4cc !important;
  background: #fffefb !important;
  -webkit-text-fill-color: #173f3a !important;
  opacity: 1 !important;
}
.app-shell__main input::placeholder,
.app-shell__main textarea::placeholder { color: #657b76 !important; opacity: 1 !important; }
.app-shell__main button:focus-visible,
.app-shell__main a:focus-visible,
.app-shell__main input:focus-visible,
.app-shell__main select:focus-visible,
.app-shell__main textarea:focus-visible {
  outline: 3px solid #118b82 !important;
  outline-offset: 2px !important;
}
.app-shell__main button:disabled,
.app-shell__main input:disabled,
.app-shell__main select:disabled,
.app-shell__main textarea:disabled { opacity: .72 !important; }

@media (prefers-contrast: more) {
  .app-shell__main { --kp28-copy: #2f4c46; --kp28-muted: #3d5752; }
  .app-shell__main .page-card,
  .app-shell__main .metric-card { border-color: #a9c2b8 !important; }
}

@media print {
  .app-shell__main { color: #111827 !important; }
  .app-shell__main h1,.app-shell__main h2,.app-shell__main h3,
  .app-shell__main p,.app-shell__main span,.app-shell__main small { text-shadow: none !important; }
}
