/*!*******************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/welcome/style.scss ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************/
.welcome-screen {
  width: 770px;
  margin: 0 auto;
}
.welcome-screen h1 {
  grid-gap: 10px;
}
.welcome-screen .video-showcase {
  position: relative;
}
.welcome-screen .youtube-btn {
  cursor: pointer;
}
.welcome-screen .click-btn-text {
  position: absolute;
  left: 13em;
  top: 2.6em;
}
.welcome-screen .get-started-wrap {
  margin-top: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.welcome-screen .middle-content {
  top: 50%;
}
/*!*******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/components/color-palettes/style.scss ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************/
.ist-color-palette {
  background: var(--st-background-primary);
  border: 1px solid var(--st-border-color);
  box-sizing: border-box;
  border-radius: var(--st-border-radius-4);
  display: flex;
  align-items: center;
  padding: 8px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  justify-content: space-evenly;
}
.ist-color-palette:hover, .ist-color-palette:focus, .ist-color-palette.ist-color-palette-active {
  border-color: var(--st-color-accent);
}

.ist-color-palette:hover .ist-color-icon,
.ist-color-palette:focus .ist-color-icon {
  border-color: var(--st-color-accent);
}

.ist-color-palette-active .ist-color-icon {
  background: var(--st-color-accent);
  border-color: var(--st-color-accent);
}

.ist-palette-color {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid #eeeeee;
}
.ist-palette-color:first-child {
  margin-left: 0;
}

.ist-colors-list {
  display: flex;
  flex: 1;
  justify-content: space-between;
}

.ist-colors-title {
  display: flex;
  align-items: center;
  font-size: var(--st-font-size-xs);
  font-weight: var(--st-font-weight-bold);
  color: var(--st-color-heading);
  line-height: var(--st-font-line-height-s);
}

.ist-color-icon {
  background: var(--st-background-primary);
  border: 1px solid var(--st-border-color);
  box-sizing: border-box;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  transition: all 0.2s ease-in-out;
  padding: 4px;
}

.ist-color-palette-active {
  border: 1px solid transparent;
}

.st-default-style-pallete {
  margin-top: 25px;
  margin-bottom: 15px;
}
.st-default-style-pallete .ist-color-palette {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 53% 47%;
  grid-template-columns: 53% 47%;
}
.st-default-style-pallete .ist-colors-list {
  padding-left: 8px;
}

.st-others-style-pallete {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[2];
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 15px;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/components/font-selector/style.scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************/
.ist-font {
  border-radius: var(--st-border-radius-4);
  margin-bottom: 0;
  cursor: pointer;
  background: var(--st-background-primary);
  border: 1px solid var(--st-border-color);
  transition: all 200ms ease-in-out;
}

.ist-font:hover,
.ist-font:focus {
  border: 1px solid var(--st-color-accent);
  outline: none;
}
.ist-font:hover svg path,
.ist-font:focus svg path {
  fill: var(--st-color-heading);
}

.ist-font.active {
  border: 1px solid var(--st-color-accent);
}

.ist-sep {
  border: 1px solid var(--st-border-color);
}

.ist-font-selector {
  margin: 0;
  padding: 0;
}

.ist-default-fonts .ist-font,
.ist-other-fonts .ist-font {
  padding: 12px;
  line-height: 1;
  text-align: left;
}
.ist-default-fonts .font-separator,
.ist-other-fonts .font-separator {
  margin: 0 5px;
}

.ist-other-fonts {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[4];
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 10px;
  font-size: var(--st-font-size-m);
}
.ist-other-fonts .ist-font {
  text-align: left;
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: baseline;
  color: var(--st-color-heading);
}
.ist-other-fonts svg {
  vertical-align: middle;
  fill: var(--st-color-heading);
  margin: 13px;
  width: auto;
}
.ist-other-fonts .active svg path {
  border: 1px solid var(--st-color-accent);
}
.ist-other-fonts .stc-tooltip:nth-child(odd) .stc-tooltip-content {
  left: 0;
}
.ist-other-fonts .stc-tooltip:nth-child(even) .stc-tooltip-content {
  right: 0;
}
.ist-other-fonts .stc-tooltip-content {
  top: 3.5rem;
}

.customize-site-typography .ist-default-fonts-heading {
  margin: 0px 0px 17px 0;
}

.ist-default-fonts {
  margin-top: 25px;
  margin-bottom: 15px;
}
.ist-default-fonts .heading-font-preview {
  font-size: var(--st-font-size-m);
  color: var(--st-color-heading);
}
.ist-default-fonts .body-font-preview {
  color: var(--st-color-body);
  font-size: var(--st-font-size-m);
}

.ist-other-fonts .heading-font-preview {
  font-size: var(--st-font-size-xl);
}
.ist-other-fonts .body-font-preview {
  font-size: var(--st-font-size-xl);
}
/*!********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/congrats/style.scss ***!
  \********************************************************************************************************************************************************************************************************************************************************************************/
.congrats-screen {
  width: 770px;
  margin: 0 auto;
}
.congrats-screen h1 {
  grid-gap: 10px;
}
.congrats-screen .middle-content {
  top: 50%;
}
.congrats-screen .video-showcase {
  position: relative;
}
.congrats-screen .youtube-btn {
  cursor: pointer;
}
.congrats-screen .click-btn-text {
  position: absolute;
  left: 13em;
  top: 2.6em;
}
.congrats-screen .tweet-import-success {
  margin-top: 30px;
  padding: 33px;
  background: var(--st-background-light);
  border: 1px solid var(--st-border-color);
  text-align: left;
  border-radius: var(--st-border-radius-4);
}
.congrats-screen .tweet-import-success .twitter-btn-wrap {
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: flex-end;
  grid-gap: 5px;
  text-decoration: none;
  margin-top: 10px;
}
.congrats-screen .tweet-import-success .tweet-btn {
  font-weight: var(--st-font-weight-bold);
  font-size: var(--st-font-size-xs);
  color: var(--st-color-accent);
}
.congrats-screen .view-website-btn {
  margin: 0 auto 40px;
  font-size: 12px;
  line-height: 16px;
  padding: 10px 20px;
}
.congrats-screen p.screen-description {
  margin: 20px auto 25px;
}
/*!************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/page-builder/style.scss ***!
  \************************************************************************************************************************************************************************************************************************************************************************************/
.page-builder-screen-wrap .page-builder-wrap {
  margin: 0 auto;
  max-width: 800px;
  padding: 0 20px;
  display: -ms-grid;
  display: grid;
  -moz-column-gap: 30px;
       column-gap: 30px;
  justify-content: center;
  grid-auto-columns: minmax(0, 1fr);
  grid-auto-flow: column;
  align-items: center;
}
.page-builder-screen-wrap .image-wrap {
  padding-bottom: 15px;
  display: inline-flex;
  cursor: pointer;
  box-sizing: border-box;
  border-radius: var(--st-border-radius-2);
  transition: all linear 0.2s;
}
.page-builder-screen-wrap .image-wrap img {
  width: 85px;
  height: 85px;
  border-radius: 50%;
}
.page-builder-screen-wrap .page-builder-item {
  padding: 20px;
  border-radius: var(--st-border-radius-4);
  cursor: pointer;
  transition: all linear 0.2s;
  background: var(--st-background-primary);
  border: 1px solid var(--st-border-color);
  flex-direction: column;
}
.page-builder-screen-wrap .page-builder-item:hover, .page-builder-screen-wrap .page-builder-item:focus {
  transform: translateY(-1px);
  box-shadow: 0px 4px 8px -2px rgba(9, 30, 66, 0.25), 0px 0px 1px rgba(9, 30, 66, 0.31);
  border-color: var(--st-color-white);
}
/*!*********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/site-list/style.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************/
.step-site-list {
  --stc-toggle-dropdown-popup-item-cursor: pointer;
}

.st-other-filters {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #D1D5DB;
  padding-bottom: 8px;
}

.st-category-filter {
  flex: 1;
}

.stc-category-list-item {
  border-bottom: 2px solid transparent;
  padding: 0 !important;
  margin: 0 28px 0 0;
  margin-bottom: -26px;
  margin-top: -20px;
  font-size: 14px;
  color: var(--st-color-placeholder);
  font-weight: var(--stc-font-weight-bold);
}
.stc-category-list-item.active {
  border-color: var(--stc-color-heading);
}

.st-type-and-order-filters {
  --stc-toggle-dropdown-popup-item-padding: 5px 17px;
  --stc-toggle-dropdown-popup-padding: 8px 0px;
  display: flex;
}

.st-site-type-filter {
  margin-right: 30px;
}

.st-sites-grid {
  min-height: 100vh;
  margin-top: 65px;
  position: relative;
}
.st-sites-grid .stc-grid-item-title {
  font-size: var(--st-font-size-xs);
  line-height: var(--st-line-height-xs);
  color: var(--st-color-heading);
  padding: 0;
  margin: 0;
}

.stc-site-order-filter,
.stc-site-type-filter {
  width: 110px;
}
.stc-site-order-filter .stc-toggle-dropdown-popup,
.stc-site-type-filter .stc-toggle-dropdown-popup {
  top: 120%;
}
.stc-site-order-filter .stc-toggle-dropdown-popup-item,
.stc-site-type-filter .stc-toggle-dropdown-popup-item {
  padding: 9px 17px;
  font-size: var(--stc-font-size-xs);
  color: var(--stc-color-body);
}
.stc-site-order-filter .stc-toggle-dropdown-popup-item:first-child:hover, .stc-site-order-filter .stc-toggle-dropdown-popup-item.active:first-child, .stc-site-order-filter .stc-toggle-dropdown-popup-item:last-child:hover, .stc-site-order-filter .stc-toggle-dropdown-popup-item.active:last-child,
.stc-site-type-filter .stc-toggle-dropdown-popup-item:first-child:hover,
.stc-site-type-filter .stc-toggle-dropdown-popup-item.active:first-child,
.stc-site-type-filter .stc-toggle-dropdown-popup-item:last-child:hover,
.stc-site-type-filter .stc-toggle-dropdown-popup-item.active:last-child {
  border-radius: 0 0 var(--stc-border-radius-4) var(--stc-border-radius-4);
}

.stc-site-type-filter {
  margin-right: 15px;
}

.st-related-site-message,
.st-suggested-site-message,
.st-sites-found-message {
  text-align: left;
  font-size: var(--st-font-size-xs);
  color: var(--st-color-heading);
}

.step-site-list .step-actions p {
  font-weight: 500;
  font-size: 22px;
  color: #3B3F5C;
}
.step-site-list #ist-bashcanvas {
  display: none;
}

.st-sites-found-message {
  position: absolute;
  top: -40px;
}

.site-loading .site-list-screen-wrap {
  opacity: 0;
}

.site-loaded .site-list-loading-skeleton {
  display: none;
  transition: opacity 1s ease-out;
  opacity: 0;
}
.site-loaded .site-list-screen-wrap {
  -webkit-animation: 300ms ease 0s normal forwards 1 fadein;
          animation: 300ms ease 0s normal forwards 1 fadein;
}
@-webkit-keyframes fadein {
  0% {
    opacity: 0.7;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadein {
  0% {
    opacity: 0.7;
  }
  100% {
    opacity: 1;
  }
}

.cta-strip-right {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  grid-gap: 40px;
}

@media screen and (min-width: 768px) {
  .st-other-filters {
    padding-left: 22px;
    padding-right: 22px;
  }
}
/*!***********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/site-list/search-filter/style.scss ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************/
/** Extend component styling */
.st-search-filter {
  --stc-suggestion-list-max-width: 740px;
  --stc-suggestion-list-padding: 10px 20px;
  --stc-suggestion-list-margin: 0 auto;
  --stc-suggestion-list-position: absolute;
  --stc-suggestion-list-border-radius: 0 0 4px 4px;
}

.st-search-box-wrap {
  min-height: 63px;
}

.st-search-filter {
  margin-top: 20px;
  margin-bottom: 42px;
  position: relative;
  display: inline-block;
}
.st-search-filter .stc-suggestion-list {
  border-top: none;
}

.st-search-box-fixed .st-search-box {
  --stc-search-input-box-shadow: none;
  --stc-search-input-height: 56px;
  --stc-search-input-border: 1px solid var(--st-border-color);
  --stc-search-input--focus-border: 1px solid var(--st-border-color);
  position: fixed;
  top: 9px;
  left: 0;
  right: 0;
  max-width: 742px;
  margin: 0 auto;
}

.st-templates-content {
  margin-top: 10px;
  --stc-sites-no-results-padding: 45px 30px 40px 0;
}

.site-list-content {
  margin-top: 20px;
}
/*!***************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/site-list/no-favorite-sites/style.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************/
body {
  --st-color-accent: #2563EB;
  --st-color-accent-hover: #1D4ED8;
  --st-color-heading: #1F2937;
  --st-color-body: #4B5563;
  --st-color-light-gray: #E5E7EB;
  --st-color-placeholder: #6B7280;
  --st-color-white: #FFFFFF;
  --st-color-favorite: #E91E63;
  --st-background-secondary: #F7F7F9;
  --st-background-primary: #FFFFFF;
  --st-background-light: #F9FAFB;
  --st-font-size-xxl: 30px;
  --st-font-size-xl: 24px;
  --st-font-size-l: 20px;
  --st-font-size-m: 18px;
  --st-font-size-s: 16px;
  --st-font-size-xs: 14px;
  --st-font-weight-extra-bold: 600;
  --st-font-weight-bold: 500;
  --st-font-weight-normal: 400;
  --st-font-line-height-xl: 36px;
  --st-font-line-height-l: 32px;
  --st-font-line-height-m: 28px;
  --st-font-line-height-s: 24px;
  --st-font-line-height-xs: 20px;
  --st-border-color: #D1D5DB;
  --st-border-radius-4: 4px;
  --st-border-radius-3: 3px;
  --st-border-radius-2: 2px;
  --st-border-radius-1: 1px;
}

.st-no-favorites {
  background: var(--st-background-secondary);
  border-bottom: 1px solid var(--st-border-color);
  box-sizing: border-box;
  padding: 45px 30px 40px 0;
  text-align: left;
}
/*!****************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/site-list/header/style.scss ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************/
.site-list-header {
  --stc-toggle-dropdown-border-color: transparent;
  --stc-toggle-dropdown-popup-item-margin: 0 0 10px 0;
  --stc-toggle-dropdown-padding: 10px 10px 10px 10px;
  --stc-toggle-dropdown-selected-padding: 27px 20px 27px 20px;
  --stc-toggle-dropdown-popup-top: 100%;
  --stc-toggle-dropdown-popup-left: 10px;
  --stc-toggle-dropdown-icon-height: 7px;
  position: relative;
}
.step-header .site-list-header.row {
  padding: 0;
  position: relative;
  pointer-events: none;
  z-index: 1;
}
.step-header .site-list-header.row .st-header-left,
.step-header .site-list-header.row .st-header-right {
  pointer-events: auto;
}
.site-list-header .st-exit-to-dashboard {
  padding: 26px 30px;
}
.site-list-header .st-exit-to-dashboard svg {
  margin: 0;
}
.site-list-header .st-page-builder-filter {
  border-left: 1px solid var(--st-border-color);
  border-right: 1px solid var(--st-border-color);
}
.site-list-header .st-page-builder-filter .st-page-builder-toggle .stc-toggle-dropdown-selected {
  width: 195px;
}
.site-list-header .st-page-builder-filter .st-page-builder-toggle .stc-toggle-dropdown-popup {
  border-radius: 0 0 var(--stc-border-radius-4) var(--stc-border-radius-4);
  width: 195px;
  left: 0;
}
/*!*********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/components/logo/style.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************/
.ist-logo {
  --stc-logo-height: 40px;
  --stc-logo-width: 40px;
}
/*!***********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/components/exist-to-dashboard/style.scss ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************/

/*!****************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/site-list/header/my-favorite/style.scss ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************************/
.st-my-favorite {
  cursor: pointer;
}
.st-my-favorite svg {
  width: 16px;
  height: 16px;
  fill: var(--st-color-placeholder);
}
.st-my-favorite.active svg,
.st-my-favorite :hover svg {
  fill: var(--st-color-favorite);
}
.st-my-favorite .stc-tooltip-content {
  right: 0;
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/site-list/header/sync-library/style.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************/
.st-sync-library {
  cursor: pointer;
  margin: 0 30px;
}
.st-sync-library .stc-tooltip-content {
  right: 0;
}
.st-sync-library.loading svg {
  -webkit-animation: rotate 2s infinite linear;
          animation: rotate 2s infinite linear;
}
@-webkit-keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
/*!********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/components/change-template/style.scss ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************/
.change-template-wrap {
  padding: 4% 8%;
  background: var(--st-background-secondary);
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--st-border-color);
}
.change-template-wrap .template-name h5 {
  color: var(--st-color-body);
  margin-bottom: 5px;
}
.change-template-wrap .stc-grid-item-badge {
  position: unset;
}
.change-template-wrap .label {
  color: var(--st-color-placeholder);
}
.change-template-wrap .change-btn-wrap {
  cursor: pointer;
}
.change-template-wrap .change-btn {
  background: transparent;
  border: 1px solid #626262;
  border-radius: var(--st-border-radius-3);
  padding: 6px;
  font-weight: var(--st-font-weight-normal);
  font-size: var(--st-font-size-xs);
  line-height: var(--st-font-line-height-l);
  display: flex;
  align-content: center;
  justify-content: center;
  align-items: center;
}
.change-template-wrap .change-btn:hover {
  border-color: var(--st-color-heading);
}
.change-template-wrap .change-btn:hover svg path {
  fill: var(--st-color-heading);
}
/*!*******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/components/media-uploader/style.scss ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************/
.ist-selected-image {
  position: relative;
  margin-top: 20px;
  display: flex;
  margin-bottom: 2em;
  width: 100%;
  text-align: center;
  cursor: pointer;
  min-height: 100px;
  border: 1px dashed var(--st-color-accent);
  border-radius: 2px;
  padding: 20px;
}
.ist-selected-image img {
  max-width: 100%;
  vertical-align: middle;
  width: 80%;
}
.ist-selected-image:hover .ist-change-logo {
  opacity: 1;
  visibility: visible;
}

.ist-remove-logo {
  cursor: pointer;
  position: absolute;
  top: -10px;
  right: -10px;
  background: #FFFFFF;
  box-shadow: 2px 0px 4px rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  height: 20px;
  width: 20px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.ist-change-logo {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  background: #fff;
  padding: 10px 0;
  color: #646464;
  border: 1px dashed var(--st-color-accent);
  transition: 0.3s all ease-in-out;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
  border-width: 1px 0 0 0;
  border-radius: 0;
}

.ist-logo-preview-wrap {
  -ms-grid-row-align: center;
      align-self: center;
  margin: 0 auto;
}

.ist-logo-wrapper {
  position: relative;
}

.astra-sites-ai-logo-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.astra-sites-ai-logo-wrap .control-reset {
  cursor: pointer;
}
.astra-sites-ai-logo-wrap .control-reset.disabled {
  cursor: default;
}
.astra-sites-ai-logo-wrap .control-reset.disabled svg path {
  fill: var(--st-border-color);
}

.step-customizer .step-content button {
  width: 100%;
  margin-top: 30px;
  margin-bottom: 15px;
}
.step-customizer .step-content button.disabled-btn {
  background-color: var(--st-color-placeholder);
}
.step-customizer .step-actions .ist-link:nth-child(2) {
  color: var(--st-color-accent);
}
.step-customizer .step-actions .ist-link:nth-child(2) svg {
  fill: var(--st-color-accent);
}
/*!**********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/components/error/style.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************/
.ist-error-message-wrap h2.ist-error-message-title {
  margin-bottom: 30px;
}

.ist-import-error p {
  display: flex;
  align-items: center;
  text-align: left;
  justify-content: flex-start;
  margin: 0;
}
.ist-import-error .ist-import-error-box {
  width: 100%;
  border: 1px solid var(--st-border-color);
  box-sizing: border-box;
  border-radius: var(--st-border-radius-4);
  justify-content: center;
  margin: 17px auto 25px;
  padding: 20px;
  background: var(--st-background-light);
}
.ist-import-error .ist-import-error-solution {
  margin-top: 5px;
  flex-direction: column;
  align-items: start;
  gap: 8px;
  display: block;
}
.ist-import-error .ist-import-error-secondary-wrap {
  overflow: auto;
  max-height: 200px;
  margin-top: 10px;
}
.ist-import-error .ist-import-error-text-heading {
  margin-top: 30px;
  margin-bottom: 10px;
}
.ist-import-error .ist-import-error-text {
  padding: 10px;
  border-radius: var(--st-border-radius-4);
  background-color: var(--st-background-error-text, #EFEFEF);
}
.ist-import-error pre {
  margin: 0;
  text-align: left;
  max-height: 100px;
  overflow: auto;
}
.ist-import-error .ist-import-error-box-heading {
  margin-bottom: 10px;
}
.ist-import-error .ist-import-error-solution-heading {
  margin: 20px 0 0;
}
.ist-import-error .ist-import-error-box-heading,
.ist-import-error .ist-import-error-text-heading,
.ist-import-error .ist-import-error-solution-heading {
  text-align: left;
  font-size: var(--st-font-size-xs, 14px);
  font-weight: var(--st-font-weight-bold, 500);
  line-height: var(--st-font-line-height-xs, 20px);
  color: var(--st-color-heading);
}
/*!***********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/import-site/style.scss ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************/
.website-import-subtitle {
  margin-bottom: 35px;
  color: #3B3F5C;
  font-weight: 500;
  font-size: 19px;
  line-height: 22px;
}

.website-import-subtitle svg {
  vertical-align: bottom;
  margin-left: 10px;
}

.step-import-site.st-step h1 {
  text-align: left;
}
.step-import-site.st-step button {
  width: 100%;
  margin-top: 25px;
}

.ist-import-progress-info-text {
  display: flex;
  align-items: center;
  align-content: center;
  grid-gap: 10px;
}

.ist-import-progress, .ist-import-error {
  margin-top: 25px;
}
.ist-import-progress .ist-import-progress-bar-wrap, .ist-import-error .ist-import-progress-bar-wrap {
  position: relative;
}
.ist-import-progress .import-progress-gap span, .ist-import-error .import-progress-gap span {
  background: var(--st-background-primary);
  height: 6px;
  position: absolute;
  width: 10px;
  top: -1px;
}
.ist-import-progress .import-progress-gap span:nth-child(1), .ist-import-error .import-progress-gap span:nth-child(1) {
  left: calc(25% - 10px);
}
.ist-import-progress .import-progress-gap span:nth-child(2), .ist-import-error .import-progress-gap span:nth-child(2) {
  left: calc(50% - 10px);
}
.ist-import-progress .import-progress-gap span:nth-child(3), .ist-import-error .import-progress-gap span:nth-child(3) {
  left: calc(75% - 10px);
}
.ist-import-progress .ist-import-progress-bar-bg, .ist-import-error .ist-import-progress-bar-bg {
  height: 4px;
  background: var(--st-color-light-gray);
  width: 100%;
  position: relative;
}
.ist-import-progress .ist-import-progress-bar-bg .ist-import-progress-bar, .ist-import-error .ist-import-progress-bar-bg .ist-import-progress-bar {
  position: absolute;
  left: 0;
  top: 0;
  background: var(--st-color-accent);
  transition: all 1s;
  width: 0%;
  height: 100%;
}
.ist-import-progress .ist-import-progress-bar-bg .ist-import-progress-bar.import-1, .ist-import-error .ist-import-progress-bar-bg .ist-import-progress-bar.import-1 {
  width: 25%;
}
.ist-import-progress .ist-import-progress-bar-bg .ist-import-progress-bar.import-2, .ist-import-error .ist-import-progress-bar-bg .ist-import-progress-bar.import-2 {
  width: 50%;
}
.ist-import-progress .ist-import-progress-bar-bg .ist-import-progress-bar.import-3, .ist-import-error .ist-import-progress-bar-bg .ist-import-progress-bar.import-3 {
  width: 75%;
}
.ist-import-progress .ist-import-progress-bar-bg .ist-import-progress-bar.import-4, .ist-import-error .ist-import-progress-bar-bg .ist-import-progress-bar.import-4 {
  width: 100%;
}
.ist-import-progress .ist-import-progress-bar-bg .ist-import-progress-bar.import-done, .ist-import-error .ist-import-progress-bar-bg .ist-import-progress-bar.import-done {
  background: #38C172;
}
.ist-import-progress .ist-import-progress-info, .ist-import-error .ist-import-progress-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 15px;
  margin-bottom: 15px;
}

.ist-import-error .ist-import-error-box {
  overflow-y: scroll;
}
.ist-import-error .ist-import-progress-bar-bg {
  width: 100%;
  margin-bottom: 15px;
}
.ist-import-error .ist-import-progress-bar-bg .ist-import-progress-bar {
  background: var(--st-border-color);
}

.ist-import-done-inner,
.import-done-counter {
  display: none;
}

.import-done .import-status-string,
.import-done .ist-import-text-inner {
  display: none;
}
.import-done .import-done-counter,
.import-done .ist-import-done-inner {
  display: block;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/steps/survey/style.scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************/
.survey-container {
  background: var(--st-background-primary);
  box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.05), 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  border-radius: var(--st-border-radius-4);
  width: 600px;
  padding: 35px;
  margin: 0 auto;
  text-align: left;
}
.survey-container input[type=checkbox]:checked:before {
  content: url("data:image/svg+xml;utf8,<svg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27><path%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%232563EB%27%2F><%2Fsvg>");
}
.survey-container .required-plugins-form h5,
.survey-container .install-plugins-form h5 {
  margin-bottom: 22px;
}
.survey-container .required-plugins-form p,
.survey-container .install-plugins-form p {
  margin-bottom: 26px;
}
.survey-container .required-plugins-form .third-party-required-plugins-list,
.survey-container .required-plugins-form .manual-required-plugins-list,
.survey-container .install-plugins-form .third-party-required-plugins-list,
.survey-container .install-plugins-form .manual-required-plugins-list {
  list-style: auto;
  margin: 10px 20px;
}
.survey-container .required-plugins-form .third-party-required-plugins-list li,
.survey-container .required-plugins-form .manual-required-plugins-list li,
.survey-container .install-plugins-form .third-party-required-plugins-list li,
.survey-container .install-plugins-form .manual-required-plugins-list li {
  font-size: var(--st-font-size-xs);
  line-height: var(--st-font-line-height-xl);
}
.survey-container h1 {
  text-align: left;
  padding-bottom: 35px;
}
.survey-container .row-label {
  margin-bottom: 20px;
}
.survey-container .survey-fields-wrap {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  grid-gap: 15px;
  margin-bottom: 20px;
}
.survey-container .survey-text-input {
  background: var(--st-background-primary);
  border: 1px solid var(--st-border-color);
  border-radius: var(--st-border-radius-3);
  padding: 10px 15px;
  width: 100%;
}
.survey-container .survey-text-input::-moz-placeholder {
  color: var(--st-color-placeholder);
}
.survey-container .survey-text-input:-ms-input-placeholder {
  color: var(--st-color-placeholder);
}
.survey-container .survey-text-input::placeholder {
  color: var(--st-color-placeholder);
}
.survey-container .survey-text-input:focus {
  border-color: var(--st-color-accent);
}
.survey-container .survey-select-input {
  border: 1px solid var(--st-border-color);
  border-radius: var(--st-border-radius-3);
  padding: 10px 15px;
  width: 100%;
  color: #2c3338;
}
.survey-container .survey-select-input option:not(:first-of-type) {
  color: #2c3338;
}
.survey-container .survey-select-input::-moz-placeholder {
  color: var(--st-color-placeholder);
}
.survey-container .survey-select-input:-ms-input-placeholder {
  color: var(--st-color-placeholder);
}
.survey-container .survey-select-input::placeholder {
  color: var(--st-color-placeholder);
}
.survey-container .survey-select-input:focus {
  border-color: var(--st-color-accent);
}
.survey-container .survey-select-input:hover {
  color: #2c3338;
}
.survey-container .survey-select-input.initial {
  color: var(--st-color-placeholder);
}
.survey-container .hidden-section .survey-advanced-section {
  visibility: hidden;
}
.survey-container .survey-form-advanced-wrapper .advanced-options-icons {
  cursor: pointer;
  display: flex;
}
.survey-container .survey-form-advanced-wrapper .row-label {
  display: flex;
  align-items: center;
  align-content: center;
  grid-gap: 10px;
}
.survey-container .survey-form-advanced-wrapper ul {
  margin: 0;
  padding: 0;
}
.survey-container .survey-form-advanced-wrapper li {
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  align-content: stretch;
  grid-gap: 10px;
}
.survey-container .survey-form-advanced-wrapper li:last-child {
  margin-bottom: 0;
}
.survey-container .survey-form-advanced-wrapper li input {
  margin: 0;
  border: 1px solid var(--st-color-body);
  border-radius: var(--st-border-radius-3);
}
.survey-container .survey-form-advanced-wrapper li.theme-check {
  margin-left: 2em;
}
.survey-container .survey-form-advanced-wrapper li label {
  font-size: var(--st-font-size-xs);
  line-height: var(--st-font-line-height-xs);
  color: var(--st-color-body);
}
.survey-container .survey-form-advanced-wrapper svg {
  cursor: pointer;
}
.survey-container .submit-survey-btn.button-text {
  padding: 15px 32px;
  width: 100%;
  color: var(--st-color-white);
  background: var(--st-color-accent);
  border: none;
  cursor: pointer;
  margin-top: 3em;
  align-content: center;
  grid-gap: 15px;
  border-radius: var(--st-border-radius-4);
  font-weight: var(--st-font-weight-bold);
  font-size: 15px;
}
.survey-container .stc-tooltip-content {
  min-width: 310px;
  text-align: left;
  line-height: 1.4;
}
.survey-container .requirement-check-wrap .current-php-version,
.survey-container .requirement-check-wrap .current-file-system-permissions {
  margin-top: 10px;
}
.survey-container .requirement-check-wrap button.submit-survey-btn:disabled {
  background: var(--st-color-light-gray);
  color: var(--st-color-placeholder);
  cursor: not-allowed;
}
.survey-container .requirement-check-wrap button.submit-survey-btn:disabled svg path {
  fill: var(--st-color-placeholder);
}
.survey-container .requirement-check-wrap .requirement-check-list {
  list-style: auto;
  margin: 10px 20px;
}
.survey-container .requirement-check-wrap .requirement-check-list li {
  font-size: var(--st-font-size-xs);
  line-height: var(--st-font-line-height-l);
}
.survey-container .requirement-check-wrap .requirement-check-list li p {
  color: var(--st-color-white);
}
.survey-container .requirement-check-wrap .requirement-check-list .requirement-list-item {
  display: flex;
  align-content: center;
  align-items: center;
  grid-gap: 10px;
}
.survey-container .requirement-check-wrap .requirement-check-list .requirement-list-item .dashicons-yes {
  color: var(--st-color-success, #39b54a);
}
.survey-container .requirement-check-wrap .requirement-check-list .requirement-list-item .dashicons-no {
  color: var(--st-color-error, #d72b3f);
}
.survey-container .requirement-check-wrap .requirement-check-list .stc-tooltip {
  display: flex;
}
.survey-container .requirement-check-wrap .requirement-check-list .stc-tooltip .stc-tooltip-content {
  min-width: 400px;
}
.survey-container .requirement-check-wrap .requirement-check-list .stc-tooltip .stc-tooltip-content ul {
  list-style: auto;
  margin: 6px 17px;
}
.survey-container .requirement-check-wrap .requirement-check-list .stc-tooltip .stc-tooltip-content li {
  line-height: var(--st-font-line-height-s);
}

.subscription-agreement-checkbox-label {
  display: block;
  font-size: var(--st-font-size-xs);
  margin-bottom: 20px;
}

input.subscription-agreement-checkbox {
  margin-right: 10px;
}
/*!*****************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./inc/lib/onboarding/assets/src/style.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************/
body {
  --st-color-accent: #2563EB;
  --st-color-accent-hover: #1D4ED8;
  --st-color-heading: #1F2937;
  --st-color-body: #4B5563;
  --st-color-light-gray: #E5E7EB;
  --st-color-placeholder: #6B7280;
  --st-color-white: #FFFFFF;
  --st-color-favorite: #E91E63;
  --st-background-secondary: #F7F7F9;
  --st-background-primary: #FFFFFF;
  --st-background-light: #F9FAFB;
  --st-font-size-xxl: 30px;
  --st-font-size-xl: 24px;
  --st-font-size-l: 20px;
  --st-font-size-m: 18px;
  --st-font-size-s: 16px;
  --st-font-size-xs: 14px;
  --st-font-weight-extra-bold: 600;
  --st-font-weight-bold: 500;
  --st-font-weight-normal: 400;
  --st-font-line-height-xl: 36px;
  --st-font-line-height-l: 32px;
  --st-font-line-height-m: 28px;
  --st-font-line-height-s: 24px;
  --st-font-line-height-xs: 20px;
  --st-border-color: #D1D5DB;
  --st-border-radius-4: 4px;
  --st-border-radius-3: 3px;
  --st-border-radius-2: 2px;
  --st-border-radius-1: 1px;
}

#starter-templates-ai-root {
  font-size: 16px;
  background: var(--st-background-primary);
  font-family: "Inter", sans-serif;
  --wp-admin-theme-color: var(--st-color-accent);
  --wp-admin-theme-color-darker-10: var(--st-color-accent);
}

@media screen and (max-width: 1366px) {
  .step-customizer {
    --sidebar-width: 25%;
  }
}
@media screen and (min-width: 1367px) {
  .step-customizer {
    --sidebar-width: 20%;
  }
}
html.wp-toolbar {
  padding: 0;
}

.intelligent-starter-templates-onboarding #adminmenumain,
.intelligent-starter-templates-onboarding #wpadminbar,
.intelligent-starter-templates-onboarding #adminmenuback,
.intelligent-starter-templates-onboarding #adminmenuwrap,
.intelligent-starter-templates-onboarding #wpfooter {
  display: none;
}
.intelligent-starter-templates-onboarding #wpcontent, .intelligent-starter-templates-onboarding.auto-fold #wpcontent {
  margin: 0;
  padding: 0;
}
.intelligent-starter-templates-onboarding.appearance_page_starter-templates #wpbody-content {
  padding: 0;
}

body {
  overflow-y: hidden;
}

body * {
  box-sizing: border-box;
}

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  border-radius: 0px;
}

::-webkit-scrollbar-thumb {
  background: #d5d6d7;
  border-radius: 0px;
}

::-webkit-scrollbar-thumb:hover {
  background: #d1d2d3;
  cursor: pointer;
}

.st-link,
a {
  cursor: pointer;
  text-decoration: underline;
  color: var(--st-color-accent);
}
.st-link:hover,
a:hover {
  color: var(--st-color-accent-hover);
}

.step-row {
  background: var(--st-background-primary);
  display: flex;
  overflow: hidden;
  height: calc(100vh - 77px);
}

.step-col-right {
  width: 100%;
  padding: 0 2%;
  margin-left: var(--sidebar-width);
  transition: all 350ms linear;
}

.step-col-left {
  width: var(--sidebar-width);
  display: flex;
  flex-direction: column;
  height: calc(100vh - 60px);
  position: absolute;
  inset: 0;
  transition: transform 350ms linear;
  transform: translateX(0);
  box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.1), 1px 0px 2px rgba(0, 0, 0, 0.06);
  z-index: 9;
}

