/* Buttons */
button.top-search-button,
.top-search-button {
    background-color: #e4b900 !important;  
    border-color: #e4b900 !important;
    color: #fff !important;
}

.adjust-inline-search-btn:hover {
    background: #C61D23;
    color: #fff;
}
.site-logo img {
    max-height: 60px;
    height: auto;
}
/* Align nav items vertically and visually */
.primary-navigation .navbar-nav > .nav-item > .nav-link {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
width: 100%;
}
section.primary-navigation {
    background-color: #ffffff;
    margin-top: 20px;
}
/* Ecommerce Bar */
section#ecommerce_bar {
    padding: 1.5rem 0;
    margin-top: 20px;
}
/* Push entire navbar content to the right */
.primary-navigation .container {
    display: flex;
}

.main-header {
    position: absolute;
}

ul.nav {
    margin-left: -15px;
}

li.nav-item > a.nav-link {
    font-family: aktiv-grotesk, sans-serif;
    text-transform: capitalize;
    font-weight: 500;
}

li.nav-item a:hover {
    color: #eeeeee !important;
}

.navbar .nav-item > .nav-link {
    color: #ffffff;
    font-size: 16px;
}

.navbar .nav-item > .nav-link:hover,
.navbar .dropdown-menu .nav-item > .nav-link:hover {
    text-decoration: underline;
}

.navbar .dropdown-menu .nav-item > .nav-link {
color: #003767;
}

/* Hero Banners */
.arrow-hero-banner-primary {
    background-color: #FFC20E !important;
    color: #ffffff;
}

.arrow-hero-banner-secondary {
    background-color: #C61D23 !important;
    color: #ffffff !important;
}

/* Footer */
footer.arrow--site-footer {
    background: #003767 !important;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100%;
    padding: 25px 0 110px 0;
}
footer a.footer-link {
    color: #ffffff;
    position: relative;
}
h5.footer-title {
	text-transform: capitalize;
	position: relative;
	border-style: none;
	font-size: 18px;
  font-family: aktiv-grotesk, sans-serif;
}
h5.footer-title::after {
    position: relative;
}
/* footer row */

.footer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1); 
}

.image-container img {
  width: 100px;
}

.connect-with-us {
  display: block;
  align-items: center;
  gap: 12px;
  color: white;
  font-weight: 600;
  font-family: 'Rubik', sans-serif;
}
.fa-brands, .fa-linkedin, .fa-facebook, .fa-twitter, .fa-snapchat, .fa-rss, .fa-instagram, .fa-youtube, .fa-threads, .fa-x-twitter {
	background: #33c1d8;
	border-radius: 67%;
	font-size: 15px;
	color: #002c52 !important;
	padding: 5px;
	width: 25px;
	text-align: center;
	font-family: "FontAwesome";
	font-weight: normal;
	font-style: normal;
}
.flex-column .nav-item .nav-link {
  width: 100%;
  border-bottom: none !important;
  border-top: none !important;
  position: relative;
  font-weight: 400;
}

/* Carousel */
.carousel-item img {
    max-width: 100%;
}

/* Body */
body.reg-light-background {
    font-family: aktiv-grotesk, sans-serif;
}

.top-bar a {
    text-decoration: none;
    font-size: 0.875rem;
}
.top-bar a:hover {
    text-decoration: underline;
}
/* Top bar vertical separator styles */
.top-bar .top-right a {
    border-left: 1px solid #ccc;
    padding-left: 0.75rem;
    margin-left: 0.75rem;
}

.top-bar .top-right a:first-child {
    border-left: none;
    padding-left: 0;
    margin-left: 0;
}
.jumbotron {
    padding: 18rem 2rem !important;
}

/*
#course_search h3, #course_list {
    display: block;
    border: 0.1em solid #f1fbfc;
    background: #f1fbfc;
    padding: 0.5em;
    color: #003767;
    width: 100%;
}
#course_search .fa, .fa-brands, .fa-classic, .fa-regular, .fa-sharp, .fa-solid, .fab, .far, .fas {
    color: #29afc8;
}
*/

.navbar .nav-item > .nav-link {
    color: #003767;
    font-size: 16px;
    border-top: 3px solid #fff;
}
.navbar-nav .nav-item .nav-link.dropdown-toggle {
    padding: 0.75rem 1rem;
    color: #003767;
    font-weight: 600;
    background: transparent;
    border-top: 3px solid #fff;
    position: relative;
    z-index: 1;
}

