// ============================================================================
// Imports
// ============================================================================

@use "../../variables" as *;
@use "../body_molecules" as *;
@use "../body_atoms" as *;

// ============================================================================
// Component | Footer
// ============================================================================

@mixin footer {
    // grid-area: footer;
    grid-row-start: c1;
    grid-column-start: c1;
    grid-row-end: c3;
    grid-column-end: c3;

    // @include color_scheme_dark;
    @include align_end;
    @include flex--col;
    @include justify--end;
    z-index: z("ribbon");
    @include sizing--border;
    height: $ribbon_height;
    background-color: transparent;
    z-index: z("ribbon");

    padding-left: calc($ribbon_spacing / 2);
    padding-right: calc($ribbon_spacing / 2);
    padding-top: calc($ribbon_spacing / 2);
    padding-bottom: calc($ribbon_spacing / 2);

    pointer-events: none;

    * {
        pointer-events: all;
    }
}

@mixin footer_overlay {
    // grid-area: footer;
    grid-row-start: c1;
    grid-column-start: c1;
    grid-row-end: c3;
    grid-column-end: c3;

    // @include color_scheme_dark;
    @include align_end;
    @include flex--col;
    @include justify--end;
    z-index: z("ribbon");
    @include sizing--border;
    height: $ribbon_height;
    background-color: transparent;
    z-index: z("ribbon");

    padding-left: calc($ribbon_spacing / 2);
    padding-right: calc($ribbon_spacing / 2);
    padding-top: calc($ribbon_spacing / 2);
    padding-bottom: calc($ribbon_spacing / 2);

    * {
        color: $color_01;
    }
}

@mixin footer_copyright {
    display: flex;
    justify-content: center;
    width: 100%;
    height: q(16);
}