// Open edX: LMS footer
// ====================

.wrapper-footer {
    @include clearfix();
    @extend %ui-print-excluded;
    box-shadow: 0 -1px 5px 0 $shadow-l1;
    border-top: 1px solid palette(grayscale, x-back);
    padding: 25px ($baseline/2) ($baseline*1.5);
    background: $footer-bg;

    footer#footer-openedx {
        @include clearfix();
        box-sizing: border-box;
        margin: 0 auto;

        p, ol, ul {
            font-family: $sans-serif;

            // override needed for poorly scoped font-family styling on p a:link {}
            a {
                font-family: $sans-serif;
            }
        }

        a {
            @extend %link-text;
            border-bottom: none;

            &:hover,
            &:focus,
            &:active {
                border-bottom: 1px dotted $link-color;
            }
        }

        // colophon
        .colophon {
            @include span(12);

            @include susy-media($bp-screen-sm) {
                @include span(8);
            }

            .nav-colophon {
                @include clearfix();
                margin: $footer_margin;

                ol {
                    list-style: none;
                }

                li {
                    @include float(left);
                    @include margin-right($baseline*0.75);

                    a {
                        color: tint($black, 20%);

                        &:hover,
                        &:focus,
                        &:active {
                            color: $link-color;
                        }
                    }

                    &:last-child {
                        @include margin-right(0);
                    }
                }
            }

            .colophon-about {
                @include clearfix();

                img {
                    @include float(left);
                    @include margin-right(0);
                    width: 68px;
                    height: 34px;
                }

                p {
                    @include float(left);
                    @include span(9);
                    @include margin-left($baseline);
                    @include padding-left($baseline);
                    font-size: font-size(small);
                    background: transparent url(/static/images/bg-footer-divider.jpg) 0 0 no-repeat;
                }
            }
        }

        // references
        .references {
            @include span(4);
            margin: -10px 0 0 0;
            display: inline-block;
        }

        .wrapper-logo {
            margin: ($baseline*0.75) 0;

            a {
                display: inline-block;

                &:hover,
                &:focus {
                    border-bottom: 0;
                }
            }
        }

        .copyright {
            @include text-align(left);
            margin: -2px 0 8px;
            font-size: font-size(xx-small);
            color: palette(grayscale, dark);
        }

        .nav-legal {
            @include clearfix();
            @include text-align(left);

            li {
                display: inline-block;
                font-size: font-size(xx-small);
            }

            .nav-legal-02 a {
                &:before {
                    @include margin-right(($baseline/4));
                    content: "-";
                }
            }
        }

        .nav-social {
            @include text-align(right);
            margin: 0;

            li {
                display: inline-block;

                &:last-child {
                    @include margin-right(0);
                }

                a {
                    display: block;

                    &:hover,
                    &:focus,
                    &:active {
                        border: none;
                    }
                }

                img {
                    display: block;
                }
            }
        }

        // platform Open edX logo and link
        .footer-about-openedx {
            @include span(12);
            @include text-align(right);
            vertical-align: bottom;

            @include susy-media($bp-screen-sm) {
                @include span(4);
                @include margin-right(0);
            }


            a {
                @include float(right);
                display: inline-block;

                &:hover {
                    border-bottom: none;
                }
            }
        }
    }
}

// marketing site design syncing
.view-register,
.view-login,
.view-passwordreset {
    .wrapper-footer footer {
        width: 960px;

        .colophon-about img {
            margin-top: ($baseline*1.5);
        }
    }
}