/* EALD-GAP Courses Platform - Custom Styles */

:root { /* light theme variables */
    --primary-color: #1C5D99; /* primary blue */
    --secondary-color: #661931; /* secondary maroon */
    --success-color: #8E9918; /* olive */
    --danger-color: #EE6023; /* warm orange */
    --warning-color: #005AFF; /* bright blue */
    --info-color: #116DFF; /* bright blue 2 */
    --body-bg: #FFFFFF; /* page background */
    --body-text: #080808; /* near black text */
    --text-muted: #6C757D; /* medium-contrast muted text for light mode */
    --surface-bg: #FFFFFF; /* cards and surfaces */
    --surface-text: #080808; /* surface text */
    --nav-primary-bg: #1C5D99; /* top navbar background */
    --nav-secondary-bg: #FFFFFF; /* subnav background */
    --nav-secondary-text: #080808; /* subnav text */
    --nav-secondary-link: #333333; /* subnav link text */
    --nav-secondary-brand: #1C5D99; /* subnav brand text */
    --accent-primary: #1C5D99; /* primary accent */
    --footer-bg: #1C5D99; /* footer background */
    --footer-text: #FFFFFF; /* footer text */
    --font-body: 'Open Sans', sans-serif; /* body font */
    --font-heading: 'Clarendon', 'Clarendon LT', Georgia, serif; /* heading font */
    --font-price: 'Open Sans', sans-serif; /* price font */
    --catalog-category-title-font-family: 'Clarendon', 'Clarendon LT', Georgia, serif; /* category title font */
    --catalog-category-title-font-size: 1.5rem; /* category title size */
    --catalog-category-title-color: #080808; /* category title color */
    --catalog-category-description-font-family: 'Open Sans', sans-serif; /* category description font */
    --catalog-category-description-font-size: 0.9rem; /* category description size */
    --catalog-category-description-color: #6C757D; /* category description color */
    --safe-badge-bg: #f8f9fa; /* readable badge background on light */
    --safe-badge-text: #111827; /* readable badge text on light */
    --safe-badge-border: #d1d5db; /* readable badge border on light */
    /* Catalog groups: match subscriptions browse_plans comparison column headers (.tier-1 / .tier-2 / .tier-3) */
    --catalog-group-tier1-header-bg: #090c9b;
    --catalog-group-tier1-header-fg: #ffffff;
    --catalog-group-tier1-body-bg: rgba(9, 12, 155, 0.09);
    --catalog-group-tier2-header-bg: #3066be;
    --catalog-group-tier2-header-fg: #ffffff;
    --catalog-group-tier2-body-bg: rgba(48, 102, 190, 0.1);
    --catalog-group-tier3-header-bg: #b4c5e4;
    --catalog-group-tier3-header-fg: #2f2f2f;
    --catalog-group-tier3-body-bg: rgba(180, 197, 228, 0.42);
} /* end light theme */

[data-theme="dark"] { /* dark theme variables */
    --body-bg: #080808; /* near black background */
    --body-text: #FFFFFF; /* white text */
    --text-muted: #A9A9A9; /* muted text */
    --surface-bg: #2F2F2F; /* dark gray surface */
    --surface-text: #FFFFFF; /* surface text */
    --nav-primary-bg: #1C5D99; /* keep light top navbar */
    --nav-secondary-bg: #2F2F2F; /* dark subnav background */
    --nav-secondary-text: #FFFFFF; /* dark subnav text */
    --nav-secondary-link: #FFFFFF; /* dark subnav link text */
    --nav-secondary-brand: #B4C5E4; /* dark subnav brand text */
    --accent-primary: #3066BE; /* cohort blue */
    --footer-bg: #1C5D99; /* keep light footer background */
    --footer-text: #FFFFFF; /* keep light footer text */
    --safe-badge-bg: #f8fafc; /* readable badge background on dark */
    --safe-badge-text: #111827; /* readable badge text on dark */
    --safe-badge-border: #cbd5e1; /* readable badge border on dark */
    /* Same tier header hex as browse_plans; body washes tuned for dark page bg */
    --catalog-group-tier1-body-bg: rgba(9, 12, 155, 0.28);
    --catalog-group-tier2-body-bg: rgba(48, 102, 190, 0.26);
    --catalog-group-tier3-body-bg: rgba(180, 197, 228, 0.16);
} /* end dark theme */

[data-bs-theme="dark"] { /* bootstrap dark theme fallback for shared badge tokens */
    --safe-badge-bg: #f8fafc; /* readable badge background on dark */
    --safe-badge-text: #111827; /* readable badge text on dark */
    --safe-badge-border: #cbd5e1; /* readable badge border on dark */
} /* end bootstrap dark fallback */

body { /* page layout */
    min-height: 100vh; /* full height */
    display: flex; /* flex layout */
    flex-direction: column; /* vertical layout */
    background-color: var(--body-bg); /* themed background */
    color: var(--body-text); /* themed text */
    font-family: var(--font-body); /* body font */
} /* end body */

h1, h2, h3, h4, h5, h6, .navbar-brand { /* heading typography */
    font-family: var(--font-heading); /* heading font */
    font-weight: 600; /* heading weight */
} /* end heading typography */

.homepage-section-divider { /* homepage section divider */
    height: 1px; /* thin divider line */
    background: rgba(255, 255, 255, 0.25); /* subtle divider color */
    margin: 2.5rem 0; /* vertical spacing between sections */
} /* end homepage section divider */

/* Homepage Facing teaser: split card (mirrors pathway-style promo; image matches /facing overview) */
.homepage-facing-split-section {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    background-color: var(--body-bg);
}

.homepage-facing-split-card {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 10px 38px rgba(0, 0, 0, 0.12);
    background-color: var(--surface-bg);
}

.homepage-facing-split-visual {
    position: relative;
    min-height: 240px;
    padding: 0;
    background-color: #1a2836;
}

.homepage-facing-split-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    min-height: 240px;
}

@media (min-width: 992px) {
    .homepage-facing-split-row {
        min-height: 320px;
    }

    .homepage-facing-split-visual {
        min-height: 1px;
    }

    .homepage-facing-split-visual img {
        position: absolute;
        inset: 0;
        min-height: 100%;
    }
}

.homepage-facing-split-copy {
    padding: 1.85rem 1.5rem;
    background-color: var(--surface-bg);
    color: var(--surface-text);
}

@media (min-width: 992px) {
    .homepage-facing-split-copy {
        padding: 2.35rem 2.5rem;
    }
}

.homepage-facing-split-eyebrow {
    font-family: var(--font-body);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #8b6914;
    margin-bottom: 0.65rem;
}

.homepage-facing-split-title {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: clamp(1.5rem, 2.6vw, 2.05rem);
    line-height: 1.2;
    color: #1d3557;
    margin-bottom: 1rem;
}

[data-theme="dark"] .homepage-facing-split-title {
    color: #e8eef7;
}

[data-theme="dark"] .homepage-facing-split-eyebrow {
    color: #c9a227;
}

.homepage-facing-split-lead {
    font-family: var(--font-body);
    font-size: 0.98rem;
    line-height: 1.75;
    color: var(--text-muted);
    margin-bottom: 1.5rem;
    max-width: 38rem;
}

.homepage-facing-split-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.65rem;
}

.homepage-facing-split-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 1.35rem;
    border-radius: 999px;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 0.92rem;
    text-decoration: none;
    color: #ffffff !important;
    background-color: #ee6023;
    border: 2px solid #ee6023;
    transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.homepage-facing-split-btn-primary:hover {
    background-color: #f06d31;
    border-color: #f06d31;
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(238, 96, 35, 0.45);
}

.homepage-facing-split-btn-primary:focus-visible {
    outline: 2px solid #1d3557;
    outline-offset: 3px;
}

.homepage-facing-split-btn-secondary {
    display: inline-flex;
    align-items: center;
    padding: 0.48rem 1.2rem;
    border-radius: 999px;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 0.85rem;
    text-decoration: none;
    color: #3d2914 !important;
    background-color: transparent;
    border: 2px solid #5c4033;
    transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.homepage-facing-split-btn-secondary:hover {
    background-color: rgba(92, 64, 51, 0.06);
    color: #2a1d0f !important;
}

[data-theme="dark"] .homepage-facing-split-btn-secondary {
    color: #f0e8dc !important;
    border-color: rgba(240, 232, 220, 0.55);
}

[data-theme="dark"] .homepage-facing-split-btn-secondary:hover {
    background-color: rgba(255, 255, 255, 0.06);
    color: #ffffff !important;
}

@media (prefers-reduced-motion: reduce) {
    .homepage-facing-split-btn-primary:hover,
    .homepage-facing-split-btn-secondary:hover {
        transform: none;
    }
}

/* Homepage Ways to Engage: lead text readability on bright background (image unchanged) */
#ways-to-engage .ways-to-engage-intro {
    max-width: 720px;
}

#ways-to-engage .ways-to-engage-intro h2 {
    font-weight: 400;
    color: #000000;
    -webkit-text-stroke: 0.7px #ffffff;
    paint-order: stroke fill;
    text-shadow:
        -1px -1px 0 #ffffff,
        1px -1px 0 #ffffff,
        -1px 1px 0 #ffffff,
        1px 1px 0 #ffffff,
        0 2px 10px rgba(0, 0, 0, 0.25);
}

#ways-to-engage .ways-to-engage-intro .lead {
    font-size: 1.05rem;
    font-weight: 700;
    color: #000000;
    line-height: 1.7;
    -webkit-text-stroke: 0.45px #ffffff;
    paint-order: stroke fill;
    text-shadow:
        -1px -1px 0 #ffffff,
        1px -1px 0 #ffffff,
        -1px 1px 0 #ffffff,
        1px 1px 0 #ffffff,
        0 1px 8px rgba(0, 0, 0, 0.2);
}

