.woocommerce-profile-wizard__body { background-color: #fff; #woocommerce-layout__primary { margin: 0; width: 100%; } .woocommerce-layout__main { padding-right: 0; } } .woocommerce-profiler-page__content { display: flex; align-items: center; flex-direction: column; @include breakpoint( '<782px' ) { padding: 0 20px; } .woocommerce-profiler-button-container { width: 100%; max-width: 404px; @include breakpoint( '<782px' ) { position: absolute; bottom: 20px; padding: 0 20px; } } .woocommerce-profiler-button { display: flex; width: 100%; justify-content: center; padding: 10px 16px; height: 48px; font-size: 14px; font-weight: 500; } .woocommerce-select-control__option { font-size: 13px; height: 40px; min-height: initial; &:hover { background: #eff2fd; color: $gray-900; } } .woocommerce-select-control__listbox { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05); border: 1px solid #ccc; margin-top: 8px; top: 40px; } .woocommerce-select-control__control { height: 40px; padding: 12px; border: 1px solid #bbb; label, .woocommerce-select-control__control-input { font-size: 13px; cursor: pointer; } .components-base-control__label { font-size: 13px; line-height: 16px; color: $gray-700; } &.with-value { .woocommerce-select-control__control-input { margin: 0; color: $gray-900; } .components-base-control__label { display: none; } } &.is-active { border: 1px solid var(--wp-admin-theme-color); } } #woocommerce-select-control__listbox-0 { top: 40px !important; } } .woocommerce-profiler-select-control__country { max-width: 404px; margin: auto auto 32px auto; } // Intro opt-in page .woocommerce-profiler-intro-opt-in { min-height: 100vh; display: flex; flex-direction: column; } .woocommerce-profiler-intro-opt-in__content { padding-top: 81px; flex: 1; @include breakpoint( '<782px' ) { padding-top: 70px; } .woocommerce-profiler-heading { max-width: 520px; } .woocommerce-profiler-welcome-image { margin-bottom: 48px; width: 266px; height: 172px; background: url(./assets/images/welcome-desktop.svg) no-repeat center center; @include breakpoint( '<782px' ) { margin-bottom: 40px; background: url(./assets/images/welcome-mobile.svg) no-repeat center center; width: 222px; height: 144px; } } .woocommerce-profiler-setup-store__button { padding: 10px 16px; width: 200px; height: 54px; display: flex; justify-content: center; align-items: center; @include breakpoint( '<782px' ) { width: 100%; margin-top: auto; } } .woocommerce-profiler-intro-opt-in__footer { margin: auto auto 40px; display: flex; justify-content: center; @include breakpoint( '<782px' ) { margin: 16px auto 20px; } .woocommerce-profiler-intro-opt-in__checkbox { input { box-shadow: 0 0 0 2px #fff, 0 0 0 4px $gray-700; outline: 2px solid transparent; width: 16px; height: 16px; } .components-checkbox-control__input-container { width: 16px; height: 16px; margin-left: 5px; } svg.components-checkbox-control__checked { width: 20px; height: 20px; @include breakpoint( '<782px' ) { width: 16px; height: 16px; } } .components-base-control__field { margin-bottom: 0; display: flex; align-items: center; } .components-checkbox-control__label { display: inline-block; color: $gray-700; font-size: 13px; line-height: 16px; max-width: 514px; margin-left: 10px; } .woocommerce-select-control__control-input { font-size: 13px; line-height: 16px; } } a { color: $gray-700; } } } // Business location page .woocommerce-profiler-business-location { display: flex; flex-direction: column; .woocommerce-profiler-business-location__content { max-width: 550px; width: 100%; display: flex; align-self: center; & > div { width: 100%; } .components-base-control__field { height: 40px; } .woocommerce-select-control__control-icon { display: none; } .woocommerce-select-control__control.is-active { .components-base-control__label { display: none; } } .woocommerce-select-control.is-searchable .woocommerce-select-control__control-input { margin: 0; padding: 0; } .woocommerce-select-control.is-searchable .components-base-control__label { left: 13px; } } } // Loader page .woocommerce-profiler-loader { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; position: absolute; @include breakpoint( '<782px' ) { padding: 0 20px; } h1 { padding: 0; margin: 58px 0 0 0; font-size: 28px; font-weight: 500; @include breakpoint( '<782px' ) { font-size: 20px; } } .woocommerce-profiler-loader-wrapper { display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 520px; } .woocommerce-profiler-progress-bar { width: 520px; margin: 16px 0 16px 0; @include breakpoint( '<782px' ) { width: 100%; } } .woocommerce-profiler-progress-bar__container { height: 4px; } .woocommerce-profiler-loader__paragraph { font-size: 16px; line-height: 24px; color: #2f2f2f; opacity: 0.8; text-align: center; @include breakpoint( '<782px' ) { font-size: 14px; line-height: 20px; } } } // User profile page .woocommerce-profiler-user-profile { .woocommerce-profiler-user-profile__content { min-height: 630px; &.is-platform-selector-open { padding-bottom: 145px; } } .woocommerce-user-profile-choices { margin-bottom: 32px; max-width: 404px; width: 100%; } .woocommerce-profiler-heading__title { max-width: 480px; } .woocommerce-user-profile-choices fieldset { display: flex; gap: 18px; flex-direction: column; } .woocommerce-profiler-choice-sub-options { .woocommerce-profiler-question-label { text-transform: uppercase; color: $gray-900; font-weight: 500; font-size: 11px; line-height: 16px; margin: 0 0 8px; } } .woocommerce-profiler-selling-platform { margin-top: 20px; } }