/*
  Dynamic Agility Website
  Exercise detail-page colour themes

  Main page remains blue.
  Detail pages use a shared workbook look with one accent palette per main exercise.
*/

.da-exercise-theme-1 {
  --da-detail-ink: #1f1934;
  --da-detail-muted: #6f6684;
  --da-detail-muted-light: #968daf;
  --da-detail-paper: #fbf8ff;
  --da-detail-paper-soft: #f4efff;
  --da-detail-line: rgba(91, 33, 182, 0.13);
  --da-exercise-accent: #8b5cf6;
  --da-exercise-accent-dark: #5b21b6;
  --da-exercise-accent-soft: #ddd6fe;
  --da-exercise-bg: #f5f3ff;
  --da-exercise-accent-rgb: 139, 92, 246;
  --da-exercise-accent-soft-rgb: 221, 214, 254;
}

.da-exercise-theme-2 {
  --da-detail-ink: #102523;
  --da-detail-muted: #54706d;
  --da-detail-muted-light: #7f9995;
  --da-detail-paper: #f5fffb;
  --da-detail-paper-soft: #ecfdf5;
  --da-detail-line: rgba(15, 118, 110, 0.13);
  --da-exercise-accent: #0f766e;
  --da-exercise-accent-dark: #115e59;
  --da-exercise-accent-soft: #99f6e4;
  --da-exercise-bg: #ecfdf5;
  --da-exercise-accent-rgb: 15, 118, 110;
  --da-exercise-accent-soft-rgb: 153, 246, 228;
}

.da-exercise-theme-3 {
  --da-detail-ink: #251734;
  --da-detail-muted: #766583;
  --da-detail-muted-light: #9a8aaa;
  --da-detail-paper: #fff8f2;
  --da-detail-paper-soft: #fff3e7;
  --da-detail-line: rgba(249, 115, 22, 0.14);
  --da-exercise-accent: #f97316;
  --da-exercise-accent-dark: #c2410c;
  --da-exercise-accent-soft: #fed7aa;
  --da-exercise-bg: #fff7ed;
  --da-exercise-accent-rgb: 249, 115, 22;
  --da-exercise-accent-soft-rgb: 254, 215, 170;
}

.da-exercise-theme-4 {
  --da-detail-ink: #1d2817;
  --da-detail-muted: #657257;
  --da-detail-muted-light: #899a76;
  --da-detail-paper: #fbfff4;
  --da-detail-paper-soft: #f7fee7;
  --da-detail-line: rgba(101, 163, 13, 0.14);
  --da-exercise-accent: #65a30d;
  --da-exercise-accent-dark: #3f6212;
  --da-exercise-accent-soft: #d9f99d;
  --da-exercise-bg: #f7fee7;
  --da-exercise-accent-rgb: 101, 163, 13;
  --da-exercise-accent-soft-rgb: 217, 249, 157;
}

.da-exercise-theme-5 {
  --da-detail-ink: #13252d;
  --da-detail-muted: #56717a;
  --da-detail-muted-light: #7b9aa6;
  --da-detail-paper: #f5feff;
  --da-detail-paper-soft: #ecfeff;
  --da-detail-line: rgba(8, 145, 178, 0.14);
  --da-exercise-accent: #0891b2;
  --da-exercise-accent-dark: #164e63;
  --da-exercise-accent-soft: #a5f3fc;
  --da-exercise-bg: #ecfeff;
  --da-exercise-accent-rgb: 8, 145, 178;
  --da-exercise-accent-soft-rgb: 165, 243, 252;
}

.da-subpage[class*="da-exercise-theme-"] {
  color: var(--da-detail-ink);
  background:
    radial-gradient(circle at 10% 0%, rgba(var(--da-exercise-accent-soft-rgb), 0.38), transparent 30rem),
    radial-gradient(circle at 92% 10%, rgba(var(--da-exercise-accent-rgb), 0.13), transparent 34rem),
    linear-gradient(180deg, var(--da-detail-paper), var(--da-detail-paper-soft)) !important;
}

.da-subpage[class*="da-exercise-theme-"] .da-overline,
.da-subpage[class*="da-exercise-theme-"] .da-subpage-breadcrumbs a,
.da-subpage[class*="da-exercise-theme-"] .da-canvas-tip strong,
.da-subpage[class*="da-exercise-theme-"] .da-canvas-note strong,
.da-subpage[class*="da-exercise-theme-"] .da-facilitator-note strong {
  color: var(--da-exercise-accent);
}

.da-subpage[class*="da-exercise-theme-"] .da-subpage-hero h1 {
  background: linear-gradient(135deg, var(--da-detail-ink) 0%, var(--da-exercise-accent-dark) 54%, var(--da-exercise-accent) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.da-subpage[class*="da-exercise-theme-"] .da-subpage-section {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.14);
  background:
    radial-gradient(circle at 12% 0%, rgba(var(--da-exercise-accent-soft-rgb), 0.18), transparent 18rem),
    rgba(255, 255, 255, 0.68);
}

.da-subpage[class*="da-exercise-theme-"] .da-subpage-north-star,
.da-subpage[class*="da-exercise-theme-"] .da-output-section {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.16);
  background:
    radial-gradient(circle at 15% 0%, rgba(var(--da-exercise-accent-soft-rgb), 0.32), transparent 18rem),
    rgba(255, 255, 255, 0.74);
}

