/*
 *  Copyright 2016 Adobe Systems Incorporated
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */

@import "@{designPath}/common/helpers.less";

.we-Cart-entryCol {
    display: inline-block;
    vertical-align: middle;
}

.we-Cart, .we-Smartlist {

    &-content {

        position: fixed;
        display: none;
        left: 100%;
        top: 0;

        background-color: #fff;

        height: 100vh;
        width: 100%;
        transition: top .2s;

        z-index: 1000;

        @media(min-width: @screen-sm-min) {
            width: 300px;
        }
    }

    &-data {
        overflow-y: auto;
        max-height: 95%;
    }
    
    &-button {
        display: block;
        line-height: 24px;
        padding: @navbar-padding-vertical 0;

        &:hover, &:focus {
            text-decoration: none;
        }

        .navbar-inverse & {
            color: #fff;
        }

        @media(min-width: @screen-md-min) {
            padding: 8px @padding-small-horizontal;
        }
    }

    &-header {
        .clearfix();

        background-color: @brand-primary;
        color: #fff;

        min-height: @navbar-fixed-height;

        text-transform: uppercase;

        padding: 8px @padding-small-horizontal;

        margin-bottom: 5px;

        a {
            color: #fff;

            &:hover {
                text-decoration: none;
            }
        }
    }

    &-title {
        border-bottom: 1px solid fade(@gray-base, 10);
        margin: 0 1rem @padding-large-vertical 1rem;
    }

    &-headerLeft {
        float: left;
    }

    &-headerRight {
        float: right;
    }

    &-entry {
        margin-bottom: 20px;
    }

    &-empty {
        padding: 1rem;
    }

    &-image {
        &:extend(.we-Cart-entryCol);
        width: 35%;
        padding: 0 1rem 1rem 1rem;
        vertical-align: top;
    }

    &-entryContent {
        &:extend(.we-Cart-entryCol);
        width: 50%;

        a {
            color: #000;
        }
    }

    &-entryPrice {
        float: right;
    }

    &-entryQuantity {
        float: left;

        label {
            text-transform: none;
            margin-right: 5px;
        }

        form {
            display: inline;
        }
        input {
            width: 50px;
            padding: 2px 5px 2px 10px;
            border: 1px solid @input-border;
        }
    }

    &-entryVariants {
        list-style-type: none;
        padding-left: 0px;
        text-transform: capitalize;
        line-height: 1rem;
    }

    &-remove {
        &:extend(.we-Cart-entryCol);
        width: 10%;
        text-align: center;
        vertical-align: top;

        .btn-default {
            padding-top: 1px;
            padding-right: 10px;
            min-width: 0;

            &:hover, &.hover,
            &:focus, &.focus {
                outline: none;
                background-color: transparent;
                box-shadow: none;
            }
        }
    }

    &-promotions {
        margin: 5px 1rem 5px 1rem;
    }

    &-footer {
        bottom: 0;
        left: 0;
        right: 0;
        border-top: 1px solid fade(@gray-base, 10);
        margin: 0 1rem @padding-large-vertical 1rem;
        padding-top: @padding-large-vertical;
        padding-bottom: 50px;
    }

    &-subtotal {
        text-transform: uppercase;
        font-size: 1.4rem;
        margin-bottom: @padding-large-vertical;
    }
}