.step-content {
  background: #F7F7F9;
  padding: 5%;
  overflow-y: auto;
  flex: 1;
  height: 100%;
  border-radius: var(--st-border-radius-2);
}

.step-actions {
  padding: 21px 45px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--st-background-primary);
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 10;
  box-shadow: 0px -4px 8px -3px rgba(0, 0, 0, 0.05), 0px -2px 6px -2px rgba(0, 0, 0, 0.05);
}
.step-actions p {
  font-size: 16px;
  color: #353852;
  margin: 0;
}

.step-customizer .ist-link {
  padding: 0 0 15px 0;
  font-size: var(--st-font-size-xs);
  color: var(--st-color-body);
  display: flex;
  justify-content: center;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 15px auto 0 auto;
}

.step-customizer .step-row {
  height: 100vh;
}
.step-customizer .step-actions {
  padding: 6% 8%;
  background: var(--st-background-primary);
  position: unset;
  bottom: 0;
  right: 0;
  left: 0;
  border-radius: 0 0 0 var(--st-border-radius-4);
  border-top: none;
  flex-wrap: wrap;
}
.step-customizer .step-col-left {
  height: auto;
}
.step-customizer .step-col-right {
  padding: 0;
  position: relative;
}

.step-col-right img {
  max-width: 100%;
  height: auto;
}