.da-subpage[class*="da-exercise-theme-"] .da-subpage-primary-action,
.da-subpage[class*="da-exercise-theme-"] .da-item-page-link,
.da-subpage[class*="da-exercise-theme-"] .da-five-field-list article > span,
.da-subpage[class*="da-exercise-theme-"] .da-map-core,
.da-subpage[class*="da-exercise-theme-"] .da-capacity-bar i {
  background: linear-gradient(135deg, var(--da-exercise-accent), var(--da-exercise-accent-dark)) !important;
  color: #fff;
}

.da-subpage[class*="da-exercise-theme-"] .da-subpage-secondary-action {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.24);
  background: rgba(255, 255, 255, 0.74);
  color: var(--da-detail-ink);
}

.da-subpage[class*="da-exercise-theme-"] .da-decision-question-grid article span,
.da-subpage[class*="da-exercise-theme-"] .da-timeline-grid article span,
.da-subpage[class*="da-exercise-theme-"] .da-marker-legend span,
.da-subpage[class*="da-exercise-theme-"] .da-canvas-hints span {
  background: rgba(var(--da-exercise-accent-soft-rgb), 0.62);
  color: var(--da-exercise-accent-dark);
}

.da-subpage[class*="da-exercise-theme-"] .da-decision-question-grid article,
.da-subpage[class*="da-exercise-theme-"] .da-five-field-list article,
.da-subpage[class*="da-exercise-theme-"] .da-output-grid article,
.da-subpage[class*="da-exercise-theme-"] .da-timeline-grid article,
.da-subpage[class*="da-exercise-theme-"] .da-prompt-columns article,
.da-subpage[class*="da-exercise-theme-"] .da-map-lanes article,
.da-subpage[class*="da-exercise-theme-"] .da-choice-grid article,
.da-subpage[class*="da-exercise-theme-"] .da-altitude-grid article {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.13);
  background: rgba(255, 255, 255, 0.76);
}

.da-subpage[class*="da-exercise-theme-"] .da-facilitator-note,
.da-subpage[class*="da-exercise-theme-"] .da-canvas-tip,
.da-subpage[class*="da-exercise-theme-"] .da-canvas-note,
.da-subpage[class*="da-exercise-theme-"] .da-working-rule,
.da-subpage[class*="da-exercise-theme-"] .da-output-statement,
.da-subpage[class*="da-exercise-theme-"] .da-formulation-card {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.22);
  border-left-color: var(--da-exercise-accent);
  background: rgba(var(--da-exercise-accent-soft-rgb), 0.34);
}

.da-subpage[class*="da-exercise-theme-"] .da-canvas-table th,
.da-subpage[class*="da-exercise-theme-"] .da-canvas-header {
  background: rgba(var(--da-exercise-accent-soft-rgb), 0.5);
  color: var(--da-exercise-accent-dark);
}

.da-subpage[class*="da-exercise-theme-"] .da-canvas-table td,
.da-subpage[class*="da-exercise-theme-"] .da-canvas-row > div {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.12);
}

.da-subpage[class*="da-exercise-theme-"] .da-subpage-closing {
  background:
    radial-gradient(circle at 12% 10%, rgba(var(--da-exercise-accent-soft-rgb), 0.30), transparent 20rem),
    linear-gradient(135deg, #171923, var(--da-exercise-accent-dark)) !important;
}

.da-subpage[class*="da-exercise-theme-"] .da-detail-sidebar {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.18);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(var(--da-exercise-accent-soft-rgb), 0.26)),
    rgba(255, 255, 255, 0.94);
}

.da-subpage[class*="da-exercise-theme-"] .da-detail-nav-group[open] {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.18);
  background: rgba(255, 255, 255, 0.72);
}

.da-subpage[class*="da-exercise-theme-"] .da-detail-nav-group .da-nav-number {
  background: linear-gradient(135deg, rgba(var(--da-exercise-accent-soft-rgb), 0.95), rgba(255, 255, 255, 0.78));
  color: var(--da-exercise-accent-dark);
}

.da-subpage[class*="da-exercise-theme-"] .da-detail-nav-subitem span {
  color: var(--da-exercise-accent);
}

.da-subpage[class*="da-exercise-theme-"] .da-detail-nav-subitem:hover,
.da-subpage[class*="da-exercise-theme-"] .da-detail-nav-subitem.is-active {
  background: rgba(var(--da-exercise-accent-soft-rgb), 0.42);
  color: var(--da-detail-ink);
}

.da-subpage[class*="da-exercise-theme-"] .da-detail-nav-subitem.is-active {
  box-shadow: inset 3px 0 0 var(--da-exercise-accent);
}

.da-subpage[class*="da-exercise-theme-"] .da-detail-sidebar-footer a {
  background: linear-gradient(135deg, var(--da-exercise-accent), var(--da-exercise-accent-dark));
}

