/* Auto-generated by System Config > Branding - do not edit by hand, it is
 * rewritten on every save. Each rule below is emitted from an explicit
 * selector list in lib.branding.php ($selector_rules), checked against the
 * compiled CSS in assets/css/. assets/scss/variables.scss is kept in sync
 * separately for a full local recompile. */

/* Design tokens consumed by page-level <style> blocks. These pages used
 * to hardcode the brand colour, which is why it survived every Branding
 * change - see buildRootVarsCss(). */
:root {
	--brand-primary: #612c5d;
	--brand-dark: #441f41;
	--brand-light: #8d678a;
	--brand-ghost: rgba(97, 44, 93, 0.08);
	--brand-glow: rgba(97, 44, 93, 0.25);
	--surface-overlay: rgba(97, 44, 93, 0.72);
	--shadow-hover: 0 12px 36px rgba(97, 44, 93, 0.18);
	--r: #612c5d;
	--r-dark: #441f41;
	--r-deeper: #2c142a;
	--r-light: #e9e1e8;
	--r-mid: #b8a0b6;
	--r-mist: #d0c0ce;
	--muted: #441f41;
	--text-heading: #070e16;
	--text-body: #09121c;
}

/* brand_primary_color */
.bg-primary, .bg-accent1 {
	background-color: #612c5d !important;
}
.text-primary {
	color: #612c5d !important;
}
a:hover, a:active, a:focus {
	color: #612c5d;
}
.btn-primary, .btn-primary:focus, .btn-primary.active, .btn-primary.focus, .open > .dropdown-toggle.btn-primary {
	background-color: #612c5d !important;
	border-color: #612c5d !important;
}
.panel-primary > .panel-heading {
	background-color: #612c5d !important;
}
.btn-outline-primary {
	color: #612c5d !important;
}
.btn-outline-primary i {
	color: #612c5d !important;
}
.btn-outline-primary:hover, .btn-outline-primary.hover, .btn-outline-primary:focus, .btn-outline-primary:active {
	background-color: #612c5d !important;
	border-color: #612c5d !important;
}
.panel-border.panel-primary .panel-heading {
	color: #612c5d !important;
	border-color: #612c5d !important;
}
.panel-fill.panel-primary {
	background-color: #612c5d !important;
}
.progress-bar-primary {
	background-color: #612c5d !important;
}
.checkbox-primary input[type="checkbox"]:checked + label::before {
	background-color: #612c5d !important;
	border-color: #612c5d !important;
}
.radio-primary input[type="radio"] + label::after, .radio-primary input[type="radio"]:checked + label::after {
	background-color: #612c5d !important;
}
.radio-primary input[type="radio"]:checked + label::before {
	border-color: #612c5d !important;
}
table.focus-on tbody tr.focused th, table.focus-on tbody tr.focused td {
	background-color: #612c5d !important;
}
.hr-heading {
	border-color: #612c5d !important;
}
.admin_menu_dropdown a:hover {
	color: #612c5d !important;
}
.form-control:focus, input:-webkit-autofill:focus, textarea:-webkit-autofill:focus {
	border-color: #612c5d !important;
}
button.confirm {
	background-color: #612c5d !important;
	border-color: #612c5d !important;
}
.btn-search, .btn-search:hover {
	background: #612c5d !important;
}
.btn-browse-all:hover {
	background: #612c5d !important;
	border-color: #612c5d !important;
}
select.filter-select:focus, .search-wrapper input:focus {
	border-color: #612c5d !important;
}
.uc-card a[id="launch-btn"], .uc-card .btn.btn-default.btn-block[id="launch-btn"] {
	background: #612c5d !important;
}

/* brand_primary_hover */
.btn-primary:hover, .btn-primary:active {
	background-color: #5a3052 !important;
	border-color: #5a3052 !important;
}
.uc-card a[id="launch-btn"]:hover, .uc-card .btn.btn-default.btn-block[id="launch-btn"]:hover {
	background: #5a3052 !important;
}

/* brand_secondary_color */
.bg-secondary, .bg-accent2 {
	background-color: #2a4e74 !important;
}
.text-secondary {
	color: #2a4e74 !important;
}
.btn-secondary, .btn-secondary:focus, .btn-secondary.active, .btn-secondary.focus, .open > .dropdown-toggle.btn-secondary {
	background-color: #2a4e74 !important;
	border-color: #2a4e74 !important;
}
.btn-outline-secondary {
	color: #2a4e74 !important;
	border-color: #2a4e74 !important;
}
.btn-outline-secondary:hover, .btn-outline-secondary.hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
	background-color: #2a4e74 !important;
}
.panel-secondary > .panel-heading {
	background-color: #2a4e74 !important;
}
.panel-fill.panel-secondary {
	background-color: #2a4e74 !important;
}
.progress-bar-secondary {
	background-color: #2a4e74 !important;
}
.half-bg.bg-secondary {
	background: #2a4e74 !important;
}

