/* -------------
    SOMMAIRE
------------- */

/*
    @AUTHOR : Nicolas BOUDOT

    DOM : BEFORE
    Styles liés aux classes .before_* qui permettent de cibler un pseudo-élément ::before
*/

/*
    01 - XS
        Général
        Spécifiques
            List-style
        Props

        Position
        Margin
            Margin Y
            Margin X
            Margin-top
            Margin-right
            Margin-bottom
            Margin-left
        Opacité
        Spécifiques
            List-style
    02 - SM
    03 - MD
    04 - LG
    05 - XL
    06 - XXL
*/



/* -----------------
    01 - XS
        Général
----------------- */

.before::before {
    content: "";
}

/* None */
.before_none::before {
    content: none;
}



/* -----------------
    01 - XS
        Spécifiques
            List-style
----------------- */

.before_list-style {
    display: flex;
}

    .before_list-style::before {
        content: "";
        display: block;
        background-color: var(--c-primary);
        margin-right: 8px;
        width: 6px;
        min-width: 6px;
        height: 6px;
        margin-top: 8px;
    }



/* -----------------
    01 - XS
        Props
----------------- */

/*
    On ne créera ici que les classes nécessaires à chaque projet pour éviter de créer trop de classes de propriétés.
    On pourrait les regrouper avec les classes de propriétés mais on perdrait en lisibilité.

    Par exemple :
        .before_p-absolute,
        .p-absolute {
            position: absolute;
        }
*/