/* Dynamic Agility Website · Homepage alignment + detail themes */

@media (min-width: 1101px) {
  .da-exercise-page {
    display: block;
    padding-left: var(--da-sidebar-width, 22rem);
  }

  .da-exercise-content {
    width: min(76rem, calc(100% - 4rem));
    max-width: calc(100vw - var(--da-sidebar-width, 22rem) - 4rem);
    margin-inline: auto;
    padding-inline: 0;
  }

  .da-exercise-hero,
  .da-source-decks-section,
  .da-principle-strip,
  .da-exercise-section,
  .da-closing-panel {
    width: min(76rem, 100%);
    max-width: none;
    margin-right: auto;
    margin-left: auto;
  }
}

@media (max-width: 1100px) {
  .da-exercise-content {
    padding-right: clamp(1rem, 4vw, 2rem);
    padding-left: clamp(1rem, 4vw, 2rem);
  }
}

.da-subpage {
  --da-detail-paper: #fffaf3;
  --da-detail-ink: #18202f;
  --da-detail-muted: #687385;
  --da-detail-muted-light: #8a96a8;
  --da-exercise-accent: #d97706;
  --da-exercise-accent-dark: #92400e;
  --da-exercise-accent-soft: #fed7aa;
  --da-exercise-bg: #fff7ed;

  --da-ink: var(--da-detail-ink);
  --da-muted: var(--da-detail-muted);
  --da-muted-light: var(--da-detail-muted-light);
  --da-line: rgba(31, 41, 55, 0.13);
  --da-line-strong: rgba(31, 41, 55, 0.24);
  --da-paper: var(--da-exercise-bg);
  --da-paper-soft: var(--da-detail-paper);
  --da-accent: var(--da-exercise-accent);
  --da-accent-dark: var(--da-exercise-accent-dark);
  --da-accent-soft: var(--da-exercise-accent-soft);
  --da-dark: var(--da-detail-ink);
  --da-dark-2: var(--da-exercise-accent-dark);

  color: var(--da-detail-ink);
  background:
    radial-gradient(circle at 10% 0%, var(--da-exercise-accent-soft), transparent 30rem),
    linear-gradient(180deg, var(--da-detail-paper), var(--da-exercise-bg));
}

.da-landscape-page,
.da-business-objectives-page,
.da-initiatives-page,
.da-capacity-page,
.da-flow-problems-page,
.da-exercise-theme-1 {
  --da-exercise-accent: #d97706;
  --da-exercise-accent-dark: #92400e;
  --da-exercise-accent-soft: #fed7aa;
  --da-exercise-bg: #fff7ed;
}

.da-portfolio-page,
.da-initiative-contributions-page,
.da-execution-units-page,
.da-central-functions-page,
.da-supplier-partner-page,
.da-facilitation-page,
.da-exercise-theme-2 {
  --da-exercise-accent: #0f766e;
  --da-exercise-accent-dark: #115e59;
  --da-exercise-accent-soft: #99f6e4;
  --da-exercise-bg: #ecfdf5;
}

.da-exercise-theme-3 {
  --da-exercise-accent: #7c3aed;
  --da-exercise-accent-dark: #5b21b6;
  --da-exercise-accent-soft: #ddd6fe;
  --da-exercise-bg: #f5f3ff;
}

.da-exercise-theme-4 {
  --da-exercise-accent: #65a30d;
  --da-exercise-accent-dark: #3f6212;
  --da-exercise-accent-soft: #d9f99d;
  --da-exercise-bg: #f7fee7;
}

.da-exercise-theme-5 {
  --da-exercise-accent: #0891b2;
  --da-exercise-accent-dark: #164e63;
  --da-exercise-accent-soft: #a5f3fc;
  --da-exercise-bg: #ecfeff;
}

.da-subpage .da-overline,
.da-subpage .da-subpage-breadcrumbs a,
.da-subpage .da-detail-sidebar-brand .da-brand-link,
.da-subpage .da-detail-nav-subitem span,
.da-subpage .da-canvas-table th,
.da-subpage .da-canvas-hints span,
.da-subpage .da-facilitator-note strong,
.da-subpage .da-output-statement strong {
  color: var(--da-exercise-accent-dark);
}

.da-subpage .da-subpage-hero h1 {
  background: linear-gradient(135deg, var(--da-detail-ink) 0%, var(--da-exercise-accent-dark) 58%, var(--da-exercise-accent) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.da-subpage .da-subpage-primary-action,
.da-subpage .da-item-page-link,
.da-subpage .da-five-field-list article > span,
.da-subpage .da-map-core,
.da-subpage .da-capacity-bar i,
.da-subpage .da-detail-sidebar-footer a {
  background: linear-gradient(135deg, var(--da-exercise-accent), var(--da-exercise-accent-dark));
}

.da-subpage .da-detail-nav-subitem.is-active {
  box-shadow: inset 3px 0 0 var(--da-exercise-accent);
}

.da-subpage .da-detail-nav-subitem:hover,
.da-subpage .da-detail-nav-subitem.is-active,
.da-subpage .da-detail-nav-group[open],
.da-subpage .da-canvas-table th,
.da-subpage .da-canvas-table td,
.da-subpage .da-nav-number {
  background-color: var(--da-exercise-accent-soft);
}

.da-subpage .da-subpage-closing {
  background: linear-gradient(135deg, var(--da-detail-ink), var(--da-exercise-accent-dark));
}