/* brand_secondary_hover */
.btn-secondary:hover, .btn-secondary:active {
	background-color: #425a73 !important;
	border-color: #425a73 !important;
}

/* brand_accent_color */
.badge-primary, .label-primary {
	background-color: #582755 !important;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
	background-color: #582755 !important;
	border-color: #582755 !important;
}
.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover, .nav-pills > li.selected > a, .nav-pills > li.selected > a:focus, .nav-pills > li.selected > a:hover {
	background-color: #582755 !important;
}
.tabs li.tab a.active {
	color: #582755 !important;
}
.tabs .indicator {
	background-color: #582755 !important;
}
.type-tab.active {
	background: #582755 !important;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
	color: #582755 !important;
}
.nav.nav-tabs > li > a:hover, .nav.tabs-vertical > li > a:hover {
	color: #582755 !important;
}
.list-group-item.active .list-group-item-text, .list-group-item.active:hover .list-group-item-text, .list-group-item.active:focus .list-group-item-text {
	color: #582755 !important;
}
.list-group-item.active > .badge, .nav-pills > .active > a > .badge {
	color: #582755 !important;
}

/* brand_accent_hover */
.pagination > li > a:hover, .pagination > li > span:hover {
	color: #6d3168 !important;
}
.nav-pills > li > a:hover {
	color: #6d3168 !important;
}

/* brand_admin_menu_color */
.admin .side-menu, .admin .left.side-menu, .admin #sidebar-menu {
	background: #152b42 !important;
}
.left-side-menu, .left-side-menu.bg-secondary {
	background: #152b42 !important;
}

/* brand_main_logo_bg */
.topbar-left.bg-primary-900 {
	background: #612c5d !important;
	background-color: #612c5d !important;
}

/* brand_admin_logo_bg */
.admin .topbar-left, .topbar-left.bg-secondary {
	background: #2a4e74 !important;
	background-color: #2a4e74 !important;
}
.left-side-menu-dark .logo-box, .logo-box.bg-secondary {
	background: #2a4e74 !important;
	background-color: #2a4e74 !important;
}

/* Typography */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap");
body {
	font-family: 'Poppins', sans-serif;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Poppins', sans-serif;
}

/* Learner-facing main page sidebar gradient - scoped to the sidebar
 * itself, not the shared gradient class other pages reuse. */
.side-menu.bg-primary-gradient,
#side-menu.bg-blue-gradient {
	background: linear-gradient(135deg, #481148 0%, #612c5d 100%) !important;
}

/* Sidebar text colors (learner + admin) - direct selector overrides,
 * see buildMenuTextCss() doc for why these aren't hex-scanned. */
