/**
 * Cart/checkout page
 */

// Heading
.cart-collaterals .cart_totals h2,
.woocommerce-checkout-review-order h3 {
    font-size: 1.2em;
    text-transform: uppercase;
    font-weight: 500;
    padding-bottom: 15px;
    margin-bottom: 0px;
}

.woocommerce-billing-fields h3 {
    font-size: 1.2em;
    text-transform: uppercase;
    font-weight: 500;
}

#ship-to-different-address {
    font-size: 1em;
    margin: 1.5em 0;
    text-transform: uppercase;
    font-weight: 500;
    span {
        position: relative;
        top: 1px;
        font-weight: 500;
        cursor: pointer;
    }
}

// Empty cart page
.cart-empty,
.return-to-shop {
    text-align: center;
}

// Sidebar Box style
.cart-collaterals,
.woocommerce-checkout-review-order, .group-highlight-box {
    background: #f9f9f9;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08);
    padding: 1.8em 2em 2em 2em;
    border-radius: 2px;
    margin-top: 1em;
    @include for_device(mobile) {
        padding: 1em;
        form.cart .group_table td {
            padding-right: 0.5em;
        }
    }
    > * {
        &:last-child {
            margin-bottom: 0px;
        }
    }
}

form.woocommerce-checkout {
    @include clearfix;
    margin: 2em 0;
    @include for_device(tablet) {
        margin: 1em 0;
    }
}

.woocommerce-cart,
.woocommerce-checkout,
#add_payment_method {
    table.cart {
        .product-thumbnail {
            width: 100px;
        }
        .product-quantity {
            min-width: 8em;
        }
        img {
            width: 90px;
            box-shadow: none;
            display: block;
        }
        th,
        td {
            vertical-align: middle;
        }

        input {
            margin: 0;
            vertical-align: middle;
        }
        td.actions {
            padding: 15px 0px 15px 0px;
        }
        tr {
            th:first-of-type {
                padding-left: 0px;
            }
            th:last-of-type {
                padding-right: 0px;
                text-align: right;
            }

            td:first-of-type {
                padding-left: 1px;
            }
            td:last-of-type {
                padding-right: 0px;
                text-align: right;
            }
        }
    }

    .wc-proceed-to-checkout {
        @include clearfix;
        a.checkout-button {
            display: block;
            text-align: center;
            font-size: 1.25em;
        }
    }

    .cart-collaterals {
        .shipping_calculator {
            .button {
                width: 100%;
                float: none;
                display: block;
            }

            .shipping-calculator-button::after {
                @include iconafter( '\e019' );
            }
        }

        .cart_totals {
            p small {
                color: $subtext;
                font-size: 0.83em;
            }


            .discount td {
                color: $highlight;
            }

        }

        .cross-sells ul.products li.product {
            margin-top: 0;
        }
    }
    .checkout {
        .col-2 {
            h3#ship-to-different-address {
                float: left;
                clear: none;
            }

            .notes {
                clear: left;
            }

            .form-row-first {
                clear: left;
            }
        }

        .create-account small {
            font-size: 11px;
            color: $subtext;
            font-weight: normal;
        }

        div.shipping-address {
            padding: 0;
            clear: left;
            width: 100%;
        }

        .shipping_address {
            clear: both;
        }
    }

    #payment {

        ul.payment_methods {
            @include clearfix();
            text-align: left;
            margin: 0;
            list-style: none outside;

            > li {
                line-height: 2;
                text-align: left;
                margin: 0;
                font-weight: normal;
                border-bottom: 1px solid $color_border;
                padding-top: 1em;
                line-height: 1.2;
                position: relative;
                > label {
                    padding-left: 32px;
                    margin-bottom: 0.8em;
                    display: inline-block;
                    cursor: pointer;
                    font-weight: 500;
                    line-height: 1.2;
                    font-size: 1.05em;
                    position: relative;
                    top: -2px;
                }

                p {
                    padding: 0 2em 1.2em 32px;
                    line-height: 1.7;
                }

                img {
                    vertical-align: middle;
                    margin: -2px 0 0 0.5em;
                    padding: 0;
                    position: relative;
                    box-shadow: none;
                }

                img + img {
                    margin-left: 2px;
                }

                .input-radio {
                    position: absolute;
                    left: 0;
                }

                &.payment_method_paypal {

                    > label {
                        display: block;
                    }

                    img {
                        float: right;
                        max-height: 35px;
                        vertical-align: middle;
                        position: relative;
                        top: -5px;
                        margin-left: 15px;
                    }

                    .about_paypal {
                        float: right;
                        font-size: 0.8em;
                        border-bottom: 1px dotted currentColor;
                    }

                }

                &.payment_method_stripe {
                    img {
                        max-height: 15px;
                        margin: 2px -5px 0 !important;
                    }
                    input#payment_method_stripe {
                        top: auto !important;
                    }
                    p {
                        margin-bottom: 0;
                    }
                }

            }

            [class*="payment_method_stripe_"] {
            .input-radio {
                top: auto !important;
            }
        }

            li:not(.woocommerce-notice) {
                @include clearfix;
            }
        }

        div.payment_box {
            position: relative;
            box-sizing: border-box;
            width: 100%;
            font-size: 0.9em;
            border-radius: 2px;
            line-height: 1.5;

            input.input-text, textarea {
                border-color: darken( $secondary, 15% );
                border-top-color: darken( $secondary, 20% );
            }

            ::-webkit-input-placeholder {
                color: darken( $secondary, 20% );
            }

            :-moz-placeholder {
                color: darken( $secondary, 20% );
            }

            :-ms-input-placeholder {
                color: darken( $secondary, 20% );
            }

            .woocommerce-SavedPaymentMethods {
                list-style: none outside;
                margin: 0;
                .woocommerce-SavedPaymentMethods-token,
                .woocommerce-SavedPaymentMethods-new {
                    margin: 0 0 0.5em;
                    label {
                        cursor: pointer;
                    }
                }
                .woocommerce-SavedPaymentMethods-tokenInput {
                    vertical-align: middle;
                    margin: -3px 1em 0 0;
                    position: relative;
                }
            }

            .wc-credit-card-form {
                border: 0;
                padding: 0 2em 0em 32px;
                margin: 0;
            }
            .wc-credit-card-form-card-number,
            .wc-credit-card-form-card-expiry,
            .wc-credit-card-form-card-cvc {
                font-size: 1.5em;
                padding: 8px;
                background-repeat: no-repeat;
                background-position: right 0.618em center;
                background-size: 32px 20px;

                &.visa {
                    background-image: url('../../images/icons/credit-cards/visa.svg');
                }

                &.mastercard {
                    background-image: url('../../images/icons/credit-cards/mastercard.svg');
                }

                &.laser {
                    background-image: url('../../images/icons/credit-cards/laser.svg');
                }

                &.dinersclub {
                    background-image: url('../../images/icons/credit-cards/diners.svg');
                }

                &.maestro {
                    background-image: url('../../images/icons/credit-cards/maestro.svg');
                }

                &.jcb {
                    background-image: url('../../images/icons/credit-cards/jcb.svg');
                }

                &.amex {
                    background-image: url('../../images/icons/credit-cards/amex.svg');
                }
                &.discover {
                    background-image: url('../../images/icons/credit-cards/discover.svg');
                }
            }

            span.help {
                font-size: 0.857em;
                color: $subtext;
                font-weight: normal;
            }

            .form-row {
                margin: 0 0 0.5em;
            }

            p:last-child {
                margin-bottom: 0;
            }

        }

        .place-order {
            padding: 2em 0 0 0;
        }

    }
}


