@use '~@epam/assets/scss/index' as *;

.HeaderDropdownBody {
    padding: 12px 0;
    color: $night700;

    .HeaderDropdownButtonWrapper {
        .HeaderFour, .HeaderFive, .HeaderSix {
            line-height: 24px;
        }

        .HeaderOne {
            font-family: $font-sans-semibold;
            font-size: 42px;
            line-height: 48px;
        }

        .HeaderTwo {
            font-family: $font-sans-bold;
            font-size: 30px;
            line-height: 36px;
        }

        .HeaderThree {
            font-family: $font-sans-semibold;
            font-size: 24px;
            line-height: 30px;
        }

        .HeaderFour {
            font-family: $font-sans-semibold;
            font-size: 18px;
        }

        .HeaderFive {
            font-family: $font-sans-semibold;
            font-size: 16px;
            font-weight: 600;
        }

        .HeaderSix {
            font-family: $font-sans-semibold;
            font-size: 14px;
        }

        .Paragraph {
            font-family: $font-sans;
            font-size: 14px;
        }
    }

    .caption {
        :global(.uui-caption) {
            width: 100%;
            padding: 6px 18px;
        }
    }

    .active {
        color: $sky;
    }

    .caption:hover {
        background-color: $night50;
    }
}

