// ebi-header-footer

// **Thinking about deleting this file?**
// If your component needs no CSS/Sass, we still recommend leaving the
// scss files in place. As this is primarily a CSS framework, it is better to
// leave the empty files so you know a file wasn't accidently omitted.
// If you don't have any Sass, you can trim this block down to:
// "This page was intentionally left blank"

@import 'package.variables.scss';
// Debug information from component's `package.json`:
// ---
/*!
 * Component: #{map-get($componentInfo, 'name')}
 * Version: #{map-get($componentInfo, 'version')}
 * Location: #{map-get($componentInfo, 'location')}
 */

@import 'ebi-header-footer.variables.scss';

@import 'ebi-header-footer--header.scss';
@import 'ebi-header-footer--footer.scss';

.ebi-header-footer {
  @import 'ebi-header-footer--embl-selector.scss';
  @import 'ebi-header-footer--layout.scss';
  @import 'ebi-header-footer--form.scss';
  @import 'ebi-header-footer--utility.scss';
}

.data-protection-banner {

  background-color: color(grey-darkest);

  .row {
    @media (min-width: $vf-breakpoint--sm) {
      display: flex;
    }
    max-width: $global-page-max-width;
    margin: 0 auto;

    .columns {
      margin: 0 0.5rem 0.5rem;
    }

    @media (min-width: $vf-breakpoint--sm) {
      .medium-8 {
        flex: 5;
      }
      .medium-4 {
        flex: 2;
        text-align: right;
      }
    }

  }

  a {
    @include inline-link--dark-mode(
      $vf-link--color: ui-color(white),
      $vf-link--hover-color: ui-color(white),
      $vf-link--visited-color: ui-color(white)
    );
    cursor: pointer; // data-protection-agree has no href and does no get a pointer by default in most browsers
  }

}

// vf-stack + vf-content-hub + legacy black bar edge case
.vf-stack .vf-content-hub-html .masthead-black-bar > div {
  --vf-stack-margin: 0;
  --vf-stack-margin--custom: 0;
}