.step-actions .dashicons-arrow-left-alt {
  margin-right: 5px;
}
.step-actions .dashicons-arrow-right-alt {
  margin-left: 5px;
}

.astra-sites-ai-logo-wrap {
  color: var(--st-color-heading);
  margin-bottom: 17px;
  margin-top: 25px;
}

.astra-sites-ai-logo-wrap,
.astra-sites-ai-rangecontrol-wrap {
  width: 100%;
}

.ist-logo {
  --stc-logo-height: 44px;
  --stc-logo-width: 44px;
}

.step-full-width .step-col {
  flex: 1;
  text-align: center;
}

.st-header-right {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.st-search-box-fixed .step-header {
  position: static;
}

.step-header {
  z-index: 1;
  position: relative;
}
.step-header a {
  color: var(--st-color-placeholder);
  text-decoration: none;
  display: flex;
  font-weight: var(--st-font-weight-bold);
  font-size: var(--st-font-size-s);
  line-height: var(--st-line-height-xs);
  align-items: center;
}
.step-header a svg {
  fill: var(--st-color-placeholder);
}
.step-header a:hover, .step-header a:focus {
  color: var(--st-color-heading);
}
.step-header a:hover svg path, .step-header a:focus svg path {
  fill: var(--st-color-heading);
}
.step-header a:focus {
  outline: none;
  box-shadow: none;
}
.step-header:focus {
  outline: none;
  box-shadow: none;
}

body.step-import-site:not(.st-error) .step-header a {
  pointer-events: none;
  opacity: 0.7;
}

.row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.row.center {
  justify-content: center;
}
.row.full {
  flex: 1;
}

.step-header .row {
  box-shadow: 0px 6px 8px -3px rgba(0, 0, 0, 0.05), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
  position: relative;
}
.step-header .row .branding-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  align-content: center;
  grid-gap: 20px;
  padding: 16px 24px;
  border-right: 1px solid var(--st-border-color);
}
.step-header .row .exit-link {
  padding: 26px 30px;
  border-left: 1px solid var(--st-border-color);
}
.step-header .row .right-col {
  display: flex;
  align-content: center;
  align-items: center;
}
.step-header .row .back-to-main {
  padding: 26px 30px;
}
.step-header .row .back-to-main svg {
  cursor: pointer;
}
.step-header .row .back-to-main:hover svg path, .step-header .row .back-to-main:focus svg path {
  fill: var(--st-color-heading);
}

