@import "../css/main.css";
.header-container {
  left: 0;
  right: 0;
  top: 0;
  height: 0;
  overflow-y: visible;
  overflow-x: hidden;
  background: transparent;
  position: sticky;
  z-index: 100;
  width: 100%;
}

.header-content-background {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  height: var(--header-height);
  opacity: var(--header-start-opacity);
  box-shadow: 0 0 3px 3px var(--header-box-shadow-color);
  background: var(--header-background);
  transition: opacity 0.5s ease;
  animation: header-background-animation linear forwards;
  animation-timeline: scroll();
  animation-range: 0 5rem;
}
.header-content-background:has(+ :hover), .header-content-background:hover {
  animation: none;
  opacity: 1;
}
@keyframes header-background-animation {
  from {
    opacity: var(--header-start-opacity);
  }
  to {
    opacity: 1;
  }
}

.header-content {
  height: 3rem;
  display: grid;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  grid-template-columns: 10.5rem 1fr 10.5rem;
}
.header-content .pages-links {
  margin-left: 1rem;
  display: flex;
}
.header-content .menu-container {
  margin: 0.25rem auto auto 0.25rem;
  overflow: hidden;
  max-height: 3rem;
  height: fit-content;
  width: fit-content;
  border-radius: 0.25rem;
  max-width: 25rem;
  box-shadow: 0 0 2px 2px transparent;
  border: 1px solid transparent;
  z-index: 100;
  transition: max-height 0.6s ease, background 0.2s linear, border 0.2s linear;
}
.header-content .menu-container .menu-header {
  display: flex;
  cursor: pointer;
  margin: 0 auto auto 1rem;
  height: 3rem;
}
.header-content .menu-container .menu-header:hover * {
  color: var(--app-color);
}
.header-content .menu-container .menu-header .header-menu-icon {
  font-size: 2rem;
  height: 1rem;
  display: block;
}
.header-content .menu-container .menu-header .header-menu-label {
  white-space: nowrap;
  font-size: var(--small-font-size);
  font-weight: var(--header-font-weight);
  height: 1rem;
  margin: 0.85rem auto 0.5rem 0.5rem;
  /*
  @media ( min-resolution: 2dppx) and (max-width: 80rem) {
    display: none;
  }

  @media ( min-resolution: 3dppx) and (max-width: 120rem) {
    display: none;
  }

   */
}
@media (max-width: 60rem) {
  .header-content .menu-container .menu-header .header-menu-label.edgar-label-yes {
    display: none;
  }
}
@media (max-width: 40rem) {
  .header-content .menu-container .menu-header .header-menu-label.edgar-label-no {
    display: none;
  }
}
.header-content .menu-container .menu-content {
  padding: 0.25rem 0.75rem 0.5rem 1rem;
  width: fit-content;
  height: 100%;
  max-height: calc(100vh - 6.5rem);
  overflow-y: auto;
}
.header-content .menu-container .menu-content .menu-page-div {
  border-radius: 0.25rem;
  margin: 0.2rem auto;
  padding: 0 0.5rem 0 0;
  width: 100%;
  display: grid;
  grid-template-columns: 3rem 1fr;
  column-gap: 1rem;
  cursor: pointer;
}
.header-content .menu-container .menu-content .menu-page-div .menu-page-icon {
  height: 3rem;
  display: flex;
  align-items: center; /* Vertically center items */
  justify-content: center;
}
.header-content .menu-container .menu-content .menu-page-div .menu-page-icon i {
  display: block;
  height: fit-content;
  margin: auto;
  font-size: 2rem;
}
.header-content .menu-container .menu-content .menu-page-div .menu-page-label {
  font-size: var(--medium-large-font-size);
  white-space: nowrap;
  margin-top: 0.5rem;
  max-width: 0;
  width: max-content;
  overflow: hidden;
  transition: max-width 0.25s ease;
}
.header-content .menu-container .menu-content .menu-page-div .edgar-icon {
  height: 1.5rem;
  margin: 0.5rem auto 0.5rem 0.75rem;
}
.header-content .menu-container .menu-content .menu-page-div .edgar-icon img {
  height: 100%;
}
.header-content .menu-container .menu-content .menu-page-div:hover .menu-page-label {
  color: var(--app-color);
}
.header-content .menu-container .menu-content .menu-page-div:hover {
  background: var(--menu-item-hover-background);
}
.header-content .menu-container:hover {
  background: var(--background-elevation-3);
  box-shadow: 0 0 2px 2px var(--box-shadow-color);
  border: 1px solid var(--border-color);
  max-height: calc(100vh - var(--header-height));
}
.header-content .menu-container:hover .header-menu-label {
  display: block !important;
}
.header-content .menu-container:hover .menu-page-label {
  max-width: 15rem !important;
}
.header-content .logo-container {
  grid-column-start: 2;
  max-width: 100%;
  overflow: hidden;
  width: fit-content;
  display: flex;
  height: fit-content;
  margin: auto;
}
.header-content .logo-container .portal-logo-container {
  display: flex;
  height: fit-content;
  margin: auto;
  cursor: pointer;
}
.header-content .logo-container .portal-logo-container .logo {
  font-weight: 300;
  font-size: 1.8rem;
  letter-spacing: 0.2rem;
  color: var(--app-color);
  height: 2rem;
  margin: 0.45rem 0 auto auto;
}
@media (max-width: 35rem) {
  .header-content .logo-container .portal-logo-container .logo {
    display: none;
  }
}
.header-content .logo-container .portal-logo-container .logo-text {
  font-weight: 300;
  font-size: var(--large-font-size);
  letter-spacing: 0.2rem;
  color: var(--app-color);
  height: 1.75rem;
  margin: 0.5rem 0 0.2rem 0.75rem;
}
.header-content .logo-container .logo-edgar-x {
  font-weight: 200;
  font-size: 1.5rem;
  margin: 1rem 1rem auto 1rem;
}
.header-content .logo-container .logo-edgar-text {
  cursor: pointer;
  font-weight: 300;
  font-size: 1.8rem;
  letter-spacing: 0.2rem;
  width: 12rem;
  color: var(--app-color);
  height: 2rem;
  margin: 0.65rem auto 0.2rem 0;
}
.header-content .actions-div {
  width: fit-content;
  display: flex;
  height: 2rem;
  margin: 0.75rem 0 auto auto;
  transition: width 1s ease;
}
.header-content .actions-div .search-div {
  border-radius: 0.25rem;
  background: transparent;
  cursor: pointer;
}
.header-content .actions-div .search-div:hover * {
  color: var(--app-color);
}
.header-content .actions-div .search-div .search-icon {
  font-size: 1.3rem;
  height: fit-content;
  margin: auto 0.5rem auto auto;
}
.header-content .actions-div .library-div {
  background: transparent;
  cursor: pointer;
}
.header-content .actions-div .library-div:hover * {
  color: var(--app-color);
}
.header-content .actions-div .library-div .library-icon {
  font-size: 1.4rem;
  margin: 0.25rem 0.75rem auto 1rem;
}
.header-content .actions-div .edgar-div {
  background: transparent;
  cursor: pointer;
  margin: 0.25rem 0.5rem auto 0.5rem;
}
.header-content .actions-div .edgar-div .edgar-logo-svg {
  height: 1.8rem;
  margin-top: -0.25rem;
}
.header-content .actions-div .edgar-div .edgar-logo-svg path {
  fill: red !important;
}
.header-content .actions-div .edgar-div:hover * {
  color: var(--app-color);
}
.header-content .actions-div .edgar-div .edgar-project-icon {
  font-size: 1.5rem;
  font-weight: 500;
  /*height: 3rem;

   */
}
.header-content .actions-div .profiles-div {
  margin: -0.15rem 0.65rem auto 0.5rem;
}
.header-content .actions-div .profiles-div .header-profile-icon {
  cursor: pointer;
  font-size: 1.65rem;
  height: fit-content;
  display: block;
  margin: -0.05rem 0.1rem auto 0.25rem;
}
.header-content .actions-div .profiles-div .header-profile-icon:hover {
  color: var(--app-color);
}
.header-content .actions-div .profiles-div .profile-option {
  display: flex;
  cursor: pointer;
}
.header-content .actions-div .profiles-div .profile-option input {
  display: block;
  margin-top: 0.35rem;
}
.header-content .actions-div .profiles-div .profile-option .select-profile-label {
  margin-left: 0.75rem;
  font-size: var(--medium-font-size);
  white-space: nowrap;
}
.header-content .actions-div .themes-div {
  margin: auto 1rem auto 0.25rem;
}
.header-content .actions-div .themes-div .theme-icon {
  cursor: pointer;
  font-size: 1.4rem;
  height: fit-content;
  /* margin: auto; */
  display: block;
  margin: 0rem 0.5rem auto 0.25rem;
}
.header-content .actions-div .themes-div .theme-icon:hover {
  color: var(--app-color);
}
.header-content .actions-div .themes-div .theme-title {
  margin: 0.25rem 1.5rem 0rem 0.5rem;
  font-size: var(--medium-font-size);
  white-space: nowrap;
}
.header-content .actions-div .themes-div .theme-option {
  display: flex;
  cursor: pointer;
  margin-left: 1.5rem;
}
.header-content .actions-div .themes-div .theme-option input {
  cursor: pointer;
  display: block;
  margin-top: 0.35rem;
}
.header-content .actions-div .themes-div .theme-option .change-theme-label {
  cursor: pointer;
  margin-left: 1.25rem;
  font-size: var(--medium-small-font-size);
  white-space: nowrap;
}

/*# sourceMappingURL=header.css.map */