/* Homepage Ways to Engage: tile lift + primary CTA hover (scoped to #ways-to-engage only) */
#ways-to-engage .subscription-tile {
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}

#ways-to-engage .subscription-tile:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.3) !important;
}

#ways-to-engage .homepage-engage-cta-primary {
    background-color: #ee6023;
    border: 2px solid #ee6023;
    color: #ffffff;
    transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

#ways-to-engage .homepage-engage-cta-primary:hover {
    background-color: #f06d31;
    border-color: #f06d31;
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(238, 96, 35, 0.5);
}

#ways-to-engage .homepage-engage-cta-primary:focus-visible {
    background-color: #f06d31;
    border-color: #f06d31;
    color: #ffffff;
    outline: 2px solid rgba(255, 255, 255, 0.9);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    #ways-to-engage .subscription-tile,
    #ways-to-engage .homepage-engage-cta-primary {
        transition: none;
    }

    #ways-to-engage .subscription-tile:hover,
    #ways-to-engage .homepage-engage-cta-primary:hover,
    #ways-to-engage .homepage-engage-cta-primary:focus-visible {
        transform: none;
    }
}

.course-grid { /* course grid spacing */
    row-gap: 2rem; /* increase vertical spacing between rows */
} /* end course grid spacing */


.catalog-category-title { /* global catalog category title style */
    font-family: var(--catalog-category-title-font-family) !important; /* title font */
    font-weight: 600; /* align with heading weight */
    font-size: var(--catalog-category-title-font-size); /* title size */
    color: var(--catalog-category-title-color); /* title color */
} /* end catalog category title */

.catalog-category-title * { /* force title rich text to keep configured heading font */
    font-family: var(--catalog-category-title-font-family) !important; /* override TinyMCE inline font-family */
    font-weight: inherit; /* keep surrounding heading weight */
    color: inherit; /* inherit configured title color */
} /* end title rich-text fragment typography */

.catalog-category-title p { /* remove default block spacing from title editor output */
    margin: 0; /* keep original heading spacing */
} /* end title paragraph spacing */

.catalog-category-title h1,
.catalog-category-title h2,
.catalog-category-title h3,
.catalog-category-title h4,
.catalog-category-title h5,
.catalog-category-title h6 { /* keep embedded heading markup visually consistent */
    margin: 0; /* avoid extra spacing */
    font-family: var(--catalog-category-title-font-family) !important; /* force title font */
    font-size: inherit; /* use configured title size */
    font-weight: inherit; /* preserve surrounding weight */
    line-height: inherit; /* preserve surrounding rhythm */
} /* end embedded heading consistency */

.catalog-category-description { /* global catalog category description style */
    font-family: var(--catalog-category-description-font-family) !important; /* description font */
    font-size: var(--catalog-category-description-font-size) !important; /* description size */
    color: var(--catalog-category-description-color) !important; /* description color */
} /* end catalog category description */

.catalog-category-description * { /* keep description rich text on configured typography */
    font-family: var(--catalog-category-description-font-family) !important; /* override TinyMCE inline font-family */
    font-size: inherit; /* preserve description size */
    color: inherit; /* preserve description color */
} /* end description rich-text typography */

.catalog-page-header-title { /* catalog/webinars page header title typography */
    font-family: var(--catalog-page-header-title-font-family) !important; /* header title font */
    font-size: var(--catalog-page-header-title-font-size) !important; /* header title size */
    color: var(--catalog-page-header-title-color) !important; /* header title color */
} /* end page header title typography */

.catalog-page-header-description { /* catalog/webinars page header description typography */
    font-family: var(--catalog-page-header-description-font-family) !important; /* header description font */
    font-size: var(--catalog-page-header-description-font-size) !important; /* header description size */
    color: var(--catalog-page-header-description-color) !important; /* header description color */
} /* end page header description typography */

.admin-group-header-row td { /* grouped admin header row */
    background-color: rgba(128, 128, 128, 0.08); /* subtle group background */
    border-top: 1px solid rgba(128, 128, 128, 0.2); /* top divider */
    cursor: pointer; /* indicate header row is clickable */
} /* end grouped admin header row */

.category-group-title-cell { /* category title cell on admin category pages */
    font-size: 1.1rem; /* one size larger for group label readability */
}

.admin-drop-placeholder-row td { /* drag placeholder row */
    border: 2px dashed rgba(28, 93, 153, 0.65) !important; /* visible drop marker */
    background-color: rgba(28, 93, 153, 0.08); /* subtle highlight */
    color: #1c5d99; /* marker text color */
    font-size: 0.85rem; /* marker text size */
    text-align: center; /* marker text alignment */
    padding: 0.35rem 0.5rem; /* marker spacing */
} /* end drag placeholder row */

.course-card-title { /* course card title */
    line-height: 1.25; /* reduce title line height for tighter stack */
} /* end course card title */

.course-card-description { /* course card description */
    display: -webkit-box; /* clamp to fixed lines */
    -webkit-box-orient: vertical; /* vertical flow for clamp */
    -webkit-line-clamp: 3; /* clamp to 3 lines */
    overflow: hidden; /* hide overflowed lines */
} /* end course card description */

.course-card-action { /* course card action button */
    font-size: 0.85rem; /* smaller button text */
    padding: 0.35rem 0.75rem; /* smaller button size */
} /* end course card action */

.course-card-cover { /* catalog tile cover: full image, no fixed-height viewport */
    width: 100%; /* fill card column width at current breakpoint */
    max-width: 100%; /* never overflow column */
    height: auto; /* height follows intrinsic aspect ratio */
    display: block; /* avoid inline gap below image */
} /* end course card cover */

.price-text { /* price typography */
    font-family: var(--font-price); /* price font family */
    font-variant-numeric: tabular-nums; /* align number widths */
    letter-spacing: 0.5px; /* subtle spacing for readability */
    line-height: 1.2; /* avoid digit clipping */
} /* end price typography */

.webinars-tabs .nav-link { /* webinars tabs */
    padding: 0.65rem 1rem; /* increase tab padding */
} /* end webinars tabs */

.webinars-tabs .nav-link.active { /* webinars active tab */
    background-color: var(--surface-bg); /* clearer active background */
    border-color: var(--accent-primary) var(--accent-primary) transparent; /* emphasize active tab */
    color: var(--body-text); /* active tab text */
} /* end webinars active tab */

.webinar-card-header { /* webinar card header */
    padding-bottom: 0.75rem; /* add spacing under title row */
} /* end webinar card header */

.webinar-title-row { /* webinar title row */
    gap: 0.5rem; /* space between title and badge */
} /* end webinar title row */

.webinar-title { /* webinar title */
    line-height: 1.25; /* reduce title crowding */
} /* end webinar title */

.webinar-status-badge { /* webinar status badge */
    margin-left: 0.25rem; /* increase spacing from title */
} /* end webinar status badge */

.contrast-safe-badge { /* reusable readable badge for light/dark themes */
    background-color: var(--safe-badge-bg);
    color: var(--safe-badge-text);
    border: 1px solid var(--safe-badge-border);
} /* end contrast-safe-badge */

.webinar-price-row { /* webinar price row */
    display: flex; /* align price items */
    align-items: baseline; /* align badge and price on baseline */
} /* end webinar price row */

.webinar-price-text { /* webinar price text */
    display: inline-flex; /* keep price on baseline */
    align-items: baseline; /* align price elements */
    gap: 0.5rem; /* spacing within price row */
} /* end webinar price text */

.webinar-placeholder { /* webinar placeholder */
    background: linear-gradient(135deg, rgba(28, 93, 153, 0.85), rgba(28, 93, 153, 0.65)); /* subtle gradient */
    position: relative; /* enable overlay pattern */
    overflow: hidden; /* clip pattern */
} /* end webinar placeholder */

.webinar-placeholder::after { /* webinar placeholder pattern */
    content: ""; /* pattern overlay */
    position: absolute; /* overlay positioning */
    inset: 0; /* cover full placeholder */
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255, 255, 255, 0.08),
        rgba(255, 255, 255, 0.08) 10px,
        rgba(255, 255, 255, 0.02) 10px,
        rgba(255, 255, 255, 0.02) 20px
    ); /* subtle diagonal texture */
    pointer-events: none; /* allow clicks through */
} /* end webinar placeholder pattern */

.course-search-input::placeholder { /* search placeholder */
    color: rgba(0, 0, 0, 0.55); /* increase placeholder contrast in light mode */
} /* end search placeholder */

[data-theme="dark"] .course-search-input::placeholder { /* dark search placeholder */
    color: rgba(255, 255, 255, 0.65); /* increase placeholder contrast in dark mode */
} /* end dark search placeholder */

.text-muted { /* themed muted text */
    color: var(--text-muted) !important; /* muted color */
} /* end .text-muted */

.breadcrumb { /* breadcrumb text */
    color: var(--body-text); /* readable text color */
} /* end breadcrumb */

.breadcrumb .breadcrumb-item a { /* breadcrumb links */
    color: var(--body-text); /* readable link color */
} /* end breadcrumb links */

[data-theme="dark"] .breadcrumb .breadcrumb-item a { /* dark breadcrumb links */
    color: var(--surface-text); /* readable link color */
} /* end dark breadcrumb links */

.bg-white { /* themed white backgrounds */
    background-color: var(--surface-bg) !important; /* surface background */
    color: var(--surface-text); /* surface text */
} /* end .bg-white */

.card { /* themed cards */
    background-color: var(--surface-bg); /* card background */
    color: var(--surface-text); /* card text */
} /* end .card */

