tf-checkout-react 1.6.6-beta.27 → 1.6.6-beta.29

package/dist/tf-checkout-styles.css

@@ -1 +1 @@
-.button-container{display:flex;justify-content:center;padding:20px}.billing-info-container{margin:0 auto;max-width:800px}.billing-info-container .is-half{width:49%}.billing-info-container p{color:#000}.billing-info-container .main-header{font-size:2rem;font-weight:600}.billing-info-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.billing-info-container__singleField{margin-top:15px}button{margin-top:10px}.account-actions-block{color:#182026;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif;margin-top:10px}.MuiButtonBase-root.MuiButton-root,.MuiButtonBase-root.MuiButton-root:hover,.login-register-button{background-color:#212529;border:#f28051;border-radius:5px;color:#fff;cursor:pointer;display:block;font-family:Inter-Bold;font-size:26px;font-weight:700;line-height:1.15;margin-top:10px;min-height:46px;outline:none;overflow:hidden;padding:14px 12px 12px;position:relative;text-align:center;text-overflow:ellipsis;text-transform:uppercase;width:49%}.logo-image-container{margin-top:5px;text-align:center;width:49%}.logo-image-container img{height:30px}.login-block{align-items:center;display:flex;flex-direction:column}.login-register-button:hover{background-color:#505050!important;border-color:#505050!important}.login-register-block{display:flex;justify-content:space-between}@media only screen and (max-width:820px){.billing-info-container{width:90%}.billing-info-container .main-header{font-size:1.5rem}}.email-checking{margin-bottom:15px}.timer{background-color:#000;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=);background-position:15px;background-repeat:no-repeat;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-moz-box-shadow:0 0 12px #999;-webkit-box-shadow:0 0 12px #999;box-shadow:0 0 12px #999;color:#fff;margin:0 0 6px;max-width:300px;overflow:hidden;padding:15px 15px 15px 50px;pointer-events:auto;position:absolute;right:15px;width:300px}.timer .close-icon{cursor:pointer;display:flex;position:absolute;right:10px;top:10px}.timer .countdown{font-weight:700;margin-top:10px}.forgot-password-modal .forgot-password-container{margin:0 auto;max-width:800px}.forgot-password-modal .title{background-color:#fff;font-family:Inter;font-size:18px;font-weight:700}.forgot-password-modal .forgot-password-container__singleField{margin-top:15px}.forgot-password-modal .forgot-password-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:10px;outline:none;padding:10px;text-transform:uppercase;width:100%}.forgot-password-modal .forgot-password-action-button button:hover:enabled{background-color:#505050;border-color:#505050}.forgot-password-modal .login{margin-top:10px;text-align:center}.forgot-password-modal .login span{cursor:pointer}.forgot-password-modal .login span:hover{text-decoration:underline}.forgot-password-modal button[disabled]{cursor:unset;opacity:.7}.modal-title{align-items:center;background-color:#fff;display:flex;font-family:Inter;font-size:18px;font-weight:700;height:49px;line-height:22px;padding-left:25px;position:relative}.login-modal-body{padding:15px 25px}.login-modal-body input{background:#fff!important}.login-modal-body__email,.login-modal-body__password{margin-bottom:20px}.login-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin:10px 0;outline:none;padding:10px;width:100%}.login-action-button button:hover{background-color:#505050;border-color:#505050}.server_auth__error{color:red;font-family:Inter;font-size:12px;font-style:normal;padding-left:25px;padding-top:15px}.info-text-for-login{font-size:14px;margin-bottom:4px;padding-left:10px}.forgot-password{text-align:center}.forgot-password span{cursor:pointer}.forgot-password span:hover{text-decoration:underline}.payment_page{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif}.payment_page .order_info_section{padding:15px 0}.payment_page .order_info_section .order_info_block{padding-bottom:15px;padding-top:15px}.payment_page .order_info_section .order_info_block .field-underline{border-bottom:1px solid #000;padding-bottom:15px}.payment_page .order_info_section .order_info_block .order_info_title{font-size:14px;font-weight:700;padding-bottom:3px}.payment_page .order_info_section .order_info_block .order_info_text{font-size:16px;line-height:1.15;outline:none}.payment_page .MuiBox-root{margin-left:auto;margin-right:auto;padding:20px;text-align:center}.payment_page .payment_info_label{padding:20px 0;text-align:center}.payment_page .payment_form{color:#fff;padding:20px}.payment_page .payment_form input,.payment_page .payment_form label{color:#fff}.payment_page .payment_button{padding-top:20px;text-align:center}.payment_page .payment_plan .payment_plan_block .payment_plan_text{padding-bottom:10px}.payment_page .payment_plan .payment_plan_highlight{font-weight:700}.card_form_inner{background:#232323;border-radius:8px;margin:0 auto 20px;min-width:325px;padding:15px;width:50%}.card_form_inner .card_label_text{color:#fff}.card_form_inner .StripeElement{margin:5px 0 10px}.card_label_text{color:#fff}.payment_button{padding-top:15px;text-align:center}.payment_button button{background-color:#212529;border-radius:8px;color:#fff;cursor:pointer;font-size:26px;padding:15px 30px;transition:opacity .5s;width:200px}.payment_button button:hover{opacity:.7}.disabled-payment-button button{opacity:.3;pointer-events:none;user-select:none}.checkout_error_block{color:#e53935;font-weight:600;padding:15px 0}.zip_element p{margin-bottom:0}.zip_element input{background-color:#000;border:none;color:#fff;font-size:18px;margin-top:5px;outline:none;width:100%}.signup-modal .signup-container{margin:0 auto;max-width:800px}.signup-modal .title{background-color:#fff;font-family:Inter;font-size:18px;font-weight:700}.signup-modal .signup-container .is-half{width:49%}.signup-modal .signup-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.signup-modal .signup-container__singleField{margin-top:15px}.signup-modal button{margin-top:10px}.signup-modal .signup-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:10px;outline:none;padding:10px;text-transform:uppercase;width:100%}.signup-modal .signup-action-button button:hover:enabled{background-color:#505050;border-color:#505050}.signup-modal .login{margin-top:10px;text-align:center}.signup-modal .login span{cursor:pointer}.signup-modal .login span:hover{text-decoration:underline}.signup-modal button[disabled]{cursor:unset;opacity:.7}.confirmation-page{margin:0 auto;max-width:1024px}.confirmation-page button{margin-top:inherit}.confirmation-page .strong-text{font-weight:700}.confirmation-page .title{color:#333;font-size:24px;font-weight:600}.confirmation-page .share-message-section{background:#dff0d8;border:1px solid #d6e9c6;border-radius:5px;color:#2c7221;display:flex;flex-direction:column;margin:20px 0;padding:15px}.confirmation-page .main{font-size:15px;font-weight:700}.confirmation-page .helper,.confirmation-page .main{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif}.confirmation-page .helper{font-size:14px;margin-top:5px}.confirmation-page .referral_text_image_section{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between;margin:20px 0}.confirmation-page .referral_text_section{margin:10px}.confirmation-page .referral_title_text{color:#f08057;font-size:28px;padding-bottom:10px}.confirmation-page .referral_text{font-size:18px}.confirmation-page .referral_text_image_section img{margin:10px;max-width:200px}.confirmation-page .share_wrapper{column-gap:5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:10px}.confirmation-page .invitation_title{font-size:22px;padding-bottom:12px;padding-top:12px}.confirmation-page .share_section{display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 -10px}.confirmation-page .invitation_section{flex:1 1;padding:0 5px}.confirmation-page .share_buttons{display:grid;flex-wrap:wrap;margin:0 -7px}.confirmation-page .convenient_buttons{margin-top:10px}.confirmation-page .social-media-btns{grid-gap:5px;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.confirmation-page .sharing-btn{background-color:#000;flex:1 1;min-width:130px}.confirmation-page .sharing-btn a{text-decoration:none}.confirmation-page .share-by-link{background:#000;color:#fff;padding:10px}.confirmation-page .share-by-link.label{margin:0;padding:0;text-align:left}.confirmation-page .share-btn-inner{align-items:center;background-color:#000;box-sizing:border-box;color:#fff;cursor:pointer;display:inline-flex;padding:0;text-align:left;width:100%}.confirmation-page .share-input{background-color:#fff;border:none;outline:none;padding:5px;text-align:left;width:300px}.confirmation-page .share-text{display:block;font-size:13px;font-weight:600;padding-top:8px;width:100%}.confirmation-page .pricing-section_wrapper{background:#e3e3e3;border:1px solid #dcdcdc;display:grid;grid-template-columns:1fr 1fr;margin:10px 0;padding:15px}.confirmation-page .pricing-section_label{font-weight:600}.confirmation-page .pricing-section_sublabel{font-size:14px;font-weight:100}.confirmation-page .pricing-section_price{font-weight:600;text-align:right}.confirmation-page .share-by-link-copy-icon{align-items:center;background-color:#32325d;border-radius:4px;color:#fff;cursor:pointer;display:flex;justify-content:center;margin-left:8px;padding:10px;transition:all .15s ease}.confirmation-page .share-by-link-copy-icon:hover{background-color:#505050}.confirmation-page .share-by-link-copy-icon img{width:14px}.confirmation-page .social-media-sharing{background-color:#000;color:#fff;cursor:pointer;padding:10px;text-align:center}.confirmation-page .share-icon{border-radius:4px;display:inline-flex}@media only screen and (max-width:1050px){.confirmation-page .share_wrapper{column-gap:0;display:grid;grid-template-columns:unset;margin:15px}}@media only screen and (max-width:480px){.confirmation-page .social-media-btns{grid-template-columns:unset}.confirmation-page .share-input{width:250px}}body{margin:0;padding:0}.event-detail__tier{background-color:#fff;padding:17px 35px 20px}.event-detail__tier-name{color:#000;font-family:Inter-Bold;font-family:Bebas Neue;font-size:.85rem;font-weight:700;letter-spacing:.2em;line-height:1.3;margin-bottom:8px;margin-top:16px;padding-right:20%;text-transform:uppercase}.event-detail__tier-status{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;margin-top:8px;width:100%}.event-detail__tier-status.ticket-button{background-color:#212529;border:3px solid #000;border-radius:0;color:#fff;cursor:pointer;font-weight:700;letter-spacing:.2em;line-height:1.5;margin-bottom:10px;width:200px}.event-tickets-container{align-items:center;display:flex;justify-content:space-between}.event-detail__tier-status.ticket-button.true{background-color:#c1c3c6;border-color:#afb0b1}.event-detail__tier-price{color:#000;font-family:Inter-Bold;font-size:1.5rem;line-height:1;text-align:center}.event-detail__tier-price p{margin:0}.event-detail__tier-price .fees{font-size:14px;margin-top:4px;text-align:left}.event-detail__tier-price .old-price{color:red;font-size:1.3rem;margin-bottom:5px;text-decoration:line-through}.alert-info{align-items:center;background-color:#d9edf7;border:1px solid #bce8f1;border-radius:4px;color:#3a87ad;display:flex;font-size:1em;justify-content:center;margin:0 35px;padding:8px 15px;text-shadow:0 1px 0 hsla(0,0%,100%,.5)}.alert-info svg{margin-right:4px}.event-detail__tier-state{color:#30bc9d;font-family:Inter-Bold;font-size:.75rem;font-weight:300;line-height:1;text-align:right;text-transform:uppercase}.event-detail__tier-state .ticket-not-started-message{color:#000;text-align:left;text-transform:none;width:50px}.promo-code-block input{font-size:14px;padding:1px 8px}.book-button{background-color:#212529;border:3px solid #000;border-radius:0;color:#fff;cursor:pointer;display:block;font-size:26px;font-weight:700;height:50px;letter-spacing:.2em;line-height:1.5;margin:25px auto 10px;text-align:center;width:100%}.book-button:hover{background-color:#505050;border-color:#505050}.loader-container{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.get-tickets-paper::-webkit-scrollbar{width:5px}.get-tickets-paper::-webkit-scrollbar-track{background:#f1f1f1}.get-tickets-paper::-webkit-scrollbar-thumb{background:#888}.get-tickets-paper::-webkit-scrollbar-thumb:hover{background:#555}.get-tickets .get-tickets__selectbox{width:100%}.disabled{pointer-events:none;user-select:none}.hidden{display:none}.event-closed-message{font-family:Bebas Neue;letter-spacing:.5px}.countdown p{margin:0}.countdown .title{font-weight:700}.countdown .message{font-weight:700;margin-top:20px}.waiting-list{padding:17px 35px 20px}.waiting-list .field-item{margin-bottom:30px}.waiting-list .waiting-list-button{width:100%!important}.waiting-list .waiting-list-button:hover{background-color:#505050}.waiting-list .success-message{margin-bottom:15px;text-align:center}.waiting-list .success-message p{margin:0}.waiting-list .no-tickets-text{font-weight:700;text-align:center}.waiting-list .added-success-message{font-size:22px;margin-bottom:10px}.my-ticket{padding:30px}.my-ticket-table{margin-top:30px}.my-ticket .loading{background-color:rgba(0,0,0,.4);height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%}.my-ticket .event-info,.my-ticket .loading{align-items:center;display:flex}.my-ticket thead th{font-weight:700}.my-ticket .event-info img{margin-right:10px;width:50px}.my-ticket .order-details-button{background-color:#32325d;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:10px 14px;transition:all .15s ease}.my-ticket .order-details-button:hover{background-color:#505050}.order-details{margin:0 auto;max-width:940px}.order-details .loading{align-items:center;background-color:rgba(0,0,0,.4);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1400}.order-details .layout-title{font-size:24px;font-weight:400}.order-details .sub-title{font-size:18px;font-weight:400;margin:10px 0}.order-details .order-summary-box{margin-top:30px}.order-details .total-row td,.order-details th{color:#fff;font-weight:700}.order-details .tickets-box{margin-top:30px}.order-details .ticket-add-on-table{background-color:#fcf8e3}.order-details .action-button{background-color:#212529;border:1px solid #fff;border-radius:0;color:#fff;cursor:pointer;display:block;font-family:Bebas Neue;font-size:14px;font-weight:400;line-height:normal;margin-bottom:20px;margin-top:20px;min-height:auto;outline:none;overflow:hidden;padding:12px;position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:uppercase;width:max-content}.order-details .download-button:hover{background-color:#505050}.order-details .personal-link{padding:20px 0}.order-details .total-referrer{padding:0 0 20px}.resale-modal .field-box{display:flex;margin-bottom:10px}.resale-modal .field-box .icon{align-items:center;display:flex;height:56px;justify-content:center;min-width:44px}.resale-modal .field-box .empty-box{min-width:44px}.resale-modal .resale-action-button button{background-color:#212529;color:#fff;cursor:pointer;width:100%}.resale-modal .resale-action-button button[disabled]{opacity:.7}.resale-modal .resale-action-button button:hover{background-color:#505050;border-color:#505050;width:100%}.reset-password{margin:0 auto;max-width:300px;padding:14px}.reset-password .title{font-size:20px;font-weight:700}.reset-password .field-item{margin-top:14px}.reset-password .action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:14px;outline:none;padding:10px;text-transform:uppercase;width:100%}.reset-password .action-button button:hover:enabled{background-color:#505050;border-color:#505050}.reset-password .action-button button[disabled]{cursor:unset;opacity:.7}
+.button-container{display:flex;justify-content:center;padding:20px}.billing-info-container{margin:0 auto;max-width:800px}.billing-info-container .is-half{width:49%}.billing-info-container p{color:#000}.billing-info-container .main-header{font-size:2rem;font-weight:600}.billing-info-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.billing-info-container__singleField{margin-top:15px}button{margin-top:10px}.account-actions-block{color:#182026;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif;margin-top:10px}.MuiButtonBase-root.MuiButton-root,.MuiButtonBase-root.MuiButton-root:hover,.login-register-button{background-color:#212529;border:#f28051;border-radius:5px;color:#fff;cursor:pointer;display:block;font-family:Inter-Bold;font-size:26px;font-weight:700;line-height:1.15;margin-top:10px;min-height:46px;outline:none;overflow:hidden;padding:14px 12px 12px;position:relative;text-align:center;text-overflow:ellipsis;text-transform:uppercase;width:49%}.logo-image-container{margin-top:5px;text-align:center;width:49%}.logo-image-container img{height:30px}.login-block{align-items:center;display:flex;flex-direction:column}.login-register-button:hover{background-color:#505050!important;border-color:#505050!important}.login-register-block{display:flex;justify-content:space-between}@media only screen and (max-width:820px){.billing-info-container{width:90%}.billing-info-container .main-header{font-size:1.5rem}}.email-checking{margin-bottom:15px}.timer{background-color:#000;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=);background-position:15px;background-repeat:no-repeat;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-moz-box-shadow:0 0 12px #999;-webkit-box-shadow:0 0 12px #999;box-shadow:0 0 12px #999;color:#fff;margin:0 0 6px;max-width:300px;overflow:hidden;padding:15px 15px 15px 50px;pointer-events:auto;position:absolute;right:15px;width:300px}.timer .close-icon{cursor:pointer;display:flex;position:absolute;right:10px;top:10px}.timer .countdown{font-weight:700;margin-top:10px}.forgot-password-modal .forgot-password-container{margin:0 auto;max-width:800px}.forgot-password-modal .title{background-color:#fff;font-family:Inter;font-size:18px;font-weight:700}.forgot-password-modal .forgot-password-container__singleField{margin-top:15px}.forgot-password-modal .forgot-password-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:10px;outline:none;padding:10px;text-transform:uppercase;width:100%}.forgot-password-modal .forgot-password-action-button button:hover:enabled{background-color:#505050;border-color:#505050}.forgot-password-modal .login{margin-top:10px;text-align:center}.forgot-password-modal .login span{cursor:pointer}.forgot-password-modal .login span:hover{text-decoration:underline}.forgot-password-modal button[disabled]{cursor:unset;opacity:.7}.modal-title{align-items:center;background-color:#fff;display:flex;font-family:Inter;font-size:18px;font-weight:700;height:49px;line-height:22px;padding-left:25px;position:relative}.login-modal-body{padding:15px 25px}.login-modal-body input{background:#fff!important}.login-modal-body__email,.login-modal-body__password{margin-bottom:20px}.login-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin:10px 0;outline:none;padding:10px;width:100%}.login-action-button button:hover{background-color:#505050;border-color:#505050}.login-logo-tff{height:60px}.server_auth__error{color:red;font-family:Inter;font-size:12px;font-style:normal;padding-left:25px;padding-top:15px}.info-text-for-login{font-size:14px;margin-bottom:4px;padding-left:10px}.forgot-password{text-align:center}.forgot-password span{cursor:pointer}.forgot-password span:hover{text-decoration:underline}.payment_page{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif}.payment_page .order_info_section{padding:15px 0}.payment_page .order_info_section .order_info_block{padding-bottom:15px;padding-top:15px}.payment_page .order_info_section .order_info_block .field-underline{border-bottom:1px solid #000;padding-bottom:15px}.payment_page .order_info_section .order_info_block .order_info_title{font-size:14px;font-weight:700;padding-bottom:3px}.payment_page .order_info_section .order_info_block .order_info_text{font-size:16px;line-height:1.15;outline:none}.payment_page .MuiBox-root{margin-left:auto;margin-right:auto;padding:20px;text-align:center}.payment_page .payment_info_label{padding:20px 0;text-align:center}.payment_page .payment_form{color:#fff;padding:20px}.payment_page .payment_form input,.payment_page .payment_form label{color:#fff}.payment_page .payment_button{padding-top:20px;text-align:center}.payment_page .payment_plan .payment_plan_block .payment_plan_text{padding-bottom:10px}.payment_page .payment_plan .payment_plan_highlight{font-weight:700}.mobile-order-summary{display:none}@media (max-width:767px){.mobile-order-summary{background-color:#f8f8f8;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1);display:block;margin-bottom:15px}.mobile-order-summary-content{align-items:flex-start;cursor:pointer;display:flex;padding:15px}.mobile-order-info-container:after{content:"⌃";display:inline-block;float:right;font-size:15px;font-weight:900;left:6px;position:relative;top:-2px;transform:rotate(180deg);transition:transform .25s,top .25s}.mobile-order-info-container.open:after{top:2px;transform:rotate(0deg)}.mobile-order-info-container.order-info-container-left{text-align:left}.mobile-order-info-container.order-info-container-right{text-align:right}.mobile-order-icon{color:#1976d2;margin-right:15px;padding-top:2px}.mobile-order-info{flex:1}.mobile-order-text{color:#666;font-size:14px;margin-bottom:4px}.mobile-order-total{color:#333;font-size:18px;font-weight:700;margin-bottom:8px}.mobile-order-timer{align-items:center;border-top:1px dashed #ddd;display:flex;margin-top:8px;padding-top:8px}.mobile-timer-icon{color:#f44336;margin-right:8px}.mobile-timer-text{color:#666;font-size:13px}.mobile-timer-countdown{color:#f44336;font-weight:700}.mobile-order-expand{color:#666;padding-top:2px}.order_info_section.collapsed{display:none!important}.order_info_section.expanded{display:grid!important;margin-top:10px}}.card_form_inner{background:#232323;border-radius:8px;margin:0 auto 20px;min-width:325px;padding:15px;width:50%}.card_form_inner .card_label_text{color:#fff}.card_form_inner .StripeElement{margin:5px 0 10px}.card_label_text{color:#fff}.payment_button{padding-top:15px;text-align:center}.payment_button button{background-color:#212529;border-radius:8px;color:#fff;cursor:pointer;font-size:26px;padding:15px 30px;transition:opacity .5s;width:200px}.payment_button button:hover{opacity:.7}.disabled-payment-button button{opacity:.3;pointer-events:none;user-select:none}.checkout_error_block{color:#e53935;font-weight:600;padding:15px 0}.zip_element p{margin-bottom:0}.zip_element input{background-color:#000;border:none;color:#fff;font-size:18px;margin-top:5px;outline:none;width:100%}.signup-modal .signup-container{margin:0 auto;max-width:800px}.signup-modal .title{background-color:#fff;font-family:Inter;font-size:18px;font-weight:700}.signup-modal .signup-container .is-half{width:49%}.signup-modal .signup-container__twoFields{display:flex;justify-content:space-between;margin-top:15px}.signup-modal .signup-container__singleField{margin-top:15px}.signup-modal button{margin-top:10px}.signup-modal .signup-action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:10px;outline:none;padding:10px;text-transform:uppercase;width:100%}.signup-modal .signup-action-button button:hover:enabled{background-color:#505050;border-color:#505050}.signup-modal .login{margin-top:10px;text-align:center}.signup-modal .login span{cursor:pointer}.signup-modal .login span:hover{text-decoration:underline}.signup-modal button[disabled]{cursor:unset;opacity:.7}.confirmation-page{margin:0 auto;max-width:1024px}.confirmation-page button{margin-top:inherit}.confirmation-page .strong-text{font-weight:700}.confirmation-page .title{color:#333;font-size:24px;font-weight:600}.confirmation-page .share-message-section{background:#dff0d8;border:1px solid #d6e9c6;border-radius:5px;color:#2c7221;display:flex;flex-direction:column;margin:20px 0;padding:15px}.confirmation-page .main{font-size:15px;font-weight:700}.confirmation-page .helper,.confirmation-page .main{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,Icons16,sans-serif}.confirmation-page .helper{font-size:14px;margin-top:5px}.confirmation-page .referral_text_image_section{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between;margin:20px 0}.confirmation-page .referral_text_section{margin:10px}.confirmation-page .referral_title_text{color:#f08057;font-size:28px;padding-bottom:10px}.confirmation-page .referral_text{font-size:18px}.confirmation-page .referral_text_image_section img{margin:10px;max-width:200px}.confirmation-page .share_wrapper{column-gap:5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:10px}.confirmation-page .invitation_title{font-size:22px;padding-bottom:12px;padding-top:12px}.confirmation-page .share_section{display:flex;flex-wrap:wrap;justify-content:space-between;margin:0 -10px}.confirmation-page .invitation_section{flex:1 1;padding:0 5px}.confirmation-page .share_buttons{display:grid;flex-wrap:wrap;margin:0 -7px}.confirmation-page .convenient_buttons{margin-top:10px}.confirmation-page .social-media-btns{grid-gap:5px;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.confirmation-page .sharing-btn{background-color:#000;flex:1 1;min-width:130px}.confirmation-page .sharing-btn a{text-decoration:none}.confirmation-page .share-by-link{background:#000;color:#fff;padding:10px}.confirmation-page .share-by-link.label{margin:0;padding:0;text-align:left}.confirmation-page .share-btn-inner{align-items:center;background-color:#000;box-sizing:border-box;color:#fff;cursor:pointer;display:inline-flex;padding:0;text-align:left;width:100%}.confirmation-page .share-input{background-color:#fff;border:none;outline:none;padding:5px;text-align:left;width:300px}.confirmation-page .share-text{display:block;font-size:13px;font-weight:600;padding-top:8px;width:100%}.confirmation-page .pricing-section_wrapper{background:#e3e3e3;border:1px solid #dcdcdc;display:grid;grid-template-columns:1fr 1fr;margin:10px 0;padding:15px}.confirmation-page .pricing-section_label{font-weight:600}.confirmation-page .pricing-section_sublabel{font-size:14px;font-weight:100}.confirmation-page .pricing-section_price{font-weight:600;text-align:right}.confirmation-page .share-by-link-copy-icon{align-items:center;background-color:#32325d;border-radius:4px;color:#fff;cursor:pointer;display:flex;justify-content:center;margin-left:8px;padding:10px;transition:all .15s ease}.confirmation-page .share-by-link-copy-icon:hover{background-color:#505050}.confirmation-page .share-by-link-copy-icon img{width:14px}.confirmation-page .social-media-sharing{background-color:#000;color:#fff;cursor:pointer;padding:10px;text-align:center}.confirmation-page .share-icon{border-radius:4px;display:inline-flex}@media only screen and (max-width:1050px){.confirmation-page .share_wrapper{column-gap:0;display:grid;grid-template-columns:unset;margin:15px}}@media only screen and (max-width:480px){.confirmation-page .social-media-btns{grid-template-columns:unset}.confirmation-page .share-input{width:250px}}body{margin:0;padding:0}.event-detail__tier{background-color:#fff;padding:17px 35px 20px}.event-detail__tier-name{color:#000;font-family:Inter-Bold;font-family:Bebas Neue;font-size:.85rem;font-weight:700;letter-spacing:.2em;line-height:1.3;margin-bottom:8px;margin-top:16px;padding-right:20%;text-transform:uppercase}.event-detail__tier-status{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;margin-top:8px;width:100%}.event-detail__tier-status.ticket-button{background-color:#212529;border:3px solid #000;border-radius:0;color:#fff;cursor:pointer;font-weight:700;letter-spacing:.2em;line-height:1.5;margin-bottom:10px;width:200px}.event-tickets-container{align-items:center;display:flex;justify-content:space-between}.event-detail__tier-status.ticket-button.true{background-color:#c1c3c6;border-color:#afb0b1}.event-detail__tier-price{color:#000;font-family:Inter-Bold;font-size:1.5rem;line-height:1;text-align:center}.event-detail__tier-price p{margin:0}.event-detail__tier-price .fees{font-size:14px;margin-top:4px;text-align:left}.event-detail__tier-price .old-price{color:red;font-size:1.3rem;margin-bottom:5px;text-decoration:line-through}.alert-info{align-items:center;background-color:#d9edf7;border:1px solid #bce8f1;border-radius:4px;color:#3a87ad;display:flex;font-size:1em;justify-content:center;margin:0 35px;padding:8px 15px;text-shadow:0 1px 0 hsla(0,0%,100%,.5)}.alert-info svg{margin-right:4px}.event-detail__tier-state{color:#30bc9d;font-family:Inter-Bold;font-size:.75rem;font-weight:300;line-height:1;text-align:right;text-transform:uppercase}.event-detail__tier-state .ticket-not-started-message{color:#000;text-align:left;text-transform:none;width:50px}.promo-code-block input{font-size:14px;padding:1px 8px}.book-button{background-color:#212529;border:3px solid #000;border-radius:0;color:#fff;cursor:pointer;display:block;font-size:26px;font-weight:700;height:50px;letter-spacing:.2em;line-height:1.5;margin:25px auto 10px;text-align:center;width:100%}.book-button:hover{background-color:#505050;border-color:#505050}.loader-container{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.get-tickets-paper::-webkit-scrollbar{width:5px}.get-tickets-paper::-webkit-scrollbar-track{background:#f1f1f1}.get-tickets-paper::-webkit-scrollbar-thumb{background:#888}.get-tickets-paper::-webkit-scrollbar-thumb:hover{background:#555}.get-tickets .get-tickets__selectbox{width:100%}.disabled{pointer-events:none;user-select:none}.hidden{display:none}.event-closed-message{font-family:Bebas Neue;letter-spacing:.5px}.countdown p{margin:0}.countdown .title{font-weight:700}.countdown .message{font-weight:700;margin-top:20px}.waiting-list{padding:17px 35px 20px}.waiting-list .field-item{margin-bottom:30px}.waiting-list .waiting-list-button{width:100%!important}.waiting-list .waiting-list-button:hover{background-color:#505050}.waiting-list .success-message{margin-bottom:15px;text-align:center}.waiting-list .success-message p{margin:0}.waiting-list .no-tickets-text{font-weight:700;text-align:center}.waiting-list .added-success-message{font-size:22px;margin-bottom:10px}.my-ticket{padding:30px}.my-ticket-table{margin-top:30px}.my-ticket .loading{background-color:rgba(0,0,0,.4);height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%}.my-ticket .event-info,.my-ticket .loading{align-items:center;display:flex}.my-ticket thead th{font-weight:700}.my-ticket .event-info img{margin-right:10px;width:50px}.my-ticket .order-details-button{background-color:#32325d;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:10px 14px;transition:all .15s ease}.my-ticket .order-details-button:hover{background-color:#505050}.order-details{margin:0 auto;max-width:940px}.order-details .loading{align-items:center;background-color:rgba(0,0,0,.4);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1400}.order-details .layout-title{font-size:24px;font-weight:400}.order-details .sub-title{font-size:18px;font-weight:400;margin:10px 0}.order-details .order-summary-box{margin-top:30px}.order-details .total-row td,.order-details th{color:#fff;font-weight:700}.order-details .tickets-box{margin-top:30px}.order-details .ticket-add-on-table{background-color:#fcf8e3}.order-details .action-button{background-color:#212529;border:1px solid #fff;border-radius:0;color:#fff;cursor:pointer;display:block;font-family:Bebas Neue;font-size:14px;font-weight:400;line-height:normal;margin-bottom:20px;margin-top:20px;min-height:auto;outline:none;overflow:hidden;padding:12px;position:relative;text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:uppercase;width:max-content}.order-details .download-button:hover{background-color:#505050}.order-details .personal-link{padding:20px 0}.order-details .total-referrer{padding:0 0 20px}.resale-modal .field-box{display:flex;margin-bottom:10px}.resale-modal .field-box .icon{align-items:center;display:flex;height:56px;justify-content:center;min-width:44px}.resale-modal .field-box .empty-box{min-width:44px}.resale-modal .resale-action-button button{background-color:#212529;color:#fff;cursor:pointer;width:100%}.resale-modal .resale-action-button button[disabled]{opacity:.7}.resale-modal .resale-action-button button:hover{background-color:#505050;border-color:#505050;width:100%}.reset-password{margin:0 auto;max-width:300px;padding:14px}.reset-password .title{font-size:20px;font-weight:700}.reset-password .field-item{margin-top:14px}.reset-password .action-button button{background-color:#212529;border:none;border-radius:0;color:#fff;cursor:pointer;font-size:26px;font-weight:600;height:45px;line-height:18px;margin-top:14px;outline:none;padding:10px;text-transform:uppercase;width:100%}.reset-password .action-button button:hover:enabled{background-color:#505050;border-color:#505050}.reset-password .action-button button[disabled]{cursor:unset;opacity:.7}

package/dist/utils/getDomain.d.ts

@@ -1 +1 @@
-export declare function getDomain(url: string, subdomain?: string): string;
+export declare function getDomain(url: string, subdomain?: string, publicSuffix?: string): string;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.6.6-beta.27",
+  "version": "1.6.6-beta.29",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -111,4 +111,4 @@
     "tf-seat-map-view": "9.4.7-beta.33",
     "yup": "^0.32.11"
   }
-}
+}

