/**
 * SRR directory view styles.
 */

.view-id-srrs .view-filters {
  background-color: #f2f2f2;
  box-sizing: border-box;
  margin-bottom: 2.5rem;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: 100vw;
  padding: 1.25rem 10.5%;
  width: 100vw;
}

.view-id-srrs .msu-srr-exposed-form,
.view-id-srrs form.views-exposed-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
}

.view-id-srrs .msu-srr-exposed-form .form-item {
  flex: 1 1 11rem;
  margin: 0;
  max-width: 15rem;
  min-width: 10rem;
}

.view-id-srrs .msu-srr-exposed-form .form-item__label,
.view-id-srrs .msu-srr-exposed-form .form-item label {
  display: none !important;
}

.view-id-srrs .msu-srr-exposed-form .form-item__dropdown {
  width: 100%;
}

.view-id-srrs .msu-srr-exposed-form .form-item__dropdown {
  border: 1px solid transparent;
  border-radius: 0;
  box-sizing: border-box;
  display: block;
  position: relative;
}

.view-id-srrs .msu-srr-exposed-form .form-item__dropdown::after {
  display: none;
}

.view-id-srrs .msu-srr-exposed-form .form-item__dropdown:hover,
.view-id-srrs .msu-srr-exposed-form .form-item__dropdown:focus-within {
  border-color: #2a2a2a;
}

.view-id-srrs .msu-srr-exposed-form .form-item__dropdown:focus-within {
  outline: 2px solid #18453b;
  outline-offset: 2px;
}

.view-id-srrs .msu-srr-exposed-form .form-item__textfield,
.view-id-srrs .msu-srr-exposed-form .form-item__select,
.view-id-srrs .msu-srr-exposed-form .form-text,
.view-id-srrs .msu-srr-exposed-form .form-select,
.view-id-srrs .msu-srr-exposed-form .msu-srr-filter-field,
.view-id-srrs .msu-srr-exposed-form input.msu-srr-filter-field[type='text'] {
  appearance: none;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 0;
  box-sizing: border-box;
  color: #1a1a1a;
  display: block;
  font-size: 1rem;
  font-weight: 400;
  height: 2.75rem;
  line-height: 1.3;
  margin: 0;
  min-height: 2.75rem;
  outline: none;
  padding: 0.55rem 2rem 0.55rem 0.85rem;
  width: 100%;
}

.view-id-srrs .msu-srr-exposed-form .form-item__dropdown .form-select,
.view-id-srrs .msu-srr-exposed-form .form-item__dropdown .form-item__select {
  border: none;
}

.view-id-srrs .msu-srr-exposed-form .form-item__dropdown .form-select:focus-visible,
.view-id-srrs .msu-srr-exposed-form .form-item__dropdown .form-item__select:focus-visible {
  outline: none;
}

.view-id-srrs .msu-srr-exposed-form .form-item__textfield:hover,
.view-id-srrs .msu-srr-exposed-form .form-item__select:hover,
.view-id-srrs .msu-srr-exposed-form .form-text:hover,
.view-id-srrs .msu-srr-exposed-form .form-select:hover,
.view-id-srrs .msu-srr-exposed-form .msu-srr-filter-field:hover,
.view-id-srrs .msu-srr-exposed-form input.msu-srr-filter-field[type='text']:hover,
.view-id-srrs .msu-srr-exposed-form .form-item__textfield:focus,
.view-id-srrs .msu-srr-exposed-form .form-item__select:focus,
.view-id-srrs .msu-srr-exposed-form .form-text:focus,
.view-id-srrs .msu-srr-exposed-form .form-select:focus,
.view-id-srrs .msu-srr-exposed-form .msu-srr-filter-field:focus,
.view-id-srrs .msu-srr-exposed-form input.msu-srr-filter-field[type='text']:focus {
  border-color: #2a2a2a;
}

.view-id-srrs .msu-srr-exposed-form .form-item__textfield:focus-visible,
.view-id-srrs .msu-srr-exposed-form .form-item__select:focus-visible,
.view-id-srrs .msu-srr-exposed-form .form-text:focus-visible,
.view-id-srrs .msu-srr-exposed-form .form-select:focus-visible,
.view-id-srrs .msu-srr-exposed-form .msu-srr-filter-field:focus-visible,
.view-id-srrs .msu-srr-exposed-form input.msu-srr-filter-field[type='text']:focus-visible {
  outline: 2px solid #18453b;
  outline-offset: 2px;
}

