.reference {
    border:1px solid red;
}

.recap-jampoints {
    font-size:.8em;
    text-align: right;
    padding:10px 0;
}

.cart-table-wrap {
    background-color: #FFF;
    /*
    padding:0 20px;
        padding-left:0;
        padding-right:0;
    */
}

.cart-table-row {
    width: 100%;
    margin: 0 auto;
    display: grid;
    border-bottom: 1px solid rgb(224,224,224);;
}
.cart-table-header {
    background-color: rgb(224,224,224);
}
.cart-table-header .cart-table-row {
    padding-bottom: 0;
    border-bottom: none;
}
.cart-table-header .label {
    display: inline-block;
    padding:20px 0;
    color: #000;
}

.cart-table-product-header,
.cart-table-price-header,
.cart-table-qty-header,
.cart-table-total-header {
    grid-row: 1 / span 2;
}

.cart-table-image,
.cart-table-name,
.cart-table-price,
.cart-table-qty,
.cart-table-total {
    grid-row: 1 / span 1;
    align-self: center; /* allineamento verticale */
}

.cart-table-product-header {
    grid-column: 1 / span 2;
    padding-left: 40px;
}

.cart-table-image {
    grid-column: 1 / span 1;
    /* background-color: lightgreen; *//* DEBUG COLOR */
}
.cart-table-image img {
    aspect-ratio: 1179 / 892; /* 20250303 per evitare collasso se non trova immagine */
    width: 100%;
}

.cart-table-name {
    grid-column: 2 / span 1;
    /* background-color: lightgreen; *//* DEBUG COLOR */
}
.product-name {
    font-size:2.4rem;
    font-weight:900;
    display: block;        
}
.cart-remove {
    font-size:80%;
    color:#000;
    text-decoration-line: underline;
}

.cart-table-price-header,
.cart-table-price {
    grid-column: 3 / span 2;
    justify-self: center; /* allineamento orizzontale */
}
.cart-table-qty-header,
.cart-table-qty {
    grid-column: 5 / span 2;
}
.cart-table-qty {
    /* background-color: lightgreen; *//* DEBUG COLOR */
}
.cart-table-total-header,
.cart-table-total {
    grid-column: 7 / span 1;
    justify-self: end; /* allineamento orizzontale */
    padding-right:40px;
}

.cart-table-price,
.cart-table-total {
    font-size: 1.8rem; /* .85em; */ /* 85%; */
    font-weight:500;
    white-space: nowrap;
    /* background-color: lightgreen; *//* DEBUG COLOR */
}

.cart-table-payment-method {
    grid-column: 2 / span 6;
    grid-row: 2 / span 1;
    align-self: center;    
    /* background-color: lightgreen; *//* DEBUG COLOR */
}
.cart-table-coupon {
    grid-column: 2 / span 6;
    grid-row: 3 / span 1;
    align-self: center;
    /* background-color: lightgreen; *//* DEBUG COLOR */
}

.cart-table-checkout .cart-table-row {
    border-bottom: none;
}
.cart-table-checkout-notes {
    grid-column: 1 / span 2;
    grid-row: 1 / span 1;
    align-self: start; /* allineamento vericale */
    justify-self: start; /* allineamento orizzontale */
    /* background-color: lightgreen; */ /* DEBUG COLOR */
}
.cart-table-checkout-notes > span {
    display:block;
    padding-top: 10px;
    padding-left: 40px; /* 40px 0 40px 40px; */
    font-size: 1.6rem;
    line-height: 1.2em;
    font-weight: 500;
}

.cart-table-checkout-sum-recap {
    /* grid-column: 4 / span 4; */
    grid-column: 3 / span 5;
    grid-row: 1 / span 1;
    align-self: start; /* allineamento vericale */
    justify-self: end; /* allineamento orizzontale */
    /* background-color: lightgreen; */ /* DEBUG COLOR */
}

