/**
 * SCALE Responsive Stylesheet for SCALE Drupal Theme 2026.
 * This sheet contains all the @media breakpoints for overrides to scale-base.css
 * which itself overrides styles.css (the original Boostrap 5 subtheme styles).
 *
 * All defined breakpoints can be found in scale.breakpoints.yml.
 * This is a mobile first theme that relies on min-width primarily.
 *
 * @link          https://www.apereo.org Apereo Foundation
 * @since         1.0.0
 * @copyright     Apereo Foundation 2023
 */

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
}

/* Catch the screen wrap point for mobile menu */
@media only screen and (min-width : 347px) {
  #navbarSupportedContent {
    top: 3.75rem;
  }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
  .view-people .views-row .views-field-nothing .field-content a.person-block {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
  }
  .person-listing-image img {
    max-width: 180px;
    min-width: 0;
    margin-bottom: 0;
  }
}

/* Small Tablets */
@media only screen and (min-width : 600px) {
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
  #navbarSupportedContent {
    top: 2.5rem;
  }
  /* PARTNERS */
  .view-partners .view-content {
    gap: 0;
    grid-template-columns: 1fr 1fr;
  }
  .view-partners .views-field-nothing {
    padding: 1rem 4rem;
  }
}

/* Medium Devices, Desktops - the primary break point */
@media only screen and (min-width: 992px) {
  /* MENU */
  #navbarSupportedContent {
    position: static;
    background-color: unset;
    padding: 0;
    width: auto;
  }
  .navbar-expand-lg .navbar-nav ul.dropdown-menu {
    border-radius: 0;
    margin-top: -1px;
    padding: 0;
  }
  .navbar-expand-lg .navbar-nav ul.dropdown-menu li a.active {
    color: var(--scale-color-text-inverse);
    background-color: var(--scale-color-blue-01);
  }
  .navbar-expand-lg .navbar-nav .dropdown-item:hover {
    color: var(--scale-color-body-text);
    background-color: var(--scale-color-gold-01);
  }
  /* PAGES */
  article.node--type-page .field--name-field-image {
    float: right;
    padding: 0.5rem 2rem 2rem;
  }
  article.node--type-page .field--name-field-image img {
    min-width: unset;
    max-width: 550px;
  }
  ol li {
    margin-bottom: 2rem;
  }
  /* SIDEBAR / RIGHT COLUMN */
  .region.region-sidebar-second {
    margin: 4rem 0 0 2rem;
  }
  /* PEOPLE */
  .view-people .view-content {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr 1fr;
  }
  /* PARTNERS */
  .view-partners .view-content {
    grid-template-columns: 1fr 1fr 1fr;
  }
  footer {
    text-align: left;
  }
  footer .region-footer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
  #block-scale-footerlogo {
    text-align: right;
    padding: 0;
  }
  #block-scale-footerlogo img {
    max-height: 200px;
    width: auto;
  }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
  /* PEOPLE */
  .view-people .view-content {
    grid-template-columns: 1fr 1fr 1fr;
  }
  /* PARTNERS */
  .view-partners .view-content {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}

/* Very Large Devices, Very Wide Screens */
@media only screen and (min-width : 1400px) {
  .container {
    max-width: 1200px;
  }
}
