﻿/* Hide back icon when previous button is disabled */
.rz-steps-prev.rz-state-disabled .rzi::before {
    display: none !important;
}

.rz-steps-next.rz-state-disabled .rzi::before {
    display: none !important;
}

.my-30 {margin-top: 30px; margin-bottom: 30px;}

.cart-page-banner {background-color: #F4F4F4; padding: 100px 0;}
.cart-page-banner h1 { color: #444444; font-weight: 700; font-size: 60px; line-height: normal; margin: 0 0 20px;}
.cart-page-banner p {color: #9A9A9A; font-weight: 500; font-size: 28px; margin: 0; line-height: normal;}

.cart-page-content {padding: 54px 0 39px;}
.cart-page-content * {font-family: 'Barlow', sans-serif;}
.cart-page-content .container {max-width: 1680px;}
.cart-page-content .cart-count {margin: 0 0 30px;}
.cart-page-content .cart-count h5 { font-size: 32px; font-weight: 700; color: #1C1C1C; line-height: normal; margin: 0;}
.cart-page-content .form-group {margin: 0 0 20px !important;}
.cart-page-content .form-label {font-size: 20px !important; font-weight: 500 !important;}
.cart-page-content .form-control {font-size: 20px !important; font-weight: 400 !important; padding: 10px 16px !important;}
.cart-page-content textarea.form-control {min-height: 120px;}

.cart-page-content .btn {border-radius: 5px; overflow: hidden;}
.cart-page-content .btn span {font-size: 20px; padding: 10px 11px 12px; font-weight: 500; border-radius: 5px; overflow: hidden;}
.cart-page-content .btn.btn-outline-gradient:hover span {background-color: #f2f2f2;}

.cart-item-card {border: 2px solid #E6E6E6; border-radius: 5px; padding: 31.37px;}
.cart-item-card:not(:last-child) {margin: 0 0 30px;}
.cart-item-card .cart-image {width: 397px; height: 194px; border: 1px solid #F4F4F4; border-radius: 5px; margin-right: 24px; overflow: hidden;}
.cart-item-card .cart-image img {width: 100%; height: 100%; object-fit: cover;}
.cart-item-card .card-title {  font-size: 25px; line-height: normal; font-weight: 700; margin: 0 0 5px; color: #444444;}
.cart-item-card .card-desc {font-size: 20px; line-height: normal; margin: 0; color: #9A9A9A;}
.cart-item-card .bundle-item-label {background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); font-size: 16px; color: #fff; font-weight: 600; padding: 2px 17px 4px; display: inline-flex; border: 1px solid #E6E6E6; border-radius: 25px; margin: 20px 0;} 
.cart-item-card .cart-item-price { font-weight: 700; font-size: 24px; color: #444444; line-height: normal; margin: 0;}
.cart-item-card .cart-item-discount { font-weight: 500; font-size: 20px; color: #9A9A9A; margin: 0;}
.cart-item-card .btn-link:hover {background-color: #f2f2f2;}

.touch-spin-buttons {display: flex; align-items: center; grid-gap: 22px;}
.touch-spin-buttons .btn {width: 42px; height: 42px; border-radius: 8px; border: 2px solid #F26A2C; color: #000; font-size: 20px;}
.touch-spin-buttons .btn:hover {background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); color: #fff;}
.touch-spin-buttons .value { font-weight: 600; font-size: 25px; color: #F26A2C;}

.total-cart-value span { font-size: 22px; font-weight: 700; background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.save-amount {margin: 20px 0 30px; font-size: 20px; color: #9A9A9A; text-align: center;}

.promo-code {display: flex; grid-gap: 13px; margin: 30px 0;}
.promo-code .form-control {font-size: 20px !important; font-weight: 400 !important; padding: 12px 16px !important; border-color: #E6E6E6 !important;}
.promo-code .btn {min-width: 92px;}

.payment-method {background-color: #F4F4F4; padding: 2px 2px 0 2px;}
.payment-method .nav-item {flex: 1;}
.payment-method .nav-link {border-radius: 0; font-size: 20px; width: 100%;}

/* checkout-header page css */
.checkout-header {background-color: #F4F4F4; padding: 50px 10px 47px;}
.checkout-header h1 { font-style: normal; font-weight: 700; font-size: 60px; line-height: 72px; color: #444444;}
.checkout-header p { font-style: normal; font-weight: 500; font-size: 28px; line-height: 34px; text-align: center; color: #9A9A9A;}

.section-title { font-style: normal; font-weight: 700; font-size: 30px; line-height: 36px; color: #1C1C1C; margin: 0 0 30px;}

.igb-web-radio label {padding: 17px 18px;}
.igb-web-radio label[part="checked"] {background-color: #f2f2f2;}

.radio-with-label {position: relative; margin: 0 0 20px;}
.radio-with-label input[type="radio"] {position: absolute; left: 17px; top: 50%; transform: translateY(-50%); accent-color: #F26A2C; width: 20px; height: 20px; z-index: 1;}
.radio-with-label .radio-content {position: relative; background-color: #E6E6E6; border-radius: 5px; overflow: hidden; width: 100%; padding: 2px;}
.radio-with-label .content-holder {display: block; background-color: #fff; padding: 12px 20px 12px 47px;  font-style: normal; font-weight: 700; font-size: 20px; line-height: 24px; color: #444444; min-height: 85px; display: flex; align-items: center;}
.radio-with-label .content-holder h5 {font-family: 'Barlow'; font-style: normal; font-weight: 700; font-size: 20px; line-height: 24px; color: #444444;}
.radio-with-label .content-holder p {font-style: normal; font-weight: 400; font-size: 20px; line-height: 24px; color: #9A9A9A;}
.radio-with-label input[type="radio"]:checked ~ .radio-content  {background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%);}

/* shipping-card */
.shipping-card { border: 2px solid #E6E6E6; border-radius: 5px; box-shadow: none; padding: 30px; margin-bottom: 30px;}
.shipping-card .card-title { font-style: normal; font-weight: 700; font-size: 24px; line-height: 29px; background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin: 0 0 29px;}
.shipping-card .block {margin: 20px 0 0;}
.shipping-card .block h4 { font-style: normal; font-weight: 600; font-size: 20px; line-height: 24px; color: #444444; margin: 0;}
.shipping-card .block p { font-style: normal; font-weight: 400; font-size: 20px; line-height: 24px; color: #9A9A9A; margin: 0 0 2px;}

/* rz-steps-item */
.rz-steps-item .rz-menuitem-link {flex-direction: column; align-items: center; justify-content: center;}
.rz-steps-item .rz-menuitem-link .rz-steps-number {font-weight: 600; display: flex; align-items: center; justify-content: center; padding: 1px; width: 40px; height: 40px; font-size: 24px; font-weight: 700; color: #fff; margin-bottom: 6px; background-color: #444444; margin: 0 0 5px !important;}
.rz-steps-item .rz-menuitem-link .rz-steps-title { margin: 0 !important; font-size: 20px; font-weight: 600; line-height: normal;  color: #444444;}
.rz-state-highlight.rz-steps-current .rz-steps-number {background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%);}
.rz-state-highlight.rz-steps-current .rz-steps-title {background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin: 0 0 29px;}
.rz-steps .rz-steps-item:not(:last-child):after {position: relative; top: -15px;}


.order-summary {background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); padding: 2px;}
.order-summary .card-body {padding: 30px 28px; background-color: #fff;}
.order-summary .card-title {font-size: 32px; font-weight: 700; color: #444444; margin: 0 0 30px;}
.order-summary .list-unstyled li {font-size: 22px; font-weight: 500; color: #444444;}
.order-summary .horizontal-gradient-line {margin: 30px 0 !important;}


.order-card-item:not(:last-child) {margin-bottom: 20px;}
.order-card-item { display: flex; grid-gap: 19px;}
.order-card-item .image {width: 108px; height: 108px; border: 1px solid #E7E7E7; background-color: #f2f2f2;}
.order-card-item .image img {width: 100%; height: 100%; object-fit: cover;}
.order-card-item .bundle-price,
.order-card-item .bundle-name {font-size: 25px; font-weight: 700; color: #444444; margin: 0;}
.order-card-item .bundle-discount,
.order-card-item .bundle-desc {color: #9A9A9A; font-size: 20px; font-weight: 400;}
.order-card-item .bundle-quantity {color: #F26A2C;}

.confirm-modal-screen h1 {font-weight: 700; font-size: 48px; line-height: 58px; text-align: center; background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; margin: 0 0 16px;}
.confirm-modal-screen p.text-muted {font-weight: 500; font-size: 28px; line-height: 34px; text-align: center; color: #9A9A9A; margin: 0 0 20px !important;}

.order-summary-box {max-width: 780px; margin: 50px auto; background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); padding: 2px;}
.order-summary-box .card-body {padding: 30px;}
.order-summary-box .card-body span {font-size: 24px; color: #1C1C1C;}

.stepper-content {margin-top: 40px;}
.stepper-count {position: relative; width: 42px; height: 42px; border-radius: 100%; color: #fff; font-size: 24px; font-weight: 700; display: flex; align-items: center; justify-content: center; margin: auto;}
/*.flex-fill {position: relative;}*/
.flex-fill:not(:last-child):before {content: ''; width: 100%; height: 2px; background-color: #E6E6E6; position: absolute; left: 50%; top: 20px;}
.stepper-text {font-family: 'Barlow', sans-serif; font-style: normal; font-weight: 600; font-size: 20px; line-height: 24px; color: #444444; margin-top: 7px;}

.gradient-bg-line {background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); padding: 2px;}
.total-cart-value-new {display: flex; align-items: center; justify-content: space-between; padding: 14px 90px; background-color: #fff;}
.total-cart-value-new p {font-weight: 700; font-size: 32px; line-height: 38px; background: linear-gradient(90deg, #F49E25 0%, #F26A2C 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; margin: 0;}

.payment-method-types {display: flex; align-items: center; justify-content: space-between; margin: 30px 0; grid-gap: 27px;}
.payment-method-types .payment-radio {flex: 1; position: relative;}
.payment-method-types .radio-content {padding: 21px 20px 21px 70px; border: 1px solid #E6E6E6; border-radius: 5px; font-size: 20px; font-weight: 700; color: #444444;}
.payment-method-types input[type="radio"] {position: absolute; left: 40px; top: 50%; transform: translateY(-50%); accent-color: #F26A2C; width: 20px; height: 20px; z-index: 1;}
.payment-method-types input[type="radio"]:checked ~ .radio-content  {border-color: #F26A2C;}

@media screen and (max-width: 1660px) {
    .checkout-header,
    .cart-page-banner,
    .cart-page-content  {zoom: 76%;}
}
@media screen and (max-width: 991px) {
    .checkout-header,
    .cart-page-banner,
    .cart-page-content  {zoom: 68%;}

    .cart-page-banner {padding: 60px 0;}
    .cart-page-banner h1 {font-size: 36px; margin-bottom: 10px;}
    .cart-page-banner p {font-size: 22px;}
 
    .cart-page-content .cart-count h5 {font-size: 26px;}
    .cart-page-content {padding: 30px 0;}
    
    .cart-item-card:not(:last-child) {margin-bottom: 20px;}
    .cart-item-card {padding: 20px;}
    .cart-item-card .cart-image {width: 100%;}
    .cart-item-card > .d-flex.align-items-start {flex-direction: column; grid-gap: 15px;}
    .cart-item-card .d-flex.align-items-center.justify-content-between {flex-direction: row; align-items: flex-end !important;}

    .payment-method-types {grid-gap: 15px;}
    .payment-method-types .radio-content {padding: 10px 10px 10px 40px; font-size: 16px;}
    .payment-method-types input[type="radio"] {left: 15px;}

    .total-cart-value-new {padding: 14px 20px;} 
    .total-cart-value-new p {font-size: 28px;}

    .section-title {font-size: 28px;}

    .checkout-header h1 {font-size: 44px; line-height: normal;}
    .checkout-header p {font-size: 24px;}

    .stepper-count {font-weight: 500;}

    .order-card-item .bundle-price, .order-card-item .bundle-name {
        font-size: 20px;
    }

    .shipping-card {padding: 20px; margin-bottom: 20px;}

    .confirm-modal-screen h1 {font-size: 40px; margin-bottom: 5px;}
    .confirm-modal-screen p.text-muted {font-size: 22px; line-height: 1.5;}
}