/**
 * Customizer Contorls
 */
.customizer-controls {
  height: calc(70vh - 230px);
  overflow-y: auto;
}

.astra-sites-ai-rangecontrol-wrap .components-range-control__wrapper {
  margin-left: 0;
}

.astra-sites-ai-rangecontrol-wrap .components-input-control__input:focus + .components-input-control__backdrop {
  border-color: var(--st-color-accent);
  box-shadow: 0 0 0 1px var(--st-color-accent);
}

.customize-license-validation {
  position: relative;
}
.customize-license-validation .processing::before {
  color: var(--st-background-primary);
  font: normal 20px/0 dashicons;
}
.customize-license-validation button.st-access-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-content: center;
  grid-gap: 7px;
  margin-top: 15px;
  margin-bottom: 0;
}
.customize-license-validation button.st-access-btn .st-get-access {
  height: 12px;
}
.customize-license-validation .license-wrap {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 70% 30%;
  grid-template-columns: 70% 30%;
  align-items: center;
  justify-items: end;
  border: 1px solid var(--st-border-color);
  background: var(--st-background-primary);
  padding: 5px;
  margin-top: 30px;
  border-radius: var(--st-border-radius-2);
}
.customize-license-validation .license-wrap:focus-within {
  border: 1px solid var(--st-color-accent);
}
.customize-license-validation .license-key-input {
  border: none;
  background: var(--st-background-primary);
  border-radius: var(--st-border-radius-4);
  padding: 10px 15px;
  width: 100%;
  height: 38px;
}
.customize-license-validation .license-key-input::-moz-placeholder {
  color: var(--st-color-placeholder);
}
.customize-license-validation .license-key-input:-ms-input-placeholder {
  color: var(--st-color-placeholder);
}
.customize-license-validation .license-key-input::placeholder {
  color: var(--st-color-placeholder);
}
.customize-license-validation .license-key-input:focus {
  border: none;
  outline: 0;
  box-shadow: none;
}
.customize-license-validation .customer-notices {
  margin: 10px 0;
}
.customize-license-validation button.validate-btn {
  margin: 0;
  border-radius: 0px;
  background: var(--st-color-placeholder);
  width: unset;
  padding: 12px;
  border-radius: var(--st-border-radius-2);
}
.customize-license-validation button.validate-btn svg {
  height: 15px;
  width: 15px;
}
.customize-license-validation button.validate-btn svg path {
  fill: var(--st-color-white);
}
.customize-license-validation button.validate-btn:hover {
  background: var(--st-color-accent);
}
.customize-license-validation .license-error {
  border: 1px solid var(--st-border-color);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  border-radius: var(--st-border-radius-4);
  margin-top: 15px;
}
.customize-license-validation .license-error .p-4 {
  padding: 1rem;
}
.customize-license-validation .license-error .license-error-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.customize-license-validation .license-error .license-error-inner > div {
  display: flex;
}
.customize-license-validation .license-error .license-error-message p {
  margin-left: 0.75rem;
}
.customize-license-validation .license-error .error-icon {
  display: flex;
}
.customize-license-validation .license-error .error-icon svg {
  width: 1.25rem;
  height: 1.25rem;
}
.customize-license-validation .license-error .error-icon.cross-icon svg {
  color: #eb3f3f;
}
.customize-license-validation .license-error .error-icon.close-icon {
  margin-left: 1rem;
}
.customize-license-validation .license-error .error-icon.close-icon button {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  color: var(--st-color-body);
  cursor: pointer;
  height: 15px;
  width: 15px;
}
.customize-license-validation .st-toaster {
  position: unset;
  margin-top: 20px;
  width: 100%;
}