.card-header { /* themed card header */
    background-color: var(--surface-bg); /* header background */
    color: var(--surface-text); /* header text */
} /* end .card-header */

.card-footer { /* themed card footer */
    background-color: var(--surface-bg); /* footer background */
    color: var(--surface-text); /* footer text */
} /* end .card-footer */

[data-theme="dark"] .list-group-item { /* dark theme list items */
    background-color: var(--surface-bg) !important; /* list item background */
    color: var(--surface-text); /* list item text */
} /* end dark list-group-item */

[data-theme="dark"] .list-group-item-action { /* dark theme list item links */
    color: var(--surface-text); /* list item link text */
} /* end dark list-group-item-action */

[data-theme="dark"] .list-group-item-action:hover, [data-theme="dark"] .list-group-item-action:focus { /* dark list hover */
    background-color: #3A3A3A !important; /* hover background */
    color: var(--surface-text); /* hover text */
} /* end dark list hover */

/* Watch pages (course/package) */
.course-content-item.course-content-active { /* active course chapter item */
    color: #212529; /* readable text color */
    background-color: rgba(13, 110, 253, 0.12) !important; /* active background */
} /* end active course chapter item */

.course-content-item.course-content-active .text-muted { /* muted text in active course item */
    color: #6c757d; /* readable muted color */
} /* end muted text override */

[data-theme="dark"] .course-content-item.course-content-active { /* active course chapter item dark */
    color: #f9fafb; /* readable text color */
    background-color: rgba(59, 130, 246, 0.2) !important; /* active background */
} /* end active course chapter item dark */

[data-theme="dark"] .course-content-item.course-content-active .text-muted { /* muted text in active course item dark */
    color: #cbd5e1; /* readable muted color */
} /* end muted text override dark */

.course-content-video-item.course-content-video-active { /* active video row */
    background-color: rgba(13, 110, 253, 0.12) !important; /* active background */
} /* end active video row */

[data-theme="dark"] .course-content-video-item.course-content-video-active { /* active video row dark */
    background-color: rgba(59, 130, 246, 0.2) !important; /* active background */
} /* end active video row dark */

.chapter-video-item.chapter-video-active { /* active chapter video row */
    background-color: rgba(13, 110, 253, 0.12) !important; /* active background */
} /* end active chapter video row */

[data-theme="dark"] .chapter-video-item.chapter-video-active { /* active chapter video row dark */
    background-color: rgba(59, 130, 246, 0.2) !important; /* active background */
} /* end active chapter video row dark */

@media (max-width: 991.98px) { /* mobile viewer simplification */
    .viewer-mobile-controls { /* mobile controls wrapper */
        margin-bottom: 1rem; /* spacing under controls */
    } /* end mobile controls */
    .viewer-mobile-nav-btn { /* mobile nav buttons */
        padding: 0.6rem 0.75rem; /* comfortable tap target */
        font-weight: 600; /* stronger label */
    } /* end nav buttons */
    .viewer-mobile-toggle-btn { /* mobile toggle buttons */
        padding: 0.65rem 0.75rem; /* larger tap target */
        font-weight: 600; /* stronger label */
        min-height: 44px; /* stable height */
        display: inline-flex; /* stable sizing */
        align-items: center; /* center content */
        justify-content: center; /* center content */
        gap: 6px; /* icon spacing */
        white-space: nowrap; /* prevent wrap */
        width: 100%; /* full width */
    } /* end toggle buttons */
    .viewer-mobile-toggle-chapter { /* chapter toggle sizing */
        height: 44px; /* fixed height */
        line-height: 1; /* avoid height shifts */
    } /* end chapter toggle sizing */
    .viewer-mobile-toggle-chapter { /* chapter toggle spacing */
        margin-top: 0.5rem; /* vertical spacing */
    } /* end chapter toggle spacing */
    .viewer-mobile-section .btn { /* mobile section toggles */
        padding: 0.55rem 0.75rem; /* reduce button height */
    } /* end mobile section toggles */
    .viewer-mobile-default-video { /* hidden mobile default hook */
        display: none; /* keep element hidden */
    } /* end mobile default hook */
    .viewer-mobile-browser { /* mobile browser overlay */
        position: fixed; /* fixed overlay */
        left: 0; /* align left */
        right: 0; /* align right */
        top: var(--viewer-mobile-browser-top, 0px); /* offset below header */
        bottom: 0; /* fill to bottom */
        z-index: 1050; /* overlay stack */
        overflow-y: auto; /* scroll content */
    } /* end mobile browser overlay */
} /* end mobile viewer simplification */

.package-content-video-item.package-content-video-active { /* active package video row */
    background-color: rgba(13, 110, 253, 0.12) !important; /* active background */
} /* end active package video row */

[data-theme="dark"] .package-content-video-item.package-content-video-active { /* active package video row dark */
    background-color: rgba(59, 130, 246, 0.2) !important; /* active background */
} /* end active package video row dark */

.video-watch-btn { /* watch button size */
    min-width: 140px; /* consistent width */
    text-align: center; /* centered label */
} /* end watch button size */

.video-action-group { /* video action row */
    display: flex; /* flex row */
    gap: 6px; /* spacing */
    flex-wrap: nowrap; /* keep in one row */
} /* end video action row */

.content-panel-right { /* right-aligned content wrapper */
    min-width: 56px; /* consistent right column width */
    text-align: right; /* align content to right edge */
    display: inline-flex; /* inline flex for icon alignment */
    align-items: center; /* center vertically */
    justify-content: flex-end; /* push items to right */
    gap: 6px; /* consistent spacing */
    align-self: center; /* align with row center */
} /* end right-aligned wrapper */

.admin-calendar-availability { /* admin calendar availability line */
    color: #0f7a3f !important; /* green text */
} /* end admin calendar availability */

.admin-calendar-blocked { /* admin calendar blocked line */
    color: #b02a37 !important; /* red text */
} /* end admin calendar blocked */

.admin-calendar-event-row-external {
    color: #b02a37 !important;
}

.admin-calendar-time-grid-event-external {
    background: rgba(176, 42, 55, 0.18);
    border: 1px solid #b02a37;
    color: #842029;
}

.admin-calendar-time-grid-event-external[title] {
    cursor: pointer;
}

.admin-calendar-month-grid {
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
}

.admin-calendar-time-grid-root {
    overflow-x: auto;
}

.admin-calendar-time-grid-header,
.admin-calendar-time-grid-body {
    display: grid;
    grid-template-columns: 72px repeat(auto-fit, minmax(140px, 1fr));
    gap: 4px;
}

.admin-calendar-time-grid-day-header {
    font-weight: 600;
    text-align: center;
    padding: 6px 4px;
    border-bottom: 1px solid #dee2e6;
}

.admin-calendar-time-grid-hours {
    border-right: 1px solid #dee2e6;
}

.admin-calendar-time-grid-hour-label {
    font-size: 0.75rem;
    color: #6c757d;
    border-bottom: 1px dashed #e9ecef;
    padding-right: 6px;
    text-align: right;
}

.admin-calendar-time-grid-day-column {
    position: relative;
    border-left: 1px solid #e9ecef;
    background: #fafbfc;
}

.admin-calendar-time-grid-event {
    position: absolute;
    left: 4px;
    right: 4px;
    background: #e7f1ff;
    border: 1px solid #9ec5fe;
    border-radius: 4px;
    padding: 4px 6px;
    overflow: hidden;
    cursor: pointer;
    z-index: 2;
}

.admin-calendar-time-grid-overlay {
    position: absolute;
    left: 2px;
    right: 2px;
    border-radius: 4px;
    padding: 2px 4px;
    font-size: 0.7rem;
    overflow: hidden;
    z-index: 1;
    opacity: 0.92;
}

.admin-calendar-time-grid-overlay-available {
    background: rgba(15, 122, 63, 0.15);
    border: 1px dashed #0f7a3f;
    color: #0f7a3f;
}

.admin-calendar-time-grid-overlay-blocked {
    background: rgba(176, 42, 55, 0.12);
    border: 1px dashed #b02a37;
    color: #b02a37;
}

[data-theme="dark"] .manual-complete-alert { /* manual alert dark theme */
    background-color: #2b2f33; /* alert background */
    border-color: #3a3f45; /* alert border */
    color: #f1f1f1; /* alert text */
} /* end manual alert dark theme */

[data-theme="dark"] .manual-complete-alert .text-muted { /* manual alert muted text */
    color: #c7cdd3; /* muted text */
} /* end manual alert muted text */

[data-theme="dark"] .accordion-button .text-muted { /* watch accordion muted text */
    color: #cbd5e1; /* readable muted text */
} /* end watch accordion muted text */

[data-theme="dark"] .accordion-button.collapsed .text-muted { /* collapsed muted text */
    color: #cbd5e1; /* readable collapsed text */
} /* end collapsed muted text */

[data-theme="dark"] .accordion-button::after { /* dark accordion expand/collapse icon */
    filter: brightness(0) invert(1); /* keep icon visible on dark backgrounds */
    opacity: 0.95; /* stronger icon contrast */
} /* end dark accordion icon */

[data-bs-theme="dark"] .accordion-button::after { /* bootstrap dark fallback icon visibility */
    filter: brightness(0) invert(1); /* ensure icon remains visible */
    opacity: 0.95; /* stronger icon contrast */
} /* end bootstrap dark accordion icon */

