/* Par défaut : mode mobile, voir les media queries pour les surcharges */

/* -- Au-dessus du footer (flèche "Go to top") -- */

.footer-top {
    /* Layout */
    display: flex;
    position: relative;
    z-index: 1000;

    /* Flexbox */
    justify-content: center;
    margin-top: calc(-1rem + calc(-1 * var(--tst-go-to-top-size)));
    margin-bottom: 1rem;

    svg.go-to-top-icon {
        width: var(--tst-go-to-top-size);
        height: var(--tst-go-to-top-size);

        /* Flèche "Go to top" à l'intérieur du SVG */
        .go-to-top-icon-bck {
            /* Appearance */
            fill: var(--theme-go-to-top-icon-background-color);

            &:hover {
                /* Appearance */
                fill: var(--theme-go-to-top-icon-background-hover-color);
            }
        }
    }
}

/* -- Footer -- */

footer {
    /* Layout */
    display: flex;

    /* Flexbox */
    align-items: center;
    flex-direction: column;
    justify-content: center;

    /* Spacing */
    gap: 1rem;
    padding: 1.6rem;

    /* Appearance */
    background-color: var(--theme-footer-background-color);

    .footer-row-items {
        /* Layout */
        display: flex;

        /* Flexbox */
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;

        /* Dimensions */
        max-width: var(--desktop-container-max-width);

        /* Spacing */
        gap: 1rem;
        margin-block: 0;
        padding: 0;

        /* Typography */
        list-style-type: none;

        .footer-row-item {
            /* Spacing */
            padding: 0;

            /* Typography */
            /* Ordinateur/Texte XS semibold (14) */
            /* Mobile/Texte XS semibold (11) */
            font-family: var(--stacksb), sans-serif;
            font-size: var(--font-size-xs);
            line-height: var(--line-height-xs);
            text-wrap: nowrap;

            a {
                /* Spacing */
                padding: 1rem 0.5rem;

                /* Typography */
                color: var(--theme-primary-text-color);
                text-decoration: none;

                &[target="_blank"]::after {
                    /* Appearance */
                    background-image: url(../img/extern-link-icon-white.svg);
                }

                &:hover {
                    /* Typography */
                    text-decoration: underline;
                }
            }
        }
    }
}

/* For windows with width higher than 48rem (tablet breakpoint) */
@media (min-width: 48rem) {
    .footer-top {
        /* justify-content: flex-end; */
        width: var(--tst-go-to-top-size);
        /* Spacing */
        /* On choisit la valeur la plus basse entre "à droite de l'écran" et "à 1080px/2 à droite du milieu de l'écran" (pour respecter la largeur max de 1080px) */
        margin-left: min(calc(100% - var(--tst-go-to-top-size) - 2rem), calc(50% + 54rem - var(--tst-go-to-top-size) - 2rem));
    }
}

/* Mode impression */
@media print {
    .footer-top {
        /* Layout */
        display: none;
    }

    footer {
        /* Layout */
        display: none;
    }
}