@charset "UTF-8";
:root {
  --a-mobile: 10;
  --b-mobile: 20;
  --c-mobile: 1;
  --d-mobile: 576;
  --a-tablet: 10;
  --b-tablet: 16;
  --c-tablet: 577;
  --d-tablet: 1024;
  --a: 14;
  --b: 18;
  --c: 340;
  --d: 3840;
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  outline: 0;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-stroke: 0;
  -webkit-tap-highlight-color: transparent;
}

html {
  font-family: "Cairo", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "slnt" 0;
  font-size: 18px;
  background-color: #e2fcfc;
  scrollbar-gutter: stable;
}
@media (min-width: 1024px) {
  html {
    font-size: 16px;
  }
  html .notifications .notification {
    padding: 1.75rem 2.5rem;
  }
}
@media (min-width: 1280px) {
  html {
    font-size: 18px;
  }
}

body {
  background-color: var(--primary);
  color: var(--secondary);
  margin-right: 0 !important;
}
body.block-scroll {
  overflow: hidden;
}

a,
button,
input,
textarea,
select {
  color: inherit;
  text-decoration-color: transparent;
  background-color: transparent;
}

button {
  font-family: "Cairo", sans-serif;
}

main {
  padding: 0 1.25rem;
}
main section {
  max-width: 2000px;
  margin: auto;
}
@media (min-width: 1280px) {
  main {
    padding: 0 2.5rem;
  }
}

.icon {
  width: 1rem;
  height: 1rem;
  background-color: #000000;
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat; /* Safari */
  mask-size: cover; /* Vagy 'cover', attól függően, mi a jobb */
  -webkit-mask-size: cover; /* Safari */
  mask-position: center;
  -webkit-mask-position: center;
  transition: background-color 0.5s;
}

.info-icon {
  background-color: #a0b4b3;
  mask-image: url("/img/icons/info-icon.svg");
  -webkit-mask-image: url("/img/icons/info-icon.svg"); /* Safari támogatás */
}

.checkmark-icon {
  background-color: #a0b4b3;
  mask-image: url("/img/icons/checkmark-icon.svg");
  -webkit-mask-image: url("/img/icons/checkmark-icon.svg"); /* Safari támogatás */
}

.arrow-icon {
  mask-image: url("/img/icons/arrow.svg");
  -webkit-mask-image: url("/img/icons/arrow.svg");
}

.plus-icon {
  mask-image: url("/img/icons/plus.svg");
  -webkit-mask-image: url("/img/icons/plus.svg");
}

.minus-icon {
  mask-image: url("/img/icons/minus.svg");
  -webkit-mask-image: url("/img/icons/minus.svg");
}

.category-icon {
  mask-image: url("/img/icons/category-star.svg");
  -webkit-mask-image: url("/img/icons/category-star.svg");
}

.search-delete-icon {
  cursor: pointer;
  mask-image: url("/img/icons/search-delete.svg");
  -webkit-mask-image: url("/img/icons/search-delete.svg"); /* Safari támogatás */
}

.reset-icon {
  cursor: pointer;
  mask-image: url("/img/icons/reset-filter.svg");
  -webkit-mask-image: url("/img/icons/reset-filter.svg"); /* Safari támogatás */
}

.nav-arrow {
  cursor: pointer;
  mask-image: url("/img/icons/nav-arrow.svg");
  -webkit-mask-image: url("/img/icons/nav-arrow.svg"); /* Safari támogatás */
}

.dropdown-icon {
  mask-image: url("/img/icons/dropdown-icon.svg");
  -webkit-mask-image: url("/img/icons/dropdown-icon.svg"); /* Safari támogatás */
}

.trash-icon {
  mask-image: url("/img/icons/trash-icon.svg");
  -webkit-mask-image: url("/img/icons/trash-icon.svg"); /* Safari támogatás */
}

.activity-icon {
  mask-image: url("/img/icons/activity-icon.svg");
  -webkit-mask-image: url("/img/icons/activity-icon.svg"); /* Safari támogatás */
}

.price-icon {
  mask-image: url("/img/icons/price-icon.svg");
  -webkit-mask-image: url("/img/icons/price-icon.svg"); /* Safari támogatás */
}

.people-icon {
  mask-image: url("/img/icons/people-icon.svg");
  -webkit-mask-image: url("/img/icons/people-icon.svg"); /* Safari támogatás */
}

.package-icon {
  mask-image: url("/img/icons/package-icon.svg");
  -webkit-mask-image: url("/img/icons/package-icon.svg"); /* Safari támogatás */
}

.whats-app-icon {
  mask-image: url("/img/icons/whats-app-icon.svg");
  -webkit-mask-image: url("/img/icons/whats-app-icon.svg"); /* Safari támogatás */
}

.fb-messenger-icon {
  mask-image: url("/img/icons/fb-messenger.svg");
  -webkit-mask-image: url("/img/icons/fb-messenger.svg"); /* Safari támogatás */
}

.fb-messenger-icon {
  mask-image: url("/img/icons/fb-messenger.svg");
  -webkit-mask-image: url("/img/icons/fb-messenger.svg"); /* Safari támogatás */
}

.lock-icon {
  mask-image: url("/img/icons/lock.svg");
  -webkit-mask-image: url("/img/icons/lock.svg"); /* Safari támogatás */
}

.locked-icon {
  mask-image: url("/img/icons/locked.svg");
  -webkit-mask-image: url("/img/icons/locked.svg"); /* Safari támogatás */
}

.opened-icon {
  mask-image: url("/img/icons/opened.svg");
  -webkit-mask-image: url("/img/icons/opened.svg"); /* Safari támogatás */
}

.empty-icon {
  mask-image: url("/img/icons/empty.svg");
  -webkit-mask-image: url("/img/icons/empty.svg"); /* Safari támogatás */
}

.img-icon {
  mask-image: url("/img/icons/img-icon.svg");
  -webkit-mask-image: url("/img/icons/img-icon.svg"); /* Safari támogatás */
}

.cog-icon {
  mask-image: url("/img/icons/cog-icon.svg");
  -webkit-mask-image: url("/img/icons/cog-icon.svg"); /* Safari támogatás */
}

.shield-icon {
  mask-image: url("/img/icons/shield-icon.svg");
  -webkit-mask-image: url("/img/icons/shield-icon.svg"); /* Safari támogatás */
}

.id-icon {
  mask-image: url("/img/icons/id-icon.svg");
  -webkit-mask-image: url("/img/icons/id-icon.svg"); /* Safari támogatás */
}

.location-icon {
  mask-image: url("/img/icons/location-icon.svg");
  -webkit-mask-image: url("/img/icons/location-icon.svg"); /* Safari támogatás */
}

.edit-icon {
  mask-image: url("/img/icons/edit-icon.svg");
  -webkit-mask-image: url("/img/icons/edit-icon.svg"); /* Safari támogatás */
}

.x-icon {
  mask-image: url("/img/icons/x-icon.svg");
  -webkit-mask-image: url("/img/icons/x-icon.svg"); /* Safari támogatás */
}

.eye-icon {
  mask-image: url("/img/icons/eye-icon.svg");
  -webkit-mask-image: url("/img/icons/eye-icon.svg");
}

.clock-icon {
  mask-image: url("/img/icons/clock-icon.svg");
  -webkit-mask-image: url("/img/icons/clock-icon.svg");
}

.save-icon {
  margin-left: auto;
  cursor: pointer;
  background-color: #a0b4b3;
  mask-image: url("/img/icons/save-icon.svg");
  -webkit-mask-image: url("/img/icons/save-icon.svg");
}
.save-icon:hover {
  background-color: #000000;
}
.save-icon.saved {
  background-color: #000000;
  mask-image: url("/img/icons/filled-save-icon.svg");
  -webkit-mask-image: url("/img/icons/filled-save-icon.svg");
}

.bookmark-icon {
  mask-image: url("/img/icons/bookmark-icon.svg");
  -webkit-mask-image: url("/img/icons/bookmark-icon.svg");
}
.bookmark-icon.saved {
  background-color: #000000;
  mask-image: url("/img/icons/filled-bookmark-icon.svg");
  -webkit-mask-image: url("/img/icons/filled-bookmark-icon.svg");
}

.header-bookmark-icon {
  mask-image: url("/img/icons/header-bookmark-icon.svg");
  -webkit-mask-image: url("/img/icons/header-bookmark-icon.svg");
}

.my_products-icon {
  mask-image: url("/img/icons/my_products.svg");
  -webkit-mask-image: url("/img/icons/my_products.svg"); /* Safari támogatás */
}

.profile-icon {
  mask-image: url("/img/icons/profile.svg");
  -webkit-mask-image: url("/img/icons/profile.svg"); /* Safari támogatás */
}

.search-icon {
  mask-image: url("/img/icons/search.svg");
  -webkit-mask-image: url("/img/icons/search.svg"); /* Safari támogatás */
}

.history-icon {
  mask-image: url("/img/icons/history.svg");
  -webkit-mask-image: url("/img/icons/history.svg"); /* Safari támogatás */
}

.layers-icon {
  mask-image: url("/img/icons/layers.svg");
  -webkit-mask-image: url("/img/icons/layers.svg"); /* Safari támogatás */
}

.coin-icon {
  mask-image: url("/img/icons/coin-stack.svg");
  -webkit-mask-image: url("/img/icons/coin-stack.svg"); /* Safari támogatás */
}