@media (max-width: 991.98px) { /* centralized mobile dark-mode overrides for course player v3 */
    [data-theme="dark"] .course-player-v3 .v3-mobile-lesson-row.v3-lesson-row-active,
    [data-bs-theme="dark"] .course-player-v3 .v3-mobile-lesson-row.v3-lesson-row-active {
        background-color: #1f2937;
        border-left: 3px solid #60a5fa;
        box-shadow: none;
    }

    [data-theme="dark"] .course-player-v3 .v3-mobile-lesson-row.v3-lesson-row-active .text-muted,
    [data-theme="dark"] .course-player-v3 .v3-mobile-lesson-row.v3-lesson-row-active .small,
    [data-theme="dark"] .course-player-v3 .v3-mobile-lesson-row.v3-lesson-row-active .fw-semibold,
    [data-bs-theme="dark"] .course-player-v3 .v3-mobile-lesson-row.v3-lesson-row-active .text-muted,
    [data-bs-theme="dark"] .course-player-v3 .v3-mobile-lesson-row.v3-lesson-row-active .small,
    [data-bs-theme="dark"] .course-player-v3 .v3-mobile-lesson-row.v3-lesson-row-active .fw-semibold {
        color: #cbd5e1 !important;
    }

    [data-theme="dark"] .course-player-v3 #v3MobileNavAccordion .accordion-item,
    [data-bs-theme="dark"] .course-player-v3 #v3MobileNavAccordion .accordion-item {
        border-color: #475569;
        background-color: #111827;
    }

    [data-theme="dark"] .course-player-v3 #v3MobileNavAccordion .accordion-button,
    [data-bs-theme="dark"] .course-player-v3 #v3MobileNavAccordion .accordion-button {
        color: #e2e8f0;
        background: #1f2937;
        border-color: #475569;
    }

    [data-theme="dark"] .course-player-v3 #v3MobileNavAccordion .accordion-button:not(.collapsed),
    [data-bs-theme="dark"] .course-player-v3 #v3MobileNavAccordion .accordion-button:not(.collapsed) {
        color: #ffffff;
        background: #1e3a8a;
    }

    [data-theme="dark"] .course-player-v3 #v3MobileNavAccordion .accordion-button::after,
    [data-bs-theme="dark"] .course-player-v3 #v3MobileNavAccordion .accordion-button::after {
        filter: brightness(0) invert(1);
        opacity: 0.95;
    }

    [data-theme="dark"] .course-player-v3 .v3-step-item .v3-step-header-row .accordion-button,
    [data-bs-theme="dark"] .course-player-v3 .v3-step-item .v3-step-header-row .accordion-button {
        background: #1f2937;
        color: #e2e8f0;
    }

    [data-theme="dark"] .course-player-v3 .v3-step-item .v3-step-header-row .accordion-button::after,
    [data-bs-theme="dark"] .course-player-v3 .v3-step-item .v3-step-header-row .accordion-button::after {
        filter: brightness(0) invert(1);
        opacity: 0.95;
    }

    [data-theme="dark"] .course-player-v3 .v3-step-item.v3-step-item-active .v3-step-header-row .accordion-button,
    [data-bs-theme="dark"] .course-player-v3 .v3-step-item.v3-step-item-active .v3-step-header-row .accordion-button {
        background: #1d4ed8;
        color: #ffffff;
    }
} /* end centralized course player v3 mobile dark-mode overrides */

.package-content-item.package-content-active { /* active package chapter item */
    color: #212529; /* readable text color */
    background-color: rgba(13, 110, 253, 0.12) !important; /* active background */
} /* end active package chapter item */

.package-content-item.package-content-active .text-muted { /* muted text in active package item */
    color: #6c757d; /* readable muted color */
} /* end muted text override */

[data-theme="dark"] .package-content-item { /* package chapter text */
    color: #e5e7eb; /* readable text */
} /* end package chapter text */

[data-theme="dark"] .package-content-item .text-muted { /* package muted text */
    color: #cbd5e1; /* readable muted text */
} /* end package muted text */

[data-theme="dark"] .package-content-item.package-content-active { /* active package text */
    color: #f9fafb; /* readable active text */
    background-color: rgba(59, 130, 246, 0.2) !important; /* active background */
} /* end active package text */

[data-theme="dark"] .package-content-item.package-content-active .text-muted { /* active package muted */
    color: #e5e7eb; /* readable active muted */
} /* end active package muted */

[data-theme="dark"] .bg-light { /* dark theme light background override */
    background-color: #3A3A3A !important; /* darker light background */
    color: var(--surface-text); /* text color */
} /* end dark bg-light */

[data-theme="dark"] .alert-light { /* dark theme light alert override */
    background-color: #3A3A3A !important; /* alert background */
    color: var(--surface-text); /* alert text */
    border-color: #4A4A4A !important; /* alert border */
} /* end dark alert-light */

[data-theme="dark"] .table { /* dark theme table */
    background-color: var(--surface-bg); /* table background */
    color: var(--surface-text); /* table text */
} /* end dark table */

[data-theme="dark"] .table thead th { /* dark theme table header */
    background-color: #3A3A3A; /* header background */
    color: var(--surface-text); /* header text */
    border-color: #4A4A4A; /* header border */
} /* end dark table header */

[data-theme="dark"] .table tbody tr { /* dark theme table rows */
    background-color: var(--surface-bg); /* row background */
    color: var(--surface-text); /* row text */
} /* end dark table rows */

[data-theme="dark"] .table tbody td { /* dark theme table cells */
    background-color: var(--surface-bg); /* cell background */
    color: var(--surface-text); /* cell text */
    border-color: #4A4A4A; /* cell border */
} /* end dark table cells */

[data-theme="dark"] .table-hover tbody tr:hover { /* dark theme table hover */
    background-color: #3A3A3A; /* hover background */
    color: var(--surface-text); /* hover text */
} /* end dark table hover */

[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) { /* dark striped odd */
    background-color: #3A3A3A; /* odd row background */
} /* end dark striped odd */

[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(even) { /* dark striped even */
    background-color: var(--surface-bg); /* even row background */
} /* end dark striped even */

[data-theme="dark"] .subscription-current-row td { /* dark current subscription row */
    background-color: #3A3A3A !important; /* current row background */
    color: var(--surface-text); /* current row text */
} /* end dark subscription-current-row */

[data-theme="dark"] .alert-info { /* dark info alert */
    background-color: #2F2F2F; /* info background */
    color: var(--surface-text); /* info text */
    border-color: #4A4A4A; /* info border */
} /* end dark alert-info */

[data-theme="dark"] .alert-warning { /* dark warning alert */
    background-color: #3A3A3A; /* warning background */
    color: var(--surface-text); /* warning text */
    border-color: #4A4A4A; /* warning border */
} /* end dark alert-warning */

[data-theme="dark"] .alert-success { /* dark success alert */
    background-color: #2F2F2F; /* success background */
    color: var(--surface-text); /* success text */
    border-color: #4A4A4A; /* success border */
} /* end dark alert-success */

[data-theme="dark"] .table-bordered { /* dark theme table borders */
    border-color: #4A4A4A; /* border color */
} /* end dark table-bordered */

[data-theme="dark"] .breadcrumb { /* dark theme breadcrumb */
    background-color: transparent; /* transparent background */
    color: var(--surface-text); /* breadcrumb text */
} /* end dark breadcrumb */

[data-theme="dark"] .breadcrumb .breadcrumb-item { /* dark breadcrumb items */
    color: var(--surface-text); /* item text color */
} /* end dark breadcrumb items */

[data-theme="dark"] .breadcrumb .breadcrumb-item span { /* dark breadcrumb spans */
    color: var(--surface-text); /* span text color */
} /* end dark breadcrumb spans */

[data-theme="dark"] #current-video-title { /* dark breadcrumb current video */
    color: var(--surface-text); /* current video text color */
} /* end dark current video */

[data-theme="dark"] #current-video-title-mobile { /* dark breadcrumb current video mobile */
    color: var(--surface-text); /* current video mobile text color */
} /* end dark current video mobile */

