/* ==========================================================================
   New UI: Course Catalog and Digital Classrooms search pages (Find Assessments pattern).
   Every selector under .nui-on. Reusable pieces belong in new-ui-kit.css.
   ========================================================================== */

/* ---- results list: no windowing, so rows size to content ------------------ */
.nui-on .crs-list:not(.asr-view-cards):not(.asr-view-compact) .asr-row { height: auto; min-height: 76px; }
.nui-on .crs-list .asr-title { text-decoration: none; }
.nui-on .crs-list .asr-row.is-archived { opacity: .7; }
.nui-on .crs-list .asr-meta i { font-size: 11px; opacity: .8; }
.nui-on .crs-list .asr-meta { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.nui-on .crs-list .asr-meta > span { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.nui-on .crs-list .crs-created { margin: 0; }

/* cards: about 4 across at 1450px; courses/classrooms have no tags or description,
   so the card is shorter than the 184px Find Assessments card */
.nui-on .crs-list.asr-view-cards { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.nui-on .crs-list.asr-view-cards .asr-row {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "tile main" "side side";
    height: 152px;
}
.nui-on .crs-list.asr-view-cards .asr-meta { white-space: normal; flex-wrap: wrap; row-gap: 2px; column-gap: 10px; max-height: 34px; }
.nui-on .crs-list.asr-view-cards .asr-meta > span { flex: 0 1 auto; }
.nui-on .crs-list.asr-view-cards .asr-meta > .crs-course { flex-basis: 100%; }
.nui-on .crs-list.asr-view-cards .asr-title-row:empty { display: none; }
.nui-on .crs-list.asr-view-cards .asr-side:empty { display: none; }
.nui-on .crs-list.asr-view-cards .asr-side { min-height: 30px; }
.nui-on .crs-list.asr-view-cards .asr-side > .asr-actions { margin-left: auto; }
.nui-on .crs-list.asr-view-cards .crs-created { display: block; font-size: 11px; order: 5; }

/* compact: title first, then meta; empty side column collapses */
.nui-on .crs-list.asr-view-compact .asr-main > .asr-title { order: -1; flex: 1 1 auto; min-width: 0; }
.nui-on .crs-list.asr-view-compact .asr-title-row { flex: 0 0 auto; }
.nui-on .crs-list.asr-view-compact .asr-title-row:empty { display: none; }
.nui-on .crs-list.asr-view-compact .asr-meta { flex: 0 1 45%; }
.nui-on .crs-list.asr-view-compact .asr-meta > .crs-course { display: none; }
.nui-on .crs-list.asr-view-compact .asr-side:empty { display: none; }
.nui-on .crs-list.asr-view-compact .crs-created { display: none; }
.nui-on .crs-list.asr-view-compact .crs-icon-btn { width: 26px; height: 26px; }

/* rows: the side column holds the icon actions, centred */
.nui-on .crs-list:not(.asr-view-cards):not(.asr-view-compact) .asr-side { justify-content: center; }
.nui-on .crs-list:not(.asr-view-cards):not(.asr-view-compact) .asr-side:empty { display: none; }

/* ---- icon actions (star, enroll, copy) ------------------------------------ */
.nui-on .crs-icon-btn {
    width: 28px; height: 28px; padding: 0;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--asr-border); border-radius: 8px;
    background: var(--asr-white); color: var(--asr-muted);
    font-size: 12px; cursor: pointer; transition: border-color .12s, color .12s, background .12s;
}
.nui-on .crs-icon-btn:hover { border-color: var(--asr-blue); color: var(--asr-blue); }
.nui-on .crs-icon-btn.crs-fav.on { color: #E6A100; border-color: rgba(230, 161, 0, .5); background: rgba(255, 171, 0, .12); }
.nui-on .crs-icon-btn.crs-icon-btn-accent { color: var(--asr-blue); background: var(--asr-blue-soft); border-color: transparent; }
.nui-on .crs-icon-btn.crs-icon-btn-accent:hover { background: rgba(0, 116, 197, .18); }
.nui-on .crs-icon-btn[disabled] { opacity: .45; cursor: not-allowed; pointer-events: auto; }

/* ---- rail: leftovers ------------------------------------------------------ */
.nui-on .crs-page .asr-section.disabled { opacity: .5; pointer-events: none; }
.nui-on .crs-page .asr-options .asr-rail-search { margin: 0 2px 6px; }
.nui-on .crs-opt-scroll { max-height: 220px; overflow-y: auto; }
.nui-on .crs-foot { display: flex; justify-content: flex-end; padding: 4px 6px 0; }
.nui-on .crs-page .asr-option > input[type="radio"] { width: 15px; height: 15px; margin: 0; accent-color: var(--asr-blue); cursor: pointer; }
.nui-on .crs-page .asr-section-head.crs-static { cursor: default; }
.nui-on .crs-match {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    padding: 10px 8px; border-top: 1px solid var(--asr-border);
    font-size: 12.5px; color: var(--asr-text);
}
.nui-on .crs-radio { display: inline-flex; align-items: center; gap: 5px; margin: 0; font-weight: 600; cursor: pointer; }
.nui-on .crs-radio > input { width: 15px; height: 15px; margin: 0; accent-color: var(--asr-blue); cursor: pointer; }
.nui-on .crs-grade-grid { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 4px; }
.nui-on .crs-gchip {
    min-width: 34px; height: 28px; padding: 0 9px;
    border: 1px solid var(--asr-border); border-radius: 8px;
    background: var(--asr-white); color: var(--asr-text);
    font-family: var(--asr-font); font-size: 12px; cursor: pointer;
    transition: border-color .12s, background .12s, color .12s;
}
.nui-on .crs-gchip:hover { border-color: var(--asr-blue); color: var(--asr-blue); }
.nui-on .crs-gchip.on { background: var(--asr-blue-soft); border-color: var(--asr-blue); color: var(--asr-blue); font-weight: 600; }

/* Digital Classrooms rail: plain fields (the controller enhances them by id at init) */
.nui-on .crs-fields { padding: 0 8px 10px; display: flex; flex-direction: column; gap: 4px; }
.nui-on .crs-label { margin: 6px 0 0; font-size: 11.5px; font-weight: 600; color: var(--asr-muted); }
.nui-on .crs-fields .form-control { width: 100%; }

/* ---- Browse Coursework modal, step 1 (courses-catalog.nui.html) ------------
   The modal gives the host its height: fill it instead of the viewport. */
.nui-on .asr-page.ccat-page { height: 100%; min-height: 0; padding: 10px 12px 12px; gap: 10px; }
.nui-on .ccat-page .asr-top { flex: 0 0 auto; }
.nui-on .ccat-page .asr-search { flex: 0 1 420px; }
.nui-on .ccat-page .asr-row { cursor: pointer; }
.nui-on .ccat-page .asr-title { cursor: pointer; }
.nui-on .ccat-page .asr-pill.muted { display: inline-flex; }
.nui-on .ccat-page .asr-view-cards .asr-pill.muted,
.nui-on .ccat-page .asr-view-compact .asr-pill.muted { display: inline-flex; }
.nui-on .ccat-page .crs-list.asr-view-cards { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }