///////////////////////////////
// !THEME / COMPONENTS / HEADER
///////////////////////////////


.unl .dcf-header {
  border-top: 3px solid $scarlet;
}


.unl .dcf-header a:visited {
  color: $color-link;
}


.unl .dcf-site-affiliation a,
.unl .dcf-site-affiliation a:visited,
.unl .dcf-site-title a,
.unl .dcf-site-title a:visited {
  color: $color-heading;
}


// .unl .dcf-header-global {
//   padding-top: #{ms(-12)}em;
//   background-image: linear-gradient(to top, $scarlet 2px, transparent 2px, transparent 4px, $scarlet 4px);
//   border-bottom: 1px solid #ddd;
// }





// @include mq(md, max, width) {
//
//   .unl .dcf-header::after {
//     @include bg-white;
//     bottom: 0;
//     box-shadow: 0 0 4px 0 fade-out($color-body, .75);
//     content: '';
//     @include h-9;
//     left: 0;
// //     padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
//     position: fixed;
//     width: 100%;
//     z-index: 1;
//   }
//
// }



@include mq(md, max, width) {

  .unl .dcf-header .dcf-institution-title {
    display: none;
  }

  .unl .dcf-mobile-toolbar {
    @include bg-cream;
    border: 3px solid $scarlet;
    border-width: 3px 0 0 0;
    bottom: 0;
    position: fixed;
    width: 33.4%;
    z-index: 9999;
  }

  .unl .dcf-mobile-toolbar-toggle {
    flex-direction: column;
    height: #{ms(10)}em;
    margin-bottom: env(safe-area-inset-bottom);
  }

  .unl .dcf-mobile-toolbar-search {
    left: 33.33%;
  }

  .unl .dcf-mobile-toolbar-idm {
    left: 66.66%;
  }

  .unl .dcf-mobile-toolbar-label {
    @include font-sans;
    font-size: #{ms(-6)}em;
//     font-size: 7px;
    font-weight: bold;
    @include ls-2;
    text-transform: uppercase;
  }

  .unl .dcf-mobile-toolbar-icon {
    fill: currentColor;
    @include h-4;
    @include mb-2;
    margin-top: #{ms(-12)}em;
    @include w-4;
  }

  .unl .dcf-mobile-toolbar-modal {
    @include bg-overlay-dark;
    bottom: #{ms(10)}em;
    height: calc(100% - #{ms(10)}em);
    position: fixed;
    width: 100%;
    z-index: 998;
  }

  .unl .dcf-mobile-toolbar-modal::after {
    background-image: linear-gradient(to bottom, fade-out($cream, 1), $cream);
    bottom: 0;
    content: '';
    height: #{ms(8)}em;
    left: 0;
    position: fixed;
    width: 100%;
    z-index: 999;
  }

  .unl .dcf-logo-lockup {
    @include pb-4;
    @include pt-5;
  }

}


@include mq(md, min, width) {

// TODO: differentiate styles for psuedo-classes
//   .unl .dcf-header-global a,
//   .unl .dcf-header-global a:link {
//     color: $cream;
//     text-decoration: underline;
//     text-decoration-color: fade-out($cream,1);
//     transition: text-decoration-color $hover-off;
//   }

//   .unl .dcf-header-global a:visited {
//     color: $cream;
//   }

//   .unl .dcf-header-global a:hover,
//   .unl .dcf-header-global a:active {
//     color: $cream;
//     text-decoration-color: $cream;
//     transition: text-decoration-color $hover-on;
//   }

  .unl .dcf-nav-global {
    flex-grow: 3;
  }

  .unl .dcf-header-global-item {
    margin-left: 3.2vw;
  }

  .unl .dcf-logo-lockup {
    @include pb-5;
    padding-top: #{ms(7)}em;
  }

}


// @include mq(md, min, width) {
//
//   @supports (display: grid) {
//
//     .unl .dcf-header {
//       grid-template-areas: "first nav2 nav2" "logo idm search" "nav1 nav1 nav1";
//       grid-template-columns: 1fr auto auto;
//     }
//
//     .unl .dcf-institution-title {
//       grid-area: first;
//     }
//
//     .unl .dcf-logo {
//       grid-area: logo;
//     }
//
//     .unl .dcf-search {
//       grid-area: logo;
//     }
//
//
//   }
//
// }