[data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before { /* dark breadcrumb separator */
    color: var(--text-muted); /* separator color */
} /* end dark breadcrumb separator */

[data-theme="dark"] .breadcrumb-item a { /* dark breadcrumb links */
    color: var(--surface-text); /* link color */
} /* end dark breadcrumb links */

:is([data-theme="dark"], [data-bs-theme="dark"]) .form-control { /* dark theme inputs */
    background-color: #3A3A3A; /* input background */
    color: var(--surface-text); /* input text */
    border-color: #4A4A4A; /* input border */
} /* end dark form-control */

:is([data-theme="dark"], [data-bs-theme="dark"]) .form-control::placeholder { /* dark placeholders */
    color: var(--text-muted); /* placeholder color */
} /* end dark form-control placeholder */

:is([data-theme="dark"], [data-bs-theme="dark"]) .form-select { /* dark theme selects */
    background-color: #3A3A3A; /* match input background */
    color: var(--surface-text); /* select text */
    border-color: #4A4A4A; /* match input border */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23A9A9A9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
} /* end dark form-select */

:is([data-theme="dark"], [data-bs-theme="dark"]) .form-text { /* dark helper text */
    color: var(--text-muted); /* readable muted helper */
} /* end dark form-text */

[data-theme="dark"] .input-group-text { /* dark theme input group */
    background-color: #3A3A3A; /* group background */
    color: var(--surface-text); /* group text */
    border-color: #4A4A4A; /* group border */
} /* end dark input-group-text */

[data-theme="dark"] .btn-outline-secondary { /* dark outline secondary */
    color: var(--surface-text); /* button text */
    border-color: #6C757D; /* button border */
} /* end dark btn-outline-secondary */

[data-theme="dark"] .btn-outline-primary { /* dark outline primary */
    color: var(--surface-text); /* button text */
    border-color: var(--accent-primary); /* button border */
} /* end dark btn-outline-primary */

[data-theme="dark"] .btn-outline-success { /* dark outline success */
    color: var(--surface-text); /* button text */
    border-color: var(--success-color); /* button border */
} /* end dark btn-outline-success */

[data-theme="dark"] .btn-outline-info { /* dark outline info */
    color: var(--surface-text); /* button text */
    border-color: var(--info-color); /* button border */
} /* end dark btn-outline-info */

[data-theme="dark"] .btn-outline-warning { /* dark outline warning */
    color: var(--surface-text); /* button text */
    border-color: var(--warning-color); /* button border */
} /* end dark btn-outline-warning */

[data-theme="dark"] .btn-outline-danger { /* dark outline danger */
    color: var(--surface-text); /* button text */
    border-color: var(--danger-color); /* button border */
} /* end dark btn-outline-danger */

[data-theme="dark"] .btn-outline-secondary:hover, 
[data-theme="dark"] .btn-outline-primary:hover,
[data-theme="dark"] .btn-outline-success:hover,
[data-theme="dark"] .btn-outline-info:hover,
[data-theme="dark"] .btn-outline-warning:hover,
[data-theme="dark"] .btn-outline-danger:hover { /* dark outline hover */
    color: #FFFFFF; /* hover text */
} /* end dark outline hover */

.view-all-subscription-plans-btn { /* ensure plans button remains legible in light mode */
    color: #0D6EFD; /* readable blue text */
    border-color: #0D6EFD; /* readable border */
    background-color: #FFFFFF; /* solid white for contrast */
} /* end view-all-subscription-plans-btn */

.view-all-subscription-plans-btn:hover,
.view-all-subscription-plans-btn:focus { /* clear hover/focus contrast */
    color: #FFFFFF; /* readable inverted text */
    background-color: #0D6EFD; /* primary hover fill */
    border-color: #0D6EFD; /* keep border in sync */
} /* end view-all-subscription-plans-btn hover/focus */

[data-theme="dark"] .view-all-subscription-plans-btn { /* preserve dark-mode readability */
    color: #FFFFFF; /* bright text on dark surfaces */
    border-color: rgba(255, 255, 255, 0.75); /* light border */
    background-color: transparent; /* keep dark theme style */
} /* end dark view-all-subscription-plans-btn */

[data-theme="dark"] .calendar-empty-day { /* dark theme empty calendar cell */
    background-color: var(--surface-bg); /* empty cell background */
    color: var(--surface-text); /* empty cell text */
} /* end dark calendar-empty-day */

[data-theme="dark"] .subscription-engagement-card { /* dark engagement card */
    background-color: var(--surface-bg) !important; /* engagement background */
    background-image: none !important; /* remove light gradient */
    color: var(--surface-text); /* engagement text */
    border-color: #4A4A4A; /* engagement border */
} /* end dark subscription-engagement-card */

.dropdown-menu { /* themed dropdown */
    background-color: var(--surface-bg); /* dropdown background */
    color: var(--surface-text); /* dropdown text */
    box-shadow: 0 8px 20px rgba(8, 8, 8, 0.16); /* lift light-mode menu from page content */
} /* end .dropdown-menu */

.navbar { /* ensure navbar establishes stacking context */
    position: relative;
    z-index: 2200;
}

.navbar .dropdown-menu { /* user/menu dropdown must stay above page panels */
    position: absolute;
    z-index: 5000 !important;
}

.dropdown-item { /* themed dropdown item */
    color: var(--surface-text); /* dropdown item text */
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.35); /* subtle label separation on light backgrounds */
} /* end .dropdown-item */

.dropdown-item:hover, .dropdown-item:focus { /* themed dropdown hover */
    background-color: var(--nav-secondary-bg); /* hover background */
    color: var(--surface-text); /* hover text */
} /* end dropdown hover */

[data-theme="dark"] .dropdown-menu { /* stronger separation from page in dark mode */
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45); /* elevate menu above page content */
} /* end dark dropdown menu shadow */

[data-theme="dark"] .dropdown-menu .dropdown-item { /* increase main menu item legibility in dark mode */
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55); /* subtle depth under menu labels */
} /* end dark dropdown item text shadow */

[data-theme="dark"] .dropdown-menu .dropdown-divider { /* visible separators in dark dropdowns */
    border-top-color: rgba(255, 255, 255, 0.28); /* stronger contrast for menu separators */
    opacity: 1; /* ensure divider line is fully visible */
} /* end dark dropdown divider */

.navbar-light { /* themed subnav */
    background-color: var(--nav-secondary-bg) !important; /* subnav background */
    color: var(--nav-secondary-text); /* subnav text */
} /* end .navbar-light */

@media (max-width: 991.98px) { /* mobile slide-in menus */
    .navbar .navbar-toggler { /* keep toggler above slide menu */
        position: relative; /* allow z-index */
        z-index: 2101; /* stay visible for close action */
    } /* end toggler visibility */
    .mobile-slide-menu { /* base mobile slide-in panel */
        position: fixed; /* keep menu fixed */
        top: var(--mobile-menu-top, 64px); /* slide under hamburger */
        left: 0; /* slide from left */
        height: calc(100vh - var(--mobile-menu-top, 64px)); /* full height minus header */
        width: 280px; /* menu width */
        padding: 1.5rem; /* inner spacing */
        transform: translateX(-100%); /* hidden offscreen */
        transition: transform 0.3s ease-in-out; /* slide animation */
        z-index: 2000; /* above content */
        box-shadow: 2px 0 12px rgba(0, 0, 0, 0.2); /* subtle shadow */
        overflow-y: auto; /* allow menu to scroll */
        overscroll-behavior: contain; /* prevent body scroll bounce */
    } /* end mobile slide-in panel */
    
    .mobile-slide-menu.show { /* shown state */
        transform: translateX(0); /* slide into view */
    } /* end shown state */
    
    .mobile-slide-menu.collapsing { /* collapsing state */
        height: 100vh; /* keep full height */
        transform: translateX(-100%); /* slide out */
    } /* end collapsing state */
    
    .mobile-slide-menu--primary { /* primary menu background */
        background-color: var(--nav-primary-bg); /* primary background */
    } /* end primary menu background */
    
    .mobile-slide-menu--secondary { /* secondary menu background */
        background-color: var(--nav-secondary-bg); /* secondary background */
    } /* end secondary menu background */
    
    .mobile-slide-menu .navbar-nav { /* menu list spacing */
        gap: 16px; /* tighten list spacing */
    } /* end menu list spacing */

    .mobile-slide-menu .dropdown-submenu .dropdown-menu { /* keep nested menu inside mobile panel */
        position: static; /* render submenu inline below Preferences */
        float: none; /* avoid desktop flyout positioning behavior */
        margin-top: 0.25rem; /* subtle separation from parent item */
        margin-left: 0; /* remove right-flyout offset */
        border: 0; /* avoid nested card edge in tight mobile panel */
        box-shadow: none; /* remove layered flyout shadow on mobile */
        display: none; /* only reveal when Bootstrap marks submenu open */
    } /* end mobile nested submenu base */

    .mobile-slide-menu .dropdown-submenu .dropdown-menu.show { /* show inline submenu when toggled */
        display: block; /* reveal preference actions in mobile menu */
    } /* end mobile nested submenu show state */
} /* end mobile slide-in menus */

[data-theme="dark"] .navbar-light .navbar-toggler { /* dark subnav toggler */
    border-color: #FFFFFF; /* visible border in dark mode */
} /* end dark subnav toggler */

[data-theme="dark"] .navbar-light .navbar-toggler-icon { /* dark subnav icon */
    filter: invert(1); /* brighten icon in dark mode */
} /* end dark subnav icon */

.nav-tabs .nav-link { /* themed tabs */
    color: var(--nav-secondary-link); /* tab text */
} /* end .nav-tabs .nav-link */

.nav-tabs .nav-link.active { /* themed active tab */
    background-color: var(--surface-bg); /* active background */
    color: var(--surface-text); /* active text */
} /* end .nav-tabs .nav-link.active */

.accordion-item { /* themed accordion item */
    background-color: var(--surface-bg); /* accordion background */
    color: var(--surface-text); /* accordion text */
} /* end .accordion-item */

/* subscription included list styles */
.plan-included-content ul {
    list-style: disc;
    margin-left: 1rem;
    padding-left: 1rem;
}

.plan-included-content ul li {
    margin-bottom: 0.75rem;
}

.plan-included-content ul li:has(> i.bi),
.plan-included-content ul li:has(> span > i.bi) {
    list-style: none;
    margin-left: -1.25rem;
}

.plan-included-content ul li > i.bi,
.plan-included-content ul li > span > i.bi {
    margin-right: 0.5rem;
}

.plan-included-content ul ul {
    list-style: circle;
    margin-left: 1rem;
}

