/*-----visa-plus-payname-success-----*/

.jumbotron {margin: 0 0 20px;}
.jumbotron h1 {font-weight: 500;font-size: 22px;line-height: 145%;color: #000000;margin: 0;}
.visa-plus-payname {border-radius: 4px;background-color: #fff;box-shadow: 0 10px 20px 0 rgb(0 0 0 / 2%);border: 1px solid #fff;padding: 24px 34px 40px 24px;}
.visa-plus-payname h2 {font-weight: 700;font-size: 18px;line-height: 144%;letter-spacing: 0.266667px;color: #333333;margin: 0 0 31px;}
.visa-plus-payname ul {padding: 0 0 0 24px;}
.visa-plus-payname ul li {position: relative;font-weight: 400;font-size: 14px;line-height: 157%;color: #333333;margin: 0 0 32px;list-style: none;}
.visa-plus-payname ul li::before {content: "";position: absolute;left: -24px;top: 8px;width: 7px;height: 7px;border-radius: 50%;}
.visa-plus-payname ul li h3.heading {display: block;font-weight: 600;font-size: 16px;line-height: 150%;letter-spacing: 0.266667px;color: #333333;margin: 0 0 4px;}
.visa-plus-payname ul li p {margin: 0;}
.visa-plus-payname .img-holder img {margin: 0 0 0 10px;}
.visa-plus-payname .btns {display: flex;align-items: center;justify-content: space-between;margin: 10px 0 0;}
.visa-plus-payname .btn {min-width: 135px;}
.visa-plus-payname .btn.btn-orange {font-weight: 700;font-size: 14px;line-height: 129%;color: #FFFFFF;}
.visa-plus-payname .btn.btn-light {margin: 0 0 0 12px;font-weight: 400;letter-spacing: 0.233333px;color: #757575;}
.visa-plus-payname .btn.btn-light:hover,
.visa-plus-payname .btn.btn-light:focus {color: #ffffff;}
.visa-plus-payname .content .link .icon-link {font-size: 10px;color: #757575;}
.visa-plus-payname-success {display: flex;flex-direction: column;align-items: center;border-radius: 4px;background-color: #fff;box-shadow: 0 10px 20px 0 rgb(0 0 0 / 2%);border: 1px solid #fff;padding: 80px 20px;}
.visa-plus-payname-success .success-img {margin: 0 0 24px;}
.visa-plus-payname-success h2 {font-weight: 500;font-size: 22px;line-height: 145%;text-align: center;color: #2D815F;margin: 0 0 12px;}
.visa-plus-payname-success p {font-weight: 300;font-size: 13px;line-height: 138%;text-align: center;letter-spacing: 0.216667px;color: #444444;margin: 0;}
.visa-plus-payname-success .copy-payname {display: flex;min-width: 380px;flex-direction: column;align-items: center;background: rgba(235, 239, 244, 0.2);border: 1px dashed #D8DDE4;box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);border-radius: 6px;margin: 40px 0 48px;padding: 32px 10px 30px;}
.visa-plus-payname-success .copy-payname p {font-weight: 500;font-size: 16px;line-height: 120%;text-align: center;color: #2B2B2B;margin: 0 0 14px;}
.visa-plus-payname-success .copy-payname button.copy {position: relative;font-weight: 400;font-size: 12px;line-height: 150%;letter-spacing: 0.49px;color: #666666;background-color: transparent;border: none;margin: 40px 0 0;}
.visa-plus-payname-success .copy-payname button.copy .icon-copy-settings {font-size: 18px;color: #CCCCCC;margin: 0 0 0 8px;vertical-align: middle;display: inline-block; transform: rotate(90deg);}
.visa-plus-payname-success .copy-payname button.copy:hover,
.visa-plus-payname-success .copy-payname button.copy:focus {outline-offset: 2px;outline: dotted 1px #505050;}
.visa-plus-payname-success .btns .btn.btn-light {min-width: 145px;padding: 10px 20px;}

/*-----visa-plus-payname-enable-----*/

.visa-plus-payname-enable h2 {font-weight: 500;font-size: 16px;line-height: 150%;color: #000000;margin: 0 0 4px;}
.visa-plus-payname-enable p {font-weight: 300;font-size: 13px;line-height: 162%;letter-spacing: 0.216667px;color: #444444;margin: 0 0 31px;}
.visa-plus-payname-enable .alert {max-width: 644px;}
.visa-plus-payname-enable .content {display: flex;align-items: center;gap: 9.5px;margin: 0 0 24px;}
.visa-plus-payname-enable .content .box {display: flex;flex-direction: column;align-items: center;justify-content: center;position: relative;min-height: 180px;min-width: 302px;max-width: 302px;background: #FFFFFF;border: 1px dashed #D8DDE4;box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.0544894);border-radius: 4px;padding: 0 20px;}
.visa-plus-payname-enable .content #editablePayname.box {align-items: start;border-width: 1px; border-style: dashed;}
.visa-plus-payname-enable .content #editablePayname.box label {top: 27px;transform: translate(0, -27px) scale(.85);font-weight: 400;font-size: 14px;line-height: 150%;color: #757575;}
.visa-plus-payname-enable .content #editablePayname.box .symbol-on-field {color: #757575; top: 25px;}
.visa-plus-payname-enable .content #editablePayname.box input {font-weight: 400;font-size: 16px;line-height: 150%;letter-spacing: 0.266667px;color: #222222;padding: 5px 56px 11px 14px;}
.visa-plus-payname-enable .content #editablePayname.box .field.single-border.label-slide.field-focused.ss-focus.has-symbol-on-field-left {width: 100%;}
.visa-plus-payname-enable .content #editablePayname.box .btns {margin: 16px 0 0;}
.visa-plus-payname-enable .content #editablePayname.box .btn-orange {min-width: 108px;padding: 6px 20px;font-weight: 500;font-size: 13px;line-height: 138%;}
.visa-plus-payname-enable .content #editablePayname.box .btn-light {min-width: 108px;padding: 6px 20px;font-weight: 400;font-size: 13px;line-height: 138%;margin: 0 0 0 12px;}
.visa-plus-payname-enable .content .box .edit {position: absolute;display: flex;align-items: center;top: 16px;right: 16px;font-weight: 400;font-size: 12px;line-height: 150%;letter-spacing: 0.2px;color: #757575;gap: 9px;}
.visa-plus-payname-enable .content .box .edit:hover,
.visa-plus-payname-enable .content .box .edit:focus {outline-offset: 2px;outline: dotted 1px #505050;}
.visa-plus-payname-enable .content #readonlyPayname.box .icon-edit {color: #ADADAD;font-size: 12px;}
.visa-plus-payname-enable .content .box .edit img {margin: 0 10px 0 0;}
.visa-plus-payname-enable .content .box p {font-weight: 400;font-size: 12px;line-height: 150%;color: #444444;margin: 0 0 6px;}
.visa-plus-payname-enable .content .box h3 {font-size: 16px;line-height: 150%;letter-spacing: 0.266667px;color: #222222;margin: 0;word-break: break-word;}
.visa-plus-payname-enable .how-it-works {display: flex;align-items: center;max-width: 644px;background: #F9FBFC;padding: 24px 27px 22px 24px;border: 1px solid #D8DDE4;border-radius: 4px;gap: 24px;margin: 0 0 24px;}
.visa-plus-payname-enable .how-it-works h4 {font-weight: 500;font-size: 14px;line-height: 129%;letter-spacing: 0.183333px;color: #444444;margin: -2px 0 5px;}
.visa-plus-payname-enable .how-it-works p {font-weight: 300;font-size: 12px;line-height: 150%;letter-spacing: 0.183333px;color: #444444;margin: 0;}
.visa-plus-payname-enable .agreement {max-width: 644px;padding: 16px 24px 14px;margin: 0 0 22px;}
.visa-plus-payname-enable .agreement label {margin: 0 0 0 42px;font-weight: 400;font-size: 13px;line-height: 146%;letter-spacing: 0.216667px;color: #222222;}
.visa-plus-payname-enable .agreement label a {color: #106EB8;margin: 0 0 0 5px;}
.visa-plus-payname-enable .row .col-lg-4 {display: flex !important;align-items: center;}
.visa-plus-payname-enable .img-holder {margin: -50px 0 0 20px;}
.visa-plus-payname-enable .btn {padding: 10px 20px;}
.visa-plus-payname-enable .btn.btn-orange {min-width: 144px;font-weight: 500;font-size: 14px;line-height: 129%;color: #FFFFFF;}
.visa-plus-payname-enable .btn.btn-light {min-width: 144px;margin: 0 0 0 16px;}

/*-----visa-plus-payname-delete-----*/

.visa-plus-payname-delete h2 {font-weight: 500;font-size: 16px;line-height: 150%;color: #000000;margin: 0 0 4px;}
.visa-plus-payname-delete p {font-weight: 300;font-size: 13px;line-height: 162%;letter-spacing: 0.216667px;color: #444444;margin: 0 0 31px;}
.visa-plus-payname-delete p a {font-weight: 400;font-size: 12px;line-height: 150%;letter-spacing: 0.216667px;color: #106EB8;}
.visa-plus-payname-delete .alert {max-width: 658px;}
.visa-plus-payname-delete .content {display: flex;align-items: center;gap: 16px;margin: 0 0 38px;}
.visa-plus-payname-delete .content .box {display: flex;flex-direction: column;align-items: center;justify-content: center;min-height: 180px;min-width: 302px;max-width: 302px;background: #FFFFFF;border: 1px dashed #D8DDE4;box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.0544894);border-radius: 4px;padding: 0 20px;}
.visa-plus-payname-delete .content .box p {font-weight: 400;font-size: 12px;line-height: 150%;color: #444444;margin: 0 0 6px;}
.visa-plus-payname-delete .content .box h3 {font-size: 16px;line-height: 150%;letter-spacing: 0.266667px;color: #222222;margin: 0;word-break: break-word;}
.visa-plus-payname-delete .img-holder {margin: -40px 0 0 20px;}
.visa-plus-payname-delete .btn {padding: 10px 20px;}
.visa-plus-payname-delete .btn.btn-orange {min-width: 198px;font-weight: 500;font-size: 14px;line-height: 129%;color: #FFFFFF;}
.visa-plus-payname-delete .btn.btn-light {min-width: 211px;margin: 0 0 0 10px;}

/*-----delete_my_visa-dialog-----*/

[aria-describedby="delete_my_visa_plus"] {min-width: 403px !important;}
.ui-dialog .ui-dialog-content.generic-dialog.delete_my_visa-dialog {display: flex;flex-direction: column;justify-content: center;align-items: center;text-align: center;padding: 40px !important;}
.ui-dialog .ui-dialog-content.generic-dialog.delete_my_visa-dialog h2 {font-weight: 700;font-size: 18px;line-height: 106%;text-align: center;color: #262626;margin: 23px 0 10px;}
.ui-dialog .ui-dialog-content.generic-dialog.delete_my_visa-dialog p {font-weight: 400;font-size: 15px;line-height: 153%;letter-spacing: 0.2px;color: #727272;margin: 0 0 16px;}
.ui-dialog .ui-dialog-content.generic-dialog.delete_my_visa-dialog .btns {margin: 32px 0 0 !important;}
.ui-dialog .ui-dialog-content.generic-dialog.delete_my_visa-dialog .btns .btn.btn-orange {min-width: 156px;padding: 10px 20px;}
.ui-dialog .ui-dialog-content.generic-dialog.delete_my_visa-dialog .btns .btn.btn-light {min-width: 145px;padding: 10px 20px;}

/*-----terms-conditions-dialog-----*/

.ui-dialog.terms-dialogs{position:relative}
.ui-dialog.terms-dialogs .ui-dialog-content.generic-dialog{padding: 30px !important;}
.ui-dialog.terms-dialogs .icon-cross{position:absolute;top:20px;right:20px;color:#c8c9cc;font-size:15px}
.ui-dialog.terms-dialogs .icon-cross:focus,.ui-dialog.terms-dialogs .icon-cross:hover{color:#777}
.ui-dialog.terms-dialogs .title{display:block;width:100%;text-align:center;margin:0 auto 30px!important;font-weight:500!important}
.ui-dialog.terms-dialogs .inner-box{border:1px solid #d8dde4;border-radius:4px;padding: 5px 0 5px 10px;}
.ui-dialog.terms-dialogs .inner-box>*{color:#444;font-size:13px;letter-spacing:.22px;font-weight:300}
.ui-dialog.terms-dialogs .slimScrollDiv{height:120px!important;max-height:120px!important}
.ui-dialog.terms-dialogs .custom-scroll{padding-right: 15px;height: 120px !important;}
.ui-dialog.terms-dialogs .custom-scroll a{text-decoration: underline !important;}
.ui-dialog.terms-dialogs .custom-scroll *{color:#444 !important;font-size:13px !important;letter-spacing:.22px !important;font-weight:300 !important;background: none !important;font-family: inherit !important;line-height: inherit !important;}
.ui-dialog.terms-dialogs .custom-scroll p,.ui-dialog.terms-dialogs .custom-scroll span{margin-bottom: .5rem !important;max-width: 100% !important;}

/*-----media-queries-----*/

@media (max-width: 1199px) {
    .visa-plus-payname-delete .content {gap: initial;justify-content: space-between;}
    .visa-plus-payname-delete .content .box {min-width: 45%;max-width: 45%;}
    .visa-plus-payname .img-holder img {width: 85%;height: auto !important;}
    .visa-plus-payname-enable .content {justify-content: space-between;gap: initial;}
    .visa-plus-payname-enable .content .box {min-width: 46%;max-width: 46%;}
    .visa-plus-payname-enable .how-it-works {max-width: 100%;}
    .visa-plus-payname-enable .agreement {max-width: 100%;}
    .visa-plus-payname-enable .img-holder {width: 100%;}
	.visa-plus-payname-enable .content #editablePayname.box .btn-orange {min-width: 100px;}
	.visa-plus-payname-enable .content #editablePayname.box .btn-light {min-width: 100px;}
    .visa-plus-payname-delete .img-holder {width: 100%;}
}

@media (max-width: 991px) {
    .visa-plus-payname {padding: 24px 25px 40px;}
    .visa-plus-payname-enable .row .col-lg-4 {display: none !important;}
	.visa-plus-payname-enable .alert {max-width: initial;}
	.visa-plus-payname-delete .alert {max-width: initial;}
}

@media (max-width: 767px) {
    .visa-plus-payname .visa-enabled {display: none;}
    .visa-plus-payname-enable .content {flex-direction: column;gap: 16px;}
    .visa-plus-payname-enable .content .box {min-width: 100%;max-width: 100%;}
    .visa-plus-payname-enable .content .link {transform: rotate(90deg);}
    .visa-plus-payname-delete .content {flex-direction: column;gap: 16px;}
    .visa-plus-payname-delete .content .box {min-width: 100%;max-width: 100%;}
    .visa-plus-payname-delete .content .link {transform: rotate(90deg);}
}

@media (max-width: 575px) {
    .visa-plus-payname {padding: 20px 15px 35px;}
    .visa-plus-payname h2 {font-size: 16px;margin: 0 0 25px;}
    .visa-plus-payname ul {padding: 0 0 0 15px;}
    .visa-plus-payname ul li {font-size: 12px;margin: 0 0 25px;}
    .visa-plus-payname ul li::before {left: -15px;top: 8px;width: 5px;height: 5px;}
    .visa-plus-payname ul li h3.heading {font-size: 14px;}
    .visa-plus-payname .btns div {width: 100%;display: flex;flex-direction: column;gap: 16px;}
    .visa-plus-payname .btns div:nth-of-type(2) { display: none;}
    .visa-plus-payname .btn {font-size: 13px;}
    .visa-plus-payname .btn.btn-light {margin: 0;}
    .visa-plus-payname-enable p {margin: 0 0 25px;}
    .visa-plus-payname-enable .how-it-works {padding: 15px 15px 13px;gap: 15px;}
    .visa-plus-payname-enable .how-it-works img {width: 55px;height: auto;}
    .visa-plus-payname-enable .agreement {padding: 15px 15px 13px;}
    .visa-plus-payname-success {padding: 40px 10px;}
    .visa-plus-payname-success h2 {font-size: 20px;}
    .visa-plus-payname-success p {font-size: 12px;}
    .visa-plus-payname-success .copy-payname {min-width: auto;margin: 35px 0 43px;padding: 27px 60px 25px;}
    .visa-plus-payname-success .copy-payname p {font-size: 15px;}
    .visa-plus-payname-success .copy-payname img {width: 85px;height: auto;}
    .visa-plus-payname-success .copy-payname button.copy {font-size: 11px;margin: 30px 0 0;}
    .visa-plus-payname-success .btns .btn.btn-light {margin: 0;}
    .visa-plus-payname-delete p {margin: 0 0 25px;}
    .ui-dialog .ui-dialog-content.generic-dialog.delete_my_visa-dialog {padding: 30px 15px !important;}
	.ui-dialog .ui-dialog-content.generic-dialog #visaPlusPaynameForm {width: 100%;}
	.ui-dialog .ui-dialog-content.generic-dialog .btns {width: 100%;display: flex;flex-direction: column;gap: 15px;}
    .ui-dialog .ui-dialog-content.generic-dialog .btns .btn {margin: 0;}
}