.view-id-srrs .msu-srr-exposed-form select,
.view-id-srrs .msu-srr-exposed-form .form-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%231A1A1A' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: right 0.85rem center;
  background-repeat: no-repeat;
  background-size: 12px 8px;
  cursor: pointer;
  padding-right: 2.25rem;
}

.view-id-srrs .msu-srr-exposed-form input[type='text'],
.view-id-srrs .msu-srr-exposed-form .form-item__textfield {
  background-image: none;
  box-shadow: none;
}

.view-id-srrs .msu-srr-exposed-form .form-item__dropdown .form-select,
.view-id-srrs .msu-srr-exposed-form .form-item__dropdown .form-item__select {
  box-shadow: none;
}

.view-id-srrs .msu-srr-exposed-form input[type='text']::placeholder {
  color: #1a1a1a;
  opacity: 1;
}

.view-id-srrs .msu-srr-exposed-form .form-actions {
  align-items: center;
  display: flex;
  flex: 1 0 100%;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 0.25rem 0 0;
}

.view-id-srrs .msu-srr-exposed-form .form-submit {
  background-color: #18453b;
  border: 1px solid #18453b;
  border-radius: 0;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  height: 2.75rem;
  min-height: 2.75rem;
  min-width: 8.5rem;
  outline: none;
  padding: 0.55rem 1.5rem;
  width: 8.5rem;
}

.view-id-srrs .msu-srr-exposed-form .form-submit:hover,
.view-id-srrs .msu-srr-exposed-form .form-submit:focus {
  background-color: #0f2f28;
  border-color: #0f2f28;
}

.view-id-srrs .msu-srr-exposed-form .form-submit:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.view-id-srrs .msu-srr-exposed-form .form-submit[data-drupal-selector='edit-reset'],
.view-id-srrs .msu-srr-exposed-form input[type='submit'][value='Reset'] {
  background-color: transparent;
  border-color: #18453b;
  color: #18453b;
}

.view-id-srrs .msu-srr-exposed-form .form-submit[data-drupal-selector='edit-reset']:hover,
.view-id-srrs .msu-srr-exposed-form .form-submit[data-drupal-selector='edit-reset']:focus,
.view-id-srrs .msu-srr-exposed-form input[type='submit'][value='Reset']:hover,
.view-id-srrs .msu-srr-exposed-form input[type='submit'][value='Reset']:focus {
  background-color: #18453b;
  border-color: #18453b;
  color: #fff;
}

.view-id-srrs .msu-srr-exposed-form .form-submit[data-drupal-selector='edit-reset']:focus-visible,
.view-id-srrs .msu-srr-exposed-form input[type='submit'][value='Reset']:focus-visible {
  outline: 2px solid #18453b;
  outline-offset: 2px;
}

.view-id-srrs .msu-srr-search-summary {
  font-size: 1.1rem;
  font-weight: 600;
  margin: 0 0 2rem;
}

.view-id-srrs .view-empty {
  font-size: 1rem;
  margin: 0 0 2rem;
  padding: 0;
}

.view-id-srrs .view-content {
  display: grid;
  gap: 2rem;
  grid-template-columns: minmax(0, 1fr);
  margin-bottom: 2rem;
}

