/* /Layout/MainLayout.razor.rz.scp.css */
.topbar[b-9l9hqto1j4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 56px;
    padding: 0 1.25rem;
    background: #0c447c;
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 20;
}

    .topbar .brand[b-9l9hqto1j4] {
        display: flex;
        align-items: baseline;
        gap: 0.6rem;
    }

    .topbar .brand-zh[b-9l9hqto1j4] {
        font-size: 1.15rem;
        font-weight: 600;
    }

    .topbar .brand-en[b-9l9hqto1j4] {
        font-size: 0.8rem;
        opacity: 0.75;
    }

    .topbar .brand-link[b-9l9hqto1j4] {
        color: #cfe3f7;
        text-decoration: none;
        font-size: 0.85rem;
    }

        .topbar .brand-link:hover[b-9l9hqto1j4] {
            color: #fff;
            text-decoration: underline;
        }

.catalog-main[b-9l9hqto1j4] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 1rem 1.25rem 3rem;
}

    .topbar .brand-right[b-9l9hqto1j4] {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .topbar .lang-switch[b-9l9hqto1j4] {
        display: flex;
        gap: 0.3rem;
    }

    .topbar .topbar-btn[b-9l9hqto1j4] {
        display: inline-flex;
        align-items: center;
        padding: 0.28rem 0.7rem;
        font-size: 0.8rem;
        line-height: 1;
        color: #cfe3f7;
        text-decoration: none;
        border: 1px solid rgba(255,255,255,0.35);
        border-radius: 999px;
        background: rgba(255,255,255,0.06);
        transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
    }

        .topbar .topbar-btn:hover[b-9l9hqto1j4] {
            color: #fff;
            background: rgba(255,255,255,0.16);
            border-color: rgba(255,255,255,0.6);
        }