/* Reusable top navbar theme aligned with games.html */
:root {
    --han-vermilion: #b43b2f;
    --han-celadon: #4a7f77;
    --han-lacquer: #2d4f68;
}

.navbar {
    background: rgba(247, 242, 232, 0.9) !important;
    border-bottom: 2px solid rgba(74, 127, 119, 0.28) !important;
    box-shadow: 0 6px 16px rgba(37, 54, 63, 0.08) !important;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
}

.navbar-nav {
    column-gap: 1.2rem;
    align-items: center;
}

.navbar .navbar-nav.ms-auto {
    margin-top: 0.45rem;
}

.navbar .navbar-brand,
.navbar .nav-link,
.navbar-brand,
.nav-link {
    color: var(--han-lacquer) !important;
    text-shadow: none !important;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.nav-link.nav-bilingual {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}

.nav-bilingual {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.25;
    gap: 3px;
}

/* Restore bilingual display in top navbar (Chinese + English visible together). */
.navbar .chinese-text,
.navbar .english-text {
    display: inline !important;
}

.nav-bilingual .chinese-text {
    font-size: 1.5rem;
}

.nav-bilingual .english-text {
    font-size: 1.32rem;
}

.navbar-brand.nav-bilingual .chinese-text {
    font-size: 1.66rem;
}

.navbar-brand.nav-bilingual .english-text {
    font-size: 1.4rem;
}

.navbar .nav-link.active,
.nav-link.active {
    color: var(--han-vermilion) !important;
}

.navbar .english-text,
.navbar .english-text * {
    font-family: "Times New Roman", Times, serif;
}

.navbar .btn-outline-secondary {
    border-color: var(--han-celadon);
    color: var(--han-celadon);
}

.navbar .btn-outline-secondary:hover {
    background-color: var(--han-celadon);
    color: #fff;
}

.navbar .btn-outline-primary {
    border-color: var(--han-vermilion);
    color: var(--han-vermilion);
}

.navbar .btn-outline-primary:hover {
    background-color: var(--han-vermilion);
    color: #fff;
}

/* In language toggle, the text "中文" uses .english-text class by design, force Chinese font to keep visual consistency. */
.navbar #languageToggle .english-text {
    font-family: "STKaiti", "KaiTi", "FangSong", "Noto Serif SC", serif !important;
}