.table-recap {
    display: grid;
    grid-template-columns: 2fr 1fr; /* -------------------- COLUMN DEFINITION -------------------- */
    grid-template-rows: auto;

    column-gap: 1vw; /* minmax(10px,1vw); */
    row-gap:16px;
    padding-top:    10px;
    padding-bottom: 20px;

}
.table-recap > div {
    text-align:right;
}
.table-recap > div:nth-child(odd) {
    padding-right: 10px;
}
.table-recap > div:nth-child(even) {
    padding-right: 40px;
}
.price-total {
    font-weight: 900;   
}

.total-due-label,
.total-due-value {
    font-size:140%;
    font-weight: 900;   
    align-self: center; /* start; */ /* end; */ /* allineamento vericale */
}
.currency {
    white-space: nowrap;
}

.checkout-btn-row {
    grid-column: 1 / span 2;
    margin-top:10px;
}

.table-recap > div:nth-child(odd) {}
.table-recap > div.checkout-btn-row {
    padding-right:40px;
}



.area-container {
    padding:0 10px 20px;
}

.cart-table-jam-promo-value {
    font-size:1.8rem; /* 20250325 */
}
.cart-table-jam-promo-value .value { /* 20250325 */
    white-space: nowrap;
}


@media screen and (max-width:1199px) { /* ------- NOTEPAD - tight column ------- */            

    /* ------------------------------------------------------- PAYMENT SCHEDULE ------------------------------------------------------- */

    .payment-schedule {
        margin:20px;
        padding-bottom:40px;
    }

    .payment-schedule-table.split-8 .payment-schedule-table-row {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        /* gap: 1vw 1vh ; */
        column-gap: 1vw;
        row-gap: 1vw;
        align-items: end; /* start | end | center | stretch; */
        padding: 10px 0;
    }
    .payment-schedule-table-header {
        display:none;
    }
    .payment-schedule-table-name {
        grid-column: 1 / span 4;
        margin-top:30px;
        border-bottom: 1px solid rgb(224,224,224);
    }
    .payment-schedule .payment-schedule-table-body .label {
        display: block; /* block; */ /* visible below 768 ?  */
        color:#000;
        text-align: left;
        padding: 10px 0 5px 0;
    }    

} /* END max-width 1199 */

@media screen and (max-width:991px) { /* ------- NOTEPAD - tight column ------- */            

    .cart-bottom-area-form-elements .span1.span2mobile {
        grid-column: 1 / span 2;
    }

} /* END max-width 991 */