/* Minimal style for cart/checkout page */

// Messages
.woocommerce-form-coupon-toggle,
.woocommerce-form-login-toggle {
    .woocommerce-message,
    .woocommerce-info {
        max-width: 600px;
        margin: 1em auto 1em;
        border: 0px none;
        padding: 0px;
        background: none;
        text-align: center;
        &:before {
            display: inline-block;
            position: relative;
            top: auto;
            left: auto;
            font-size: 0.8em;
            margin-right: 0.4em;
        }
    }
}


.woocommerce-form-login-toggle {
    .woocommerce-info {
        &:before {
            content: '\e03a';
        }
    }
}
.woocommerce-form-coupon-toggle {
    .woocommerce-info {
        &:before {
            content: '\e600';
        }
    }
}


// Cart Collaterals Box.
.cart-collaterals {

    table {
        &.shop_table {
            background: none;
            border: none;
            th {
                width: 30%;
            }
            tr, td, th {
                background: none;
                //border: none;
            }
            th {
                padding-left: 0px;
            }
            td {
                text-align: right;
            }
        }
    }
}


// Login form
.woocommerce-page {

    .woocommerce-form-login {
        max-width: 500px;
        margin: 1em auto;
        .form-row {
            width: 100%;
            float: none;
            .button {
                width: 100%;
                text-align: center;
                display: block;
            }
        }

        .woocommerce-form__label-for-checkbox {
            display: inline-block;
            margin-top: 12px;
            input[type="checkbox"] {
                position: relative;
                margin-top: -1px;
            }
        }
        .lost_password {
            float: right;
            margin: -37px 0px 0px;
        }
    }

    // Coupon Form
    .actions {
        .button[type="submit"] {
            float: right;
        }
        .coupon {
            float: left;
            width: 50%;
        }
    }
    .woocommerce-form-coupon {
        max-width: 500px;
        margin: 2em auto;
    }
    .input-group-text-button, .coupon {
        position: relative;
        min-width: 50%;
        label {
            display: none;
        }
        .input-text {
            padding-right: 3em;
            width: 100%;
        }
        .button {
            position: absolute;
            top: 0px;
            right: 0px;
            width: 3em;
            height: 2.6em;
            overflow: hidden;
            display: block;
            background: transparent;
            border-color: transparent;
            &:hover {
                box-shadow: none;
                &:before {
                    color: #252525;
                }
            }
            &:before {
                font-family: "WooCommerce";
                content: "\e008";
                color: #CCCCCC;
                font-size: 17px;
                margin-right: 2em;
            }
        }
    }
}

.later-wc-version {
	.woocommerce-form-login {
		.lost_password {
			float: none;
			clear: both;
			text-align:right;
			margin-top: 0;
			padding: 0 3px;
		}
		.woocommerce-form-login__rememberme{
			margin-top: 5px;
			margin-bottom: 15px;
		}
	}
}
// Checkout Review Order Box.
.woocommerce-checkout-review-order {

    table {
        &.shop_table {
            tr, td, th {
                //border: none;
                padding-left: 0px;
            }

            tr {
                &.cart-subtotal td,
                .product-total {
                    text-align: right;
                }

            }

            tbody {
                tr {
                    .product-name {
                        width: 180px;
                    }
                    td {
                        border-top: 1px solid $color_border;
                    }
                    &:last-of-type td {
                        border-bottom: 1px solid $color_border;
                    }
                }
            }
            tfoot {
                tr {
                    &.shipping {
                         p {
                             margin-bottom: 0px;
                         }
                    }
                }
                tr:last-of-type {
                    th,td {
                        //border-bottom: 2px solid $color_border;
                    }
                }
                .order-total .amount {
                    font-size: 1.5em;
                }
            }
        }
    }
    #place_order {
        display: block;
        width: 100%;
    }
}