/* Hover + focus + open state */
.navbar-nav .nav-item:hover > .nav-link.dropdown-toggle,
.navbar-nav .nav-item:focus-within > .nav-link.dropdown-toggle,
.navbar-nav .nav-item.show > .nav-link.dropdown-toggle a {
    background: white;
    border-top: 3px solid #0077a5;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    z-index: 2;
    color: #003767; !important;
    text-decoration: none !important;
}
.navbar-nav .nav-item {
    margin-top: 3px;
}
.navbar-nav .nav-item .nav-link {
    color: #003366;
    text-decoration: none;
}

/* Apply the same on hover/focus/active */
.navbar-nav .nav-item .nav-link:hover,
.navbar-nav .nav-item .nav-link:focus,
.navbar-nav .nav-item .nav-link:active {
    color: #003366 !important;
    text-decoration: none !important;
}

/* Also apply to open dropdown state */
.navbar-nav .nav-item.show > .nav-link {
    color: #003366 !important;
    text-decoration: none !important;
}
/* this is to accommodate the new card style for sheridan */
.theme-arrow-view .card {
    margin-top: 0;
    margin-right: 0;
    margin-left: 0;
    max-width: none;
}
/* Responsive */
@media screen and (max-width: 768px) {
    .jumbotron-style {
        background-size: 100% auto !important;
        padding-bottom: 0px !important;
    }
    .arrow-hero-banner {
        margin-top: -128px !important;
    }
}

@media screen and (min-width: 1144px) {
    section#ecommerce_bar .site-logo {
        top: 10%;
        margin-left: 378px;
    }
}


/* Course Search overrides */
/* Accordion header styling */
#course_search .ui-accordion-header {
background-color: #fff;
color: #003366;
  font-weight: normal;
  border: none;
  padding: 0.75rem 1rem;
  margin: 0;
  position: relative;
  font-size: 1rem;
  cursor: pointer;
}

/* Selected header text (e.g., "Trafalgar Campus") bold */
#campus_heading .ui-accordion-header-icon + span,
#campus_heading {
  font-weight: normal;
}
#campus_heading:after {
  content: ""; /* remove any default icon text */
}
#campus_heading {
  font-weight: normal;
}

/* Remove borders from accordion content */
#course_search .ui-accordion-content {
  border: none !important;
  padding: 0;
  background: #fff;
}

#course_search #campus_form,
#course_search #term_form,
#course_search #program_form {
  z-index: 2;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15); /* horizontal, vertical, blur, color */
  border-radius: 4px; /* optional: smooth rounded corners */
  background: #fff;   /* optional: ensure a solid background for shadow contrast */
}

/* drop shadow */
#course_search h3 {
  box-shadow: 0 2px 8px rgba(0,0,0,0.15); /* horizontal, vertical, blur, color */
  border-radius: 4px; /* optional: smooth rounded corners */
  background: #fff;   /* optional: ensure a solid background for shadow contrast */
}
#course_search h3 {
margin-top: 5px !important;
}
#course_search h3.ui-accordion-header-active {
  background-color: #f2fbfd; /* light blue background */
}


#course_search li {
	padding: 0 !important;
	display: flex;
	align-items: center;

	background: #fff;
	text-decoration: none;
	cursor: pointer;
	margin: 0.4em 0.5em 0em 0.5em !important;
	border: none;
}

/* Remove list borders and reset styles */
#campus_form ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#campus_form li {
  margin: 0.5rem 0;
}
#campus_form li a,
#term_form li a,
#program_form li a {
  text-decoration: none;
	color: #003366;
  font-size: 1rem;
  display: inline-block;
}

/* Remove old jQuery UI triangle icons */
#course_search .ui-accordion-header .ui-accordion-header-icon {
  display: none;
}

/* Add your own chevron icon using ::after */
#course_search .ui-accordion-header::after {
  content: "⌄"; /* down chevron */
  font-size: 2rem;
  position: absolute;
  right: 1rem;
  top: 40%;
  transform: translateY(-50%) rotate(0deg);
  color: #00a3e0; /* blue arrow */
}

/* Rotate chevron when expanded */
#course_search .ui-accordion-header-active::after {
  top: 60%;
  transform: translateY(-50%) rotate(180deg);
}


/* Optional hover effect for headers */
#course_search .ui-accordion-header:hover {
  background-color: #e9f6f9;
}

