.list-group.small .list-group-item {
  padding: 0.25rem 0.5rem;
}

/*====Media Queries====*/
/*====Layout====*/
/*====Validation====*/
/*====Margins====*/
/*====Section styling====*/
/*====FIGMA Typography Styling====*/
/*====Text Styling====*/
.list-group.small .list-group-item {
  padding: 0.25rem 0.5rem;
}

#Checkbox .check-component {
  cursor: pointer;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  padding-left: unset;
  font-style: normal;
  font-weight: 600;
  font-size: 0.875rem;
  color: #5e4897;
}
#Checkbox .check-component input[type=checkbox] {
  font-size: 1rem;
}
#Checkbox .check-component input[type=checkbox]:checked:after {
  background-color: #5e4897;
  border-radius: 4px;
}
#Checkbox .check-component input[type=checkbox]:after {
  border: 1pt solid black;
  border-radius: 4px;
}
#Checkbox .check-component label[for] {
  cursor: pointer;
}
#Checkbox input[type=checkbox]:after {
  width: 14pt;
  height: 14pt;
}

.dropdown {
  display: inline-block;
}
.dropdown .dropdown-menu {
  margin: -3px 0 !important;
  padding: 0;
  min-width: 100%;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border: 1px solid rgb(238.6153715161, 238.131838565, 239.868161435);
  background: white;
  border-top: none;
  z-index: 2000;
}
.dropdown .dropdown-menu[data-popper-placement=top-start] {
  border-radius: 0.25rem !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.dropdown .dropdown-menu .dropdown-menu-list {
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.dropdown .dropdown-menu .dropdown-menu-list.edit-toggle {
  border: 1px solid black;
  border-radius: 8px;
  background: #fff;
}
.dropdown .dropdown-menu .dropdown-menu-list .dropdown-item {
  font-size: 0.938rem;
  font-weight: 400;
  line-height: 24px;
  color: #5e4897;
}
.dropdown .dropdown-menu .dropdown-menu-list .dropdown-item.selected-item {
  background: rgb(238.6153715161, 238.131838565, 239.868161435);
}
.dropdown .dropdown-toggle {
  font-size: 0.938rem;
  font-weight: 400;
  line-height: 24px;
  color: #5e4897;
  padding: 8px 15px;
  display: flex;
  gap: 5px;
  justify-content: space-between;
}
.dropdown .dropdown-toggle.standard-toggle {
  border: 1px solid rgb(238.6153715161, 238.131838565, 239.868161435);
  background: white;
}
.dropdown .dropdown-toggle.standard-toggle::after {
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-top: 2px solid currentColor;
  border-left: unset;
  transform: rotate(135deg);
  margin-left: 0.8em;
}
.dropdown .dropdown-toggle.standard-toggle.show::after {
  transform: rotate(-45deg);
  vertical-align: 0.01em;
}
.dropdown .dropdown-toggle::after {
  margin-left: auto;
  display: inline-block;
  align-self: center;
}
.dropdown .dropdown-toggle.edit-toggle {
  border: 1px solid black;
  border-radius: 8px;
}
.dropdown .dropdown-toggle.edit-toggle::after {
  width: 16px;
  height: 16px;
  border: none;
  background: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2215%22%20height%3D%2216%22%20viewBox%3D%220%200%2015%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8.28%204.62L10.88%207.22M1%2011.38V14.5H4.12L14%204.62L10.88%201.5L1%2011.38Z%22%20stroke%3D%22%23F4991A%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
}
.dropdown .dropdown-toggle:focus {
  box-shadow: unset;
}
.dropdown .disabled-item {
  color: black;
  background: rgb(238.6153715161, 238.131838565, 239.868161435);
}

.floating-labels .form-control {
  padding: 10px 20px;
  border: 1px solid rgb(238.6153715161, 238.131838565, 239.868161435);
  border-radius: 0.5rem;
  background-color: rgb(238.6153715161, 238.131838565, 239.868161435);
}
.floating-labels .form-control.valid {
  border-color: #eff4ed;
  background-color: #fbfff9;
}
.floating-labels .form-control[aria-invalid]:not(:focus) {
  border: solid 1px #e9d2d4;
  background-color: #f8eeef !important;
  color: #dd0b14;
}
.floating-labels .form-control[aria-invalid]:not(:focus) + label {
  color: #dd0b14 !important;
}
.floating-labels .form-control:focus {
  box-shadow: none;
}
.floating-labels .form-floating {
  margin-top: 14px;
}
.floating-labels .form-floating > label {
  margin: 1px 0 1px 8px;
  padding: 0.75rem !important;
  display: block;
  background-color: transparent;
  height: calc(100% - 2px);
  white-space: nowrap;
  max-width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #5e4897;
  border-radius: 1em;
}
.floating-labels .form-floating > .form-control {
  line-height: 2;
  height: revert;
}
.floating-labels .form-floating > .form-control[aria-invalid] ~ label {
  color: #5e4897;
}
.floating-labels .form-floating > .form-control:is(textarea) {
  padding-top: 0.7em !important;
  padding-bottom: 0.7em !important;
}
.floating-labels .form-floating > .form-control:not(:placeholder-shown) {
  border: solid 1px #e4eae2;
  background-color: #fbfff9;
}
.floating-labels .form-floating > .form-control:focus,
.floating-labels .form-floating > .form-control:not(:placeholder-shown),
.floating-labels .form-floating > .form-select {
  padding: 10px 20px;
}
.floating-labels .form-floating > .form-control:focus ~ label,
.floating-labels .form-floating > .form-control:not(:placeholder-shown) ~ label,
.floating-labels .form-floating > .form-select ~ label {
  opacity: 1;
  display: flex;
  align-items: center;
  background-color: white;
  padding: 0 13px 21px 13px;
  height: 1em;
  margin-left: 7px;
  margin-top: -4px;
  /*@include menutabactive;*/
}
.floating-labels .validation-message {
  margin-left: 21px;
}
@media screen and (min-width: 768px) {
  .floating-labels .input-checkmark-metrics-validation-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
}
.floating-labels .input-checkmark-metrics-validation-container .input-group {
  display: grid;
  max-width: 350px;
}
@media screen and (width < 768px) {
  .floating-labels .input-checkmark-metrics-validation-container .input-group {
    max-width: unset;
  }
}
.floating-labels .input-checkmark-metrics-validation-container .input-group .inputBox {
  border-radius: unset;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
  grid-row-start: 1;
}
.floating-labels .input-checkmark-metrics-validation-container .input-group .checkmark {
  background-color: #fbfff9;
}
.floating-labels .input-checkmark-metrics-validation-container .input-group .checkmark i {
  font-size: 25px;
  color: #68b43e;
}
.floating-labels .input-checkmark-metrics-validation-container .input-group .input-group-text {
  border: solid 1px #e7ede4;
  border-left: none;
  grid-row-start: 1;
}
.floating-labels .input-checkmark-metrics-validation-container .input-group .input-group-text.checkmark {
  display: none;
}
.floating-labels .input-checkmark-metrics-validation-container .input-group .input-group-text.metrics {
  max-width: 50px;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  background-color: #fff;
  border: solid 1px #e7ede4;
}
.floating-labels .input-checkmark-metrics-validation-container .input-group .modified.valid:not(:focus) + .checkmark {
  display: initial;
}
.floating-labels .input-checkmark-metrics-validation-container .input-group .modified:placeholder-shown + .checkmark.checkmark {
  display: none;
}

.RadioButtons {
  display: flex;
  gap: 30px;
  align-items: center;
  font-style: normal;
  font-weight: 600;
  font-size: 0.875rem;
  color: #5e4897;
}
.RadioButtons .form-check {
  cursor: pointer;
}
.RadioButtons .form-check .form-check-input {
  font-size: 1rem;
}
.RadioButtons .form-check .form-check-input:checked[type=radio] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%235e4897'/%3e%3c/svg%3e");
  background-color: #fff;
  border-color: black;
}
.RadioButtons input[type=radio]:after {
  all: unset;
}

.toggle-switch {
  display: flex;
  align-items: center;
  font-style: normal;
  font-weight: 600;
  font-size: 0.875rem;
  color: #5e4897;
}
.toggle-switch .form-switch {
  font-size: 1.563rem;
}
.toggle-switch .form-switch .form-check-input {
  margin-top: 0;
}
.toggle-switch .form-switch .form-check-input.always-on-style {
  background-color: #fff;
  border-color: black;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3ccircle cx='10' cy='10' r='7' fill='rgba(155, 128, 185, 0.9)'/%3e%3c/svg%3e"); /* Change %23fff to your desired color */
}
.toggle-switch .form-switch .form-check-input.always-on-style:hover {
  background-color: #5e4897;
  border-color: #5e4897;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3ccircle cx='10' cy='10' r='7' fill='%23fff'/%3e%3c/svg%3e"); /* Change %23fff to your desired color */
}
.toggle-switch .toggle-switch__text-current {
  display: none;
}
.toggle-switch input[type=checkbox]:after {
  all: unset;
}

#TooltipRadioButtons {
  display: flex;
  gap: 30px;
  align-items: center;
  font-style: normal;
  font-weight: 600;
  font-size: 0.875rem;
  color: #5e4897;
}
#TooltipRadioButtons .form-check {
  cursor: pointer;
}
#TooltipRadioButtons .form-check .form-check-input {
  font-size: 1rem;
}
#TooltipRadioButtons .form-check .form-check-input:checked[type=radio] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%235e4897'/%3e%3c/svg%3e");
  background-color: #fff;
  border-color: black;
}
#TooltipRadioButtons input[type=radio]:after {
  all: unset;
}

