.ons-footer {
    a {
        color: var(--ons-color-text-banner-link);
        text-decoration: underline;

        &:hover:not(:focus) {
            color: var(--ons-color-text-banner-link-hover);
            text-decoration: underline solid var(--ons-color-text-banner-link-hover) 2px;
        }
    }

    &__button-container {
        background-clip: border-box;
        background-color: var(--ons-color-header);
        padding: 1rem;
        a {
            text-decoration: none;
        }
    }

    &__warning {
        background-color: var(--ons-color-banner-bg-dark);
        outline: 2px solid transparent; // Add transparent outline because Windows High Contrast Mode doesn't show background
    }

    &__license {
        @extend .ons-u-fs-s;
    }

    &__ogl-img {
        margin: 0 0.5rem 0.25rem 0;
        max-width: 100%;
        vertical-align: middle;
    }

    &__logo-container {
        gap: 1rem;

        svg,
        img {
            max-height: 30px;
            width: auto;
        }
    }

    .ons-icon--logo,
    .ons-icon--logo__group {
        fill: var(--ons-color-black) !important;
    }

    &__body {
        background-color: var(--ons-color-banner-bg);
        padding: 2rem 0 4rem;

        .ons-list__link {
            margin-right: 0;
        }
    }

    &--rows {
        li {
            @extend .ons-u-mb-2xs;
        }
    }

    &__logo-large {
        @include mq('2xs', 414px) {
            display: none;
        }
    }

    &__logo-small {
        @include mq(415px) {
            display: none;
        }
    }
}