.ist-button {
  background: var(--st-color-accent);
  color: var(--st-background-primary);
  border-radius: var(--st-border-radius-4);
  padding: 15px 32px;
  text-decoration: none;
}
.ist-button:hover {
  background: var(--st-color-accent);
  color: var(--st-color-white);
}
.ist-button.ist-button-outline {
  background: var(--st-color-white);
  color: var(--st-color-accent);
  border: 1px dashed var(--st-color-placeholder);
  width: 100%;
  font-size: 14px;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  grid-gap: 12px;
  padding: 32px 10px;
}
.ist-button.ist-button-outline:hover, .ist-button.ist-button-outline:focus {
  background: var(--st-background-primary);
  color: var(--st-color-accent);
  border-color: var(--st-color-accent);
}
.ist-button.ist-button-outline p {
  font-size: 13px;
}

.step-page-builder.st-step .row {
  padding: 0;
  position: relative;
}

.ist-link.disabled {
  pointer-events: none;
  opacity: 0.7;
}
.ist-link.disabled.hidden-btn {
  opacity: 0;
}

.middle-content {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.middle-content.middle-content-import {
  background: var(--st-background-primary);
  padding: 30px;
  box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.05), 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  width: 600px;
  border-radius: var(--st-border-radius-4);
}

.site-loading-skeleton {
  overflow-y: auto;
  height: 100%;
}
.site-loading-skeleton .MuiSkeleton-root {
  border-radius: var(--st-border-radius-2);
}