.plan-included-content ul.checklist-green {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.plan-included-content ul.checklist-green > li {
    list-style: none;
    margin: 0 0 0.75rem 0;
    padding-left: 1.75rem;
    position: relative;
}

.plan-included-content ul.checklist-green > li::before {
    align-items: center;
    background-color: #2da66a;
    border-radius: 999px;
    color: #ffffff;
    content: "\2713";
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 700;
    height: 1.1rem;
    justify-content: center;
    left: 0;
    line-height: 1;
    position: absolute;
    top: 0.2rem;
    width: 1.1rem;
}

.plan-included-content ul.checklist-green > li > ul.checklist-green,
.plan-included-content ul.checklist-green > li > ol.checklist-green {
    margin-top: 0.75rem;
    margin-bottom: 0;
    padding-top: 0;
}

.plan-included-content ul.checklist-green > li > br + ul.checklist-green,
.plan-included-content ul.checklist-green > li > br + ol.checklist-green {
    margin-top: 0.75rem;
}

.plan-included-content ul.list-arrow-blue {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.plan-included-content ul.list-arrow-blue > li {
    list-style: none;
    margin: 0 0 0.75rem 0;
    padding-left: 1.75rem;
    position: relative;
}

.plan-included-content ul.list-arrow-blue > li::before {
    align-items: center;
    background-color: #1f6bff;
    border-radius: 999px;
    color: #ffffff;
    content: "\2192";
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 700;
    height: 1.1rem;
    justify-content: center;
    left: 0;
    line-height: 1;
    position: absolute;
    top: 0.2rem;
    width: 1.1rem;
}

.plan-included-content ul.list-arrow-blue > li > ul.list-arrow-blue,
.plan-included-content ul.list-arrow-blue > li > ol.list-arrow-blue {
    margin-top: 0.75rem;
    margin-bottom: 0;
    padding-top: 0;
}

.plan-included-content ul.list-arrow-blue > li > br + ul.list-arrow-blue,
.plan-included-content ul.list-arrow-blue > li > br + ol.list-arrow-blue {
    margin-top: 0.75rem;
}

.plan-included-content ul.list-plain {
    list-style: disc;
    margin-left: 0;
    padding-left: 1.75rem;
}

.plan-rich-content ul.icon-list,
.plan-rich-content ol.icon-list {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.plan-rich-content ul.icon-list ul.icon-list,
.plan-rich-content ul.icon-list ol.icon-list,
.plan-rich-content ol.icon-list ul.icon-list,
.plan-rich-content ol.icon-list ol.icon-list {
    margin-left: 0;
    padding-left: 1.75rem;
}

.plan-rich-content li[class*="icon-item-"] {
    list-style: none;
    align-items: start;
    column-gap: 0.5rem;
    display: grid;
    grid-template-columns: 1rem 1fr;
    line-height: 1.35;
    margin-left: 0;
    margin-bottom: 0.4rem;
    padding-left: 0;
    position: relative;
}

.plan-rich-content ul:not(.icon-list) > li[class*="icon-item-"],
.plan-rich-content ol:not(.icon-list) > li[class*="icon-item-"] {
    margin-left: -1.75rem;
}

.plan-rich-content li.icon-item-clock,
.plan-rich-content li.icon-item-calendar,
.plan-rich-content li.icon-item-repeat,
.plan-rich-content li.icon-item-book,
.plan-rich-content li.icon-item-person,
.plan-rich-content li.icon-item-check {
    list-style: none;
    align-items: start;
    column-gap: 0.5rem;
    display: grid;
    grid-template-columns: 1rem 1fr;
    line-height: 1.35;
    margin-left: 0;
    margin-bottom: 0.4rem;
    padding-left: 0;
    position: relative;
}

.plan-rich-content ul:not(.icon-list) > li.icon-item-clock,
.plan-rich-content ul:not(.icon-list) > li.icon-item-calendar,
.plan-rich-content ul:not(.icon-list) > li.icon-item-repeat,
.plan-rich-content ul:not(.icon-list) > li.icon-item-book,
.plan-rich-content ul:not(.icon-list) > li.icon-item-person,
.plan-rich-content ul:not(.icon-list) > li.icon-item-check,
.plan-rich-content ol:not(.icon-list) > li.icon-item-clock,
.plan-rich-content ol:not(.icon-list) > li.icon-item-calendar,
.plan-rich-content ol:not(.icon-list) > li.icon-item-repeat,
.plan-rich-content ol:not(.icon-list) > li.icon-item-book,
.plan-rich-content ol:not(.icon-list) > li.icon-item-person,
.plan-rich-content ol:not(.icon-list) > li.icon-item-check {
    margin-left: -1.75rem;
}

.plan-rich-content li.icon-item-clock::before,
.plan-rich-content li.icon-item-calendar::before,
.plan-rich-content li.icon-item-repeat::before,
.plan-rich-content li.icon-item-book::before,
.plan-rich-content li.icon-item-person::before,
.plan-rich-content li.icon-item-check::before {
    color: #9aa3ad;
    font-family: "bootstrap-icons";
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    line-height: 1;
    margin-top: 0.12rem;
    position: static;
    text-transform: none;
}

.plan-rich-content li.icon-item-clock::before { content: "\F293"; }
.plan-rich-content li.icon-item-calendar::before { content: "\F214"; }
.plan-rich-content li.icon-item-repeat::before { content: "\F130"; }
.plan-rich-content li.icon-item-book::before { content: "\F194"; }
.plan-rich-content li.icon-item-person::before { content: "\F4DA"; }
.plan-rich-content li.icon-item-check::before { content: "\F26B"; color: #2da66a; }

.plan-rich-content li > i.bi,
.plan-rich-content li > em.bi {
    display: inline-block;
    font-family: "bootstrap-icons";
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    margin-right: 0.5rem;
    margin-top: 0.12rem;
    text-transform: none;
}

.plan-rich-content ul li > ul,
.plan-rich-content ul li > ol {
    margin-top: 0.4rem;
    margin-bottom: 0;
    padding-top: 0;
}

.plan-rich-content li.icon-item-clock > ul,
.plan-rich-content li.icon-item-clock > ol,
.plan-rich-content li.icon-item-calendar > ul,
.plan-rich-content li.icon-item-calendar > ol,
.plan-rich-content li.icon-item-repeat > ul,
.plan-rich-content li.icon-item-repeat > ol,
.plan-rich-content li.icon-item-book > ul,
.plan-rich-content li.icon-item-book > ol,
.plan-rich-content li.icon-item-person > ul,
.plan-rich-content li.icon-item-person > ol,
.plan-rich-content li.icon-item-check > ul,
.plan-rich-content li.icon-item-check > ol {
    grid-column: 2;
}

.plan-rich-content li[class*="icon-item-"] > ul,
.plan-rich-content li[class*="icon-item-"] > ol {
    grid-column: 2;
}

.accordion-body { /* themed accordion body */
    background-color: var(--surface-bg); /* accordion body background */
    color: var(--surface-text); /* accordion body text */
} /* end .accordion-body */

.accordion-button { /* themed accordion button */
    background-color: var(--surface-bg); /* accordion button background */
    color: var(--surface-text); /* accordion button text */
} /* end .accordion-button */

.accordion-button:not(.collapsed) { /* themed accordion active */
    background-color: var(--surface-bg); /* active background */
    color: var(--surface-text); /* active text */
} /* end .accordion-button:not(.collapsed) */

.theme-page { /* themed page wrapper */
    background-color: transparent; /* keep page background */
    color: var(--body-text); /* themed text */
} /* end .theme-page */

.homepage-hero { /* homepage hero offset */
    margin-top: -1.5rem; /* cover main top gap */
    padding-top: calc(3rem + 1.5rem); /* keep hero padding */
} /* end .homepage-hero */

@media (max-width: 575.98px) {
    .homepage-hero .display-3 {
        font-size: clamp(1.2rem, 7.6vw, 1.9rem) !important;
        line-height: 1.08 !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .homepage-hero .lead {
        font-size: clamp(0.98rem, 5.2vw, 1.15rem) !important;
        line-height: 1.5 !important;
    }

    .homepage-hero .text-start {
        max-width: 100% !important;
    }
}

main {
    flex: 1;
}

footer {
    margin-top: auto;
}

/* Custom button styles can be added here */
/* Form styles can be added here */
/* Course card styles will be added here */

/* Hint Toggle System */
.hint-content {
    transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
}

.hint-content.hint-hidden {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
}

#hint-toggle-btn {
    transition: all 0.2s ease-in-out;
}

#hint-toggle-btn:hover {
    transform: scale(1.05);
}

#hint-toggle-btn .bi {
    transition: transform 0.2s ease-in-out;
}

#hint-toggle-btn:hover .bi {
    transform: rotate(15deg);
}

/* Dropdown Submenu Support */
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
    margin-left: 0.1rem;
}

/* On hover, show the submenu */
.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

/* Dropdown item with toggle arrow */
.dropdown-submenu > .dropdown-toggle::after {
    transform: rotate(-90deg);
    position: absolute;
    right: 6px;
    top: 0.8em;
}

/* Account dropdown preferences open inline below row (avoid right flyout clipping) */
.shell-nav-account-dropdown .shell-nav-preferences-toggle .shell-nav-preferences-chevron {
    transition: transform 0.2s ease;
}

.shell-nav-account-dropdown .shell-nav-preferences-toggle[aria-expanded="true"] .shell-nav-preferences-chevron {
    transform: rotate(180deg);
}

.shell-nav-account-dropdown .shell-nav-preferences-panel {
    background-color: transparent;
}

/* Account menu: hover must contrast with dropdown surface (nav-secondary-bg often matches surface-bg) */
.shell-nav-account-dropdown > .dropdown-menu .dropdown-item {
    color: var(--surface-text);
}

.shell-nav-account-dropdown > .dropdown-menu .dropdown-item:hover,
.shell-nav-account-dropdown > .dropdown-menu .dropdown-item:focus {
    background-color: rgba(15, 23, 42, 0.08);
    color: var(--surface-text);
}

[data-theme="dark"] .shell-nav-account-dropdown > .dropdown-menu .dropdown-item:hover,
[data-theme="dark"] .shell-nav-account-dropdown > .dropdown-menu .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.12);
    color: var(--surface-text);
}

/* Homepage FAQ (Stitch-inspired EduCourse FAQ Desktop layout; Bootstrap + scoped CSS only) */
.homepage-faq-stitch-wrapper {
    background-color: var(--body-bg);
    color: var(--body-text);
}

.homepage-faq-hero {
    position: relative;
    background-color: #1c5d99;
    color: #ffffff;
    overflow: hidden;
}

.homepage-faq-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 120% 80% at 30% 20%, rgba(255, 255, 255, 0.14), transparent 55%),
        linear-gradient(165deg, rgba(0, 40, 80, 0.35), transparent 45%);
    pointer-events: none;
}

