/*CART*/

/*---------------------------------------------PROGRESS BAR-------------*/

.cei-theme {

    .order-progress {
        margin: 0 0 20px;
        background-color: var(--color--light-grey);
        text-align: center;
    }

    .order-progress a {
        display: block;
        min-width: 60px;
        font-size: 13px;
        color: var(--color--charcoal);
    }

    .order-progress li.active-step a:before {
        border-color: var(--color--charcoal);
        background-image: url(/images/CEI_Images/order-progress-2.png);
    }

    .order-progress a:before {
        content: "";
        display: block;
        width: 36px;
        height: 36px;
        margin: 0 auto 10px;
        border: 2px solid transparent;
        background: var(--color--white) url(/images/CEI_Images/order-progress-1.png) center no-repeat;
    }

    .order-progress li.current-step a:before {
        border-color: var(--color--light-red);
        background-image: url(/images/CEI_Images/order-progress-red.png);
    }

    .order-progress li {
        display: inline-block;
        margin: 10px 0;
    }

    @media all and (min-width:1025px) {
        
        .order-progress li {
            margin: 10px;
        }

    }

    /*------------------------------------------------DISCOUNTS AND SOCIAL-------------------------*/

    .cart-collaterals .deals {
        margin: 0;
        background-color: var(--color--white);
        padding: 7px 15px;
        border: 1px solid var(--color--medium-grey);
    }

    .cart-collaterals .coupon-code input[type="submit"] {
        float: left;
        width: 36%;
        height: 30px;
        border: none;
        background-color: var(--color--dark-grey);
        padding: 0;
        color: var(--color--white);
    }

    /*---------------------------------------------SELECT SHIPPING-------------*/

    .method-list__items {
        display:flex;
        flex-flow: column nowrap;
        justify-content: space-between;
        gap: 25px;
    }

    .method-list__item--methods {
        flex: 1 2 auto;
    }

    .method-list__item--message {
        flex: 1 2 60%;
        border-top: 1px solid var(--color--medium-grey);
    }



    .method-list__item--message li {
        list-style:disc;
    }

    .method-list__items a {
        color: var(--color--light-red);
        text-decoration: underline;
        font-weight: bold;
    }

    .method-list__items a:hover {
        color: var(--color--charcoal);
    }

    .method-list__item--map  {
        width:100%;
    }

    .method-list__item--map h2 {
        text-align: center;
    }

    .method-list__item--map img {
        display:block;
        width:100%;
    }
    .method-list__item--map p {
        padding: 5px;
        text-align: center;
    }

    @media all and (min-width:1025px) {
        .method-list__items {
            flex-flow: row nowrap;
            
        }

        .method-list__item--map {
            flex: 1 2 100%;
        }

        .method-list__item--map h2 {
            text-align: left;
        }

        .shipping-page.method-list__item--map h2 {
            text-align: center;
        }

        .shipping-returns-page.method-list__item--map p {
            text-align: left;
        }

        .method-list__item--map img {
            display:block;
            width:100%;
        }
    }

    /*--------------------------------------------------------------------------------------------------------*/

    .checkout-thankyou__message {
        margin-bottom:25px;
    }

    .order-confirm-page .order-review-data > ul > .title {
        margin: 0 0 5px;
        font: 18px 'eurostile';
        text-align: left;
        color: var(--color--charcoal);
    }

    .order-review-data .country, .shipment-overview .country, .order-details-area .country {
        margin-top: 5px;
        font-weight: normal;
    }

    .checkout-page .address-item li.name {
        margin: 0 0 5px;
        font-size: 16px;
    }

    .checkout-page .address-item li.country {
        margin: 5px 0 0;
        font-size: 16px;
        color: var(--color--charcoal);
    }

    .order-review-data .name, .shipment-overview .name, .order-details-area .name {
        margin-bottom: 5px;
        font-weight: normal;
    }

    /*---------------------------------------------CARD ENTRY--------------------------------------------------------------------*/


    .card-entry__items {
        display:flex;
        flex-flow: column nowrap;
        justify-content: space-between;
        gap: 0;
    }

    .card-entry__label {
        text-align: center;
        margin-bottom: 5px;
        font-size:16px;
    }

    .card-entry__field, .card-entry__field-code {
        text-align: center;
        margin-bottom: 10px;
    }

    .card-entry__field input[type="text"] {
        width: 100%;
    }

    .card-entry__field select {
        width: 50%;
    }

    .card-entry__field-code input[type="text"] {
        width: 25%;
    }

    .payment-info table {
        width: 50%;
        
    }

    .payment-info .info {
        margin: 0 15px 20px;
        border: 1px solid var(--color--medium-grey);
        padding: 25px;
        text-align: left;
        font-size: 13px;
    }

    .payment-info table input[type="text"], select {
        /*margin-bottom: 10px;*/
    }

    .payment-info table td {
        margin-right: 5px;
    }

    @media all and (min-width:1025px) {
        .card-entry__label, .card-entry__field, .card-entry__field-code {
            text-align:left;
        }

        .card-entry__field input[type="text"] {
            width: 50%;
        }
        
        .card-entry__field select {
            width: 20%;
        }

        .card-entry__field-code input[type="text"] {
            width: 15%;
        }
    }

    .update-wishlist-button.btnSec {
        margin-right: 25px;
    }

    /*--------------------------------------------------------------------------------CONFIRMATION PAGE---*/

    .confirm-order .message-error {
        margin-top: 25px;
    }

    .order-completed__rate-expereince {
        margin-bottom: 25px;
    }

    /*--------------------------------------------------------------------------------MODAL-------*/

    /* Style the Image Used to Trigger the Modal */
    #myImg {
        border-radius: 5px;
        cursor: pointer;
        transition: 0.3s;
        margin: 0 auto;
    }
    
    #myImg:hover {opacity: 0.7;}
    
    /* The Modal (background) */
    .modal {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 20000; /* Sit on top */
        padding-top: 100px; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
    }
    
    /* Modal Content (Image) */
    .modal-content {
        margin: auto;
        display: block;
        width: 80%;
        max-width: 1000px;
    }
    
    /* Caption of Modal Image (Image Text) - Same Width as the Image */
    #caption {
        margin: auto;
        display: block;
        width: 80%;
        max-width: 1000px;
        text-align: center;
        color: var(--color--medium-grey);
        padding: 10px 0;
        height: 150px;
    }
    
    /* Add Animation - Zoom in the Modal */
    .modal-content, #caption {
        animation-name: zoom;
        animation-duration: 0.6s;
    }
    
    @keyframes zoom {
        from {transform:scale(0)}
        to {transform:scale(1)}
    }
    
    /* The Close Button */
    .modal-close {
        position: absolute;
        top: 15px;
        right: 35px;
        color: #f1f1f1;
        font-size: 40px;
        font-weight: bold;
        transition: 0.3s;
    }
    
    .modal-close:hover,
    .modal-close:focus {
        color: #bbb;
        text-decoration: none;
        cursor: pointer;
    }
    
    /* 100% Image Width on Smaller Screens */
    @media only screen and (max-width: 480px){
        .modal-content {
        width: 100%;
        }
    }

    @media all and (min-width:1025px) {
        #myImg {
            margin: 0;
        }
    }

    /*-----------ESTIMATE SHIPPING BUTTON OVERRIDES SPECIFICITY ISSUES---------*/

    .shopping-cart-page .common-buttons a {
        text-align: center;
        font-size: 16px;
        font-weight: bold;
        text-decoration: none !important;
        color: var(--color--charcoal) !important;
        background-color: var(--color--white) !important;
        padding: 15px;
        border: 1px solid var(--color--dark-grey) !important;
        position: relative;
        display: inline-block;
        font-family: Roboto, Arial, sans-serif;
    }

    .mfp-container .shipping-option {
        display: table-row;
        font-size: 13px;
        cursor:inherit;
    }

    .mfp-container .shipping-option.active {
        font-weight: normal;
        color: inherit;
    }


    .shopping-cart-page .common-buttons {
        display:flex;
        flex-flow: column nowrap;
        justify-content:space-between;
        align-content: space-between;
        gap:15px;
        margin-top: 50px;
    }

    .cart-button__update-cart {
        align-self: center;
    }
    .cart-button__container--continue-shopping-estimate-shipping {
        display:flex;
        flex-flow:column;
        gap:15px;
    }

    .cart-button__container--continue-shopping-estimate-shipping div {
        align-self: center;
    }

    @media (min-width: 1025px) {
        .shopping-cart-page .common-buttons {
            float: none;
        }
        .shopping-cart-page .common-buttons input, .shopping-cart-page .common-buttons a {
            margin: 0;
        }
        .cart-button__update-cart {
            align-self: flex-start;
        }
        .cart-button__update-cart {
            align-self: flex-start;
        }
        .cart-button__container--continue-shopping-estimate-shipping {
            display:flex;
            flex-flow:row;
            gap:15px;
        }
        .shopping-cart-page .common-buttons {
            display:flex;
            flex-flow: row nowrap;
            justify-content:space-between;
            margin-bottom: 25px;
            margin-top: 0;
        }
        .cart-button__container--continue-shopping-estimate-shipping div {
            align-self: flex-end;
        }
    }

}