/* =========================================================
   AXQA CLIENT DASHBOARD MARKETING PAGE
   Project-scoped stakeholder visibility.
   ========================================================= */

.cdb-page {
  --cdb-panel: #101a2d;
  --cdb-panel-2: #152139;
  --cdb-panel-soft: rgba(255,255,255,.035);
  --cdb-line: rgba(132,156,196,.15);
  --cdb-text: #edf4fc;
  --cdb-muted: #8b9db4;
  --cdb-dim: #64778f;
  --cdb-violet: #7d6dff;
  --cdb-teal: #39d7c7;
  --cdb-green: #2ac17e;
  --cdb-red: #ff5876;
  --cdb-amber: #f4b955;
  --cdb-cyan: #39c9ee;
}

.cdb-page .cdb-disclosure {
  margin: 22px 0 0;
  color: var(--cdb-dim);
  font-size: .78rem;
  line-height: 1.6;
}

.cdb-page .cdb-wide-lead {
  max-width: 820px;
}

/* Hero dashboard */
.cdb-hero-dashboard {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(130,160,201,.13);
  border-radius: 24px;
  background:
    radial-gradient(circle at 16% 0, rgba(125,109,255,.18), transparent 33%),
    radial-gradient(circle at 100% 18%, rgba(57,215,199,.10), transparent 30%),
    linear-gradient(160deg, #142038, #0c1627 72%);
  box-shadow: 0 32px 80px rgba(0,0,0,.42);
}

.cdb-hero-dashboard::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(255,255,255,.03), transparent 25%);
  pointer-events: none;
}

.cdb-window-head,
.cdb-project-title,
.cdb-panel-heading,
.cdb-activity-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.cdb-window-head {
  padding: 17px 18px;
  border-bottom: 1px solid var(--cdb-line);
}

.cdb-window-head > div small,
.cdb-project-title small,
.cdb-panel-heading small,
.cdb-activity-head small {
  display: block;
  color: var(--cdb-dim);
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.cdb-window-head > div strong {
  display: block;
  margin-top: 3px;
  color: var(--cdb-text);
  font-size: .92rem;
}

.cdb-connected,
.cdb-panel-heading > span,
.cdb-activity-head > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 9px;
  border: 1px solid rgba(130,160,201,.14);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: #a9b7ca;
  font-size: .68rem;
  white-space: nowrap;
}

.cdb-connected i,
.cdb-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--cdb-teal);
  box-shadow: 0 0 14px rgba(57,215,199,.62);
}

.cdb-project-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 12px 18px 2px;
}

.cdb-project-meta span {
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: var(--cdb-muted);
  font-size: .64rem;
}

.cdb-project-meta strong {
  color: #d8e2f0;
  font-weight: 600;
}

.cdb-hero-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 7px;
  padding: 14px 18px;
}

.cdb-hero-kpis > div {
  padding: 11px;
  border: 1px solid rgba(130,160,201,.1);
  border-radius: 11px;
  background: rgba(5,14,25,.46);
}

.cdb-hero-kpis small,
.cdb-hero-kpis strong {
  display: block;
}

.cdb-hero-kpis small {
  color: var(--cdb-dim);
  font-size: .62rem;
}

.cdb-hero-kpis strong {
  margin-top: 3px;
  color: #eef4fc;
  font-size: 1.18rem;
}

.cdb-hero-kpis .good strong {
  color: #52d59c;
}

.cdb-hero-chart {
  margin: 0 18px 18px;
  padding: 13px;
  border: 1px solid rgba(130,160,201,.1);
  border-radius: 14px;
  background: rgba(5,14,25,.42);
}

.cdb-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}

.cdb-chart-head span {
  color: #d9e3f0;
  font-size: .72rem;
  font-weight: 700;
}

.cdb-chart-head small {
  color: var(--cdb-dim);
  font-size: .62rem;
}

.cdb-hero-chart svg,
.cdb-trend-svg svg {
  display: block;
  width: 100%;
  height: auto;
}

.cdb-grid line {
  stroke: rgba(132,156,196,.10);
  stroke-width: 1;
}