.d-flex-center-align {
  display: flex;
  align-items: center;
  justify-content: center;
}

.d-flex-space-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
}

.starter-templates-ai-steps h1 {
  font-size: var(--st-font-size-xxl);
  font-weight: var(--st-font-weight-extra-bold);
  margin: 0;
  color: var(--st-color-heading);
  line-height: var(--st-font-line-height-xl);
}
.starter-templates-ai-steps h2 {
  font-size: var(--st-font-size-xl);
  font-weight: var(--st-font-weight-bold);
  margin: 0;
  color: var(--st-color-heading);
  line-height: var(--st-font-line-height-l);
}
.starter-templates-ai-steps h3 {
  font-size: var(--st-font-size-l);
  font-weight: var(--st-font-weight-bold);
  margin: 0;
  color: var(--st-color-heading);
  line-height: var(--st-font-line-height-m);
}
.starter-templates-ai-steps h4 {
  font-size: var(--st-font-size-m);
  font-weight: var(--st-font-weight-bold);
  margin: 0;
  color: var(--st-color-heading);
  line-height: var(--st-font-line-height-m);
}
.starter-templates-ai-steps h5 {
  font-size: var(--st-font-size-s);
  font-weight: var(--st-font-weight-bold);
  margin: 0;
  color: var(--st-color-heading);
  line-height: var(--st-font-line-height-s);
}
.starter-templates-ai-steps h6 {
  font-size: var(--st-font-size-xs);
  font-weight: var(--st-font-weight-bold);
  margin: 0;
  color: var(--st-color-heading);
  line-height: var(--st-font-line-height-xs);
}
.starter-templates-ai-steps p {
  font-size: var(--st-font-size-xs);
  color: var(--st-color-body);
  margin: 0;
  font-weight: var(--st-font-weight-normal);
  line-height: var(--st-font-line-height-xs);
}
.starter-templates-ai-steps p.p-bold {
  font-weight: var(--st-font-weight-bold);
}
.starter-templates-ai-steps .button-text {
  font-size: var(--st-font-size-xs);
  font-weight: var(--st-font-weight-bold);
  color: var(--st-color-accent);
  line-height: var(--st-font-line-height-xs);
}
.starter-templates-ai-steps .placeholder {
  font-size: var(--st-font-size-xs);
  font-weight: var(--st-font-weight-normal);
  color: var(--st-color-placeholder);
  line-height: var(--st-font-line-height-xs);
}
.starter-templates-ai-steps .label-text {
  font-size: var(--st-font-size-s);
  font-weight: var(--st-font-weight-bold);
  color: var(--st-color-heading);
  line-height: var(--st-font-line-height-s);
}
.starter-templates-ai-steps .label-text.label-bold {
  font-weight: var(--st-font-weight-extra-bold);
}
.starter-templates-ai-steps .screen-description {
  margin: 20px auto 40px;
  max-width: 700px;
}
.starter-templates-ai-steps .ist-customizer-heading {
  margin-bottom: 10px;
}
.starter-templates-ai-steps .ist-secondary-heading {
  margin: 25px 0 17px 0;
}
.starter-templates-ai-steps .ist-fonts-description,
.starter-templates-ai-steps .ist-colors-description {
  margin: 2em 0 0 0;
}
.starter-templates-ai-steps .ist-footer-note {
  font-size: 12px;
}
.starter-templates-ai-steps .customizer-header {
  background: var(--st-background-secondary);
  border-bottom: 1px solid var(--st-border-color);
}
.starter-templates-ai-steps .customizer-header .header-name {
  padding: 6% 9%;
  width: 100%;
}
.starter-templates-ai-steps .toggle-sidebar-wrap {
  display: none;
}
.starter-templates-ai-steps .step-customizer .step-content {
  background-color: var(--st-background-secondary);
}
.starter-templates-ai-steps .step-customizer .hide-sidebar .step-col-left {
  transform: translateX(-100%);
}
.starter-templates-ai-steps .step-customizer .hide-sidebar .step-col-right {
  margin-left: 0%;
  transition: margin-left 350ms linear;
}
.starter-templates-ai-steps .step-customizer .hide-sidebar .toggle-sidebar-wrap {
  background: var(--st-color-accent);
}
.starter-templates-ai-steps .step-customizer .hide-sidebar .toggle-sidebar-wrap svg path {
  fill: var(--st-color-white);
}
.starter-templates-ai-steps .step-customizer .screen-description {
  margin: 0;
}
.starter-templates-ai-steps .step-customizer .toggle-sidebar-wrap {
  width: 18px;
  background: #F4F5F6;
  box-shadow: 1px 0px 3px rgba(0, 0, 0, 0.1), 1px 0px 2px rgba(0, 0, 0, 0.06);
  border-radius: 0px var(--st-border-radius-2) var(--st-border-radius-2) 0px;
  height: 61px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}