/* Tablet+: two columns — cards keep a stable width instead of shrinking in 3-up. */
@media (min-width: 768px) {
  .view-id-srrs .view-content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Desktop: three columns once there is room for three full-width cards. */
@media (min-width: 1200px) {
  .view-id-srrs .view-content {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Extra-large screens: four columns. */
@media (min-width: 2000px) {
  .view-id-srrs .view-content {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.view-id-srrs .view-content .views-row {
  display: flex;
  float: none !important;
  margin: 0;
  min-width: 0;
  width: auto !important;
}

.view-id-srrs .view-content .msu-srr-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}

.view-id-srrs .view-content .msu-srr-card__trigger {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.view-id-srrs .view-content .msu-srr-card__text {
  flex: 1;
}

/* Card */
.msu-srr-card {
  overflow: visible;
  width: 100%;
}

.msu-srr-card__trigger {
  appearance: none;
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  outline: none;
  padding: 0;
  text-align: left;
  width: 100%;
}

.msu-srr-card__trigger:hover .msu-srr-card__text,
.msu-srr-card__trigger:focus-visible .msu-srr-card__text,
.msu-srr-card:has(.msu-srr-card__trigger:hover) .msu-srr-card__tags,
.msu-srr-card:has(.msu-srr-card__trigger:focus-visible) .msu-srr-card__tags {
  background: linear-gradient(180deg, #1a4d3e 0%, #0d2820 100%);
}

.msu-srr-card:has(.msu-srr-card__trigger:hover) .msu-srr-card__tags,
.msu-srr-card:has(.msu-srr-card__trigger:focus-visible) .msu-srr-card__tags {
  background: #0d2820;
}

.view-id-srrs .view-content .msu-srr-card:focus-within {
  outline: 3px solid #18453b;
  outline-offset: 3px;
}

.msu-srr-card__trigger:focus-visible {
  outline: none;
}

.msu-srr-card__image {
  display: block;
  line-height: 0;
  overflow: hidden;
  width: 100%;
}

.msu-srr-card__image img {
  display: block;
  height: 200px;
  margin: 0;
  max-width: none;
  object-fit: cover;
  width: 100%;
}

.msu-srr-card__text {
  background: linear-gradient(180deg, #18453b 0%, #0a1f1a 100%);
  box-sizing: border-box;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.5rem 2rem 0.75rem;
  width: 100%;
}

.msu-srr-card__tags {
  background: #0a1f1a;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.4rem;
  list-style: none;
  margin: 0;
  padding: 0.75rem 2rem 2.5rem;
}

.msu-srr-card:not(:has(.msu-srr-card__tags)) .msu-srr-card__text {
  padding-bottom: 2.5rem;
}

.msu-srr-card__tag {
  display: block;
  margin: 0;
  max-width: 100%;
}

.msu-srr-card__tag span,
.msu-srr-card__tag-link {
  border: 1px solid #fff;
  border-radius: 0;
  box-sizing: border-box;
  color: #fff;
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.3;
  max-width: 100%;
  padding: 0.35rem 0.55rem;
  text-decoration: none;
  text-transform: uppercase;
  width: fit-content;
}

.msu-srr-card__tag-link {
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.msu-srr-card__tag-link:hover,
.msu-srr-card__tag-link:focus-visible {
  background-color: #fff;
  color: #18453b;
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.msu-srr-card__title {
  color: #fff;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  margin: 0;
}

.msu-srr-card__title a {
  color: inherit;
  pointer-events: none;
  text-decoration: none;
}

.msu-srr-card__teaser {
  -webkit-box-orient: vertical;
  color: #FFF;
  display: -webkit-box;
  font-size: 0.9rem;
  -webkit-line-clamp: 3;
  line-height: 1.45;
  margin: 0;
  overflow: hidden;
}

.msu-srr-card__teaser p {
  margin: 0;
}

/* Pager overrides scoped to SRR view */
.view-id-srrs .pager {
  margin: 2rem 0 3rem;
}

.view-id-srrs .pager__items {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

.view-id-srrs .pager__item {
  align-items: center;
  display: flex;
  justify-content: center;
  margin: 0;
  min-height: 2.25rem;
}

.view-id-srrs .pager__link {
  align-items: center;
  box-sizing: border-box;
  display: inline-flex;
  height: 2.25rem;
  justify-content: center;
  line-height: 1;
  min-width: 2.25rem;
  padding: 0 0.65rem;
}

.view-id-srrs .pager__link span[aria-hidden='true'] {
  align-items: center;
  display: inline-flex;
  line-height: 0;
}

.view-id-srrs .pager__link svg {
  display: block;
}

.view-id-srrs .pager__link.is-active,
.view-id-srrs .pager__link.is-active:hover,
.view-id-srrs .pager__link.is-active:focus {
  background-color: #18453b;
  border-radius: 4px;
  color: #fff;
}

.view-id-srrs .pager__link:hover,
.view-id-srrs .pager__link:focus {
  background-color: #18453b;
  border-radius: 4px;
  color: #fff;
}

.view-id-srrs .pager__link--next:hover,
.view-id-srrs .pager__link--prev:hover,
.view-id-srrs .pager__link--first:hover,
.view-id-srrs .pager__link--last:hover,
.view-id-srrs .pager__link--next:focus,
.view-id-srrs .pager__link--prev:focus,
.view-id-srrs .pager__link--first:focus,
.view-id-srrs .pager__link--last:focus {
  background-color: transparent;
}

#msu-srr-modal-root {
  display: contents;
}