/* BUILD 2026-redesign-1029_3 */
/* ===================================================================== SLCC 2026 Redesign — Bootstrap 3 → 5 bridge (brownfield body content) Scope: classes from slcc-body-class-inventory.md (§3.10) that BS5 dropped. Classes still defined in legacy global/overide/academic/faculty.css (margin-top, margin-bottom, col-mob, col-xs6, faculty-peep, …) are NOT repeated here — those files still load under the merge strategy. Sections are ordered by page reach. Delete a section when its pages are rebuilt. ===================================================================== */
/* ---------- 1. img-responsive (41 pages) ---------- */
 .img-responsive {
	 display: block;
	 max-width: 100%;
	 height: auto;
}
 .img-rounded {
	 border-radius: 6px;
}
 .img-circle {
	 border-radius: 50%;
}
 .center-block {
	 display: block;
	 margin-left: auto;
	 margin-right: auto;
}
/* ---------- 2. col-xs-* shim (27 pages for col-xs-12) ---------- BS3 xs = every breakpoint = BS5 unprefixed col-N. BS5 .row > * supplies gutters. */
 .col-xs-1{
	flex:0 0 auto;
	width:8.33333333%
}
 .col-xs-2{
	flex:0 0 auto;
	width:16.66666667%
}
 .col-xs-3{
	flex:0 0 auto;
	width:25%
}
 .col-xs-4{
	flex:0 0 auto;
	width:33.33333333%
}
 .col-xs-5{
	flex:0 0 auto;
	width:41.66666667%
}
 .col-xs-6{
	flex:0 0 auto;
	width:50%
}
 .col-xs-7{
	flex:0 0 auto;
	width:58.33333333%
}
 .col-xs-8{
	flex:0 0 auto;
	width:66.66666667%
}
 .col-xs-9{
	flex:0 0 auto;
	width:75%
}
 .col-xs-10{
	flex:0 0 auto;
	width:83.33333333%
}
 .col-xs-11{
	flex:0 0 auto;
	width:91.66666667%
}
 .col-xs-12{
	flex:0 0 auto;
	width:100%
}
/* BS5 breakpoint columns re-asserted AFTER the xs shim, so `col-xs-12 col-md-6` behaves like BS3 (xs at all sizes, md wins at ≥768px). Values copied from BS 5.3.2. */
 @media (min-width:576px){
	 .col-sm{
		flex:1 0 0%
	}
	 .col-sm-1{
		flex:0 0 auto;
		width:8.3333333%
	}
	 .col-sm-2{
		flex:0 0 auto;
		width:16.666667%
	}
	 .col-sm-3{
		flex:0 0 auto;
		width:25%
	}
	 .col-sm-4{
		flex:0 0 auto;
		width:33.333333%
	}
	 .col-sm-5{
		flex:0 0 auto;
		width:41.666667%
	}
	 .col-sm-6{
		flex:0 0 auto;
		width:50%
	}
	 .col-sm-7{
		flex:0 0 auto;
		width:58.333333%
	}
	 .col-sm-8{
		flex:0 0 auto;
		width:66.666667%
	}
	 .col-sm-9{
		flex:0 0 auto;
		width:75%
	}
	 .col-sm-10{
		flex:0 0 auto;
		width:83.333333%
	}
	 .col-sm-11{
		flex:0 0 auto;
		width:91.666667%
	}
	 .col-sm-12{
		flex:0 0 auto;
		width:100%
	}
}
 @media (min-width:768px){
	 .col-md{
		flex:1 0 0%
	}
	 .col-md-1{
		flex:0 0 auto;
		width:8.3333333%
	}
	 .col-md-2{
		flex:0 0 auto;
		width:16.666667%
	}
	 .col-md-3{
		flex:0 0 auto;
		width:25%
	}
	 .col-md-4{
		flex:0 0 auto;
		width:33.333333%
	}
	 .col-md-5{
		flex:0 0 auto;
		width:41.666667%
	}
	 .col-md-6{
		flex:0 0 auto;
		width:50%
	}
	 .col-md-7{
		flex:0 0 auto;
		width:58.333333%
	}
	 .col-md-8{
		flex:0 0 auto;
		width:66.666667%
	}
	 .col-md-9{
		flex:0 0 auto;
		width:75%
	}
	 .col-md-10{
		flex:0 0 auto;
		width:83.333333%
	}
	 .col-md-11{
		flex:0 0 auto;
		width:91.666667%
	}
	 .col-md-12{
		flex:0 0 auto;
		width:100%
	}
}
 @media (min-width:992px){
	 .col-lg{
		flex:1 0 0%
	}
	 .col-lg-1{
		flex:0 0 auto;
		width:8.3333333%
	}
	 .col-lg-2{
		flex:0 0 auto;
		width:16.666667%
	}
	 .col-lg-3{
		flex:0 0 auto;
		width:25%
	}
	 .col-lg-4{
		flex:0 0 auto;
		width:33.333333%
	}
	 .col-lg-5{
		flex:0 0 auto;
		width:41.666667%
	}
	 .col-lg-6{
		flex:0 0 auto;
		width:50%
	}
	 .col-lg-7{
		flex:0 0 auto;
		width:58.333333%
	}
	 .col-lg-8{
		flex:0 0 auto;
		width:66.666667%
	}
	 .col-lg-9{
		flex:0 0 auto;
		width:75%
	}
	 .col-lg-10{
		flex:0 0 auto;
		width:83.333333%
	}
	 .col-lg-11{
		flex:0 0 auto;
		width:91.666667%
	}
	 .col-lg-12{
		flex:0 0 auto;
		width:100%
	}
}
 @media (min-width:1200px){
	 .col-xl{
		flex:1 0 0%
	}
	 .col-xl-1{
		flex:0 0 auto;
		width:8.3333333%
	}
	 .col-xl-2{
		flex:0 0 auto;
		width:16.666667%
	}
	 .col-xl-3{
		flex:0 0 auto;
		width:25%
	}
	 .col-xl-4{
		flex:0 0 auto;
		width:33.333333%
	}
	 .col-xl-5{
		flex:0 0 auto;
		width:41.666667%
	}
	 .col-xl-6{
		flex:0 0 auto;
		width:50%
	}
	 .col-xl-7{
		flex:0 0 auto;
		width:58.333333%
	}
	 .col-xl-8{
		flex:0 0 auto;
		width:66.666667%
	}
	 .col-xl-9{
		flex:0 0 auto;
		width:75%
	}
	 .col-xl-10{
		flex:0 0 auto;
		width:83.333333%
	}
	 .col-xl-11{
		flex:0 0 auto;
		width:91.666667%
	}
	 .col-xl-12{
		flex:0 0 auto;
		width:100%
	}
}
 @media (min-width:1400px){
	 .col-xxl{
		flex:1 0 0%
	}
	 .col-xxl-1{
		flex:0 0 auto;
		width:8.3333333%
	}
	 .col-xxl-2{
		flex:0 0 auto;
		width:16.666667%
	}
	 .col-xxl-3{
		flex:0 0 auto;
		width:25%
	}
	 .col-xxl-4{
		flex:0 0 auto;
		width:33.333333%
	}
	 .col-xxl-5{
		flex:0 0 auto;
		width:41.666667%
	}
	 .col-xxl-6{
		flex:0 0 auto;
		width:50%
	}
	 .col-xxl-7{
		flex:0 0 auto;
		width:58.333333%
	}
	 .col-xxl-8{
		flex:0 0 auto;
		width:66.666667%
	}
	 .col-xxl-9{
		flex:0 0 auto;
		width:75%
	}
	 .col-xxl-10{
		flex:0 0 auto;
		width:83.333333%
	}
	 .col-xxl-11{
		flex:0 0 auto;
		width:91.666667%
	}
	 .col-xxl-12{
		flex:0 0 auto;
		width:100%
	}
}
/* BS3 cols outside a .row still got gutters;
 keep that for stray columns */
 :not(.row) > [class*="col-xs-"] {
	 padding-left: calc(var(--bs-gutter-x, 1.5rem) * .5);
	 padding-right: calc(var(--bs-gutter-x, 1.5rem) * .5);
}
/* BS3 offsets that BS5 renamed */
 .col-md-offset-1{
	margin-left:8.33333333%
}
 .col-md-offset-2{
	margin-left:16.66666667%
}
 .col-md-offset-3{
	margin-left:25%
}
 @media (max-width: 767.98px){
	 .col-md-offset-1,.col-md-offset-2,.col-md-offset-3{
		margin-left:0
	}
}
/* NEW (2026-10-02): BS3 responsive clearfix divs (.clearfix.visible-sm / .visible-md) between columns become full-width flex items inside a BS5 .row (`.row > *` = width:100%) and force line breaks. Flex rows never need clearfix — hide them. */
 .row > .clearfix {
	 display: none;
}
/* ---------- 3. Utility renames ---------- */
 .pull-right {
	 float: right !important;
}
 .pull-left {
	 float: left !important;
}
 .text-right {
	 text-align: right !important;
}
 .text-left {
	 text-align: left !important;
}
 .sr-only {
	 position: absolute !important;
	 width: 1px !important;
	 height: 1px !important;
	 padding: 0 !important;
	 margin: -1px !important;
	 overflow: hidden !important;
	 clip: rect(0,0,0,0) !important;
	 white-space: nowrap !important;
	 border: 0 !important;
}
 .hidden {
	 display: none !important;
}
 @media (max-width: 767.98px) {
	 .hidden-xs {
		 display: none !important;
	}
}
 @media (min-width: 768px) and (max-width: 991.98px) {
	 .hidden-sm {
		 display: none !important;
	}
}
 @media (min-width: 992px) and (max-width: 1199.98px) {
	 .hidden-md {
		 display: none !important;
	}
}
 @media (min-width: 1200px) {
	 .hidden-lg {
		 display: none !important;
	}
}
 .btn-block {
	 display: block;
	 width: 100%;
}
 .btn-default {
	 --bs-btn-color: var(--primary-color);
	 --bs-btn-border-color: var(--primary-color);
	 --bs-btn-hover-bg: var(--primary-color);
	 --bs-btn-hover-color: #fff;
	 --bs-btn-hover-border-color: var(--primary-color);
}
 .btn-xs {
	 --bs-btn-padding-y: .1rem;
	 --bs-btn-padding-x: .4rem;
	 --bs-btn-font-size: .8rem;
}
 .label {
	 display: inline-block;
	 padding: .2em .6em;
	 font-size: 75%;
	 font-weight: 700;
	 border-radius: .25em;
	 color: #fff;
	 background: var(--brown);
}
 .label-primary {
	 background: var(--primary-color);
}
 .well {
	 padding: 19px;
	 margin-bottom: 20px;
	 background: var(--fast-facts-bg-color);
	 border: 1px solid var(--light-blue);
	 border-radius: 12px;
}
 .table-condensed > :not(caption) > * > * {
	 padding: .3rem;
}
/* ---------- 4. Collapse state (BS3 .in → BS5 .show;
 JS shim in redesign.js converts too) ---------- */
 .collapse.in {
	 display: block;
}
 .fade.in {
	 opacity: 1;
}
/* ---------- 5. Panel accordion (≈20 pages — largest rebuild, §3.10) ---------- Restyled to match the new design. Legacy markup: .panel-group > .panel.panel-default > .panel-heading > .panel-title > a.panel-title-trigger (+ .acc-text / .acc-icon .fa-chevron-down) and .panel-collapse > .panel-body */
 .page-content .panel-group {
	 margin: 24px 0;
	 border-top: 1px solid var(--light-blue);
}
 .page-content .panel, .page-content .panel.panel-default {
	 border: 0;
	 border-bottom: 1px solid var(--light-blue);
	 border-radius: 0;
	 box-shadow: none;
	 background: transparent;
	 margin: 0;
}
 .page-content .panel-heading, .page-content .panel-default > .panel-heading {
	 background: transparent;
	 border: 0;
	 padding: 0;
	 color: inherit;
}
 .page-content .panel-title {
	 margin: 0;
	 font-size: 21px;
	 font-weight: 700;
}
 .page-content .panel-title > a, .page-content .panel-title-trigger {
	 display: flex;
	 align-items: center;
	 justify-content: space-between;
	 gap: 16px;
	 padding: 18px 4px;
	 color: var(--primary-color);
	 text-decoration: none;
}
 .page-content .panel-title > a:hover .acc-text, .page-content .panel-title-trigger:hover .acc-text {
	 text-decoration: underline;
}
 .page-content .acc-icon {
	 flex-shrink: 0;
	 color: var(--navy-blue);
	 transition: transform .25s ease;
}
 .page-content .panel-title-trigger:not(.collapsed) .acc-icon {
	 transform: rotate(180deg);
}
 .page-content .panel-body, .page-content .panel-default > .panel-heading + .panel-collapse > .panel-body {
	 border: 0;
	 padding: 0 4px 24px;
}
 @media (prefers-reduced-motion: reduce) {
	 .page-content .acc-icon {
		 transition: none;
	}
}
/* §5 addendum (1022_2): author panels with INLINE colours - Concurrent Enrollment pastes yellow #f8cd46 heading fills and borders and 1.2em title links on every panel. Inline styles beat the section 5 rules, so these use !important, and only on elements that carry a style attribute. Result: the same hairline rows as other body-content panels. */
 .redesign-2026 .page-content .panel[style] {
	 border: 0 !important;
	 border-bottom: 1px solid var(--light-blue) !important;
	 margin-bottom: 0 !important;
}
 .redesign-2026 .page-content .panel-heading[style] {
	 background: transparent !important;
}
 .redesign-2026 .page-content .panel-title a[style] {
	 font-size: inherit !important;
}
/* CE panel titles are typed in mixed case ("admission", "REGISTRATION Rules"). CSS has no title case, so they go uppercase - as on the legacy pages - one step smaller than other panel titles. */
 .redesign-2026 .page-content .panel[style] .panel-title {
	 font-size: 1.0625rem;
	 letter-spacing: var(--tracking-label);
	 text-transform: uppercase;
}
/* ---------- 6. rTable div-tables (11 pages;
 source CSS not yet found — §6) ---------- */
 .rTable {
	 display: table;
	 width: 100%;
	 margin-bottom: 1.5rem;
}
 .rTableBody {
	 display: table-row-group;
}
 .rTableRow {
	 display: table-row;
}
 .rTableCell {
	 display: table-cell;
	 padding: .6rem .75rem;
	 border-bottom: 1px solid var(--light-blue);
	 vertical-align: top;
}
 @media (max-width: 767.98px) {
	 .rTable, .rTableBody, .rTableRow, .rTableCell {
		 display: block;
	}
	 .rTableRow {
		 border-bottom: 1px solid var(--light-blue);
		 padding: .5rem 0;
	}
	 .rTableCell {
		 border: 0;
		 padding: .15rem 0;
	}
}
/* ---------- 7. BS3 tabs ---------- */
 .page-content .nav-tabs > li > a {
	 display: block;
	 padding: .5rem 1rem;
	 color: var(--primary-color);
	 text-decoration: none;
}
 .page-content .nav-tabs > li.active > a {
	 color: var(--navy-blue);
	 font-weight: 700;
	 border-bottom: 3px solid var(--primary-color);
}
 .tab-content > .tab-pane.active {
	 display: block;
}
/* ---------- 8. Glyphicons (22 pages) ---------- BS5 ships no glyphicon font. If global.css does NOT carry the @font-face, glyphicons render blank — confirm on first preview (§6). */
/* ---------- 9. Catalog box (per-page CATALOG Block;
 reassigned on request) ---------- Lives in the sidebar under LEFT NAV (Standard-Page). Legacy markup: .catalog-box > p.h2 > a (school) / p.h3 (program) / ul > li > .glyphicon + a / p > a.btn.btn-primary > .glyph-circle > .glyphicon Button matches the gold side-callout pills. Contrast: --on-deep on --primary-deep 12.16:1;
 --on-deep-muted 9.01:1;
 --on-gold on gold 8.10:1;
 gold focus ring on deep 8.10:1 */
 .page-sidebar .catalog-box {
	 background: var(--primary-deep);
	 color: var(--on-deep);
	 padding: 1.25rem;
	 margin: 1.5rem 0;
}
 .page-sidebar .catalog-box p.h2 {
	 margin: 0 0 .4rem;
	 font-size: 1.125rem;
	 font-weight: 700;
	 line-height: 1.3;
	 letter-spacing: var(--tracking-heading);
	 text-transform: none;
	 color: var(--on-deep);
}
 .page-sidebar .catalog-box p.h3 {
	 margin: 0 0 1rem;
	 font-size: .75rem;
	 font-weight: 700;
	 line-height: 1.35;
	 letter-spacing: .04em;
	 text-transform: uppercase;
	 color: var(--on-deep-muted);
}
 .page-sidebar .catalog-box a {
	 color: var(--on-deep);
	 border-bottom: 0;
	/* kill legacy dashed underline */
	 text-decoration: underline;
	 text-underline-offset: .2em;
}
 .page-sidebar .catalog-box a:hover {
	 text-decoration-thickness: 2px;
}
 .page-sidebar .catalog-box a:focus-visible {
	 outline: 3px solid var(--focus-ring-on-dark);
	 outline-offset: 2px;
}
 .page-sidebar .catalog-box ul {
	 list-style: none;
	 margin: 0 0 1.25rem;
	 padding: 0;
}
 .page-sidebar .catalog-box li {
	 padding: .3rem 0;
	 border: 0;
}
 .page-sidebar .catalog-box .glyphicon, .page-sidebar .catalog-box .progam-icon {
	 display: none;
}
 .page-sidebar .catalog-box p:last-child {
	 margin-bottom: 0;
}
 .page-sidebar .catalog-box a.btn.btn-primary {
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 gap: .5rem;
	 width: 100%;
	 padding: .65rem 1.25rem;
	 font-size: 1rem;
	 font-weight: 700;
	 line-height: 1.2;
	 white-space: nowrap;
	 text-transform: uppercase;
	 text-decoration: none;
	 border-radius: 50rem;
	 background-color: var(--yellow);
	 border: 0;
	 color: var(--on-gold);
}
 .page-sidebar .catalog-box a.btn.btn-primary:hover {
	 background-color: #E0B909;
	 color: var(--on-gold);
}
 .page-sidebar .catalog-box a.btn.btn-primary:active {
	 background-color: #C7A408;
}
 .page-sidebar .catalog-box .glyph-circle {
	 display: inline-flex;
	 align-items: center;
	 width: auto;
	 height: auto;
	 margin: 0;
	 padding: 0;
	 border: 0;
	 border-radius: 0;
	 background: none;
	 color: inherit;
	 font-size: 1.1em;
	 line-height: 1;
}
 .page-sidebar .catalog-box .glyph-circle::after {
	 content: "\2192";
	 content: "\2192" / "";
	/* decorative: hidden from screen readers where supported */
}
/* ---------- 10. Breadcrumb separators ---------- Separator is li::before;
 the current crumb (li.active) is underlined on the li, which propagates into the separator. Inline-block stops the propagation. */
 .breadcrumbBar .breadcrumb li::before {
	 display: inline-block;
	 text-decoration: none;
}
/* ---------- 11. BS3 contextual backgrounds (2026-10-15) ---------- BS3 .bg-info was pale blue;
 BS5 flips it to saturated cyan (#0dcaf0) with !important, so body ink on it is ~2.6:1 and fails AA (found on admissions/residency). Map it to the soft band tint;
 !important is needed to beat BS5's. Ink on the tint: --band-ink 11.14, links --primary-active 7.62. Verify with tools/aa-audit.py. Other BS3 .bg-* (primary/success/warning/ danger) flip the same way in BS5 - sweep body content before adding them. */
 .page-content .bg-info {
	 background-color: var(--fast-facts-bg-color) !important;
	 color: var(--band-ink);
}
 .page-content .bg-info a:not(.btn) {
	 color: var(--primary-active);
}
 .page-content .alert > :last-child {
	 margin-bottom: 0;
}
/* ---------- Glyphicons -> Font Awesome (BUILD 2026-redesign-1021_1) ---------- BS3's Glyphicons Halflings font doesn't load on 2026 pages, so legacy glyphicon spans rendered empty (white .glyph-circle on buttons, no arrow). The FA kit is a Web Font kit (checked 2026-10-21), so CSS can use its font. Re-point the base class at FA and map each glyph to a code point;
 add one line per glyphicon as they turn up. Solid (900) matches the legacy weight;
 300 = Light, the house standard. Decorative;
 nothing is announced. */
 .redesign-2026 .glyphicon {
	 font-family: "Font Awesome 6 Pro";
	 font-weight: 900;
	 font-style: normal;
	 line-height: 1;
	 top: 0;
	 -webkit-font-smoothing: antialiased;
}
 .redesign-2026 .glyphicon-arrow-right::before {
	 content: "\f061";
}
 .redesign-2026 .glyphicon-menu-down::before, .redesign-2026 .glyphicon-chevron-down::before {
	 content: "\f078";
}
 .redesign-2026 .glyphicon-menu-up::before, .redesign-2026 .glyphicon-chevron-up::before {
	 content: "\f077";
}
 .redesign-2026 .glyphicon-menu-right::before, .redesign-2026 .glyphicon-chevron-right::before {
	 content: "\f054";
}
 .redesign-2026 .glyphicon-menu-left::before, .redesign-2026 .glyphicon-chevron-left::before {
	 content: "\f053";
}
 .redesign-2026 .glyphicon-plus::before {
	 content: "\2b";
}
 .redesign-2026 .glyphicon-minus::before {
	 content: "\f068";
}
/* Buttons: centre the glyph in the white circle, in button blue (--primary-color on white 5.01;
 icons need 3:1). Legacy padding-top was tuned for the old font. */
 .redesign-2026 .btn .glyph-circle {
	 display: inline-flex;
	 align-items: center;
	 justify-content: center;
	 padding: 0;
	 line-height: 1;
	 color: var(--primary-color);
	 font-size: 20px;
}
 .redesign-2026 .btn .glyph-circle .glyphicon {
	 font-size: inherit;
	 color: inherit;
}
/* ---------- 12. BS4 badges (2026-10-29) ---------- .badge-primary / .badge-pill are BS4 names BS5 doesn't define, so the badge rendered white on nothing (/academicadvising/find-your-advisor). White on --primary-color 5.01;
 hover 6.56, active 8.32. */
 .redesign-2026 .badge-pill {
	 border-radius: 50rem;
}
 .redesign-2026 .badge-primary {
	 background-color: var(--primary-color);
	 color: var(--white);
}
 .redesign-2026 a.badge-primary, .redesign-2026 a.badge-primary:hover, .redesign-2026 a.badge-primary:focus, .redesign-2026 a.badge-primary:active {
	 color: var(--white);
	 text-decoration: none;
}
 .redesign-2026 a.badge-primary:hover, .redesign-2026 a.badge-primary:focus {
	 background-color: var(--primary-hover);
}
 .redesign-2026 a.badge-primary:active {
	 background-color: var(--primary-active);
}
/* ---------- 13. BS5 pale-cyan alerts in old content (2026-10-29, BUILD 1029_3) ---------- VP: no baby blue anywhere. BS3-era content uses .alert-info a lot; BS5 paints it pale cyan (#cff4fc). Map it, and .bg-info-subtle, to the neutral soft band. Ink on the tint: --band-ink 11.14, links --primary-active 7.62. */
 .redesign-2026 .alert-info {
	 --bs-alert-bg: var(--fast-facts-bg-color);
	 --bs-alert-border-color: var(--light-blue);
	 --bs-alert-color: var(--band-ink);
}
 .redesign-2026 .alert-info a:not(.btn) {
	 color: var(--primary-active);
}
 .redesign-2026 .bg-info-subtle {
	 background-color: var(--fast-facts-bg-color) !important;
}