/*
 * Care Learning learner-facing design tokens.
 * This is the only learner CSS file that should contain literal brand colours.
 */
:root {
	--cl-ui-accent: #007da3;
	--cl-ui-accent-bright: #00afb9;
	--cl-ui-accent-dark: #006783;
	--cl-ui-accent-hover: #03485a;
	--cl-ui-pink: #e21270;
	--cl-ui-ink: #1f2937;
	--cl-ui-muted: #526373;
	--cl-ui-line: #d4e7ec;
	--cl-ui-surface: #ffffff;
	--cl-ui-panel: #eef9fb;
	--cl-ui-panel-strong: #e9f8fa;
	--cl-ui-page: #f3f8fa;
	--cl-ui-surface-soft: #f7fbfc;
	--cl-ui-shell-highlight: #e9f7f8;
	--cl-ui-shell-ink: #17232f;
	--cl-ui-shell-muted: #526273;
	--cl-ui-shell-line: #ccdce2;
	--cl-ui-focus: #ffbf47;
	--cl-ui-on-accent: #ffffff;
	--cl-ui-control-line: #b9cdd4;
	--cl-ui-banner-line: #c7edf1;
	--cl-ui-table-ink: #13232f;
	--cl-ui-header-start: #effafb;
	--cl-ui-note-bg: #fff0f5;
	--cl-ui-note-ink: #7c2546;
	--cl-ui-avatar-line: #9ccfd7;
	--cl-ui-avatar-ink: #07566c;
	--cl-ui-nav-ink: #074f64;
	--cl-ui-space-1: 4px;
	--cl-ui-space-2: 8px;
	--cl-ui-space-3: 12px;
	--cl-ui-space-4: 16px;
	--cl-ui-space-5: 24px;
	--cl-ui-space-6: 32px;
	--cl-ui-text-sm: .8125rem;
	--cl-ui-text-body: .9375rem;
	--cl-ui-text-heading: 1.25rem;
	--cl-ui-radius-control: 5px;
	--cl-ui-radius: 6px;
	--cl-ui-radius-card: 8px;
	--cl-ui-radius-shell: 14px;
	--cl-ui-shadow: 0 8px 18px rgba(0, 125, 163, 0.07);
	--cl-ui-shell-shadow: rgba(8, 59, 73, 0.12);
	--cl-ui-auth-shadow: 0 10px 28px rgba(8, 59, 73, 0.1);
	--cl-ui-overlay: rgba(10, 28, 36, 0.44);
	--cl-ui-drawer-shadow: -12px 0 36px rgba(0, 0, 0, 0.2);
	--cl-ui-a11y-high-surface: #ffffff;
	--cl-ui-a11y-high-ink: #000000;
	--cl-ui-a11y-high-line: #000000;
	--cl-ui-a11y-soft-surface: #fbfcfc;
	--cl-ui-a11y-soft-page: #f3f7f8;
	--cl-ui-a11y-soft-ink: #293944;
	--cl-ui-a11y-dark-surface: #13272f;
	--cl-ui-a11y-dark-panel: #1e3944;
	--cl-ui-a11y-dark-panel-strong: #284955;
	--cl-ui-a11y-dark-page: #0f1d24;
	--cl-ui-a11y-dark-ink: #f5fbfc;
	--cl-ui-a11y-dark-muted: #cedde2;
	--cl-ui-a11y-dark-line: #5f7c86;
	--cl-ui-a11y-dark-note-bg: #43283a;
	--cl-ui-a11y-dark-note-ink: #ffd7e8;
	--cl-ui-a11y-dark-avatar-line: #78bac6;
	--cl-ui-a11y-dark-avatar-ink: #d9f7fa;
	--cl-ui-a11y-dark-link: #86e6ed;
	--cl-ui-a11y-dark-action-pink: #b50e5b;
}

.clui-content-style--unified .clui-content { color: var(--cl-ui-ink); }

