OwlCyberSecurity - MANAGER

Edit File: _cart.scss

/*----------------------------------------*\
    $CART PAGE
\*----------------------------------------*/

.woocommerce-page{

/* Products table */
    .woocommerce table.shop_table{
        border: 0;
        border-collapse: separate;

tr {

}

th, td {
            padding-right: 0;
            padding-left: 0;
            border-top:0px;
            border-bottom: 1px dotted $lightest;
            border-left: 1px solid transparent;
            border-right: 1px solid transparent; 
        }

td {
            padding:12px 0;
        }

th{
            @include font-size(16px);
            font-style: italic;
            font-weight: normal ;
        }

.product-thumbnail{
            padding-left: 0;
            width: 96px;
            img {
                width: 62px;
                display:block;
            }
        }

.product-name{
            text-align: left;
            padding-left: 0 ;
        }

.product-subtotal, .product-quantity{
            text-align: right;
            min-width: 85px;
        }

.product-subtotal {
            width:24%;
        }

.product-quantity {
            width: 15%;
        }

.quantity{
            margin-right: 0;
        }

.product-remove{
            // width: 45px;

a {
                font-family: Arial;
                font-size:16px;
                text-align: right;
                width: 100%;
                padding:16px 12px 30px;
                opacity:0.7;

&:hover {
                    opacity:1;
                }
            }

@include media-query(lap-and-up) {
                width: 78px;
            }
        }

.input-text {
            text-align:center;
            width:56px;
        }

dl.variation{
            dt, dd{
                float: none;
                display: inline-block;
            }
        }

}

.product-name a,
    .amount, 
    .from{
            text-decoration: none;  
            color: $dark;      
            font-weight: bold;
    }

.price ins{
        border-bottom: 0;
    }

&.single-product .page-content .amount{
        font-family: "Josefin Slab", serif;
        @include font-size(26px);
    }

.product__price .amount{
        font-family: "Open Sans", sans-serif;
        @include font-size(16px);
    }

.woocommerce table.cart input[type="submit"]{
        line-height: 3;
    }
    
    .woocommerce table.cart a.remove{
        color: $gray ;

&:hover{
            background: transparent ;
            color: $dark ;
        }
    }

/* Cart Totals */

.woocommerce table.shop_table /*tr*/.cart-totals {

& {

}

&, td { 
            text-align:right;
            padding-top:12px;
            padding-bottom:12px;
        }

td.spacer {
            border-bottom:1px solid transparent;
        }

//Cart Subtotal
        &.cart-subtotal {

}

&.shipping {
        }

&.total-row {
            td {
                 padding:24px 0;
                 border-bottom: 1px dotted #b2b1b2;
                 &.spacer {
                    border:none;
                 }
            }
        }

input[type="radio"] {
            float:right;
            margin-right:-24px;
        }
    }

/* Cart Buttons */
    .woocommerce table.shop_table /*tr*/.cart-buttons {
        td {
            border:none;
        }
    }

/* Cart Totals2 */
    .cart_totals2{

td, th{
            border: 0 !important;
            width: 50%;
        }

.total-row{
            border-top: 1px dotted $dark;
            border-bottom: 1px dotted $dark;
        }

.spacer{
            width: 45px;
        }

td, th{
            text-align: right;
        }

}

/* Shipping Calculator */
    .shipping_calculator {

}

.light{
        font-family: "Open Sans", sans-serif;
        font-size: 13px ;
        font-weight: normal;
        color:#807f7d;
        text-transform: uppercase;
        text-decoration: none;
    }

.strong{
        font-family: "Josefin Slab", serif ;
        font-weight: bold ;
        font-size: 20px ;
        text-transform: uppercase;
        color: $dark;
        padding-top: 24px ;
        padding-bottom: 24px ;

.amount{
            font-size: 30px ;
        }
    }
}

/*----------------------------------------*\
    $CART WIDGET
\*----------------------------------------*/
.cart--widget {
    // position: relative;

.cart__btn{
        // color:white;
        // // cursor: pointer;
        // background:rgba(0,0,0,0.8);
        // width:100%;
        // text-align:center;
        // @include rem(padding-top, $base-spacing-unit/2);
        // @include rem(padding-bottom, $base-spacing-unit/2);
        // font-family: "Roboto", sans-serif;
        // font-weight:300;

.pixcode--icon {
            position: relative;
            // text-align: center;
            // @include rem(font-size, 20px);
        }

.cart-text {
            margin:0 1em;
        }

.cart-size{
            position: absolute;
            top: 0;
            right: -10px;
            height: 15px;
            width: 14px;
            color: black;
            font-size: 9px;
            line-height: 13px;
            background-color: $accent-color;
            @include border-radius(50%);
        }

i {
            @include rotate(0deg);
        }

&.sticky-button--active{
            // background:black;
            .cart-size {
                color: black;
            }

span { 
                // color:#fff;
            }

& ul {
                // height: auto;
                // @include opacity(1);
            }
        }                        
    }

ul {
        // height: 0;
        // display: block;
        // @extend .nav;
        // @extend .nav--stacked;
        // background-color:black;
        // background-color:rgba(0,0,0,0.8); 
        // position:absolute;
        // top: 100%;
        // right:0;
        // margin-bottom:0;
        // width:100%;
        // z-index:100;
        // @include transition(all .15s linear);
        // @include opacity(0);
        // overflow: hidden;

// li:hover{
        //     background: black;
        // }
    }
    .cart-item {
        &:last-child {
            padding-bottom:12px;
        }
    }
        .cart-link{
            color: white;
            line-height:1.3;
            text-decoration: none;
            text-transform: none;

&:hover {
                color:$accent-color;
            }
        }

.cart-total {
            padding: 4px 0 2px;
            display: block;
        }

@include media(from hand) { 
        // position:fixed;
        // @include rem(bottom, 3/2*$base-spacing-unit);
        // @include rem(right, 3/2*$base-spacing-unit);
        // z-index: 300;

.cart__btn {
            // width: auto;
            // text-align:left;
            // padding-top: 0;
            // padding-bottom: 0;
            // padding-right: 0;
            // height: 38px;
        
            .widget_shopping_cart_content{
                // height: 38px;

> span{
                    // line-height: 14px;
                }  
            }

.pixcode--icon {
                // display: inline-block;
                // vertical-align: top;
                // width: 38px;
                // height: 38px;
                // padding: 0 5px;
                // margin-left: 10px;
                // margin-right: 0;
                // background: black;

.cart-size{
                    top: auto;
                    padding-top: 1px;
                    bottom: -5px;
                    right: -5px;
                }
            }
        }

ul {
            top:auto;
            @include rem(bottom, 35px);

li{
                padding-left: 1.5em;
            }
        }
    }      
}

.cart-form{
    @extend .cf;

input{
        float: right;
    }
}

.shipping_calculator{
    float: right;
}

.cart_totals {
    @include media(from hand) {
        padding-left: 50%;
    }

table{
        td, th{
            border-bottom: 1px dotted #b2b1b2;
        }
    
        th{
            font-family: $sans-serif-font-family;
            font-weight: lighter;
            @include font-size(13px);
            text-transform: uppercase;
        }

.order-total {
            th, td{
                font-family: $heading-font-family;
                font-size: 20px !important;
                font-weight: bold !important;
            }
        }
    }
}