.homepage-faq-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding: 3rem 1.25rem 3.25rem;
    text-align: center;
}

@media (min-width: 768px) {
    .homepage-faq-hero-inner {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
}

.homepage-faq-hero-title {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: clamp(1.85rem, 4vw, 3rem);
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin-bottom: 1.5rem;
}

.homepage-faq-search-wrap {
    position: relative;
    width: 100%;
    max-width: 42rem;
    margin-left: auto;
    margin-right: auto;
}

.homepage-faq-search-wrap .bi-search {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.25rem;
    color: #1c5d99;
    z-index: 2;
    pointer-events: none;
}

.homepage-faq-search-wrap input[type="search"] {
    width: 100%;
    padding: 1rem 1rem 1rem 3rem;
    border: none;
    border-radius: 0.75rem;
    font-size: 1.05rem;
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.18);
}

.homepage-faq-quick-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.homepage-faq-quick-link {
    font-size: 0.875rem;
    padding: 0.35rem 0.9rem;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, 0.12);
    border: 1px solid transparent;
    color: #ffffff !important;
    text-decoration: none;
    transition: background-color 0.18s ease, border-color 0.18s ease;
}

.homepage-faq-quick-link:hover {
    background-color: rgba(255, 255, 255, 0.28);
    border-color: rgba(255, 255, 255, 0.35);
    color: #ffffff !important;
}

.homepage-faq-shell {
    max-width: 1200px;
}

.homepage-faq-category-anchor {
    scroll-margin-top: 6rem;
}

.homepage-faq-sidebar {
    position: sticky;
    top: 5.5rem;
}

.homepage-faq-sidebar-title {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 1rem;
}

.homepage-faq-nav-btn {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    text-align: left;
    padding: 0.65rem 1rem;
    border: none;
    border-radius: 0.5rem;
    background-color: transparent;
    color: var(--body-text);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    transition: background-color 0.18s ease, color 0.18s ease;
}

.homepage-faq-nav-btn:hover {
    background-color: rgba(28, 93, 153, 0.08);
    color: var(--body-text);
}

.homepage-faq-nav-btn--active {
    background-color: #eae7e7;
    color: #004579;
}

[data-theme="dark"] .homepage-faq-nav-btn--active {
    background-color: rgba(255, 255, 255, 0.08);
    color: #b4c5e4;
}

.homepage-faq-sidebar-callout {
    padding: 1rem;
    margin-top: 1.75rem;
    border-radius: 0.75rem;
    border: 1px solid #c1c7d1;
    background-color: rgba(251, 249, 248, 0.85);
}

[data-theme="dark"] .homepage-faq-sidebar-callout {
    border-color: rgba(255, 255, 255, 0.18);
    background-color: rgba(47, 47, 47, 0.95);
}

.homepage-faq-category-head {
    border-bottom: 1px solid #c1c7d1;
    padding-bottom: 1rem;
    margin-bottom: 1.25rem;
}

.homepage-faq-category-title {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: clamp(1.35rem, 2.5vw, 2rem);
    color: #004579;
    margin-bottom: 0.35rem;
}

[data-theme="dark"] .homepage-faq-category-title {
    color: #b4c5e4;
}

.homepage-faq-category-lead {
    color: var(--text-muted);
    margin-bottom: 0;
    font-size: 0.98rem;
}

.homepage-faq-item-card {
    border-radius: 0.75rem !important;
    border: 1px solid #c1c7d1 !important;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.homepage-faq-item-card:hover {
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

[data-theme="dark"] .homepage-faq-item-card {
    border-color: rgba(255, 255, 255, 0.14) !important;
}

#learn-more .homepage-faq-stitch-wrapper .accordion-button {
    background-color: #ffffff;
    color: #1b1c1c;
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 1.15rem;
    line-height: 1.35;
    padding: 1rem 1.25rem;
    box-shadow: none;
}

[data-theme="dark"] #learn-more .homepage-faq-stitch-wrapper .accordion-button {
    background-color: var(--surface-bg);
    color: var(--surface-text);
}

#learn-more .homepage-faq-stitch-wrapper .accordion-button:not(.collapsed) {
    background-color: #ffffff;
    color: #ee6023;
    box-shadow: none;
}

[data-theme="dark"] #learn-more .homepage-faq-stitch-wrapper .accordion-button:not(.collapsed) {
    background-color: var(--surface-bg);
    color: #ee6023;
}

#learn-more .homepage-faq-stitch-wrapper .accordion-button:focus {
    box-shadow: none;
    border-color: transparent;
}

#learn-more .homepage-faq-stitch-wrapper .accordion-button::after {
    filter: none;
}

.homepage-faq-cta-strip {
    margin-top: 2.5rem;
    padding: 1.75rem;
    border-radius: 1rem;
    border: 1px solid rgba(28, 93, 153, 0.18);
    background-color: #f6f3f2;
    align-items: center;
    gap: 1.25rem;
}

[data-theme="dark"] .homepage-faq-cta-strip {
    background-color: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.12);
}

.homepage-faq-resources {
    background-color: #f1f5f9;
    border-top: 1px solid #c1c7d1;
    border-bottom: 1px solid #c1c7d1;
}

[data-theme="dark"] .homepage-faq-resources {
    background-color: #121820;
    border-color: rgba(255, 255, 255, 0.12);
}

.homepage-faq-resources-title {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: clamp(1.35rem, 2.5vw, 2rem);
    text-align: center;
    margin-bottom: 2rem;
    color: #004579;
}

[data-theme="dark"] .homepage-faq-resources-title {
    color: #e8eef7;
}

.homepage-faq-resource-tile {
    position: relative;
    border-radius: 1rem;
    overflow: hidden;
    min-height: 180px;
    transition: transform 0.22s ease;
}

.homepage-faq-resource-tile:hover {
    transform: translateY(-3px);
}

.homepage-faq-resource-tile a {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
    min-height: 180px;
    padding: 1.25rem;
    color: #ffffff !important;
    text-decoration: none;
}

