/* Top Gradient Bar - Replace with PSU gradient */
header[role="banner"] .banner,
header[role="banner"] {
  background: linear-gradient(to right, rgb(30,64,124), rgb(150,190,230)) !important;
  border: none !important;
}

/* Remove extra solid blue line if it exists */
#search-form {
  border-top: none !important;
}

/* Filter/Search Bar Background (dark band) */
#search-form .search-form-container {
  background-color: rgb(30,64,124) !important;
  padding: 1rem;
}

/* Search input styling */
#search-form input[type="search"] {
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 1rem;
  border: 1px solid #ccc;
}

/* Filter dropdowns (Categories, Refine) */
#search-form .dropdown-toggle {
  background-color: transparent !important;
  color: #FFFFFF !important;
  border: none;
  font-size: 1rem;
  padding: 6px 10px;
}
#search-form .dropdown-toggle:hover {
  text-decoration: underline;
}

/* Course card container styling */
.card.course {
  border: 1px solid #ccc;
  border-radius: 8px;
  padding: 16px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Hover effect to lift cards slightly */
.card.course:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}

/* Course title styling */
.card.course h3 {
  font-size: 1.25rem;
  color: #002D74; /* PSU navy */
  margin-top: 0.5rem;
}

/* Course summary text */
.card.course .course-summary {
  font-size: 1rem;
  color: #333;
  line-height: 1.5;
}

/* Enroll button styling */
.card.course .btn-primary {
  background-color: rgb(30,64,124);
  border-color: rgb(30,64,124);
  color: #fff;
  margin-top: 10px;
}
.card.course .btn-primary:hover {
  background-color: rgb(150,190,230);
}


 /* Instructure assisted building this, but is not responsible for maintaining this unless Technical Consulting Hours are active
 Working as of June 27, 2025 */
/* Moving the links up to align with box*/
#header-menu {
    margin-top: 17px;
}

/* change color of "Already have an Account" button on registration page  */
#registration > form > span > a > span {
    background-color: rgb(30,64,124);
}

/* default look */
#enroll-footer [class*="baseButton__content"] {
  background-color: rgb(30, 64, 124);
  color: #fff !important;
  transition: background-color 150ms ease;
}

/* when the wrapper button (or link) is hovered */
#enroll-footer button:hover [class*="baseButton__content"],
#enroll-footer a:hover     [class*="baseButton__content"] {
  background-color: rgb(150, 190, 230) !important;
}

/* change color of login link */
a[href^='/login'] {
  color: rgb(30,64,124) !important;
}

/* change color logged in users name */
#header-menu-container > div > span > button > span {
  color: rgb(30,64,124) !important;
}