.starter-templates-ai-steps .step-customizer .toggle-sidebar-wrap svg {
  height: 15px;
  width: 15px;
}
.starter-templates-ai-steps .step-customizer .toggle-sidebar-wrap svg path {
  fill: var(--st-color-placeholder);
}
.starter-templates-ai-steps .step-customizer .toggle-sidebar-wrap:hover {
  background: var(--st-color-accent);
}
.starter-templates-ai-steps .step-customizer .toggle-sidebar-wrap:hover svg path {
  fill: var(--st-color-white);
}
.starter-templates-ai-steps .step-customizer .logo-skip-info {
  padding: 20px;
  background: var(--st-color-light-gray);
  border-radius: 4px;
}
.starter-templates-ai-steps .step-customizer .logo-skip-info p {
  margin-top: 5px;
}
.starter-templates-ai-steps .step-customizer .premium-notice {
  border: 1px solid #dc323291;
  background: #dc323208;
  border-radius: var(--st-border-radius-2);
  padding: 10px;
  color: #4b5563;
  font-size: var(--st-font-size-xs);
  margin-bottom: 10px;
}
.starter-templates-ai-steps .step-customizer .step-content.customize-typography-colors .step-controls {
  padding: 0;
}
.starter-templates-ai-steps .step-customizer .step-content.customize-typography-colors .colors-section,
.starter-templates-ai-steps .step-customizer .step-content.customize-typography-colors .typography-section {
  padding: 8%;
}
.starter-templates-ai-steps .step-customizer .step-content.customize-typography-colors .colors-section {
  border-bottom: 1px solid var(--st-border-color);
}
.starter-templates-ai-steps .step-customizer .customize-reset-btn {
  cursor: pointer;
}
.starter-templates-ai-steps .step-customizer .customize-reset-btn.disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.starter-templates-ai-steps .step-customizer .customize-reset-btn.active svg path {
  fill: var(--st-color-accent);
}
.step-customizer .starter-templates-ai-steps .step-content {
  padding: 0;
  border-radius: 0;
  border-bottom: none;
}
.step-customizer .starter-templates-ai-steps .step-content .step-controls {
  padding: 8%;
}
.step-congrats .starter-templates-ai-steps .step-content {
  padding: 4%;
}
.step-congrats .starter-templates-ai-steps .step-row {
  height: calc(100vh - 62px);
}

