@use "../abstracts/mixins";
@use "../abstracts/variables";


.anchorsList{
    margin-top: 4vh;
    
    > li{
        border-bottom: 2px solid variables.$cDark;

        &:first-child{
            border-top: 2px solid variables.$cDark;
        }

        a{
            position: relative;
            display: block;
            @include mixins.fontSize(40,40);
            padding-top: 4vh;
            padding-bottom: 4vh;
            text-decoration: none;
            transition: color 0.15s linear;

            @include mixins.respondTo('md'){
                @include mixins.fontSize(30,30,variables.$baseFontSizeMd);
            }

            &, &:visited{
                color: variables.$baseTextColor;
            }

            &::before{
                content: "";
                position: absolute;
                top: 50%; right: calc(100% + 45px);
                width: 10px;
                height: 10px;
                border-radius: 10px;
                margin-top: -5px;
                background-color: variables.$cPrimary;
                transition: transform 0.25s variables.$Power2EaseInOut;
                transform: scale(0);
                transform-origin: center center;
            }

            @include mixins.hover{
                color: variables.$cDark;
                text-decoration: none;

                &::before{
                    transform: scale(1);
                }
            }
        }
    }
}