/*lets add fake radio buttons*/
#campus_form li a, #term_form li a {
  position: relative;           /* so the ::before can be positioned */
  padding-left: 2rem;           /* space for the fake radio circle */
  display: inline-block;        /* allow padding and positioning */
  line-height: 1.5rem;
}

/* Add the unselected radio circle */
#campus_form li a::before, #term_form li a::before {
  content: "";
  position: absolute;
  left: 0;                      /* place at the left */
  top: 50%;
  transform: translateY(-50%);
  width: 1rem;                  /* size of the circle */
  height: 1rem;
  border: 2px solid #999;       /* circle border */
  border-radius: 50%;           /* make it round */
  background-color: #fff;       /* inner background */
  box-sizing: border-box;
}

/* Optional: when a link is 'selected' give it a filled center */
#campus_form li a.selected::before {
  border-color: #0072ce;        /* active color */
  background-clip: content-box;
  padding: 3px;                 /* creates an inner circle */
  background-color: #0072ce;    /* fill */
}

#program_form .fa-plus-circle {
	color: #00A0AF;
	padding-right: 0.5rem;
}

#course_search li.program {
	border-bottom: 1px solid #eeeeee;
}
#course_search li.program.expanded {
	border-bottom: 1px solid #00A0AF;
	margin-bottom: 5px;
}

a.course input[type="checkbox"] {
  appearance: none;          /* Remove default browser style */
  -webkit-appearance: none;  /* Safari/iOS */
  width: 20px;
  height: 20px;
  border: 2px solid #ccc;
  border-radius: 6px;        /* 👈 this controls roundness */
  background: #fff;
  vertical-align: middle;
  cursor: pointer;
  position: relative;
}

/* Checked state */
a.course input[type="checkbox"]:checked {
  background-color: #3A4146; /* your dark fill */
  border-color: #3A4146;
}

/* Optional checkmark using pseudo-element */
a.course input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}



h1, .h1 {
  font-size: 32px;
  font-family: "Produkt", serif;
color: #003366;
font-weight: 700;
}

h2, .h2 {
  font-size: 32;
  font-family: "Produkt", serif;
color: #003366;
font-weight: 700;
}

h3, .h3 {
  font-size: 22px;
  font-family: aktiv-grotesk, sans-serif;
  color: var(--bs-heading-color-alt);
}

h4, .h4 {
  font-size: 20.4px;
  font-family: aktiv-grotesk, sans-serif;
}

h5, .h5 {
  font-size: 20px;
  font-family: aktiv-grotesk, sans-serif;
}

h6, .h6 {
  font-size: 18.8px;
  font-family: aktiv-grotesk, sans-serif;
}

.dropdown-menu {
	border: none;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15); /* horizontal, vertical, blur, color */
  border-radius: 4px; /* optional: smooth rounded corners */
  background: #fff;   /* optional: ensure a solid background for shadow contrast */
}

.dropdown-menu ul li
{
font-family: aktiv-grotesk;
font-size: 22px;
leading-trim: NONE;
line-height: 26.4px;
letter-spacing: 0%;
color: #003767;

}

li.nav-item
{
flex: 1 1 auto;
}
.dropdown-menu ul li:hover
{
background: #E5EBF0;
}

/*mega navs only */
.dropdown-menu .d-flex ul li a:after
{
  content: "⌄"; /* down chevron */
  font-size: 2rem;
  position: absolute;
  color: #00a3e0; /* blue arrow */
transform: rotate(270deg);
}

footer.arrow--site-footer {
    font-weight: inherit;
    font-style: inherit;
    font-family: inherit;
    box-sizing: border-box;
    display: block;
    padding-top: 1.875rem;
    padding-bottom: 1.875rem;
    background: linear-gradient(102deg,#002648 11.67%,#003767 44.64%,#06467a 77.6%);
    position: relative;
    z-index: 1;
    color: #fff;
    font-size: .875rem;
}

.component.divider {
    color: #fff;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
    box-sizing: border-box;
    width: 100%;
}

hr {
    color: #fff;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    box-sizing: content-box;
    overflow: visible;
    margin: 10px 0;
    border: 0;
    height: 0;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: rgba(240,240,240,.1);
    margin-top: 1.4375rem;
    margin-bottom: 1.4375rem;
}

footer a.nav-link {
    padding-top: 0rem;
    padding-bottom: 0rem;
}