/*!*********************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[3]!./styles/index.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap);
/*!*************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[3]!./styles/index.scss (1) ***!
  \*************************************************************************************************************************************************************************************************************************************************/
:root {
  --natali_color_accent: #6d2eff;
  --natali_color_accent-hover: #9466FF;
}

.natali-product {
  font-family: "Inter", sans-serif;
  line-height: 1.7;
}

.nl-button, .nl-button_loaded, .nl-button_primary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  color: inherit;
  border: 1px solid transparent;
  padding: 10px 24px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  transition: all 0.3s ease-out;
}
.nl-button:disabled, .nl-button_loaded:disabled, .nl-button_primary:disabled {
  opacity: 0.5;
  cursor: default;
}
.nl-button_primary {
  background-color: var(--natali_color_accent);
  color: #fff;
  border: 1px solid var(--natali_color_accent);
}
.nl-button_primary:hover {
  background-color: var(--natali_color_accent-hover);
  border: 1px solid var(--natali_color_accent-hover);
}
.nl-button_loaded {
  background-color: var(--natali_color_accent-hover);
  border: 1px solid var(--natali_color_accent-hover);
  cursor: default;
}
.nl-button_loaded:before {
  display: flex;
  content: "";
  position: absolute;
  background-color: inherit;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 1;
}
.nl-button_loaded:after {
  z-index: 2;
  display: flex;
  position: absolute;
  top: calc(50% - 8px);
  right: calc(50% - 8px);
  content: "";
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg width=%2716%27 height=%2716%27 viewBox=%270 0 16 16%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M8 0C6.73752 -1.5055e-08 5.49296 0.298792 4.36808 0.871948C3.2432 1.4451 2.26993 2.27635 1.52786 3.29772C0.785795 4.31909 0.295989 5.50158 0.0984932 6.74852C-0.0990026 7.99546 0.00141915 9.27144 0.391548 10.4721C0.781677 11.6728 1.45044 12.7641 2.34315 13.6569C3.23586 14.5496 4.32717 15.2183 5.52786 15.6085C6.72856 15.9986 8.00454 16.099 9.25148 15.9015C10.4984 15.704 11.6809 15.2142 12.7023 14.4721L11.7618 13.1777C10.9447 13.7714 9.99873 14.1632 9.00118 14.3212C8.00363 14.4792 6.98285 14.3989 6.02229 14.0868C5.06174 13.7747 4.18869 13.2397 3.47452 12.5255C2.76035 11.8113 2.22534 10.9383 1.91324 9.97771C1.60114 9.01715 1.5208 7.99637 1.67879 6.99882C1.83679 6.00127 2.22864 5.05527 2.82229 4.23817C3.41595 3.42108 4.19456 2.75608 5.09446 2.29756C5.99437 1.83903 6.99001 1.6 8 1.6V0Z%27 fill=%27white%27/%3E%3C/svg%3E%0A");
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: center center;
  animation: 1s rotate infinite linear;
  transform-origin: center;
}

@keyframes rotate {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes DrawLine {
  0% {
    stroke-dasharray: 0 126;
  }
  100% {
    stroke-dasharray: 126 126;
  }
}
.nl-loader {
  cursor: default;
  min-height: 16px;
  min-width: 16px;
  position: relative;
}
.nl-loader:before {
  display: flex;
  content: "";
  position: absolute;
  background-color: rgba(255, 255, 255, 0.5);
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 1;
}
.nl-loader:after {
  z-index: 2;
  display: flex;
  position: absolute;
  top: calc(50% - 8px);
  right: calc(50% - 8px);
  content: "";
  width: 100%;
  height: 100%;
  max-height: 30px;
  max-width: 30px;
  background-image: url("data:image/svg+xml,%3Csvg width=%2716%27 height=%2716%27 viewBox=%270 0 16 16%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M8 0C6.73752 -1.5055e-08 5.49296 0.298792 4.36808 0.871948C3.2432 1.4451 2.26993 2.27635 1.52786 3.29772C0.785795 4.31909 0.295989 5.50158 0.0984932 6.74852C-0.0990026 7.99546 0.00141915 9.27144 0.391548 10.4721C0.781677 11.6728 1.45044 12.7641 2.34315 13.6569C3.23586 14.5496 4.32717 15.2183 5.52786 15.6085C6.72856 15.9986 8.00454 16.099 9.25148 15.9015C10.4984 15.704 11.6809 15.2142 12.7023 14.4721L11.7618 13.1777C10.9447 13.7714 9.99873 14.1632 9.00118 14.3212C8.00363 14.4792 6.98285 14.3989 6.02229 14.0868C5.06174 13.7747 4.18869 13.2397 3.47452 12.5255C2.76035 11.8113 2.22534 10.9383 1.91324 9.97771C1.60114 9.01715 1.5208 7.99637 1.67879 6.99882C1.83679 6.00127 2.22864 5.05527 2.82229 4.23817C3.41595 3.42108 4.19456 2.75608 5.09446 2.29756C5.99437 1.83903 6.99001 1.6 8 1.6V0Z%27 fill=%27white%27/%3E%3C/svg%3E%0A");
  background-size: 90%;
  background-repeat: no-repeat;
  background-position: center center;
  animation: 1s rotate infinite linear;
  transform-origin: center;
  filter: invert(1);
}
.nl-loader_trans:before {
  background-color: transparent;
}
.nl-loader_white:after {
  filter: invert(0);
}

.natali-notices {
  transition: all 0.3s ease-in-out;
  overflow: hidden;
}

.notice-response {
  transition: all 0.3s ease-in-out;
}

.nl-categories__footer {
  padding: 16px 0;
  background-color: #fff;
  border-top-width: 1px;
  border-top-style: solid;
  position: sticky;
  bottom: 0;
  border-top-color: #c3c4c7;
  display: flex;
  gap: 16px;
}
.nl-categories__item {
  display: grid;
  grid-template-columns: 50px 1fr 1fr;
  align-items: stretch;
  margin: 0 -12px;
  padding: 0 12px;
}
.nl-categories__item > * {
  display: flex;
  align-items: center;
}
.nl-categories__item:nth-child(odd) {
  background-color: rgba(0, 0, 0, 0.05);
}

.nl-import.disable {
  position: relative;
}
.nl-import.disable:before {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  content: "";
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 0.5);
}

.nl_import_bar {
  flex-grow: 1;
}
.nl_import_bar__counter {
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.nl_import_bar__statusbar {
  height: 5px;
  width: 100%;
  background-color: #bdbdbd;
}
.nl_import_bar__finish {
  font-weight: bold;
}
.nl_import_bar__total {
  font-weight: bold;
}
.nl_import_bar__time {
  font-weight: bold;
}
.nl_import_bar__progress {
  height: 5px;
  width: 0;
  background-color: var(--natali_color_accent);
}
.nl_import_bar__working {
  display: none;
}