.paymentSuccess{background:var(--White,#fff);border:1px solid var(--Gray-200,#e9eaeb);width:100%;max-width:365px;font-family:var(--font-sans-active);direction:rtl;border-radius:12px;padding:29px 19px 24px;box-shadow:0 6px 17.5px rgba(0,0,0,.1)}.paymentSuccess .successHeader{flex-direction:column;align-items:center;gap:5px;margin-bottom:20px;display:flex}.paymentSuccess .successHeader .successIcon{color:#12b26a;justify-content:center;align-items:center;width:47px;height:47px;margin-bottom:14px;display:flex}.paymentSuccess .successHeader .successIcon svg{width:100%;height:100%}.paymentSuccess .successHeader .successTitle{color:var(--Primary-DarkBlue,#0b1956);text-align:center;margin:0;font-size:32px;font-weight:600;line-height:40px}.paymentSuccess .successHeader .successMessage{color:var(--Gray-600,#535862);text-align:center;margin:0;font-size:16px;font-weight:400;line-height:20px}.paymentSuccess .transactionDetails{border:1px solid var(--Gray-200,#e9eaeb);background:#fdfdfd;border-radius:8px;margin-bottom:20px;padding:13px}.paymentSuccess .transactionDetails .transactionHeader{justify-content:space-between;align-items:flex-start;margin-bottom:12px;display:flex}.paymentSuccess .transactionDetails .transactionHeader .transactionInfo{flex-direction:column;gap:2px;display:flex}.paymentSuccess .transactionDetails .transactionHeader .transactionInfo .infoLabel{color:var(--Gray-600,#535862);margin:0;font-size:10px;font-weight:400;line-height:15px}.paymentSuccess .transactionDetails .transactionHeader .transactionInfo .infoLabel.reverse{justify-content:flex-end;display:flex}.paymentSuccess .transactionDetails .transactionHeader .transactionInfo .infoValue{color:var(--Primary-DarkBlue,#0b1956);margin:0;font-size:12px;font-weight:500;line-height:18px}.paymentSuccess .transactionDetails .divider{background:var(--Gray-300,#d5d7da);width:100%;height:1px;margin:12px 0}.paymentSuccess .transactionDetails .itemsList{flex-direction:column;gap:6px;margin-bottom:12px;display:flex}.paymentSuccess .transactionDetails .itemsList .itemRow{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.paymentSuccess .transactionDetails .itemsList .itemRow .itemName{color:var(--Primary-DarkBlue,#0b1956);text-align:right;flex:1;margin:0;font-size:12px;font-weight:400;line-height:18px}.paymentSuccess .transactionDetails .itemsList .itemRow .itemPrice{color:#039855;white-space:nowrap;margin:0;font-size:12px;font-weight:500;line-height:18px}.paymentSuccess .transactionDetails .totalRow{justify-content:space-between;align-items:center;margin-top:12px;display:flex}.paymentSuccess .transactionDetails .totalRow .totalLabel{color:var(--Primary-DarkBlue,#0b1956);margin:0;font-size:14px;font-weight:500;line-height:21px}.paymentSuccess .transactionDetails .totalRow .totalAmount{color:#039855;margin:0;font-size:16px;font-weight:600;line-height:24px}.paymentSuccess .goToAccountButton{width:100%;text-decoration:none;display:block}.paymentSuccess .goToAccountButton .accountButton{text-transform:capitalize;width:100%;height:40px;font-size:16px;font-weight:600;line-height:16px;font-family:var(--font-sans-active);border-radius:9.6px;background:var(--Primary-DarkBlue,#0b1956)!important;color:var(--White,#fff)!important}.paymentSuccess .goToAccountButton .accountButton:hover{background:#0a1645!important}[dir=ltr] .paymentSuccess{direction:ltr}[dir=ltr] .paymentSuccess .transactionHeader .transactionInfo:first-child{text-align:right}[dir=ltr] .paymentSuccess .itemsList .itemRow .itemName{text-align:left}
.paymentFailure{background:var(--White,#fff);border:1px solid var(--Gray-300,#d5d7da);width:100%;max-width:365px;font-family:var(--font-sans-active);direction:rtl;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:36px;padding:30px;display:flex;box-shadow:0 6px 17.5px rgba(0,0,0,.1)}.paymentFailure .failureHeader{flex-direction:column;align-items:center;gap:14px;width:100%;display:flex}.paymentFailure .failureHeader .failureIcon{color:#f04438;justify-content:center;align-items:center;width:47px;height:47px;display:flex}.paymentFailure .failureHeader .failureIcon svg{width:100%;height:100%}.paymentFailure .failureHeader .failureTitle{color:var(--Primary-DarkBlue,#0b1956);text-align:center;margin:0;font-size:32px;font-weight:600;line-height:47px}.paymentFailure .failureHeader .failureMessage{color:var(--Gray-B2,#616161);text-align:center;max-width:308px;margin:0;font-size:16px;font-weight:400}.paymentFailure .actionButtons{flex-direction:column;align-items:center;gap:8px;width:100%;max-width:309px;display:flex}.paymentFailure .actionButtons .retryButton{text-transform:capitalize;width:100%;height:48px;font-size:19.2px;font-weight:600;line-height:28.8px;font-family:var(--font-sans-active);border-radius:8px;box-shadow:0 1.2px 2.4px rgba(10,13,18,.05);background:var(--Primary-DarkBlue,#0b1956)!important;color:var(--White,#fff)!important;border:1px solid var(--Primary-DarkBlue,#0b1956)!important}.paymentFailure .actionButtons .retryButton:hover{background:#0a1645!important;border-color:#0a1645!important}.paymentFailure .actionButtons .homeLink{color:var(--Primary-Blue,#0870f3);text-align:center;font-size:14px;font-weight:400;line-height:28.8px;font-family:var(--font-sans-active);text-decoration:none;transition:opacity .2s}.paymentFailure .actionButtons .homeLink:hover{opacity:.8;text-decoration:underline}[dir=ltr] .paymentFailure{direction:ltr}