.nc {
    width: 1360px;
    display: flex;
    gap: 44px;
    align-items: flex-start;
    margin: 108px auto 160px;
}
.nc p, .nc h2 {
    margin: 0;
}
.nc label {
    padding: 0;
    margin: 0;
}
.nc .nc-bull {
    color: #C2BEBC;
}
.nc .nc-color1 {
    color: #E05200 !important;
}
.nc .nc-color2 {
    color: #1EA112 !important;
}
.nc .nc-color3 {
    color: #37322F !important;
}
.nc .nc-color4 {
    color: #0C0A08 !important;
}
.nc .nc-extra1 {
    margin-top: 2px;
}
.nc .nc-extra2 {
    margin-top: 8px;
}
.nc .nc-extra3 {
    margin-top: 24px;
}
.nc .nc-extra4 {
    margin-top: 16px;
}
.nc .nc-f1 {
    font-family: "Roboto Slab", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 34px;
    color: #0C0A08;
}
.nc .nc-f2 {
    font-family: "Roboto Slab", sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 26px;
    color: #0C0A08;
}
.nc .nc-f3 {
    font-family: Satoshi, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 26px;
    color: #0C0A08;
}
.nc .nc-f4 {
    font-family: Satoshi, sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 26px;
    color: #0C0A08;
}
.nc .nc-f5 {
    font-family: Satoshi, sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    color: #55514E;
}
.nc .nc-f6 {
    font-family: "Roboto Slab", sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 18px;
    color: #0C0A08;
}
.nc .nc-f7 {
    font-family: Satoshi, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    color: #0C0A08;
}
.nc .nc-f8 {
    font-family: Satoshi, sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 18px;
    color: #55514E;
}
.nc .nc-f9 {
    font-family: "Roboto Slab", sans-serif;
    font-weight: 700;
    font-size: 24px;
    line-height: 40px;
    color: #0C0A08;
}
.nc .nc-f10 {
    font-family: "Roboto Slab", sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 30px;
    color: #0C0A08;
}
.nc .nc-f11 {
    font-family: Satoshi, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 30px;
    color: #0C0A08;
}
.nc .nc-f12 {
    font-family: Satoshi, sans-serif;
    font-weight: 500;
    font-size: 12px;
    line-height: 26px;
    color: #0C0A08;
}
.nc .nc-f13 {
    font-family: Satoshi, sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 26px;
}
.nc .nc-f14 {
    font-family: Satoshi, sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 16px;
    color: #08080C;
}
.nc .nc-f15 {
    font-family: Satoshi, sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: white;
}
.nc .nc-f16 {
    font-family: Satoshi, sans-serif;
    font-weight: 500;
    font-size: 12px;
    line-height: 20px;
    color: #0C0A08;
    text-transform: uppercase;
}
.nc .nc-left {
    width: 864px;
    background: #F5F4F4;
    padding: 24px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.nc .nc-right {
    width: 452px;
    border: 1px solid #0C0A08;
    border-radius: 8px;
    padding: 24px 28px;
    position: sticky;
    top: 108px;
}
.nc .nc-left-box {
    padding: 20px;
    background: white;
    border-radius: 6px;
}
.nc .nc-left-box-product {
    background: white;
    border-radius: 6px;
}
.nc .nc-left-truck {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.nc .nc-delete {
    filter: brightness(0) saturate(100%) invert(52%) sepia(8%) saturate(238%) hue-rotate(341deg) brightness(99%) contrast(93%);
    cursor: pointer;
}
.nc .nc-truck-name-parts {
    display: flex;
    flex-direction: column;
}
.nc .nc-truck-name {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.nc .nc-truck-info {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}
.nc .nc-truck-image-box {
    position: relative;
}
.nc .nc-truck-magnify {
    position: absolute;
    left: 7px;
    top: 7px;
}
.nc .nc-truck-image {
    width: 258px;
    border-radius: 4px;
}
.nc .nc-left-truck-general {
    display: flex;
    gap: 24px;
}
.nc .nc-truck-days div {
    flex: 1;
}
.nc .nc-truck-days {
    display: flex;
    justify-content: space-between;
}
.nc .nc-left-truck-prices div:nth-child(n+2) {
    border-left: 1px solid rgba(194, 190, 188, 0.5);
}
.nc .nc-left-truck-prices div {
    flex: 1;
    padding: 12px 20px;
}
.nc .nc-left-truck-prices {
    border: 1px solid rgba(194, 190, 188, 0.5);
    border-radius: 8px;
    background: #FAFAFA;
    display: flex;
}
.nc .nc-left-truck-options {
    display: flex;
    align-items: center;
    gap: 10px;
}
.nc .nc-truck-share-label2 {
    cursor: pointer;
}
.nc .nc-truck-share-label {
    width: 32px;
    height: 32px;
    border: 1px solid #C2BEBC82;
    background: #FAFAFA;
    border-radius: 8px;
    cursor: pointer;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.nc .nc-truck-share-label input {
    display: none;
}
.nc .nc-truck-share-checkmark {
    display: inline-block;
    width: 14px;
    height: 14px;
    position: relative;
    cursor: pointer;
}
.nc .nc-truck-share-label input + .nc-truck-share-checkmark::after {
    content: "";
    position: absolute;
    left: 3px;
    top: -2px;
    width: 8px;
    height: 15px;
    border: solid #EEEDED;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.nc .nc-truck-share-label:has(input:checked) {
    background: #396A60;
    border: 1px solid #396A60;
}
.nc .nc-truck-share-label input:checked + .nc-truck-share-checkmark::after {
    content: "";
    position: absolute;
    left: 3px;
    top: -2px;
    width: 8px;
    height: 15px;
    border: solid #FFFFFF;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.nc .nc-left-product {
    display: flex;
    justify-content: space-between;
}
.nc .nc-left-product-general {
    display: flex;
    gap: 24px;
    padding: 20px;
}
.nc .nc-product-image-box {
    position: relative;
}
.nc .nc-product-image {
    width: 258px;
    border-radius: 4px;
}
.nc .nc-product-info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.nc .nc-left-product-options {
    display: flex;
    align-items: center;
    gap: 10px;
}
.nc .nc-left-product-actions {
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 26px;
    justify-content: center;
    align-items: center;
    border-left: 1px dashed #E4E4E7;
}
.nc .nc-product-qty-box {
    border: 1px solid #D7D7DB;
    border-radius: 12px;
    padding: 6px;
    display: flex;
    gap: 8px;
    align-items: center;
}
.nc .nc-product-qty-minus, .nc .nc-product-qty-plus {
    background: #E7E5E4;
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
}
.nc .nc-right-head {
    display: flex;
    flex-direction: column;
}
.nc .nc-right-head-info img {
    width: 20px;
    height: 20px;
}
.nc .nc-right-head-info {
    display: flex;
    gap: 6px;
    align-items: center;
}
.nc .nc-right-payment-highlight {
    border: 1px solid rgba(231, 229, 228, 0.5);
    border-radius: 8px;
    padding: 12px 16px;
    background: #FAFAFA;
    margin-top: 16px;
}
/*.nc .nc-right-payment-row:nth-child(2) {*/
/*    border-top: 1px solid #C2BEBC;*/
/*    margin-top: 8px;*/
/*    padding-top: 8px;*/
/*}*/
.nc .nc-right-coupon-row {
    display: flex;
    justify-content: space-between;
    margin-top: 12px;
}
.nc .nc-right-coupon {
    display: flex;
    gap: 8px;
    align-items: center;
}
.nc .nc-right-coupon-code {
    border: 1px solid #1EA112;
    background: #E9F6E8;
    border-radius: 8px;
    padding: 4px 8px;
    text-transform: uppercase;
}
.nc .nc-right-payment-row {
    display: flex;
    justify-content: space-between;
}
.nc .nc-payment-row-list {
    display: flex;
    gap: 4px;
    align-items: center;
}
.nc .nc-right-separator {
    margin-top: 7px;
    margin-bottom: 7px;
    height: 1px;
    background: #C2BEBC;
}
.nc .nc-right-pay-button {
    border-radius: 8px;
    background: #1EA112;
    padding: 16px 24px;
    border: 0;
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
    justify-content: center;
    margin: 24px 0 0;
}
.nc .nc-right-coupon-button {
    border-radius: 8px;
    background: #F5F4F4;
    padding: 16px 24px;
    border: 0;
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
    justify-content: center;
    margin: 16px 0 0;
}
.nc .nc-right-bottom {
    margin-top: 16px;
    text-align: center;
}

.nc .nc-bottom-pay {
    display: none;
}

@media(max-width: 1400px) {
    .nc {
        width: 100%;
    }
    .nc .nc-right {
        margin-right: 10px;
    }
    .nc .nc-left {
        margin-left: 10px;
    }
}

@media(max-width: 991px) {
    .nc {
        width: 100%;
        flex-wrap: wrap-reverse;
        margin: 0 auto 160px;
        gap: 0;
    }
    .nc .nc-left {
        width: 100%;
        margin-left: 0;
    }
    .nc .nc-right {
        position: unset;
        width: 100%;
        margin-right: 0;
        border: 0;
    }
    .nc .nc-left-truck-general {
        flex-wrap: wrap;
    }
    .nc .nc-truck-days {
        flex-wrap: wrap;
    }
    .nc .nc-truck-image {
        width: 100%;
    }
    .nc .nc-left-truck-prices {
        flex-wrap: wrap;
    }
    .nc .nc-left-truck-prices div {
        flex: 100%;
    }
    .nc .nc-left-truck-prices div:nth-child(n+2) {
        border-top: 1px solid rgba(194, 190, 188, 0.5);
        border-left: 0;
    }
    .nc .nc-left-product {
        flex-wrap: wrap;
    }
    .nc .nc-left-product-general {
        flex-wrap: wrap;
    }
    .nc .nc-product-image {
        width: 100%;
    }
    .nc .nc-product-info {
        width: 100%;
        gap: 24px;
    }
    .nc .nc-left-product-actions {
        width: 100%;
        justify-content: space-between;
        flex-direction: row;
        border-left: none;
        border-top: 1px dashed #E4E4E7;
        padding: 20px;
    }
    .nc .nc-bottom-pay .nc-right-pay-button {
        margin: 0;
    }
    .nc .nc-bottom-pay {
        width: 100%;
        bottom: 0;
        z-index: 10;
        background: white;
        height: 76px;
        box-shadow: 0px 4px 16px 0px #00000014;
        padding: 20px;
    }
    .nc .nc-bottom-pay-show {
        position: fixed;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

@media(max-width: 500px) {
    .nc .nc-truck-days {
        gap: 16px;
    }
    .nc .nc-truck-days div {
        flex: 100%;
    }
}