@media screen and (max-width:767px) { /* ------- MOBILE ------- */

    .recap-jampoints {
        text-align: center;
    }

    .cart-table-row {
        /* -------------------- COLUMN DEFINITION -------------------- */
        /*
        grid-template-columns: repeat(3, 1fr); 
        grid-template-rows: auto;

        column-gap:1vw;
        row-gap:1vh;
        */
        padding-bottom: 40px;
    }
    .cart-table-header {
        display:none;
    }
    .cart-table-image {
        grid-row: 1 / span 1;
        grid-column: 1 / span 3;
    }
    .cart-table-name {
        grid-row: 2 / span 1;
        grid-column: 1 / span 3;
        text-align: center;
        padding-bottom: 20px;
        /* background-color: lightgreen; *//* DEBUG COLOR */
    }
    .cart-table-price {
        grid-row: 3 / span 1;
        grid-column: 1 / span 1;
        justify-self: start; /* allineam. orizz. */ 
        padding-left:30px;
        align-self: start; /* allineam. verticale */ 
    }
    .cart-table-price::before {
        content:'PRICE';
        text-align: left;
    }

    .cart-table-qty {
        grid-row: 3 / span 1;
        grid-column: 2 / span 1;
        justify-self: center; /* allineam. orizz. */ 
        align-self: start; /* allineam. verticale */ 
        text-align: center;
    }
    .cart-table-qty::before {
        content:'QUANTITY';
        text-align: center;
    }

    .cart-table-total {
        grid-row: 3 / span 1;
        grid-column: 3 / span 1;
        justify-self: end; /* allineam. orizz. */ 
        padding-right:30px;
        align-self: start; /* allineam. verticale */ 
    }
    .cart-table-total::before {
        content:'TOTAL';
        text-align: right;
    }

    .cart-table-price::before,
    .cart-table-qty::before,
    .cart-table-total::before {
        display:block;
        font-size: small;
        font-weight: bold;
    }

    .cart-table-price,
    .cart-table-total {
        /* font-size: 1.6rem; */
    }    

    .cart-table-payment-method {
        grid-row: 4 / span 1;
        grid-column: 1 / span 3;
        justify-self: center; /* allineam. orizz. */ 
        text-align: center;
        padding-top: 20px;
        /* background-color: lightgreen; *//* DEBUG COLOR */
    }
    .p-method-control {
        margin-top: 10px;
    }
    .cart-table-payment-method .btn-p-method {
        /* transform: scale(0.9); */
        font-size: 12px;
        padding:0 10px;                
    }
    .cart-table-coupon {
        grid-row: 5 / span 1;
        grid-column: 1 / span 3;
        justify-self: start; /* center; 20250325 1829 */ /* allineam. orizz. */ 
        padding-left: 30px; /* 20250325 1829 */
        padding-top: 40px; /* 20250325 1829 */
        /* background-color: lightgreen; *//* DEBUG COLOR */
    }
    .cart-table-coupon .coupon-dovetail-right,
    .cart-table-coupon .custom-form-element {
        /* transform: scale(0.9); */
    }


    
    /* ---- JAM-PROMO ---- */   

    .cart-table-jam-promo .cart-table-row {
        /* -------------------- COLUMN DEFINITION -------------------- */
        /*
        grid-template-columns: 6fr 5fr; 
        grid-template-rows: auto;
        row-gap:4px;
        column-gap:10px;
        */
        padding: 15px 0 20px 0;
        justify-items: stretch;
    }
    
    /* 20250325 - default - mobile up to 767px */
    .cart-table-jam-promo-label {
        grid-column: 1 / span 1; /* 1 / span 2; */
        grid-row: 1 / span 1;
        padding-left: 30px; /* 0; 20250325 1836 */
        padding-right: 0; 
        justify-self: stretch; /* center; */ /* allineamento orizzontale */
    }
    .cart-table-jam-promo-label .code-label {                
    }

    .cart-table-jam-promo-code {
        grid-column: 2 / span 1; /* 1 / span 1; */
        grid-row: 1 / span 1; /* 2 / span 1; */
        justify-self: stretch; /* allineamento orizzontale */
        align-self: center; /* allineam. verticale */ 
        padding-right:20px; /* padding-left:20px; */ /* 4vw; */
    }

    .cart-table-jam-promo-label { /* 20250325 1715 */
        width:35vw;
    }

    .cart-table-jam-promo .cart-table-button {
        grid-column: 2 / span 1;
        grid-row: 2 / span 1;
        /* justify-self: start; */ /* allineamento orizzontale */
        justify-self: stretch; /* allineamento orizzontale */
        padding-right:20px; /* 4vw; */
    }
    
    .cart-table-jam-promo-code .cart-form-element.input-code,
    .cart-table-jam-promo-code .cart-form-element.input-code input[type="text"]  { /* 20250325 */
        text-align:center;
    }

    .cart-table-jam-promo-value {
        grid-column: 1 / span 2; /* 20250325 1 / span 1;  */
        grid-row: 3 / span 1;  /* 20250325 2 / span 1;  */
        justify-self: end; /* end; */ /* allineamento orizzontale */
        align-self: center; /* allineam. verticale */ 
        padding-right:20px; /* 20250325 */
    }

    .cart-table-jam-promo input[type="text"] {
        /* width: calc( 100vw - calc (padding destro di col dx e sinistro di col sx + margini del container esteno + larghezza del bottone + gap ); */
        /* width: calc( 100vw - calc(8vw + 30px + 130px + 20px) ); */
        /* 20250325
            width: calc( 100vw - calc(40px + 30px + 130px + 20px) );
            max-width: 98%;
        */
        width:100%;
    }
    .cart-table-jam-promo .btns-toggle {
        width:100%;
        text-align:right;
        /* background-color: bisque; */
    }
    .cart-table-jam-promo .btn { /* 20250325 */
        width:100%;
    }

    /* ---- CHECKOUT ---- */   

    
    .cart-table-checkout .cart-table-row {
        grid-template-columns: repeat(3, 1fr); /* -------------------- COLUMN DEFINITION -------------------- */
        grid-template-rows: auto;                                
    }
    
    .cart-table-checkout-sum-recap {
        grid-column: 1 / span 3;
        grid-row: 1 / span 1;
        align-self: start;
        justify-self: end;
        /* background-color: lightgreen; */
        width:100%;
    }
    
    .cart-table-checkout-notes {
        grid-column: 1 / span 3;
        grid-row: 2 / span 1;
        align-self: center; /* allineamento vericale */
        justify-self: center; /* allineamento orizzontale */
        /* background-color: lightgreen; */ /* DEBUG COLOR */
    }
    .cart-table-checkout-notes > span {
        padding:20px 20px 0;
    }
    
    .table-recap > div.checkout-btn-row {
        padding:0 40px;
        /* align-self: center; */ /* allineamento vericale */
        /* justify-self: center; */ /* allineamento orizzontale */

    }

    /* ------------------------------------------------------- CART BOTTOM ------------------------------------------------------- */
    .cart-bottom {
        display: block;
        /* 
        grid-template-columns: repeat(3, 1fr);
        gap: 50px;
        */
    }
    .cart-bottom-area {
        margin-bottom:50px;
    }

    .cart-bottom-area-form-elements .span1.span2mobile {
        grid-column: 1 / span 2;
    }



    .table-recap > div:nth-child(even) {
        padding-right: 20px;
    }
    .area-container {
        padding:0 20px 20px;
    }

    .padding-right-paypal {
        /* background-color: aquamarine; */
        grid-column: 1 / span 2;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    
} /* END max-width 767 */

    .cart-form-element.input-code input.promocode-value { /* 20250325 1824 */
        border-color:transparent;
        overflow-x: hidden;
        text-overflow: ellipsis;
    }
@media screen and (max-width:499px) {
    .table-recap > div.checkout-btn-row {
        align-self: center; /* allineamento vericale */
        justify-self: center; /* allineamento orizzontale */
        text-align: center;
    }
} /* END max-width 499 */

@media screen and (min-width:768px) { 

    .padding-right-paypal {
        /* background-color: lightgreen; */
        grid-column: 1 / span 2;
        padding-right: 40px !important;
    }

    .cart-table-row {
        /* grid-template-columns: 180px repeat(6, 1fr); */ /* -------------------- COLUMN DEFINITION -------------------- */
        /* grid-template-columns: 180px 180px repeat(5, 1fr); */ /* -------------------- COLUMN DEFINITION -------------------- */
        /* grid-template-columns: 180px 180px repeat(4, 2fr) 4fr; */ /* -------------------- COLUMN DEFINITION -------------------- */
        grid-template-columns: 180px 180px 2fr 1fr 1fr 1fr 3fr; /* */ /* -------------------- COLUMN DEFINITION -------------------- */
        grid-template-rows: auto; /* repeat(2, 1fr); */ /* 100px */
        /* grid-auto-rows: minmax(100px, auto); */

        column-gap:20px; /* 1vw; */
        row-gap:4px; /* 1vh; */
        padding-top:    10px;
        padding-bottom: 20px;
    }
    .cart-table-header .cart-table-row {
        padding-top:    0;
    }

    /* CART TABLE JAM-PROMO */

    .cart-table-jam-promo .cart-table-row {
        padding-bottom: 10px;
    }

    .cart-table-jam-promo .cart-table-row > div {
        align-self: center; /* allineamento vericale */
    }

    .cart-table-jam-promo-label {
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        padding-left: 40px; 
    }
    .cart-table-jam-promo-label .code-label {                
    }

    .cart-table-jam-promo-code {
        grid-column: 2 / span 2;
        grid-row: 1 / span 1;
        justify-self: end; /* center; */ /* allineamento orizzontale */
    }


    .cart-table-jam-promo .cart-table-button {
        grid-column: 4 / span 2;
        grid-row: 1 / span 1;
    }
    .cart-table-jam-promo .cart-table-button .btn {
        display: inline-block;
        min-width:120px;
        text-align: center;
    }

    .cart-table-jam-promo-value {
        grid-column: 7 / span 1;
        justify-self: end; /* allineamento orizzontale */
        padding-right:40px;
    }



    /* ------------------------------------------------------- CART BOTTOM ------------------------------------------------------- */
    .cart-bottom {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* repeat(3, 1fr); */
        gap: 10px;
    }
    .cart-bottom-area.area-payment {
        grid-column: 1 / span 2;
    }
    .cart-bottom-area.checkout-button {
        grid-column: 1 / span 2;
    }
    





} /* END min-width 768 */

@media screen and (min-width:992px) {

    /* ------------------------------------------------------- CART BOTTOM ------------------------------------------------------- */
    .cart-bottom {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
    .cart-bottom-area.area-payment {
        grid-column: 3 / span 1;
    }
    .cart-bottom-area.checkout-button {
        grid-column: 2 / span 1;
    }

} /* END min-width 992 */

@media screen and (min-width:1200px) {

    /* ------------------------------------------------------- PAYMENT SCHEDULE ------------------------------------------------------- */
    .payment-schedule {
        margin:40px;
        padding-bottom:40px;
    }
    .payment-schedule .payment-schedule-table-body .label {
        display:none; /* hidden in DESKTOP */
    }

    .payment-schedule-table.split-8 .payment-schedule-table-row {
        display: grid;
        grid-template-columns: 2fr repeat(8, 1fr);
        /* gap: 1vw 1vh ; */
        column-gap: 10px;
        row-gap: 10px;
        align-items: end; /* start | end | center | stretch; */
        padding: 10px 0;
    }
    .payment-schedule-table.split-8 .payment-schedule-table-header .payment-schedule-table-row {
        align-items: center; /* start | end | center | stretch; */
    }
    .payment-schedule-table .product-name {
        font-size: 1.8rem;
        font-weight: 500;
    }

}

@media screen and (min-width:1320px) {
    .cart-table-payment-method {
        grid-column: 2 / span 3;
        grid-row: 2 / span 1;
        align-self: center;    
        /* background-color: lightgreen; *//* DEBUG COLOR */
    }
    .cart-table-coupon {
        grid-column: 5 / span 3;
        grid-row: 2 / span 1;
        align-self: center;
        /* background-color: lightgreen; *//* DEBUG COLOR */
    }

    .cart-table-jam-promo .cart-table-button {
        grid-column: 5 / span 1;
        grid-row: 1 / span 1;
        /* align-self: start; */
    }

    /* ------------------------------------------------------- CART BOTTOM ------------------------------------------------------- */
    .cart-bottom {
        gap: 50px;
    }       
    
    .cart-table-cell:last-child:not(.cart-table-total) { /* 20250304 annullo spaziatura quando cupon e payment methods non si incolonnano */
        margin-top:unset;
    }

} /* END min-width 1320 */








.cart-bottom-area h4,
.code-label {
    color: #000;
    font-size: 1.8rem;
    font-weight: 800;
    text-align: left;
    text-transform: uppercase;
}

.p-method-label {
    display:inline-block;
    margin-right:10px;
    /*
    height: 30px;
    vertical-align: middle;
    */
    color:#000;
    font-size:1.8rem;
    font-weight: 800;
    text-align: left;
    text-transform: uppercase;
}
.p-method-control {
    display:inline-block;
}
.p-method-control a:hover {
    color: #000;
}
.p-method-control a.selected:hover {
    color: #FFF;
}
.btn-p-method {
    display:inline-block;
    padding:0 14px; /* 20px; */
    font-family: var(--ikv3-font-label);
    font-size: 14px;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
    border:1px solid #000;
    color:#000;
}
.btn-p-method.selected {
    background-color: #000;
    color:#FFF;
}







.cart-bottom-area {
    background-color: #FFF;
}

.cart-bottom-area h3 {        
    text-align:center;
    text-transform: uppercase;
    padding:30px 0;   
    margin: 0;     
}



.cart-bottom-area-form-elements {
    display:grid;
    grid-template-columns: 1fr 1fr; /* -------------------- COLUMN DEFINITION -------------------- */
    grid-template-rows: auto;

    column-gap: 10px; /* minmax(10px,1vw); */
    row-gap:    10px;
    padding:    0;
    padding-bottom: 20px;

}

.cart-bottom-area-form-elements .span1 {
}
.cart-bottom-area-form-elements .span2 {
    grid-column: 1 / span 2;
}
.cart-bottom-area-form-elements .form-group {
    position:relative;
    padding:0;
    margin:0;
}
.cart-bottom-area-form-elements .form-group label {
    position:absolute;
    top:5px;
    left:5px;
    font-size: 14px; /* small; */
    line-height: 14px; /* small; */
    font-weight: 500;
    color: gray;
    /* background-color: lightgreen; *//* DEBUG COLOR */
}
.cart-bottom-area-form-elements .form-group select,
.cart-bottom-area-form-elements .form-group input[type="text"] {
    padding:18px 5px 5px;
    width: 100%;
    -webkit-appearance: none; /* fix Safari appearance */
}

.cart-form-element .form-select {
    min-width:3em;
    font-size: 85%;
    font-weight: 500;
    text-align:center;        
}

.cart-bottom-area-form-elements select,
.cart-bottom-area-form-elements input[type="text"],
.cart-form-element.input-code input {
    border-style: none;
    border-top-style: none;
    border-left-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border: 1px solid rgb(224, 224, 224);
    background-color: #FFF;
}

.cart-bottom-area-form-elements input[type="text"] {
    margin:0;
}


.small-font {
    font-size:1.5rem;
    line-height:1.2em;
}

/* .custom-form-element label.no-margin, */
.no-margin {
    margin:0 !important;
}
.no-margin-v {
    margin-top:0 !important;
    margin-bottom:0 !important;
}
.no-margin-h {
    margin-left:0 !important;
    margin-right:0 !important;
}
.custom-form-element:not(.coupon-control) label:first-child {
    margin-top:0;
}


.custom-form-element .checkbox-form-control input[type="radio"] {
    border-radius: 100% !important;
}
.cart-bottom-area .custom-form-element .checkbox-form-control input[type="radio"] {
    width: 20px;
    height: 20px;
    left: 10px;
}
.cart-bottom-area .custom-form-element .checkbox-form-control input[type="radio"]::before {
    content: "";
    width: 20px;
    height: 20px;
}
.cart-bottom-area .custom-form-element .checkbox-form-control input[type="radio"]::before {
    background-image: url('../svg/ik_icon_radio_black.svg');
}

.ik-icon,
.ups-icon {
    display: inline-block;
    background-position: center left;
    background-repeat: no-repeat;
    background-size: 24px;
    padding-left:35px;
}
.ik-icon {
    background-image: url('../svg/ik_logo_2022_red_rgb.svg');
}
.ups-icon {
    background-image: url('../png/ups-icon.png');
}

.braintree-module {

    width:90%;
    height:400px;
    background-color: lightgray;

    text-align: center;
    margin:10px auto;

}


.cart-bottom-area.checkout-button {
    align-self: center; /* allineamento vericale */
    justify-self: stretch; /* center; */ /* allineamento orizzontale */
}

.cart-bottom-area.checkout-button a.btn {
    display: block;
    width:100%;
}


/* ------------------------------------------------------- PAYMENT SCHEDULE ------------------------------------------------------- */


.payment-schedule .label { 
    display: inline-block;
    padding: 10px 0;
    color:#000;
    text-align: left;
    line-height: 1.4em;
}
.payment-schedule-table-header {
    font-family: var(--ikv3-font-label);   
    border-bottom: 1px solid rgb(224,224,224);
}


.payment-date {
    display: block;
    white-space: nowrap;
}


.form-shipping-method {
    margin-bottom: 20px;
}

.cart-table input[type="text"] {
    margin-top:0;
    margin-bottom:0;
}


/* ------------------------------------------------------- GEAR CREDITS ------------------------------------------------------- */

.use-gear-credits {
    font-family: var(--ikv3-font-label);
    font-size: 1.4rem;
    font-weight: 900;
    text-transform: uppercase;
}
.use-gear-credits a {
    text-decoration: underline;
    color: #000;
}
