/*  -----------------------------------------------------------------------------------------------
  Site Footer
  @package v.1.0.0
--------------------------------------------------------------------------------------------------- */
.site-footer
{
    position: relative;
    z-index: 1;
    justify-content: space-between;
    font-size: 14px;
    border-top: 1px solid $grey;
    color: $black;
    background: $white;
    
    .footer-bg-selected &
    {
        &:after
        {
            content: '';
            display: block;
            position: absolute;
            z-index: 0;
            width: 100%;
            height: 100%;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            background-color: $black;
        }
    }
    
    .wrapper
    {
        @include elements_padding_on_sides();
    }

    .infinite-scroll.neverending &
    {
      display: none;
    }

    .infinity-end.neverending, .neverending.no-posts &
    {
        display: flex;
    }

    .infinity-end.neverending.infinity-end &
    {
        display: flex;
    }
    
    a
    {
        &:hover
        {
            color: $accent_color;
        }
    }

    .footer-menu
    {
        padding: 24px;
        @include relative;
        
        .nav--footer
        {
            display: flex;
            justify-content: center;
            padding: 0;
            margin: 0;
            list-style-type: none;
            
            @include media('<=tablet')
            {
                flex-direction: column;
                align-items: center;
            }
        
            li
            {
                position: relative;
                margin-right: 32px;
                @extend .flex-item;
                
                @include media('<=tablet')
                {
                     margin-right: 0;
                     margin-bottom: 12px;
                }
                
                a
                {
                    text-transform: uppercase;
                    letter-spacing: 1px;
                    font-weight: bold;
                    padding: 0;
                    
                    &:hover
                    {
                        color: $accent_color;
                    }
                }

                &:last-child
                {
                    margin-right: 0;
                    padding-right: 0;
                    
                    @include media('<=tablet')
                    {
                        margin-bottom: 0;
                    }
                }

            }
        }
    }

    .site-info
    {
        padding: 8px;
        font-size: 12px;
        text-align: center;
        background: $black;
        @include relative;
        
        .copyright-message,
        .c-footer__credits, 
        .c-footer__credits a
        {
            color: rgba($white, .5);
        }
    }

   	.back-to-top
   	{
   		display: inline-block;
   		background-color: transparent;
		width: 32px;
		height: 32px;
   		text-align: center;
   		border-radius: 4px;
   		position: fixed;
   		bottom: 50px;
   		right: 30px;
   		transition: background-color .3s, 
   		  opacity .5s, visibility .5s;
   		opacity: 0;
   		visibility: hidden;
   		z-index: 1000;
        background: $accent_color;
        
        @include media('<=tablet')
        {
            right: 12px;
        }
   		
   		&.show
   		{
   			opacity: 1;
   			visibility: visible;
   		}

   		svg
   		{
   			path
            {
                fill: $white;
            }
   		}
   	}

    .footer-widgets
    {
        @include relative;

        .widget-area
        {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            grid-gap: 48px;
            padding: 64px 0;
            
            @include media('<=huge')
            {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }

            @include media('<=desktop')
            {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            @include media('<=tablet')
            {
                grid-template-columns: 100%;
            }
            
            .widget
            {
                margin-bottom: 0;
                
                &.widget_recent_entries,
                &.widget_categories
                {
                    ul
                    {
                        li
                        {
                            padding: 0;   
                        }
                    }
                }
                
                ul
                {
                    
                    li
                    {
                        border-bottom: none;
                    }
                }
                
                .widget-title
                {
                    margin-top: 0;
                }

                a
                {
                    
                    &:hover
                    {
                        color: $accent_color;
                    }
                }

                &.widget_chained_about_me
                {
                    border: none;
                    
                    .widget_chained-about-me__text
                    {
                        opacity: .7;
                    }
                }
            }
        }

        &.widgets-3
        {
            .widget-area
            {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                
                @include media('<=tablet')
                {
                    grid-template-columns: 100%;
                }
            }
        }
    }
}