
.top-navbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    transform: none !important;
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    background-color: var(--color-light);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    height: var(--navbar-height); /* Define the navbar height */
}

.top-navbar > .navbar-content {
    width: 100%;
    padding-inline-start: var(--s4);
    max-width: var(--body-measure);
    background-color: var(--color-light);
}

.logo {
    font-weight: bold;
    font-size: 1.25rem;
    text-decoration: none;
    color: rgb(49, 125, 79);
    display: inline-block;
}

.nav-link {
    text-decoration: none;
    color: #333;
}

.nav-link:hover {
    color: #000;
}

.nav-secondary-cluster {
    flex-shrink: 0;
    flex-grow: 0;
    width: auto;
}

.nav-cluster {
    flex-shrink: 0;
    flex-grow: 0;
    width: auto;
}

/* Main nav container */
nav > cluster-l {
    width: 100%;
}