.side-menu.bg-primary-gradient #sidebar-menu > ul > li > a,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li > a {
	color: #ffffff !important;
}
.side-menu.bg-primary-gradient #sidebar-menu > ul > li > a.active .menu-item,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li > a.active .menu-item,
.side-menu.bg-primary-gradient #sidebar-menu > ul > li:hover > a.active > .menu-item,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li:hover > a.active > .menu-item {
	color: #ffffff !important;
}
.side-menu.bg-primary-gradient #sidebar-menu > ul > li > a.active i.icon,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li > a.active i.icon {
	color: #ffffff !important;
}
.side-menu.bg-primary-gradient #sidebar-menu > ul > li > a .menu-item .btn:hover,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li > a .menu-item .btn:hover,
.side-menu.bg-primary-gradient #sidebar-menu > ul > li > a.active .menu-item .btn:hover,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li > a.active .menu-item .btn:hover {
	color: #ffffff !important;
}
.side-menu.bg-primary-gradient #sidebar-menu ul ul li.active a,
#side-menu.bg-blue-gradient #sidebar-menu ul ul li.active a {
	color: #ffffff !important;
}
.side-menu.bg-primary-gradient #sidebar-menu ul ul a,
#side-menu.bg-blue-gradient #sidebar-menu ul ul a {
	color: #ffffff !important;
}
.side-menu.bg-primary-gradient #sidebar-menu ul ul a:hover,
#side-menu.bg-blue-gradient #sidebar-menu ul ul a:hover {
	color: #ffffff !important;
}
.admin #sidebar-menu > ul > li > a,
.admin .side-menu #sidebar-menu > ul > li > ul > li > a,
.admin .side-menu #sidebar-menu > ul > li > ul > li ul li a,
.admin .side-menu #sidebar-menu ul ul li a,
.admin #wrapper.enlarged .side-menu #sidebar-menu > ul > li > a .menu-item span,
.left-side-menu-dark .left-side-menu #sidebar-menu > ul > li > a,
.left-side-menu #sidebar-menu > ul > li > a,
.left-side-menu #sidebar-menu .menu-title,
.left-side-menu #sidebar-menu ul ul a,
.left-side-menu #sidebar-menu ul ul li a,
.left-side-menu .nav-second-level li a,
.left-side-menu .nav-thrid-level li a,
.left-side-menu .nav-third-level li a,
.left-side-menu #sidebar-menu .btn,
.left-side-menu #sidebar-menu > ul > li > a .menu-item,
.left-side-menu #sidebar-menu > ul > li > a i.icon,
.left-side-menu-dark .left-side-menu .nav-second-level li a,
.left-side-menu-dark .left-side-menu .nav-thrid-level li a,
.left-side-menu-dark .left-side-menu .nav-third-level li a {
	color: #b4b8bc !important;
}
.admin #sidebar-menu > ul > li > a.active,
.admin .side-menu #sidebar-menu > ul > li > a.active .menu-item,
.admin .side-menu #sidebar-menu > ul > li > a.active .menu-item .btn,
.admin .side-menu #sidebar-menu > ul > li > a.active i.icon,
.left-side-menu-dark .left-side-menu #sidebar-menu > ul > li > a.active,
.left-side-menu #sidebar-menu > ul > li > a.active,
.left-side-menu #sidebar-menu > ul > li > a.active .menu-item,
.left-side-menu #sidebar-menu ul ul li.active a,
.left-side-menu .nav-second-level li.mm-active > a,
.left-side-menu .nav-third-level li.mm-active > a,
.left-side-menu-dark .left-side-menu .nav-second-level li > a.active,
.left-side-menu-dark .left-side-menu .nav-thrid-level li > a.active,
.left-side-menu-dark .left-side-menu .nav-third-level li > a.active,
.left-side-menu #sidebar-menu > ul > li > a.active .menu-item .btn,
.left-side-menu #sidebar-menu > ul > li > a.active i.icon,
.left-side-menu #sidebar-menu > ul > li > a.active .btn,
.enlarged.left-side-menu-dark #wrapper .left-side-menu #sidebar-menu .nav-second-level li > a.active,
.enlarged.left-side-menu-dark #wrapper .left-side-menu #sidebar-menu .nav-third-level li > a.active {
	color: #ffffff !important;
}
.admin #sidebar-menu > ul > li > a:hover,
.admin .side-menu #sidebar-menu > ul > li > ul > li ul li a:hover,
.admin #sidebar-menu ul ul a:hover,
.admin #wrapper.enlarged .side-menu #sidebar-menu > ul > li:hover > a .menu-item,
.left-side-menu #sidebar-menu > ul > li > a:hover,
.left-side-menu #sidebar-menu > ul > li > a:focus,
.left-side-menu #sidebar-menu > ul > li > a:active,
.left-side-menu #sidebar-menu ul ul a:hover,
.left-side-menu .nav-second-level li a:hover,
.left-side-menu .nav-second-level li a:focus,
.left-side-menu .nav-thrid-level li a:hover,
.left-side-menu .nav-thrid-level li a:focus,
.left-side-menu-dark .left-side-menu .nav-second-level li a:hover,
.left-side-menu-dark .left-side-menu .nav-second-level li a:focus,
.left-side-menu-dark .left-side-menu .nav-thrid-level li a:hover,
.left-side-menu-dark .left-side-menu .nav-thrid-level li a:focus,
.enlarged .left-side-menu #sidebar-menu > ul > li > a:hover,
.enlarged .left-side-menu #sidebar-menu > ul > li:hover > a,
.enlarged .left-side-menu #sidebar-menu > ul > li:hover > ul a:hover,
.left-side-menu .nav-third-level li a:hover,
.left-side-menu .nav-third-level li a:focus,
.left-side-menu-dark .left-side-menu .nav-third-level li a:hover,
.left-side-menu-dark .left-side-menu .nav-third-level li a:focus,
.enlarged .left-side-menu #sidebar-menu > ul > li > a:focus,
.enlarged .left-side-menu #sidebar-menu > ul > li > a:active,
.enlarged .left-side-menu #sidebar-menu > ul ul li.active a,
.enlarged.left-side-menu-dark #wrapper .left-side-menu #sidebar-menu .nav-second-level li a:hover,
.enlarged.left-side-menu-dark #wrapper .left-side-menu #sidebar-menu .nav-second-level li a:focus,
.enlarged.left-side-menu-dark #wrapper .left-side-menu #sidebar-menu .nav-third-level li a:hover,
.enlarged.left-side-menu-dark #wrapper .left-side-menu #sidebar-menu .nav-third-level li a:focus {
	color: #e7e8ea !important;
}