#ist-bashcanvas {
  pointer-events: none;
  position: fixed;
  z-index: 2;
  inset: 0;
}

#st-welcome-video,
#st-information-video {
  width: 770px;
  height: 446px;
  left: 0px;
  top: 0px;
  border: 15px solid var(--st-color-white);
  box-shadow: 0px 10px 15px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
  border-radius: var(--st-border-radius-4);
}

.ist-fadeinUp {
  -webkit-animation: ist-fadeinUp 500ms ease-in-out;
  animation: ist-fadeinUp 500ms ease-in-out;
}

.st-rtl .ist-button svg {
  margin: 0 0 0 12px;
}
.st-rtl .ist-link svg {
  margin-right: 10px;
}
.st-rtl .control-reset {
  transform: rotateY(180deg);
}
.st-rtl .st-sync-library.loading svg {
  -webkit-animation: rotate-alternate 2s infinite linear;
          animation: rotate-alternate 2s infinite linear;
}
.st-rtl .ist-link svg,
.st-rtl .ist-button svg,
.st-rtl .submit-survey-btn svg,
.st-rtl .toggle-sidebar-wrap svg {
  transform: rotate(180deg);
}
.st-rtl .astra-sites-ai-rangecontrol-wrap .components-range-control__number {
  margin-left: 16px !important;
  margin-right: 0 !important;
}

.stc-tooltip-content a {
  color: var(--st-color-white);
}

@-webkit-keyframes rotate-alternate {
  from {
    transform: rotate(360deg);
  }
  to {
    transform: rotate(0deg);
  }
}

@keyframes rotate-alternate {
  from {
    transform: rotate(360deg);
  }
  to {
    transform: rotate(0deg);
  }
}
@-webkit-keyframes ist-fadeinUp {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes ist-fadeinUp {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.step-content.customize-business-logo .content-wrapper {
  -webkit-animation: logo-screen-fadeIn 500ms;
          animation: logo-screen-fadeIn 500ms;
}

@-webkit-keyframes logo-screen-fadeIn {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}

@keyframes logo-screen-fadeIn {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}
.step-content.customize-typography-colors .content-wrapper {
  -webkit-animation: colors-screen-fadeIn 500ms;
          animation: colors-screen-fadeIn 500ms;
}

@-webkit-keyframes colors-screen-fadeIn {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}

@keyframes colors-screen-fadeIn {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}
.step-content.customize-site-typography .content-wrapper {
  -webkit-animation: typo-screen-fadeIn 500ms;
          animation: typo-screen-fadeIn 500ms;
}

@-webkit-keyframes typo-screen-fadeIn {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}

@keyframes typo-screen-fadeIn {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}
.step-content.congratulations .content-wrapper {
  -webkit-animation: congrats-screen-fadeIn 500ms;
          animation: congrats-screen-fadeIn 500ms;
}

@-webkit-keyframes congrats-screen-fadeIn {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}

@keyframes congrats-screen-fadeIn {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}

/*# sourceMappingURL=style-main.css.map*/