/* ===========================================================
   BHE UNI — Course details page (v2 redesign)
   Builds on university-details.css (hero, info card, related
   cards, CTA, .ud-rich); only course-specific blocks live here.
   =========================================================== */

/* ---- hero ---- */
.cd-page .cd-banner { background: linear-gradient(100deg, #1c3f9e 0%, #2452cf 58%, #3f74e8 100%); }
.cd-page .cd-sbtn.is-saved, .cd-page .cd-sbtn.is-saved i { color: var(--brand-600); }

/* ---- content blocks ---- */
.cd-page .cd-block { margin-bottom: 34px; padding-bottom: 34px; border-bottom: 1px solid #eef2f7; }
.cd-page .cd-block:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.cd-page .cd-block > h2 { position: relative; font-weight: 600; font-size: 22px !important; line-height: 1.3; color: var(--navy-900); margin: 0 0 16px; padding-left: 16px; }
.cd-page .cd-block > h2::before { content: ""; position: absolute; left: 0; top: 3px; bottom: 3px; width: 4px; border-radius: 999px; background: var(--orange-grad); }
.cd-page .cd-block > p { font-weight: 300; font-size: 15.5px !important; line-height: 1.75; color: #5b6b82; margin: 0; }
.cd-page .ud-rich, .cd-page .ud-rich :is(p, li, td, span) { color: #5b6b82; }

/* Bulleted lists in rich text use the reference's check-circle style. */
.cd-page .cd-block .ud-rich ul { display: flex; flex-direction: column; gap: 10px; }
.cd-page .cd-block .ud-rich ul li { padding-left: 28px; line-height: 1.6; }
.cd-page .cd-block .ud-rich ul li::before { content: "\F26A"; font-family: "bootstrap-icons"; top: 1px; color: #0d9488; font-size: 17px; line-height: 1.4; }
.cd-page .ud-rich ul li p { margin: 0; }

/* ---- modules ---- */
.cd-page .cd-modules-list { display: flex; flex-direction: column; gap: 12px; }
.cd-page .cd-module-item { background: #f8fafc; border: 1px solid rgba(226,232,240,.7); border-radius: 13px; transition: border-color .25s, box-shadow .25s; }
.cd-page .cd-module-item[open], .cd-page .cd-module-item:hover { border-color: rgba(255,184,119,.7); box-shadow: 0 16px 34px -24px rgba(244,123,32,.4); }
.cd-page .cd-module-item summary { display: flex; align-items: center; gap: 12px; padding: 14px 16px; font-weight: 500; font-size: 15px; color: var(--navy-900); cursor: pointer; list-style: none; }
.cd-page .cd-module-item summary::-webkit-details-marker { display: none; }
.cd-page .cd-module-item summary:focus-visible { outline: 3px solid #ff9823; outline-offset: 2px; border-radius: 13px; }
.cd-page .cd-module-item .cm-n { width: 30px; height: 30px; border-radius: 9px; flex: none; display: grid; place-items: center; font-size: 13px; font-weight: 700; color: #fff; background: var(--orange-grad); }
.cd-page .cd-module-item .cm-chev { margin-left: auto; color: #94a3b8; transition: transform .2s; }
.cd-page .cd-module-item[open] .cm-chev { transform: rotate(180deg); }
.cd-page .cd-module-item > .ud-rich { padding: 2px 18px 18px 58px; }
.cd-page .cd-module-item > .ud-rich ul { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px; }
@media (max-width: 575px) {
  .cd-page .cd-module-item > .ud-rich { padding-left: 18px; }
  .cd-page .cd-module-item > .ud-rich ul { grid-template-columns: 1fr; }
}

/* ---- language scores ---- */
.cd-page .cd-scores { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 12px; margin: 0 0 18px; padding: 0; }
.cd-page .cd-scores li { background: #eef3fc; border: 1px solid rgba(28,63,158,.14); border-radius: 13px; padding: 12px 16px; }
.cd-page .cd-scores .sc-k { display: block; font-weight: 400; font-size: 12.5px; color: #5b6b82; }
.cd-page .cd-scores .sc-v { display: block; font-weight: 700; font-size: 22px; line-height: 1.2; color: #1c3f9e; margin-top: 2px; }

/* ---- info card ---- */
.cd-page button.cd-info-apply { border: 0; cursor: pointer; }
.cd-page .cd-info-apply.is-applied { background: #ecfdf5; color: #0d9488; box-shadow: none; cursor: default; }
.cd-page .cd-info-apply.is-applied:hover { transform: none; color: #0d9488; }

/* ---- related cards: level badge in brand orange, as in the reference ---- */
.cd-page .cd-related-card .cd-lvl { background: var(--brand-50); color: var(--brand-600); border-color: rgba(244,123,32,.2); }

/* ---- apply modal ---- */
.cd-page .cd-apply-modal .modal-content { border: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 34px 70px -34px rgba(10,26,51,.5); }
.cd-page .cd-apply-modal .modal-header { background: linear-gradient(100deg, #1c3f9e, #2a55cf); border: 0; padding: 18px 24px; }
.cd-page .cd-apply-modal .modal-title { font-weight: 600; font-size: 19px !important; color: #fff; margin: 0; }
.cd-page .cd-apply-modal .btn-close { filter: invert(1) grayscale(1) brightness(2); }
.cd-page .cd-apply-modal .modal-body { padding: 22px 24px 8px; }
.cd-page .cd-apply-modal .cd-apply-course { font-weight: 500; font-size: 15px !important; color: var(--navy-900); margin: 0 0 16px; }
.cd-page .cd-apply-modal .form-label { font-weight: 500; font-size: 13.5px; color: #1c3f9e; }
.cd-page .cd-apply-modal .form-select { height: 48px; border-radius: 12px; border-color: #dde5ef; }
.cd-page .cd-apply-modal .form-select:focus { border-color: var(--brand-400); box-shadow: 0 0 0 3px rgba(244,123,32,.15); }
.cd-page .cd-apply-modal .modal-footer { border: 0; padding: 16px 24px 22px; gap: 10px; }
.cd-page .cd-btn-primary, .cd-page .cd-btn-ghost { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 22px; border-radius: 999px; font-weight: 600; font-size: 14.5px; cursor: pointer; transition: all .2s; margin: 0; }
.cd-page .cd-btn-primary { border: 0; background: var(--orange-grad); color: #fff; box-shadow: 0 16px 32px -14px rgba(244,123,32,.6); }
.cd-page .cd-btn-primary:hover { transform: translateY(-2px); }
.cd-page .cd-btn-ghost { background: #fff; color: var(--navy-800); border: 1.5px solid #dde5ef; }
.cd-page .cd-btn-ghost:hover { border-color: var(--brand-400); color: var(--brand-600); }