package/src/components/addonsContainer/SimpleAddonsContainer.tsx

@@ -199,6 +199,10 @@ export const SimpleAddonsContainer = ({
     )
   }
 
+  if (addons?.length === 0) {
+    return null
+  }
+
   return (
     <div className={`${classNamePrefix}_container`}>
       <div className={`${classNamePrefix}_block`}>

package/src/components/addonsContainer/index.tsx

@@ -305,6 +305,10 @@ export const AddonsContainter = ({
     )
   }
 
+  if (addons?.length === 0) {
+    return null
+  }
+
   const params = new URL(`${window.location}`).searchParams
   const addOnIsIncluded = params.get('include_add_on') === 'true'
   const isResale = params.get('resale') === 'true'

package/src/components/billing-info-container/index.tsx

@@ -97,6 +97,7 @@ export interface IBillingInfoPage {
   onCheckoutUpdateError?: (e: AxiosError) => void;
   initialValues?: FormikValues;
   buttonName?: string;
+  freeOrderButtonName?: string;
   theme?: 'light' | 'dark';
   isLoggedIn?: boolean;
   accountInfoTitle?: string | JSX.Element;
@@ -228,6 +229,7 @@ const BillingInfoContainer = React.memo(
     },
     initialValues = {},
     buttonName = 'Submit',
+    freeOrderButtonName = 'Complete Registration',
     handleSubmit = _identity,
     theme = 'light',
     onRegisterSuccess = _identity,
@@ -384,12 +386,16 @@ const BillingInfoContainer = React.memo(
     const [pendingVerificationMessage, setPendingVerificationMessage] = useState<string>()
     const [reviewData, setReviewData] = useState<any>({})
     const [checkoutData, setCheckoutData] = useState<any>({})
+    const [checkoutUpdateData, setCheckoutUpdateData] = useState<any>({})
     const prevData = useRef(data)
 
     const addAddOnsInAttributes = useCallback((checkoutBody: any) => {
       const selectedAddOns = window.localStorage.getItem('add_ons') || '{}'
       checkoutBody.attributes.add_ons = JSON.parse(selectedAddOns)
     }, [])
+    const [singleCheckoutAddons, setSingleCheckoutAddOns] = useState<any>({})
+
+    const orderIsFree = !Number(checkoutData?.total)
 
     useEffect(() => {
       const hasUniqueId = _get(dataWithUniqueIds, '[0].uniqueId')
@@ -500,6 +506,28 @@ const BillingInfoContainer = React.memo(
       fetchCart()
     }, [isLoggedIn])
 
+    useEffect(() => {
+      const fetchCheckoutUpdate = async () => {
+        if (!eventId) return
+
+        try {
+          const checkoutUpdateResponse = await updateCheckout({
+            attributes: {
+              event_id: eventId,
+            },
+          })
+
+          if (checkoutUpdateResponse.success) {
+            setCheckoutUpdateData(checkoutUpdateResponse.data.attributes)
+          }
+        } catch (error) {
+          console.error('Failed to fetch checkout update:', error)
+        }
+      }
+
+      fetchCheckoutUpdate()
+    }, [eventId])
+
     useEffect(() => {
       const collectPaymentData = async () => {
         if (
@@ -636,11 +664,23 @@ const BillingInfoContainer = React.memo(
       async (addOns: { [key: string]: number } = {}) => {
         if (!isSinglePageCheckout) return
 
+        const mergedAddOns = { ...singleCheckoutAddons }
+
+        // Update existing entries and add new ones
+        Object.entries(addOns).forEach(([key, value]) => {
+          const amount = Number(value)
+          if (amount) {
+            mergedAddOns[key] = amount
+          } else {
+            delete mergedAddOns[key]
+          }
+        })
+
         try {
           const checkoutUpdateData = {
             attributes: {
               event_id: eventId,
-              add_ons: addOns,
+              add_ons: mergedAddOns,
             },
           }
 
@@ -651,6 +691,7 @@ const BillingInfoContainer = React.memo(
               _get(checkoutResponse, 'data.attributes.cart_price_breakdown', {})
             )
             onCheckoutUpdateSuccess(checkoutResponse.data.attributes)
+            setSingleCheckoutAddOns(mergedAddOns)
           }
         } catch (error) {
           const errorMessage = _get(
@@ -679,10 +720,7 @@ const BillingInfoContainer = React.memo(
 
         // Create updated add-ons object
         const updatedAddOns: { [key: string]: number } = {}
-
-        if (quantity > 0) {
-          updatedAddOns[addonId] = quantity
-        }
+        updatedAddOns[addonId] = quantity
 
         // Call handleAddOnSelect with the updated addons object
         handleAddOnSelect(updatedAddOns)
@@ -707,6 +745,10 @@ const BillingInfoContainer = React.memo(
       dataWithUniqueIds[0].label = 'Get Your Tables'
     }
 
+    const stripePublishableKey =
+      reviewData?.payment_method?.stripe_publishable_key ||
+      checkoutUpdateData?.additional_payment_information?.basic_config?.apiKey
+
     return (
       <ThemeProvider theme={themeMui}>
         {(loading || cardLoading || isCountriesLoading || isConfigLoading) && (
@@ -748,7 +790,7 @@ const BillingInfoContainer = React.memo(
             enableReinitialize={false}
             onSubmit={async (values, formikHelpers) => {
               try {
-                if (!cardRef.current || !stripeRef.current) {
+                if ((!cardRef.current || !stripeRef.current) && !orderIsFree) {
                   setError('Fill in the card details')
                   return
                 }
@@ -852,10 +894,14 @@ const BillingInfoContainer = React.memo(
 
                 const checkoutBody = collectCheckoutBody(values, userDataObj)
 
-                if (isBrowser) {
+                if (isBrowser && !isSinglePageCheckout) {
                   addAddOnsInAttributes(checkoutBody)
                 }
 
+                if (isSinglePageCheckout) {
+                  checkoutBody.attributes.add_ons = singleCheckoutAddons
+                }
+
                 const checkoutResponse = await postOnCheckout(
                   checkoutBody,
                   flagFreeTicket
@@ -867,6 +913,8 @@ const BillingInfoContainer = React.memo(
                   },
                 })
 
+                let paymentResponse = null
+
                 if (isSinglePageCheckout) {
                   const { hash, total } = checkoutResponse.data.attributes
                   const paymentDataResponse = await getPaymentData(String(hash))
@@ -904,21 +952,23 @@ const BillingInfoContainer = React.memo(
                     const paymentMethod = attributes.payment_method || {}
                     const paymentPlanAvailable = paymentMethod.stripe_payment_plan_enabled
 
-                    const card = cardRef.current
-                    const paymentMethodReq = await stripeRef.current.createPaymentMethod({
-                      type: 'card',
-                      card: card || { token: '' },
-                      billing_details: {
-                        address: addressRef.current,
-                      },
-                    })
+                    if (!isFreeTickets) {
+                      const card = cardRef.current
+                      const paymentMethodReq = await stripeRef.current.createPaymentMethod({
+                        type: 'card',
+                        card: card || { token: '' },
+                        billing_details: {
+                          address: addressRef.current,
+                        },
+                      })
 
-                    await stripeRef.current.confirmCardPayment(
-                      paymentMethod.stripe_client_secret,
-                      {
-                        payment_method: paymentMethodReq.paymentMethod.id,
-                      }
-                    )
+                      await stripeRef.current.confirmCardPayment(
+                        paymentMethod.stripe_client_secret,
+                        {
+                          payment_method: paymentMethodReq.paymentMethod.id,
+                        }
+                      )
+                    }
 
                     await handlePaymentMiddleWare(
                       null,
@@ -928,13 +978,17 @@ const BillingInfoContainer = React.memo(
                         isFreeTickets,
                         paymentPlanIsAvailable: paymentPlanAvailable,
                         showPaymentPlanSection: true,
-                        handlePayment: _identity,
+                        handlePayment: (data: any) => {
+                          paymentResponse = data
+                        },
                         setPaymentIsLoading: _identity,
                         setError: _identity,
                         orderData: updatedOrderData,
                         eventId,
                         isBrowser,
-                        onPaymentError: _identity,
+                        onPaymentError: (error: any) => {
+                          throw error
+                        },
                       }
                     )
                   }
@@ -946,7 +1000,8 @@ const BillingInfoContainer = React.memo(
                   formikHelpers as FormikHelpers<any>,
                   eventId,
                   checkoutResponse,
-                  checkoutUpdateResponse
+                  checkoutUpdateResponse,
+                  paymentResponse
                 )
               } catch (e) {
                 setLoading(false)
@@ -1013,7 +1068,7 @@ const BillingInfoContainer = React.memo(
                       onErrorClose()
                     }}
                   />
-                  {!isLoggedIn && (
+                  {!isLoggedIn && !isSinglePageCheckout && (
                     <div className="account-actions-block">
                       <div className="action-item">
                         <div>{accountInfoTitle}</div>
@@ -1239,8 +1294,9 @@ const BillingInfoContainer = React.memo(
                       ))}
                     </div>
                   )}
-                  {isSinglePageCheckout && (
+                  {isSinglePageCheckout && !orderIsFree && stripePublishableKey && (
                     <PaymentContainer
+                      stripePublishableKey={stripePublishableKey}
                       formTitle="Payment Information"
                       orderInfoLabel=""
                       enableTimer={false}
@@ -1312,7 +1368,8 @@ const BillingInfoContainer = React.memo(
                       className="login-register-button"
                       disabled={props.isSubmitting || phoneValidationIsLoading}
                     >
-                      {props.isSubmitting ? <CircularProgress size={26} /> : buttonName}
+                      {props.isSubmitting ?
+                        <CircularProgress size={26} /> : (orderIsFree ? freeOrderButtonName : buttonName)}
                     </Button>
                   </div>
                 </div>

package/src/components/common/SnackbarAlert.tsx

@@ -1,15 +1,15 @@
-import React from 'react'
 import { Alert, AlertColor, Snackbar, SnackbarOrigin } from '@mui/material'
+import React from 'react'
 
 interface ISnackbarAlertProps {
-  isOpen: boolean
-  message: string
-  type: AlertColor
-  position?: SnackbarOrigin
-  autoHideDuration?: number
-  variant?: 'filled' | 'standard' | 'outlined'
+  isOpen: boolean;
+  message: string;
+  type: AlertColor;
+  position?: SnackbarOrigin;
+  autoHideDuration?: number;
+  variant?: 'filled' | 'standard' | 'outlined';
 
-  onClose: () => void
+  onClose: () => void;
 }
 
 const SnackbarAlert = ({
@@ -20,35 +20,33 @@ const SnackbarAlert = ({
   autoHideDuration = 3000,
   variant,
   onClose,
-}: ISnackbarAlertProps) => {
-  return (
-    <div className="snackbar-alert-container">
-      <Snackbar
-        autoHideDuration={autoHideDuration}
-        open={isOpen}
-        anchorOrigin={position || { vertical: 'top', horizontal: 'center' }}
+}: ISnackbarAlertProps) => (
+  <div className="snackbar-alert-container">
+    <Snackbar
+      autoHideDuration={autoHideDuration}
+      open={isOpen}
+      anchorOrigin={position || { vertical: 'top', horizontal: 'center' }}
+      onClose={onClose}
+      classes={{
+        root: 'snackbar-alert-snackbar-root',
+      }}
+    >
+      <Alert
+        severity={type}
         onClose={onClose}
+        variant={variant || 'filled'}
         classes={{
-          root: 'snackbar-alert-snackbar-root',
+          icon: 'snackbar-alert-icon',
+          root: 'snackbar-alert-alert-root',
+          action: 'snackbar-alert-action',
+          message: 'snackbar-alert-message',
+          filled: 'snackbar-alert-filled',
         }}
       >
-        <Alert
-          severity={type}
-          onClose={onClose}
-          variant={variant || 'filled'}
-          classes={{
-            icon: 'snackbar-alert-icon',
-            root: 'snackbar-alert-alert-root',
-            action: 'snackbar-alert-action',
-            message: 'snackbar-alert-message',
-            filled: 'snackbar-alert-filled',
-          }}
-        >
-          {message}
-        </Alert>
-      </Snackbar>
-    </div>
-  )
-}
+        {message}
+      </Alert>
+    </Snackbar>
+  </div>
+)
 
 export default SnackbarAlert

package/src/components/loginModal/style.css

@@ -46,7 +46,9 @@
   background-color: #505050;
   border-color: #505050;
 }
-
+.login-logo-tff{
+    height: 60px;
+}
 .server_auth__error {
     color: red;
     padding-left: 25px;

package/src/components/myTicketsContainer/index.tsx

@@ -31,6 +31,7 @@ interface MyTicketsTypes {
   selectEventsLabel?: string;
   openLoginModal?: () => void;
   hideDetailsButton?: boolean;
+  customNoOrderContent?: React.ReactNode;
   columns?: IColumnData[];
 }
 
@@ -49,6 +50,7 @@ export const MyTicketsContainer = ({
   hideDetailsButton = false,
   columns = [],
   openLoginModal,
+  customNoOrderContent = null,
 }: MyTicketsTypes) => {
   const [data, setData] = useState<any>(null)
   const [loading, setLoading] = useState(true)
@@ -110,6 +112,15 @@ export const MyTicketsContainer = ({
     setFilter(eventFilter?.url_name || '')
   }
 
+  const noOrderContent = customNoOrderContent || (<div className="no_orders_section">
+    <div className="nodata_title">
+      You have no current ticket orders on this account
+    </div>
+    <div className="nodata_subtitle">
+      Discover your next nite out <a href="/events">here</a>.
+    </div>
+  </div>)
+
   return (
     <div className={`my-ticket ${theme}`}>
       <>
@@ -191,14 +202,7 @@ export const MyTicketsContainer = ({
         !loading && (
           <>
             <h2>My Ticket Orders</h2>
-            <div className="no_orders_section">
-              <div className="nodata_title">
-                You have no current ticket orders on this account
-              </div>
-              <div className="nodata_subtitle">
-                Discover your next nite out <a href="/events">here</a>.
-              </div>
-            </div>
+            {noOrderContent}
           </>
         )
       )}

package/src/components/paymentContainer/OrderDetails.tsx

@@ -2,21 +2,61 @@
 import _identity from 'lodash/identity'
 import _isEmpty from 'lodash/isEmpty'
 import _map from 'lodash/map'
-import React from 'react'
+import React, { useState } from 'react'
 
 import { FEES_STYLES } from '../../constants'
 import { createFixedFloatNormalizer, currencyNormalizerCreator } from '../../normalizers'
 import { IOrderData } from '../../types'
 import { CONFIGS } from '../../utils'
 
-export const OrderDetails = ({ orderData = {}, paymentFieldsData = [] }: any) => {
+interface OrderDetailsProps {
+  orderData: any;
+  paymentFieldsData: any[];
+  customMobileText?: string;
+}
+
+export const OrderDetails = ({ 
+  orderData = {}, 
+  paymentFieldsData = [],
+  customMobileText = 'Your order total'
+}: OrderDetailsProps) => {
   const { currency, guest_count } = orderData
   const hasTableTypes = Boolean(Number(guest_count))
+  const [isExpanded, setIsExpanded] = useState(false)
+
+  // Find the total field to display in the mobile view
+  const totalField = paymentFieldsData.find(field => field.id === 'total')
+  const totalValue = totalField && orderData.total 
+    ? totalField.normalizer 
+      ? totalField.normalizer(orderData.total, currency, orderData)
+      : orderData.total
+    : ''
+
+  const toggleExpand = () => {
+    setIsExpanded(!isExpanded)
+  }
 
   return (
     <div className="payment_page payment_page_single">
+      {/* Mobile view summary */}
+      <div className="mobile-order-summary">
+        <div className="mobile-order-summary-content" onClick={toggleExpand}>
+          <div className="mobile-order-info">
+            <div className={`mobile-order-info-container order-info-container-left ${isExpanded ? 'open' : ''}`}>
+              <div className="mobile-order-text">{customMobileText}</div>
+            </div>
+            {!isExpanded && (
+              <div className="mobile-order-info-container order-info-container-right">
+                <div className="mobile-order-total">{totalValue}</div>
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+
+      {/* Original content - will be hidden on mobile when collapsed */}
       <div
-        className="order_info_section"
+        className={`order_info_section ${isExpanded ? 'expanded' : 'collapsed'}`}
         style={{ display: hasTableTypes ? 'block' : 'grid' }}
       >
         {_map(paymentFieldsData, field => {