.complaint .retry-modal-backdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.4); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; z-index: 1000; } .complaint .retry-modal-card { background: #FAFAFA; border-radius: 16px; max-width: 636px; -webkit-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 16px; padding: 24px; } .complaint .retry-modal-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 8px; color: #080A0C; font-size: 16px; font-weight: 400; line-height: 24px; padding-bottom: 24px; } .complaint .retry-modal-message { font-weight: 600; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 8px; } .complaint .retry-modal-subtext { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 8px; } .complaint .thankyou-content { text-align: center; margin-bottom: 60px; } .complaint .thankyou-title { color: #080A0C; font-size: 33px; font-weight: 600; line-height: 39.6px; letter-spacing: -0.825px; } .complaint .thankyou-subtext { color: #48596B; font-size: 19px; font-weight: 500; line-height: 22.8px; letter-spacing: -0.475px; } .complaint .thankyou-card .complaint-buttons button.btn { padding: 12px 24px; font-size: 19px; font-weight: 600; line-height: 23px; } @charset "UTF-8"; .react-datepicker__navigation-icon::before, .react-datepicker__year-read-view--down-arrow, .react-datepicker__month-read-view--down-arrow, .react-datepicker__month-year-read-view--down-arrow { border-color: #ccc; border-style: solid; border-width: 3px 3px 0 0; content: ""; display: block; height: 9px; position: absolute; top: 6px; width: 9px; } /* sr-only utility class for accessibility */ .react-datepicker__sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; } .react-datepicker-wrapper { display: inline-block; padding: 0; border: 0; } .react-datepicker { font-family: "Helvetica Neue", helvetica, arial, sans-serif; font-size: 0.8rem; background-color: #fff; color: #000; border: 1px solid #aeaeae; border-radius: 0.3rem; display: inline-block; position: relative; line-height: initial; } .react-datepicker--time-only .react-datepicker__time-container { border-left: 0; } .react-datepicker--time-only .react-datepicker__time, .react-datepicker--time-only .react-datepicker__time-box { border-bottom-left-radius: 0.3rem; border-bottom-right-radius: 0.3rem; } .react-datepicker-popper { z-index: 1; line-height: 0; } .react-datepicker-popper .react-datepicker__triangle { stroke: #aeaeae; } .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle { fill: #f0f0f0; color: #f0f0f0; } .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle { fill: #fff; color: #fff; } .react-datepicker__header { text-align: center; background-color: #f0f0f0; border-bottom: 1px solid #aeaeae; border-top-left-radius: 0.3rem; padding: 8px 0; position: relative; } .react-datepicker__header--time { padding-bottom: 8px; padding-left: 5px; padding-right: 5px; } .react-datepicker__header--time:not(.react-datepicker__header--time--only) { border-top-left-radius: 0; } .react-datepicker__header:not(.react-datepicker__header--has-time-select) { border-top-right-radius: 0.3rem; } .react-datepicker__year-dropdown-container--select, .react-datepicker__month-dropdown-container--select, .react-datepicker__month-year-dropdown-container--select, .react-datepicker__year-dropdown-container--scroll, .react-datepicker__month-dropdown-container--scroll, .react-datepicker__month-year-dropdown-container--scroll { display: inline-block; margin: 0 15px; } .react-datepicker__current-month, .react-datepicker-time__header, .react-datepicker-year-header { margin-top: 0; color: #000; font-weight: bold; font-size: 0.944rem; } h2.react-datepicker__current-month { padding: 0; margin: 0; } .react-datepicker-time__header { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .react-datepicker__navigation { -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; cursor: pointer; position: absolute; top: 2px; padding: 0; border: none; z-index: 1; height: 32px; width: 32px; text-indent: -999em; overflow: hidden; } .react-datepicker__navigation--previous { left: 2px; } .react-datepicker__navigation--next { right: 2px; } .react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) { right: 85px; } .react-datepicker__navigation--years { position: relative; top: 0; display: block; margin-left: auto; margin-right: auto; } .react-datepicker__navigation--years-previous { top: 4px; } .react-datepicker__navigation--years-upcoming { top: -4px; } .react-datepicker__navigation:hover *::before { border-color: rgb(165.75, 165.75, 165.75); } .react-datepicker__navigation-icon { position: relative; top: -1px; font-size: 20px; width: 0; } .react-datepicker__navigation-icon--next { left: -2px; } .react-datepicker__navigation-icon--next::before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); left: -7px; } .react-datepicker__navigation-icon--previous { right: -2px; } .react-datepicker__navigation-icon--previous::before { -webkit-transform: rotate(225deg); -ms-transform: rotate(225deg); transform: rotate(225deg); right: -7px; } .react-datepicker__month-container { float: left; } .react-datepicker__year { margin: 0.4rem; text-align: center; } .react-datepicker__year-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; max-width: 180px; } .react-datepicker__year .react-datepicker__year-text { display: inline-block; width: 4rem; margin: 2px; } .react-datepicker__month { margin: 0.4rem; text-align: center; } .react-datepicker__month .react-datepicker__month-text, .react-datepicker__month .react-datepicker__quarter-text { display: inline-block; width: 4rem; margin: 2px; } .react-datepicker__input-time-container { clear: both; width: 100%; float: left; margin: 5px 0 10px 15px; text-align: left; } .react-datepicker__input-time-container .react-datepicker-time__caption { display: inline-block; } .react-datepicker__input-time-container .react-datepicker-time__input-container { display: inline-block; } .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input { display: inline-block; margin-left: 10px; } .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input { width: auto; } .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button, .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] { -moz-appearance: textfield; } .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter { margin-left: 5px; display: inline-block; } .react-datepicker__time-container { float: right; border-left: 1px solid #aeaeae; width: 85px; } .react-datepicker__time-container--with-today-button { display: inline; border: 1px solid #aeaeae; border-radius: 0.3rem; position: absolute; right: -87px; top: 0; } .react-datepicker__time-container .react-datepicker__time { position: relative; background: white; border-bottom-right-radius: 0.3rem; } .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box { width: 85px; overflow-x: hidden; margin: 0 auto; text-align: center; border-bottom-right-radius: 0.3rem; } .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list { list-style: none; margin: 0; height: calc(195px + 1.7rem / 2); overflow-y: scroll; padding-right: 0; padding-left: 0; width: 100%; -webkit-box-sizing: content-box; box-sizing: content-box; } .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item { height: 30px; padding: 5px 10px; white-space: nowrap; } .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover { cursor: pointer; background-color: #f0f0f0; } .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected { background-color: #216ba5; color: white; font-weight: bold; } .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover { background-color: #216ba5; } .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled { color: #ccc; } .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover { cursor: default; background-color: transparent; } .react-datepicker__week-number { color: #ccc; display: inline-block; width: 1.7rem; line-height: 1.7rem; text-align: center; margin: 0.166rem; } .react-datepicker__week-number.react-datepicker__week-number--clickable { cursor: pointer; } .react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected):hover { border-radius: 0.3rem; background-color: #f0f0f0; } .react-datepicker__week-number--selected { border-radius: 0.3rem; background-color: #216ba5; color: #fff; } .react-datepicker__week-number--selected:hover { background-color: rgb(28.75, 93.2196969697, 143.75); } .react-datepicker__day-names { text-align: center; white-space: nowrap; margin-bottom: -8px; } .react-datepicker__week { white-space: nowrap; } .react-datepicker__day-name, .react-datepicker__day, .react-datepicker__time-name { color: #000; display: inline-block; width: 1.7rem; line-height: 1.7rem; text-align: center; margin: 0.166rem; } .react-datepicker__day-name--disabled, .react-datepicker__day--disabled, .react-datepicker__time-name--disabled { cursor: default; color: #ccc; } .react-datepicker__day, .react-datepicker__month-text, .react-datepicker__quarter-text, .react-datepicker__year-text { cursor: pointer; } .react-datepicker__day:not([aria-disabled=true]):hover, .react-datepicker__month-text:not([aria-disabled=true]):hover, .react-datepicker__quarter-text:not([aria-disabled=true]):hover, .react-datepicker__year-text:not([aria-disabled=true]):hover { border-radius: 0.3rem; background-color: #f0f0f0; } .react-datepicker__day--today, .react-datepicker__month-text--today, .react-datepicker__quarter-text--today, .react-datepicker__year-text--today { font-weight: bold; } .react-datepicker__day--highlighted, .react-datepicker__month-text--highlighted, .react-datepicker__quarter-text--highlighted, .react-datepicker__year-text--highlighted { border-radius: 0.3rem; background-color: #3dcc4a; color: #fff; } .react-datepicker__day--highlighted:not([aria-disabled=true]):hover, .react-datepicker__month-text--highlighted:not([aria-disabled=true]):hover, .react-datepicker__quarter-text--highlighted:not([aria-disabled=true]):hover, .react-datepicker__year-text--highlighted:not([aria-disabled=true]):hover { background-color: rgb(49.8551020408, 189.6448979592, 62.5632653061); } .react-datepicker__day--highlighted-custom-1, .react-datepicker__month-text--highlighted-custom-1, .react-datepicker__quarter-text--highlighted-custom-1, .react-datepicker__year-text--highlighted-custom-1 { color: magenta; } .react-datepicker__day--highlighted-custom-2, .react-datepicker__month-text--highlighted-custom-2, .react-datepicker__quarter-text--highlighted-custom-2, .react-datepicker__year-text--highlighted-custom-2 { color: green; } .react-datepicker__day--holidays, .react-datepicker__month-text--holidays, .react-datepicker__quarter-text--holidays, .react-datepicker__year-text--holidays { position: relative; border-radius: 0.3rem; background-color: #ff6803; color: #fff; } .react-datepicker__day--holidays .overlay, .react-datepicker__month-text--holidays .overlay, .react-datepicker__quarter-text--holidays .overlay, .react-datepicker__year-text--holidays .overlay { position: absolute; bottom: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); background-color: #333; color: #fff; padding: 4px; border-radius: 4px; white-space: nowrap; visibility: hidden; opacity: 0; -webkit-transition: visibility 0s, opacity 0.3s ease-in-out; transition: visibility 0s, opacity 0.3s ease-in-out; } .react-datepicker__day--holidays:not([aria-disabled=true]):hover, .react-datepicker__month-text--holidays:not([aria-disabled=true]):hover, .react-datepicker__quarter-text--holidays:not([aria-disabled=true]):hover, .react-datepicker__year-text--holidays:not([aria-disabled=true]):hover { background-color: rgb(207, 82.9642857143, 0); } .react-datepicker__day--holidays:hover .overlay, .react-datepicker__month-text--holidays:hover .overlay, .react-datepicker__quarter-text--holidays:hover .overlay, .react-datepicker__year-text--holidays:hover .overlay { visibility: visible; opacity: 1; } .react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range, .react-datepicker__month-text--selected, .react-datepicker__month-text--in-selecting-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--selected, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--selected, .react-datepicker__year-text--in-selecting-range, .react-datepicker__year-text--in-range { border-radius: 0.3rem; background-color: #216ba5; color: #fff; } .react-datepicker__day--selected:not([aria-disabled=true]):hover, .react-datepicker__day--in-selecting-range:not([aria-disabled=true]):hover, .react-datepicker__day--in-range:not([aria-disabled=true]):hover, .react-datepicker__month-text--selected:not([aria-disabled=true]):hover, .react-datepicker__month-text--in-selecting-range:not([aria-disabled=true]):hover, .react-datepicker__month-text--in-range:not([aria-disabled=true]):hover, .react-datepicker__quarter-text--selected:not([aria-disabled=true]):hover, .react-datepicker__quarter-text--in-selecting-range:not([aria-disabled=true]):hover, .react-datepicker__quarter-text--in-range:not([aria-disabled=true]):hover, .react-datepicker__year-text--selected:not([aria-disabled=true]):hover, .react-datepicker__year-text--in-selecting-range:not([aria-disabled=true]):hover, .react-datepicker__year-text--in-range:not([aria-disabled=true]):hover { background-color: rgb(28.75, 93.2196969697, 143.75); } .react-datepicker__day--keyboard-selected, .react-datepicker__month-text--keyboard-selected, .react-datepicker__quarter-text--keyboard-selected, .react-datepicker__year-text--keyboard-selected { border-radius: 0.3rem; background-color: rgb(186.25, 217.0833333333, 241.25); color: rgb(0, 0, 0); } .react-datepicker__day--keyboard-selected:not([aria-disabled=true]):hover, .react-datepicker__month-text--keyboard-selected:not([aria-disabled=true]):hover, .react-datepicker__quarter-text--keyboard-selected:not([aria-disabled=true]):hover, .react-datepicker__year-text--keyboard-selected:not([aria-disabled=true]):hover { background-color: rgb(28.75, 93.2196969697, 143.75); color: #fff; } .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range), .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range), .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range), .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range) { background-color: rgba(33, 107, 165, 0.5); } .react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range), .react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range), .react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range), .react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range), .react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range), .react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range), .react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range), .react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range) { background-color: #f0f0f0; color: #000; } .react-datepicker__day--disabled, .react-datepicker__month-text--disabled, .react-datepicker__quarter-text--disabled, .react-datepicker__year-text--disabled { cursor: default; color: #ccc; } .react-datepicker__day--disabled .overlay, .react-datepicker__month-text--disabled .overlay, .react-datepicker__quarter-text--disabled .overlay, .react-datepicker__year-text--disabled .overlay { position: absolute; bottom: 70%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); background-color: #333; color: #fff; padding: 4px; border-radius: 4px; white-space: nowrap; visibility: hidden; opacity: 0; -webkit-transition: visibility 0s, opacity 0.3s ease-in-out; transition: visibility 0s, opacity 0.3s ease-in-out; } .react-datepicker__input-container { position: relative; display: inline-block; width: 100%; } .react-datepicker__input-container .react-datepicker__calendar-icon { position: absolute; padding: 0.5rem; -webkit-box-sizing: content-box; box-sizing: content-box; } .react-datepicker__view-calendar-icon input { padding: 6px 10px 5px 25px; } .react-datepicker__year-read-view, .react-datepicker__month-read-view, .react-datepicker__month-year-read-view { border: 1px solid transparent; border-radius: 0.3rem; position: relative; } .react-datepicker__year-read-view:hover, .react-datepicker__month-read-view:hover, .react-datepicker__month-year-read-view:hover { cursor: pointer; } .react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow, .react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow, .react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow, .react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow, .react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow, .react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow { border-top-color: rgb(178.5, 178.5, 178.5); } .react-datepicker__year-read-view--down-arrow, .react-datepicker__month-read-view--down-arrow, .react-datepicker__month-year-read-view--down-arrow { -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); right: -16px; top: 0; } .react-datepicker__year-dropdown, .react-datepicker__month-dropdown, .react-datepicker__month-year-dropdown { background-color: #f0f0f0; position: absolute; width: 50%; left: 25%; top: 30px; z-index: 1; text-align: center; border-radius: 0.3rem; border: 1px solid #aeaeae; } .react-datepicker__year-dropdown:hover, .react-datepicker__month-dropdown:hover, .react-datepicker__month-year-dropdown:hover { cursor: pointer; } .react-datepicker__year-dropdown--scrollable, .react-datepicker__month-dropdown--scrollable, .react-datepicker__month-year-dropdown--scrollable { height: 150px; overflow-y: scroll; } .react-datepicker__year-option, .react-datepicker__month-option, .react-datepicker__month-year-option { line-height: 20px; width: 100%; display: block; margin-left: auto; margin-right: auto; } .react-datepicker__year-option:first-of-type, .react-datepicker__month-option:first-of-type, .react-datepicker__month-year-option:first-of-type { border-top-left-radius: 0.3rem; border-top-right-radius: 0.3rem; } .react-datepicker__year-option:last-of-type, .react-datepicker__month-option:last-of-type, .react-datepicker__month-year-option:last-of-type { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border-bottom-left-radius: 0.3rem; border-bottom-right-radius: 0.3rem; } .react-datepicker__year-option:hover, .react-datepicker__month-option:hover, .react-datepicker__month-year-option:hover { background-color: #ccc; } .react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming, .react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming, .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming { border-bottom-color: rgb(178.5, 178.5, 178.5); } .react-datepicker__year-option:hover .react-datepicker__navigation--years-previous, .react-datepicker__month-option:hover .react-datepicker__navigation--years-previous, .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous { border-top-color: rgb(178.5, 178.5, 178.5); } .react-datepicker__year-option--selected, .react-datepicker__month-option--selected, .react-datepicker__month-year-option--selected { position: absolute; left: 15px; } .react-datepicker__close-icon { cursor: pointer; background-color: transparent; border: 0; outline: 0; padding: 0 6px 0 0; position: absolute; top: 0; right: 0; height: 100%; display: table-cell; vertical-align: middle; } .react-datepicker__close-icon::after { cursor: pointer; background-color: #216ba5; color: #fff; border-radius: 50%; height: 16px; width: 16px; padding: 2px; font-size: 12px; line-height: 1; text-align: center; display: table-cell; vertical-align: middle; content: "×"; } .react-datepicker__close-icon--disabled { cursor: default; } .react-datepicker__close-icon--disabled::after { cursor: default; background-color: #ccc; } .react-datepicker__today-button { background: #f0f0f0; border-top: 1px solid #aeaeae; cursor: pointer; text-align: center; font-weight: bold; padding: 5px 0; clear: left; } .react-datepicker__portal { position: fixed; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.8); left: 0; top: 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; z-index: 2147483647; } .react-datepicker__portal .react-datepicker__day-name, .react-datepicker__portal .react-datepicker__day, .react-datepicker__portal .react-datepicker__time-name { width: 3rem; line-height: 3rem; } @media (max-width: 400px), (max-height: 550px) { .react-datepicker__portal .react-datepicker__day-name, .react-datepicker__portal .react-datepicker__day, .react-datepicker__portal .react-datepicker__time-name { width: 2rem; line-height: 2rem; } } .react-datepicker__portal .react-datepicker__current-month, .react-datepicker__portal .react-datepicker-time__header { font-size: 1.44rem; } .react-datepicker__children-container { width: 13.8rem; margin: 0.4rem; padding-right: 0.2rem; padding-left: 0.2rem; height: auto; } .react-datepicker__aria-live { position: absolute; clip-path: circle(0); border: 0; height: 1px; margin: -1px; overflow: hidden; padding: 0; width: 1px; white-space: nowrap; } .react-datepicker__calendar-icon { width: 1em; height: 1em; vertical-align: -0.125em; } .complaint .upload-modal { background: #FAFAFA; border-radius: 16px; max-width: 636px; -webkit-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 32px; padding: 24px; width: 100%; margin: 12px; position: absolute; top: calc(50% + 30px); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: calc(50% - 12px); max-height: 80vh; } @media (min-width: 992px) { .complaint .upload-modal { left: 50%; top: calc(50% + 45px); } } @media (max-width: 991px) { .complaint .upload-modal { max-height: 75vh; } } .complaint .upload-modal-title { color: #080A0C; font-size: 23px; font-weight: 600; line-height: 27.6px; letter-spacing: -0.575px; margin-bottom: 16px; } .complaint .upload-modal .upload-box { width: 100%; border-radius: 8px; border: 1px solid #E1E5EA; background: #FFF; -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; max-width: 588px; height: 180px; padding: 48px 16px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-height: 600px) and (max-height: 633px) { .complaint .upload-modal .upload-box { height: auto; padding: 24px 16px; } } .complaint .upload-modal .upload-file-btn { gap: 4px; padding: 8px 24px; font-size: 16px; line-height: 19px; } .complaint .upload-modal .upload-file-btn svg { width: 16px; height: 16px; } .complaint .upload-modal .uploaded-section { max-height: 10vh; } .complaint .upload-modal .supported-formats { margin-top: 12px; margin-bottom: 4px; } .complaint .upload-modal .supported-formats, .complaint .upload-modal .max-size { color: #48596B; text-align: center; font-size: 11px; font-weight: 400; line-height: 17px; } .complaint .upload-modal .supported-formats b, .complaint .upload-modal .max-size b { font-weight: 600; } .complaint .upload-modal .modal-actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; gap: 8px; } .complaint .upload-modal .modal-actions .btn { padding: 8px 16px; font-size: 13px; line-height: 16px; } .complaint .upload-modal .cancel-btn { background: none; border: 1px solid #2563eb; color: #2563eb; padding: 8px 16px; border-radius: 20px; } .complaint .upload-modal .attach-btn { background: #e5e7eb; border: none; padding: 8px 16px; border-radius: 20px; color: #9ca3af; } .complaint .upload-modal .modal-error-content { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; border-radius: 6px; background: #FAE5E7; } @media (max-width: 576px) { .complaint .upload-modal .modal-error-content { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .complaint .upload-modal .modal-error-content svg { -ms-flex-negative: 0; flex-shrink: 0; } } .complaint .upload-modal .modal-error-description { color: #941A25; font-size: 13px; font-weight: 400; line-height: 19.5px; } .complaint .upload-modal-backdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.4); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; z-index: 1000; } .complaint .upload-file-btn { background: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; border-radius: 50px; border: 1px solid #333f4c; height: 48px; padding: 12px 24px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; color: #333F4C; font-size: 19px; font-weight: 600; line-height: 23px; } .complaint .attachments-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 16px; } .complaint .attachments-wrapper .field-label { color: #333F4C; font-size: 16px; font-weight: 600; letter-spacing: -0.4px; } .complaint .attachments-wrapper .field-placeholder { color: #48596B; font-size: 13px; font-weight: 400; line-height: 19.5px; } .complaint .attachments-grid { border-top: 1px solid #E1E5EA; } .complaint .attachments-grid .uploaded-section { width: 100%; margin-top: 16px; } @media (min-width: 992px) { .complaint .attachments-grid .uploaded-section { width: 50%; } } .complaint .attachments-grid .uploaded-title { color: #333F4C; } .complaint .uploaded-section { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 16px; overflow-y: auto; } .complaint .uploaded-title { color: #48596B; font-size: 16px; font-weight: 500; line-height: 24px; letter-spacing: -0.4px; } .complaint .uploaded-file-item { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px 16px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-radius: 6px; background: #DAE7FF; } .complaint .uploaded-file-name { color: #013BA8; font-size: 13px; font-weight: 600; line-height: 16px; } .complaint .uploaded-remove-btn { border: 0; background: inherit; } :root { --color-text: #333F4C; --color-input-error: #941A25; --color-input-border: #DC3545; } .complaint { font-family: Montserrat !important; /* one outer card (title + form + footer inside) */ /* header (gray strip inside the same border) */ /* card body — keep tight padding; child will render fields */ } .complaint .ms-wrapper { max-width: 1200px; margin: 28px auto; padding: 0 18px; -webkit-box-sizing: border-box; box-sizing: border-box; } .complaint .ms-card { background: #fff; overflow: hidden; } .complaint .ms-card-header { padding: 16px; color: #080A0C; font-size: 19px; font-weight: 600; line-height: 22.8px; letter-spacing: -0.475px; border-radius: 2px 2px 0 0; border-top: 1px solid #E1E5EA; border-right: 1px solid #E1E5EA; border-left: 1px solid #E1E5EA; background: #F6F6F6; } .complaint .ms-title { font-size: 19px; font-weight: 600; color: #080A0C; } .complaint .ms-card-body { padding: 30px 24px; background: #fff; border-radius: 0 0 2px 2px; border: 1px solid #E0E5EA; } .complaint .complaint-buttons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 16px; -ms-flex-item-align: stretch; align-self: stretch; } .complaint .complaint-buttons button.btn { border-radius: 50px !important; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px 24px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 12px; font-size: 16px; font-weight: 600; line-height: 19px; } .complaint .complaint-buttons .back-button:hover { background-color: transparent !important; } .complaint .complaint-buttons .back-button { border: 1px solid #0F62FE; color: #0F62FE; } .complaint .complaint-buttons .next-button { color: #FFF; } .complaint .complaint-buttons .next-button:hover { background: #0F62FE !important; border-color: #0F62FE !important; } .complaint .complaint-buttons .disabled-btn { color: #8599AD; } .complaint .complaint-buttons .disable-next { border-radius: 50px; background: #E0E5EA; color: #8599AD; border: 0; } .complaint .followup-radio { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; height: 24px; margin: 0; padding: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 82px; } /* productInfo child only */ .pif-form { margin: 0; padding: 0; /* tighten vertical rhythm like Figma */ } .pif-form .field-label { display: block; color: var(--color-text); font-weight: 500; font-size: 16px; margin-bottom: 8px; line-height: 24px; letter-spacing: -0.4px; } .pif-form .field-input { width: 100%; height: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px 12px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -ms-flex-item-align: stretch; align-self: stretch; border-radius: 12px; border: 1px solid #E1E5EA; background: #FAFAFA; color: #607690; font-size: 16px; font-weight: 400; line-height: 150%; } .pif-form .field-input:focus-visible, .pif-form .field-input:focus { border: 1px solid #E1E5EA !important; outline: 0 !important; } .pif-form .invalid-prod-info { color: var(--color-input-error) !important; font-size: 11px !important; font-weight: 400; line-height: 17px; margin-top: 4px; } .pif-form .is-invalid-input { border-radius: 12px; border: 1px solid var(--color-input-border); background: #FAFAFA; width: 100%; height: 40px; } .pif-form .is-invalid-input:focus-visible, .pif-form .is-invalid-input:focus { border: 1px solid var(--color-input-border) !important; outline: 0 !important; } .pif-form .form-check-input { width: 24px; height: 24px; margin: 0 !important; } .pif-form .form-check-label { color: #48596B; font-size: 16px; font-weight: 400; line-height: 24px; } .pif-form .row { margin-left: 0; margin-right: 0; row-gap: 16px !important; -webkit-column-gap: 24px !important; -moz-column-gap: 24px !important; column-gap: 24px !important; } .pif-form .col-md-6 { -webkit-box-flex: 0; -ms-flex: 0 0 48%; flex: 0 0 48%; } .pif-form .col-auto.left-col, .pif-form .col-auto.right-col { width: 400px !important; padding: 0 !important; } /* additional Info child only*/ .additional-event-form .react-datepicker { font-family: Montserrat !important; font-size: 16px !important; } .additional-event-form h2.react-datepicker__current-month, .additional-event-form .react-datepicker__header { font-size: 16px !important; } .additional-event-form .form-label.label-field { color: var(--color-text); font-size: 16px; font-weight: 500; line-height: 24px; letter-spacing: -0.4px; } .additional-event-form .form-control.add-text-field { color: #607690; font-size: 16px; font-weight: 400; line-height: 150%; display: -webkit-box; display: -ms-flexbox; display: flex; width: 258px; padding: 8px 12px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; border-radius: 12px; border: 1px solid #E1E5EA; background: #FAFAFA; outline: 0 !important; -webkit-box-shadow: none; box-shadow: none; } .additional-event-form .form-check-input.add-checkbox { width: 24px; height: 24px; margin: 0 !important; outline: 0 !important; -webkit-box-shadow: none; box-shadow: none; } .additional-event-form .form-check-label { color: #48596B; font-size: 16px; font-weight: 400; line-height: 24px; } .additional-event-form .agency-report { width: 100%; } @media (min-width: 768px) { .additional-event-form .agency-report { width: 612px !important; } } /* attachments*/ .attachments-wrapper { /* grid */ /* bottom area with divider and light background */ /* plus circle */ /* delete circle inside uploaded card bottom */ /* helper text note */ } .attachments-wrapper .field-label { display: block; margin-bottom: 8px; color: var(--color-text); font-size: 16px; font-weight: 500; line-height: 24px; letter-spacing: -0.4px; } .attachments-wrapper .attachments-error { color: var(--color-input-error); font-size: 11px; font-weight: 400; line-height: 17px; } .attachments-wrapper .attachments-grid { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 8px; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .attachments-wrapper .card-top { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; width: 160px; height: 110px; padding: 16px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 10px; -ms-flex-item-align: stretch; align-self: stretch; border-radius: 2px 2px 0 0; border: 1px solid #A3B2C1; background: #FFF; } .attachments-wrapper .add-text { color: #48596B; text-align: center; font-size: 13px; font-weight: 700; line-height: 19.5px; } .attachments-wrapper .card-top .add-text.add-file { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; /* firefox */ display: box; box-orient: vertical; line-clamp: 3; overflow: hidden; text-overflow: ellipsis; white-space: normal; } .attachments-wrapper .card-bottom { height: 51px; width: 160px; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 9px 69px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -ms-flex-item-align: stretch; align-self: stretch; border-radius: 0 0 2px 2px; border: 1px solid #A3B2C1; border-top: 0; background: #F0F2F5; } .attachments-wrapper .plus-icon { width: 33px; height: 33px; background: url("data:image/svg+xml;utf8,") no-repeat center; background-size: contain; cursor: pointer; } .attachments-wrapper .delete-btn { border: none; cursor: pointer; width: 33px; height: 33px; background: url("data:image/svg+xml;utf8,") no-repeat center; background-size: contain; } .attachments-wrapper .add-card { cursor: pointer; } .attachments-wrapper .file-note { color: #48596B; font-size: 13px; font-weight: 400; line-height: 19.5px; } .complaint-loader-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: fixed; /* Keeps it fixed on screen */ inset: 0; background-color: rgba(255, 255, 255, 0.5); z-index: 9999; } .email-us-form { margin: 0; padding: 0; } .email-us-form .form-box { background: transparent; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 4px; } .email-us-form .form-check-label { color: #48596b; font-family: Montserrat; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .email-us-form .field-label { display: block; color: var(--color-text); font-family: Montserrat; font-style: normal; font-weight: 500; font-size: 16px; margin-bottom: 8px; line-height: 24px; letter-spacing: -0.4px; } .email-us-form .field-input:focus-visible, .email-us-form .field-input:focus { -webkit-box-shadow: none; box-shadow: none; } .email-us-form .field-input { color: #607690; font-size: 16px; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px 12px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -ms-flex-item-align: stretch; align-self: stretch; border-radius: 12px; border: 1px solid #e1e5ea; background-color: #fafafa; } .email-us-form .form-select { border-radius: 12px; border: 1px solid #e1e5ea; background: #fafafa; padding: 8px 12px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml;utf8,"); background-repeat: no-repeat; background-position: right 12px center; background-size: 16px; } .email-us-form .form-select:focus-visible, .email-us-form .form-select:focus { -webkit-box-shadow: none; box-shadow: none; } .email-us-form .form-select:focus, .email-us-form .invalid-email-info-dropdown:focus { outline: none; -webkit-box-shadow: none; box-shadow: none; } .email-us-form .invalid-email-info-dropdown { border-radius: 12px; border: 1px solid var(--color-input-border); background: #fafafa; padding: 8px 12px; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml;utf8,"); background-repeat: no-repeat; background-position: right 12px center; background-size: 16px; } .email-us-form .form-check-input { height: 24px; width: 24px; margin: 0; } .email-us-form .form-check-input:focus-visible, .email-us-form .form-check-input:focus { -webkit-box-shadow: none; box-shadow: none; } .email-us-form .issue-description { width: 100%; height: 250px; } @media (min-width: 768px) { .email-us-form .issue-description { width: 612px; } } .email-us-form .issue-border-danger { border: 1px solid var(--color-input-border); background: #fafafa; } .email-us-form .invalid-email-info { color: var(--color-input-error) !important; font-family: Montserrat; font-size: 11px !important; font-style: normal; font-weight: 400; line-height: 17px; margin-top: 4px; } .email-us-form .email-invalid-input { border-radius: 12px; border: 1px solid var(--color-input-border); background: #fafafa; width: 100%; height: 40px; } .email-us-form .email-invalid-input:focus-visible, .email-us-form .email-invalid-input:focus { border: 1px solid var(--color-input-border) !important; outline: 0 !important; -webkit-box-shadow: none; box-shadow: none; } .email-us-form .radio-block { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; width: 100%; height: 24px; margin: 0; padding: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media (min-width: 768px) { .email-us-form .radio-block { width: 400px; } } .email-us-form label.form-label.helpus-msg { color: #333F4C !important; font-weight: 500; } .patient-info-form .form-label { color: var(--color-text); font-family: Montserrat; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; letter-spacing: -0.4px; } .patient-info-form .patientinfo-check { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; width: auto; height: 24px; margin: 0; padding: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media (min-width: 768px) { .patient-info-form .patientinfo-check { width: 188px; } } .patient-info-form .form-check-label { color: #48596b; font-family: Montserrat; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; margin: 0; } .patient-info-form .form-check { display: block; } .patient-info-form .field-input { color: #607690; font-size: 16px; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px 12px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -ms-flex-item-align: stretch; align-self: stretch; border-radius: 12px; border: 1px solid #e1e5ea; background: #fafafa; } .patient-info-form .field-input:focus-visible, .patient-info-form .field-input:focus { -webkit-box-shadow: none; box-shadow: none; } .patient-info-form .form-select { border-radius: 12px; border: 1px solid #e1e5ea; background: #fafafa; padding: 8px 12px; } .patient-info-form .form-check-input { height: 24px; width: 24px; margin: 0; } .patient-info-form .form-check-input:focus-visible, .patient-info-form .form-check-input:focus { -webkit-box-shadow: none; box-shadow: none; outline: 0 !important; } .patient-info-form .event-description { width: 100%; height: 120px; } @media (min-width: 768px) { .patient-info-form .event-description { width: 612px; } } .patient-info-form .invalid-patient-info { color: var(--color-input-error) !important; font-family: Montserrat; font-size: 11px !important; font-style: normal; font-weight: 400; line-height: 17px; margin-top: 4px; } .patient-info-form .patient-invalid-input { border-radius: 12px; border: 1px solid var(--color-input-border); background: #fafafa; } .patient-info-form .patient-invalid-input:focus-visible, .patient-info-form .patient-invalid-input:focus { border: 1px solid var(--color-input-border) !important; outline: 0 !important; -webkit-box-shadow: none; box-shadow: none; } .followup-form .form-label { color: var(--color-text); font-family: Montserrat; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; letter-spacing: -0.4px; } .followup-form .form-check-label { color: #48596b; font-family: Montserrat; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .followup-form .form-check-input { height: 24px; width: 24px; margin: 0; } .followup-form .form-check-input:focus-visible, .followup-form .form-check-input:focus { -webkit-box-shadow: none; box-shadow: none; outline: 0 !important; } .followup-form .field-input { color: #607690; font-size: 16px; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px 12px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -ms-flex-item-align: stretch; align-self: stretch; border-radius: 12px; border: 1px solid #e1e5ea; background: #fafafa; } .followup-form .field-input:focus-visible, .followup-form .field-input:focus { -webkit-box-shadow: none; box-shadow: none; } .followup-form .form-select { border-radius: 12px; border: 1px solid #e1e5ea; background: #fafafa; padding: 8px 12px; } .followup-form .form-check-input { height: 24px; width: 24px; margin: 0; } .followup-form .event-description { width: 612px; height: 120px; } .followup-form .invalid-follow-info { color: var(--color-input-error) !important; font-family: Montserrat; font-size: 11px !important; font-style: normal; font-weight: 400; line-height: 17px; margin-top: 4px; } .followup-form .follow-invalid-input { border-radius: 8px; border: 1px solid var(--color-input-border); background: #fafafa; padding: 4px; width: 100px; line-height: 24px; } .followup-form .follow-invalid-input:focus-visible, .followup-form .follow-invalid-input:focus { border: 1px solid var(--color-input-border) !important; outline: 0 !important; -webkit-box-shadow: none; box-shadow: none; } .followup-form .privacy-link { text-decoration: none !important; color: #0d6efd; } .followup-form a:hover, .followup-form a:visited, .followup-form a:active { color: #0d6efd !important; opacity: 0.75; } .cmp__container--minus-mt-152 { margin-top: -152px !important; } .complaint-teaser { border-radius: 0 !important; } .complaint-teaser .cmp-teaser__wrapper { padding: 92px 72px 24px 72px !important; } .complaint-teaser .cmp-teaser__text .text p { font-weight: 400 !important; } .complaint-teaser .cmp-button { min-height: 0 !important; padding: 8px 16px !important; } .complaint-teaser .cmp-button__text { font-size: 13px !important; } .gutter-16 { padding: 0 16px !important; } .gutter-24 { padding: 0 24px !important; } .loader-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(255, 255, 255, 0.7); /* Light overlay */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; z-index: 9999; /* On top of everything */ } .loader-spinner { width: 3rem; height: 3rem; } .complaint_popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; z-index: 9999; font-family: "Montserrat"; } .complaint_popup-box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 636px; min-height: 192px; padding: 24px; background: #fff; border-radius: 12px; -webkit-box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2); } .complaint_popup-box .popup-icon { position: relative; width: 24px; height: 24px; cursor: pointer; margin-bottom: 8px; pointer-events: none; } .complaint_popup-box .popup-body { font-size: 16px; color: #080a0c; line-height: 24px; font-weight: 400; } .complaint_popup-box .popup-body1 { font-size: 16px; color: #080a0c; line-height: 24px; font-weight: 400; margin-top: 16px; } .complaint_popup-box .popup-body1 a { color: #0f62fe; font-size: 16px; font-weight: 400; line-height: 150%; text-decoration: none; } .complaint_popup-box .popup-button { -ms-flex-item-align: end; align-self: flex-end; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 8px 16px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-radius: 60px; border: none; background: #333f4c; color: #fff; cursor: pointer; font-size: 13px; font-weight: 600; line-height: 16px; } .complaint-submit-loader .ms-card-body { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 36px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .complaint-submit-loader .loader-text { color: #000; font-size: 19px; font-weight: 500; line-height: 22.8px; letter-spacing: -0.475px; } @-webkit-keyframes input-fields-spinner-rotate { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes input-fields-spinner-rotate { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .input-fields-spinner { display: inline-block; -webkit-animation: input-fields-spinner-rotate 0.9s linear infinite; animation: input-fields-spinner-rotate 0.9s linear infinite; } .input-fields-button { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .input-fields-button--primary { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.1875rem; min-height: 3rem; padding: 0.75rem 1.5rem; border-radius: 3.125rem; line-height: 1.2105; cursor: pointer; background: #0f62fe; color: #ffffff; border: none; } .input-fields-button--primary:disabled { background: #e0e5ea; color: #8599ad; cursor: not-allowed; } .input-fields-button--secondary { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.1875rem; min-height: 3rem; padding: 0.75rem 1.5rem; border-radius: 3.125rem; line-height: 1.2105; cursor: pointer; background: transparent; border: 0.0625rem solid #0f62fe; color: #0f62fe; } .input-fields-button--text-link { background: transparent; border: none; padding: 0; font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1em; color: #0f62fe; cursor: pointer; } .input-fields-button--text-link:disabled { color: #8599ad; cursor: not-allowed; } .input-fields-link { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-decoration: none; } .input-fields-link--primary { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.1875rem; min-height: 3rem; padding: 0.75rem 1.5rem; border-radius: 3.125rem; line-height: 1.2105; cursor: pointer; background: #0f62fe; color: #ffffff; border: none; } .input-fields-link--primary:disabled { background: #e0e5ea; color: #8599ad; cursor: not-allowed; } .input-fields-link--secondary { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.1875rem; min-height: 3rem; padding: 0.75rem 1.5rem; border-radius: 3.125rem; line-height: 1.2105; cursor: pointer; background: transparent; border: 0.0625rem solid #0f62fe; color: #0f62fe; } .input-fields-link--text-link { display: block; text-align: center; font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1em; color: #0f62fe; line-height: 1.1875rem; } .input-fields-link--disabled { pointer-events: none; background: #e0e5ea; color: #8599ad; } .popup-modal__close-icon { position: absolute; top: 0.75rem; right: 0.75rem; width: 2rem; height: 2rem; border: none; background: transparent; font-size: 1.5rem; line-height: 1; color: #48596b; cursor: pointer; z-index: 1; } .popup-modal__overlay { position: fixed; inset: 0; background: rgba(8, 10, 12, 0.5); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; overflow-y: auto; padding: 1.5rem; z-index: 1000; } .popup-modal__panel { position: relative; background: #fafafa; border-radius: 1rem; -webkit-box-shadow: 0 0.25rem 0.1875rem rgba(0, 0, 0, 0.1), 0 0.125rem 0.125rem rgba(0, 0, 0, 0.06); box-shadow: 0 0.25rem 0.1875rem rgba(0, 0, 0, 0.1), 0 0.125rem 0.125rem rgba(0, 0, 0, 0.06); padding: 1.5rem; max-width: 100%; margin: auto 0; -ms-flex-negative: 0; flex-shrink: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; width: 100%; } @media (min-width: 48rem) { .popup-modal__panel { width: 32rem; } .popup-modal__panel#exit-registration-modal { width: 39.75rem; } } .popup-modal__title { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; font-size: 1.1875rem; text-align: center; letter-spacing: -0.0297rem; } .popup-modal__title--confirm { text-align: left; } .popup-modal__description { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; margin: 0; font-size: 0.8125rem; color: #48596b; } .popup-modal__description--info { font-size: 1rem; color: #080a0c; } .popup-modal__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1.5rem; } .popup-modal__image-gallery { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.75rem; } .popup-modal__image-wrap { width: 100%; height: 15.125rem; border-radius: 0.5rem; overflow: hidden; } .popup-modal__image { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .popup-modal__address-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .popup-modal__address-group { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.5rem; } .popup-modal__address-group-label { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; color: #333f4c; margin-bottom: 0.5rem; line-height: 1.2188rem; margin-bottom: 0; } .popup-modal__address-group-label .required { margin-left: -0.25rem; } .popup-modal__address-card { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 1rem; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; background: #ffffff; border: 0.0625rem solid #e1e5ea; border-radius: 0.75rem; padding: 1.125rem 1.25rem; -webkit-box-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.05); box-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.05); cursor: pointer; } .popup-modal__radio-control { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; width: 1.5rem; height: 1.5rem; } .popup-modal__radio-native { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; } .popup-modal__address-text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.6875rem; font-size: 0.8125rem; } .popup-modal__address-lines { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; font-family: 'Montserrat', sans-serif; font-weight: 700; color: #080a0c; line-height: 1.5; } .popup-modal__edit-link { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1em; color: #0f62fe; background: none; border: none; padding: 0; text-align: left; cursor: pointer; } .popup-modal__actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .popup-modal__actions--confirm { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1.5rem; } .popup-modal__action-button { width: 100%; } .popup-modal__panel .popup-modal__confirm-button { min-height: auto; padding: 0.5rem 1rem; font-size: 0.8125rem; line-height: 1rem; border-radius: 3.75rem; } .popup-modal__panel .popup-modal__confirm-button:hover { color: #ffffff; } .favorites-section { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; } .favorites-section .all-lists { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 36px; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; /* Simple CSS spinner */ } @media (max-width: 768px) { .favorites-section .all-lists { gap: 24px; } } .favorites-section .all-lists .favorites-block { display: grid; /* Desktop: two columns for header + link, then list full width */ grid-template-columns: 1fr auto; grid-template-areas: "header link" "list list"; row-gap: 16px; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; /* Empty modifier: dashed/dotted look */ /* Tablet: stack header, list, then link below the list */ } .favorites-section .all-lists .favorites-block .section-title { grid-area: header; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .favorites-section .all-lists .favorites-block .section-title .section-header { margin: 0; color: #333f4c; font-family: Montserrat; font-size: 24px; font-weight: 600; line-height: 28.8px; letter-spacing: -0.6px; } @media (max-width: 1400px) { .favorites-section .all-lists .favorites-block .section-title .section-header { font-size: 20px; line-height: 24px; letter-spacing: -0.5px; } } .favorites-section .all-lists .favorites-block .section-link { grid-area: link; align-self: center; color: #0f62fe; font-family: Montserrat; font-size: 16px; font-weight: 600; text-decoration: underline; line-height: 26px; } @media (min-width: 1400px) { .favorites-section .all-lists .favorites-block .section-link { padding-right: 8px; } } .favorites-section .all-lists .favorites-block .favorites-list { grid-area: list; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 12px; border: 1px solid #e1e5ea; border-radius: 12px; background: #fff; } .favorites-section .all-lists .favorites-block .favorites-list .favorite-card:not(:last-child) { border-bottom: 1px solid #e1e5ea; } .favorites-section .all-lists .favorites-block .favorites-list:has(> .favorites-list--empty) { /* Either completely remove the parent box… */ padding: 0; border: none; background: transparent; } @media (min-width: 768px) and (max-width: 1400px) { .favorites-section .all-lists .favorites-block { grid-template-columns: 1fr; grid-template-areas: "header" "list" "link"; } .favorites-section .all-lists .favorites-block .section-link { justify-self: center; } } @media only screen and (max-width: 767px) { .favorites-section .all-lists .favorites-block { grid-template-columns: 1fr; grid-template-areas: "header" "list" "link"; } .favorites-section .all-lists .favorites-block .section-link { justify-self: center; } } .favorites-section .all-lists .favorites-list { position: relative; min-height: 120px; /* ensures space for spinner; tune as needed */ } .favorites-section .all-lists .favorites-loader { position: absolute; inset: 0; /* top/right/bottom/left: 0 */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: rgba(255, 255, 255, 0.7); /* soft veil; use 0 if you want no veil */ backdrop-filter: blur(1px); /* optional subtle blur */ z-index: 3; /* above the list contents */ border-radius: 12px; /* match .favorites-list */ } .favorites-section .all-lists .favorites-loader .pill-label { cursor: pointer; } .favorites-section .all-lists .favorites-loader .spinner { width: 28px; height: 28px; border: 3px solid #cbd5e1; /* light */ border-top-color: #0f62fe; /* brand color */ border-radius: 50%; -webkit-animation: spin 0.9s linear infinite; animation: spin 0.9s linear infinite; margin-bottom: 8px; } .favorites-section .all-lists .favorites-loader .loader-text { color: #48596b; font-family: Montserrat; font-size: 14px; font-weight: 600; } @-webkit-keyframes spin { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spin { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .favorite-card { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 16px 24px 24px 12px; position: relative; gap: 24px; /* Favorite icon styling */ } .favorite-card:not(:last-child) { margin-bottom: 16px; } .favorite-card .image-details { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 16px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; width: 85%; } .favorite-card .image-details .product-image { width: 120px; height: 80px; -o-object-fit: cover; object-fit: cover; border-radius: 6px; cursor: pointer; } .favorite-card .image-details .details { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 12px; margin-bottom: 10px; /* Attributes container */ } .favorite-card .image-details .details .prod-name { overflow: hidden; color: #080a0c; text-overflow: ellipsis; font-family: Montserrat; font-size: 18px; font-style: normal; font-weight: 500; line-height: 22.5px; letter-spacing: -0.18px; } .favorite-card .image-details .details .prod-name a { display: inline-block; color: #080a0c; text-decoration: none; } .favorite-card .image-details .details .sku-no { color: #3e4d5c; font-variant-numeric: lining-nums tabular-nums; font-family: Montserrat; font-size: 14px; font-style: normal; font-weight: 500; line-height: 14px; letter-spacing: 0.28px; } .favorite-card .image-details .details .attributes { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; /* allows multiple rows */ gap: 4px 6px; /* spacing between pills */ } .favorite-card .image-details .details .attributes span { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 2px 4px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; border-radius: 1px; background: #f0f0f0; color: #080a0c; font-family: "Montserrat", sans-serif; font-size: 12px; font-style: normal; font-weight: 500; line-height: 14px; /* 116.667% */ letter-spacing: 0.12px; } .favorite-card .image-details .details .points { color: #013ba8; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; font-variant-numeric: lining-nums tabular-nums; } .favorite-card .image-details .details .points .points-label { color: #333f4c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; margin-left: 4px; } .favorite-card .image-details .details .points .no-points { color: #3e4d5c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; } .favorite-card .image-details .details .points::before { content: "\002B"; width: 12px; height: 12px; color: #013ba8; font-family: "Montserrat"; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; } .favorite-card .image-details .details .points:has(.no-points)::before { content: none; } .favorite-card .favorite-icon { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 4px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; right: 12px; top: 8px; cursor: pointer; background-color: #fff; border: none; } .favorite-card .purchase-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 16px; } .favorite-card .purchase-info .actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -ms-flex-align: end; align-items: end; gap: 16px; max-width: 115px; padding-top: 24px; } .favorite-card .purchase-info .actions .points { display: none; } .favorite-card .purchase-info .actions .loader { white-space: nowrap; } .favorite-card .purchase-info .actions .price { color: #080a0c; font-variant-numeric: lining-nums tabular-nums; font-family: Montserrat; font-size: 18px; font-style: normal; font-weight: 600; line-height: 21.6px; word-break: break-word; text-align: right; } .favorite-card .purchase-info .actions .msrp { color: #999; font-family: Montserrat; font-size: 16px; line-height: 24px; font-weight: 600; } .favorite-card .purchase-info .actions .quantity-selector { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0; gap: 8px; } .favorite-card .purchase-info .actions .quantity-selector button { width: 24px; height: 24px; border-radius: 50%; border: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 16px; cursor: pointer; padding: 0; line-height: 1px; } .favorite-card .purchase-info .actions .quantity-selector .decrease-icon { background-color: #E0E5EA; color: #333F4C; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .favorite-card .purchase-info .actions .quantity-selector .increase-icon { background-color: #333F4C; color: #fff; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .favorite-card .purchase-info .actions .quantity-selector input { height: 25px; width: 51px; /* for 1 digit */ max-width: 115px; /* for up to 5 digits */ text-align: center; border-radius: 3px; border: 1px solid #333f4c; color: #333f4c; font-family: "Montserrat", sans-serif; font-size: 14px; font-weight: 600; font-variant-numeric: lining-nums tabular-nums; line-height: 16.8px; padding: 4px 8px; } .favorite-card .purchase-info .actions .cta-spinner { pointer-events: none; min-width: 96px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .favorite-card .purchase-info .actions .cta-spinner path { -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite; -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; transform-box: fill-box; } .favorite-card .purchase-info .actions .add-to-cart { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; padding: 8px 12px; border-radius: 50px; /* pill shape */ border: 1px solid #333f4c; background-color: #fff; /* or your theme color */ color: #333f4c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; /* 100% */ width: auto; height: 32px; } .favorite-card .purchase-info .actions .add-to-cart--label { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .favorite-card .favorite-card { position: relative; } .favorite-card .favorites-loader { position: absolute; inset: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; z-index: 5; border-radius: 12px; background: rgba(255, 255, 255, 0.65); backdrop-filter: blur(1px); } .favorite-card .favorites-loader--pill .pill-label { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 8px 24px; min-height: 19px; min-width: 139px; background: #ffffff; color: #333f4c; border: 1.5px solid #333f4c; border-radius: 50px; font-family: Montserrat; font-size: 16px; font-style: normal; font-weight: 600; line-height: 19px; -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition: -webkit-transform 160ms ease, -webkit-box-shadow 160ms ease; transition: -webkit-transform 160ms ease, -webkit-box-shadow 160ms ease; transition: transform 160ms ease, box-shadow 160ms ease; transition: transform 160ms ease, box-shadow 160ms ease, -webkit-transform 160ms ease, -webkit-box-shadow 160ms ease; } .favorite-card .favorites-loader--pill { -webkit-animation: pillFadeIn 160ms ease-out; animation: pillFadeIn 160ms ease-out; } @-webkit-keyframes pillFadeIn { from { opacity: 0; -webkit-transform: scale(0.98); transform: scale(0.98); } to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes pillFadeIn { from { opacity: 0; -webkit-transform: scale(0.98); transform: scale(0.98); } to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } .favorite-card .favorite-card .favorite-icon[disabled] { opacity: 0.6; cursor: not-allowed; } @media only screen and (max-width: 767px) { .favorite-card .favorites-loader--pill .pill-label { min-width: 139px; font-size: 15px; padding: 8px 24px; } } @media (min-width: 768px) and (max-width: 1400px) { .favorite-card { display: grid; grid-template-columns: 100px 1fr; -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; padding: 8px 0 24px; /* ---------------- Row 1: image + details ---------------- */ /* ---------------- Rows 2–4: price/qty, points, CTA ---------------- */ } .favorite-card .image-details { display: grid; grid-template-columns: 100px 1fr; grid-template-areas: "image name" "image sku" "image attrs"; -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; grid-column: 1 / -1; min-width: 0; } .favorite-card .image-details .product-image { grid-area: image; width: 100px; height: 67px; aspect-ratio: 100 / 67; -o-object-fit: cover; object-fit: cover; border-radius: 6px; } .favorite-card .image-details .details { display: grid; grid-template-columns: 1fr; grid-template-areas: "name" "sku" "attrs"; row-gap: 8px; min-width: 0; /* allow truncation */ margin-bottom: 0px; } .favorite-card .image-details .details .prod-name { grid-area: name; font-size: 14px; overflow-wrap: anywhere; overflow: hidden; text-overflow: ellipsis; line-height: 17.5px; letter-spacing: -0.14px; } .favorite-card .image-details .details .sku-no { grid-area: sku; font-size: 12px; line-height: 12px; letter-spacing: 0.24px; } .favorite-card .image-details .details .attributes { grid-area: attrs; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 4px 6px; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .favorite-card .image-details .details .attributes span { padding: 2px 4px; font-size: 12px; line-height: 14px; background: #f0f0f0; border-radius: 1px; color: #080a0c; white-space: nowrap; max-width: 100%; letter-spacing: 0.12px; } .favorite-card .image-details .details .points { display: none !important; } .favorite-card .favorite-icon { top: -2px; right: 1px; width: 24px; height: 24px; padding: 4px; } .favorite-card .purchase-info { grid-column: 1 / -1; min-width: 0; } .favorite-card .purchase-info .actions { display: grid; grid-template-columns: 1fr auto; /* left | right */ grid-template-areas: "price qty" /* Row 2 */ "msrp msrp" "points points" /* Row 3: full width */ "cta cta"; /* Row 4: full width */ -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* prevent global center overrides */ justify-items: stretch; width: 100%; padding-top: 20px; max-width: unset; /* Row 2 */ /* Row 3 — DS Points (full width) */ /* Row 4 — CTA (full width, right end) */ } .favorite-card .purchase-info .actions .price { grid-area: price; align-self: center; text-align: initial; } .favorite-card .purchase-info .actions .msrp { grid-area: msrp; margin-top: 2px; /* keep it snug under price */ color: #999; font-size: 16px; line-height: 24px; font-weight: 600; } .favorite-card .purchase-info .actions .quantity-selector { grid-area: qty; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; justify-self: end; /* RIGHT EDGE */ padding: 0; min-width: 0; } .favorite-card .purchase-info .actions .quantity-selector input { width: 36px; padding: 4px 8px; } .favorite-card .purchase-info .actions .points { grid-area: points; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-width: 0; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; color: #013ba8; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; margin-top: 8px; } .favorite-card .purchase-info .actions .points .points-label { color: #333f4c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; margin-left: 4px; } .favorite-card .purchase-info .actions .points .no-points { color: #3e4d5c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; } .favorite-card .purchase-info .actions .points::before { content: "\002B"; color: #013ba8; font-family: "Montserrat"; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; } .favorite-card .purchase-info .actions .points:has(.no-points)::before { content: none; } .favorite-card .purchase-info .actions .add-to-cart { grid-area: cta; justify-self: end !important; /* RIGHT EDGE */ margin-top: 12px !important; } } @media only screen and (max-width: 767px) { .favorite-card { display: grid; grid-template-columns: 100px 1fr; -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; padding: 8px 0 24px; /* ---------------- Row 1: image + details ---------------- */ /* ---------------- Rows 2–4: price/qty, points, CTA ---------------- */ } .favorite-card .image-details { display: grid; grid-template-columns: 100px 1fr; grid-template-areas: "image name" "image sku" "image attrs"; -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; grid-column: 1 / -1; min-width: 0; } .favorite-card .image-details .product-image { grid-area: image; width: 100px; height: 67px; aspect-ratio: 100 / 67; -o-object-fit: cover; object-fit: cover; } .favorite-card .image-details .details { display: grid; grid-template-columns: 1fr; grid-template-areas: "name" "sku" "attrs"; row-gap: 8px; min-width: 0; /* allow truncation */ margin-bottom: 0px; } .favorite-card .image-details .details .prod-name { grid-area: name; font-size: 14px; overflow-wrap: anywhere; overflow: hidden; text-overflow: ellipsis; line-height: 17.5px; letter-spacing: -0.14px; } .favorite-card .image-details .details .sku-no { grid-area: sku; font-size: 12px; line-height: 12px; letter-spacing: 0.24px; } .favorite-card .image-details .details .attributes { grid-area: attrs; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 4px 6px; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .favorite-card .image-details .details .attributes span { padding: 2px 4px; font-size: 12px; white-space: nowrap; max-width: 100%; } .favorite-card .image-details .details .points { display: none !important; } .favorite-card .favorite-icon { top: -2px; right: 1px; width: 24px; height: 24px; padding: 4px; } .favorite-card .purchase-info { grid-column: 1 / -1; min-width: 0; } .favorite-card .purchase-info .actions { display: grid; grid-template-columns: 1fr auto; /* left | right */ grid-template-areas: "price qty" /* Row 2 */ "msrp qty" "points qty" /* Row 3: full width */ "cta cta"; /* Row 4: full width */ -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* prevent global center overrides */ justify-items: stretch; width: 100%; padding-top: 16px; max-width: unset; /* Row 2 */ /* Row 3 — DS Points (full width) */ /* Row 4 — CTA (full width, right end) */ } .favorite-card .purchase-info .actions .price { grid-area: price; align-self: center; text-align: initial; } .favorite-card .purchase-info .actions .msrp { grid-area: msrp; margin-top: 2px; color: #999; font-size: 16px; line-height: 24px; font-weight: 600; } .favorite-card .purchase-info .actions .quantity-selector { grid-area: qty; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; justify-self: end; /* RIGHT EDGE */ padding: 0; min-width: 0; } .favorite-card .purchase-info .actions .quantity-selector input { width: 50px; height: 36px; padding: 6px 12px; } .favorite-card .purchase-info .actions .points { grid-area: points; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-width: 0; /* keep it left aligned; remove text centering */ -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; color: #013ba8; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; margin-top: 4px; } .favorite-card .purchase-info .actions .points .points-label { color: #333f4c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; margin-left: 4px; } .favorite-card .purchase-info .actions .points .no-points { color: #3e4d5c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; } .favorite-card .purchase-info .actions .points::before { content: "\002B"; color: #013ba8; font-family: "Montserrat"; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; } .favorite-card .purchase-info .actions .points:has(.no-points)::before { content: none; } .favorite-card .purchase-info .actions .add-to-cart { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; grid-area: cta; justify-self: center !important; width: 100%; margin-top: 16px; } .favorite-card .purchase-info .actions .add-to-cart--label { -webkit-box-flex: unset; -ms-flex-positive: unset; flex-grow: unset; } } .input-fields-text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .input-fields-text label { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; color: #333f4c; margin-bottom: 0.5rem; line-height: 1.2188rem; } .input-fields-text label .required { margin-left: -0.25rem; } .input-fields-text label .required { color: #dc3545; } .input-fields-text input, .input-fields-text textarea { background: #fafafa; border: 0.0625rem solid #e1e5ea; border-radius: 0.75rem; padding: 0.5rem 0.75rem; font-family: 'Montserrat', sans-serif; font-size: 1rem; color: #607690; } .input-fields-text input::-webkit-input-placeholder, .input-fields-text textarea::-webkit-input-placeholder { color: #607690; } .input-fields-text input::-moz-placeholder, .input-fields-text textarea::-moz-placeholder { color: #607690; } .input-fields-text input:-ms-input-placeholder, .input-fields-text textarea:-ms-input-placeholder { color: #607690; } .input-fields-text input::-ms-input-placeholder, .input-fields-text textarea::-ms-input-placeholder { color: #607690; } .input-fields-text input::placeholder, .input-fields-text textarea::placeholder { color: #607690; } .input-fields-text input.input-error, .input-fields-text textarea.input-error { border-color: #dc3545; } .input-fields-text textarea { min-height: 6em; resize: vertical; } .input-fields-text textarea.input-error { border-color: #dc3545; } .input-fields-text .helper-text { font-family: 'Montserrat', sans-serif; font-size: 0.6875em; line-height: 1.5454; color: #607690; margin: 0.25em 0 0; } .input-fields-text .error-msg { color: #dc3545; font-size: 0.6875rem; margin-top: 0.25rem; font-weight: 400; line-height: 1.0625rem; color: #941A25; } .input-fields-text input.input-error { border: 0.0625rem solid #dc3545; border-radius: 0.75rem; } .input-fields-text input.input-error:focus, .input-fields-text input.input-error:focus-visible { outline: none; } .input-fields-password { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .input-fields-password label { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; color: #333f4c; margin-bottom: 0.5rem; line-height: 1.2188rem; } .input-fields-password label .required { margin-left: -0.25rem; } .input-fields-password label .required { color: #dc3545; } .input-fields-password__field { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .input-fields-password__field input { background: #fafafa; border: 0.0625rem solid #e1e5ea; border-radius: 0.75rem; padding: 0.5rem 0.75rem; font-family: 'Montserrat', sans-serif; font-size: 1rem; color: #607690; width: 100%; padding-right: 2.5em; } .input-fields-password__field input::-webkit-input-placeholder { color: #607690; } .input-fields-password__field input::-moz-placeholder { color: #607690; } .input-fields-password__field input:-ms-input-placeholder { color: #607690; } .input-fields-password__field input::-ms-input-placeholder { color: #607690; } .input-fields-password__field input::placeholder { color: #607690; } .input-fields-password__toggle { position: absolute; right: 0.625em; background: transparent; border: none; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: pointer; } .input-fields-password .error-msg { color: #dc3545; font-size: 0.6875rem; margin-top: 0.25rem; font-weight: 400; line-height: 1.0625rem; } .input-fields-dropdown { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .input-fields-dropdown label { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; color: #333f4c; margin-bottom: 0.5rem; line-height: 1.2188rem; } .input-fields-dropdown label .required { margin-left: -0.25rem; } .input-fields-dropdown label .required { color: #dc3545; } .input-fields-dropdown__control { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .input-fields-dropdown select { background: #fafafa; border: 0.0625rem solid #e1e5ea; border-radius: 0.75rem; padding: 0.5rem 0.75rem; font-family: 'Montserrat', sans-serif; font-size: 1rem; color: #607690; width: 100%; font-weight: 400; letter-spacing: -0.025em; padding-right: 2em; appearance: none; -webkit-appearance: none; -moz-appearance: none; } .input-fields-dropdown select::-webkit-input-placeholder { color: #607690; } .input-fields-dropdown select::-moz-placeholder { color: #607690; } .input-fields-dropdown select:-ms-input-placeholder { color: #607690; } .input-fields-dropdown select::-ms-input-placeholder { color: #607690; } .input-fields-dropdown select::placeholder { color: #607690; } .input-fields-dropdown select::-ms-expand { display: none; } .input-fields-dropdown select:focus, .input-fields-dropdown select:focus-visible { outline: none; border-color: #a3b2c1; -webkit-box-shadow: 0 0.625rem 0.9375rem -0.1875rem rgba(0, 0, 0, 0.1), 0 0.25rem 0.375rem -0.125rem rgba(0, 0, 0, 0.05); box-shadow: 0 0.625rem 0.9375rem -0.1875rem rgba(0, 0, 0, 0.1), 0 0.25rem 0.375rem -0.125rem rgba(0, 0, 0, 0.05); } .input-fields-dropdown__chevron { position: absolute; right: 0.75em; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); display: -webkit-box; display: -ms-flexbox; display: flex; pointer-events: none; } .input-fields-dropdown .helper-text { font-family: 'Montserrat', sans-serif; font-size: 0.6875em; line-height: 1.5454; color: #607690; margin: 0.25em 0 0; } .input-fields-dropdown .error-msg { color: #dc3545; font-size: 0.6875rem; margin-top: 0.25rem; font-weight: 400; line-height: 1.0625rem; } .input-fields-checkbox__label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 0.5rem; font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125em; color: #48596b; margin-top: 0; cursor: pointer; } .input-fields-checkbox__label .required { color: #dc3545; } .input-fields-checkbox__control { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-negative: 0; flex-shrink: 0; width: 1.8462em; height: 1.8462em; margin-top: 0.1538em; } .input-fields-checkbox__control svg { width: 100%; height: 100%; } .input-fields-checkbox__native { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; } .input-fields-checkbox .error-msg { color: #dc3545; font-size: 0.6875rem; margin-top: 0.25rem; font-weight: 400; line-height: 1.0625rem; } .input-fields-radio-group { border: none; padding: 0; margin: 0.5rem 0 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.5em; } .input-fields-radio-group legend { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; color: #333f4c; margin-bottom: 0.5rem; line-height: 1.2188rem; padding: 0; margin-bottom: 0; } .input-fields-radio-group legend .required { margin-left: -0.25rem; } .input-fields-radio-group legend .required { color: #dc3545; } .input-fields-radio-group__options { display: -webkit-box; display: -ms-flexbox; display: flex; } .input-fields-radio-group__options--vertical { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.5em; } .input-fields-radio-group__options--horizontal { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.4375em; } .input-fields-radio-group__option { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 0.5rem; font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125em; color: #48596b; cursor: pointer; margin-right: 1.25rem; } .input-fields-radio-group__control { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-negative: 0; flex-shrink: 0; width: 1.21875rem; height: 1.21875rem; } .input-fields-radio-group__control svg { width: 100%; height: 100%; } .input-fields-radio-group__native { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; } .input-fields-radio-group .error-msg { color: #dc3545; font-size: 0.6875rem; margin-top: 0.25rem; font-weight: 400; line-height: 1.0625rem; } .input-fields-file-upload { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .input-fields-file-upload label { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; color: #333f4c; margin-bottom: 0.5rem; line-height: 1.2188rem; } .input-fields-file-upload label .required { margin-left: -0.25rem; } .input-fields-file-upload label .required { color: #dc3545; } .input-fields-file-upload .upload-icon { margin-bottom: 0.875rem; } .input-fields-file-upload__dropzone { position: relative; background: #ffffff; border: 0.0625em solid #e1e5ea; border-radius: 0.5em; -webkit-box-shadow: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); box-shadow: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); padding: 1.5em 1em; text-align: center; cursor: pointer; } .input-fields-file-upload__dropzone-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; } .input-fields-file-upload__dropzone-inner { pointer-events: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.5em; } .input-fields-file-upload__dropzone-copy { font-family: 'Montserrat', sans-serif; font-size: 0.6875em; line-height: 1.5454; color: #48596b; margin: 0; } .input-fields-file-upload__dropzone-copy strong { font-weight: 600; } .input-fields-file-upload__dropzone-file { font-family: 'Montserrat', sans-serif; font-size: 0.6875em; color: #080a0c; margin: 0.3636em 0 0; } .input-fields-file-upload .error-msg { color: #dc3545; font-size: 0.6875rem; margin-top: 0.25rem; font-weight: 400; line-height: 1.0625rem; } .favorites-section { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; } .favorites-section .all-lists { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 36px; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; /* Simple CSS spinner */ } @media (max-width: 768px) { .favorites-section .all-lists { gap: 24px; } } .favorites-section .all-lists .favorites-block { display: grid; /* Desktop: two columns for header + link, then list full width */ grid-template-columns: 1fr auto; grid-template-areas: "header link" "list list"; row-gap: 16px; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; /* Empty modifier: dashed/dotted look */ /* Tablet: stack header, list, then link below the list */ } .favorites-section .all-lists .favorites-block .section-title { grid-area: header; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .favorites-section .all-lists .favorites-block .section-title .section-header { margin: 0; color: #333f4c; font-family: Montserrat; font-size: 24px; font-weight: 600; line-height: 28.8px; letter-spacing: -0.6px; } @media (max-width: 1400px) { .favorites-section .all-lists .favorites-block .section-title .section-header { font-size: 20px; line-height: 24px; letter-spacing: -0.5px; } } .favorites-section .all-lists .favorites-block .section-link { grid-area: link; align-self: center; color: #0f62fe; font-family: Montserrat; font-size: 16px; font-weight: 600; text-decoration: underline; line-height: 26px; } .favorites-section .all-lists .favorites-block .favorites-list { grid-area: list; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 12px; border: 1px solid #e1e5ea; border-radius: 12px; background: #fff; } .favorites-section .all-lists .favorites-block .favorites-list .favorite-card:not(:last-child) { border-bottom: 1px solid #e1e5ea; } .favorites-section .all-lists .favorites-block .favorites-list:has(> .favorites-list--empty) { /* Either completely remove the parent box… */ padding: 0; border: none; background: transparent; } @media (min-width: 768px) and (max-width: 1400px) { .favorites-section .all-lists .favorites-block { grid-template-columns: 1fr; grid-template-areas: "header" "list" "link"; } .favorites-section .all-lists .favorites-block .section-link { justify-self: center; } } @media only screen and (max-width: 767px) { .favorites-section .all-lists .favorites-block { grid-template-columns: 1fr; grid-template-areas: "header" "list" "link"; } .favorites-section .all-lists .favorites-block .section-link { justify-self: center; } } .favorites-section .all-lists .favorites-block.most-purchased .no-results--message-icon { display: none; } .favorites-section .all-lists .favorites-list { position: relative; min-height: 120px; /* ensures space for spinner; tune as needed */ } .favorites-section .all-lists .favorites-loader { position: absolute; inset: 0; /* top/right/bottom/left: 0 */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: rgba(255, 255, 255, 0.7); /* soft veil; use 0 if you want no veil */ backdrop-filter: blur(1px); /* optional subtle blur */ z-index: 3; /* above the list contents */ border-radius: 12px; /* match .favorites-list */ } .favorites-section .all-lists .favorites-loader .pill-label { cursor: pointer; } .favorites-section .all-lists .favorites-loader .spinner { width: 28px; height: 28px; border: 3px solid #cbd5e1; /* light */ border-top-color: #0f62fe; /* brand color */ border-radius: 50%; -webkit-animation: spin 0.9s linear infinite; animation: spin 0.9s linear infinite; margin-bottom: 8px; } .favorites-section .all-lists .favorites-loader .loader-text { color: #48596b; font-family: Montserrat; font-size: 14px; font-weight: 600; } @-webkit-keyframes spin { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spin { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .favorite-card { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 16px 24px 24px 12px; position: relative; gap: 24px; /* Favorite icon styling */ } .favorite-card:not(:last-child) { margin-bottom: 16px; } .favorite-card .image-details { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 16px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; width: 85%; } .favorite-card .image-details .product-image { width: 120px; height: 80px; -o-object-fit: cover; object-fit: cover; border-radius: 6px; cursor: pointer; } .favorite-card .image-details .details { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 12px; margin-bottom: 24px; /* Attributes container */ } .favorite-card .image-details .details .prod-name { overflow: hidden; color: #080a0c; text-overflow: ellipsis; font-family: Montserrat; font-size: 18px; font-style: normal; font-weight: 500; line-height: 22.5px; letter-spacing: -0.18px; } .favorite-card .image-details .details .prod-name a { display: inline-block; color: #080a0c; text-decoration: none; } .favorite-card .image-details .details .sku-no { color: #3e4d5c; font-variant-numeric: lining-nums tabular-nums; font-family: Montserrat; font-size: 14px; font-style: normal; font-weight: 500; line-height: 14px; letter-spacing: 0.28px; } .favorite-card .image-details .details .attributes { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; /* allows multiple rows */ gap: 4px 6px; /* spacing between pills */ } .favorite-card .image-details .details .attributes span { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 2px 4px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; border-radius: 1px; background: #f0f0f0; color: #080a0c; font-family: "Montserrat", sans-serif; font-size: 12px; font-style: normal; font-weight: 500; line-height: 14px; /* 116.667% */ letter-spacing: 0.12px; } .favorite-card .image-details .details .points { color: #013ba8; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; font-variant-numeric: lining-nums tabular-nums; } .favorite-card .image-details .details .points .points-label { color: #333f4c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; margin-left: 4px; } .favorite-card .image-details .details .points .no-points { color: #3e4d5c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; } .favorite-card .image-details .details .points::before { content: "\002B"; width: 12px; height: 12px; color: #013ba8; font-family: "Montserrat"; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; } .favorite-card .image-details .details .points:has(.no-points)::before { content: none; } .favorite-card .favorite-icon { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 4px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; right: 12px; top: 8px; cursor: pointer; background-color: #fff; border: none; } .favorite-card .purchase-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 16px; } .favorite-card .purchase-info .actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 16px; padding-top: 24px; } .favorite-card .purchase-info .actions .points { display: none; } .favorite-card .purchase-info .actions .loader { white-space: nowrap; } .favorite-card .purchase-info .actions .price { color: #080a0c; font-variant-numeric: lining-nums tabular-nums; font-family: Montserrat; font-size: 18px; font-style: normal; font-weight: 600; line-height: 21.6px; word-break: break-word; } .favorite-card .purchase-info .actions .msrp { color: #999; font-family: Montserrat; font-size: 16px; line-height: 24px; font-weight: 600; } .favorite-card .purchase-info .actions .quantity-selector { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0; gap: 8px; } .favorite-card .purchase-info .actions .quantity-selector button { width: 24px; height: 24px; border-radius: 50%; border: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 16px; cursor: pointer; padding: 0; line-height: 1px; } .favorite-card .purchase-info .actions .quantity-selector .decrease-icon { background-color: #f0f0f0; color: #080a0c; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .favorite-card .purchase-info .actions .quantity-selector .increase-icon { background-color: #080a0c; color: #fff; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .favorite-card .purchase-info .actions .quantity-selector input { height: 28px; width: 36px; /* for 1 digit */ max-width: 115px; /* for up to 5 digits */ text-align: center; border-radius: 3px; border: 1px solid #333f4c; color: #333f4c; font-family: "Montserrat", sans-serif; font-size: 14px; font-weight: 600; font-variant-numeric: lining-nums tabular-nums; line-height: 16.8px; } .favorite-card .purchase-info .actions .add-to-cart { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; padding: 8px 12px; border-radius: 50px; /* pill shape */ border: 1px solid #333f4c; background-color: #fff; /* or your theme color */ color: #333f4c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; /* 100% */ white-space: nowrap; width: 100%; } .favorite-card .favorite-card { position: relative; } .favorite-card .favorites-loader { position: absolute; inset: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; z-index: 5; border-radius: 12px; background: rgba(255, 255, 255, 0.65); backdrop-filter: blur(1px); } .favorite-card .favorites-loader--pill .pill-label { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 8px 24px; min-height: 19px; min-width: 139px; background: #ffffff; color: #333f4c; border: 1.5px solid #333f4c; border-radius: 50px; font-family: Montserrat; font-size: 16px; font-style: normal; font-weight: 600; line-height: 19px; -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition: -webkit-transform 160ms ease, -webkit-box-shadow 160ms ease; transition: -webkit-transform 160ms ease, -webkit-box-shadow 160ms ease; transition: transform 160ms ease, box-shadow 160ms ease; transition: transform 160ms ease, box-shadow 160ms ease, -webkit-transform 160ms ease, -webkit-box-shadow 160ms ease; } .favorite-card .favorites-loader--pill { -webkit-animation: pillFadeIn 160ms ease-out; animation: pillFadeIn 160ms ease-out; } @-webkit-keyframes pillFadeIn { from { opacity: 0; -webkit-transform: scale(0.98); transform: scale(0.98); } to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes pillFadeIn { from { opacity: 0; -webkit-transform: scale(0.98); transform: scale(0.98); } to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } .favorite-card .favorite-card .favorite-icon[disabled] { opacity: 0.6; cursor: not-allowed; } @media only screen and (max-width: 767px) { .favorite-card .favorites-loader--pill .pill-label { min-width: 139px; font-size: 15px; padding: 8px 24px; } } @media (min-width: 768px) and (max-width: 1400px) { .favorite-card { display: grid; grid-template-columns: 100px 1fr; -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; padding: 8px 0 24px; /* ---------------- Row 1: image + details ---------------- */ /* ---------------- Rows 2–4: price/qty, points, CTA ---------------- */ } .favorite-card .image-details { display: grid; grid-template-columns: 100px 1fr; grid-template-areas: "image name" "image sku" "image attrs"; -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; grid-column: 1 / -1; min-width: 0; } .favorite-card .image-details .product-image { grid-area: image; width: 100px; height: 67px; aspect-ratio: 100 / 67; -o-object-fit: cover; object-fit: cover; border-radius: 6px; } .favorite-card .image-details .details { display: grid; grid-template-columns: 1fr; grid-template-areas: "name" "sku" "attrs"; row-gap: 4px; min-width: 0; /* allow truncation */ margin-bottom: 0px; } .favorite-card .image-details .details .prod-name { grid-area: name; font-size: 14px; overflow-wrap: anywhere; overflow: hidden; text-overflow: ellipsis; line-height: 17.5px; letter-spacing: -0.14px; } .favorite-card .image-details .details .sku-no { grid-area: sku; font-size: 12px; line-height: 12px; letter-spacing: 0.24px; } .favorite-card .image-details .details .attributes { grid-area: attrs; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 4px 6px; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .favorite-card .image-details .details .attributes span { padding: 2px 4px; font-size: 12px; line-height: 14px; background: #f0f0f0; border-radius: 1px; color: #080a0c; white-space: nowrap; max-width: 100%; letter-spacing: 0.12px; } .favorite-card .image-details .details .points { display: none !important; } .favorite-card .favorite-icon { top: -2px; right: 1px; width: 24px; height: 24px; padding: 3px; } .favorite-card .purchase-info { grid-column: 1 / -1; min-width: 0; } .favorite-card .purchase-info .actions { display: grid; grid-template-columns: 1fr auto; /* left | right */ grid-template-areas: "price qty" /* Row 2 */ "msrp msrp" "points points" /* Row 3: full width */ "cta cta"; /* Row 4: full width */ -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* prevent global center overrides */ justify-items: stretch; width: 100%; padding-top: 20px; /* Row 2 */ /* Row 3 — DS Points (full width) */ /* Row 4 — CTA (full width, right end) */ } .favorite-card .purchase-info .actions .price { grid-area: price; align-self: center; } .favorite-card .purchase-info .actions .msrp { grid-area: msrp; margin-top: 2px; /* keep it snug under price */ color: #999; font-size: 16px; line-height: 24px; font-weight: 600; } .favorite-card .purchase-info .actions .quantity-selector { grid-area: qty; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 6px; justify-self: end; /* RIGHT EDGE */ padding: 0; min-width: 0; } .favorite-card .purchase-info .actions .points { grid-area: points; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-width: 0; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; color: #013ba8; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; } .favorite-card .purchase-info .actions .points .points-label { color: #333f4c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; margin-left: 4px; } .favorite-card .purchase-info .actions .points .no-points { color: #3e4d5c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; } .favorite-card .purchase-info .actions .points::before { content: "\002B"; color: #013ba8; font-family: "Montserrat"; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; } .favorite-card .purchase-info .actions .points:has(.no-points)::before { content: none; } .favorite-card .purchase-info .actions .add-to-cart { grid-area: cta; justify-self: end !important; /* RIGHT EDGE */ width: auto; margin-top: 12px !important; } } @media only screen and (max-width: 767px) { .favorite-card { display: grid; grid-template-columns: 100px 1fr; -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; padding: 8px 0 24px; /* ---------------- Row 1: image + details ---------------- */ /* ---------------- Rows 2–4: price/qty, points, CTA ---------------- */ } .favorite-card .image-details { display: grid; grid-template-columns: 100px 1fr; grid-template-areas: "image name" "image sku" "image attrs"; -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; grid-column: 1 / -1; min-width: 0; } .favorite-card .image-details .product-image { grid-area: image; width: 100px; height: 67px; aspect-ratio: 100 / 67; -o-object-fit: cover; object-fit: cover; } .favorite-card .image-details .details { display: grid; grid-template-columns: 1fr; grid-template-areas: "name" "sku" "attrs"; row-gap: 4px; min-width: 0; /* allow truncation */ margin-bottom: 0px; } .favorite-card .image-details .details .prod-name { grid-area: name; font-size: 14px; overflow-wrap: anywhere; overflow: hidden; text-overflow: ellipsis; line-height: 17.5px; letter-spacing: -0.14px; } .favorite-card .image-details .details .sku-no { grid-area: sku; font-size: 12px; line-height: 12px; letter-spacing: 0.24px; } .favorite-card .image-details .details .attributes { grid-area: attrs; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 4px 6px; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .favorite-card .image-details .details .attributes span { padding: 2px 4px; font-size: 12px; white-space: nowrap; max-width: 100%; } .favorite-card .image-details .details .points { display: none !important; } .favorite-card .favorite-icon { top: -2px; right: 1px; width: 24px; height: 24px; padding: 4px; } .favorite-card .purchase-info { grid-column: 1 / -1; min-width: 0; } .favorite-card .purchase-info .actions { display: grid; grid-template-columns: 1fr auto; /* left | right */ grid-template-areas: "price qty" /* Row 2 */ "msrp qty" "points qty" /* Row 3: full width */ "cta cta"; /* Row 4: full width */ -webkit-column-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; row-gap: 0px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* prevent global center overrides */ justify-items: stretch; width: 100%; padding-top: 16px; /* Row 2 */ /* Row 3 — DS Points (full width) */ /* Row 4 — CTA (full width, right end) */ } .favorite-card .purchase-info .actions .price { grid-area: price; align-self: center; } .favorite-card .purchase-info .actions .msrp { grid-area: msrp; margin-top: 2px; color: #999; font-size: 16px; line-height: 24px; font-weight: 600; } .favorite-card .purchase-info .actions .quantity-selector { grid-area: qty; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 6px; justify-self: end; /* RIGHT EDGE */ padding: 0; min-width: 0; } .favorite-card .purchase-info .actions .points { grid-area: points; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-width: 0; /* keep it left aligned; remove text centering */ -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; color: #013ba8; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; } .favorite-card .purchase-info .actions .points .points-label { color: #333f4c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; margin-left: 4px; } .favorite-card .purchase-info .actions .points .no-points { color: #3e4d5c; font-family: Montserrat; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; } .favorite-card .purchase-info .actions .points::before { content: "\002B"; color: #013ba8; font-family: "Montserrat"; font-size: 12px; font-style: normal; font-weight: 600; line-height: 12px; } .favorite-card .purchase-info .actions .points:has(.no-points)::before { content: none; } .favorite-card .purchase-info .actions .add-to-cart { grid-area: cta; justify-self: center !important; width: 100%; margin-top: 16px; } } .registration-benefits-panel { background: #0f62fe; width: 100%; padding: 2rem 1.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; color: #ffffff; } @media (min-width: 48rem) { .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem 2.875rem; } } .registration-benefits-panel-inner { position: sticky; top: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.875rem; color: #ffffff; } .registration-benefits-panel-inner h2 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.5rem; margin: 0; color: #ffffff; } .registration-benefits-panel__item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.625rem; } .registration-benefits-panel__item p { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.9375rem; margin: 0; } .registration-benefits-panel__icon { background: #ffffff; border-radius: 0.6875rem; width: 1.375rem; height: 1.375rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; } .registration-benefits-panel__more { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.875rem; margin: 0; } .registration-topbar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 4.625rem; padding: 1rem 1.25rem; border-bottom: 0.0625rem solid #e1e5ea; -webkit-box-sizing: border-box; box-sizing: border-box; } @media (min-width: 48rem) { .registration-topbar { padding: 1rem 2.5rem; } } .registration-topbar img { height: 1.875rem; max-width: 100%; display: block; } .account-lookup { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; min-height: 100vh; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } @media (min-width: 48rem) { .account-lookup { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } } .account-lookup__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .account-lookup__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } @media (min-width: 48rem) { .account-lookup__form-wrap { padding: 0; } } .account-lookup__card { width: 100%; max-width: 27.5rem; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } @media (max-width: 767px) { .account-lookup__card { padding-left: 0; padding-right: 0; width: 100%; } } .account-lookup__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; padding-top: 24px; letter-spacing: -0.575px; } .account-lookup__card .first-input { margin-bottom: 0.5em; } .account-lookup__subtitle { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; } .account-lookup__success, .account-lookup__notice, .account-lookup__error { font-family: 'Montserrat', sans-serif; font-size: 0.875rem; margin: 0; } .account-lookup__success { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.5rem; color: #0f62fe; } .account-lookup__notice { color: #607690; } .account-lookup__error { color: #dc3545; } .account-lookup form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.5rem; } .account-lookup .helper-link { display: block; background: none; border: none; padding: 0; text-align: left; font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 0.8125rem; color: #0f62fe; cursor: pointer; } .account-lookup .input-fields-button--primary { margin-top: 1rem; } @media (min-width: 768px) { .account-lookup { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .account-lookup__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .account-lookup__form-wrap { padding: 0 0 40px; } } @media (min-width: 48rem) and (max-width: 64rem) { .account-lookup .registration-benefits-panel { width: 40%; } } .account-lookup-failure { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } @media (min-width: 48rem) { .account-lookup-failure { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } } .account-lookup-failure__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .account-lookup-failure__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } @media (min-width: 48rem) { .account-lookup-failure__form-wrap { padding: 0; } } .account-lookup-failure__card { width: 100%; max-width: 27.5rem; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } .account-lookup-failure__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; padding-top: 1.5rem; } .account-lookup-failure__callout { background: #fae5e7; border-radius: 0.375rem; padding: 0.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.25rem; } .account-lookup-failure__callout-heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.25rem; } .account-lookup-failure__callout-label { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 0.8125rem; line-height: 1.2308; letter-spacing: 0.65px; text-transform: uppercase; color: #941a25; margin: 0; } .account-lookup-failure__callout-message { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; line-height: 1.5; color: #941a25; margin: 0; } .account-lookup-failure__support-link { font-weight: 600; color: #0f62fe; } @media (min-width: 48rem) and (max-width: 64rem) { .account-lookup-failure .registration-benefits-panel { width: 40%; } } .account-lookup-success { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-height: 100vh; width: 100%; } @media (min-width: 48rem) { .account-lookup-success { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } } .account-lookup-success__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .account-lookup-success__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0 1rem 2.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } @media (min-width: 48rem) { .account-lookup-success__form-wrap { padding: 0 0 2.5rem; } } .account-lookup-success__card { width: 100%; max-width: 27.5rem; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; } .account-lookup-success__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; letter-spacing: -0.575px; } .account-lookup-success__card h1 { padding-top: 1.5rem; } .account-lookup-success__subtitle { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; } .account-lookup-success__found-card { background: #ffffff; border: 0.0625rem solid #e1e5ea; border-radius: 0.75rem; padding: 1.125rem 1.25rem; -webkit-box-shadow: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.05); box-shadow: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.05); } .account-lookup-success__found-card p { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 0.8125rem; line-height: 1.5; color: #080a0c; margin: 0; } .account-lookup-success__support { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; line-height: 1.5; color: #48596b; margin: 0; } .account-lookup-success__support-link { font-weight: 600; color: #0f62fe; } .account-lookup-success .input-fields-button--primary { margin-top: 8px; } @media (min-width: 768px) { .account-lookup-success { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .account-lookup-success__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .account-lookup-success__form-wrap { padding: 0 0 40px; } .account-lookup-success__card { width: 440px; max-width: none; padding: 34px 24px 44px; } } .account-verified { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .account-verified__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-width: 0; } .account-verified__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1.5rem 1rem; } .account-verified__card { width: 100%; max-width: 27.5rem; padding: 1.5rem 1.5rem 2.75rem; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .account-verified__welcome { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; margin-bottom: 1rem; padding-top: 1.5rem; } .account-verified__practice-heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.25rem; margin-bottom: 1.5rem; } .account-verified__practice-title { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1rem; color: #080a0c; text-align: center; margin: 0; } .account-verified__practice-body { font-family: 'Montserrat', sans-serif; font-weight: 400; line-height: 1.5; color: #48596b; margin: 0; font-size: 1rem; } .account-verified .input-fields-radio-group { gap: 1rem; margin-top: 0; margin-bottom: 1.5rem; } .account-verified .input-fields-radio-group__option { padding: 0 0.75rem; font-size: 0.875rem; } .account-verified .input-fields-button--primary { width: 100%; } .account-verified .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem; } @media (min-width: 48rem) { .account-verified { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .account-verified__content { padding: 0; margin-top: 0.625rem; } .account-verified__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .account-verified .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .account-verified .registration-benefits-panel { width: 40%; } } .password-strength-checklist { margin: 0 0 1rem; } .password-strength-checklist__label { font-family: 'Montserrat', sans-serif; font-size: 0.8125em; color: #48596b; margin: 0 0 0.3125rem; line-height: 1.2188rem; } .password-strength-checklist__strength { font-weight: 700; } .password-strength-checklist__strength--weak { color: #d0021b; } .password-strength-checklist__strength--medium { color: #b8860b; } .password-strength-checklist__strength--strong { color: #34b24a; } .password-strength-checklist__rules { list-style: none; padding: 0; margin: 0; } .password-strength-checklist__rules li { font-family: 'Montserrat', sans-serif; font-size: 0.8125rem; color: #48596b; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 0.4375rem; margin-bottom: 0.3125rem; line-height: 1.4; } .password-strength-checklist__rules li.met { color: #333f4c; } .password-strength-checklist__rules li.met .password-strength-checklist__icon { color: #34b24a; } .password-strength-checklist__icon { -webkit-box-flex: 0; -ms-flex: 0 0 0.875em; flex: 0 0 0.875em; font-weight: 700; color: #d0021b; } .create-account { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .create-account__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .create-account__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .create-account__emailNotification { margin-top: 2.375rem; max-width: 44.25rem; padding: 0.5rem; border-radius: 0.375rem; background: #FDF5D8; font-family: 'Montserrat', sans-serif; } @media (max-width: 48rem) { .create-account__emailNotification { max-width: calc(100% - 3rem); } } .create-account__emailNotification h5 { font-size: 0.8125rem; line-height: 1rem; letter-spacing: 0.0406rem; font-weight: 600; text-transform: uppercase; color: #6A5406; margin-bottom: 0.25rem; } .create-account__emailNotification h5 svg { margin-right: 0.25rem; } .create-account__emailNotification p { font-size: 0.8125rem; font-weight: 400; color: #6A5406; margin: 0; line-height: 1.2188rem; } .create-account__emailNotification p a { font-weight: 600; text-decoration: none; color: #0f62fe; } .create-account__card { width: 100%; max-width: 27.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .create-account__heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1.5rem 0; } .create-account__heading h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; letter-spacing: -0.0359rem; } .create-account .about-text { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; } .create-account form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .create-account .helper-text { font-family: 'Montserrat', sans-serif; font-size: 0.6875rem; line-height: 1.5454; color: #678098; margin: 0.25rem 0 0; } .create-account .legal-text { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; color: #080a0c; margin-top: 0.9231em; margin-bottom: 0; } .create-account .legal-text a { font-weight: 600; color: #0f62fe; text-decoration: none; } .create-account .form-field { margin-bottom: 1rem; } .create-account .input-fields-button--primary { margin-top: 1.5rem; } .create-account .btn-link { margin-top: 1rem; } .create-account .error-msg { color: #dc3545; font-size: 0.6875rem; margin-top: 0.25rem; font-weight: 400; line-height: 1.0625rem; } .create-account .success-msg { color: #2a7a2a; } .create-account .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem; } .input-error input, .input-error select, .input-error textarea { border: 0.0625rem solid #dc3545; } .input-fields-dropdown.input-error select, .input-fields-dropdown__control.input-error select { color: #dc3545; } .input-fields-dropdown.input-error select option, .input-fields-dropdown__control.input-error select option { color: #607690; } .input-fields-dropdown.input-error .input-fields-dropdown__chevron svg path, .input-fields-dropdown__control.input-error .input-fields-dropdown__chevron svg path, .input-fields-dropdown.input-error .input-fields-dropdown__chevron svg path, .input-fields-dropdown__control.input-error .input-fields-dropdown__chevron svg path { fill: #dc3545; } .input-fields-dropdown.input-error .error-msg, .input-fields-dropdown__control.input-error .error-msg { margin-bottom: 0.75rem; } @media (min-width: 48rem) { .create-account { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .create-account .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .create-account .registration-benefits-panel { width: 40%; } } .email-verification { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .email-verification *, .email-verification *::before, .email-verification *::after { -webkit-box-sizing: inherit; box-sizing: inherit; } .email-verification__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-width: 0; } .email-verification__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1rem 1rem 1.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; } .email-verification__content .page-loader { position: absolute; inset: 0; background: rgba(255, 255, 255, 0.7); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; z-index: 9999; } .email-verification__card { width: 100%; max-width: 27.5rem; padding: 1rem 0 2rem; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1rem; } .email-verification__card--pending { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-top: 4rem; padding-bottom: 4rem; } .email-verification__heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; padding-top: 1.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; } .email-verification__heading h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; } .email-verification__pending-text { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; } .email-verification__subtitle { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; width: 100%; text-align: left; } .email-verification__email { font-weight: 700; } .email-verification__link { font-family: 'Montserrat', sans-serif; font-weight: 600; color: #0f62fe; text-decoration: none; } .email-verification__link:focus-visible { outline: 0.125em solid #0f62fe; outline-offset: 0.125em; } .email-verification__notice { font-family: 'Montserrat', sans-serif; font-size: 0.8125rem; color: #0f62fe; margin: 0; } .email-verification__illustration { display: block; max-width: 100%; width: 13.75rem; } .email-verification__illustration svg { display: block; width: 100%; height: auto; } .email-verification .input-fields-button--primary { width: 100%; margin-top: 0.5rem; } .email-verification .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem 2.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; } @media (min-width: 48rem) { .email-verification { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .email-verification__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .email-verification__content { padding: 0.625rem 2.5rem 2.5rem 2.5rem; } .email-verification__card { padding: 1.5rem 1.5rem 2.75rem; } .email-verification .input-fields-button--primary { width: 100%; } .email-verification .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .email-verification .registration-benefits-panel { width: 40%; } } .join-practice-poc { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .join-practice-poc__left { width: 100%; background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .join-practice-poc__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 1rem 1.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } .join-practice-poc__card { width: 100%; max-width: 22.375rem; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .join-practice-poc__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; padding-top: 1.5rem; } .join-practice-poc__subtitle { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #080a0c; margin: 0; } .join-practice-poc__error { font-family: 'Montserrat', sans-serif; font-size: 0.875rem; color: #dc3545; margin: 0; } .join-practice-poc__account-card { background: #ffffff; border: 0.0625rem solid #e1e5ea; border-radius: 0.75rem; -webkit-box-shadow: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.05); box-shadow: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.05); padding: 1.125rem 1.25rem; } .join-practice-poc__account-card p { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 0.8125rem; line-height: 1.5; color: #080a0c; margin: 0; } .join-practice-poc__support { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; line-height: 1.5; color: #48596b; margin: 0; } .join-practice-poc__support a { font-weight: 600; color: #0f62fe; text-decoration: none; } .join-practice-poc form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .join-practice-poc .input-fields-button--primary { border-radius: 3.75rem; padding: 0.5rem 1rem; height: auto; font-size: 0.8125rem; line-height: 1rem; margin-top: 0.5rem; } .join-practice-poc .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; } @media (min-width: 48rem) { .join-practice-poc { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .join-practice-poc__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .join-practice-poc__form-wrap { padding: 0; } .join-practice-poc__card { width: 27.5rem; max-width: none; } .join-practice-poc .input-fields-button--primary { height: 3rem; padding: 0; border-radius: 3.125rem; font-size: 1.1875rem; line-height: 1.4375rem; } .join-practice-poc .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .join-practice-poc .registration-benefits-panel { width: 40%; } } .marketing-opt-in { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .marketing-opt-in__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .marketing-opt-in__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; } .marketing-opt-in__card { width: 100%; max-width: 22.375rem; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1rem; } .marketing-opt-in__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.725rem; letter-spacing: -0.575px; color: #080a0c; text-align: center; margin: 0; width: 100%; padding: 1.5rem 0 0; } .marketing-opt-in__error { font-family: 'Montserrat', sans-serif; font-size: 0.875rem; color: #941A25; margin: 0; text-align: center; } .marketing-opt-in__image { width: 17.5rem; height: 6.5rem; border-radius: 0.5rem; overflow: hidden; } .marketing-opt-in__image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; } .marketing-opt-in__body { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5rem; color: #080a0c; margin: 0; width: 100%; } .marketing-opt-in__benefit-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 0.625rem; width: 100%; } .marketing-opt-in__benefit-row p { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 0.8125rem; line-height: 1.2188rem; color: #080a0c; margin: 0; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .marketing-opt-in__benefit-icon { -ms-flex-negative: 0; flex-shrink: 0; width: 1.375rem; height: 1.375rem; } .marketing-opt-in__hr { width: 100%; border: none; border-top: 0.0625rem solid #e1e5ea; margin: 0; opacity: unset; } .marketing-opt-in__fineprint-group { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.5rem; width: 100%; } .marketing-opt-in__question { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.8125rem; line-height: 1.5; color: #080a0c; margin: 0; } .marketing-opt-in__question a { font-weight: 600; color: #0f62fe; text-decoration: none; } .marketing-opt-in__finePrint { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 0.6875rem; line-height: 1.0625rem; color: #48596b; margin: 0; } .marketing-opt-in__finePrint a { color: #48596b; text-decoration: none; } .marketing-opt-in .input-fields-button--primary, .marketing-opt-in__decline { width: 100%; font-family: 'Montserrat', sans-serif; font-weight: 600; cursor: pointer; } .marketing-opt-in .input-fields-button--primary { height: 2.5rem; border-radius: 3.75rem; font-size: 0.8125rem; line-height: 1rem; margin-top: 0.5rem; } .marketing-opt-in__decline { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 1.5rem; font-size: 0.8125rem; line-height: 1rem; text-align: center; } .marketing-opt-in .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem; } @media (min-width: 48rem) { .marketing-opt-in { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .marketing-opt-in__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .marketing-opt-in__form-wrap { padding: 0 0 2.5rem; } .marketing-opt-in__card { width: 27.5rem; max-width: none; padding: 2.125rem 1.5rem 2.75rem; } .marketing-opt-in .input-fields-button--primary { height: 3rem; font-size: 1.1875rem; line-height: 1.4375rem; margin-top: 0.5rem; } .marketing-opt-in__decline { height: 1.5rem; font-size: 1rem; line-height: 1.1875rem; } .marketing-opt-in .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (max-width: 767px) { .marketing-opt-in__form-wrap { padding: 1.5em 1em; } .marketing-opt-in__form-wrap .marketing-opt-in__card { max-width: 100%; } } @media (min-width: 48rem) and (max-width: 64rem) { .marketing-opt-in .registration-benefits-panel { width: 40%; } } .practice-details { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .practice-details__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .practice-details__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .practice-details__card { width: 100%; max-width: 27.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .practice-details__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; padding: 1.5rem 0; } .practice-details__section { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1rem; line-height: 1.5; color: #080a0c; margin: 0; } .practice-details__error { font-family: 'Montserrat', sans-serif; font-size: 0.875rem; color: #dc3545; margin: 0; } .practice-details form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .practice-details .input-fields-button--primary { width: 100%; font-size: 1.1875rem; line-height: 1.4375rem; font-weight: 600; margin-top: 1rem; } .practice-details .registration-benefits-panel { width: 100%; } .practice-details__licensing { padding-top: 1rem; border-top: 1px solid #e1e5ea; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .practice-details____sub-group { padding: 1rem 1rem 1.5rem 0.875rem; border-left: 2px solid #DAE7FF; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; background: #F9FCFF; } .practice-details__explanation-example { color: #678098; font-size: 0.6875rem; font-style: normal; font-weight: 400; line-height: 1.0625rem; margin-top: 0.5rem; } .practice-details__tax-cert-notice { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 0.5rem; background: #FEF7E0; border: 1px solid #F5C344; border-radius: 0.25rem; padding: 0.75rem 1rem; } .practice-details__tax-cert-notice p { margin: 0; font-family: 'Montserrat', sans-serif; font-size: 0.8125rem; line-height: 1.375rem; color: #080a0c; } .practice-details__tax-cert-notice strong { color: #96690A; letter-spacing: 0.02em; } .practice-details__tax-cert-notice a { color: #0F62FE; text-decoration: underline; } .practice-details__tax-cert-notice-icon { font-size: 1rem; line-height: 1.375rem; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .practice-details__notice { font-family: 'Montserrat', sans-serif; font-size: 0.8125rem; color: #678098; margin: 0; } @media (min-width: 48rem) { .practice-details { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .practice-details__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .practice-details__form-wrap { padding: 0 0 2.5rem; } .practice-details__card { width: 27.5rem; max-width: none; padding: 1.5rem 1.5rem 2.75rem; } .practice-details .registration-benefits-panel { max-width: 28.75rem; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; } } @media (min-width: 48rem) and (max-width: 64rem) { .practice-details .registration-benefits-panel { width: 40%; } } .offline-cus-fetch-cim-ids { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .offline-cus-fetch-cim-ids__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .offline-cus-fetch-cim-ids__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } .offline-cus-fetch-cim-ids__card { width: 100%; max-width: 22.375rem; padding: 1.875rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1rem; } .offline-cus-fetch-cim-ids__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; letter-spacing: -0.575px; color: #080a0c; text-align: center; margin: 0; padding-top: 1.5rem; } .offline-cus-fetch-cim-ids__icon-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 0; } .offline-cus-fetch-cim-ids__body { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #080a0c; text-align: start; margin: 0; width: 100%; margin-bottom: 0.5rem; } .offline-cus-fetch-cim-ids__error { font-family: 'Montserrat', sans-serif; font-size: 0.8125rem; color: #dc3545; text-align: center; margin: 0; } .offline-cus-fetch-cim-ids .input-fields-link--primary { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; padding: 0.5rem 1rem; border-radius: 3.75rem; font-size: 0.8125rem; line-height: 1rem; } .offline-cus-fetch-cim-ids .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem; } @media (min-width: 48rem) { .offline-cus-fetch-cim-ids { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; min-height: 100vh; } .offline-cus-fetch-cim-ids__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; padding-bottom: 2.5rem; } .offline-cus-fetch-cim-ids__form-wrap { margin-top: 0.625rem; } .offline-cus-fetch-cim-ids__card { max-width: 27.5rem; padding: 1.875rem 1.5rem 2.75rem; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } .offline-cus-fetch-cim-ids .input-fields-link--primary { height: 3rem; padding: 0.75rem 1.5rem; border-radius: 3.125rem; font-size: 1.1875rem; line-height: 1.4375rem; } .offline-cus-fetch-cim-ids .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .offline-cus-fetch-cim-ids .registration-benefits-panel { width: 40%; } } .offline-practice-accounts { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } @media (min-width: 48rem) { .offline-practice-accounts { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } } .offline-practice-accounts__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .offline-practice-accounts__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0 1rem 2.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } @media (min-width: 48rem) { .offline-practice-accounts__form-wrap { padding: 0 0 2.5rem; } } .offline-practice-accounts__card { width: 100%; max-width: 27.5rem; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; } .offline-practice-accounts__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; letter-spacing: -0.575px; padding-top: 1.5rem; } .offline-practice-accounts__subtitle { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; } .offline-practice-accounts__row { background: #ffffff; border: 0.0625rem solid #e1e5ea; border-radius: 0.75rem; padding: 1.125rem 1.25rem; -webkit-box-shadow: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.05); box-shadow: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.05); } .offline-practice-accounts__row p { font-family: 'Montserrat', sans-serif; font-size: 0.8125rem; line-height: 1.5; color: #48596b; margin: 0; } .offline-practice-accounts__row-name { font-weight: 700; color: #080a0c; } .offline-practice-accounts__error { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; color: #dc3545; } .offline-practice-accounts .input-fields-radio-group__options { gap: 0.75rem; } @media (min-width: 768px) { .offline-practice-accounts { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .offline-practice-accounts__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .offline-practice-accounts__form-wrap { padding: 0 0 40px; } .offline-practice-accounts__card { width: 440px; max-width: none; padding: 34px 24px 44px; } } .practice-details-continued { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .practice-details-continued__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .practice-details-continued__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .practice-details-continued__card { width: 100%; max-width: 27.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1.5rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .practice-details-continued__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; padding: 1.5rem 0; } .practice-details-continued__section { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1rem; line-height: 1.5; color: #080a0c; margin: 0; } .practice-details-continued__error { color: #dc3545; font-size: 0.6875rem; margin-top: 0.25rem; font-weight: 400; line-height: 1.0625rem; font-size: 0.875rem; margin: 0; } .practice-details-continued__divider { border: none; border-top: 0.0625rem solid #e1e5ea; margin: 0.5rem 0 0; opacity: 1; } .practice-details-continued__extra-address { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.5rem; } .practice-details-continued__extra-address-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .practice-details-continued__extra-address-header .practice-details-continued__add-link { -ms-flex-item-align: center; align-self: center; } .practice-details-continued__add-link { background: none; border: none; padding: 0; margin: 0; font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 0.8125rem; line-height: 1rem; color: #0f62fe; cursor: pointer; text-align: left; -ms-flex-item-align: start; align-self: flex-start; } .practice-details-continued form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } .practice-details-continued .input-fields-button--primary { width: 100%; font-size: 1.1875rem; line-height: 1.4375rem; font-weight: 600; margin-top: 1rem; } .practice-details-continued .registration-benefits-panel { width: 100%; } .practice-details-continued__extra-address { padding: 1rem 1rem 1.5rem 0.875rem; border-left: 2px solid #DAE7FF; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } @media (min-width: 48rem) { .practice-details-continued { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .practice-details-continued__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .practice-details-continued__form-wrap { padding: 0 0 2.5rem; } .practice-details-continued__card { width: 27.5rem; max-width: none; padding: 1.5rem 1.5rem 2.75rem; } .practice-details-continued .registration-benefits-panel { max-width: 28.75rem; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; } } @media (min-width: 48rem) and (max-width: 64rem) { .practice-details-continued { width: 40%; } } .verify-email-failed { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .verify-email-failed *, .verify-email-failed *::before, .verify-email-failed *::after { -webkit-box-sizing: inherit; box-sizing: inherit; } .verify-email-failed__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-width: 0; } .verify-email-failed__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1rem 1rem 1.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; } .verify-email-failed__card { width: 100%; max-width: 27.5rem; padding: 1rem 0 2rem; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1rem; } .verify-email-failed__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; text-align: center; padding-top: 1.5rem; } .verify-email-failed__subtitle { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; width: 100%; text-align: left; } .verify-email-failed__email-link, .verify-email-failed__link { font-family: 'Montserrat', sans-serif; text-decoration: underline; } .verify-email-failed__email-link:focus-visible, .verify-email-failed__link:focus-visible { outline: 0.125em solid #0f62fe; outline-offset: 0.125em; } .verify-email-failed__email-link { color: inherit; font-weight: 700; } .verify-email-failed__link { font-weight: 600; font-size: 0.8125rem; color: #0f62fe; } .verify-email-failed__notice { font-family: 'Montserrat', sans-serif; font-size: 0.8125rem; color: #0f62fe; margin: 0; } .verify-email-failed .input-fields-button--primary { width: 100%; margin-top: 0.5rem; } .verify-email-failed .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem 2.5rem; -webkit-box-sizing: border-box; box-sizing: border-box; } @media (min-width: 48rem) { .verify-email-failed { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .verify-email-failed__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .verify-email-failed__content { padding: 0.625rem 2.5rem 2.5rem; } .verify-email-failed__card { padding: 1.5rem 1.5rem 2.75rem; } .verify-email-failed .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .verify-email-failed .registration-benefits-panel { width: 40%; } } .registration-successful { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .registration-successful__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .registration-successful__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } .registration-successful__card { width: 100%; max-width: 22.375rem; padding: 1.875rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1rem; } .registration-successful__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; letter-spacing: -0.575px; color: #080a0c; text-align: center; margin: 0; padding-top: 1.5rem; } .registration-successful__icon-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 0; } .registration-successful__body { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #080a0c; text-align: start; margin: 0; width: 100%; margin-bottom: 0.5rem; } .registration-successful__error { font-family: 'Montserrat', sans-serif; font-size: 0.8125rem; color: #dc3545; text-align: center; margin: 0; } .registration-successful .input-fields-link--primary { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; padding: 0.5rem 1rem; border-radius: 3.75rem; font-size: 0.8125rem; line-height: 1rem; } .registration-successful .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem; } @media (min-width: 48rem) { .registration-successful { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; min-height: 100vh; } .registration-successful__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; padding-bottom: 2.5rem; } .registration-successful__form-wrap { margin-top: 0.625rem; } .registration-successful__card { max-width: 27.5rem; padding: 1.875rem 1.5rem 2.75rem; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } .registration-successful .input-fields-link--primary { height: 3rem; padding: 0.75rem 1.5rem; border-radius: 3.125rem; font-size: 1.1875rem; line-height: 1.4375rem; } .registration-successful .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .registration-successful .registration-benefits-panel { width: 40%; } } .request-sent { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .request-sent__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .request-sent__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } .request-sent__card { width: 100%; max-width: 22.375rem; padding: 1.875rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1rem; } .request-sent__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; letter-spacing: -0.575px; color: #080a0c; text-align: center; margin: 0; padding-top: 1.5rem; } .request-sent__icon-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 0; } .request-sent__body { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #080a0c; text-align: start; margin: 0; width: 100%; margin-bottom: 0.5rem; } .request-sent .input-fields-link--primary { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; padding: 0.5rem 1rem; border-radius: 3.75rem; font-size: 0.8125rem; line-height: 1rem; } .request-sent .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem; } @media (min-width: 48rem) { .request-sent { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; min-height: 100vh; } .request-sent__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; padding-bottom: 2.5rem; } .request-sent__form-wrap { margin-top: 0.625rem; padding: 0; } .request-sent__card { max-width: 27.5rem; padding: 1.875rem 1.5rem 2.75rem; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } .request-sent .input-fields-link--primary { height: 3rem; padding: 0.75rem 1.5rem; border-radius: 3.125rem; font-size: 1.1875rem; line-height: 1.4375rem; } .request-sent .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .request-sent .registration-benefits-panel { width: 40%; } } .tax-certification { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; min-height: 100vh; } .tax-certification__left { background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .tax-certification__form-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 0.625rem; } .tax-certification__card { width: 100%; max-width: 22.375rem; padding: 1.875rem 1.5rem 2.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1rem; } .tax-certification__card h1 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; letter-spacing: -0.575px; color: #080a0c; text-align: center; margin: 0; padding-top: 1.5rem; } .tax-certification__icon-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.5rem 0; } .tax-certification__body { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #080a0c; text-align: start; margin: 0; width: 100%; margin-bottom: 0.5rem; } .tax-certification__tax-note { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #080a0c; text-align: left; margin: 0; width: 100%; margin-bottom: 0.5rem; } .tax-certification__tax-note-bold { font-weight: 600; } .tax-certification__link { color: #0f62fe; font-weight: 500; text-decoration: none; } .tax-certification__link:hover { text-decoration: underline; } .tax-certification .input-fields-link--primary { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; padding: 0.5rem 1rem; border-radius: 3.75rem; font-size: 0.8125rem; line-height: 1rem; } .tax-certification .registration-benefits-panel { width: 100%; height: auto; padding: 2rem 1.5rem; } @media (min-width: 48rem) { .tax-certification { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; min-height: 100vh; } .tax-certification__left { -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; padding-bottom: 2.5rem; } .tax-certification__form-wrap { padding: 0 0 2.5rem; margin-top: 0.625rem; } .tax-certification__card { max-width: 27.5rem; padding: 1.875rem 1.5rem 2.75rem; } .tax-certification .input-fields-link--primary { height: 3rem; padding: 0.75rem 1.5rem; border-radius: 3.125rem; font-size: 1.1875rem; line-height: 1.4375rem; } .tax-certification .registration-benefits-panel { width: 28.75rem; padding: 14.3125rem 2.875rem 2.75rem; } } @media (min-width: 48rem) and (max-width: 64rem) { .tax-certification .registration-benefits-panel { width: 40%; } } .registration-route-fullbleed { width: calc(100vw - 8px); position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; } @media (max-width: 767px) { .registration-route-fullbleed { width: calc(100vw); } } @media (min-width: 768px) and (max-width: 1024px) { .registration-route-fullbleed { width: calc(100vw); } } .registration-one-trust { display: block !important; position: fixed !important; left: 16px; bottom: 16px; z-index: 1000; } .resend-invite-modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1000; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .resend-invite-modal__overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(8, 10, 12, 0.5); } .resend-invite-modal__card { position: relative; width: 100%; max-width: 100%; background: #ffffff; border-radius: 0.75rem 0.75rem 0 0; padding: 1.5rem 1.25rem 1.25rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.75rem; -webkit-box-shadow: 0 -0.25rem 1.25rem rgba(8, 10, 12, 0.15); box-shadow: 0 -0.25rem 1.25rem rgba(8, 10, 12, 0.15); } .resend-invite-modal__close { position: absolute; top: 0.75rem; right: 0.75rem; background: transparent; border: none; font-size: 1.375rem; line-height: 1; color: #607690; cursor: pointer; padding: 0.25rem; } .resend-invite-modal h2 { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.4375rem; line-height: 1.2; color: #080a0c; margin: 0; padding-right: 1.5rem; } .resend-invite-modal__body { font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5; color: #48596b; margin: 0; } .resend-invite-modal__error { font-family: 'Montserrat', sans-serif; font-size: 0.875rem; color: #dc3545; margin: 0; } .resend-invite-modal__actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-top: 0.5rem; } .resend-invite-modal .input-fields-button--primary { width: 100%; } @media (min-width: 48rem) { .resend-invite-modal { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .resend-invite-modal__card { max-width: 25rem; border-radius: 0.75rem; padding: 2rem 2rem 1.75rem; } .resend-invite-modal__actions { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .resend-invite-modal .input-fields-button--primary { width: auto; min-width: 11.25rem; } } @-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } @keyframes spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes stroke { to { stroke-dashoffset: 0; } } @keyframes stroke { to { stroke-dashoffset: 0; } } @-webkit-keyframes fadeIn { to { opacity: 1; } } @keyframes fadeIn { to { opacity: 1; } } input[type="search"] { -webkit-appearance: searchfield; -webkit-box-sizing: content-box; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: searchfield-cancel-button; } :root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px, 0, 0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px;.swiper-slide,.swiper-cube-shadow{transform-style:preserve-3d}}.swiper-css-mode{>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none;&::-webkit-scrollbar{display:none}}>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}&.swiper-horizontal{>.swiper-wrapper{scroll-snap-type:x mandatory}}&.swiper-vertical{>.swiper-wrapper{scroll-snap-type:y mandatory}}&.swiper-free-mode{>.swiper-wrapper{scroll-snap-type:none}>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}}&.swiper-centered{>.swiper-wrapper::before{content:"";flex-shrink:0;order:9999}>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}}&.swiper-centered.swiper-horizontal{>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}}&.swiper-centered.swiper-vertical{>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}}}.swiper-3d{.swiper-slide-shadow,.swiper-slide-shadow-left,.swiper-slide-shadow-right,.swiper-slide-shadow-top,.swiper-slide-shadow-bottom,.swiper-slide-shadow,.swiper-slide-shadow-left,.swiper-slide-shadow-right,.swiper-slide-shadow-top,.swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-slide-shadow{background:rgba(0, 0, 0, 0.15)}.swiper-slide-shadow-left{background-image:linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-slide-shadow-right{background-image:linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-slide-shadow-top{background-image:linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress),.swiper-watch-progress .swiper-slide-visible{.swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:root{--swiper-navigation-size: 44px}.swiper-button-prev,.swiper-button-next{position:absolute;width:var(--swiper-navigation-size);height:var(--swiper-navigation-size);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color));&.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}&.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled &{display:none !important}svg{width:100%;height:100%;object-fit:contain;transform-origin:center;fill:currentColor;pointer-events:none}}.swiper-button-lock{display:none}.swiper-button-prev,.swiper-button-next{top:var(--swiper-navigation-top-offset, 50%);margin-top:calc(0px - var(--swiper-navigation-size)/2)}.swiper-button-prev{left:var(--swiper-navigation-sides-offset, 4px);right:auto;.swiper-navigation-icon{transform:rotate(180deg)}}.swiper-button-next{right:var(--swiper-navigation-sides-offset, 4px);left:auto}.swiper-horizontal{.swiper-button-prev,.swiper-button-next,~.swiper-button-prev,~.swiper-button-next{top:var(--swiper-navigation-top-offset, 50%);margin-top:calc(0px - var(--swiper-navigation-size)/2);margin-left:0}.swiper-button-prev,&~.swiper-button-prev,&.swiper-rtl .swiper-button-next,&.swiper-rtl~.swiper-button-next{left:var(--swiper-navigation-sides-offset, 4px);right:auto}.swiper-button-next,&~.swiper-button-next,&.swiper-rtl .swiper-button-prev,&.swiper-rtl~.swiper-button-prev{right:var(--swiper-navigation-sides-offset, 4px);left:auto}.swiper-button-prev,&~.swiper-button-prev,&.swiper-rtl .swiper-button-next,&.swiper-rtl~.swiper-button-next{.swiper-navigation-icon{transform:rotate(180deg)}}&.swiper-rtl .swiper-button-prev,&.swiper-rtl~.swiper-button-prev{.swiper-navigation-icon{transform:rotate(0deg)}}}.swiper-vertical{.swiper-button-prev,.swiper-button-next,~.swiper-button-prev,~.swiper-button-next{left:var(--swiper-navigation-top-offset, 50%);right:auto;margin-left:calc(0px - var(--swiper-navigation-size)/2);margin-top:0}.swiper-button-prev,~.swiper-button-prev{top:var(--swiper-navigation-sides-offset, 4px);bottom:auto;.swiper-navigation-icon{transform:rotate(-90deg)}}.swiper-button-next,~.swiper-button-next{bottom:var(--swiper-navigation-sides-offset, 4px);top:auto;.swiper-navigation-icon{transform:rotate(90deg)}}}.swiper-pagination{position:absolute;text-align:center;transition:300ms opacity;transform:translate3d(0, 0, 0);z-index:10;&.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>&,&.swiper-pagination-disabled{display:none !important}}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0;.swiper-pagination-bullet{transform:scale(0.33);position:relative}.swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullet-active-prev{transform:scale(0.66)}.swiper-pagination-bullet-active-prev-prev{transform:scale(0.33)}.swiper-pagination-bullet-active-next{transform:scale(0.66)}.swiper-pagination-bullet-active-next-next{transform:scale(0.33)}}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, 0.2);button&{border:none;margin:0;padding:0;box-shadow:none;appearance:none}.swiper-pagination-clickable &{cursor:pointer}&:only-child{display:none !important}}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0px, -50%, 0);.swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}&.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px;.swiper-pagination-bullet{display:inline-block;transition:200ms transform,200ms top}}}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-horizontal.swiper-pagination-bullets{.swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}&.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap;.swiper-pagination-bullet{transition:200ms transform,200ms left}}}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:200ms transform,200ms right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));position:absolute;.swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl & .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>&,&.swiper-pagination-horizontal,.swiper-vertical>&.swiper-pagination-progressbar-opposite,&.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>&,&.swiper-pagination-vertical,.swiper-horizontal>&.swiper-pagination-progressbar-opposite,&.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}}.swiper-pagination-lock{display:none}.shop-featured-products-container{position:relative}.shop-featured-products-container .shop-featured-products--nav-left,.shop-featured-products-container .shop-featured-products--nav-right{display:none}@media(min-width: 48rem){.shop-featured-products-container .shop-featured-products--nav-left:not(.swiper-button-disabled),.shop-featured-products-container .shop-featured-products--nav-right:not(.swiper-button-disabled){display:flex}.shop-featured-products-container .shop-featured-products--nav-left,.shop-featured-products-container .shop-featured-products--nav-right{height:2.5rem;width:2.5rem}.shop-featured-products-container .shop-featured-products--nav-left::after,.shop-featured-products-container .shop-featured-products--nav-right::after{height:2.5rem;width:2.5rem}.shop-featured-products-container .shop-featured-products--nav-left .swiper-navigation-icon,.shop-featured-products-container .shop-featured-products--nav-right .swiper-navigation-icon{height:1.0313125rem;width:0.5625625rem;color:#333f4c}}.shop-featured-products-container .shop-featured-products--nav-left{left:-1.25rem}.shop-featured-products-container .shop-featured-products--nav-left .swiper-navigation-icon{transform:rotate(180deg) !important;-webkit-transform:rotate(180deg) !important}.shop-featured-products-container .shop-featured-products--nav-right{right:-1.25rem}.shop-featured-products--swiper{margin-top:1rem;margin-bottom:1rem}.shop-featured-products--swiper .swiper-wrapper{padding:0}.shop-featured-products--swiper .swiper-pagination{display:none}@media(max-width: 47.97rem){.shop-featured-products--swiper .swiper-pagination{display:flex;position:initial;margin-top:1rem}.shop-featured-products--swiper .swiper-pagination .swiper-pagination-bullet{background:#a3b2c1}.shop-featured-products--swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{height:0.625rem;width:0.625rem;background:#0f62fe}}.shop-featured-product{display:flex;flex-direction:column;height:auto;padding:1rem;color:#080a0c;background:#fff;border:0.0625rem solid #e1e5ea;border-radius:0.75rem}@media(max-width: 47.97rem){.shop-featured-product{padding-top:0.5rem;padding-bottom:0.5rem}}@media(max-width: 35.97rem){.shop-featured-product{padding-left:0.75rem;padding-right:0.75rem}}.shop-featured-product--link{min-width:100%;flex-grow:1;display:flex;flex-direction:column;align-items:start}.shop-featured-product--image{height:8.6666875rem;margin-bottom:1rem}@media(max-width: 74.97rem){.shop-featured-product--image{height:7.6666875rem}}@media(max-width: 61.97rem){.shop-featured-product--image{height:8.22225rem}}@media(max-width: 47.97rem){.shop-featured-product--image{height:6.0555625rem;margin-bottom:0.5rem}}@media(max-width: 35.97rem){.shop-featured-product--image{height:5.9583125rem}}.shop-featured-product--image .cmp-image__image{height:100%;width:auto;max-width:100%;border-radius:0.375rem}.shop-featured-product--title{font-size:1.125rem;font-weight:500;line-height:1.35rem;margin-bottom:0.75rem;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:3;line-clamp:3}@media(max-width: 47.97rem){.shop-featured-product--title{font-size:0.75rem;line-height:1rem}}.shop-featured-product--variants-info{padding:0.25rem;border-radius:0.0625rem;background:#e7eaee;font-size:1rem;font-weight:500;line-height:1rem;margin-bottom:1.5rem}@media(max-width: 47.97rem){.shop-featured-product--variants-info{padding-top:0.125rem;padding-bottom:0.125rem;font-size:0.75rem;line-height:0.75rem;margin-bottom:0.75rem}}.shop-featured-product--price{flex-grow:1;display:flex;flex-wrap:wrap;align-items:end;font-variant-numeric:lining-nums tabular-nums;font-size:1.25rem;font-weight:600;line-height:1.5rem;margin-bottom:1rem}@media(max-width: 47.97rem){.shop-featured-product--price{font-size:0.875rem;line-height:1.05rem}}.shop-featured-product--cta{width:100%;padding:0.5rem 1.5rem;border-radius:3.125rem;border:0.0625rem solid #333f4c;text-align:center;color:#333f4c;font-size:1rem;font-weight:600;line-height:1.1875rem}.shop-featured-product--cta:hover{background-color:#333f4c;color:#fff;border:0.0625rem solid #333f4c}@media(max-width: 47.97rem){.shop-featured-product--cta{padding-left:1rem;padding-right:1rem;font-size:0.8125rem;line-height:1rem}}#sufficient-points-distributor-modal,#points-exceeded-distributor-modal,#insufficient-points-distributor-modal,#verify-address-modal{background:rgba(0,0,0,.29);inset:0;position:fixed;z-index:9998;overflow:auto;padding:1.5rem}#sufficient-points-distributor-modal .distributor_dialogue_wrapper,#points-exceeded-distributor-modal .distributor_dialogue_wrapper,#insufficient-points-distributor-modal .distributor_dialogue_wrapper,#verify-address-modal .distributor_dialogue_wrapper{padding:1.5rem;border-radius:1rem;background:#fafafa;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);max-width:35rem;position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);transition:opacity .25s,visibility .25s;width:calc(100% - 1rem)}@media(min-width: 62rem){#sufficient-points-distributor-modal .distributor_dialogue_wrapper,#points-exceeded-distributor-modal .distributor_dialogue_wrapper,#insufficient-points-distributor-modal .distributor_dialogue_wrapper,#verify-address-modal .distributor_dialogue_wrapper{max-width:45rem}}#sufficient-points-distributor-modal .distributor_dialogue_inner,#points-exceeded-distributor-modal .distributor_dialogue_inner,#insufficient-points-distributor-modal .distributor_dialogue_inner,#verify-address-modal .distributor_dialogue_inner{display:flex;flex-direction:column}#sufficient-points-distributor-modal .distributor_dialogue_header,#points-exceeded-distributor-modal .distributor_dialogue_header,#insufficient-points-distributor-modal .distributor_dialogue_header,#verify-address-modal .distributor_dialogue_header{display:flex;align-items:center}#sufficient-points-distributor-modal .distributor_dialogue_title .cmp-title__text,#points-exceeded-distributor-modal .distributor_dialogue_title .cmp-title__text,#insufficient-points-distributor-modal .distributor_dialogue_title .cmp-title__text,#verify-address-modal .distributor_dialogue_title .cmp-title__text{color:#080a0c;font-size:1.1875rem;font-style:normal;font-weight:600;line-height:1.425rem;letter-spacing:-0.0296875rem}#sufficient-points-distributor-modal .distributor_dialogue_content,#points-exceeded-distributor-modal .distributor_dialogue_content,#insufficient-points-distributor-modal .distributor_dialogue_content,#verify-address-modal .distributor_dialogue_content{display:flex;flex-direction:column}#sufficient-points-distributor-modal .distributor_dialogue_content p,#points-exceeded-distributor-modal .distributor_dialogue_content p,#insufficient-points-distributor-modal .distributor_dialogue_content p,#verify-address-modal .distributor_dialogue_content p{margin:16px 0;color:#080a0c;font-size:1rem;font-weight:400;line-height:1.5rem}#sufficient-points-distributor-modal .distributor_dialogue_content b,#points-exceeded-distributor-modal .distributor_dialogue_content b,#insufficient-points-distributor-modal .distributor_dialogue_content b,#verify-address-modal .distributor_dialogue_content b{font-weight:700}#sufficient-points-distributor-modal .distributor_dialogue_content b .cmp-text--green,#points-exceeded-distributor-modal .distributor_dialogue_content b .cmp-text--green,#insufficient-points-distributor-modal .distributor_dialogue_content b .cmp-text--green,#verify-address-modal .distributor_dialogue_content b .cmp-text--green{color:#15844b}#sufficient-points-distributor-modal .distributor_dialogue_content b .cmp-text--dark-text,#points-exceeded-distributor-modal .distributor_dialogue_content b .cmp-text--dark-text,#insufficient-points-distributor-modal .distributor_dialogue_content b .cmp-text--dark-text,#verify-address-modal .distributor_dialogue_content b .cmp-text--dark-text{color:#080a0c}#sufficient-points-distributor-modal .distributor_dialogue_actions,#points-exceeded-distributor-modal .distributor_dialogue_actions,#insufficient-points-distributor-modal .distributor_dialogue_actions,#verify-address-modal .distributor_dialogue_actions{display:flex;flex-direction:column;align-items:center;gap:0.75rem}#sufficient-points-distributor-modal .distributor_dialogue_actions a,#points-exceeded-distributor-modal .distributor_dialogue_actions a,#insufficient-points-distributor-modal .distributor_dialogue_actions a,#verify-address-modal .distributor_dialogue_actions a{width:100%}#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button,#verify-address-modal .distributor_dialogue_actions .cmp-button{width:100%;padding:0.5rem 1rem;font-size:0.8125rem;font-weight:600;line-height:1rem;color:#fff}#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button__text,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button__text,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button__text,#verify-address-modal .distributor_dialogue_actions .cmp-button__text{letter-spacing:0}#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points,#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.continue-cart,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.continue-cart,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.continue-cart,#verify-address-modal .distributor_dialogue_actions .cmp-button.pay-with-points,#verify-address-modal .distributor_dialogue_actions .cmp-button.continue-cart{border-radius:3.75rem;background:#333f4c;color:#fff}#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points .cmp-button__text,#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.continue-cart .cmp-button__text,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points .cmp-button__text,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.continue-cart .cmp-button__text,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points .cmp-button__text,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.continue-cart .cmp-button__text,#verify-address-modal .distributor_dialogue_actions .cmp-button.pay-with-points .cmp-button__text,#verify-address-modal .distributor_dialogue_actions .cmp-button.continue-cart .cmp-button__text{color:#fff;word-break:break-word;font-size:0.8125rem;font-style:normal;font-weight:600;line-height:1rem}#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points,#verify-address-modal .distributor_dialogue_actions .cmp-button.pay-with-points{gap:0.5rem}#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points .cmp-image__image,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points .cmp-image__image,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.pay-with-points .cmp-image__image,#verify-address-modal .distributor_dialogue_actions .cmp-button.pay-with-points .cmp-image__image{height:1rem;width:1rem;display:block}#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.select-distributor,#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.close-button,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.select-distributor,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.close-button,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.select-distributor,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.close-button,#verify-address-modal .distributor_dialogue_actions .cmp-button.select-distributor,#verify-address-modal .distributor_dialogue_actions .cmp-button.close-button{border-radius:3.125rem;border:0.0625rem solid #333f4c;background-color:#fafafa;color:#333f4c}#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.select-distributor .cmp-button__text,#sufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.close-button .cmp-button__text,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.select-distributor .cmp-button__text,#points-exceeded-distributor-modal .distributor_dialogue_actions .cmp-button.close-button .cmp-button__text,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.select-distributor .cmp-button__text,#insufficient-points-distributor-modal .distributor_dialogue_actions .cmp-button.close-button .cmp-button__text,#verify-address-modal .distributor_dialogue_actions .cmp-button.select-distributor .cmp-button__text,#verify-address-modal .distributor_dialogue_actions .cmp-button.close-button .cmp-button__text{color:#333f4c;word-break:break-word;font-size:0.8125rem;font-style:normal;font-weight:600;line-height:1rem}@media(max-width: 35.97rem){#sufficient-points-distributor-modal,#points-exceeded-distributor-modal,#insufficient-points-distributor-modal,#verify-address-modal{align-items:flex-start;padding-top:3rem}}#sufficient-points-distributor-modal .loader-overlay.points-loader,#points-exceeded-distributor-modal .loader-overlay.points-loader,#insufficient-points-distributor-modal .loader-overlay.points-loader,#verify-address-modal .loader-overlay.points-loader{inset:0;display:grid;place-items:center;background:rgba(0,0,0,0);z-index:999999;pointer-events:all}#sufficient-points-distributor-modal .loader-overlay .spinner,#points-exceeded-distributor-modal .loader-overlay .spinner,#insufficient-points-distributor-modal .loader-overlay .spinner,#verify-address-modal .loader-overlay .spinner{width:3rem;height:3rem;border:0.75rem solid #cbd5e1;border-left-color:#0f62fe;border-radius:50%;animation:load8 1.1s linear infinite}#sufficient-points-distributor-modal .sr-only,#points-exceeded-distributor-modal .sr-only,#insufficient-points-distributor-modal .sr-only,#verify-address-modal .sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}@keyframes load8{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}#verify-address-modal .distributor_dialogue_actions .cmp-button{border-radius:3.75rem;background:#0f62fe}#verify-address-modal .distributor_dialogue_actions .cmp-button .cmp-button__text{color:#fff}#verify-address-modal .distributor_dialogue_actions .cmp-button.secondary{background:rgba(0,0,0,0);border:0.0625rem solid #0f62fe}#verify-address-modal .distributor_dialogue_actions .cmp-button.secondary .cmp-button__text{color:#0f62fe}#verify-address-modal .verify-address-modal__option{padding:0.75rem 1rem;border:0.0625rem solid #e1e5ea;border-radius:0.5rem}#verify-address-modal .verify-address-modal__option+.verify-address-modal__option{margin-top:0.5rem}#verify-address-modal .verify-address-modal__option label{display:grid;grid-template-columns:1.25rem 1fr;column-gap:0.5rem;align-items:baseline;cursor:pointer}#verify-address-modal .verify-address-modal__option input[type=radio]{grid-row:1/3;align-self:center;margin:0}#verify-address-modal .verify-address-modal__option-label{font-weight:600;color:#080a0c}#verify-address-modal .verify-address-modal__option-value{grid-column:2;color:#48596b}.no-results-container{padding:1.5rem 2.25rem;border:0.0625rem dashed #a3b2c1;border-radius:0.75rem}.no-results--message-container{display:flex;gap:1rem}.no-results--message-icon{margin-top:2px;height:1.75rem}.no-results--message{color:#48596b;font-weight:500;line-height:1.45rem}.no-results--explore{padding:0.25rem;margin-top:1rem;text-align:center}.no-results--explore-link{color:#0f62fe;font-size:0.875rem;font-weight:600;line-height:1.25rem;text-decoration:underline}.no-results--explore-link:hover,.no-results--explore-link:focus{text-decoration:underline;color:#0f62fe}