/* brand_main_menu_active_bg */
.side-menu.bg-primary-gradient #sidebar-menu > ul > li > a.active .menu-item,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li > a.active .menu-item,
.side-menu.bg-primary-gradient #sidebar-menu > ul > li > a.active .menu-item .btn,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li > a.active .menu-item .btn {
	background: #5a3052 !important;
	background-color: #5a3052 !important;
	border-color: #5a3052 !important;
}

/* brand_main_menu_hover_bg */
.side-menu.bg-primary-gradient #sidebar-menu > ul > li:hover > a > .menu-item,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li:hover > a > .menu-item {
	background: #5a3052 !important;
	background-color: #5a3052 !important;
}

/* brand_main_menu_submenu_bg */
.side-menu.bg-primary-gradient #sidebar-menu > ul > li > ul,
#side-menu.bg-blue-gradient #sidebar-menu > ul > li > ul {
	background: #a677a4 !important;
	background-color: #a677a4 !important;
}

/* brand_admin_menu_active_bg */
.admin .side-menu #sidebar-menu > ul > li > a.active .menu-item,
.admin .side-menu #sidebar-menu > ul > li > a.active .menu-item .btn,
.left-side-menu-dark .left-side-menu #sidebar-menu > ul > li > a.active,
.left-side-menu #sidebar-menu > ul > li > a.active,
.left-side-menu #sidebar-menu > ul > li > a.active .menu-item,
.left-side-menu #sidebar-menu > ul > li > a.active .menu-item .btn,
.left-side-menu #sidebar-menu > ul > li > a.active .btn {
	background: #1e3752 !important;
	background-color: #1e3752 !important;
	border-color: #1e3752 !important;
}

/* brand_admin_menu_hover_bg */
.admin .side-menu #sidebar-menu > ul > li:hover .menu-item,
.admin #wrapper.enlarged .side-menu #sidebar-menu > ul > li:hover > a .menu-item,
.left-side-menu #sidebar-menu > ul > li > a:hover,
.left-side-menu #sidebar-menu > ul > li > a:focus,
.left-side-menu #sidebar-menu > ul > li:hover > a .menu-item,
.left-side-menu #sidebar-menu > ul > li:hover > a .btn {
	background: #275586 !important;
	background-color: #275586 !important;
}

/* brand_admin_menu_submenu_bg */
.admin .side-menu #sidebar-menu > ul > li > ul,
.admin #wrapper.enlarged .side-menu #sidebar-menu > ul > li:hover > ul,
.left-side-menu #sidebar-menu > ul ul,
.left-side-menu #sidebar-menu ul ul,
.enlarged .left-side-menu #sidebar-menu > ul ul,
.enlarged .left-side-menu #sidebar-menu > ul > li:hover > ul,
.enlarged.left-side-menu-dark #wrapper .left-side-menu #sidebar-menu > ul ul,
#wrapper.enlarged .side-menu #sidebar-menu > ul > li:hover > ul > a,
.admin #wrapper.enlarged .side-menu #sidebar-menu > ul > li:hover > ul > a {
	background: #526d89 !important;
	background-color: #526d89 !important;
}

/* Text on brand-colored surfaces */
.bg-primary,
.bg-accent1,
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary.focus,
.open > .dropdown-toggle.btn-primary,
.panel-primary > .panel-heading,
.uc-card a[id="launch-btn"],
.uc-card a[id="launch-btn"]:hover {
	color: #ffffff !important;
}
.bg-secondary,
.bg-accent2,
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary.active,
.btn-secondary.focus,
.open > .dropdown-toggle.btn-secondary,
.badge-secondary,
.label-secondary {
	color: #ffffff !important;
}
.badge-primary,
.label-primary,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover,
.nav-pills > li.selected > a,
.nav-pills > li.selected > a:focus,
.nav-pills > li.selected > a:hover {
	color: #ffffff !important;
}

/* Deliberately contrasting surfaces, preserved */
#myCarousel .hero .btn-secondary,
#myCarousel .hero .btn-secondary:hover {
	color: #fff !important;
}

/* Gradient utilities - page banners and quick-link tiles */
.bg-primary-gradient {
	background: linear-gradient(135deg, #351833 0%, #612c5d 100%) !important;
}
.bg-secondary-gradient {
	background: linear-gradient(135deg, #172b40 0%, #2a4e74 100%) !important;
}
.bg-success-gradient {
	background: linear-gradient(135deg, #30152f 0%, #582755 100%) !important;
}