/* CL Brand Kit V1: opt-in palette, independent of every existing template. */
:is(.clss-template-cl-brand-kit-v1, .ldfhb-template-cl-brand-kit-v1, :is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)) {
 --cl-brand-v1-ink:#202b34; --cl-brand-v1-muted:#52616b;
 --cl-brand-v1-accent:#006783; --cl-brand-v1-on-accent:#fff;
 --cl-brand-v1-pink:#d40b65; --cl-brand-v1-line:#bad5dd;
 --cl-brand-v1-surface:#fff; --cl-brand-v1-soft:#f1f8f9; --cl-brand-v1-neutral:#f5f5f5;
 --cl-brand-v1-canvas:#fff; --cl-brand-v1-dashboard-canvas:#f3f8fa; --cl-brand-v1-pattern:transparent;
 --cl-brand-v1-radius:8px; --cl-brand-v1-control-radius:6px;
 --cl-brand-v1-body:'DM Sans',Arial,sans-serif;
 --cl-brand-v1-heading:Poppins,Arial,sans-serif;
 --cl-brand-v1-shadow:0 3px 12px rgba(0,103,131,.035);
}
:is(.clss-template-cl-brand-kit-v1, .ldfhb-template-cl-brand-kit-v1, :is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)).ldfhb-a11y-contrast-dark,
html.clui-a11y-contrast-dark :is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens) {
 --cl-brand-v1-ink:#e7f0f2; --cl-brand-v1-muted:#b6c9cf;
 --cl-brand-v1-accent:#83dcec; --cl-brand-v1-on-accent:#102026;
 --cl-brand-v1-pink:#ff8cbd; --cl-brand-v1-line:#45616a;
 --cl-brand-v1-surface:#182a32; --cl-brand-v1-soft:#213840; --cl-brand-v1-neutral:#292d30;
 --cl-brand-v1-canvas:#101e24; --cl-brand-v1-dashboard-canvas:#101e24; --cl-brand-v1-pattern:transparent;
}
@media (forced-colors:active) {
 :is(.clss-template-cl-brand-kit-v1, .ldfhb-template-cl-brand-kit-v1, :is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)) {
  --cl-brand-v1-ink:CanvasText; --cl-brand-v1-muted:CanvasText;
  --cl-brand-v1-accent:LinkText; --cl-brand-v1-on-accent:Canvas;
  --cl-brand-v1-pink:Highlight; --cl-brand-v1-line:CanvasText;
  --cl-brand-v1-surface:Canvas; --cl-brand-v1-soft:Canvas; --cl-brand-v1-neutral:Canvas;
  --cl-brand-v1-canvas:Canvas; --cl-brand-v1-dashboard-canvas:Canvas; --cl-brand-v1-pattern:transparent;
 }
}

/* V1 lesson shapes and purposeful strong surfaces. */
:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)) {
 --cl-brand-v1-strong:#102f3a;
 --cl-brand-v1-on-strong:#ffffff;
 --cl-brand-v1-strong-pattern:transparent;
 --cl-brand-v1-circles:none;
 --cl-brand-v1-heading-corner:color-mix(in srgb,var(--cl-ui-accent-bright) 9%,transparent);
 --cl-brand-v1-heading-decoration:radial-gradient(ellipse 116px 92px at 100% 0%,var(--cl-brand-v1-heading-corner) 0 99%,transparent 100%);
}
@media(forced-colors:active){:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)){--cl-brand-v1-strong:Canvas;--cl-brand-v1-on-strong:CanvasText;--cl-brand-v1-circles:none;}}

/* V1 motion: feedback, disclosure and orientation. Patterns never animate. */
:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)) {
 --cl-brand-v1-motion-press:100ms;
 --cl-brand-v1-motion-feedback:160ms;
 --cl-brand-v1-motion-disclose:200ms;
 --cl-brand-v1-motion-orient:280ms;
 --cl-brand-v1-ease:cubic-bezier(.2,0,0,1);
 --cl-brand-v1-ease-exit:cubic-bezier(.4,0,1,1);
}
:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)):is(.clss-studio-motion-off,.ldfhb-studio-motion-off,.clui-studio-motion-off,.ldfhb-a11y-reduced-motion,.clui-a11y-reduced-motion),
:is(.clui-a11y-reduced-motion,.ldfhb-a11y-reduced-motion) :is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)) {
 --cl-brand-v1-motion-press:0ms;--cl-brand-v1-motion-feedback:0ms;--cl-brand-v1-motion-disclose:0ms;--cl-brand-v1-motion-orient:0ms;
}
@media(prefers-reduced-motion:reduce){:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)){--cl-brand-v1-motion-press:0ms;--cl-brand-v1-motion-feedback:0ms;--cl-brand-v1-motion-disclose:0ms;--cl-brand-v1-motion-orient:0ms;}}

/* Approved S10A/S15A semantic status accents; reading backgrounds stay quiet. */
:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)){--cl-brand-v1-error:#a52843;--cl-brand-v1-warning:#835a0c;--cl-brand-v1-control-line:var(--cl-brand-v1-muted);}
:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1).ldfhb-a11y-contrast-dark,html.clui-a11y-contrast-dark :is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens){--cl-brand-v1-error:#ffb3c4;--cl-brand-v1-warning:#f0cc84;--cl-brand-v1-control-line:#789ba5;}
@media(forced-colors:active){:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)){--cl-brand-v1-error:CanvasText;--cl-brand-v1-warning:CanvasText;--cl-brand-v1-control-line:ButtonText;}}

/* The single Studio corner mark is decorative; accessibility modes can hide it. */
@media(forced-colors:active){:is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)){--cl-brand-v1-heading-decoration:none;}}
html.clui-a11y-low-distraction :is(.clss-template-cl-brand-kit-v1,.ldfhb-template-cl-brand-kit-v1,:is(.clui-template-cl-brand-kit-v1,.clui-notification-tokens)),.ldfhb-a11y-low-distraction {--cl-brand-v1-heading-decoration:none;}
