@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:wght@300;400;500;600&display=swap");

:root {
    --cfd-navy: #0d1b2a;
    --cfd-navy-mid: #1a2d42;
    --cfd-navy-light: #243447;
    --cfd-gold: #e8a838;
    --cfd-gold-light: #f5c668;
    --cfd-teal: #2ec4b6;
    --cfd-green: #2dc653;
    --cfd-white: #f7f9fc;
    --cfd-grey: #8898aa;
    --cfd-card-bg: #162233;
    --cfd-border: rgba(255, 255, 255, 0.07);
    --cfd-hero-start: #0d1b2a;
    --cfd-hero-mid: #162e44;
    --cfd-hero-end: #0f2235;

    /* Alias tokens used by modular training view. */
    --navy: var(--cfd-navy);
    --navy-mid: var(--cfd-navy-mid);
    --navy-light: var(--cfd-navy-light);
    --gold: var(--cfd-gold);
    --gold-light: var(--cfd-gold-light);
    --teal: var(--cfd-teal);
    --green: var(--cfd-green);
    --white: var(--cfd-white);
    --grey: var(--cfd-grey);
    --card-bg: var(--cfd-card-bg);
    --border: var(--cfd-border);
}

[data-theme="light"] {
    --cfd-navy: #f3f7fc;
    --cfd-navy-mid: #e7eef8;
    --cfd-navy-light: #d8e5f4;
    --cfd-gold: #b97a17;
    --cfd-gold-light: #d69a2f;
    --cfd-teal: #14897f;
    --cfd-green: #1f9654;
    --cfd-white: #10243a;
    --cfd-grey: #5f7388;
    --cfd-card-bg: #ffffff;
    --cfd-border: rgba(16, 36, 58, 0.12);
    --cfd-hero-start: #ebf2fb;
    --cfd-hero-mid: #dfeaf7;
    --cfd-hero-end: #d3e1f2;
    --cfd-light-accent-start: #5a95bb;
    --cfd-light-accent-end: #3c6f9c;
    --cfd-light-accent-hover-start: #4f87ac;
    --cfd-light-accent-hover-end: #345f88;
}

.course-full-page,
body.modular-training-page {
    font-family: "DM Sans", sans-serif;
    background: var(--cfd-navy);
    color: var(--cfd-white);
}

.course-full-page .page_banner,
body.modular-training-page .hero {
    background: linear-gradient(135deg, var(--cfd-hero-start) 0%, var(--cfd-hero-mid) 60%, var(--cfd-hero-end) 100%);
    border-bottom: 1px solid var(--cfd-border);
    position: relative;
    overflow: hidden;
}

.course-full-page .page_banner::before,
body.modular-training-page .hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse 70% 60% at 50% 0%,
        rgba(232, 168, 56, 0.12) 0%,
        transparent 70%
    );
    pointer-events: none;
}

.course-full-page .cfd-hero-badge,
body.modular-training-page .hero-badge {
    display: inline-block;
    background: rgba(232, 168, 56, 0.15);
    border: 1px solid rgba(232, 168, 56, 0.35);
    color: var(--cfd-gold);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 5px 14px;
    border-radius: 20px;
}

.course-full-page .page_title,
body.modular-training-page .hero h1 {
    font-family: "DM Serif Display", serif;
    color: var(--cfd-white);
    line-height: 1.15;
}

.course-full-page .page_banner p,
body.modular-training-page .hero-sub {
    color: #b8c8d8;
    font-size: 15px;
    font-weight: 300;
    line-height: 1.6;
}

[data-theme="light"] .course-full-page .page_banner p,
[data-theme="light"] body.modular-training-page .hero-sub {
    color: #48627a;
}

body.modular-training-page .hero-meta-item {
    font-size: 13px;
    color: var(--cfd-grey);
}

body.modular-training-page .hero-meta-item .dot {
    background: var(--cfd-teal);
}

.course-full-page .cfd-module-card,
body.modular-training-page .section-card,
body.modular-training-page .outline-nav,
body.modular-training-page .course-nav-aside {
    background: var(--cfd-card-bg);
    border: 1px solid var(--cfd-border);
}