.save-btn {
  text-decoration: underline;
  background-color: #d3e8e9;
  width: 100%;
  padding: 1.25rem;
  cursor: pointer;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.accordion {
  position: fixed;
  width: 100%;
  z-index: 600;
  display: none;
}
.accordion.active {
  inset: 0;
  display: block;
}

.badge {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  padding: 0.12rem;
  background-color: #d3e8e9;
  border-radius: 3em;
  text-wrap: nowrap;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.badge img {
  height: 2rem;
  width: 2rem;
  object-fit: cover;
  border-radius: 50%;
}
.badge .icon {
  background-color: #000000;
}
.badge span {
  display: none;
}
.badge.info-badge {
  background-color: #0e8d8d;
  padding: 0.5rem 0.75rem;
  gap: 0.5rem;
  color: #ffffff;
  box-shadow: 0 4px 4px 0 rgba(14, 141, 141, 0.25);
}
.badge.info-badge .icon {
  background-color: #ffffff;
}
.badge.character-badge {
  background-color: #0e8d8d;
  gap: 0.5rem;
  color: #ffffff;
  box-shadow: 0 4px 4px 0 rgba(14, 141, 141, 0.25);
}
.badge.character-badge .icon {
  background-color: #ffffff;
}
@media (min-width: 730px) {
  .badge span {
    display: block;
  }
  .badge.character-badge {
    padding-right: 0.75rem;
  }
}

.empty-btn {
  border-bottom: 1px solid transparent;
  transition: border-bottom-color 0.3s;
}
@media (min-width: 1280px) {
  .empty-btn.active:hover {
    border-bottom-color: transparent !important;
  }
  .empty-btn:hover {
    border-bottom-color: #000000 !important;
  }
}

.open-popup {
  cursor: pointer;
}

.upload-link-container {
  padding: 1.25rem;
}
@media (min-width: 1280px) {
  .upload-link-container {
    padding: 0;
  }
}

.filled-btn {
  background-color: #000000;
  color: #e2fcfc;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem 0;
  transition: opacity 0.3s;
  width: 100%;
  cursor: pointer;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.filled-btn:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
@media (min-width: 1280px) {
  .filled-btn:disabled:hover {
    opacity: 0.5;
  }
}
@media (min-width: 1280px) {
  .filled-btn:hover {
    opacity: 0.75;
  }
}

@media (min-width: 1024px) {
  .edit-product-btn {
    grid-column: 2/3;
    border-left: 1px solid #d3e8e9;
    border-right: 1px solid #d3e8e9;
  }
}
@media (min-width: 1280px) {
  .edit-product-btn {
    transition: border 0.3s;
  }
  .edit-product-btn:hover {
    border-bottom: 1px solid #000000;
  }
}

.scroll-to-top-btn {
  border-radius: 2.5rem;
  border: 1px solid #a0b4b3;
  background: #e2fcfc;
  height: 2.5rem;
  width: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  bottom: -2.5rem;
  right: 0.75rem;
  z-index: 500;
  cursor: pointer;
  transition: bottom 0.1s;
}
@media (min-width: 1024px) {
  .scroll-to-top-btn {
    right: 2.5rem;
  }
}
.scroll-to-top-btn .icon {
  transform: rotate(-45deg);
}
.scroll-to-top-btn.showed {
  bottom: 0.75rem;
}
@media (min-width: 1024px) {
  .scroll-to-top-btn.showed {
    bottom: 2.5rem;
  }
}

.qa h1 {
  padding: 1.25rem 0;
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1280px) {
  .qa h1 {
    padding: 2.5rem 0;
  }
}

.dropdown-table {
  margin: 0 -1.25rem;
}
@media (min-width: 1024px) {
  .dropdown-table {
    border-left: 1px solid #d3e8e9;
    border-right: 1px solid #d3e8e9;
    max-width: 57.5rem;
    margin: auto;
  }
}
.dropdown-table .dropdown {
  border-top: 1px solid #d3e8e9;
  padding: 0 1.25rem;
}
.dropdown-table .dropdown:last-of-type {
  border-bottom: 1px solid #d3e8e9;
}
.dropdown-table .dropdown .dropdown-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem 0;
  cursor: pointer;
}
.dropdown-table .dropdown .dropdown-title h2 {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.dropdown-table .dropdown .dropdown-title .icon {
  background-color: #a0b4b3;
}
.dropdown-table .dropdown .dropdown-title.active .icon {
  mask-image: url("/img/icons/search-delete.svg");
  -webkit-mask-image: url("/img/icons/search-delete.svg"); /* Safari támogatás */
}
.dropdown-table .dropdown .accordion {
  position: static;
  padding-bottom: 1.5rem;
}

.filter-row > ul {
  overflow-x: auto;
  overflow-y: visible;
  display: flex;
  list-style-type: none;
  gap: 0.5rem;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.filter-row > ul::-webkit-scrollbar {
  display: none;
}
.filter-row > ul > li {
  cursor: pointer;
}
.filter-row > ul > li .filter-select {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1.25rem 0.5rem;
  position: relative;
  z-index: 100;
}
.filter-row > ul > li .filter-select .selected-num {
  background-color: #000000;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #e2fcfc;
  height: 1rem;
  width: 1rem;
  border-radius: 50%;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 100%; /* 0.75rem */
  display: none;
}
.filter-row > ul > li .filter-select .filter-name {
  color: #a0b4b3;
}
.filter-row > ul > li .filter-select .filter-name .icon {
  display: none;
}
.filter-row > ul > li .filter-select.has-selected .selected-num {
  display: flex;
}
.filter-row > ul > li .filter-select.has-selected .filter-name {
  color: #000000;
}
.filter-row > ul > li .filter-select.has-selected .filter-accordion-header .reset-filter-btn .icon {
  background-color: #000000;
}
.filter-row > ul > li .filter-select .reset-filter {
  display: none;
}
.filter-row > ul > li .filter-accordion {
  background-color: #e2fcfc;
  height: 100%;
  z-index: 1000;
}
.filter-row > ul > li .filter-accordion-header {
  border-top: 1px solid #d3e8e9;
  border-bottom: 1px solid #d3e8e9;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem;
}
.filter-row > ul > li .filter-accordion-header button {
  height: 1rem;
  width: 1rem;
  background-color: transparent;
}
.filter-row > ul > li .filter-accordion-header span {
  width: 100%;
  text-align: center;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.filter-row > ul > li .filter-accordion-header .reset-filter-btn:active .icon {
  background-color: #000000;
}
.filter-row > ul > li .filter-accordion-header .reset-filter-btn .icon {
  background-color: #a0b4b3;
}
.filter-row > ul > li .filter-accordion .options-container {
  max-height: calc(100% - 4rem);
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.filter-row > ul > li .filter-accordion .options-container ul {
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow-x: auto;
  scrollbar-color: #000000 transparent;
  scrollbar-width: thin;
}
.filter-row > ul > li .filter-accordion .options-container ul li {
  border-bottom: 1px solid #d3e8e9;
  padding: 0;
}
.filter-row > ul > li .filter-accordion .options-container ul li label {
  padding: 0.75rem 1.25rem;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 1.38rem;
  cursor: pointer;
}
.filter-row > ul > li .filter-accordion .options-container ul li label:before {
  content: "";
  display: block;
  height: 0.75rem;
  width: 0.75rem;
  border-radius: 50%;
  border: 1px solid #a0b4b3;
  transition: border-color 0.3s background-color 0.3s;
}
.filter-row > ul > li .filter-accordion .options-container ul li label:has(input:checked):before {
  border-color: #000000;
  background-color: #000000;
}
.filter-row > ul > li .filter-accordion .options-container ul li label input {
  display: none;
}
.filter-row > ul > li .filter-accordion .options-container ul li label span {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.filter-row > ul > li .filter-accordion .options-container .btn-container {
  padding: 0.75rem 1.25rem;
  border-top: 1px solid #d3e8e9;
}
.filter-row > ul > li .filter-accordion .options-container .btn-container button {
  padding: 0.75rem;
  width: 100%;
  background-color: #000000;
  color: #e2fcfc;
  cursor: pointer;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .filter-row > ul {
    overflow: visible;
    gap: 0;
  }
  .filter-row > ul > li {
    width: 100%;
    position: relative;
    border: 1px solid transparent;
  }
  .filter-row > ul > li:hover:after {
    content: "";
    position: absolute;
    inset: -1px;
    border-bottom: 1px solid #000000;
    z-index: 1;
  }
  .filter-row > ul > li .filter-select {
    z-index: 200;
    padding: 1.25rem 0.5rem;
  }
  .filter-row > ul > li .filter-select.active:after {
    content: "";
    border: 1px solid #000000;
    position: absolute;
    inset: -1px;
  }
  .filter-row > ul > li .filter-select.active .reset-filter {
    z-index: 300;
    display: block;
    justify-self: flex-end;
  }
  .filter-row > ul > li .filter-select.active .reset-filter:hover .reset-icon {
    background-color: #000000;
  }
  .filter-row > ul > li .filter-select.active .reset-filter .reset-icon {
    background-color: #a0b4b3;
    transition: background-color 0.3s;
  }
  .filter-row > ul > li .filter-select .filter-name {
    width: 100%;
    z-index: 300;
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .filter-row > ul > li .filter-select .filter-name .icon {
    display: block;
    background-color: #a0b4b3;
    transform: rotate(-90deg);
  }
  .filter-row > ul > li .filter-select.has-selected .selected-num {
    min-width: 1rem;
  }
  .filter-row > ul > li .filter-select.has-selected .filter-name .icon {
    background-color: #000000;
  }
  .filter-row > ul > li .filter-accordion {
    height: 50rem;
    max-height: 25.5625rem;
    position: absolute;
    display: none;
    width: auto;
    outline: 1px solid #000000;
  }
  .filter-row > ul > li .filter-accordion.active {
    display: block;
    top: 100%;
    left: 0;
    right: 0;
  }
  .filter-row > ul > li .filter-accordion-header {
    display: none;
  }
  .filter-row > ul > li .filter-accordion-header button {
    height: 1rem;
    width: 1rem;
    background-color: transparent;
  }
  .filter-row > ul > li .filter-accordion-header span {
    width: 100%;
    text-align: center;
    font-family: "Azeret Mono";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
  }
  .filter-row > ul > li .filter-accordion-header .reset-filter-btn .icon {
    background-color: #a0b4b3;
  }
  .filter-row > ul > li .filter-accordion-header .reset-filter-btn:hover .icon {
    background-color: #000000;
  }
  .filter-row > ul > li .filter-accordion .options-container {
    max-height: 100%;
  }
  .filter-row > ul > li .filter-accordion .options-container ul {
    padding: 1rem;
    list-style-type: none;
  }
  .filter-row > ul > li .filter-accordion .options-container ul li {
    padding: 0;
  }
  .filter-row > ul > li .filter-accordion .options-container ul li:last-of-type {
    border-bottom: 0;
  }
  .filter-row > ul > li .filter-accordion .options-container ul li label {
    padding: 0.25rem;
  }
  .filter-row > ul > li .filter-accordion .options-container ul li label:hover:before {
    border-color: #000000;
  }
  .filter-row > ul > li .filter-accordion .options-container .btn-container {
    display: none;
  }
}

.notifications .notification {
  background-color: #d3e8e9;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: 1rem auto 1.5rem;
  align-items: center;
  padding: 0.75rem 0.75rem;
}
.notifications .notification > .icon {
  grid-column: 1/2;
  background-color: #000000;
  height: 1rem;
}
.notifications .notification span {
  grid-column: 2/3;
  text-align: center;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.notifications .notification .close-notification {
  grid-column: 3/4;
  cursor: pointer;
}
.notifications .notification .close-notification .icon {
  height: 1.5rem;
  width: 1.5rem;
}

.pagination-container {
  padding: 1.25rem 0.5rem;
  border-bottom: 1px solid #d3e8e9;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #a0b4b3;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.pagination-container .load-more {
  display: none;
  background-color: inherit;
  transition: color 0.3s;
}
.pagination-container .load-more:active {
  color: #000000;
}
@media (min-width: 730px) {
  .pagination-container .load-more {
    display: flex;
  }
}
@media (min-width: 1024px) {
  .pagination-container {
    padding: 1.25rem 1.25rem 1.25rem 0;
  }
}
@media (min-width: 1280px) {
  .pagination-container .load-more:hover {
    color: #000000;
  }
}

.pagination {
  display: flex;
  color: #a0b4b3;
  width: 100%;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 730px) {
  .pagination {
    width: auto;
  }
}
.pagination a,
.pagination span {
  min-width: 2.5rem;
  height: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: color 0.3s;
}
.pagination a .icon,
.pagination span .icon {
  background-color: #a0b4b3;
}
.pagination a.active,
.pagination span.active {
  background-color: #000000;
  color: #e2fcfc;
}
@media (min-width: 1280px) {
  .pagination a.active:hover,
  .pagination span.active:hover {
    color: #e2fcfc;
  }
  .pagination a:hover,
  .pagination span:hover {
    color: #000000;
  }
  .pagination a:hover .icon,
  .pagination span:hover .icon {
    background-color: #000000;
  }
}
.pagination .prev .icon {
  transform: rotate(90deg);
}
.pagination .next {
  margin-left: auto;
}
@media (min-width: 730px) {
  .pagination .next {
    margin-left: unset;
  }
}
.pagination .next .icon {
  transform: rotate(-90deg);
}

.single-icon-box {
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
  display: flex;
  gap: 0.75rem;
  align-items: center;
}
.single-icon-box .img-container {
  border-radius: 4em;
  border: 1px solid #d3e8e9;
  padding: 0.25rem;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2.25rem;
  width: 2.25rem;
  min-width: 2.25rem;
}
.single-icon-box .img-container .icon {
  height: 1rem;
  width: 1rem;
  display: flex;
  background-color: #a0b4b3;
}

.single-icon-box-title {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.single-icon-box-content {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.uploader-info {
  padding: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  transition: border-color 0.3s;
}
@media (min-width: 1280px) {
  .uploader-info:hover {
    border-bottom-color: #000000;
  }
}

.uploader-img {
  height: 4rem;
  width: 4rem;
}
.uploader-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.uploader-text {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.uploader-text h3 {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.uploaded-count {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  height: 1.625rem;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.uploaded-count .count {
  padding: 0 0.25rem;
  display: inline-block;
  border: 1px solid #d3e8e9;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.uploader-info__bottom {
  display: flex;
  gap: 0.75rem;
}
.uploader-info__bottom span {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.uploader-info__bottom p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.uploader-info__bottom .uploader-info-rank {
  color: #0e8d8d;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}

.switcher {
  background-color: #e2fcfc;
  width: 3rem;
  border-radius: 3em;
  height: 1.5rem;
  cursor: pointer;
  position: relative;
}
.switcher .switch {
  position: absolute;
  left: 0;
  height: 1.5rem;
  width: 1.5rem;
  background-color: #a0b4b3;
  border-radius: 50%;
  transition: left 0.3s, background-color 0.3s;
}
.switcher.active .switch {
  left: 50%;
  background-color: #0e8d8d;
}

.tooltip {
  display: flex;
  justify-content: flex-end;
  cursor: pointer;
}
.tooltip .icon {
  background-color: #a0b4b3;
  height: 0.875rem;
  width: 0.875rem;
}
.tooltip > span {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  color: #a0b4b3;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.tooltip.active .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.tooltiptext {
  position: absolute;
  display: none;
  visibility: hidden;
  min-width: 16.25rem;
  z-index: 300;
  opacity: 0;
  transition: opacity 0.3s;
  max-width: calc(100vw - 10px);
}
@media (min-width: 730px) {
  .tooltiptext {
    max-width: 30rem;
  }
}
.tooltiptext p,
.tooltiptext ul {
  color: #e2fcfc;
  margin-top: 0.5rem;
  padding: 0.5rem;
  background-color: #000000;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.popup {
  right: -100%;
  opacity: 0;
  top: 1rem;
  transition: opacity 0.3s, top 0.3s;
  position: fixed;
  width: 100%;
  z-index: 600;
  transition: opacity 0s, top 0.3s !important;
}
.popup .popup-bg {
  position: absolute;
  width: 100%;
  left: 0;
  height: 100vh;
  background: rgba(255, 255, 255, 0.2);
  z-index: 0;
  inset: 0;
  background-color: rgba(255, 255, 255, 0.2509803922);
  opacity: 1;
  backdrop-filter: blur(0px);
  transition: backdrop-filter 0.3s;
}
.popup.active {
  right: 0;
  opacity: 1;
  top: 0;
  inset: 0;
}
.popup.active .popup-bg {
  position: fixed;
  backdrop-filter: blur(5px);
}
.popup.active .popup-inner {
  display: flex;
  flex-direction: column;
  opacity: 1;
}
.popup .p1 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.popup .p2 {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.popup p a {
  text-decoration: underline;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.popup-inner {
  position: relative;
  flex: 1;
  min-height: 100%;
  opacity: 0;
  justify-content: center;
  align-items: center; /* alapból középen */
  padding: 0.75rem; /* ugyanaz mint az inset volt */
  pointer-events: none; /* hogy csak a wrapper legyen kattintható */
  transition: opacity 0.3s;
}

.popup-inner-wrapper {
  pointer-events: all;
  background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.8) 100%);
  color: #d3e8e9;
  padding: 1.25rem;
  max-height: 100%;
  overflow-y: auto; /* ha magas → görgethető */
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  max-width: 38.375rem;
  cursor: auto;
}
.popup-inner-wrapper .close-popup {
  cursor: pointer;
}
.popup-inner-wrapper .close-popup .icon {
  background-color: #d3e8e9;
}
.popup-inner-wrapper .title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.popup-inner-wrapper .title-row h3 {
  padding: 0;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.popup-inner-wrapper img {
  width: 100%;
  height: auto;
  margin: auto;
  display: block;
}
.popup-inner-wrapper p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.popup-inner-wrapper p.bold {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}

.contact-popup {
  color: #e2fcfc;
}
.contact-popup.active {
  top: 0;
}

.popup-inner {
  padding: 1.25rem;
}
.popup-inner h4 {
  padding: 1.25rem 0;
  color: #a0b4b3;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.popup-inner .contact-list {
  border: 1px solid #d3e8e9;
}
.popup-inner .contact-list > a {
  padding: 0.5rem;
  text-align: center;
  width: 100%;
  display: block;
  border-bottom: 1px solid #d3e8e9;
}
.popup-inner .contact-list .messeging-container {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.25rem;
  gap: 0.5rem;
}
.popup-inner .contact-list .messeging-container a {
  height: 2.25rem;
  width: 2.25rem;
  display: flex;
}
.popup-inner .contact-list .messeging-container a .icon {
  background-color: #e2fcfc;
  height: 100%;
  width: 100%;
}
.popup-inner button {
  background-color: transparent;
  border-top: 0;
  width: 100%;
  color: #e2fcfc;
  cursor: pointer;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

@media (min-width: 1024px) {
  .popup-inner {
    width: 100%;
    position: absolute;
    right: 0;
  }
}
.not-logged-in-popup {
  position: fixed;
}
.not-logged-in-popup .popup-inner {
  background-color: #ffffff;
  top: 0;
  right: 0;
  width: 100%;
  padding: 1.25rem;
}
.not-logged-in-popup .popup-inner > div,
.not-logged-in-popup .popup-inner > button {
  border: 1px solid #d3e8e9;
  border-bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.not-logged-in-popup .popup-inner > div.title-box,
.not-logged-in-popup .popup-inner > button.title-box {
  padding: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 0.5rem;
}
.not-logged-in-popup .popup-inner > div.title-box .icon,
.not-logged-in-popup .popup-inner > button.title-box .icon {
  width: 3rem;
  height: 3rem;
}
.not-logged-in-popup .popup-inner > div.title-box p,
.not-logged-in-popup .popup-inner > button.title-box p {
  text-align: center;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.not-logged-in-popup .popup-inner > div.login-link-container,
.not-logged-in-popup .popup-inner > button.login-link-container {
  padding: 0.5rem;
}
.not-logged-in-popup .popup-inner > div.login-link-container .login-btn,
.not-logged-in-popup .popup-inner > button.login-link-container .login-btn {
  background-color: #000000;
  color: #e2fcfc;
  padding: 0.5rem;
  width: 100%;
  text-align: center;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.not-logged-in-popup .popup-inner > div.close-popup,
.not-logged-in-popup .popup-inner > button.close-popup {
  padding: 0.5rem;
  width: 100%;
  border-bottom: 1px solid #d3e8e9;
  background-color: transparent;
  cursor: pointer;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .not-logged-in-popup .popup-inner {
    width: 50%;
    position: absolute;
    right: 0;
  }
}
@media (min-width: 1280px) {
  .not-logged-in-popup .popup-inner > button.close-popup {
    transition: border 0.3s;
  }
  .not-logged-in-popup .popup-inner > button.close-popup:hover {
    border-bottom: 1px solid #000000;
  }
}

.profile-popup {
  background-color: #000000;
  color: #a0b4b3;
  padding: 1.25rem;
  top: 4.5rem;
  bottom: 0;
  z-index: 1000 !important;
}
@media (min-width: 1024px) {
  .profile-popup {
    padding: 2.5rem 0;
    top: 9.625rem;
  }
}
@media (min-width: 1280px) {
  .profile-popup {
    top: 10.625rem;
  }
}
.profile-popup.active {
  top: 3.5rem;
}
@media (min-width: 1024px) {
  .profile-popup.active {
    top: 8.625rem;
  }
}
@media (min-width: 1280px) {
  .profile-popup.active {
    top: 9.625rem;
  }
}
.profile-popup ul {
  list-style-type: none;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 1024px) {
  .profile-popup ul li {
    display: flex;
    width: 50%;
  }
}
@media (min-width: 1024px) and (min-width: 1024px) {
  .profile-popup ul li {
    justify-content: flex-end;
  }
}
.profile-popup ul li a {
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.profile-popup ul li:last-of-type a {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}

.search-popup {
  z-index: 1000;
}
.search-popup .popup-bg {
  backdrop-filter: blur(0px) !important;
}
.search-popup .search-icon {
  background-color: #a0b4b3;
  height: 1.5rem;
  width: 1.5rem;
  min-width: 1.5rem;
  margin-right: 0.75rem;
  margin-top: 0.25rem;
}
.search-popup .popup-inner {
  padding: 0;
  justify-content: flex-start;
  align-items: flex-end;
}
.search-popup .popup-inner-wrapper {
  padding: 0;
  max-width: 100%;
  gap: 0;
  background-color: #000000;
}
@media (min-width: 1024px) {
  .search-popup .popup-inner-wrapper {
    max-width: 50%;
  }
}
.search-popup .search-header {
  padding: 1.25rem;
  display: flex;
  align-items: center;
}
@media (min-width: 1024px) {
  .search-popup .search-header {
    height: 8.625rem;
  }
}
@media (min-width: 1280px) {
  .search-popup .search-header {
    height: 9.625rem;
  }
}
.search-popup .search-header .close-popup {
  display: block;
  height: 1.5rem;
  width: 1.5rem;
  min-width: 1.5rem;
  background-color: #e2fcfc;
  position: absolute;
  right: 1.25rem;
}
@media (min-width: 1024px) {
  .search-popup .search-header .close-popup {
    display: none;
  }
}
.search-popup #search-input {
  min-width: 0;
  max-width: calc(100% - 6rem);
  color: #e2fcfc;
  padding-right: 0.75rem;
  height: 4rem;
  padding: 0.75rem 0;
  border: none;
  outline: none;
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  line-height: 1;
}
.search-popup #measure {
  position: absolute;
  visibility: hidden;
  white-space: pre;
  font: inherit;
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  line-height: 100%;
}
.search-popup #clearBtn {
  width: auto;
}
.search-popup #clearBtn .icon {
  margin-top: 0.25rem;
  height: 1.5rem;
  width: 1.5rem;
  min-width: 1.5rem;
  background-color: #a0b4b3;
  cursor: pointer;
}
.search-popup .search-results-container {
  padding: 0 1.25rem 1.25rem;
}
@media (min-width: 1024px) {
  .search-popup .search-results-container {
    border-top: 1px solid #d3e8e9;
  }
}
.search-popup .search-list {
  list-style-type: none;
}
.search-popup .search-list li {
  border-bottom: 1px solid #d3e8e9;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.search-popup .search-list li a {
  padding: 0.5rem;
  color: #e2fcfc;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.search-popup .search-list li a span {
  color: #a0b4b3;
}
.search-popup .search-list li .history-icon {
  background-color: #e2fcfc;
}
.search-popup .search-submit {
  width: 100%;
  text-align: left;
  cursor: pointer;
  padding: 0.5rem;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.search-popup .search-submit .keyword:before {
  content: "“";
}
.search-popup .search-submit .keyword:after {
  content: "”";
}

.upload-warning-popup .popup-inner {
  background-color: #000000;
  color: #e2fcfc;
  padding: 1.25rem;
}
@media (min-width: 1280px) {
  .upload-warning-popup .popup-inner {
    width: 50%;
    margin-left: auto;
  }
}
.upload-warning-popup .popup-inner .title-box {
  border: 1px solid #d3e8e9;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 2.5rem 0.5rem;
  gap: 0.5rem;
}
.upload-warning-popup .popup-inner .title-box p {
  text-align: center;
}
.upload-warning-popup .popup-inner > button {
  display: block;
  width: 100%;
  padding: 0.5rem;
  cursor: pointer;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.upload-warning-popup .popup-inner .save-btn {
  color: #000000;
  background-color: #e2fcfc;
}
.upload-warning-popup .popup-inner .close-popup {
  background-color: transparent;
  color: #a0b4b3;
  border: 1px solid #d3e8e9;
}

.legend-popup .legend-popup-content {
  padding: 1.25rem 0;
  list-style-type: none;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 1024px) {
  .legend-popup .legend-popup-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
.legend-popup .legend-popup-content li {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.legend-popup .legend-popup-content li .icon-container {
  height: 2.25rem;
  width: 2.25rem;
  border: 1px solid #d3e8e9;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.legend-popup .legend-popup-content li .icon-container .icon {
  background-color: #e2fcfc;
}
.legend-popup .legend-popup-content li .icon-container .icon,
.legend-popup .legend-popup-content li .icon-container img {
  height: 1rem;
  width: 1rem;
}

select {
  -webkit-appearance: none;
  background-image: url("/img/icons/small-dropdown-icon.svg");
  background-repeat: no-repeat;
  background-position: center right;
  background-size: 1rem;
  cursor: pointer;
}

.input-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
}
.input-container.product-quantity-container {
  display: flex;
}
.input-container .title-row {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.input-container .title-row button {
  background-color: transparent;
}
.input-container .title-row button .icon {
  background-color: #a0b4b3;
}
.input-container .title-row button .icon:active {
  background-color: #000000;
}
.input-container .title-row .tooltip {
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
}
.input-container .title-row .tooltip .tooltiptext {
  right: unset;
  left: 0;
  max-width: 16.25rem;
}
.input-container label,
.input-container h2 {
  color: #a0b4b3;
  align-self: flex-start;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.input-container input,
.input-container select,
.input-container .tags,
.input-container .details-container,
.input-container .keywords,
.input-container .images-upload,
.input-container .uploaded-imgs-container {
  text-align: center;
  width: 100%;
  padding: 0 0 1rem;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.input-container input {
  text-align: left;
  padding: 0.5rem;
}
.input-container input:disabled {
  color: #a0b4b3;
  cursor: not-allowed;
}
.input-container input#product-price, .input-container input#product-quantity {
  text-align: center;
}
.input-container input#product-price::after, .input-container input#product-quantity::after {
  content: "Ft";
}
.input-container input[type=checkbox] {
  display: none;
}
.input-container select {
  -moz-appearance: none; /* Firefox */
  -webkit-appearance: none; /* Safari and Chrome */
  appearance: none;
  background-image: none;
  padding: 0;
  margin-bottom: 1rem;
  cursor: pointer;
}
.input-container input[type=text].bold,
.input-container textarea.bold {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.input-container textarea {
  width: 100%;
  padding: 0.5rem;
  resize: vertical;
  overflow-y: auto;
  scrollbar-color: #a0b4b3 transparent;
  scrollbar-width: thin;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.input-container textarea#product-excerpt {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.input-container textarea#product-description {
  min-height: 13rem;
}
.input-container .tags,
.input-container .details-container,
.input-container .keywords {
  padding: 1rem 0;
}
.input-container .tags {
  display: flex;
  flex-wrap: wrap;
}
.input-container .tags .tag label {
  padding: 0.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  color: #0e8d8d;
  border: 1px solid #d3e8e9;
  margin-right: -1px;
  margin-bottom: -1px;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  transition: background-color 0.3s;
}
.input-container .tags .tag .icon {
  background-color: #0e8d8d;
}
.input-container .tags .tag input {
  display: none;
}
.input-container .tags .tag:has(input:checked) label {
  background-color: #e2fcfc;
}
.input-container .details-container .table-row {
  border: 1px solid #d3e8e9;
  display: flex;
  align-items: center;
  border-bottom: 0;
  align-items: center;
}
.input-container .details-container .table-row:last-of-type {
  border-bottom: 1px solid #d3e8e9;
}
.input-container .details-container .table-row label,
.input-container .details-container .table-row input {
  text-align: left;
  display: block;
  width: 50%;
}
.input-container .details-container .table-row label {
  padding: 0.75rem;
  height: 100%;
  flex-grow: 1;
  align-self: center;
  color: #000000 !important;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.input-container .details-container .table-row input {
  border-left: 1px solid #d3e8e9;
  overflow: visible;
  padding: 0.75rem;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
  line-height: 1;
}
.input-container .keywords {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.input-container .keywords label {
  text-decoration: underline;
  text-underline-position: under;
  cursor: pointer;
  transition: color 0.3s;
  user-select: none;
  -webkit-user-select: none;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.input-container .keywords label input {
  display: none;
}
.input-container .keywords label:has(input:checked) {
  color: #0e8d8d;
}

.product-price-container {
  gap: 0.5rem;
}
.product-price-container-upper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.product-price-container .tooltip {
  align-self: flex-start;
}
.product-price-container .tooltip .tooltiptext {
  right: unset;
  left: 0;
}
.product-price-container .recommended-price {
  color: #a0b4b3;
  align-self: center;
  display: flex;
  gap: 0.5rem;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-price-container .recommended-price:first-child {
  color: #0e8d8d !important;
}
.product-price-container .recommended-price .character-badge {
  box-shadow: none !important;
  padding: 0.12rem 0.5rem !important;
}
.product-price-container .recommended-price .character-badge span {
  display: block;
  color: #e2fcfc;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

.number-input {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  padding: 0 1rem 1rem;
  text-decoration: none;
  max-width: 18.5rem;
}
@media (min-width: 1024px) {
  .number-input {
    justify-content: center;
    width: auto;
  }
}
.number-input .num-input-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.13rem;
}
@media (min-width: 1024px) {
  .number-input .num-input-container {
    width: 12.5rem;
  }
}
.number-input .num-input-container span {
  color: #a0b4b3;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.number-input input[type=number] {
  text-decoration: underline;
  padding: 0;
  width: 100%;
  color: #000000;
  text-decoration-color: #a0b4b3;
  -moz-appearance: textfield; /* Firefox */
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  line-height: 100%;
}
.number-input input[type=number]::-webkit-outer-spin-button, .number-input input[type=number]::-webkit-inner-spin-button {
  /* display: none; <- Crashes Chrome on hover */
  -webkit-appearance: none;
  margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
.number-input input[type=number]::placeholder {
  color: #a0b4b3;
}
.number-input .plus-btn,
.number-input .minus-btn {
  height: 3rem;
  min-width: 3rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background-color: #e2fcfc;
  cursor: pointer;
}
.number-input .plus-btn .icon,
.number-input .minus-btn .icon {
  background-color: #0e8d8d;
}

.switcher-box {
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 0.25rem;
}
.switcher-box label {
  margin: 0;
  align-self: unset;
}
.switcher-box .title-row {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 0.25rem;
}
.switcher-box .title-row > p {
  color: #a0b4b3;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

.images-upload {
  width: 100%;
  padding: 1rem 0 0;
}
.images-upload label {
  height: 16.5rem;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #d3e8e9;
  cursor: pointer;
}
.images-upload label input {
  display: none;
}
.images-upload label span {
  background-color: #000000;
  width: 9.625rem;
  text-align: center;
  padding: 1.5rem;
  color: #e2fcfc;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .images-upload {
    width: 100%;
  }
  .images-upload label {
    height: 16.5rem;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #d3e8e9;
    cursor: pointer;
  }
  .images-upload label input {
    display: none;
  }
  .images-upload label span {
    background-color: #000000;
    width: 9.625rem;
    text-align: center;
    padding: 1.5rem;
    color: #e2fcfc;
    font-family: "Cairo";
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
}

.uploaded-imgs-container {
  display: flex;
  flex-wrap: wrap;
  padding: 1rem 0;
}
@media (min-width: 1024px) {
  .uploaded-imgs-container {
    padding: 1rem !important;
  }
  .uploaded-imgs-container img:hover {
    opacity: 0.5;
  }
}
.uploaded-imgs-container.shake {
  animation: shake 0.3s;
}
.uploaded-imgs-container .image {
  width: 25%;
  transition: opacity 0.3s;
  cursor: pointer;
}
.uploaded-imgs-container .image input {
  display: none;
}
.uploaded-imgs-container .image .delete-btn {
  display: none;
}
.uploaded-imgs-container .image img {
  aspect-ratio: 1/1;
  object-fit: cover;
  transition: opacity 0.1s;
  height: 100%;
}
.uploaded-imgs-container .image.sortable-chosen img {
  opacity: 0.5;
}
.uploaded-imgs-container.advanced {
  display: flex;
  flex-direction: column;
}
.uploaded-imgs-container.advanced .image {
  display: flex;
  align-items: stretch;
  width: 100%;
  border: 1px solid #d3e8e9;
  border-bottom: 0;
}
.uploaded-imgs-container.advanced .image:last-of-type {
  border-bottom: 1px solid #d3e8e9;
}
.uploaded-imgs-container.advanced .image input {
  display: block;
  flex-grow: 1;
  border-right: 1px solid #d3e8e9;
  text-align: left;
  padding: 0.5rem;
  align-self: stretch;
  display: flex;
  align-items: center;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.uploaded-imgs-container.advanced .image .delete-btn {
  aspect-ratio: 1/1;
  display: block;
  width: 3rem;
  min-width: 3rem;
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.uploaded-imgs-container.advanced .image .delete-btn .icon {
  background-color: #a0b4b3;
}
.uploaded-imgs-container.advanced .image .img-container {
  border-right: 1px solid #d3e8e9;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.uploaded-imgs-container.advanced .image .img-container img {
  max-width: 3rem;
  width: 3rem;
  height: 3rem;
  object-fit: cover;
  aspect-ratio: 1/1;
}

.interested-conteiner {
  padding: 0.5rem;
}
@media (min-width: 1024px) {
  .interested-conteiner {
    padding: 1.25rem;
  }
}

.product-text {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.product-text .badges {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}
.product-text h2 {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.product-text p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.product-text table tr td {
  width: 50%;
  padding-bottom: 1rem;
  vertical-align: top;
}
.product-text table tr td:first-of-type {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  padding-right: 1rem;
}
.product-text table tr td:last-of-type {
  hyphens: auto;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
@media (min-width: 730px) {
  .product-text table tr td:last-of-type {
    hyphens: none;
  }
}
.product-text table tr:last-of-type td {
  padding-bottom: 0;
}
.product-text .keywords {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  gap: 0.5rem;
  color: #a0b4b3;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

@media (min-width: 1024px) {
  .shipping {
    border-left: 1px solid #d3e8e9;
    border-right: 1px solid #d3e8e9;
  }
}
.shipping .shipping-title.active {
  border-bottom: 1px solid #000000;
}
.shipping .shipping-title.active h3 {
  color: #000000;
  transition: color 0.3s;
}
.shipping .shipping-title.active .shipping-toggle .plus-icon {
  background-color: #000000;
  mask-image: url("/img/icons/search-delete.svg");
  -webkit-mask-image: url("/img/icons/search-delete.svg");
}
.shipping .shipping-options-container.active {
  max-height: 40rem;
}
.shipping .shipping-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
  cursor: pointer;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: border-color 0.3s;
}
@media (min-width: 1280px) {
  .shipping .shipping-title {
    padding: 2.5rem;
  }
  .shipping .shipping-title:hover {
    border-color: #000000;
  }
  .shipping .shipping-title:hover h3 {
    color: #000000;
  }
  .shipping .shipping-title:hover .shipping-toggle .icon {
    background-color: #000000;
  }
  .shipping .shipping-title:hover .shipping-options-container {
    border-color: #000000;
  }
}
.shipping .shipping-title h3 {
  color: #a0b4b3;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.shipping .shipping-title .shipping-toggle {
  background-color: transparent;
  cursor: pointer;
}
.shipping .shipping-title .shipping-toggle .plus-icon {
  background-color: #a0b4b3;
}
.shipping .shipping-options-container {
  position: static;
  max-height: 0;
  overflow: hidden;
  border-bottom: 1px solid #d3e8e9;
  transition: border-color 0.3s, max-height 0.3s;
}
.shipping .shipping-options-container.active {
  max-height: 40rem;
}
.shipping .shipping-options-container .single-prod-shipping-option {
  border-top: 1px solid #d3e8e9;
  border-bottom: 0;
}
@media (min-width: 1024px) {
  .shipping .shipping-options-container .single-prod-shipping-option {
    padding: 1.5rem;
  }
}
@media (min-width: 1280px) {
  .shipping .shipping-options-container .single-prod-shipping-option {
    padding: 2.5rem;
  }
}

.category-list {
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
}
@media (min-width: 1024px) {
  .category-list {
    border-bottom: 0;
  }
}
@media (min-width: 1280px) {
  .category-list {
    padding: 2.5rem;
  }
}
.category-list li {
  color: #a0b4b3;
  position: relative;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.category-list li a {
  display: block;
  padding: 0.5rem 0.75rem;
}
@media (min-width: 1280px) {
  .category-list li a:hover {
    color: #000000;
  }
  .category-list li a:hover::before {
    border-color: #000000;
  }
}
.category-list li::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid #d3e8e9;
  transform: skew(-15deg);
  z-index: -1;
}
.category-list li span {
  color: #0e8d8d;
}
.category-list li .highlighted {
  transition: color 0.3s;
  color: #000000;
}
@media (min-width: 1280px) {
  .category-list li .highlighted:hover {
    color: #e2fcfc;
  }
  .category-list li .highlighted:hover::before {
    background-color: #000000;
  }
}
.category-list li .highlighted::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid #d3e8e9;
  transform: skew(-15deg);
  z-index: -1;
  background-color: #d3e8e9;
  transition: background-color 0.3s, border-color 0.3s;
}

@media (min-width: 1280px) {
  .mainSwiper:has(.caption-container:hover) .swiper-pagination {
    color: #000000;
  }
  .mainSwiper:has(.swiper-pagination:hover) .caption-container figcaption {
    color: #000000 !important;
  }
}
.mainSwiper .cover-img {
  z-index: 10;
  pointer-events: none;
}
@media (min-width: 1024px) {
  .mainSwiper.caption-opened .swiper-slide-active .caption-container {
    padding: 1.25rem 1.25rem 0;
  }
}
.mainSwiper.caption-opened .swiper-slide-active .caption-container figcaption {
  color: #000000 !important;
  height: 100% !important;
  -webkit-line-clamp: unset;
}
.mainSwiper.caption-opened .swiper-pagination {
  color: #000000;
}
@media (min-width: 1024px) {
  .mainSwiper.caption-opened .swiper-pagination {
    padding-bottom: 1.25rem;
  }
}
@media (min-width: 1280px) {
  .mainSwiper.caption-opened .swiper-pagination {
    padding-bottom: 1.25rem;
  }
  .mainSwiper.caption-opened .swiper-pagination:hover {
    color: #000000;
  }
}
.mainSwiper .swiper-slide {
  overflow: visible;
  position: relative;
}
.mainSwiper .swiper-slide a {
  border-bottom: 1px solid #d3e8e9;
  display: block;
  position: relative;
}
.mainSwiper .swiper-slide img {
  aspect-ratio: 1/1;
  object-fit: contain;
  max-width: 400px;
  margin: auto;
}
@media (min-width: 1280px) {
  .mainSwiper .swiper-slide img {
    max-width: 100%;
  }
}
.mainSwiper .swiper-slide .caption-container {
  padding: 0.5rem 0.5rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  cursor: pointer;
}
@media (min-width: 1280px) {
  .mainSwiper .swiper-slide .caption-container {
    padding: 1.25rem 1.25rem 0;
  }
  .mainSwiper .swiper-slide .caption-container figcaption {
    max-width: 100%;
  }
  .mainSwiper .swiper-slide .caption-container:hover figcaption {
    color: #000000;
  }
  .mainSwiper .swiper-slide .caption-container:hover + .swiper-pagination {
    color: #000000;
  }
}
.mainSwiper .swiper-slide .caption-container figcaption {
  max-width: 400px;
  min-height: 2rem;
  color: #a0b4b3;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
  transition: color 0.3s;
}
@media (min-width: 1024px) {
  .mainSwiper .swiper-slide .caption-container figcaption {
    max-width: 100%;
  }
}

.swiper-pagination {
  position: static;
  display: block;
  padding-top: 0.25rem;
  padding-bottom: 0.5rem;
  color: #a0b4b3;
  cursor: pointer;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
  transition: color 0.3s;
}
@media (min-width: 1280px) {
  .swiper-pagination {
    padding-bottom: 1.25rem;
  }
}

@media (min-width: 1024px) {
  .editing-product {
    padding: 0 2.5rem;
  }
}
.editing-product > .title-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  height: 3.5rem;
}
@media (min-width: 1024px) {
  .editing-product > .title-row {
    height: auto;
    padding: 2.5rem 0;
  }
}
.editing-product > .title-row .back-btn {
  background-color: transparent;
  cursor: pointer;
}
@media (min-width: 1024px) {
  .editing-product > .title-row .back-btn {
    display: none;
  }
}
.editing-product > .title-row .back-btn .icon {
  transform: rotate(90deg);
}
.editing-product > .title-row h1 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .editing-product > .title-row h1 {
    font-family: "Cairo";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
}

.tabs {
  width: 100%;
  display: flex;
}
.tabs .tab-btn {
  width: 100%;
  padding: 0.75rem;
  background-color: transparent;
  border-top: 1px solid #d3e8e9;
  border-right: 1px solid #d3e8e9;
  cursor: pointer;
  transition: background-color 0.3s;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .tabs .tab-btn:last-of-type {
    border-right: 0;
  }
  .tabs .tab-btn:hover {
    background-color: #ffffff;
  }
}
.tabs .tab-btn:first-of-type {
  border-left: 1px solid #d3e8e9;
}
.tabs .tab-btn.opened {
  background-color: #ffffff;
}

.tab-content {
  background-color: #ffffff;
  border: 1px solid #d3e8e9;
}
@media (min-width: 1024px) {
  .tab-content {
    border-right: 0;
  }
  .tab-content .row button:hover .icon {
    background-color: #000000;
  }
  .tab-content .row .tag label:hover {
    background-color: #d3e8e9;
  }
  .tab-content .row .keywords label:has(input:checked) {
    color: #0e8d8d;
  }
  .tab-content .row .keywords label:hover {
    color: #d3e8e9;
  }
  .tab-content .tags,
  .tab-content .details-container,
  .tab-content .keywords {
    padding: 1.25rem;
  }
}
.tab-content .product-quantity-container {
  padding: 0;
  position: static;
  transition: border-color 0.3s;
}
.tab-content .product-quantity-container .title-row {
  padding: 1rem;
  position: static;
  cursor: pointer;
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s;
}
.tab-content .product-quantity-container .title-row label {
  cursor: pointer;
  transition: color 0.3s;
}
.tab-content .product-quantity-container .title-row .icon {
  cursor: pointer;
}
@media (min-width: 1280px) {
  .tab-content .product-quantity-container .title-row:hover {
    border-bottom-color: #000000;
  }
  .tab-content .product-quantity-container .title-row:hover label {
    color: #000000;
  }
  .tab-content .product-quantity-container .title-row:hover .icon {
    background-color: #000000;
  }
  .tab-content .product-quantity-container .title-row.active label {
    color: #000000;
  }
  .tab-content .product-quantity-container .title-row.active .icon {
    background-color: #000000;
  }
  .tab-content .product-quantity-container .title-row.active:hover {
    border-bottom-color: transparent;
  }
}
.tab-content .product-quantity-container .accordion-content {
  display: none;
  width: 100%;
  padding: 0 1.25rem 1.25rem;
}
.tab-content .product-quantity-container .accordion-content .number-input {
  padding: 0 1.25rem 1.25rem;
  width: 100%;
}
.tab-content .product-quantity-container.active .title-row .icon {
  mask-image: url("/img/icons/search-delete.svg");
  -webkit-mask-image: url("/img/icons/search-delete.svg");
}
.tab-content .product-quantity-container.active .accordion-content {
  display: flex;
  justify-content: center;
}
.tab-content .product-quantity-container.active .accordion-content .number-input {
  max-height: 4rem;
  padding: 0 1rem 1rem;
}

.product-card {
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
  overflow: visible;
  z-index: 100;
  transition: z-index 0.1s;
}
.product-card::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: -1px;
  bottom: -1px;
  border: 1px solid #d3e8e9;
  z-index: -1;
  transition: border 0.1s;
}
.product-card .title-container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  gap: 0.5rem;
}
.product-card .title-container h3 {
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: 2;
  max-width: 18.6875rem;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-card .state {
  display: none;
}
.product-card.own-product .state:has(.own-product) {
  display: flex;
}
.product-card.leading-quote .state:has(.leading-quote) {
  display: flex;
}
.product-card.quote-requested .state:has(.quote-requested) {
  display: flex;
}
.product-card.overbid .state:has(.overbid) {
  display: flex;
}

.product-footer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.product-footer .state-indicator-box {
  display: flex;
  gap: 0.25rem;
}
.product-footer .state-indicator-box span {
  gap: 0.25rem;
}
.product-footer .state-indicator-box .state {
  height: 0.75rem;
  width: 0.75rem;
  justify-content: center;
  align-items: center;
}
.product-footer .state-indicator-box .state > div {
  height: 0.75rem;
  width: 0.75rem;
  mask-size: 100%;
}
@media (min-width: 1024px) {
  .product-footer .state-indicator-box .state {
    height: 1rem;
    width: 1rem;
  }
  .product-footer .state-indicator-box .state > div {
    height: 1rem;
    width: 1rem;
  }
  .product-footer .state-indicator-box .tooltiptext {
    position: absolute;
    bottom: unset;
    top: 100%;
    left: 0;
    right: 0;
  }
}

.img-container {
  position: relative;
}
.img-container img {
  display: block;
  object-fit: cover;
  width: 100%;
}
.img-container .cover-img {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(171, 192, 192, 0.8);
}
.img-container .cover-img.not-allowed {
  display: flex;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 200;
}
.img-container .cover-img span {
  color: #e2fcfc;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.img-container .eye-container,
.img-container .price-container {
  position: absolute;
  background-color: #e2fcfc;
  padding: 0.25rem;
  z-index: 300;
}
.img-container .eye-container {
  display: none;
  top: -1px;
  left: -1px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 0.5rem) 100%, 0 100%, 0 0);
  padding-right: 0.75rem;
}
.img-container .eye-container .eye-icon {
  background-color: #000000;
  height: 1.5rem;
  width: 1.5rem;
}
.img-container .price-container {
  bottom: -1px;
  right: -1px;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0.5rem 0);
  padding-left: 0.75rem;
}
.img-container .price-container span {
  display: flex;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.seen .img-container .eye-container {
  display: block;
}

.gallery-bottom {
  display: flex;
  height: calc(4rem + 1px);
  border-top: 1px solid #d3e8e9;
}
.gallery-bottom .swiper-nav {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1.25rem;
  border-left: 1px solid #d3e8e9;
  height: 4rem;
}
.gallery-bottom .swiper-nav .prev-slide,
.gallery-bottom .swiper-nav .next-slide {
  padding: 0.25rem;
  cursor: pointer;
}
.gallery-bottom .swiper-nav .prev-slide .icon,
.gallery-bottom .swiper-nav .next-slide .icon {
  height: 1.5rem;
  width: 1.5rem;
}
.gallery-bottom .swiper-nav .prev-slide .icon {
  transform: rotate(-135deg);
}
.gallery-bottom .swiper-nav .next-slide .icon {
  transform: rotate(45deg);
}
.gallery-bottom .swiperThumbs {
  width: 100%;
  z-index: 0;
}
.gallery-bottom .swiperThumbs .swiper-slide {
  height: 72px;
  width: 72px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.gallery-bottom .swiperThumbs .swiper-slide img {
  opacity: 1;
  width: 100%;
  height: 100%;
  cursor: pointer;
  transition: opacity 0.3s;
}
.gallery-bottom .swiperThumbs .swiper-slide-thumb-active img {
  opacity: 0.5;
}
@media (min-width: 1280px) {
  .gallery-bottom .swiperThumbs .swiper-slide:hover img {
    opacity: 0.5;
  }
}

.title-container-top-row {
  display: flex;
  align-items: center;
  padding: 0 !important;
  justify-content: space-between;
}
.title-container-top-row button {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.66rem;
  aspect-ratio: 1/1;
  cursor: pointer;
}
.title-container-top-row button .icon {
  height: 1.5rem;
  width: 1.5rem;
  background-color: #a0b4b3;
}
@media (min-width: 1280px) {
  .title-container-top-row button:hover .icon {
    background-color: #000000;
  }
}
.title-container-top-row .save-icon {
  padding: 0.5rem;
}

.tag-list {
  display: flex;
  list-style-type: none;
  overflow: auto;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none;
  border: 1px solid #d3e8e9;
  border-bottom: 0;
  border-top: 0;
}
@media (min-width: 1024px) {
  .tag-list {
    border-top: 1px solid #d3e8e9;
  }
}
.tag-list li span {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.75rem 1.25rem;
  border-right: 1px solid #d3e8e9;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
@media (min-width: 1280px) {
  .tag-list li span {
    transition: border-color 0.3s;
    will-change: border-color;
    padding: 1rem 1.25rem;
  }
}
.tag-list li:last-of-type span {
  border-right: 0;
}
@media (min-width: 1280px) {
  .tag-list li button:hover {
    border-bottom-color: #000000;
  }
}

@media (min-width: 1280px) {
  .single-product-body .single-icon-box,
  .single-product-body .interested-conteiner,
  .single-product-body .product-text,
  .profile-content-body .single-icon-box,
  .profile-content-body .interested-conteiner,
  .profile-content-body .product-text {
    padding: 2.5rem;
  }
}
.single-product-body > div,
.single-product-body > a,
.profile-content-body > div,
.profile-content-body > a {
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
  border-top: 0;
}
@media (min-width: 1024px) {
  .single-product-body > div,
  .single-product-body > a,
  .profile-content-body > div,
  .profile-content-body > a {
    border-left: 1px solid #d3e8e9;
    border-right: 1px solid #d3e8e9;
  }
}
@media (min-width: 1280px) {
  .single-product-body > div,
  .single-product-body > a,
  .profile-content-body > div,
  .profile-content-body > a {
    padding: 2.5rem;
  }
}
.single-product-body .title-container,
.profile-content-body .title-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  border-top: 1px solid #d3e8e9;
  padding: 1.25rem;
}
@media (min-width: 1280px) {
  .single-product-body .title-container,
  .profile-content-body .title-container {
    padding: 2.5rem;
  }
}
.single-product-body .title-container .uploaded,
.profile-content-body .title-container .uploaded {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.single-product-body .title-container .title-upper-row,
.profile-content-body .title-container .title-upper-row {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.single-product-body .title-container .title-upper-row-header,
.profile-content-body .title-container .title-upper-row-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  gap: 0.5rem;
}
.single-product-body .title-container h1,
.profile-content-body .title-container h1 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .single-product-body .title-container h1,
  .profile-content-body .title-container h1 {
    font-family: "Cairo";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
}
.single-product-body .title-container .product-footer,
.profile-content-body .title-container .product-footer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
}
.single-product-body .title-container .product-footer:has(p) span,
.profile-content-body .title-container .product-footer:has(p) span {
  cursor: pointer;
}
.single-product-body .title-container .product-footer span,
.profile-content-body .title-container .product-footer span {
  color: #0e8d8d;
  user-select: none;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.single-product-body .title-container .product-footer p,
.profile-content-body .title-container .product-footer p {
  color: #0e8d8d;
  max-height: 0;
  position: static !important;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  overflow: hidden;
  display: block;
  transition: max-height 0.3s;
}
.single-product-body .title-container .product-footer p.active,
.profile-content-body .title-container .product-footer p.active {
  max-height: 20rem;
}
.single-product-body .profile-page-description,
.profile-content-body .profile-page-description {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.single-product-body .profile-page-description h4,
.profile-content-body .profile-page-description h4 {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.single-product-body .profile-page-description p,
.profile-content-body .profile-page-description p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.profile-content-header-inner {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  justify-content: center;
  align-items: center;
  padding: 3rem;
}
@media (min-width: 1024px) {
  .profile-content-header-inner {
    border-left: 1px solid #d3e8e9;
    border-top: 1px solid #d3e8e9;
  }
}
.profile-content-header-inner img {
  height: 6rem;
  width: 6rem;
  object-fit: cover;
}
.profile-content-header-inner .uploader-text {
  align-items: center;
}
.profile-content-header-inner .profile-url {
  color: #a0b4b3;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.profile-content-header-inner .profile-text-container {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.profile-content-header-inner .profile-text-container .user-name {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.profile-content-header-inner .profile-text-container .user-title {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}

.profile-nav {
  display: flex;
  border-bottom: 1px solid #d3e8e9;
}
.profile-nav ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  list-style-type: none;
  width: 100%;
}
.profile-nav ul li a {
  display: block;
  padding: 1.25rem;
  text-align: center;
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.profile-nav ul li a.active, .profile-nav ul li a:hover {
  border-bottom: 1px solid #000000;
}
@media (min-width: 730px) {
  .profile-nav {
    justify-content: center;
  }
  .profile-nav ul {
    width: auto;
  }
  .profile-nav ul li a {
    width: 9.5625rem;
  }
}

.profile-settings {
  margin: auto;
}
.profile-settings .profile-img-container {
  border-bottom: 1px solid #d3e8e9;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  background-color: #ffffff;
  border: 1px solid #d3e8e9;
  border-bottom: 0;
}
.profile-settings .profile-img-container label {
  display: flex;
  flex-direction: column;
  color: #a0b4b3;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  cursor: pointer;
}
.profile-settings .profile-img-container label img {
  width: 6rem;
  margin: auto;
}
.profile-settings .profile-img-container label input {
  display: none;
}
.profile-settings-container {
  background-color: #ffffff;
  border: 1px solid #d3e8e9;
}
.profile-settings-container .extra-info-container .info-box {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.profile-settings-container .extra-info-container .info-box .icon {
  min-width: 1rem;
}
.profile-settings-container .extra-info-container .info-box p {
  color: #a0b4b3;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

.upload-wrapper {
  border-bottom: 0;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.upload-wrapper .upload-info {
  position: absolute;
  top: 1.25rem;
  left: 1.25rem;
  right: unset !important;
  bottom: unset !important;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background-color: #0e8d8d;
  border-radius: 3em;
  box-shadow: 0 4px 4px 0 rgba(14, 141, 141, 0.25);
  color: #e2fcfc;
  z-index: 1;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.upload-wrapper .upload-info span {
  color: #0e8d8d;
  color: #e2fcfc;
  cursor: pointer;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.upload-wrapper .upload-info span .icon {
  height: 1rem;
  width: 1rem;
  background-color: #e2fcfc;
}
.upload-wrapper .max-upload-file {
  color: #a0b4b3;
  transition: color 0.3s;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.upload-area-wrapper {
  position: relative;
  width: 100%;
  flex-grow: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.products-container {
  padding: 1.25rem;
  width: 100%;
  height: 100%;
  min-height: calc(100svh - 15.5rem + 2px);
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 0;
  flex-grow: 1;
}
@media (min-width: 1024px) {
  .products-container {
    min-height: calc(100svh - 16.625rem);
  }
}
@media (min-width: 1280px) {
  .products-container {
    min-height: calc(100svh - 17.625rem);
  }
}
.products-container .upload-icon-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  gap: 1rem;
  flex-direction: column;
  align-items: center;
  z-index: 0;
  cursor: pointer;
  padding: 1.5rem;
}
@media (min-width: 1024px) {
  .products-container .upload-icon-container:hover .plus-icon {
    background-color: #0e8d8d;
  }
  .products-container .upload-icon-container:hover .max-upload-file {
    color: #0e8d8d;
  }
}
.products-container .upload-icon-container .plus-icon {
  background-color: #a0b4b3;
  height: 2.5rem;
  width: 2.5rem;
}
.products-container .currently-uploading {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  padding: 2.5rem 0;
}
.products-container .currently-uploading__item {
  max-width: 6.625rem;
}
.products-container .currently-uploading__item .img-container img {
  height: 6.625rem;
  width: 6.625rem;
  object-fit: cover;
}
.products-container .currently-uploading__item .progress-bar {
  width: 100%;
  background-color: #d3e8e9;
  height: 0.5rem;
}
.products-container .currently-uploading__item .progress-bar .progress {
  background-color: #a0b4b3;
  height: 100%;
}
.products-container .tooltip {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
}

.auto-switcher-container {
  position: absolute;
  right: 1.25rem;
  top: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.auto-upload-switcher {
  width: 4.5rem;
  height: 2.25rem;
  background-color: #d3e8e9;
  border-radius: 3em;
  cursor: pointer;
  position: relative;
}
.auto-upload-switcher.active .switch {
  background-color: #0e8d8d;
  left: 50%;
}
.auto-upload-switcher.active .switch:after {
  content: "A";
}
.auto-upload-switcher .switch {
  position: absolute;
  left: 0;
  height: 2.25rem;
  width: 2.25rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #a0b4b3;
  color: #ffffff;
  border-radius: 50%;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  transition: left 0.3s;
}
.auto-upload-switcher .switch:after {
  content: "M";
}

.toggle-extra-info-block {
  background-color: transparent;
  cursor: pointer;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
  color: #a0b4b3;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
@media (min-width: 1280px) {
  .toggle-extra-info-block.active:hover {
    border-bottom-color: #000000 !important;
  }
}
.toggle-extra-info-block .dropdown-icon {
  mask-image: url("/img/icons/dropdown-icon.svg");
  -webkit-mask-image: url("/img/icons/dropdown-icon.svg");
  width: 1.5rem;
  height: 1.5rem;
  background-color: #a0b4b3;
}
.toggle-extra-info-block.active {
  background-color: #ffffff;
}
.toggle-extra-info-block.active .dropdown-icon {
  mask-image: url("/img/icons/minus.svg");
  -webkit-mask-image: url("/img/icons/minus.svg");
}
.toggle-extra-info-block__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.toggle-extra-info-block .locked-icon {
  display: none;
}
.toggle-extra-info-block.locked {
  color: #ec173b;
  background-color: #ffffff;
  border-color: #fbc9c9;
}
.toggle-extra-info-block.locked .icon {
  display: block;
  background-color: #ec173b;
}

.upload-product-extra-info {
  background-color: #ffffff;
  padding: 0;
  display: none;
  flex-direction: row;
  flex-wrap: wrap;
  position: static;
}
.upload-product-extra-info.active {
  display: flex;
}
.upload-product-extra-info .half {
  display: flex;
  flex-direction: column;
  width: 100%;
}
@media (min-width: 1024px) {
  .upload-product-extra-info .half {
    width: 50%;
  }
}
.upload-product-extra-info .half:first-of-type {
  border-right: 1px solid #d3e8e9;
}
.upload-product-extra-info .row {
  width: 100%;
  flex-grow: 1;
  justify-content: flex-start;
}
.upload-product-extra-info .number-input {
  padding: 0 1rem;
}
.upload-product-extra-info .lock-settings {
  justify-content: center !important;
}
.upload-product-extra-info .lock-settings .switcher {
  width: 4.5rem;
  height: 2.25rem;
}
.upload-product-extra-info .lock-settings .switcher.active .switch .icon {
  mask-image: url("/img/icons/locked.svg");
  -webkit-mask-image: url("/img/icons/locked.svg"); /* Safari támogatás */
}
.upload-product-extra-info .lock-settings .switch {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2.25rem;
  width: 2.25rem;
  background-color: #0e8d8d;
}
.upload-product-extra-info .lock-settings .switch .icon {
  background-color: #ffffff;
}
.upload-product-extra-info textarea {
  height: 2.75rem;
}
.upload-product-extra-info .luna-info-input textarea {
  height: 100%;
}
.upload-product-extra-info.locked * {
  border-color: #fbc9c9 !important;
}
.upload-product-extra-info.locked .icon {
  background-color: #ec173b;
}
.upload-product-extra-info.locked .icon.info-icon {
  background-color: #b4a0a0;
}
.upload-product-extra-info.locked label {
  color: #b4a0a0;
}
.upload-product-extra-info.locked textarea,
.upload-product-extra-info.locked input {
  text-decoration-color: #b4a0a0;
}
.upload-product-extra-info.locked textarea::-moz-placeholder,
.upload-product-extra-info.locked input::-moz-placeholder {
  color: #b4a0a0;
}
.upload-product-extra-info.locked textarea::-webkit-input-placeholder,
.upload-product-extra-info.locked input::-webkit-input-placeholder {
  color: #b4a0a0;
}
.upload-product-extra-info.locked textarea::placeholder,
.upload-product-extra-info.locked input::placeholder {
  color: #b4a0a0;
}
.upload-product-extra-info.locked .number-input span {
  color: #b4a0a0;
}
.upload-product-extra-info.locked .number-input button {
  background-color: #fcecec;
}
.upload-product-extra-info.locked .switcher {
  background-color: #fbc9c9;
}
.upload-product-extra-info.locked .switcher .switch {
  background-color: #ec173b;
}

#drop-zone .dz-message {
  display: none;
}

#drop-zone {
  background: transparent;
  border: 0;
}

.dz-preview {
  position: relative;
  overflow: hidden;
  border-radius: 0;
  width: 9.625rem;
}

.dz-image {
  position: relative;
}

.dz-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* overlay */
.dz-progress {
  margin: 0;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
}

/* ez fog "eltűnni" */
.dz-upload {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(226, 252, 252, 0.7);
}

.dz-preview .dz-upload {
  height: 100%;
  display: block;
  border-radius: 0;
  transition: width 0.2s ease;
}

.dz-preview .dz-image {
  border-radius: 0 !important;
}

.dz-size,
.dz-filename,
.dz-success-mark,
.dz-error-mark {
  display: none;
}

.dz-error-message {
  padding: 0.5rem;
  margin-top: 0.5rem;
}
.dz-error-message span {
  display: block;
  text-align: center;
  color: #ec173b;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #ffffff;
}
.cookie-banner__text {
  text-align: center;
  min-height: 3.8125rem;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 1.25rem;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.cookie-banner__text a {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

header {
  border-bottom: 1px solid #d3e8e9;
  border-top: 1px solid #d3e8e9;
  display: flex;
}
header nav {
  display: flex;
  width: 100%;
  max-width: 2000px;
  margin: auto;
}
@media (min-width: 1024px) {
  header nav {
    width: 50%;
    justify-content: space-between;
    border-top: 0;
  }
}
header nav .logo-container {
  flex-grow: 1;
  text-align: left;
  display: flex;
  border: 0;
  grid-column: 1/auto;
  margin-bottom: -1px;
}
@media (min-width: 1024px) {
  header nav .logo-container {
    width: 100%;
  }
}
header nav .logo-container .logo {
  padding: 0.75rem 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.13rem;
  aspect-ratio: unset;
  width: unset;
  border: 0;
  height: 100%;
}
@media (min-width: 1024px) {
  header nav .logo-container .logo {
    padding: 3.56rem 1.25rem;
  }
}
@media (min-width: 1280px) {
  header nav .logo-container .logo {
    padding: 3.46rem 2.5rem;
  }
}
header nav .logo-container .logo img {
  min-width: 1.5rem;
  max-width: 100%;
}
@media (min-width: 1280px) {
  header nav .logo-container .logo img {
    height: 2.25rem;
  }
}
header .header-link {
  display: flex;
  color: #000000;
  width: 3.5rem;
  height: 3.5rem;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  border-left: 1px solid #d3e8e9;
  margin-bottom: -1px;
  position: relative;
}
@media (min-width: 1024px) {
  header .header-link {
    width: 100%;
    max-width: 8.625rem;
    min-height: 8.625rem;
    justify-self: end;
    border-bottom: 1px solid transparent;
  }
  header .header-link.favourite, header .header-link.my-products {
    position: relative;
    z-index: 80;
  }
}
@media (min-width: 1280px) {
  header .header-link {
    min-height: 9.625rem;
    max-width: 9.625rem;
    margin-bottom: -1px;
    transition: border-color 0.1s;
  }
  header .header-link:hover {
    border-bottom: 1px solid #000000;
  }
  header .header-link .bg {
    background-color: #000000;
  }
}
header .header-link .icon {
  height: 1.5rem;
  width: 1.5rem;
}
header .header-link.active, header .header-link.current-page {
  border-bottom: 1px solid #000000;
  color: #ffffff;
}
header .header-link.active .bg, header .header-link.current-page .bg {
  top: 0;
}
header .header-link.active .icon, header .header-link.current-page .icon {
  background-color: #ffffff;
}
header .header-link .index {
  display: none;
}
@media (min-width: 1024px) {
  header .header-link .index {
    display: block;
    position: absolute;
    left: 1.25rem;
    bottom: 1.25rem;
    font-variant-numeric: slashed-zero;
    font-feature-settings: "liga" off;
    font-family: "Azeret Mono";
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
  }
}
header .header-link .bg {
  position: absolute;
  top: 100%;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #000000;
  z-index: -1;
  transition: top 0.3s;
}
header .search {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3.5rem;
  border-left: 1px solid #d3e8e9;
}
@media (min-width: 1024px) {
  header .search {
    width: 50%;
    gap: 0.5rem;
  }
}
@media (min-width: 1280px) {
  header .search {
    flex-grow: 0;
  }
}
header .search span {
  display: none;
}
@media (min-width: 1024px) {
  header .search span {
    display: block;
    background-color: transparent;
    color: #a0b4b3;
    font-family: "Cairo";
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
}
header .search .icon {
  height: 1.5rem;
  width: 1.5rem;
}

.profile-img-logged-in {
  display: block;
  height: 2.25rem;
  width: 2.25rem;
}
.profile-img-logged-in img {
  width: 100%;
  height: 100%;
}

footer {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  padding: 2.5rem 1.25rem;
  max-width: calc(2000px + 5rem);
  margin: auto;
}
@media (min-width: 1280px) {
  footer {
    padding: 2.5rem;
  }
  footer a:hover {
    text-decoration-color: #000000;
  }
}
@media (min-width: 1024px) {
  footer .footer-top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 0 1.25rem;
  }
  footer .footer-top .links {
    border-top: 1px solid #d3e8e9;
  }
}
footer .footer-top ul {
  list-style-type: none;
  display: flex;
  padding: 1.25rem 0;
  border-bottom: 1px solid #d3e8e9;
  gap: 1.25rem;
}
@media (min-width: 1024px) {
  footer .footer-top ul {
    padding: 2.5rem 0;
  }
}
footer .footer-top ul li a {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
@media (min-width: 1024px) {
  footer .footer-top-main-nav {
    grid-column: 1/2;
    grid-row: 1/3;
    display: flex;
  }
}
footer .footer-top-main-nav ul {
  flex-direction: column;
  gap: 1.25rem;
}
@media (min-width: 1024px) {
  footer .footer-top-main-nav ul {
    flex-grow: 1;
  }
}
footer .footer-top-main-nav ul li a {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  footer .footer-bottom {
    display: flex;
    flex-direction: row;
    gap: 2.5rem;
  }
}
footer .footer-bottom .footer-logo {
  display: flex;
  align-items: center;
  gap: 0.12rem;
  padding-bottom: 1.25rem;
}
@media (min-width: 1024px) {
  footer .footer-bottom .footer-logo {
    padding-bottom: 0;
  }
}
footer .footer-bottom .footer-logo img {
  height: 1.875rem;
  width: 1.875rem;
}
footer .footer-bottom .footer-logo span {
  color: #a0b4b3;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
footer .footer-bottom-text {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
footer .footer-bottom-text p {
  color: #a0b4b3;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
@media (min-width: 1280px) {
  footer .footer-bottom-text p a:hover {
    text-decoration-color: #a0b4b3;
  }
}

@media (min-width: 1024px) {
  .single-product,
  .profile-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    max-width: 76.625rem;
    margin: auto;
    padding: 0 1.25rem;
  }
  .single-product-text,
  .profile-content-text {
    padding-top: 1.25rem;
  }
}
.single-product-header,
.profile-content-header {
  min-width: 0;
}
@media (min-width: 1024px) {
  .single-product-header,
  .profile-content-header {
    grid-column: 1/2;
    width: 100%;
    grid-row: 1/3;
    padding: 1.25rem 0;
  }
}
.single-product-header-inner,
.profile-content-header-inner {
  border-bottom: 1px solid #d3e8e9;
}
@media (min-width: 1024px) {
  .single-product-header-inner,
  .profile-content-header-inner {
    border-left: 1px solid #d3e8e9;
  }
}
.single-product-header-inner .profile-img-logged-in,
.profile-content-header-inner .profile-img-logged-in {
  height: 6rem;
  width: 6rem;
}
.single-product-header-inner .profile-img-logged-in span,
.profile-content-header-inner .profile-img-logged-in span {
  font-size: 2.66669rem;
}

.product-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: calc(100% - 1px);
  border-bottom: 0;
}
@media (min-width: 730px) {
  .product-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1280px) {
  .product-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1024px) {
  .product-card {
    padding: 1.25rem;
  }
}
@media (min-width: 1280px) {
  .product-card:nth-of-type(5), .product-card:nth-of-type(6) {
    display: flex;
  }
  .product-card:hover {
    z-index: 300;
  }
  .product-card:hover::after {
    border: 1px solid #000000;
  }
}

.archive {
  padding: 0;
}
@media (min-width: 1280px) {
  .archive {
    padding: 0 2.5rem;
  }
}

.archive-hero {
  display: flex;
  flex-direction: column;
  gap: 0.25em;
  padding: 2.5rem 0;
  text-align: center;
  color: #a0b4b3;
  z-index: 1;
}
.archive-hero h1 {
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.archive-hero h2 {
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 730px) {
  .archive-hero {
    padding: 5rem 0;
    gap: 0.75rem;
  }
  .archive-hero h2 {
    font-size: 60px;
    line-height: 110%;
  }
}

.listing-title-row {
  padding: 2.5rem 1.25rem;
}
@media (min-width: 1024px) {
  .listing-title-row {
    padding: 2.5rem 1.25rem;
  }
}

.title {
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.archive-search {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 0.5rem;
  border-bottom: 1px solid #d3e8e9;
  padding: 1.25rem;
}
@media (min-width: 730px) {
  .archive-search {
    flex-direction: row;
  }
}
.archive-search .search-icon {
  background-color: #a0b4b3;
  height: 1.5rem;
  width: 1.5rem;
  mask-image: url("/img/icons/search.svg");
  -webkit-mask-image: url("/img/icons/search.svg"); /* Safari támogatás */
  margin-right: 0.5rem;
}
.archive-search input {
  flex-grow: 1;
  background-color: transparent;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  line-height: 1;
}
.archive-search input::placeholder {
  color: #a0b4b3;
}

.my-products-filter-container {
  border-bottom: 1px solid #d3e8e9;
}
.my-products-filter-container ul {
  list-style-type: none;
  display: flex;
  overflow-x: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.my-products-filter-container ul::-webkit-scrollbar {
  display: none;
}
.my-products-filter-container ul li a {
  display: block;
  padding: 1.25rem;
  color: #a0b4b3;
  border-bottom: 1px solid transparent;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  transition: color 0.3s, border-color 0.3s;
}
.my-products-filter-container ul li a.active {
  color: #000000;
  border-color: #000000;
}
@media (min-width: 1280px) {
  .my-products-filter-container ul li a:hover {
    color: #000000;
    border-color: #000000;
  }
}

.post-count {
  padding: 1.25rem;
  color: #a0b4b3;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .post-count {
    padding: 1.25rem 0;
  }
}

.state .eye-icon {
  height: 1rem !important;
  width: 1rem !important;
}

.empty-container {
  display: flex;
  height: 23.4375rem;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid #d3e8e9;
}
.empty-container .icon {
  background-color: #a0b4b3;
  height: 1.5rem;
  width: 1.5rem;
}

.tag-header {
  display: flex;
  flex-direction: column;
  padding: 1.25rem;
  overflow: hidden;
  border-bottom: 1px solid #d3e8e9;
  cursor: pointer;
  transition: border-color 0.3s;
}
@media (min-width: 1280px) {
  .tag-header:hover {
    border-color: #000000;
  }
}
.tag-header-title {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
@media (min-width: 730px) {
  .tag-header-title {
    flex-direction: row;
  }
}
.tag-header-title h1 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.tag-header .icon {
  background-color: #a0b4b3;
}
.tag-header-text {
  max-height: 0;
  transition: max-height 0.3s;
}
@media (min-width: 730px) {
  .tag-header-text {
    margin-left: 50%;
  }
}
.tag-header-text p {
  padding: 1.75rem 0 1.25rem;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.tag-header-text p span {
  color: #0e8d8d;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.tag-header.active {
  border-color: #000000;
}
.tag-header.active .tag-header-text {
  max-height: 15rem;
}
.tag-header.active .dropdown-icon {
  mask-image: url(/img/icons/search-delete.svg);
  -webkit-mask-image: url(/img/icons/search-delete.svg);
}

.half {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.half h1 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.keyword-caroussel-header {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #d3e8e9;
  margin-bottom: -1px;
}
@media (min-width: 1280px) {
  .keyword-caroussel-header {
    border-right: 1px solid #d3e8e9;
    border-left: 1px solid #d3e8e9;
  }
}

.keyword-caroussel-desc {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1.25rem;
  min-width: 0;
}
.keyword-caroussel-desc .icon {
  height: 1.5rem;
  width: 1.5rem;
  background-color: #a0b4b3;
}
.keyword-caroussel-desc .keyword {
  flex: 1;
  min-width: 0;
  max-width: 100%;
  color: #0e8d8d;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.keyword-caroussel-desc .uploaded-count span {
  display: none;
}
@media (min-width: 730px) {
  .keyword-caroussel-desc .uploaded-count span {
    display: inline-block;
  }
}
.keyword-caroussel-desc .uploaded-count span.count {
  display: inline-block;
}

.keyword-caroussel-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.25rem;
  gap: 1rem;
  border-left: 1px solid #d3e8e9;
}
.keyword-caroussel-nav .prev .icon {
  transform: rotate(-135deg);
}
.keyword-caroussel-nav .next .icon {
  transform: rotate(45deg);
}
.keyword-caroussel-nav button {
  height: 1.5rem;
  width: 1.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.keyword-caroussel-nav button:disabled .icon {
  background-color: #a0b4b3;
}

.keyword-caroussel-products {
  border-bottom: 1px solid #d3e8e9;
  border-bottom: 0;
  padding-right: 1px !important;
}
.keyword-caroussel-products .product-card {
  display: flex;
}
.keyword-caroussel-products .product-card::after {
  bottom: 0;
}
@media (min-width: 1280px) {
  .keyword-caroussel-products .product-card:hover::after {
    border-left-color: #000000;
    border-right-color: #000000;
  }
}

@keyframes shake {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-4px);
  }
  75% {
    transform: translateX(4px);
  }
}
@media (min-width: 1280px) {
  .single-product-text {
    display: block;
  }
}

#delete-zone {
  border: 1px solid #d3e8e9;
  width: 100%;
  display: flex;
  opacity: 0;
  height: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  transition: border-color 0.3s, opacity 0.3s, height 0.3s, padding 0.3s;
}
@media (min-width: 1024px) {
  #delete-zone.visible {
    height: 7.1875rem;
    display: flex;
    opacity: 1;
  }
  #delete-zone.over {
    border-color: red;
  }
  #delete-zone.over .icon {
    background-color: red;
  }
}
#delete-zone .icon {
  height: 1.5rem;
  width: 1.5rem;
  background-color: #a0b4b3;
}
#delete-zone.visible {
  padding: 1.25rem;
  opacity: 1;
  height: 4rem;
}
#delete-zone.over {
  border-color: red;
}
#delete-zone.over .icon {
  background-color: red;
}

.contact-popup .uploader-info {
  border: 1px solid #d3e8e9;
}

.single-product {
  padding: 0;
}

.single {
  padding: 0;
}
@media (min-width: 1024px) {
  .single {
    padding: 0 1.25rem;
  }
}
@media (min-width: 1280px) {
  .single {
    padding-bottom: 2.5rem;
  }
}
.single .edit-product-btn {
  width: 100%;
  background-color: transparent;
  padding: 1.25rem;
  text-decoration: underline;
  border-bottom: 1px solid #d3e8e9;
  border-top: 0;
  cursor: pointer;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.single .recommended-products {
  padding-bottom: 1.25rem;
}
@media (min-width: 1280px) {
  .single .recommended-products {
    padding-bottom: 2.5rem;
  }
}
.single .recommended-products .title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem;
}
.single .recommended-products .title-row h2 {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1280px) {
  .single .recommended-products .title-row h2 {
    font-family: "Cairo";
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
}
.single .recommended-products .title-row .show-all {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #a0b4b3;
  gap: 0.5rem;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.single .recommended-products .title-row .show-all .icon {
  display: block;
  background-color: #a0b4b3;
  height: 1rem;
  width: 1rem;
}

.pswp__img {
  cursor: pointer !important;
}

.single-page h1 {
  padding: 1.25rem 0;
}
@media (min-width: 1280px) {
  .single-page h1 {
    padding: 2.5rem 0;
  }
}

.single-page-content {
  max-width: 57.5rem;
}
.single-page-content h2 {
  padding: 1.25rem 0;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.single-page-content h2:first-of-type {
  padding-top: 0;
}
.single-page-content h3 {
  padding-top: 1.25rem;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.single-page-content p,
.single-page-content ul {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.single-page-content ul {
  list-style-type: square;
  list-style-position: inside;
}

.product-upload-page {
  padding: 0;
}
.product-upload-page .product-upload-container {
  margin: auto;
  position: relative;
  display: flex;
  flex-direction: column;
}
.product-upload-page .product-upload-container .submit-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  align-items: center;
}
@media (min-width: 1024px) {
  .product-upload-page .product-upload-container .submit-container {
    bottom: 1.25rem;
    left: 1.25rem;
    right: 1.25rem;
  }
}
@media (min-width: 1024px) {
  .product-upload-page .product-upload-container .submit-container {
    left: 50%;
    right: unset;
    transform: translateX(-50%);
    max-width: 57.5rem;
    width: 100%;
  }
}
.product-upload-page .product-upload-container .submit-container .auto-upload-info {
  display: flex;
  visibility: hidden;
  flex-direction: column;
  gap: 0.25rem;
  align-items: center;
  opacity: 0;
  transition: opacity 0.3s;
}
.product-upload-page .product-upload-container .submit-container .auto-upload-info span {
  color: #a0b4b3;
  text-align: center;
  padding: 0 0.75rem;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .auto-upload .auto-upload-info {
  visibility: visible !important;
  opacity: 1 !important;
}
.product-upload-page .upload-page-row {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 1024px) {
  .product-upload-page .upload-page-row {
    flex-direction: row;
    flex-wrap: nowrap;
    border-bottom: 1px solid #d3e8e9;
  }
}
.product-upload-page .upload-page-row .left,
.product-upload-page .upload-page-row .right {
  display: flex;
  justify-content: center;
  border-bottom: 1px solid #d3e8e9;
  width: 100%;
  flex-grow: 1;
}
@media (min-width: 1024px) {
  .product-upload-page .upload-page-row .left,
  .product-upload-page .upload-page-row .right {
    flex-grow: unset;
    width: unset;
    justify-content: unset;
    padding: 0 1.25rem;
    border-bottom: 0;
  }
}
.product-upload-page .upload-page-row .left {
  display: flex;
  padding: 1.25rem 0;
  gap: 1.25rem;
}
@media (min-width: 1024px) {
  .product-upload-page .upload-page-row .left {
    padding: 1.25rem;
  }
}
.product-upload-page .upload-page-row .right * {
  color: #a0b4b3;
}
.product-upload-page .upload-page-row .upload-place {
  gap: 0;
}
.product-upload-page .upload-page-row .upload-place label {
  padding: 1.25rem;
  cursor: pointer;
  border-bottom: 1px solid transparent;
  transition: color 0.1s, border-color 0.1s;
}
.product-upload-page .upload-page-row .upload-place input {
  display: none;
}
.product-upload-page .upload-page-row .upload-place input:checked + label,
.product-upload-page .upload-page-row .upload-place label:hover {
  color: #000000;
  border-color: #000000;
}
.product-upload-page .upload-page-row-element {
  display: flex;
  gap: 0.25rem;
  align-items: center;
  color: #0e8d8d;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .upload-page-row-element .elem-title {
  display: none;
}
@media (min-width: 730px) {
  .product-upload-page .upload-page-row-element .elem-title {
    display: block;
  }
}
.product-upload-page .upload-page-row-element .icon {
  background-color: #0e8d8d;
}
.product-upload-page .upload-page-row-element .elem-data {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.product-upload-page .uploaded-products {
  padding: 1.25rem;
  max-width: 57.5rem;
  margin: auto;
}
@media (min-width: 1024px) {
  .product-upload-page .uploaded-products {
    padding: 1.25rem 0;
  }
}
.product-upload-page .uploaded-products .uploaded-product {
  display: flex;
  gap: 1.25rem;
}
.product-upload-page .uploaded-products .uploaded-product img {
  width: 33.33%;
  height: auto;
}
.product-upload-page .uploaded-products .uploaded-product-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.25rem;
}
.product-upload-page .uploaded-products .uploaded-product-text h3 {
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: 2;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .product-upload-page .uploaded-products .uploaded-product-text h3 {
    font-family: "Cairo";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
}
.product-upload-page .uploaded-products .uploaded-product-text p {
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: 2;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
@media (min-width: 1024px) {
  .product-upload-page .uploaded-products .uploaded-product-text p {
    font-family: "Cairo";
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
}

.profile-page {
  padding: 0;
}
@media (min-width: 1024px) {
  .profile-page .profile-content {
    padding: 0 1.25rem;
  }
  .profile-page .profile-img-container,
  .profile-page .profile-settings-container {
    margin-right: -1px;
  }
}
@media (min-width: 1280px) {
  .profile-page .profile-settings {
    max-width: 57.125rem;
  }
  .profile-page .profile-content {
    padding: 0 2.5rem;
  }
}
.profile-page h1 {
  padding: 2.5rem 1.25rem;
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
@media (min-width: 1280px) {
  .profile-page h1 {
    padding: 2.5rem;
  }
}
.profile-page .btn-container {
  padding: 0 1.25rem;
  display: flex;
  gap: 1.25rem;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  min-height: calc(100svh - 40.625rem);
}
.profile-page .btn-container h2 {
  text-align: center;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.profile-page .btn-container h2 a {
  color: #0e8d8d;
}
.profile-page .btn-container p {
  text-align: center;
  color: #a0b4b3;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.landing-page {
  padding: 0;
}
.landing-page h1 {
  font-size: 3.75rem;
  font-style: normal;
  font-weight: 500;
  line-height: 110%;
}
.landing-page h2 {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
@media (min-width: 1024px) {
  .landing-page h2 {
    padding-top: 0;
  }
}
.landing-page p {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.landing-page section {
  max-width: 100%;
}
.landing-page section .center-box {
  padding: 0 1.25rem;
}
@media (min-width: 1024px) {
  .landing-page section .center-box {
    max-width: 2000px;
    margin: auto;
    width: 100%;
  }
}
@media (min-width: 1280px) {
  .landing-page section .center-box {
    padding: 0 2.5rem;
  }
}
.landing-page .hero .center-box {
  padding: 0;
}
@media (min-width: 1024px) {
  .landing-page .hero .center-box {
    max-width: unset;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
.landing-page .hero .hero-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 2.5rem 0 2.5rem 1.25rem;
  gap: 2.5rem;
}
@media (min-width: 730px) {
  .landing-page .hero .hero-text {
    width: 100%;
    max-width: 1000px;
    justify-self: end;
    gap: 1.25rem;
    justify-content: space-between;
  }
}
.landing-page .hero .text-container {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  max-width: 22.625rem;
}
@media (min-width: 730px) {
  .landing-page .hero .text-container {
    padding-right: 1.25rem;
  }
}
.landing-page .hero a {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  border: 1px solid #d3e8e9;
  padding: 1.5rem 2.5rem;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.landing-page .hero a .icon {
  height: 1rem;
  width: 1rem;
  transform: rotate(-90deg);
}
.landing-page .hero .hero-imgs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(5, 1fr);
  width: 100%;
}
@media (min-width: 1280px) {
  .landing-page .hero .hero-imgs {
    grid-template-rows: repeat(3, 1fr);
  }
}
.landing-page .hero .hero-imgs img,
.landing-page .hero .hero-imgs div {
  width: 100%;
}
.landing-page .hero .hero-imgs img {
  height: 100%;
  object-fit: cover;
}
.landing-page .hero .hero-imgs img:nth-of-type(1) {
  grid-column: 1/2;
}
.landing-page .hero .hero-imgs img:nth-of-type(2) {
  grid-column: 4/5;
}
.landing-page .hero .hero-imgs img:nth-of-type(3) {
  grid-column: 3/4;
  grid-row: 2/3;
}
.landing-page .hero .hero-imgs img:nth-of-type(4) {
  grid-column: 2/3;
  grid-row: 4/5;
}
@media (min-width: 1280px) {
  .landing-page .hero .hero-imgs img:nth-of-type(4):nth-of-type(4) {
    display: none;
  }
}
.landing-page .hero .hero-imgs .empty {
  background-color: #ffffff;
}
.landing-page .hero .hero-imgs .empty:nth-of-type(1) {
  grid-column: 2/3;
}
.landing-page .hero .hero-imgs .empty:nth-of-type(2) {
  grid-column: 1/2;
  grid-row: 3/4;
}
.landing-page .hero .hero-imgs .empty:nth-of-type(3) {
  grid-column: 4/5;
  grid-row: 3/4;
}
.landing-page .hero .hero-imgs .empty:nth-of-type(4) {
  grid-column: 1/2;
  grid-row: 5/6;
}
@media (min-width: 1280px) {
  .landing-page .hero .hero-imgs .empty:nth-of-type(4) {
    display: none;
  }
}
.landing-page .hero .hero-imgs .empty:nth-of-type(5) {
  grid-column: 3/5;
  grid-row: 5/6;
}
@media (min-width: 1280px) {
  .landing-page .hero .hero-imgs .empty:nth-of-type(5) {
    display: none;
  }
}
.landing-page .feedback {
  background-color: #ffffff;
  padding: 5rem 0;
}
.landing-page .feedback .center-box {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
@media (min-width: 730px) {
  .landing-page .feedback .center-box {
    display: grid;
    grid-template-columns: 3fr 5fr;
    gap: 0;
  }
}
.landing-page .feedback-text {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  max-width: 43.0625rem;
}
@media (min-width: 730px) {
  .landing-page .feedback .feedback-text {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
.landing-page .feedback .feedback-text blockquote {
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 110%;
}
.landing-page .feedback .user {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
.landing-page .feedback .user img {
  width: 3rem;
  height: 3rem;
}
.landing-page .feedback .user-desc {
  display: flex;
  flex-direction: column;
}
.landing-page .feedback .user-desc span {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.landing-page .feedback .process {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  padding: 2.5rem 0;
}
@media (min-width: 730px) {
  .landing-page .feedback .process {
    flex-direction: row;
    gap: 0;
    grid-column: 1/3;
  }
}
@media (min-width: 730px) {
  .landing-page .feedback .process-item {
    width: 50%;
  }
  .landing-page .feedback .process-item:last-of-type .process-img {
    border-left: 0;
  }
}
.landing-page .feedback .process-item .process-img {
  border: 1px solid #d3e8e9;
  aspect-ratio: 4/3;
  margin-bottom: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.landing-page .feedback .process-item .process-img img {
  aspect-ratio: 1/1;
  max-width: 40%;
  width: 12.5rem;
}
@media (min-width: 730px) {
  .landing-page .feedback .process-item .process-img img {
    width: 15rem;
  }
}
@media (min-width: 1280px) {
  .landing-page .feedback .process-item .process-img img {
    width: 21.875rem;
  }
}
@media (min-width: 730px) {
  .landing-page .feedback .process-item .process-text {
    padding-right: 1.25rem;
  }
}
.landing-page .feedback .process-item .process-text .title-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.landing-page .feedback .process-item .process-text .title-row span {
  background-color: #000000;
  width: 1.625rem;
  height: 1.625rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #e2fcfc;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.landing-page .feedback .process-item .process-text .title-row h3 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.landing-page .feedback .process-item .process-text p {
  padding-top: 1.25rem;
  max-width: 22.625rem;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.landing-page .safety {
  background-color: #000000;
  color: #e2fcfc;
  padding: 5rem 0 0;
}
.landing-page .safety .center-box {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
@media (min-width: 730px) {
  .landing-page .safety .center-box {
    display: grid;
    grid-template-columns: 3fr 5fr;
    gap: 0;
  }
}
.landing-page .safety .safety-content {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
@media (min-width: 730px) {
  .landing-page .safety .safety-content {
    gap: 5rem;
  }
  .landing-page .safety .safety-content p {
    max-width: 22.625rem;
  }
}
.landing-page .safety .safety-content h3 {
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 110%;
  padding-bottom: 2.5rem;
}
.landing-page .safety .safety-content h3 strong {
  color: #ffffff;
}
.landing-page .safety .safety-content .grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding-bottom: 2.5rem;
}
@media (min-width: 730px) {
  .landing-page .safety .safety-content .grid {
    display: flex;
    width: auto;
  }
}
.landing-page .safety .safety-content .grid-item {
  aspect-ratio: 1/1;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 0.75rem;
  border: 1px solid #d3e8e9;
}
@media (min-width: 730px) {
  .landing-page .safety .safety-content .grid-item {
    width: 33%;
    max-width: 10.9375rem;
  }
}
.landing-page .safety .safety-content .grid-item .icon {
  background-color: #e2fcfc;
  height: 1.5rem;
  width: 1.5rem;
}
.landing-page .safety .safety-content .grid-item:nth-of-type(2) {
  border-left: 0;
}
.landing-page .safety .safety-content .grid-item:nth-of-type(3) {
  border-top: 0;
}
@media (min-width: 730px) {
  .landing-page .safety .safety-content .grid-item:nth-of-type(3) {
    border-left: 0;
    border-top: 1px solid #d3e8e9;
  }
}
.landing-page .safety .mockup-img {
  margin-top: 5rem;
  width: 87.5%;
}
@media (min-width: 730px) {
  .landing-page .safety .mockup-img {
    justify-self: center;
    width: 50%;
    grid-column: 1/3;
  }
}

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

.available-pages-link:hover {
  text-decoration: underline;
}

.name-letters {
  background-color: #ffffff;
  height: 100%;
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.name-letters span {
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

/*# sourceMappingURL=style_new.css.map */