/* Shared customer and reseller checkout visual refresh. */
.slidetop {
    background: linear-gradient(180deg, #f4efff 0, #faf8ff 240px, #f8f9fc 100%) !important;
    padding: 24px 0 48px !important;
}
.container.checkout-shell { width: calc(100% - 48px) !important; max-width: 1240px !important; }
.checkout-page-heading { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; color: #17142b; }
.checkout-page-heading .checkout-heading-icon { width: 48px; height: 48px; border-radius: 16px; }
.checkout-page-heading h1 { margin: 0; font-size: clamp(22px, 2.2vw, 30px); font-weight: 900; }
.checkout-page-heading p { margin: 2px 0 0; color: #6e6880; font-size: 13px; }
.checkout-shell > .row { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: 22px; margin: 0; align-items: start; }
.checkout-shell > .row > .col-md-6 { width: auto; max-width: none; padding: 0; }
.checkout-shell #orderForm > .row:first-of-type { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0 14px; margin: 0; }
.checkout-shell #orderForm > .row:first-of-type > .form-group:has(#customerName),
.checkout-shell #orderForm > .row:first-of-type > .form-group:has(#customerPhone) { grid-column: span 3; }
.checkout-shell #orderForm > .row:first-of-type > .form-group:has(#division),
.checkout-shell #orderForm > .row:first-of-type > .form-group:has(#district),
.checkout-shell #orderForm > .row:first-of-type > .form-group:has(#upazila) { grid-column: span 2; }
.checkout-shell #orderForm > .row:first-of-type > .form-group:has(#customerAddress),
.checkout-shell #orderForm > .row:first-of-type > .form-group:has([name="customerNote"]) { grid-column: 1 / -1; }
.checkout-shell #orderForm > .row:first-of-type > .form-group { flex: initial; width: auto; max-width: none; padding: 0 0 4px; }
.checkout-progress {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(10px, 3vw, 38px);
    margin: 0 auto 22px;
    padding: 15px 22px;
    border: 1px solid #e8ddff;
    border-radius: 18px;
    background: rgba(255,255,255,.88);
    box-shadow: 0 10px 28px rgba(53, 24, 98, .06);
}
.checkout-progress-step { display: flex; align-items: center; gap: 10px; color: #716b82; font-size: 14px; font-weight: 750; white-space: nowrap; }
.checkout-progress-step.is-active { color: #6500c9; }
.checkout-progress-step span { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #d9c8ff; border-radius: 50%; background: #fff; color: #5f20bb; font-weight: 900; }
.checkout-progress-step.is-active span { border-color: #7200dc; background: linear-gradient(135deg,#9d12ec,#5c00c8); color: #fff; box-shadow: 0 6px 14px rgba(114,0,220,.22); }
.checkout-progress-line { width: clamp(22px, 5vw, 74px); height: 2px; background: #e2d5ff; }
.checkout-shell .card, .checkout-shell .modal-content { border-color: #e8ddff !important; box-shadow: 0 12px 30px rgba(48, 26, 86, .08) !important; }
.checkout-shell .card-body { padding: 22px !important; }
.checkout-heading { border-bottom-color: #eee7fa; }
.checkout-heading-icon { background: linear-gradient(135deg,#a20df0,#5b00c7) !important; box-shadow: 0 9px 20px rgba(111,0,210,.2) !important; }
.checkout-shell .form-control:focus, .checkout-shell select.form-control:focus, .checkout-shell textarea.form-control:focus { border-color: #8b20e8 !important; box-shadow: 0 0 0 4px rgba(139,32,232,.11) !important; }
.checkout-shell #fraudCheck { background: #f4eaff; color: #6c12c7 !important; }
.checkout-shell #apply_coupon_btn, .checkout-shell .btn-success { background: linear-gradient(135deg,#9610e9,#5c00c8) !important; }
.checkout-shell #coupon-applied-row > div { background: #f4eaff !important; border-color: #d7b5ff !important; }
.checkout-shell .summary-box { border-color: #e9e0f5; background: linear-gradient(180deg,#fff,#fbf9ff); }
.checkout-shell #totalamount { color: #6500c9; }
.checkout-shell .payment-option:hover { border-color: #8b20e8 !important; background: #fcf8ff !important; box-shadow: 0 10px 22px rgba(111,0,210,.1) !important; }
.checkout-shell .btn-check:checked + .payment-option, .checkout-shell .payment-option:has(input[type=radio]:checked) { border-color: #7814d6 !important; background: linear-gradient(135deg,#f6ebff,#fff) !important; box-shadow: 0 0 0 3px rgba(120,20,214,.09) !important; color: #5d00bb !important; }
.checkout-shell .custom-radio .dot { background: #7610d1; }
.checkout-shell .payment-option:has(input[type=radio]:checked) .custom-radio { border-color: #7610d1; }
.checkout-shell #addMoreMonyDiv { border-color: #ead5ff; background: #fbf6ff; }
.checkout-shell .buy-now, .checkout-shell #orderConfirm { background: linear-gradient(110deg,#990ee8,#5a00c6) !important; box-shadow: 0 12px 24px rgba(101,0,201,.22) !important; }
.checkout-shell #proPrice { background: #f2e8ff; color: #6200bd; }
.checkout-shell .coupon-badge { background: #6d0bc9; }
.checkout-shell .modal-header { background: #faf7ff; }
.checkout-shell .orderDetails .checkout-heading { margin-bottom: 12px; }
.checkout-shell .cart-item:hover { transform: none; }
#fraudModal { position: fixed !important; inset: 0 !important; height: 100dvh !important; padding: 16px !important; overflow-y: auto !important; z-index: 2147483000 !important; }
#fraudModal .modal-dialog { display: flex; align-items: center; width: min(100%, 760px); max-width: 760px; min-height: calc(100dvh - 32px); margin: 0 auto !important; }
#fraudModal .modal-content { width: 100%; max-height: calc(100dvh - 32px); overflow-y: auto !important; border-radius: 20px !important; }
#fraudModal .modal-header { position: sticky; top: 0; z-index: 1; align-items: center; padding: 16px 20px; }
#fraudModal .modal-title { color: #21143f; font-weight: 800; }
#fraudModal .modal-header .close { margin: -8px -8px -8px auto; padding: 8px 12px; color: #2e2150; opacity: 1; }
#fraudModal .modal-body { padding: 20px; }
body:has(#fraudModal.show) .modal-backdrop { z-index: 2147482990 !important; }
.checkout-shell .orderDetails table { width: 100%; border: 0 !important; }
.checkout-shell .orderDetails tr.cart-item { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; align-items: start; width: 100%; padding: 12px; margin: 0 0 12px; box-sizing: border-box; }
.checkout-shell .orderDetails tr.cart-item td { display: block; min-width: 0; padding: 0 !important; border: 0 !important; }
.checkout-shell .orderDetails tr.cart-item td[hidden] { display: none !important; }
.checkout-shell .orderDetails tr.cart-item .product-image { width: 72px; float: none; }
.checkout-shell .orderDetails tr.cart-item #proImg { width: 72px !important; max-width: 72px !important; height: 72px !important; margin: 0; }
.checkout-shell .orderDetails tr.cart-item .product-name { width: auto; min-height: 0; }
.checkout-shell .orderDetails tr.cart-item #proName { width: auto !important; padding: 0 !important; margin: 0 0 7px; line-height: 1.4; overflow-wrap: anywhere; }
.checkout-shell .orderDetails tr.cart-item .qtyinfo { margin-top: 8px; }
@media (max-width: 767px) {
    .slidetop { padding: 12px 0 30px !important; }
    .container.checkout-shell { width: calc(100% - 16px) !important; padding-left: 0 !important; padding-right: 0 !important; }
    .checkout-page-heading { margin-bottom: 10px; }
    .checkout-shell > .row { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .checkout-shell #orderForm > .row:first-of-type { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 10px; }
    .checkout-shell #orderForm > .row:first-of-type > .form-group:has(#division),
    .checkout-shell #orderForm > .row:first-of-type > .form-group:has(#district),
    .checkout-shell #orderForm > .row:first-of-type > .form-group:has(#upazila) { grid-column: span 2; }
    .checkout-progress { justify-content: space-between; gap: 6px; margin-bottom: 14px; padding: 11px 9px; border-radius: 15px; }
    .checkout-progress-step { flex-direction: column; gap: 4px; font-size: 10px; }
    .checkout-progress-step span { width: 30px; height: 30px; }
    .checkout-progress-line { flex: 1; width: auto; margin: 0 2px 16px; }
    .checkout-shell .card-body { padding: 15px !important; }
    .checkout-shell .orderDetails tr.cart-item { grid-template-columns: 58px minmax(0, 1fr); gap: 12px; padding: 12px; }
    .checkout-shell .orderDetails tr.cart-item .product-image { width: 58px; }
    .checkout-shell .orderDetails tr.cart-item #proImg { width: 58px !important; max-width: 58px !important; height: 58px !important; }
    #fraudModal { padding: 10px !important; }
    #fraudModal .modal-dialog { min-height: calc(100dvh - 20px); }
    #fraudModal .modal-content { max-height: calc(100dvh - 20px); }
    #fraudModal .modal-body { padding: 14px; }
}