.error-list ul {
  margin-bottom: 0;
}

.toggle-main-heading-and-menu-visibility {
  display: none;
}

@media screen and (width < 768px) {
  #sleak-buttonwrap {
    display: none;
  }
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard {
  display: grid;
  grid-template-columns: 12fr 4fr;
  grid-gap: 40px;
}
@media (width < 1200px) {
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard {
    grid-gap: 20px;
    grid-template-columns: 3fr 2fr;
  }
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .invalid-h3-font-red .h3:not(.h3:only-child) {
  color: red;
}
@media screen and (min-width: 768px) {
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .sticky-configurator-menu {
    position: sticky;
    top: 0;
  }
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard #TooltipRadioButtons {
  flex-wrap: wrap;
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardMenu {
  grid-column-start: 2;
  grid-row-start: 1;
  grid-row-end: 2;
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardMenu .list-group {
  border-radius: 0;
}
@media (width < 768px) {
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardMenu .list-group {
    flex-direction: row !important;
  }
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardMenu .list-group .list-group-item {
    border-top-width: 1px;
    border-left-width: 0;
  }
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardMenu .list-group .list-group-item:not(.active) {
    width: 30px;
  }
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardMenu .list-group .list-group-item:not(.active) .step-name {
    display: none;
  }
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSummary {
  grid-column-start: 2;
  grid-row-start: 2;
  grid-row-end: 3;
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSummary .WizardProductImage img {
  max-width: 80px;
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSteps {
  width: 100%;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-row-end: 4;
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSteps .WizardNavigatorButtons {
  background-color: rgba(255, 255, 255, 0.8);
  position: sticky;
  bottom: 0;
  padding-bottom: 0.5em;
  padding-top: 0.5em;
  text-align: right;
  z-index: 1020;
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSteps .option {
  font-size: 10pt;
  padding: 8px 8px;
  cursor: pointer;
  border: 2px solid #dee2e6;
}
#GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSteps .option.option-active {
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  border-color: #5e4897;
}
@media (width < 768px) {
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard {
    display: block;
  }
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardMenu {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 2;
  }
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSummary {
    display: block;
    position: sticky;
    top: 50px;
    z-index: 1005;
    grid-column-start: 1;
    grid-column-end: 3;
  }
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSummary .WizardSummaryDescription {
    display: none;
  }
  #GenericClosetConfigurator #GenericClosetConfiguratorWizard .WizardSteps {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 3;
    grid-row-end: 4;
  }
}