/* Keep header readable when it overlays course hero backgrounds. */
.site_header.site_header_course:not(.sticky) .main_menu_list > li > a,
.site_header.site_header_course:not(.sticky) .main_menu_list > li.active > a,
.site_header.site_header_course:not(.sticky) .main_menu_list > li:hover > a {
    color: #f7f9fc;
    background-color: rgba(255, 255, 255, 0.06);
}

.site_header.site_header_course:not(.sticky) .main_menu_list .dropdown > a:after {
    color: #f7f9fc;
}

.site_header.site_header_course:not(.sticky) .mobile_menu_btn {
    color: #f7f9fc;
    border-color: rgba(255, 255, 255, 0.4);
}

.site_header.site_header_course:not(.sticky) .btn.border_dark {
    color: #f7f9fc;
    border-color: rgba(255, 255, 255, 0.5);
}

.site_header.site_header_course:not(.sticky) .btn.border_dark:hover {
    background-color: rgba(255, 255, 255, 0.14);
}

[data-theme="light"] .site_header.site_header_course:not(.sticky) .main_menu_list > li > a,
[data-theme="light"] .site_header.site_header_course:not(.sticky) .main_menu_list > li.active > a,
[data-theme="light"] .site_header.site_header_course:not(.sticky) .main_menu_list > li:hover > a {
    color: #10243a;
    background-color: rgba(16, 36, 58, 0.08);
}

[data-theme="light"] .site_header.site_header_course:not(.sticky) .main_menu_list .dropdown > a:after {
    color: #10243a;
}

[data-theme="light"] .site_header.site_header_course:not(.sticky) .mobile_menu_btn {
    color: #10243a;
    border-color: rgba(16, 36, 58, 0.28);
}

[data-theme="light"] .site_header.site_header_course:not(.sticky) .btn.border_dark {
    color: #10243a;
    border-color: rgba(16, 36, 58, 0.3);
}

[data-theme="light"] .site_header.site_header_course:not(.sticky) .btn.border_dark:hover {
    background-color: rgba(16, 36, 58, 0.08);
}

.site_header .theme_toggle_btn {
    border: 1px solid rgba(31, 29, 13, 0.22);
    background: rgba(255, 255, 255, 0.78);
    color: #1f1d0d;
    border-radius: 999px;
    height: 42px;
    min-width: 42px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.site_header .theme_toggle_btn:hover {
    background: #ffffff;
    border-color: rgba(31, 29, 13, 0.35);
}

.site_header .theme_toggle_btn .theme_label {
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
}

.site_header .theme_toggle_btn .theme_icon {
    font-size: 14px;
    line-height: 1;
}

/* Normalize action-button layout now that header has an extra theme toggle control. */
.site_header .header_btns_group {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 8px;
}

.site_header .header_btns_group > li {
    margin-left: 0;
}

.site_header.site_header_course:not(.sticky) .theme_toggle_btn {
    color: #f7f9fc;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.45);
}

.site_header.site_header_course:not(.sticky) .theme_toggle_btn:hover {
    background: rgba(255, 255, 255, 0.15);
}

[data-theme="light"] .site_header.site_header_course:not(.sticky) .theme_toggle_btn {
    color: #10243a;
    background: rgba(255, 255, 255, 0.75);
    border-color: rgba(16, 36, 58, 0.3);
}

[data-theme="light"] .site_header.site_header_course:not(.sticky) .theme_toggle_btn:hover {
    background: #ffffff;
}

/* Course detail light-mode readability polish. */
[data-theme="light"] .course-full-page .btn_dark {
    background: linear-gradient(135deg, var(--cfd-light-accent-start) 0%, var(--cfd-light-accent-end) 100%) !important;
    border-color: var(--cfd-light-accent-end) !important;
    color: #f5fbff !important;
}

[data-theme="light"] .course-full-page .btn_dark:hover {
    background: linear-gradient(135deg, var(--cfd-light-accent-hover-start) 0%, var(--cfd-light-accent-hover-end) 100%) !important;
    border-color: var(--cfd-light-accent-hover-end) !important;
    color: #f5fbff !important;
}

[data-theme="light"] .course-full-page .cfd-module-num {
    background: linear-gradient(135deg, var(--cfd-light-accent-start) 0%, var(--cfd-light-accent-end) 100%);
    color: #f3f9ff;
}

[data-theme="light"] .course-full-page .course_description_content,
[data-theme="light"] .course-full-page .course_description_content p,
[data-theme="light"] .course-full-page .course_description_content li,
[data-theme="light"] .course-full-page #course_info_accordion .accordion-body p {
    color: #3f5870 !important;
}

