@import './variables.scss';


.pivot-header,
.pivot-header--horizontal,
.pivot-header--vertical {
    box-sizing: border-box;
    background: $colorNavyMedium;
    color: $colorLight;
    
    font-family: $font;
    font-size: $fontSizeXS;
    letter-spacing: 0.5px;

    cursor: default;
}

.pivot-header--vertical {
    flex-direction: column;
    flex-shrink: 0;

    .pivot-header__label {
        align-items: center;

        .pivot-header__label-text {
            box-sizing: content-box;
            padding: 5px 0 0 5px;
        }
    }
}

.pivot-header--horizontal {
    align-items: center; 
    flex-grow: 1;
    align-items: flex-end;
    overflow: hidden;
    max-width: 100%;

    .pivot-header__label {
        display: flex;
        align-items: flex-end;
        
        .pivot-header__label-text {
            writing-mode: vertical-lr;
            text-align: end;
            white-space: nowrap;
            padding-bottom: 5px;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 20px;
        }
    }
}

.pivot-header__menu-space {
    box-sizing: border-box;
    align-self: stretch;
    padding: 5px; 
}

.pivot-header .pivot-header__label {
    flex-grow: 1;
    justify-content: flex-end;
}