:root {
    --courseflare-primary-dark: #102f5d;
    --courseflare-primary: #0f5ef7;
    --courseflare-primary-soft: #eef6ff;
    --courseflare-primary-text: #1453b8;
    --courseflare-primary-border: #d8e5fa;
    --courseflare-heading: #132a4b;
}

.courseflare-ui .courseflare-dashboard__header,
.courseflare-ui .courseflare-lesson__header {
    background: linear-gradient(135deg, var(--courseflare-primary-dark) 0%, var(--courseflare-primary) 100%);
}

.courseflare-ui .courseflare-button:not(.courseflare-button--secondary):not(.courseflare-button--locked):not(.courseflare-button--completed),
.courseflare-product-page .courseflare-product-button,
.courseflare-product-page .courseflare-product-start-decal {
    background: linear-gradient(135deg, var(--courseflare-primary-dark) 0%, var(--courseflare-primary) 100%);
    border-color: var(--courseflare-primary);
}

.courseflare-ui .courseflare-button:not(.courseflare-button--secondary):not(.courseflare-button--locked):not(.courseflare-button--completed):hover,
.courseflare-ui .courseflare-button:not(.courseflare-button--secondary):not(.courseflare-button--locked):not(.courseflare-button--completed):focus,
.courseflare-product-page .courseflare-product-button:hover,
.courseflare-product-page .courseflare-product-button:focus,
.courseflare-product-page .courseflare-product-start-decal:hover,
.courseflare-product-page .courseflare-product-start-decal:focus {
    background: linear-gradient(135deg, color-mix(in srgb, var(--courseflare-primary-dark) 88%, #000 12%) 0%, color-mix(in srgb, var(--courseflare-primary) 88%, #000 12%) 100%);
    border-color: color-mix(in srgb, var(--courseflare-primary) 88%, #000 12%);
}

.courseflare-ui .courseflare-button--secondary,
.courseflare-product-page .courseflare-product-pill,
.courseflare-product-page .courseflare-product-lesson-row__number,
.courseflare-product-page .courseflare-product-status-pill,
.courseflare-product-page .courseflare-product-plan-row__number,
.courseflare-dashboard-lesson-row__marker,
.courseflare-plan-card__header strong,
.courseflare-pack-switcher > div span {
    color: var(--courseflare-primary-text);
}

.courseflare-ui .courseflare-button--secondary,
.courseflare-product-page .courseflare-product-pill,
.courseflare-dashboard-lesson-row__marker,
.courseflare-plan-card__header strong {
    background-color: var(--courseflare-primary-soft);
    border-color: var(--courseflare-primary-border);
}

.courseflare-product-page .courseflare-product-logo,
.courseflare-product-page .courseflare-product-pill--primary,
.courseflare-product-page .courseflare-product-plan-row__number {
    background: var(--courseflare-primary-dark);
    border-color: var(--courseflare-primary-dark);
    color: #ffffff;
}

.courseflare-product-page .courseflare-offer-card__accent,
.courseflare-product-page .courseflare-enrollment-card__accent {
    background: linear-gradient(90deg, var(--courseflare-primary-dark), var(--courseflare-primary));
}

.courseflare-ui .courseflare-progress span {
    background: linear-gradient(90deg, #22a06b 0%, var(--courseflare-primary) 100%);
}

.courseflare-ui .courseflare-dashboard-lesson-row:hover,
.courseflare-ui .courseflare-dashboard-lesson-row:focus,
.courseflare-product-page .courseflare-product-lesson-row:hover,
.courseflare-product-page .courseflare-product-lesson-row:focus {
    background: var(--courseflare-primary-soft);
}

.courseflare-ui .courseflare-plan-card__header h3,
.courseflare-ui .courseflare-pack-switcher strong,
.courseflare-product-page .courseflare-product-hero h1,
.courseflare-product-page .courseflare-feature-table-card__title,
.courseflare-product-page .courseflare-product-plan-card h2,
.courseflare-product-page .courseflare-offer-card__title {
    color: var(--courseflare-heading);
}

.courseflare-student-app-body,
.courseflare-student-app {
    background:
        radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--courseflare-primary-soft) 82%, #ffffff 18%) 0, transparent 30%),
        linear-gradient(135deg, color-mix(in srgb, var(--courseflare-primary-soft) 78%, #ffffff 22%) 0%, #ffffff 54%, color-mix(in srgb, var(--courseflare-primary-border) 48%, #ffffff 52%) 100%) !important;
}

.courseflare-student-shell {
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--courseflare-primary-soft) 72%, #ffffff 28%) 0%, #ffffff 58%, color-mix(in srgb, var(--courseflare-primary-border) 42%, #ffffff 58%) 100%);
}

.courseflare-student-shell__sidebar,
.courseflare-student-lesson-drawer__tab {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--courseflare-primary-dark) 90%, #071225 10%) 0%, color-mix(in srgb, var(--courseflare-heading) 78%, #071225 22%) 100%);
}

.courseflare-student-shell__sidebar {
    border-right: 1px solid color-mix(in srgb, var(--courseflare-primary) 30%, rgba(255, 255, 255, 0.18) 70%);
}

.courseflare-student-shell > .courseflare-student-shell__sidebar {
    scrollbar-color: rgba(255, 255, 255, 0.82) color-mix(in srgb, var(--courseflare-primary-dark) 54%, rgba(0, 0, 0, 0.35) 46%);
}

.courseflare-student-shell > .courseflare-student-shell__sidebar::-webkit-scrollbar-track {
    background: color-mix(in srgb, var(--courseflare-primary-dark) 54%, rgba(0, 0, 0, 0.35) 46%);
}

.courseflare-student-shell__brand span,
.courseflare-student-nav__pack h3 {
    color: color-mix(in srgb, var(--courseflare-primary-soft) 72%, #ffffff 28%);
}

.courseflare-student-nav__home,
.courseflare-student-shell__tools a,
.courseflare-student-shell__logout {
    border-color: color-mix(in srgb, var(--courseflare-primary) 28%, rgba(255, 255, 255, 0.18) 72%);
}

.courseflare-student-nav__home:hover,
.courseflare-student-nav__home:focus,
.courseflare-student-nav__home.is-active,
.courseflare-student-shell__tools a:hover,
.courseflare-student-shell__tools a:focus,
.courseflare-student-shell__tools a.is-active,
.courseflare-student-shell__logout:hover,
.courseflare-student-shell__logout:focus,
.courseflare-student-nav__plan:hover,
.courseflare-student-nav__plan:focus,
.courseflare-student-nav__plan.is-active {
    background: color-mix(in srgb, var(--courseflare-primary) 26%, rgba(255, 255, 255, 0.1) 74%);
}

.courseflare-student-nav__plan small,
.courseflare-student-shell__brand span {
    color: color-mix(in srgb, var(--courseflare-primary-soft) 62%, rgba(255, 255, 255, 0.58) 38%);
}

.courseflare-student-nav__lesson {
    border-left-color: color-mix(in srgb, var(--courseflare-primary) 34%, rgba(255, 255, 255, 0.1) 66%);
}

.courseflare-student-nav__lesson:hover,
.courseflare-student-nav__lesson:focus,
.courseflare-student-nav__lesson.is-current {
    border-left-color: var(--courseflare-primary);
}

.courseflare-student-profile-link__avatar,
.courseflare-student-profile__avatar {
    background: linear-gradient(135deg, var(--courseflare-primary-dark) 0%, var(--courseflare-primary) 100%);
    border-color: color-mix(in srgb, var(--courseflare-primary-soft) 42%, rgba(255, 255, 255, 0.2) 58%);
}

.courseflare-student-home,
.courseflare-student-empty,
.courseflare-student-plan-view,
.courseflare-student-profile__header,
.courseflare-student-profile-card,
.courseflare-student-login__panel {
    border-color: var(--courseflare-primary-border);
    box-shadow: 0 22px 52px color-mix(in srgb, var(--courseflare-primary-dark) 11%, transparent 89%);
}

.courseflare-student-home {
    background:
        linear-gradient(135deg, #ffffff 0%, #ffffff 60%, color-mix(in srgb, var(--courseflare-primary-soft) 72%, #ffffff 28%) 100%);
}

.courseflare-student-home__summary {
    background: color-mix(in srgb, var(--courseflare-primary-soft) 74%, #ffffff 26%);
    border-color: var(--courseflare-primary-border);
}

.courseflare-student-home h1,
.courseflare-student-empty h1,
.courseflare-student-plan-view__header h1,
.courseflare-student-profile__header h1,
.courseflare-student-profile-card h2,
.courseflare-student-login__panel h2 {
    color: var(--courseflare-heading);
}

.courseflare-student-home__summary span,
.courseflare-student-plan-view__header span,
.courseflare-student-profile__header span:not(.courseflare-student-profile__avatar),
.courseflare-student-login__panel .courseflare-eyebrow {
    color: var(--courseflare-primary-text);
}

.courseflare-student-plan-view__header strong {
    color: var(--courseflare-primary);
}

.courseflare-student-lesson-list,
.courseflare-student-profile-card input,
.courseflare-student-profile-card textarea,
.courseflare-student-login__panel input[type="text"],
.courseflare-student-login__panel input[type="password"] {
    border-color: var(--courseflare-primary-border);
}

a.courseflare-student-lesson-row:hover,
a.courseflare-student-lesson-row:focus,
.courseflare-student-login__panel .courseflare-eyebrow {
    background: var(--courseflare-primary-soft);
}

.courseflare-student-lesson-row__marker {
    background: var(--courseflare-primary-soft);
    border-color: var(--courseflare-primary-border);
    color: var(--courseflare-primary-text);
}

.courseflare-student-login__panel input[type="submit"] {
    background: linear-gradient(135deg, var(--courseflare-primary-dark) 0%, var(--courseflare-primary) 100%);
}

.courseflare-student-lesson-drawer .courseflare-student-shell__sidebar {
    scrollbar-color: rgba(255, 255, 255, 0.82) color-mix(in srgb, var(--courseflare-primary-dark) 54%, rgba(0, 0, 0, 0.35) 46%);
}

.courseflare-student-lesson-drawer .courseflare-student-shell__sidebar::-webkit-scrollbar-track {
    background: color-mix(in srgb, var(--courseflare-primary-dark) 54%, rgba(0, 0, 0, 0.35) 46%);
}