[data-theme="light"] .course-full-page .cfd-module-title,
[data-theme="light"] .course-full-page .course_card .item_title a,
[data-theme="light"] .course-full-page #course_info_accordion .accordion-button,
[data-theme="light"] .course-full-page #course_info_accordion .accordion-button.collapsed,
[data-theme="light"] .course-full-page #course_info_accordion .accordion-button:not(.collapsed),
[data-theme="light"] .course-full-page #course_info_accordion .accordion-body li .ms-auto {
    color: #10243a !important;
}

[data-theme="light"] .course-full-page .cfd-module-desc,
[data-theme="light"] .course-full-page .course_card .meta_info_list li,
[data-theme="light"] .course-full-page .course_card p.small,
[data-theme="light"] .course-full-page #course_info_accordion .accordion-body li,
[data-theme="light"] .course-full-page #course_info_accordion .accordion-body li span.text-muted,
[data-theme="light"] .course-full-page .meta_info_list li,
[data-theme="light"] .course-full-page .breadcrumb_nav li,
[data-theme="light"] .course-full-page .breadcrumb_nav li a {
    color: #5f7388 !important;
}

[data-theme="light"] .course-full-page .breadcrumb_nav li a:hover,
[data-theme="light"] .course-full-page .course_card .item_title a:hover {
    color: var(--cfd-gold) !important;
}

[data-theme="light"] .course-full-page .course_details_section,
[data-theme="light"] .course-full-page .courses_section {
    background: var(--cfd-navy-mid);
}

[data-theme="light"] .course-full-page .cfd-module-card,
[data-theme="light"] .course-full-page .course_card {
    box-shadow: 0 10px 26px rgba(16, 36, 58, 0.08);
}

[data-theme="light"] .course-full-page .course-banner-image {
    box-shadow: 0 12px 28px rgba(16, 36, 58, 0.14);
}

[data-theme="light"] .course-full-page #course_info_accordion .accordion-item {
    background: linear-gradient(165deg, rgba(255, 255, 255, 0.98) 0%, rgba(244, 248, 253, 0.92) 100%) !important;
    border-color: rgba(16, 36, 58, 0.16) !important;
    box-shadow: 0 12px 30px rgba(16, 36, 58, 0.08);
}

[data-theme="light"] .course-full-page #course_info_accordion .accordion-item:hover {
    border-color: rgba(185, 122, 23, 0.42) !important;
    box-shadow: 0 16px 32px rgba(16, 36, 58, 0.12);
}

[data-theme="light"] .course-full-page #course_info_accordion .accordion-button:not(.collapsed) {
    background: rgba(16, 36, 58, 0.04) !important;
    border-bottom: 1px solid rgba(16, 36, 58, 0.12);
}

[data-theme="light"] .course-full-page #course_info_accordion .accordion-body li {
    border-color: rgba(16, 36, 58, 0.1) !important;
}

[data-theme="light"] .course-full-page #course_info_accordion .accordion-button::after {
    filter: invert(0.35) sepia(0.8) saturate(1.2) hue-rotate(185deg);
    opacity: 1;
}

@media (max-width: 991.98px) {
    .site_header.site_header_course:not(.sticky) .main_menu_inner {
        background: #13273b;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 12px;
        padding: 16px;
    }

    [data-theme="light"] .site_header.site_header_course:not(.sticky) .main_menu_inner {
        background: #f9fbff;
        border-color: rgba(16, 36, 58, 0.12);
    }

    .site_header .theme_toggle_btn {
        padding: 0 10px;
    }

    .site_header .theme_toggle_btn .theme_label {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .site_header .header_btns_group {
        margin-left: 0;
        gap: 6px;
    }

    .site_header .header_btns_group .btn {
        padding: 0 10px;
    }

    .site_header .header_btns_group .btn span small {
        font-size: 13px;
    }
}

@media screen and (max-width: 425px) {
    .site_header .header_btns_group {
        gap: 4px;
    }

    .site_header .header_btns_group .btn {
        padding: 0 8px;
    }
}