.homepage-faq-resource-tile--a {
    background: linear-gradient(135deg, #1c5d99 0%, #3066be 100%);
}

.homepage-faq-resource-tile--b {
    background: linear-gradient(135deg, #0f2744 0%, #1c5d99 100%);
}

.homepage-faq-resource-tile--c {
    background: linear-gradient(135deg, #661931 0%, #ee6023 100%);
}

.homepage-faq-resource-eyebrow {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 0.35rem;
}

.homepage-faq-resource-heading {
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 1.15rem;
    margin-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
    .homepage-faq-resource-tile:hover {
        transform: none;
    }
}

/* FAQ answer panels inside Stitch FAQ layout */
#learn-more .accordion-body.homepage-faq-answer {
    line-height: 1.8;
    background-color: var(--surface-bg);
    color: var(--surface-text);
}

/* React /subscriptions/plans browse (SubscriptionsBrowseApp) */
.subscriptions-browse-page {
    background-color: var(--body-bg);
    color: var(--body-text);
}

.subscriptions-browse-app {
    padding-bottom: 5.5rem;
}

@media (min-width: 992px) {
    .subscriptions-browse-app {
        padding-bottom: 1rem;
    }
}

.subscriptions-browse-hero-title p,
.subscriptions-browse-hero-subtitle p {
    margin-bottom: 0;
}

/* Subtitle uses .catalog-page-header-description for font; keep layout helpers only */

.subscriptions-browse-tile {
    position: relative;
    overflow: hidden;
    border-radius: 0.5rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background-color: var(--surface-bg);
    /* Keep whole words on one line; do not break mid-word (e.g. Comprehensive) */
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
    -webkit-hyphens: none;
}

.subscriptions-browse-tile .subscriptions-browse-tile-title,
.subscriptions-browse-tile .subscriptions-browse-tile-title p,
.subscriptions-browse-tile .subscriptions-browse-tile-subtitle,
.subscriptions-browse-tile .subscriptions-browse-tile-subtitle p,
.subscriptions-browse-tile .subscriptions-browse-pricing,
.subscriptions-browse-tile .subscriptions-browse-bullet-text,
.subscriptions-browse-tile .subscriptions-browse-bullet-text p {
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
    -webkit-hyphens: none;
}

/* Avoid flex min-width:0 on the text span so lines wrap only at spaces, not inside words */
.subscriptions-browse-tile .subscriptions-browse-bullet-text {
    flex: 1 1 auto;
    min-width: auto;
}

.subscriptions-browse-tier-primer {
    border-top: 4px solid var(--catalog-group-tier1-header-bg);
}

.subscriptions-browse-tier-intermediate {
    border-top: 4px solid var(--catalog-group-tier2-header-bg);
}

.subscriptions-browse-tier-advanced {
    border-top: 4px solid var(--catalog-group-tier3-header-bg);
}

.subscriptions-browse-popular-ribbon {
    position: absolute;
    top: 0;
    right: 0;
    width: 140px;
    height: 140px;
    overflow: hidden;
    z-index: 2;
    pointer-events: none;
}

.subscriptions-browse-popular-ribbon span {
    position: absolute;
    display: block;
    width: 200px;
    padding: 0.4rem 0;
    background-color: #8b4513;
    color: #ffffff;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-align: center;
    transform: rotate(45deg);
    right: -48px;
    top: 26px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.subscriptions-browse-tile-title {
    font-family: var(--font-heading);
    font-weight: 600;
    color: #2b548a;
    text-align: left;
    font-size: 1.35rem;
}

.subscriptions-browse-tile-title p {
    margin-bottom: 0;
}

.subscriptions-browse-tile-subtitle {
    letter-spacing: 0.06em;
    text-align: left;
    font-size: 0.65rem;
}

.subscriptions-browse-tile-subtitle p {
    margin-bottom: 0;
}

.subscriptions-browse-pricing {
    text-align: left;
}

.subscriptions-browse-price-amount {
    font-size: 2rem;
    font-weight: 700;
    color: var(--body-text);
}

.subscriptions-browse-price-period {
    font-size: 1rem;
    font-weight: 700;
}

.subscriptions-browse-bullet-icon {
    flex-shrink: 0;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
}

.subscriptions-browse-bullet-icon--inline {
    width: 2em;
    height: 2em;
    font-size: 0.75rem;
    line-height: 1;
    vertical-align: middle;
    margin-right: 0.5rem;
}

.eald-editor-icon-list {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

.eald-editor-icon-list > .eald-editor-icon-list-item {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.subscriptions-browse-bullet-item--inline-icon .subscriptions-browse-bullet-text > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline,
.subscriptions-browse-bullet-item--inline-icon .subscriptions-browse-bullet-text > .subscriptions-browse-bullet-icon--inline {
    margin-left: calc(-1 * (2em + 0.5rem));
    margin-right: 0.5rem;
}

.subscriptions-browse-bullet-inline-icon-slot {
    flex-shrink: 0;
    width: 2em;
    height: 2em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.subscriptions-browse-bullet-inline-icon-slot .subscriptions-browse-bullet-icon--inline {
    margin: 0;
}

#courseDetailMainCol .lead ul:has(> li > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline),
#courseDetailMainCol .lead ol:has(> li > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline),
.admin-course-rich-description ul:has(> li > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline),
.admin-course-rich-description ol:has(> li > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline) {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

#courseDetailMainCol .lead ul:has(> li > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline) > li,
#courseDetailMainCol .lead ol:has(> li > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline) > li,
.admin-course-rich-description ul:has(> li > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline) > li,
.admin-course-rich-description ol:has(> li > .eald-inline-icon-token.subscriptions-browse-bullet-icon--inline) > li {
    list-style: none;
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.subscriptions-browse-bullet-star {
    background-color: #ee6023;
    color: #ffffff;
}

.subscriptions-browse-bullet-check {
    background-color: var(--catalog-group-tier1-header-bg);
    color: #ffffff;
}

.subscriptions-browse-bullet-star-red {
    background-color: #c62828;
    color: #ffffff;
}

.subscriptions-browse-bullet-check-light {
    background-color: #5c6bc0;
    color: #ffffff;
}

.subscriptions-browse-bullet-dash {
    background-color: #6d6d6d;
    color: #ffffff;
}

.subscriptions-browse-bullet-dot {
    background-color: #78909c;
    color: #ffffff;
    font-size: 0.45rem;
}

.subscriptions-browse-bullet-plus {
    background-color: #2e7d32;
    color: #ffffff;
}

/* Same plus icon as above; neutral circle so it does not read as a strong accent */
.subscriptions-browse-bullet-plus-plain {
    background-color: #9e9e9e;
    color: #ffffff;
}

.subscriptions-browse-bullet-text {
    font-size: 0.9rem;
    line-height: 1.35;
}

.subscriptions-browse-bullet-text p {
    margin-bottom: 0;
}

.subscriptions-browse-cta-popular {
    background-color: #2b548a;
    border-color: #2b548a;
    color: #ffffff;
}

.subscriptions-browse-cta-secondary {
    background-color: #e8e8e8;
    border-color: #d0d0d0;
    color: #2b548a;
}

[data-theme="dark"] .subscriptions-browse-cta-secondary {
    background-color: #3a3a3a;
    border-color: #555555;
    color: #b4c5e4;
}

[data-theme="dark"] .subscriptions-browse-tile-title {
    color: #b4c5e4;
}

[data-theme="dark"] .subscriptions-browse-price-amount {
    color: var(--body-text);
}

.subscriptions-browse-include-card {
    background: #48475c;
    color: #ffffff;
}

.subscriptions-browse-include-title {
    color: #ffffff;
}

.subscriptions-browse-page [id="self-paced-learning"],
.subscriptions-browse-page [id="cohort-support"],
.subscriptions-browse-page [id="comprehensive-program"],
.subscriptions-browse-page #executive-organizational-inquiry {
    scroll-margin-top: 5.5rem;
}

/* Inline comparison table on Ways to Engage shares catalog comparison styles */
.subscriptions-browse-comparison-embed.plans-comparison-page {
    padding-left: 0;
    padding-right: 0;
}

.subscriptions-browse-see-all-plans {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
    color: #ee6023;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.25;
    text-transform: none;
    letter-spacing: normal;
    border-radius: 0;
    transition: color 0.15s ease, opacity 0.15s ease;
}

.subscriptions-browse-see-all-plans:hover {
    color: #c74f1c;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.subscriptions-browse-see-all-plans:focus-visible {
    outline: 2px solid #ee6023;
    outline-offset: 3px;
}

.subscriptions-browse-see-all-plans-arrow {
    font-size: 1.1em;
    line-height: 1;
    margin-top: 0.05em;
}

[data-theme="dark"] .subscriptions-browse-see-all-plans {
    color: #f28b52;
}

[data-theme="dark"] .subscriptions-browse-see-all-plans:hover {
    color: #ffb07a;
}

.subscriptions-browse-aux-nav {
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    margin-top: 0.5rem;
}

[data-theme="dark"] .subscriptions-browse-aux-nav {
    border-top-color: rgba(255, 255, 255, 0.12);
}


/* Course Builder index: list row cover thumbnails (full aspect ratio, no crop) */
.course-builder-index-thumb {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: 56px;
    max-width: 200px;
    border-radius: 0.375rem;
    overflow: hidden;
    background-color: var(--bs-secondary-bg);
    line-height: 0;
}

.course-builder-index-thumb-img {
    max-height: 56px;
    max-width: 200px;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.course-builder-index-thumb-placeholder {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
}

.course-builder-index-list .course-builder-index-row {
    text-decoration: none;
    color: inherit;
}

/* Course title link: use site theme text (Bootstrap .text-body follows --bs-body-color, which may not match html[data-theme="dark"]). */
.course-builder-index-list .course-builder-index-row > a.list-group-item-action {
    color: var(--body-text);
}

.eald-dr-serice-name {
    white-space: nowrap;
}

.checkout-layout-grid {
    display: grid;
    gap: 1.5rem;
    grid-template-areas:
        "review"
        "shipping"
        "payment"
        "info"
        "actions";
}

.checkout-layout-grid--no-shipping {
    grid-template-areas:
        "review"
        "payment"
        "info"
        "actions";
}

.checkout-sidebar {
    display: contents;
}

.checkout-order-review {
    grid-area: review;
}

.checkout-shipping {
    grid-area: shipping;
}

.checkout-payment {
    grid-area: payment;
}

.checkout-customer-info {
    grid-area: info;
}

.checkout-actions {
    grid-area: actions;
}

.checkout-main-stack {
    display: contents;
}

.checkout-order-review .checkout-sidebar-item {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.checkout-order-review .checkout-sidebar-item h6 {
    font-size: 0.95rem;
}

.checkout-order-review .checkout-sidebar-item small {
    font-size: 0.8rem;
}

.checkout-order-review .checkout-sidebar-item .rounded {
    height: 48px !important;
}

.checkout-order-review .checkout-sidebar-item img {
    max-height: 48px;
    width: auto;
}

@media (min-width: 992px) {
    .checkout-layout-grid {
        grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
        grid-template-areas:
            "shipping sidebar"
            "main sidebar";
        align-items: start;
    }

    .checkout-layout-grid--no-shipping {
        grid-template-areas:
            "main sidebar";
    }

    .checkout-sidebar {
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
        grid-area: sidebar;
        position: sticky;
        top: 80px;
        z-index: 1;
        align-self: start;
        max-height: calc(100vh - 6rem);
    }

    .checkout-order-review {
        flex: 1 1 auto;
        min-height: 0;
        overflow: auto;
    }

    .checkout-customer-info {
        flex: 0 0 auto;
    }

    .checkout-main-stack {
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
        grid-area: main;
        align-self: start;
    }

    .checkout-main-stack .checkout-payment,
    .checkout-main-stack .checkout-actions {
        grid-area: unset;
    }

    .checkout-actions {
        align-items: flex-start;
    }
}

/* Publication shipping address compact layout (cart, checkout, profile) */
.shipping-address-panel .card-header {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.shipping-address-panel .card-header h5,
.shipping-address-panel .card-header h3 {
    font-size: 1rem;
}

.shipping-address-panel .card-body {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.shipping-address-intro {
    font-size: 0.875rem;
    line-height: 1.35;
    margin-bottom: 0.5rem;
}

.shipping-address-fields .form-label {
    font-size: 0.8125rem;
    margin-bottom: 0.125rem;
}

.shipping-address-fields .form-control,
.shipping-address-fields .form-select {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    min-height: calc(1.5em + 0.5rem + 2px);
}

.shipping-address-fields-note {
    margin-top: 0.375rem;
    font-size: 0.75rem;
    line-height: 1.3;
}

.shipping-address-form-actions {
    margin-top: 0.5rem;
}

.shipping-address-form-actions .form-text {
    margin-top: 0.25rem;
    font-size: 0.75rem;
    line-height: 1.3;
}

.shipping-address-suggestion.alert {
    margin-top: 0.5rem;
    margin-bottom: 0;
    padding: 0.5rem 0.75rem;
}

.shipping-address-suggestion-heading {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.shipping-address-status.alert {
    margin-top: 0.5rem;
    margin-bottom: 0;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
}

.shipping-address-display p {
    margin-bottom: 0.125rem;
    font-size: 0.9375rem;
    line-height: 1.35;
}