.cdb-line {
  fill: none;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cdb-line.total { stroke: #778597; }
.cdb-line.pass { stroke: #27935f; }
.cdb-line.fail { stroke: #ef4166; }
.cdb-line.info { stroke: #36c9ee; }

/* Metrics strip */
.cdb-metrics-strip .metric-cell .val span {
  font-size: .42em;
  color: #8293a9;
}

/* Main project shell */
.cdb-project-shell {
  margin-top: 34px;
}

.cdb-project-header-card,
.cdb-kpi-card,
.cdb-trend-panel,
.cdb-health-panel,
.cdb-signal-card,
.cdb-label-card,
.cdb-mapping-card,
.cdb-activity-shell,
.cdb-control-list > div {
  border: 1px solid var(--cdb-line);
  background: linear-gradient(160deg, rgba(19,31,53,.98), rgba(10,19,33,.98));
  box-shadow: 0 24px 60px rgba(0,0,0,.18);
}

.cdb-project-header-card {
  padding: 18px;
  border-radius: 20px;
  background:
    radial-gradient(circle at 10% 0, rgba(125,109,255,.14), transparent 32%),
    radial-gradient(circle at 100% 0, rgba(57,215,199,.09), transparent 30%),
    linear-gradient(160deg, rgba(19,31,53,.98), rgba(10,19,33,.98));
}

.cdb-project-title {
  justify-content: flex-start;
}

.cdb-project-title > div strong {
  display: block;
  margin-top: 3px;
  color: var(--cdb-text);
  font-size: 1rem;
}

.cdb-header-actions {
  float: right;
  display: flex;
  gap: 7px;
  margin-top: -34px;
}

.cdb-header-actions span {
  padding: 6px 10px;
  border: 1px solid rgba(130,160,201,.17);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: #cad5e4;
  font-size: .68rem;
}

.cdb-project-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 15px;
}

.cdb-project-badges span {
  padding: 6px 10px;
  border: 1px solid rgba(130,160,201,.13);
  border-radius: 999px;
  color: #a6b4c8;
  background: rgba(255,255,255,.03);
  font-size: .68rem;
}

.cdb-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 12px;
  margin-top: 14px;
}

.cdb-kpi-card {
  position: relative;
  min-height: 152px;
  padding: 17px;
  border-radius: 16px;
}

.cdb-kpi-card > span {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(130,160,201,.14);
  border-radius: 10px;
  color: #adb8cb;
  background: rgba(255,255,255,.035);
}

.cdb-kpi-card > small {
  display: block;
  color: var(--cdb-dim);
  font-size: .64rem;
  letter-spacing: .08em;
}

.cdb-kpi-card > strong {
  display: block;
  margin: 7px 0 3px;
  color: #eef4fc;
  font-size: 1.55rem;
}

.cdb-kpi-card.positive > strong {
  color: #42c98b;
}

.cdb-kpi-card p {
  margin: 0;
  color: var(--cdb-muted);
  font-size: .73rem;
  line-height: 1.55;
}

.cdb-project-main-grid {
  display: grid;
  grid-template-columns: minmax(0,1.7fr) minmax(300px,.9fr);
  gap: 14px;
  margin-top: 14px;
}

.cdb-trend-panel,
.cdb-health-panel {
  border-radius: 18px;
  padding: 18px;
}

.cdb-panel-heading > div h3,
.cdb-activity-head h3 {
  margin: 3px 0 0;
  color: #edf4fc;
  font-size: 1rem;
}

.cdb-trend-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  margin: 15px 0 2px;
  color: #97a8bc;
  font-size: .68rem;
}

.cdb-trend-legend span,
.cdb-donut-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.cdb-trend-legend i,
.cdb-donut-legend i {
  width: 20px;
  height: 5px;
  border-radius: 99px;
  background: #778597;
}

.cdb-trend-legend i.pass,
.cdb-donut-legend i.pass { background: #27935f; }
.cdb-trend-legend i.fail,
.cdb-donut-legend i.fail { background: #e53d61; }
.cdb-trend-legend i.info { background: #36c9ee; }
.cdb-donut-legend i.idle { background: #5c6a80; }

.cdb-trend-svg {
  margin-top: 8px;
  padding: 10px;
  border: 1px solid rgba(130,160,201,.10);
  border-radius: 14px;
  background: rgba(255,255,255,.02);
}

.cdb-health-panel {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.cdb-health-card {
  padding: 16px;
  border: 1px solid rgba(130,160,201,.11);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
}

.cdb-health-card > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.cdb-health-card span,
.cdb-health-card small {
  color: var(--cdb-muted);
}

.cdb-health-card strong {
  color: #edf4fc;
}

.cdb-health-card small {
  display: block;
  margin-top: 8px;
  font-size: .69rem;
  line-height: 1.45;
}

.cdb-progress {
  height: 7px;
  margin-top: 10px;
  border-radius: 999px;
  background: #243249;
  overflow: hidden;
}

.cdb-progress b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg,#27935f,#39c980);
}

.cdb-progress b.full { width: 100%; }

/* Dark signal section */
.cdb-dark-section {
  position: relative;
  background:
    radial-gradient(circle at 14% 0, rgba(125,109,255,.08), transparent 28%),
    linear-gradient(180deg,#0b1424,#10192a 66%,#0c1626);
  border-top: 1px solid rgba(130,160,201,.08);
  border-bottom: 1px solid rgba(130,160,201,.08);
}

.cdb-dark-section .section-heading {
  color: #edf4fc;
}

.cdb-dark-section .section-lead {
  color: #899ab1;
}

.cdb-signal-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1.15fr;
  gap: 14px;
  margin-top: 34px;
}

.cdb-signal-card,
.cdb-label-card,
.cdb-mapping-card {
  border-radius: 18px;
  padding: 18px;
}

.cdb-donut-wrap {
  display: grid;
  grid-template-columns: 170px 1fr;
  align-items: center;
  gap: 16px;
  margin-top: 18px;
}

.cdb-donut,
.cdb-mini-donut {
  position: relative;
  border-radius: 50%;
  background: conic-gradient(#27935f 0 100%);
}

.cdb-donut {
  width: 165px;
  aspect-ratio: 1;
}

.cdb-donut::before,
.cdb-mini-donut::before {
  content: "";
  position: absolute;
  inset: 28%;
  border-radius: 50%;
  background: #101a2d;
}

.cdb-donut > span,
.cdb-mini-donut > span {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-content: center;
  text-align: center;
  color: #edf4fc;
  font-weight: 700;
}

.cdb-donut span small,
.cdb-mini-donut span small {
  display: block;
  color: var(--cdb-muted);
  font-size: .58rem;
  font-weight: 500;
}

.cdb-donut-legend {
  display: grid;
  gap: 10px;
  color: var(--cdb-muted);
  font-size: .7rem;
}

.cdb-quality-list {
  display: grid;
  gap: 9px;
  margin-top: 18px;
}

.cdb-quality-list > div {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(130,160,201,.10);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
}

.cdb-quality-list > div > span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 10px;
}

.cdb-quality-list .good { color: #42d59b; background: rgba(42,193,126,.10); }
.cdb-quality-list .watch { color: #f4bd5b; background: rgba(244,185,85,.10); }
.cdb-quality-list .info { color: #8f82ff; background: rgba(125,109,255,.12); }

.cdb-quality-list strong,
.cdb-quality-list small {
  display: block;
}

.cdb-quality-list strong {
  color: #e6eef8;
  font-size: .76rem;
}

.cdb-quality-list small {
  margin-top: 3px;
  color: var(--cdb-muted);
  font-size: .64rem;
  line-height: 1.45;
}

.cdb-api-bars {
  display: grid;
  gap: 11px;
  margin-top: 19px;
}

.cdb-api-bars > div {
  display: grid;
  grid-template-columns: 105px 1fr 34px;
  align-items: center;
  gap: 8px;
  font-size: .67rem;
}

.cdb-api-bars span { color: #a8b6c9; }
.cdb-api-bars strong { color: #dbe5f1; font-size: .65rem; }
.cdb-api-bars i {
  height: 12px;
  border-radius: 4px;
  background: rgba(255,255,255,.035);
  overflow: hidden;
}
.cdb-api-bars b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg,#4f7fcf,#5e8fe1);
}
.cdb-api-bars .bar-100 { width:100%; }
.cdb-api-bars .bar-99 { width:99%; }
.cdb-api-bars .bar-98 { width:98%; }
.cdb-api-bars .bar-97 { width:97%; }
.cdb-api-bars .bar-95 { width:95%; }

.cdb-mapping-grid {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 14px;
  margin-top: 14px;
}

.cdb-label-chart {
  display: grid;
  grid-template-columns: 160px 1fr;
  align-items: center;
  gap: 20px;
  margin-top: 18px;
}

.cdb-mini-donut {
  width: 150px;
  aspect-ratio: 1;
}

.cdb-label-copy strong {
  color: #eaf2fb;
  font-size: 1rem;
}

.cdb-label-copy p {
  margin: 5px 0 0;
  color: var(--cdb-muted);
  font-size: .7rem;
  line-height: 1.6;
}

.cdb-map-table {
  margin-top: 17px;
}

.cdb-map-table > div {
  display: grid;
  grid-template-columns: 1.2fr .45fr .7fr;
  align-items: center;
  gap: 10px;
  padding: 8px 4px;
  border-bottom: 1px solid rgba(130,160,201,.11);
  color: #b8c5d5;
  font-size: .72rem;
}

.cdb-map-table > div:last-child { border-bottom: 0; }
.cdb-map-table .head { color: #f0f4fa; font-weight: 700; }
.cdb-map-table b {
  justify-self: start;
  padding: 3px 7px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 6px;
  color: #fff;
  font-size: .62rem;
}
.cdb-map-table b.passed { background:#288f5f; }
.cdb-map-table b.failed { background:#df3558; }
.cdb-map-table b.error { background:#252b35; }
.cdb-map-table b.skipped { background:#6a7685; }
.cdb-map-table b.neutral { background:#f3f5f7; color:#202631; }

/* Activity */
.cdb-activity-shell {
  margin-top: 34px;
  padding: 20px;
  border-radius: 20px;
}

.cdb-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 18px 0 16px;
}

.cdb-tabs button {
  appearance: none;
  -webkit-appearance: none;
  padding: 7px 12px;
  border: 1px solid rgba(130,160,201,.16);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: #aab8ca;
  font: inherit;
  font-size: .72rem;
  cursor: pointer;
  transition: .2s ease;
}

.cdb-tabs button:hover,
.cdb-tabs button.active {
  border-color: rgba(125,109,255,.44);
  background: rgba(125,109,255,.12);
  color: #fff;
}

.cdb-tabs button span {
  margin-left: 4px;
  padding: 1px 5px;
  border-radius: 999px;
  background: rgba(244,185,85,.13);
  color: #f5c66f;
}

.cdb-tab-panel[hidden] { display:none!important; }

.cdb-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(130,160,201,.10);
  border-radius: 13px;
}

.cdb-activity-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  color: #c7d2df;
  font-size: .72rem;
}

.cdb-activity-table th,
.cdb-activity-table td {
  padding: 11px 12px;
  border-bottom: 1px solid rgba(130,160,201,.09);
  text-align: left;
}

.cdb-activity-table th {
  background: rgba(255,255,255,.035);
  color: #dfe7f2;
  font-size: .67rem;
  letter-spacing: .03em;
}

.cdb-activity-table tbody tr:last-child td { border-bottom:0; }
.cdb-activity-table tbody tr:hover { background: rgba(255,255,255,.02); }
.cdb-activity-table td:first-child { color:#9caec4; }
.cdb-activity-table td:nth-child(2) { color:#edf3fa; }

.cdb-status {
  display: inline-flex;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: .64rem;
}
.cdb-status.passed { color:#52d59c; background:rgba(42,193,126,.09); border:1px solid rgba(42,193,126,.20); }

.cdb-risk-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.cdb-risk-summary article {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  gap: 12px;
  align-items: start;
  padding: 16px;
  border: 1px solid rgba(130,160,201,.10);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
}

.cdb-risk-summary article > span {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 11px;
}
.cdb-risk-summary .watch { color:#f4b955; background:rgba(244,185,85,.10); }
.cdb-risk-summary .info { color:#8f82ff; background:rgba(125,109,255,.11); }
.cdb-risk-summary small,
.cdb-risk-summary strong { display:block; }
.cdb-risk-summary small { color:var(--cdb-dim); font-size:.61rem; letter-spacing:.08em; }
.cdb-risk-summary strong { margin-top:3px; color:#edf3fa; font-size:.8rem; }
.cdb-risk-summary p { margin:4px 0 0; color:var(--cdb-muted); font-size:.68rem; line-height:1.55; }
.cdb-risk-summary article > b { padding:4px 8px; border-radius:999px; background:rgba(125,109,255,.10); color:#b7adff; font-size:.62rem; }

/* Controls */
.cdb-control-section {
  padding-top: 22px;
}

.cdb-control-grid {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 42px;
  align-items: center;
}

.cdb-control-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
}

.cdb-control-list > div {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 11px;
  padding: 15px;
  border-radius: 14px;
}

.cdb-control-list > div > span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: rgba(125,109,255,.10);
  color: #9a8dff;
}

.cdb-control-list strong,
.cdb-control-list small { display:block; }
.cdb-control-list strong { color:#e8eff8; font-size:.77rem; }
.cdb-control-list small { margin-top:4px; color:var(--cdb-muted); font-size:.66rem; line-height:1.5; }

/* Final CTA */
.cdb-final-section { padding-top: 26px; }

.cdb-final-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding: 30px;
  border: 1px solid rgba(130,160,201,.13);
  border-radius: 22px;
  background:
    radial-gradient(circle at 85% 10%, rgba(57,215,199,.08), transparent 28%),
    radial-gradient(circle at 20% 0, rgba(125,109,255,.14), transparent 34%),
    linear-gradient(160deg,#111d31,#0a1525);
  box-shadow:0 28px 70px rgba(0,0,0,.22);
}

.cdb-final-card h2 {
  margin: 5px 0 10px;
  color: #edf4fc;
  font-family: Georgia, serif;
  font-size: 2rem;
  line-height: 1.2;
}

.cdb-final-card h2 em { color:#a996ff; }
.cdb-final-card p { max-width:720px; margin:0; color:#899ab0; }
.cdb-final-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; flex:0 0 auto; }

.cdb-final-card .btn-ghost {
  color:#aeb6ff!important;
  background:rgba(91,106,245,.08)!important;
  border-color:rgba(123,135,255,.34)!important;
}
.cdb-final-card .btn-ghost:hover,
.cdb-final-card .btn-ghost:focus-visible {
  color:#fff!important;
  background:rgba(91,106,245,.18)!important;
  border-color:rgba(139,148,255,.58)!important;
}

/* =========================================================
   LIGHT MODE
   Keep technical previews dark where they represent the app,
   while the surrounding marketing page follows AXQA light mode.
   ========================================================= */

html[data-theme="light"] .cdb-page {
  --cdb-line: rgba(65,81,108,.14);
}

html[data-theme="light"] .cdb-page .cdb-project-header-card,
html[data-theme="light"] .cdb-page .cdb-kpi-card,
html[data-theme="light"] .cdb-page .cdb-trend-panel,
html[data-theme="light"] .cdb-page .cdb-health-panel,
html[data-theme="light"] .cdb-page .cdb-activity-shell,
html[data-theme="light"] .cdb-page .cdb-control-list > div {
  background:#fff;
  border-color:rgba(65,81,108,.14);
  box-shadow:0 18px 55px rgba(31,42,63,.07);
}

html[data-theme="light"] .cdb-page .cdb-project-header-card {
  background:
    radial-gradient(circle at 10% 0, rgba(125,109,255,.07), transparent 31%),
    radial-gradient(circle at 100% 0, rgba(57,215,199,.06), transparent 30%),
    #fff;
}

html[data-theme="light"] .cdb-page .cdb-project-title > div strong,
html[data-theme="light"] .cdb-page .cdb-kpi-card > strong,
html[data-theme="light"] .cdb-page .cdb-panel-heading > div h3,
html[data-theme="light"] .cdb-page .cdb-activity-head h3,
html[data-theme="light"] .cdb-page .cdb-health-card strong,
html[data-theme="light"] .cdb-page .cdb-activity-table td:nth-child(2),
html[data-theme="light"] .cdb-page .cdb-risk-summary strong,
html[data-theme="light"] .cdb-page .cdb-control-list strong {
  color:#172033;
}

html[data-theme="light"] .cdb-page .cdb-project-title small,
html[data-theme="light"] .cdb-page .cdb-panel-heading small,
html[data-theme="light"] .cdb-page .cdb-activity-head small,
html[data-theme="light"] .cdb-page .cdb-kpi-card > small,
html[data-theme="light"] .cdb-page .cdb-health-card span,
html[data-theme="light"] .cdb-page .cdb-health-card small,
html[data-theme="light"] .cdb-page .cdb-activity-table td:first-child,
html[data-theme="light"] .cdb-page .cdb-control-list small,
html[data-theme="light"] .cdb-page .cdb-risk-summary p {
  color:#66758b;
}

html[data-theme="light"] .cdb-page .cdb-header-actions span,
html[data-theme="light"] .cdb-page .cdb-project-badges span,
html[data-theme="light"] .cdb-page .cdb-panel-heading > span,
html[data-theme="light"] .cdb-page .cdb-activity-head > span,
html[data-theme="light"] .cdb-page .cdb-tabs button {
  color:#536278;
  background:#f7f9fc;
  border-color:rgba(65,81,108,.14);
}

html[data-theme="light"] .cdb-page .cdb-tabs button:hover,
html[data-theme="light"] .cdb-page .cdb-tabs button.active {
  color:#5548c9;
  background:#f0edff;
  border-color:rgba(101,91,209,.28);
}

html[data-theme="light"] .cdb-page .cdb-trend-svg,
html[data-theme="light"] .cdb-page .cdb-health-card,
html[data-theme="light"] .cdb-page .cdb-risk-summary article {
  background:#f7f9fc;
  border-color:rgba(65,81,108,.10);
}

html[data-theme="light"] .cdb-page .cdb-progress { background:#e4e9f0; }

html[data-theme="light"] .cdb-page .cdb-activity-table {
  color:#536278;
}

html[data-theme="light"] .cdb-page .cdb-activity-table th {
  color:#24334a;
  background:#f3f6fa;
}

html[data-theme="light"] .cdb-page .cdb-activity-table th,
html[data-theme="light"] .cdb-page .cdb-activity-table td {
  border-bottom-color:rgba(65,81,108,.10);
}

html[data-theme="light"] .cdb-page .cdb-control-list > div > span {
  color:#655bd1;
  background:rgba(98,82,222,.08);
}

/* Keep actual dashboard-style previews dark in both themes. */
html[data-theme="light"] .cdb-page .cdb-hero-dashboard,
html[data-theme="light"] .cdb-page .cdb-dark-section .cdb-signal-card,
html[data-theme="light"] .cdb-page .cdb-dark-section .cdb-label-card,
html[data-theme="light"] .cdb-page .cdb-dark-section .cdb-mapping-card,
html[data-theme="light"] .cdb-page .cdb-final-card {
  color-scheme:dark;
}

html[data-theme="light"] .cdb-page .cdb-dark-section .section-heading,
html[data-theme="light"] .cdb-page .cdb-dark-section .cdb-panel-heading h3,
html[data-theme="light"] .cdb-page .cdb-final-card h2 {
  color:#edf4fc!important;
}

html[data-theme="light"] .cdb-page .cdb-dark-section .section-lead,
html[data-theme="light"] .cdb-page .cdb-final-card p {
  color:#899ab0!important;
}

/* Responsive */
@media (max-width:1100px) {
  .cdb-kpi-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .cdb-project-main-grid,
  .cdb-control-grid { grid-template-columns:1fr; }
  .cdb-signal-grid { grid-template-columns:1fr 1fr; }
  .cdb-api-card { grid-column:1/-1; }
  .cdb-mapping-grid { grid-template-columns:1fr; }
  .cdb-final-card { display:block; }
  .cdb-final-actions { justify-content:flex-start; margin-top:20px; }
}

@media (max-width:760px) {
  .cdb-hero-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cdb-kpi-grid,
  .cdb-signal-grid,
  .cdb-control-list,
  .cdb-risk-summary { grid-template-columns:1fr; }
  .cdb-api-card { grid-column:auto; }
  .cdb-header-actions { float:none; margin:13px 0 0; }
  .cdb-project-badges { margin-top:12px; }
  .cdb-donut-wrap,
  .cdb-label-chart { grid-template-columns:1fr; }
  .cdb-donut,
  .cdb-mini-donut { margin:0 auto; }
  .cdb-api-bars > div { grid-template-columns:95px 1fr 32px; }
  .cdb-map-table > div { grid-template-columns:1fr .45fr .72fr; }
  .cdb-final-card { padding:24px; }
  .cdb-final-card h2 { font-size:1.65rem; }
}

@media (max-width:520px) {
  .cdb-hero-kpis { grid-template-columns:1fr 1fr; }
  .cdb-window-head { align-items:flex-start; }
  .cdb-project-meta { gap:5px; }
  .cdb-kpi-grid { grid-template-columns:1fr 1fr; }
  .cdb-kpi-card:last-child { grid-column:1/-1; }
  .cdb-activity-shell { padding:14px; }
}