/*
  Exercise 1 legacy page hooks
  The existing 1.x pages currently use page-specific classes instead of da-exercise-theme-1.
  Keep them purple/light-purple without touching each ERB file.
*/

.da-subpage:is(
  .da-landscape-page,
  .da-business-objectives-page,
  .da-initiatives-page,
  .da-capacity-page,
  .da-flow-problems-page
) {
  --da-detail-ink: #1f1934;
  --da-detail-muted: #6f6684;
  --da-detail-muted-light: #968daf;
  --da-detail-paper: #fbf8ff;
  --da-detail-paper-soft: #f4efff;
  --da-detail-line: rgba(91, 33, 182, 0.13);
  --da-exercise-accent: #8b5cf6;
  --da-exercise-accent-dark: #5b21b6;
  --da-exercise-accent-soft: #ddd6fe;
  --da-exercise-bg: #f5f3ff;
  --da-exercise-accent-rgb: 139, 92, 246;
  --da-exercise-accent-soft-rgb: 221, 214, 254;

  color: var(--da-detail-ink);
  background:
    radial-gradient(circle at 10% 0%, rgba(var(--da-exercise-accent-soft-rgb), 0.42), transparent 30rem),
    radial-gradient(circle at 92% 10%, rgba(var(--da-exercise-accent-rgb), 0.13), transparent 34rem),
    linear-gradient(180deg, var(--da-detail-paper), var(--da-detail-paper-soft)) !important;
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-overline,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-subpage-breadcrumbs a,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-tip strong,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-note strong,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-facilitator-note strong {
  color: var(--da-exercise-accent);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-subpage-hero h1 {
  background: linear-gradient(135deg, var(--da-detail-ink) 0%, var(--da-exercise-accent-dark) 54%, var(--da-exercise-accent) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-subpage-section {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.14);
  background:
    radial-gradient(circle at 12% 0%, rgba(var(--da-exercise-accent-soft-rgb), 0.20), transparent 18rem),
    rgba(255, 255, 255, 0.70);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-subpage-north-star,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-output-section {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.16);
  background:
    radial-gradient(circle at 15% 0%, rgba(var(--da-exercise-accent-soft-rgb), 0.34), transparent 18rem),
    rgba(255, 255, 255, 0.74);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-subpage-primary-action,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-item-page-link,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-five-field-list article > span,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-map-core,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-capacity-bar i {
  background: linear-gradient(135deg, var(--da-exercise-accent), var(--da-exercise-accent-dark)) !important;
  color: #fff;
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-subpage-secondary-action {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.24);
  background: rgba(255, 255, 255, 0.74);
  color: var(--da-detail-ink);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-decision-question-grid article span,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-timeline-grid article span,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-marker-legend span,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-hints span {
  background: rgba(var(--da-exercise-accent-soft-rgb), 0.62);
  color: var(--da-exercise-accent-dark);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-decision-question-grid article,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-five-field-list article,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-output-grid article,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-timeline-grid article,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-prompt-columns article,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-map-lanes article,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-choice-grid article,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-altitude-grid article {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.13);
  background: rgba(255, 255, 255, 0.76);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-facilitator-note,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-tip,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-note,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-working-rule,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-output-statement,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-formulation-card {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.22);
  border-left-color: var(--da-exercise-accent);
  background: rgba(var(--da-exercise-accent-soft-rgb), 0.34);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-table th,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-header {
  background: rgba(var(--da-exercise-accent-soft-rgb), 0.5);
  color: var(--da-exercise-accent-dark);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-table td,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-canvas-row > div {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.12);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-subpage-closing {
  background:
    radial-gradient(circle at 12% 10%, rgba(var(--da-exercise-accent-soft-rgb), 0.30), transparent 20rem),
    linear-gradient(135deg, #171923, var(--da-exercise-accent-dark)) !important;
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-detail-sidebar {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.18);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(var(--da-exercise-accent-soft-rgb), 0.30)),
    rgba(255, 255, 255, 0.94);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-detail-nav-group[open] {
  border-color: rgba(var(--da-exercise-accent-rgb), 0.18);
  background: rgba(255, 255, 255, 0.72);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-detail-nav-group .da-nav-number {
  background: linear-gradient(135deg, rgba(var(--da-exercise-accent-soft-rgb), 0.95), rgba(255, 255, 255, 0.78));
  color: var(--da-exercise-accent-dark);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-detail-nav-subitem span {
  color: var(--da-exercise-accent);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-detail-nav-subitem:hover,
.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-detail-nav-subitem.is-active {
  background: rgba(var(--da-exercise-accent-soft-rgb), 0.42);
  color: var(--da-detail-ink);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-detail-nav-subitem.is-active {
  box-shadow: inset 3px 0 0 var(--da-exercise-accent);
}

.da-subpage:is(.da-landscape-page, .da-business-objectives-page, .da-initiatives-page, .da-capacity-page, .da-flow-problems-page) .da-detail-sidebar-footer a {
  background: linear-gradient(135deg, var(--da-exercise-accent), var(--da-exercise-accent-dark));
}
