.course-catalog-page { max-width:1600px; padding:14px; margin:auto; }
.course-catalog-heading { margin:18px 0; padding:22px; border:1px solid #d9e3ed; border-top:4px solid var(--focus-color,#1767a7); border-radius:16px; background:#fff; color:#172b46; }
.course-catalog-heading h1 { font-size:28px; font-weight:700; margin:0 0 6px; }
.course-catalog-heading p { margin:0; }
.course-catalog { --course-bg:#fff; --course-fg:#172b46; --course-soft:#edf4fa; --course-line:#d9e3ed; color:var(--course-fg); }
.theme-dark .course-catalog { --course-bg:#172536; --course-fg:#e8f0fa; --course-soft:#25374b; --course-line:#40526a; }
.theme-dark .course-catalog-heading { background:#172536; color:#e8f0fa; border-color:#40526a; }
.dr-classes .course-catalog { --course-bg:var(--dr-surface); --course-fg:var(--dr-ink); --course-soft:var(--dr-soft); --course-line:var(--dr-line); --focus-color:var(--dr-primary); --focus-contrast:var(--dr-primary-text); }
.dr-classes .dr-embed-header { flex-shrink:0; flex-wrap:wrap; }
.course-catalog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.course-level-filters { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; margin:0 0 20px; }
.course-level-toggle { border:1px solid var(--course-line); border-radius:999px; padding:9px 16px; font:inherit; font-weight:600; background:var(--course-bg); color:var(--course-fg); cursor:pointer; }
.course-level-toggle span { font-weight:400; }
.course-level-toggle.is-active { background:var(--focus-color,#1767a7); border-color:var(--focus-color,#1767a7); color:var(--focus-contrast,#fff); }
.course-level-toggle:disabled { opacity:.4; cursor:not-allowed; }
.course-level-toggle:focus-visible { outline:2px solid var(--focus-color,#1767a7); outline-offset:3px; }
.course-catalog .course-catalog-card[hidden] { display:none; }
.course-catalog-card { display:flex; flex-direction:column; overflow:hidden; background:var(--course-bg); border:1px solid var(--course-line); border-radius:15px; box-shadow:0 3px 10px #122f4a0a; }
.course-catalog-card.has-dates { cursor:pointer; }
.course-catalog-card.has-dates:hover { border-color:var(--focus-color,#1767a7); }
.course-catalog-image { position:relative; aspect-ratio:16/9; display:grid; place-items:center; background:var(--course-soft); overflow:hidden; }
.course-catalog-placeholder { font-size:54px; opacity:.45; }
.course-catalog-image img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.course-catalog-content { padding:18px; display:flex; flex-direction:column; flex:1; gap:12px; }
.course-catalog-content h2 { margin:0; font-size:20px; font-weight:700; color:inherit; }
.course-catalog-description { max-height:200px; overflow:auto; overflow-wrap:anywhere; font-size:14px; line-height:1.6; }
.course-catalog-description img { max-width:100%; height:auto; }
.course-catalog-description table { max-width:100%; }
.course-catalog-description > :first-child { margin-top:0; }
.course-catalog-actions { margin-top:auto; padding-top:8px; display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.course-catalog-count { border:1px solid transparent; border-radius:999px; padding:7px 13px; background:var(--focus-color,#1767a7); color:var(--focus-contrast,#fff); font-size:13px; font-weight:700; cursor:pointer; }
.course-catalog-count:disabled { background:var(--course-soft); color:var(--course-fg); opacity:.65; cursor:default; }
.course-catalog-request { background:transparent; color:var(--course-fg); font-size:12px; border:1px solid var(--course-line); border-radius:8px; padding:7px 10px; cursor:pointer; }
.course-schedule-dialog { width:min(900px,calc(100vw - 30px)); max-height:90vh; border:1px solid var(--course-line); border-radius:16px; padding:0; background:var(--course-bg); color:var(--course-fg); box-shadow:0 24px 70px #0005; }
.course-schedule-dialog::backdrop { background:#0b172a99; }
.course-schedule-dialog > header { padding:20px; display:flex; justify-content:space-between; gap:16px; background:var(--course-soft); border-bottom:1px solid var(--course-line); }
.course-schedule-dialog h2 { margin:0; font-size:23px; font-weight:700; color:inherit; }
.course-schedule-dialog header p { margin:6px 0 0; font-size:13px; }
.course-schedule-dialog button { border:1px solid var(--course-line); border-radius:8px; padding:7px 14px; background:var(--course-bg); color:inherit; cursor:pointer; }
.course-schedule-dialog header button { font-size:25px; align-self:flex-start; line-height:1; }
.course-schedule-list { padding:18px; }
.course-start { border:1px solid var(--course-line); border-radius:10px; padding:14px; margin-bottom:12px; }
.course-start summary { cursor:pointer; }
.course-start-meta { display:inline-flex; gap:12px; align-items:center; float:right; margin-left:10px; }
.course-seat-pill { background:var(--course-soft); border-radius:999px; padding:3px 10px; font-size:12px; }
.course-session { padding:10px 0; border-top:1px solid var(--course-line); margin-top:12px; }
.course-session h3 { font-size:15px; font-weight:700; margin:0 0 6px; color:inherit; }
.course-session p { font-size:14px; margin:6px 0 0; white-space:pre-line; }
.course-schedule-dialog footer { text-align:right; padding:14px 18px; border-top:1px solid var(--course-line); }
@media(max-width:1000px) { .course-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:620px) { .course-catalog-grid { grid-template-columns:1fr; } .course-start-meta { float:none; display:flex; margin:8px 0 0; } }

.course-catalog-request:hover { border-color:var(--focus-color,#1767a7); background:var(--course-soft); }
.course-request-dialog { width:min(680px,calc(100vw - 30px)); }
.course-request-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding:20px; }
.course-request-fields label { display:flex; flex-direction:column; gap:6px; font-size:14px; font-weight:600; }
.course-request-fields input,.course-request-fields select,.course-request-fields textarea { box-sizing:border-box; width:100%; border:1px solid var(--course-line); border-radius:8px; padding:10px; background:var(--course-bg); color:var(--course-fg); font:inherit; font-weight:400; }
.course-request-fields textarea { resize:vertical; }
.course-request-wide { grid-column:1/-1; }
.course-request-status { margin:0; padding:12px; background:var(--course-soft); border-radius:8px; }
.course-request-status.is-error { border:1px solid #bb3434; }
.course-request-dialog button[type=submit] { background:var(--focus-color,#1767a7); color:var(--focus-contrast,#fff); }
.course-request-dialog button:disabled { opacity:.6; cursor:wait; }
.course-request-fields label[hidden],.course-request-fields [hidden] { display:none; }
@media(max-width:620px) { .course-request-fields { grid-template-columns:1fr; padding:16px; } }

.course-start-actions { display:flex; justify-content:flex-end; margin-top:14px; }
.course-start-book,.course-schedule-dialog .course-start-book { display:inline-block; border:0; border-radius:8px; padding:9px 22px; font-size:14px; font-weight:700; text-decoration:none; background:var(--focus-color,#1767a7); color:var(--focus-contrast,#fff); cursor:pointer; }
.course-start-book:hover { filter:brightness(.92); }
.course-schedule-dialog .course-start-book:disabled { background:var(--course-soft); color:var(--course-fg); opacity:.65; cursor:default; }

/* Built-in Classes page layouts. Embedded course widgets retain their own grid. */
.course-catalog--rows .course-catalog-grid,
.course-catalog--compact .course-catalog-grid { grid-template-columns:minmax(0,1fr); }
.course-catalog--rows .course-catalog-card { flex-direction:row; min-height:210px; }
.course-catalog--rows .course-catalog-image { flex:0 0 clamp(180px,25%,320px); aspect-ratio:auto; }
.course-catalog--rows .course-catalog-content { min-width:0; }
.course-catalog--rows .course-catalog-description { max-height:145px; }
.course-catalog--rows .course-catalog-actions { justify-content:flex-end; }
.course-catalog--compact .course-catalog-grid { gap:12px; }
.course-catalog--compact .course-catalog-card { display:grid; grid-template-columns:112px minmax(0,1fr); align-items:start; }
.course-catalog--compact .course-catalog-image { width:84px; height:84px; aspect-ratio:1; margin:14px; border-radius:10px; }
.course-catalog--compact .course-catalog-placeholder { font-size:32px; }
.course-catalog--compact .course-catalog-content { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 20px; padding:16px 18px 16px 0; min-width:0; }
.course-catalog--compact .course-catalog-content h2 { grid-column:1; font-size:18px; }
.course-catalog--compact .course-catalog-description { grid-column:1; max-height:4.8em; font-size:13px; }
.course-catalog--compact .course-catalog-actions { grid-column:2; grid-row:1 / span 2; align-self:center; flex-direction:column; align-items:stretch; padding:0; margin:0; }
@media(max-width:620px) {
  .course-catalog--rows .course-catalog-card { flex-direction:column; }
  .course-catalog--rows .course-catalog-image { flex:none; width:100%; aspect-ratio:16/9; }
  .course-catalog--rows .course-catalog-actions { justify-content:space-between; }
  .course-catalog--compact .course-catalog-card { grid-template-columns:88px minmax(0,1fr); }
  .course-catalog--compact .course-catalog-image { width:64px; height:64px; margin:12px; }
  .course-catalog--compact .course-catalog-content { display:flex; padding:12px 12px 12px 0; gap:9px; }
  .course-catalog--compact .course-catalog-actions { flex-direction:row; align-items:center; align-self:stretch; justify-content:flex-start; }
}

.course-catalog-heading .course-heading-icon--black { color:#000; }
.course-catalog-heading .course-heading-icon--theme { color:var(--focus-color,#1767a7); }

.course-catalog-name { padding:0; border:0; background:transparent; color:inherit; font:inherit; text-align:inherit; cursor:pointer; }
.course-catalog-name:hover { color:var(--focus-color,#1767a7); text-decoration:underline; text-underline-offset:3px; }
.course-catalog-name:focus-visible { outline:2px solid var(--focus-color,#1767a7); outline-offset:4px; border-radius:3px; }
.course-detail-dialog { width:min(1000px,calc(100vw - 30px)); }
.course-detail-body { padding:20px; }
.course-detail-image { display:grid; place-items:center; overflow:hidden; margin-bottom:20px; border-radius:12px; background:var(--course-soft); }
.course-detail-image img { display:block; width:100%; height:auto; max-height:360px; object-fit:contain; }
.course-detail-image img[hidden] { display:none; }
.course-detail-image .course-catalog-placeholder { padding:20px; }
.course-detail-image:has(img:not([hidden])) .course-catalog-placeholder { display:none; }
.course-detail-description { font-size:15px; line-height:1.65; overflow-wrap:anywhere; overflow-x:auto; }
.course-detail-description img { max-width:100%; height:auto; }
.course-detail-description > :first-child { margin-top:0; }
@media(max-width:620px) { .course-detail-body { padding:16px; } }

.course-detail-dialog[open] { display:flex; flex-direction:column; }
.course-detail-dialog > header,.course-detail-dialog > footer { flex-shrink:0; }
.course-detail-dialog .course-detail-body { min-height:0; overflow:auto; }
.course-detail-dialog > footer { display:flex; align-items:center; justify-content:flex-end; gap:10px; }

.course-catalog-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin:0 0 20px; }
.course-catalog-controls .course-level-filters { margin:0; }
.course-catalog-sort { display:flex; align-items:center; flex-wrap:wrap; gap:8px; font-weight:600; }
.course-catalog-sort select { background:var(--course-bg); color:var(--course-fg); border:1px solid var(--course-line); border-radius:8px; padding:9px 12px; font:inherit; max-width:100%; }
