.header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.item-box-left {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.94rem;

  .logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 1rem;
    gap: 0.5rem;
    color: var(--text-foreground);
    i {
      font-size: 1rem;
    }
  }

  .title-box {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    font-size: 1rem;
    span {
      color: var(--text-muted-foreground);
      font-style: normal;
      font-weight: 400;
      line-height: 1.25rem;
      font-size: 1rem;
    }

    span:hover {
      color: var(--text-foreground);
      cursor: pointer;
    }

    span:hover.active {
      cursor: default;
    }

    .active {
      color: var(--text-foreground);
      cursor: default;
      font-weight: 500;
    }
  }
}

.item-box-right {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  height: 2.5rem;

  button {
    height: 2.5rem;
  }
}

#languageSelector,
select {
  display: flex;
  padding: 0.5rem 1rem;
  align-items: center;
  gap: 0.5rem;
  align-self: stretch;
  border-radius: var(--radius-rounded-md);
  border: 1px solid var(--border-border);

  color: var(--text-foreground);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem;
}

#languageSelector option,
select option {
  color: var(--text-foreground);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem;
}

/* 헤더 표시/숨김 상태 관리 */
#header.header-hidden {
  display: none;
}

#header.header-visible {
  display: block;
}