/* Coherent customer palette for the authenticated Mastery app.
   The selected company color stays the only chromatic accent. Neutral greys/navy
   remain structural colors; no LimaBravo teal is mixed into customer colors. */

body[style*="--customer-accent"]{
  --customer-accent-soft:color-mix(in srgb,var(--customer-accent) 10%,#fff);
  --customer-accent-soft-strong:color-mix(in srgb,var(--customer-accent) 20%,#fff);
  --customer-accent-line:color-mix(in srgb,var(--customer-accent) 42%,#d7dfe5);
  --customer-accent-strong:color-mix(in srgb,var(--customer-accent) 78%,#000);
  --customer-accent-deep:color-mix(in srgb,var(--customer-accent) 58%,#000);
  --customer-accent-text:color-mix(in srgb,var(--customer-accent) 42%,#000);
  --teal:var(--customer-accent-text);
  --teal2:var(--customer-accent-soft);
}

/* Exact company color for the important visual accents. */
body[style*="--customer-accent"] .btn.primary{
  background:var(--customer-accent);
  color:var(--customer-accent-on,#fff);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--customer-accent-on,#fff) 12%,transparent);
}
body[style*="--customer-accent"] .btn.primary:hover{
  background:var(--customer-accent-strong);
  color:var(--customer-accent-on,#fff);
}
body[style*="--customer-accent"] .progress-orb{
  background:conic-gradient(var(--customer-accent) var(--p,74%),#e9eef1 0);
}
body[style*="--customer-accent"] .slide-progress span{
  background:linear-gradient(90deg,var(--customer-accent),var(--customer-accent-strong));
}
body[style*="--customer-accent"] .reading-timer-track span,
body[style*="--customer-accent"] .mini-progress-track i,
body[style*="--customer-accent"] .seat-meter span,
body[style*="--customer-accent"] .card-dot{
  background:var(--customer-accent);
}
body[style*="--customer-accent"] input[type="checkbox"],
body[style*="--customer-accent"] input[type="radio"]{
  accent-color:var(--customer-accent-strong);
}

/* Filled controls use the selected hue with a server-computed readable foreground. */
body[style*="--customer-accent"] .module-num,
body[style*="--customer-accent"] .block-icon,
body[style*="--customer-accent"] .steps article>span,
body[style*="--customer-accent"] .knowledge-lock,
body[style*="--customer-accent"] .module-question-card legend span,
body[style*="--customer-accent"] .module-answer-options label.selected .answer-letter,
body[style*="--customer-accent"] .review-card.ok .review-status{
  background:var(--customer-accent);
  color:var(--customer-accent-on,#fff);
}

/* Large branded bands stay in one hue family. Darker shades are made with black,
   never navy/teal, so yellow remains yellow instead of turning green. */
body[style*="--customer-accent"] .context-banner,
body[style*="--customer-accent"] .org-policy-block,
body[style*="--customer-accent"] .lesson-finish.v2,
body[style*="--customer-accent"] .prompt-block{
  background:linear-gradient(135deg,var(--customer-accent),var(--customer-accent-strong));
  color:var(--customer-accent-on,#fff);
}
body[style*="--customer-accent"] .context-banner small,
body[style*="--customer-accent"] .context-banner strong,
body[style*="--customer-accent"] .context-banner p,
body[style*="--customer-accent"] .org-policy-block h2,
body[style*="--customer-accent"] .org-policy-grid small,
body[style*="--customer-accent"] .org-policy-grid strong,
body[style*="--customer-accent"] .org-policy-note,
body[style*="--customer-accent"] .lesson-finish.v2 h3,
body[style*="--customer-accent"] .lesson-finish.v2 p,
body[style*="--customer-accent"] .lesson-finish.v2 small,
body[style*="--customer-accent"] .prompt-block h2,
body[style*="--customer-accent"] .prompt-block p,
body[style*="--customer-accent"] .prompt-formula{
  color:var(--customer-accent-on,#fff);
}
body[style*="--customer-accent"] .context-banner p,
body[style*="--customer-accent"] .org-policy-note,
body[style*="--customer-accent"] .lesson-finish.v2 p{
  opacity:.82;
}
body[style*="--customer-accent"] .context-icon{
  background:color-mix(in srgb,var(--customer-accent-on,#fff) 16%,transparent);
  color:var(--customer-accent-on,#fff);
  border:1px solid color-mix(in srgb,var(--customer-accent-on,#fff) 18%,transparent);
}

/* CBT sidebar: selected company hue only; remove the former fixed green accents. */
body[style*="--customer-accent"] .cbt-side{
  background:linear-gradient(165deg,var(--customer-accent),var(--customer-accent-strong));
  color:var(--customer-accent-on,#fff);
}
body[style*="--customer-accent"] .cbt-side .back-link,
body[style*="--customer-accent"] .cbt-side>p,
body[style*="--customer-accent"] .cbt-side .language-badge span,
body[style*="--customer-accent"] .cbt-side .side-progress-copy span{
  color:var(--customer-accent-on,#fff);
  opacity:.72;
}
body[style*="--customer-accent"] .cbt-side .eyebrow,
body[style*="--customer-accent"] .cbt-side .language-badge strong,
body[style*="--customer-accent"] .cbt-side h2,
body[style*="--customer-accent"] .cbt-side .side-progress-copy strong{
  color:var(--customer-accent-on,#fff);
}
body[style*="--customer-accent"] .cbt-side .language-badge{
  border-color:color-mix(in srgb,var(--customer-accent-on,#fff) 18%,transparent);
  background:color-mix(in srgb,var(--customer-accent-on,#fff) 8%,transparent);
}
body[style*="--customer-accent"] .cbt-side .side-progress-copy{
  border-color:color-mix(in srgb,var(--customer-accent-on,#fff) 18%,transparent);
}
body[style*="--customer-accent"] .side-module-number{
  background:color-mix(in srgb,var(--customer-accent-on,#fff) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--customer-accent-on,#fff) 18%,transparent);
  color:var(--customer-accent-on,#fff);
}
body[style*="--customer-accent"] .side-dots span{
  background:color-mix(in srgb,var(--customer-accent-on,#fff) 18%,transparent);
}
body[style*="--customer-accent"] .side-dots span.seen{
  background:color-mix(in srgb,var(--customer-accent-on,#fff) 42%,transparent);
}
body[style*="--customer-accent"] .side-dots span.current{
  background:var(--customer-accent-on,#fff);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--customer-accent-on,#fff) 14%,transparent);
}

/* Soft states use tints of the same company color. */
body[style*="--customer-accent"] .organization-welcome,
body[style*="--customer-accent"] .module-card.completed,
body[style*="--customer-accent"] .exam-cta.ready,
body[style*="--customer-accent"] .takeaway,
body[style*="--customer-accent"] .review-choice.correct-choice,
body[style*="--customer-accent"] .knowledge-intro,
body[style*="--customer-accent"] .module-answer-options label.selected{
  background:var(--customer-accent-soft);
  border-color:var(--customer-accent-line);
}
body[style*="--customer-accent"] .organization-welcome{
  border-left-color:var(--customer-accent);
}
body[style*="--customer-accent"] .module-card:hover,
body[style*="--customer-accent"] .scenario-options button.correct,
body[style*="--customer-accent"] .module-answer-options label.selected{
  border-color:var(--customer-accent-line);
}

/* Accent text is a dark/light shade of the same hue, never a second brand color. */
body[style*="--customer-accent"] .eyebrow,
body[style*="--customer-accent"] .module-meta b,
body[style*="--customer-accent"] .portal-chip-row .portal-chip-accent,
body[style*="--customer-accent"] .portal-action-card b,
body[style*="--customer-accent"] .practice-badge,
body[style*="--customer-accent"] .practice-reveal summary,
body[style*="--customer-accent"] .account-contact-details a{
  color:var(--customer-accent-text);
}

/* Dashboard card labels/headings/icons remain neutral for readability, while the
   cards themselves keep the customer-color tint from production.css. */
body[style*="--customer-accent"] .portal-action-card small,
body[style*="--customer-accent"] .portal-action-card h2,
body[style*="--customer-accent"] .portal-action-icon{
  color:#5d6877;
}
body[style*="--customer-accent"] .portal-action-icon{
  background:rgba(93,104,119,.09);
}
body[style*="--customer-accent"] .organization-welcome small{
  color:#2f3742;
}

html[data-theme="dark"] body[style*="--customer-accent"]{
  --customer-accent-soft:color-mix(in srgb,var(--customer-accent) 14%,#101923);
  --customer-accent-soft-strong:color-mix(in srgb,var(--customer-accent) 22%,#101923);
  --customer-accent-line:color-mix(in srgb,var(--customer-accent) 42%,#31404d);
  --customer-accent-text:color-mix(in srgb,var(--customer-accent) 68%,#fff);
  --teal:var(--customer-accent-text);
  --teal2:var(--customer-accent-soft);
}
html[data-theme="dark"] body[style*="--customer-accent"] .progress-orb{
  background:conic-gradient(var(--customer-accent) var(--p,74%),#24323e 0);
}
html[data-theme="dark"] body[style*="--customer-accent"] .portal-action-card small,
html[data-theme="dark"] body[style*="--customer-accent"] .portal-action-card h2,
html[data-theme="dark"] body[style*="--customer-accent"] .portal-action-icon{
  color:#b9c3ce;
}
html[data-theme="dark"] body[style*="--customer-accent"] .portal-action-icon{
  background:rgba(185,195,206,.09);
}
html[data-theme="dark"] body[style*="--customer-accent"] .organization-welcome small{
  color:#d6dde5;
}