/* Import all the styles with one single CSS file */
@import "revconnect-branding-styles.css";
@import "revconnect-nav2.css";
@import "revconnect-overview.css";
@import "revconnect-workspaces.css";
@import "revconnect-movements.css";
@import "revconnect-people.css";

/* Some share styles for the New UI */
.outline-none {
    outline: 2px solid transparent;
    outline-offset: 2px;
}

.title-bar-nav2 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 15px 40px;
    background-color: #FFFFFF;
}

.new-vertify-logo-nav2 {
    width: 220px;
}

@media screen and (max-width: 1440px) {
    .new-vertify-logo-nav2 {
        width: 180px;
    }
}

.title-bar-nav2 > h1 {
    font-family: 'Avenir';
    font-style: normal;
    font-size: 28px;
    color: #000;
    font-weight: 900;
    line-height: 44px;
}

.router-button-nav2 {
    display: flex;
    background-color: var(--secondary);
    border-radius: 8px;
    border: none;
    color: #FFFFFF;
    font-weight: 600;
    font-size: 14px;
    line-height: 24px;
    padding: 6px 16px;
    align-items: center;
    justify-content: center;
    gap: 0 8px;
    min-width: 150px;
    font-family: 'Avenir';
}

.router-button-nav2 > img {
    filter: var(--svg-white);
}

.router-button-nav2:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease-out;
}

.router-button-nav2:disabled {
    background-color: var(--slate);
}

.variant-button-nav2 {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border-radius: 8px;
    border: none;
    color: var(--slate);
    border: 1px solid var(--slate);
    font-weight: 600;
    font-family: 'Avenir';
    font-size: 14px;
    line-height: 24px;
    padding: 6px 16px;
    min-width: 150px;
}

.variant-button-nav2:hover {
    background-color: var(--slate);
    color: #FFFFFF;
    transition: background-color 0.5s ease;
}

.variant-grid-button-nav2 {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border-radius: 8px;
    border: none;
    color: var(--secondary);
    border: 1px solid var(--secondary);
    font-weight: 600;
    font-family: 'Avenir';
    font-size: 14px;
    line-height: 24px;
    padding: 6px 16px;
    min-width: 150px;
}

.variant-grid-button-nav2:hover {
    background-color: var(--secondary);
    color: #FFFFFF;
    transition: background-color 0.5s ease;
}