@use '../core/styles/common/tokens' as *;
@use '../core/styles/common/overlay';

@use './navbar-theme' as *;

.kbq-navbar {
    z-index: overlay.$overlay-z-index;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;

    position: relative;
}

.kbq-navbar-container {
    display: flex;

    flex-shrink: 0;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;

    position: relative;
}

.kbq-navbar .kbq-navbar-container + .kbq-navbar-container {
    margin-left: var(--kbq-size-xxl);
}

@include kbq-navbar-theme();
@include kbq-navbar-typography();