@charset "UTF-8";
header {
  width: 100%;
  border-bottom: 1px solid #d3e8e9;
}
header nav {
  display: flex;
  width: 100%;
  max-width: 2000px;
  margin: auto;
}
header nav a {
  display: flex;
  color: #000000;
  width: 3.5rem;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  padding: 1rem;
  border-left: 1px solid #d3e8e9;
  margin-bottom: -1px;
  position: relative;
}
header nav a .icon {
  height: 1.5rem;
  width: 1.5rem;
}
header nav a .icon.star-icon {
  mask-image: url("/img/icons/star.svg");
  -webkit-mask-image: url("/img/icons/star.svg"); /* Safari támogatás */
}
header nav a .icon.my_products-icon {
  mask-image: url("/img/icons/my_products.svg");
  -webkit-mask-image: url("/img/icons/my_products.svg"); /* Safari támogatás */
}
header nav a .icon.profile-icon {
  mask-image: url("/img/icons/profile.svg");
  -webkit-mask-image: url("/img/icons/profile.svg"); /* Safari támogatás */
}
header nav a .icon.search-icon {
  mask-image: url("/img/icons/search.svg");
  -webkit-mask-image: url("/img/icons/search.svg"); /* Safari támogatás */
}
header nav a.profile .profile-img-logged-in {
  display: none;
}
header nav a.active, header nav a.current-page {
  border-bottom: 1px solid #000000;
  color: #ffffff;
}
header nav a.active .bg, header nav a.current-page .bg {
  top: 0;
}
header nav a.active .icon, header nav a.current-page .icon {
  background-color: #ffffff;
}
header nav a .favourite-index,
header nav a .my-products-index {
  display: none;
}
header nav a.my-products, header nav a.favourite {
  display: none;
}
header nav a.search span {
  display: none;
}
header nav a .bg {
  position: absolute;
  top: 100%;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #000000;
  z-index: -1;
  transition: top 0.3s;
}
header nav .logo-container {
  flex-grow: 1;
  text-align: left;
  display: flex;
  border: 0;
  margin-bottom: -1px;
}
header nav .logo-container .logo {
  padding: 0 1.25rem;
  display: flex;
  gap: 0.13rem;
  aspect-ratio: unset;
  width: unset;
  border: 0;
  justify-content: flex-start;
}
header nav .logo-container .logo img {
  min-width: 1.5rem;
  max-width: 100%;
}
header .search-popup {
  background-color: #000000;
  color: #e2fcfc;
  position: fixed;
  width: 100%;
  padding: 1.25rem;
}
header .search-popup-inner .popup-bg {
  position: absolute;
  inset: 0;
}
header .search-popup-inner .search-header {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.81rem 0;
}
header .search-popup-inner .search-header input {
  flex-grow: 1;
  background-color: transparent;
  color: #e2fcfc;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
header .search-popup-inner .search-header input::placeholder {
  color: #abc0c0;
}
header .search-popup-inner .search-header .icon {
  background-color: #e2fcfc;
}
header .search-popup-inner .search-header .icon.search-icon {
  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 */
}
header .search-popup-inner .search-header .icon.search-delete-icon {
  cursor: pointer;
}
header .search-popup-inner .search-list {
  list-style-type: none;
}
header .search-popup-inner .search-list li {
  padding: 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #d3e8e9;
}
header .search-popup-inner .search-list li.history:after {
  content: "";
  mask-image: url("/img/icons/history.svg");
  -webkit-mask-image: url("/img/icons/history.svg");
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  background-color: #abc0c0;
  display: block;
  height: 1rem;
  width: 1rem;
}
header .search-popup-inner .search-list li a {
  color: inherit;
  text-decoration: none;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
header .search-popup-inner .search-list > a {
  color: inherit;
  text-decoration: none;
  padding: 0.5rem;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.popup {
  right: -100%;
  opacity: 0;
  top: 1rem;
  transition: opacity 0.3s, top 0.3s;
}
.popup.active {
  right: 0;
  opacity: 1;
  top: 0;
}

.logged-in-seller .my-products {
  display: flex;
}
.logged-in-seller .favourite {
  display: flex;
}
.logged-in-seller .profile {
  padding: 0;
}
.logged-in-seller .profile-icon {
  display: none;
}
.logged-in-seller .profile .profile-img-logged-in {
  display: block;
  height: 2.25rem;
  width: 2.25rem;
}
.logged-in-seller .profile .profile-img-logged-in img {
  object-fit: cover;
  width: 100%;
}

.logged-in-consumer .favourite {
  display: flex;
}
.logged-in-consumer .profile {
  padding: 0;
}
.logged-in-consumer .profile-icon {
  display: none;
}
.logged-in-consumer .profile .profile-img-logged-in {
  display: block;
  height: 2.25rem;
  width: 2.25rem;
}
.logged-in-consumer .profile .profile-img-logged-in img {
  object-fit: cover;
  width: 100%;
}

.profile-popup {
  background-color: #000000;
  color: #abc0c0;
  padding: 1.25rem;
  top: 4.5rem;
  bottom: 0;
  z-index: 1000 !important;
}
.profile-popup.active {
  top: 3.5rem;
}
.profile-popup ul {
  list-style-type: none;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.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%;
}

@media only screen and (min-width: 1024px) {
  header nav {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 4fr;
  }
  header nav .logo-container {
    grid-column: 1/4;
  }
  header nav a {
    width: 100%;
    min-height: 8.625rem;
    border-bottom: 1px solid transparent;
  }
  header nav a.favourite, header nav a.my-products {
    position: relative;
    z-index: 800;
  }
  header nav a.favourite .favourite-index,
  header nav a.favourite .my-products-index, header nav a.my-products .favourite-index,
  header nav a.my-products .my-products-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 nav a.search {
    align-items: center;
    justify-content: center;
    width: 100%;
    grid-column: 5/-1;
    gap: 0.5rem;
    aspect-ratio: unset;
  }
  header nav a.search.active span,
  header nav a.search.active .icon {
    display: none;
  }
  header nav a.search span {
    display: block;
    background-color: transparent;
    color: #abc0c0;
    font-family: "Cairo";
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
  header nav a.search .close-popup {
    display: none;
  }
  header .search-popup {
    padding: 0;
    background-color: transparent;
    top: 1rem;
    display: flex;
    justify-content: flex-end;
    width: 50%;
    z-index: -1;
  }
  header .search-popup.active {
    top: 0;
    z-index: 1000;
  }
  header .search-popup .popup-bg {
    inset: unset;
    z-index: 900;
    top: 9.625rem;
    left: 0;
    right: 0;
    bottom: 0;
  }
  header .search-popup-inner {
    width: 100%;
  }
  header .search-popup-inner .search-header {
    pointer-events: unset;
    grid-column: 3/-1;
    padding: 3.56rem 1.25rem;
    border-bottom: 1px solid #e2fcfc;
    justify-content: center;
    background-color: #000000;
    z-index: 1000;
  }
  header .search-popup-inner .search-list {
    pointer-events: unset;
    grid-column: 3/-1;
    list-style-type: none;
    padding: 0 1.25rem 1.25rem;
    background-color: #000000;
    z-index: 1000;
  }
  .logged-in-seller header nav .logo-container {
    grid-column: 1/2;
  }
  .logged-in-consumer header nav .logo-container {
    grid-column: 1/3;
  }
  .profile-popup {
    padding: 2.5rem 0;
    top: 9.625rem;
  }
  .profile-popup.active {
    top: 8.625rem;
  }
  .profile-popup ul {
    width: 50%;
  }
  .profile-popup ul li {
    display: flex;
    justify-content: flex-end;
  }
}
@media only screen and (min-width: 1280px) {
  header nav .logo-container .logo {
    border-bottom: 0;
  }
  header nav .logo-container .logo img {
    height: 2.25rem;
  }
  header nav a {
    min-height: 9.625rem;
    aspect-ratio: unset;
    width: 100%;
    transition: border-color 0.1s;
    margin-bottom: -1px;
  }
  header nav a:hover {
    border-bottom: 1px solid #000000;
  }
  header nav a.search {
    flex-grow: 0;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
  }
  header nav a .bg {
    background-color: #000000;
  }
  .search-popup .search-header {
    min-height: 9.625rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .profile-popup {
    padding: 2.5rem 0;
    top: 10.625rem;
  }
  .profile-popup.active {
    top: 9.625rem;
  }
}
@media only screen and (min-width: 2080px) {
  header .search-popup {
    width: 50%;
  }
  .logged-in-seller header .search-popup {
    width: 50%;
  }
  .logged-in-consumer header .search-popup {
    width: calc(62.5% - (100vw - 2081px) / 2);
    right: calc((100vw - 2081px) / 2);
  }
}
footer {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  padding: 2.5rem 1.25rem;
  max-width: calc(2000px + 5rem);
  margin: auto;
}
footer .scroll-to-top-btn {
  border-radius: 2.5rem;
  border: 1px solid #abc0c0;
  background: #e2fcfc;
  height: 2.5rem;
  width: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  bottom: -2.5rem;
  right: 1rem;
  z-index: 500;
  cursor: pointer;
  transition: bottom 0.1s;
}
footer .scroll-to-top-btn .icon {
  transform: rotate(-45deg);
}
footer .scroll-to-top-btn.showed {
  bottom: 1rem;
}
footer .footer-top ul {
  list-style-type: none;
  display: flex;
  padding: 1.25rem 0;
  border-bottom: 1px solid #d3e8e9;
  gap: 1.25rem;
}
footer .footer-top ul li a {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
footer .footer-top-main-nav ul {
  flex-direction: column;
  gap: 1.25rem;
}
footer .footer-top-main-nav ul li a {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
footer .footer-bottom .footer-logo {
  display: flex;
  align-items: center;
  gap: 0.12rem;
  padding-bottom: 1.25rem;
}
footer .footer-bottom .footer-logo img {
  height: 1.875rem;
  width: 1.875rem;
}
footer .footer-bottom .footer-logo span {
  color: #abc0c0;
  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: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

@media only screen and (min-width: 1024px) {
  footer .scroll-to-top-btn {
    bottom: -2.5rem;
    right: 2.5rem;
  }
  footer .scroll-to-top-btn.showed {
    bottom: 2.5rem;
  }
  footer .footer-top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 0 1.25rem;
  }
  footer .footer-top ul {
    padding: 2.5rem 0;
  }
  footer .footer-top .links {
    border-top: 1px solid #d3e8e9;
  }
  footer .footer-top-main-nav {
    grid-column: 1/2;
    grid-row: 1/3;
    display: flex;
  }
  footer .footer-top-main-nav ul {
    gap: 1.25rem;
    flex-grow: 1;
  }
  footer .footer-bottom {
    display: flex;
    flex-direction: row;
    gap: 2.5rem;
  }
  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: #abc0c0;
    font-family: "Cairo";
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
  footer .footer-bottom-text p {
    color: #abc0c0;
    font-family: "Azeret Mono";
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
  }
}
@media only screen and (min-width: 1280px) {
  footer {
    padding: 2.5rem;
  }
  footer a:hover {
    text-decoration-color: #000000;
  }
  footer .footer-bottom-text p a:hover {
    text-decoration-color: #abc0c0;
  }
}
.archive {
  padding: 0;
}

.archive-hero {
  display: flex;
  flex-direction: column;
  gap: 0.25em;
  padding: 2.5rem 0;
  text-align: center;
  color: #abc0c0;
}
.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%;
}

.user-box-header {
  padding: 1.25rem;
}
.user-box-header .profile-container {
  display: flex;
  gap: 1.25rem;
}
.user-box-header .profile-container .profile-img {
  height: 4rem;
  width: 4rem;
  border-radius: 4em;
}
.user-box-header .profile-container .profile-img img {
  width: 100%;
  object-fit: cover;
}
.user-box-header .profile-container .profile-name-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.user-box-header .profile-container .profile-name-box h1 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.user-box-header .profile-container .profile-name-box h2 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.user-box-body {
  border: 1px solid #d3e8e9;
}
.user-box-body .user-desc {
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
  display: flex;
  gap: 0.5rem;
}
.user-box-body .user-desc > div {
  display: flex;
  flex-direction: column;
}
.user-box-body .user-desc > div span {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.user-box-body .user-desc > div p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.user-box-body .user-desc:last-of-type {
  border-bottom: 0;
}
.user-box-body .user-desc {
  flex-direction: column;
  gap: 1rem;
}
.user-box-body .user-desc.opened p {
  max-height: 20em;
  overflow-x: auto;
  -webkit-line-clamp: unset;
  line-clamp: unset;
}
.user-box-body .user-desc p {
  max-height: 4.5em;
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: 3;
  transition: max-height 0.3s;
  cursor: pointer;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.user-box-body .user-desc span {
  color: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

.upload-link-container {
  padding: 1.25rem;
}

.user-activity,
.user-location,
.single-prod-price,
.single-prod-shipping-option {
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}
.user-activity .img-container,
.user-location .img-container,
.single-prod-price .img-container,
.single-prod-shipping-option .img-container {
  border-radius: 4em;
  border: 1px solid #d3e8e9;
  padding: 0.25rem;
  display: inline-block;
}
.user-activity .img-container .icon,
.user-location .img-container .icon,
.single-prod-price .img-container .icon,
.single-prod-shipping-option .img-container .icon {
  height: 1rem;
  width: 1rem;
  display: flex;
  background-color: #abc0c0;
}
.user-activity > div,
.user-location > div,
.single-prod-price > div,
.single-prod-shipping-option > div {
  display: flex;
  flex-direction: column;
}
.user-activity > div span,
.user-location > div span,
.single-prod-price > div span,
.single-prod-shipping-option > div span {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.user-activity > div p,
.user-location > div p,
.single-prod-price > div p,
.single-prod-shipping-option > div p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.user-activity:last-of-type,
.user-location:last-of-type,
.single-prod-price:last-of-type,
.single-prod-shipping-option:last-of-type {
  border-bottom: 0;
}

.filter-row {
  scrollbar-color: #abc0c0 transparent;
  scrollbar-width: thin;
}
.filter-row > ul {
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: thin;
  display: flex;
  list-style-type: none;
  gap: 0.5rem;
}
.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: #abc0c0;
}
.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: #abc0c0;
}
.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: 1rem 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 #abc0c0;
  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: 1rem 1.25rem;
  border-top: 1px solid #d3e8e9;
}
.filter-row > ul > li .filter-accordion .options-container .btn-container button {
  padding: 1rem;
  width: 100%;
  background-color: #000000;
  color: #e2fcfc;
  cursor: pointer;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.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;
  height: 3.25rem;
  gap: 0.5rem;
  border-bottom: 1px solid #d3e8e9;
  padding: 1.25rem;
}
.archive-search .search-icon {
  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 */
}
.archive-search input {
  flex-grow: 1;
  background-color: transparent;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.archive-search input::placeholder {
  color: #abc0c0;
}

.upper-nav-row {
  padding: 0 1.25rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.post-count {
  padding: 1.25rem;
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.product-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: calc(100% - 1px);
  border-bottom: 0;
}
.product-grid .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-grid .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-grid .product-card .title-container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  gap: 0.5rem;
}
.product-grid .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;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-grid .product-card .state {
  display: none;
}
.product-grid .product-card.own-product .state:has(.own-product) {
  display: flex;
}
.product-grid .product-card.leading-quote .state:has(.leading-quote) {
  display: flex;
}
.product-grid .product-card.quote-requested .state:has(.quote-requested) {
  display: flex;
}
.product-grid .product-card.overbid .state:has(.overbid) {
  display: flex;
}

.img-container {
  position: relative;
}
.img-container img {
  display: block;
  object-fit: cover;
  width: 100%;
}
.img-container .cover-img {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  aspect-ratio: 1/1;
  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;
}

.state ul,
.tooltiptext ul {
  display: flex;
  flex-direction: column;
  gap: 0.62rem;
}
.state hr,
.tooltiptext hr {
  height: 1px;
  background-color: #d3e8e9;
}
.state li,
.tooltiptext li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.state div,
.tooltiptext div {
  height: 1rem;
  width: 1rem;
  mask-repeat: no-repeat;
  mask-position: center;
}
.state .own-product,
.tooltiptext .own-product {
  background-color: #00f0ff !important;
  mask-image: url("/img/icons/own-product.svg");
  -webkit-mask-image: url("/img/icons/own-product.svg"); /* Safari támogatás */
}
.state .leading-quote,
.tooltiptext .leading-quote {
  background-color: #ca00ff !important;
  mask-image: url("/img/icons/leading-quote.svg");
  -webkit-mask-image: url("/img/icons/leading-quote.svg"); /* Safari támogatás */
}
.state .quote-requested,
.tooltiptext .quote-requested {
  background-color: #ffb300 !important;
  mask-image: url("/img/icons/quote-requested.svg");
  -webkit-mask-image: url("/img/icons/quote-requested.svg"); /* Safari támogatás */
}
.state .overbid,
.tooltiptext .overbid {
  background-color: #ff1818 !important;
  mask-image: url("/img/icons/overbid.svg");
  -webkit-mask-image: url("/img/icons/overbid.svg"); /* Safari támogatás */
}
.state .eye-icon,
.tooltiptext .eye-icon {
  height: 1rem !important;
  width: 1rem !important;
}

.product-footer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.product-footer .state-indicator-box {
  display: flex;
}
.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%;
}
.product-footer .state-indicator-box .tooltiptext {
  left: 0;
  z-index: 1000;
  position: fixed;
  bottom: 0.5rem;
  top: unset;
  left: 0.5rem;
  right: 0.5rem;
}
.product-footer .state-indicator-box .tooltiptext ul {
  margin-top: 0.5rem;
  list-style-type: none;
}
.product-footer .state-indicator-box .tooltiptext ul li {
  display: flex;
  gap: 0.63rem;
  align-items: center;
  color: #e2fcfc;
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.product-footer .state-indicator-box .tooltiptext ul li > div {
  height: 0.75rem;
  width: 0.75rem;
  mask-size: 100%;
}

.archive .pagination-container {
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.archive .pagination-container .load-more {
  background-color: inherit;
  transition: color 0.3s;
}
.archive .pagination-container .load-more:active {
  color: #000000;
}
.archive .pagination {
  display: flex;
  gap: 0.5rem;
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.archive .pagination a,
.archive .pagination span {
  min-width: 1.625rem;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: color 0.3s;
}
.archive .pagination a.active,
.archive .pagination span.active {
  color: #000000;
}
.archive .is-not-available .img-container {
  position: relative;
}

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

@media only screen and (min-width: 730px) {
  .archive-hero {
    padding: 5rem 0;
    gap: 0.75rem;
  }
  .archive-hero h2 {
    font-size: 3.75rem;
    line-height: 110%;
  }
  .product-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 1024px) {
  .listing-title-row {
    padding: 2.5rem 0;
  }
  .post-count {
    padding: 1.25rem 0;
  }
  .archive {
    padding: 0 1.25rem;
  }
  .user-box {
    display: flex;
    grid-template-columns: 1fr 1fr;
  }
  .user-box-header {
    width: 50%;
  }
  .user-box-body {
    width: 50%;
    border-top: 0;
  }
  .product-grid .product-card {
    padding: 1.25rem;
  }
  .upload-link-container {
    padding: 0;
  }
  .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: #abc0c0;
    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: #abc0c0;
    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: #abc0c0;
  }
  .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;
  }
  .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;
  }
  .archive .pagination-container {
    padding: 1.25rem 0;
  }
  .upper-nav-row {
    padding: 0;
  }
}
@media only screen and (min-width: 1280px) {
  .product-grid {
    grid-template-columns: repeat(4, 1fr);
  }
  .product-grid .product-card:nth-of-type(5), .product-grid .product-card:nth-of-type(6) {
    display: flex;
  }
  .product-grid .product-card:hover {
    z-index: 300;
  }
  .product-grid .product-card:hover::after {
    border: 1px solid #000000;
  }
  .archive .pagination-container .load-more:hover {
    color: #000000;
  }
  .archive .pagination a:hover {
    color: #000000;
  }
  .upload-link:hover,
  .interested-btn:hover {
    opacity: 0.75;
  }
}
@media only screen and (min-width: 1680px) {
  .archive {
    padding: 1.25rem;
  }
  .archive .user-activity {
    border-top: 1px solid #d3e8e9;
  }
  .product-grid {
    grid-template-columns: repeat(6, 1fr);
  }
}
.single-product-header {
  min-width: 0;
}
.single-product-header-inner {
  border-bottom: 1px solid #d3e8e9;
  display: block;
}
.single-product-header-inner .swiper .cover-img {
  z-index: 10;
  pointer-events: none;
}
.single-product-header-inner .swiper.caption-opened .swiper-slide-active .caption-container figcaption {
  color: #000000 !important;
  height: 100% !important;
  -webkit-line-clamp: unset;
}
.single-product-header-inner .swiper.caption-opened .swiper-pagination {
  color: #000000;
}
.single-product-header-inner .swiper .swiper-slide {
  overflow: visible;
  position: relative;
}
.single-product-header-inner .swiper .swiper-slide a {
  border-bottom: 1px solid #d3e8e9;
  display: block;
}
.single-product-header-inner .swiper .swiper-slide img {
  aspect-ratio: 1/1;
  object-fit: contain;
  max-width: 400px;
  margin: auto;
}
.single-product-header-inner .swiper .swiper-slide .caption-container {
  padding: 0.5rem 0.5rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  cursor: pointer;
}
.single-product-header-inner .swiper .swiper-slide .caption-container figcaption {
  max-width: 400px;
  min-height: 2rem;
  color: #abc0c0;
  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;
}
.single-product-header-inner .swiper-pagination {
  position: static;
  display: block;
  padding-top: 0.25rem;
  padding-bottom: 0.5rem;
  color: #abc0c0;
  cursor: pointer;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
  transition: color 0.3s;
}
.single-product .title-container-top-row {
  display: flex;
  align-items: center;
  padding: 0 !important;
  justify-content: space-between;
}
.single-product .title-container-top-row button {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.66rem;
  aspect-ratio: 1/1;
  cursor: pointer;
}
.single-product .title-container-top-row button .icon {
  height: 1.5rem;
  width: 1.5rem;
}
.single-product .title-container-top-row .save-icon {
  padding: 0.5rem;
}
.single-product .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;
}
.single-product .tag-list li a {
  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%;
}
.single-product .tag-list li:last-of-type a {
  border-right: 0;
}
.single-product-body > div,
.single-product-body > a {
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
  border-top: 0;
}
.single-product-body .interested-conteiner {
  padding: 0.5rem;
}
.single-product-body .title-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  border-top: 1px solid #d3e8e9;
  padding: 0;
}
.single-product-body .title-container .uploaded {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  padding: 1rem 1.25rem;
  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 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.single-product-body .title-container h1 {
  padding: 0 1.25rem;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.single-product-body .title-container .product-footer {
  padding: 0 1.25rem 1.25rem;
}
.single-product-body .title-container .product-footer span {
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.single-product-body .product-text {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.single-product-body .product-text .badges {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}
.single-product-body .product-text h2 {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.single-product-body .product-text p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.single-product-body .product-text table tr td {
  width: 50%;
  padding-bottom: 1rem;
  vertical-align: top;
}
.single-product-body .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;
}
.single-product-body .product-text table tr td:last-of-type {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.single-product-body .product-text table tr:last-of-type td {
  padding-bottom: 0;
}
.single-product-body .product-text .keywords {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  gap: 0.5rem;
  color: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.single-product .shipping .shipping-title.active {
  border-bottom: 1px solid #000000;
}
.single-product .shipping .shipping-title.active h3 {
  color: #000000;
}
.single-product .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");
}
.single-product .shipping .shipping-options-container.active {
  max-height: 40rem;
}
.single-product .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;
}
.single-product .shipping .shipping-title h3 {
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.single-product .shipping .shipping-title .shipping-toggle {
  background-color: transparent;
  cursor: pointer;
}
.single-product .shipping .shipping-title .shipping-toggle .plus-icon {
  background-color: #abc0c0;
}
.single-product .shipping .shipping-options-container {
  position: static;
  max-height: 0;
  overflow: hidden;
  border-bottom: 1px solid #d3e8e9;
  transition: max-height 0.3s;
}
.single-product .shipping .shipping-options-container.active {
  max-height: 40rem;
}
.single-product .shipping .shipping-options-container .single-prod-shipping-option {
  border-top: 1px solid #d3e8e9;
  border-bottom: 0;
}
.single-product .category-list {
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 1.25rem;
  border-bottom: 1px solid #d3e8e9;
}
.single-product .category-list li {
  color: #abc0c0;
  position: relative;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.single-product .category-list li a {
  display: block;
  padding: 0.5rem 0.75rem;
}
.single-product .category-list li::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid #d3e8e9;
  transform: skew(-15deg);
  z-index: -1;
}
.single-product .category-list li span {
  color: #0e8d8d;
}
.single-product .category-list li .highlighted {
  color: #000000;
}
.single-product .category-list li .highlighted::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid #d3e8e9;
  transform: skew(-15deg);
  z-index: -1;
  background-color: #d3e8e9;
}

.uploader-info {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}
.uploader-info .uploader-img {
  width: 2.25rem;
  height: 2.25rem;
  aspect-ratio: 1/1;
  border-radius: 4em;
}
.uploader-info .uploader-img img {
  width: 100%;
  object-fit: cover;
}
.uploader-info .uploader-text h3 {
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.uploader-info .uploader-text p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.uploader-info .uploader-text p span {
  display: inline-block;
  border: 1px solid #d3e8e9;
  padding: 0 0.25rem;
}
.uploader-info .icon {
  margin-left: auto;
}

.single {
  padding: 0;
}
.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;
}
.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%;
}
.single .recommended-products .title-row .show-all {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #abc0c0;
  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: #abc0c0;
  height: 1rem;
  width: 1rem;
}

.contact-popup {
  color: #e2fcfc;
}
.contact-popup.active {
  top: 0;
}
.contact-popup .popup-inner {
  background-color: #000000;
  padding: 1.25rem;
}
.contact-popup .popup-inner .uploader-info,
.contact-popup .popup-inner > button {
  border: 1px solid #d3e8e9;
  padding: 0.5rem;
}
.contact-popup .popup-inner h4 {
  padding: 1.25rem 0;
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.contact-popup .popup-inner .contact-list {
  border: 1px solid #d3e8e9;
}
.contact-popup .popup-inner .contact-list > a {
  padding: 0.5rem;
  text-align: center;
  width: 100%;
  display: block;
  border-bottom: 1px solid #d3e8e9;
}
.contact-popup .popup-inner .contact-list .messeging-container {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.25rem;
  gap: 0.5rem;
}
.contact-popup .popup-inner .contact-list .messeging-container a {
  height: 2.25rem;
  width: 2.25rem;
  display: flex;
}
.contact-popup .popup-inner .contact-list .messeging-container a .icon {
  background-color: #e2fcfc;
  height: 100%;
  width: 100%;
}
.contact-popup .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%;
}

.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%;
}

.tooltip {
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.tooltip .icon {
  background-color: #abc0c0;
  height: 0.875rem;
  width: 0.875rem;
}
.tooltip > span {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  color: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.tooltip > span:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}
.tooltip .tooltiptext {
  position: absolute;
  top: 100%;
  right: 0;
  max-width: 100%;
  visibility: hidden;
  min-width: 16.25rem;
  z-index: 300;
  opacity: 0;
  transition: opacity 0.3s;
}
.tooltip .tooltiptext p,
.tooltip .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%;
}

.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;
}

.pswp__img {
  cursor: pointer !important;
}

@media only screen and (min-width: 1024px) {
  .single-product {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    max-width: 76.625rem;
    margin: auto;
  }
  .single-product .edit-product-btn {
    grid-column: 2/3;
  }
  .single-product-header {
    grid-column: 1/2;
    width: 100%;
    grid-row: 1/3;
    padding: 1.25rem 0;
  }
  .single-product-header-inner {
    border-left: 1px solid #d3e8e9;
    border-top: 1px solid #d3e8e9;
  }
  .single-product-header-inner .swiper .swiper-slide .caption-container {
    padding: 1.25rem 1.25rem 0;
  }
  .single-product-header-inner .swiper .swiper-pagination {
    padding-bottom: 1.25rem;
  }
  .single-product-text {
    width: 100%;
    padding-top: 1.25rem;
  }
  .single-product-text .single-product-body > div,
  .single-product-text .single-product-body > a {
    padding: 1.25rem;
    border-left: 1px solid #d3e8e9;
    border-right: 1px solid #d3e8e9;
  }
  .single-product-text .single-product-body .title-container {
    padding: 0;
  }
  .single-product-text .single-product-body .interested-conteiner {
    padding: 1.25rem;
  }
  .single-product-text .single-product-body .title-container h1 {
    font-family: "Cairo";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
  .single-product-text .edit-product-btn {
    border-left: 1px solid #d3e8e9;
    border-right: 1px solid #d3e8e9;
  }
  .single-product-text .single-prod-shipping-option {
    padding: 1.5rem;
  }
  .single-product-text .shipping {
    border-left: 1px solid #d3e8e9;
    border-right: 1px solid #d3e8e9;
  }
  .single-product-text .category-list {
    border-bottom: 0;
  }
  .single-product .tag-list {
    border-top: 1px solid #d3e8e9;
  }
  .not-logged-in-popup .popup-inner,
  .contact-popup .popup-inner {
    width: 50%;
    position: absolute;
    right: 0;
  }
}
@media only screen and (min-width: 1280px) {
  .gallery-bottom .swiperThumbs .swiper-slide:hover img {
    opacity: 0.5;
  }
  .single-product .edit-product-btn {
    transition: border 0.3s;
  }
  .single-product .edit-product-btn:hover {
    border-bottom: 1px solid #000000;
  }
  .single-product-header-inner {
    border-top: 1px solid #d3e8e9;
  }
  .single-product-header-inner .swiper .swiper-slide img {
    max-width: 100%;
  }
  .single-product-header-inner .swiper .swiper-slide .caption-container {
    padding: 1.25rem 1.25rem 0;
  }
  .single-product-header-inner .swiper .swiper-slide .caption-container figcaption {
    max-width: 100%;
  }
  .single-product-header-inner .swiper .swiper-slide .caption-container:hover figcaption {
    color: #000000;
  }
  .single-product-header-inner .swiper .swiper-slide .caption-container:hover + .swiper-pagination {
    color: #000000;
  }
  .single-product-header-inner .swiper .swiper-pagination {
    padding-bottom: 1.25rem;
  }
  .single-product-header-inner .swiper .swiper-pagination:hover {
    color: #000000;
  }
  .single-product-header-inner .swiper:has(.caption-container:hover) .swiper-pagination {
    color: #000000;
  }
  .single-product-header-inner .swiper:has(.swiper-pagination:hover) .caption-container figcaption {
    color: #000000 !important;
  }
  .single-product-text .tag-list li a {
    transition: border-color 0.3s;
    will-change: border-color;
    padding: 1rem 1.25rem;
  }
  .single-product-text .tag-list li a:hover {
    border-bottom-color: #000000;
  }
  .single-product-text .single-product-body > div,
  .single-product-text .single-product-body > a {
    padding: 2.5rem;
  }
  .single-product-text .single-product-body .title-container .title-upper-row .uploaded {
    padding: 1.25rem 1rem;
  }
  .single-product-text .single-product-body .title-container h1 {
    padding: 0 2.5rem;
  }
  .single-product-text .single-product-body .title-container .product-footer {
    padding: 0 2.5rem 2.5rem;
  }
  .single-product-text .shipping h3 {
    transition: color 0.3s;
  }
  .single-product-text .shipping .shipping-options-container {
    transition: border-color 0.3s, max-height 0.3s;
  }
  .single-product-text .shipping .shipping-title {
    transition: border-color 0.3s;
    padding: 2.5rem;
  }
  .single-product-text .shipping .shipping-title:hover {
    border-color: #000000;
  }
  .single-product-text .shipping .shipping-title:hover h3 {
    color: #000000;
  }
  .single-product-text .shipping .shipping-title:hover .shipping-toggle .icon {
    background-color: #000000;
  }
  .single-product-text .shipping .shipping-title:hover .shipping-options-container {
    border-color: #000000;
  }
  .single-product-text .single-prod-shipping-option {
    padding: 2.5rem;
  }
  .single-product-text .category-list {
    padding: 2.5rem;
  }
  .single-product-text .category-list li a.highlighted {
    transition: color 0.3s;
  }
  .single-product-text .category-list li a.highlighted::before {
    transition: background-color 0.3s, border-color 0.3s;
  }
  .single-product-text .category-list li a.highlighted:hover {
    color: #e2fcfc;
  }
  .single-product-text .category-list li a.highlighted:hover::before {
    background-color: #000000;
  }
  .single-product-text .category-list li a:hover {
    color: #000000;
  }
  .single-product-text .category-list li a:hover::before {
    border-color: #000000;
  }
  .single .recommended-products {
    padding-bottom: 2.5rem;
  }
  .single .recommended-products .title-row h2 {
    font-family: "Cairo";
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
  .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;
  }
  .uploader-info {
    transition: border-color 0.3s;
  }
  .uploader-info:hover {
    border-bottom-color: #000000;
  }
}
.editing .single-product {
  padding: 0;
}
.editing .editing-product > .title-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  height: 3.5rem;
}
.editing .editing-product > .title-row .back-btn {
  background-color: transparent;
  cursor: pointer;
}
.editing .editing-product > .title-row .back-btn .icon {
  transform: rotate(90deg);
}
.editing .editing-product > .title-row h1 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.editing .editing-product .tabs {
  width: 100%;
  display: flex;
}
.editing .editing-product .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%;
}
.editing .editing-product .tabs .tab-btn:first-of-type {
  border-left: 1px solid #d3e8e9;
}
.editing .editing-product .tabs .tab-btn.opened {
  background-color: #ffffff;
}
.editing .tab-content {
  background-color: #ffffff;
  border: 1px solid #d3e8e9;
}
.editing .tab-content .product-quantity-container {
  padding: 0;
  position: static;
}
.editing .tab-content .product-quantity-container .title-row {
  padding: 1rem;
  position: static;
  cursor: pointer;
  border-bottom: 1px solid transparent;
}
.editing .tab-content .product-quantity-container .accordion-content {
  display: none;
  width: 100%;
  padding: 0 1.25rem 1.25rem;
}
.editing .tab-content .product-quantity-container .accordion-content .number-input {
  padding: 0 1.25rem 1.25rem;
  width: 100%;
}
.editing .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");
}
.editing .tab-content .product-quantity-container.active .accordion-content {
  display: block;
}
.editing .tab-content .product-quantity-container.active .accordion-content .number-input {
  max-height: 4rem;
  padding: 0 1rem 1rem;
}
.editing .single-product-text {
  display: none;
}

#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;
}
#delete-zone .icon {
  height: 1.5rem;
  width: 1.5rem;
  background-color: #abc0c0;
}
#delete-zone.visible {
  padding: 1.25rem;
  opacity: 1;
  height: 4rem;
}
#delete-zone.over {
  border-color: red;
}
#delete-zone.over .icon {
  background-color: red;
}

.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 {
  display: flex;
  justify-content: space-between;
}
.input-container .title-row button {
  background-color: transparent;
}
.input-container .title-row button .icon {
  background-color: #abc0c0;
}
.input-container .title-row button .icon:active {
  background-color: #000000;
}
.input-container label,
.input-container h2 {
  color: #abc0c0;
  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: 700;
  line-height: 130%;
}
.input-container input {
  padding: 1.25rem 0;
}
.input-container input#product-price::after {
  content: "Ft";
}
.input-container select {
  -moz-appearance: none; /* Firefox */
  -webkit-appearance: none; /* Safari and Chrome */
  appearance: none;
  background-image: none;
  padding: 0;
  color: #abc0c0;
  text-decoration: underline;
  margin-bottom: 1rem;
  cursor: pointer;
}
.input-container .number-input {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  padding: 0 1rem 1rem;
  text-decoration: none;
}
.input-container .number-input .num-input-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.13rem;
}
.input-container .number-input .num-input-container .recommended-price {
  color: #abc0c0;
  align-self: center;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.input-container .number-input .num-input-container .recommended-price:first-child {
  color: #0e8d8d !important;
}
.input-container .number-input .num-input-container span {
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.input-container .number-input input[type=number] {
  text-decoration: underline;
  padding: 0;
  width: 4rem;
  color: #000000;
  text-decoration-color: #abc0c0;
  -moz-appearance: textfield; /* Firefox */
}
.input-container .number-input input[type=number]::-webkit-outer-spin-button, .input-container .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 */
}
.input-container .number-input input[type=number]::placeholder {
  color: #abc0c0;
}
.input-container .number-input .plus-btn,
.input-container .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;
}
.input-container .number-input .plus-btn .icon,
.input-container .number-input .minus-btn .icon {
  background-color: #0e8d8d;
}
.input-container .title-row {
  width: 100%;
}
.input-container .title-row .tooltip {
  justify-content: flex-start;
}
.input-container .title-row .tooltip .tooltiptext {
  right: unset;
  left: 0;
  max-width: 16.25rem;
}
.input-container textarea {
  width: 100%;
  margin: 1.25rem 0;
  resize: vertical;
  overflow-y: auto;
  scrollbar-color: #abc0c0 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;
}
.input-container .images-upload {
  width: 100%;
  padding: 1rem 0 0;
}
.input-container .images-upload label {
  height: 16.5rem;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #d3e8e9;
  cursor: pointer;
}
.input-container .images-upload label input {
  display: none;
}
.input-container .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%;
}
.input-container .uploaded-imgs-container {
  display: flex;
  flex-wrap: wrap;
  padding: 1rem 0;
}
.input-container .uploaded-imgs-container.shake {
  animation: shake 0.3s;
}
.input-container .uploaded-imgs-container .image {
  width: 25%;
  transition: opacity 0.3s;
  cursor: pointer;
}
.input-container .uploaded-imgs-container .image input {
  display: none;
}
.input-container .uploaded-imgs-container .image .delete-btn {
  display: none;
}
.input-container .uploaded-imgs-container .image img {
  aspect-ratio: 1/1;
  object-fit: cover;
  transition: opacity 0.1s;
  height: 100%;
}
.input-container .uploaded-imgs-container .image.sortable-chosen img {
  opacity: 0.5;
}
.input-container .uploaded-imgs-container.advanced {
  display: flex;
  flex-direction: column;
}
.input-container .uploaded-imgs-container.advanced .image {
  display: flex;
  align-items: stretch;
  width: 100%;
  border: 1px solid #d3e8e9;
  border-bottom: 0;
}
.input-container .uploaded-imgs-container.advanced .image:last-of-type {
  border-bottom: 1px solid #d3e8e9;
}
.input-container .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%;
}
.input-container .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;
}
.input-container .uploaded-imgs-container.advanced .image .delete-btn .icon {
  background-color: #abc0c0;
}
.input-container .uploaded-imgs-container.advanced .image .img-container {
  border-right: 1px solid #d3e8e9;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.input-container .uploaded-imgs-container.advanced .image .img-container img {
  max-width: 3rem;
  width: 3rem;
  height: 3rem;
  object-fit: cover;
  aspect-ratio: 1/1;
}

.product-price-container .tooltip {
  align-self: flex-start;
}
.product-price-container .tooltip .tooltiptext {
  right: unset;
  left: 0;
}

@keyframes shake {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-4px);
  }
  75% {
    transform: translateX(4px);
  }
}
@media only screen and (min-width: 1024px) {
  .editing .editing-product {
    padding: 0 2.5rem;
  }
  .editing .editing-product > .title-row {
    height: auto;
    padding: 2.5rem 0;
  }
  .editing .editing-product > .title-row .back-btn {
    display: none;
  }
  .editing .editing-product > .title-row h1 {
    font-family: "Cairo";
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
  }
  .editing .editing-product .tabs .tab-btn:hover {
    background-color: #ffffff;
  }
  .editing .editing-product .tab-content .row .title-row button:hover .icon {
    background-color: #000000;
  }
  .editing .editing-product .tab-content .row .number-input {
    justify-content: center;
    width: auto;
  }
  .editing .editing-product .tab-content .row .number-input .num-input-container {
    width: 12.5rem;
  }
  .editing .editing-product .tab-content .row textarea {
    margin: 0.25rem 0 1.25rem;
  }
  .editing .editing-product .tab-content .row .tag label:hover {
    background-color: #d3e8e9;
  }
  .editing .editing-product .tab-content .row .keywords label:has(input:checked) {
    color: #0e8d8d;
  }
  .editing .editing-product .tab-content .row .keywords label:hover {
    color: #d3e8e9;
  }
  .editing .editing-product .tab-content .tags,
  .editing .editing-product .tab-content .details-container,
  .editing .editing-product .tab-content .keywords {
    padding: 1.25rem;
  }
  .editing .editing-product .tab-content .product-quantity-container {
    transition: border-color 0.3s;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row {
    transition: border-color 0.3s;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row label {
    cursor: pointer;
    transition: color 0.3s;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row .icon {
    cursor: pointer;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row:hover {
    border-bottom-color: #000000;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row:hover label {
    color: #000000;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row:hover .icon {
    background-color: #000000;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row.active label {
    color: #000000;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row.active .icon {
    background-color: #000000;
  }
  .editing .editing-product .tab-content .product-quantity-container .title-row.active:hover {
    border-bottom-color: transparent;
  }
  .editing .single-product-text {
    display: block;
  }
  .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 {
    padding: 1rem !important;
  }
  .uploaded-imgs-container img:hover {
    opacity: 0.5;
  }
  #delete-zone.visible {
    height: 7.1875rem;
    display: flex;
    opacity: 1;
  }
  #delete-zone.over {
    border-color: red;
  }
  #delete-zone.over .icon {
    background-color: red;
  }
}
.profile-page {
  padding: 0;
}
.profile-page h1 {
  padding: 2.5rem 1.25rem;
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.profile-page .log-in-container,
.profile-page .profile-settings {
  display: flex;
  flex-direction: column;
}
.profile-page .log-in-container .btn-container,
.profile-page .profile-settings .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 .log-in-container .btn-container h2,
.profile-page .profile-settings .btn-container h2 {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.profile-page .log-in-container .btn-container h2 a,
.profile-page .profile-settings .btn-container h2 a {
  color: #0e8d8d;
}
.profile-page .log-in-container .btn-container p,
.profile-page .profile-settings .btn-container p {
  text-align: center;
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.profile-page .profile-settings {
  margin: auto;
}
.profile-page .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-page .profile-settings .profile-img-container label {
  display: flex;
  flex-direction: column;
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  cursor: pointer;
}
.profile-page .profile-settings .profile-img-container label img {
  width: 6rem;
  margin: auto;
}
.profile-page .profile-settings .profile-img-container label input {
  display: none;
}
.profile-page .profile-settings-container {
  background-color: #ffffff;
  border: 1px solid #d3e8e9;
}
.profile-page .profile-settings-container > div {
  border-bottom: 1px solid #d3e8e9;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
}
.profile-page .profile-settings-container > div label {
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.profile-page .profile-settings-container > div input,
.profile-page .profile-settings-container > div textarea,
.profile-page .profile-settings-container > div select {
  resize: vertical;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.profile-page .profile-settings-container > div input::placeholder,
.profile-page .profile-settings-container > div textarea::placeholder,
.profile-page .profile-settings-container > div select::placeholder {
  color: #000000;
}
.profile-page .profile-settings-container > div textarea {
  min-height: 8rem;
}
.profile-page .profile-settings-container .extra-info-container .info-box {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.profile-page .profile-settings-container .extra-info-container .info-box .icon {
  min-width: 1rem;
}
.profile-page .profile-settings-container .extra-info-container .info-box p {
  color: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

.gsi-material-button {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -webkit-appearance: none;
  background-color: #131314;
  background-image: none;
  border: 1px solid #747775;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #e3e3e3;
  cursor: pointer;
  font-family: "Roboto", arial, sans-serif;
  font-size: 14px;
  height: 40px;
  letter-spacing: 0.25px;
  outline: none;
  overflow: hidden;
  padding: 0 12px;
  position: relative;
  text-align: center;
  -webkit-transition: background-color 0.218s, border-color 0.218s, box-shadow 0.218s;
  transition: background-color 0.218s, border-color 0.218s, box-shadow 0.218s;
  vertical-align: middle;
  white-space: nowrap;
  width: auto;
  max-width: 400px;
  min-width: min-content;
  border-color: #8e918f;
}

.gsi-material-button .gsi-material-button-icon {
  height: 20px;
  margin-right: 10px;
  min-width: 20px;
  width: 20px;
}

.gsi-material-button .gsi-material-button-content-wrapper {
  -webkit-align-items: center;
  align-items: center;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 100%;
  justify-content: space-between;
  position: relative;
  width: 100%;
}

.gsi-material-button .gsi-material-button-contents {
  -webkit-flex-grow: 1;
  flex-grow: 1;
  font-family: "Roboto", arial, sans-serif;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}

.gsi-material-button .gsi-material-button-state {
  -webkit-transition: opacity 0.218s;
  transition: opacity 0.218s;
  bottom: 0;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.gsi-material-button:disabled {
  cursor: default;
  background-color: rgba(19, 19, 20, 0.3803921569);
  border-color: rgba(142, 145, 143, 0.1215686275);
}

.gsi-material-button:disabled .gsi-material-button-state {
  background-color: rgba(227, 227, 227, 0.1215686275);
}

.gsi-material-button:disabled .gsi-material-button-contents {
  opacity: 38%;
}

.gsi-material-button:disabled .gsi-material-button-icon {
  opacity: 38%;
}

.gsi-material-button:not(:disabled):active .gsi-material-button-state,
.gsi-material-button:not(:disabled):focus .gsi-material-button-state {
  background-color: white;
  opacity: 12%;
}

.gsi-material-button:not(:disabled):hover {
  -webkit-box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.3), 0 1px 3px 1px rgba(60, 64, 67, 0.15);
  box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.3), 0 1px 3px 1px rgba(60, 64, 67, 0.15);
}

.gsi-material-button:not(:disabled):hover .gsi-material-button-state {
  background-color: white;
  opacity: 8%;
}

@media only screen and (min-width: 1024px) {
  .profile-page .profile-settings {
    max-width: 32.125rem;
  }
}
@media only screen and (min-width: 1280px) {
  .profile-page .profile-settings {
    max-width: 57.125rem;
  }
}
.product-upload-page {
  padding: 0;
}
.product-upload-page .upload-progress-bg {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.product-upload-page .upload-progress-bg .progress-indicator {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #ffffff;
  opacity: 0;
  transition: opacity 0.3s;
}
.product-upload-page .upload-progress-bg .progress-indicator.upload-in-progress {
  opacity: 1;
}
.product-upload-page .product-upload-container {
  max-width: 57.5rem;
  margin: auto;
}
.product-upload-page .product-upload-container .title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.product-upload-page .product-upload-container .title-row h1 {
  padding: 1.25rem;
  font-family: "Cairo";
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .product-upload-container .toggle-extra-info-block {
  background-color: transparent;
  cursor: pointer;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem;
  border: 1px solid #d3e8e9;
  border-bottom-color: transparent;
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .product-upload-container .toggle-extra-info-block .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: #abc0c0;
}
.product-upload-page .product-upload-container .toggle-extra-info-block.active {
  background-color: #ffffff;
}
.product-upload-page .product-upload-container .toggle-extra-info-block.active .icon {
  mask-image: url("/img/icons/minus.svg");
  -webkit-mask-image: url("/img/icons/minus.svg");
}
.product-upload-page .product-upload-container .upload-product-extra-info {
  background-color: #ffffff;
  padding: 0;
  display: none;
  flex-direction: column;
}
.product-upload-page .product-upload-container .upload-product-extra-info.active {
  display: flex;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row {
  display: flex;
  flex-direction: column;
  padding: 1.25rem;
  border: 1px solid #d3e8e9;
  border-bottom: 0;
  position: relative;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row label,
.product-upload-page .product-upload-container .upload-product-extra-info .row h3 {
  color: #abc0c0;
  display: flex;
  gap: 0.25rem;
  align-items: center;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row label:has(.switcher),
.product-upload-page .product-upload-container .upload-product-extra-info .row h3:has(.switcher) {
  margin-top: 1rem;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row textarea,
.product-upload-page .product-upload-container .upload-product-extra-info .row input,
.product-upload-page .product-upload-container .upload-product-extra-info .row select {
  resize: vertical;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row textarea::placeholder,
.product-upload-page .product-upload-container .upload-product-extra-info .row input::placeholder,
.product-upload-page .product-upload-container .upload-product-extra-info .row select::placeholder {
  color: #000000;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row input[type=checkbox] {
  display: none;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row .tooltip {
  display: inline;
  gap: 0.5rem;
  justify-content: flex-end;
  align-items: center;
  align-self: flex-end;
  position: static;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row .tooltip .tooltiptext {
  left: 1rem;
  right: 1rem;
  top: 2rem;
  max-width: 30rem;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row .tooltip span {
  color: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.warning {
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  display: none;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.warning.opened {
  display: flex;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.warning .icon {
  background-color: #abc0c0;
  width: 1rem;
  min-width: 1rem;
  height: 1rem;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.warning p {
  color: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.switcher-box {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0.25rem;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.switcher-box label {
  margin: 0;
  align-self: unset;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.switcher-box .title-row {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 0.25rem;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.switcher-box .title-row > p {
  color: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.product-upload-page .product-upload-container .upload-product-extra-info .row.switcher-box .tooltip {
  align-self: unset;
}
.product-upload-page .product-upload-container .upload-wrapper {
  padding: 1.25rem;
  border: 1px solid #d3e8e9;
  border-bottom: 0;
}
.product-upload-page .product-upload-container .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%;
}
.product-upload-page .product-upload-container .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%;
}
.product-upload-page .product-upload-container .upload-wrapper .upload-info span .icon {
  height: 1rem;
  width: 1rem;
  background-color: #e2fcfc;
}
.product-upload-page .product-upload-container .upload-wrapper .max-upload-file {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  color: #0e8d8d;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .product-upload-container .upload-area-wrapper {
  position: relative;
  border-radius: 1rem;
  border: 2px dashed #0e8d8d;
  width: 100%;
  height: 100%;
}
.product-upload-page .product-upload-container .products-container {
  padding: 1.25rem;
  min-height: 25.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 0;
}
.product-upload-page .product-upload-container .products-container .currently-uploading {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  padding: 2.5rem 0;
}
.product-upload-page .product-upload-container .products-container .currently-uploading__item {
  max-width: 6.625rem;
}
.product-upload-page .product-upload-container .products-container .currently-uploading__item .progress-bar {
  width: 100%;
  background-color: #d3e8e9;
  height: 0.5rem;
}
.product-upload-page .product-upload-container .products-container .currently-uploading__item .progress-bar .progress {
  background-color: #abc0c0;
  height: 100%;
}
.product-upload-page .product-upload-container .products-container-center-box {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.product-upload-page .product-upload-container .products-container-center-box .upload-icon {
  background-color: #abc0c0;
  height: 2.5rem;
  width: 2.5rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}
.product-upload-page .product-upload-container .products-container .tooltip {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
}
.product-upload-page .product-upload-container .submit-container {
  border: 1px solid #d3e8e9;
  border-top: 0;
  padding: 0 0.5rem 0.5rem;
}
.product-upload-page .upload-processing-progress {
  display: grid;
  grid-template-columns: 1fr 1fr;
  max-width: 57.5rem;
  margin: auto;
}
.product-upload-page .upload-processing-progress .upload-processing-item {
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.19rem;
  border-right: 1px solid #d3e8e9;
  border-bottom: 1px solid #d3e8e9;
  align-items: flex-end;
}
.product-upload-page .upload-processing-progress .upload-processing-item span {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .upload-processing-progress .upload-processing-item img {
  width: 100%;
}
.product-upload-page .upload-processing-progress .upload-processing-item:nth-of-type(1), .product-upload-page .upload-processing-progress .upload-processing-item:nth-of-type(3n) {
  border-left: 1px solid #d3e8e9;
}
.product-upload-page .uploads-settings {
  margin: auto;
}
.product-upload-page .uploads-settings h3 {
  padding: 1.25rem;
  color: #abc0c0;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .uploads-settings .edit-all {
  border-bottom: 1px solid #d3e8e9;
}
.product-upload-page .uploads-settings .edit-all.editing .circle {
  background-color: #d3e8e9;
}
.product-upload-page .uploads-settings .edit-all .uploads-item-header {
  display: flex;
  padding: 1.25rem;
  align-items: center;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .uploads-settings .edit-all .circle {
  min-width: 0.75rem;
  min-height: 0.75rem;
  display: flex;
  border-radius: 2em;
  border: 2px solid #d3e8e9;
  transition: background-color 0.3s;
}
.product-upload-page .uploads-settings .edit-all-info {
  padding: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
.product-upload-page .uploads-settings .edit-all-info .icon {
  background-color: #abc0c0;
  height: 1rem;
  width: 1rem;
  min-width: 1rem;
}
.product-upload-page .uploads-settings .edit-all-info p {
  color: #abc0c0;
  font-family: "Azeret Mono";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}
.product-upload-page .uploads-settings .uploads-item,
.product-upload-page .uploads-settings .edit-all {
  border: 1px solid #d3e8e9;
  border-top: 0;
  transition: background-color 0.3s;
}
.product-upload-page .uploads-settings .uploads-item.editing,
.product-upload-page .uploads-settings .edit-all.editing {
  background-color: #ffffff;
}
.product-upload-page .uploads-settings .uploads-item.editing .uploads-item-header .toggle-uploads-item-settings .open-dropdown,
.product-upload-page .uploads-settings .edit-all.editing .uploads-item-header .toggle-uploads-item-settings .open-dropdown {
  opacity: 0;
  display: none;
}
.product-upload-page .uploads-settings .uploads-item.editing .uploads-item-header .toggle-uploads-item-settings .close-dropdown,
.product-upload-page .uploads-settings .edit-all.editing .uploads-item-header .toggle-uploads-item-settings .close-dropdown {
  opacity: 1;
  display: block;
}
.product-upload-page .uploads-settings .uploads-item.editing .uploads-item-body,
.product-upload-page .uploads-settings .edit-all.editing .uploads-item-body {
  max-height: 100rem;
}
.product-upload-page .uploads-settings .uploads-item-header,
.product-upload-page .uploads-settings .edit-all-header {
  gap: 0.5rem;
  padding: 0.5rem;
  padding-right: 1.25rem;
  display: flex;
  cursor: pointer;
  align-items: center;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}
.product-upload-page .uploads-settings .uploads-item-header .img-container img,
.product-upload-page .uploads-settings .edit-all-header .img-container img {
  height: 4rem;
  width: 4rem;
  display: flex;
}
.product-upload-page .uploads-settings .uploads-item-header .uploads-item__title,
.product-upload-page .uploads-settings .edit-all-header .uploads-item__title {
  align-items: center;
  display: flex;
  flex-grow: 1;
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: 3;
  font-family: "Cairo";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .uploads-settings .uploads-item-header .toggle-uploads-item-settings,
.product-upload-page .uploads-settings .edit-all-header .toggle-uploads-item-settings {
  background-color: transparent;
  position: relative;
  width: 1rem;
  height: 1rem;
  cursor: pointer;
}
.product-upload-page .uploads-settings .uploads-item-header .toggle-uploads-item-settings img,
.product-upload-page .uploads-settings .edit-all-header .toggle-uploads-item-settings img {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
}
.product-upload-page .uploads-settings .uploads-item-header .toggle-uploads-item-settings .open-dropdown,
.product-upload-page .uploads-settings .edit-all-header .toggle-uploads-item-settings .open-dropdown {
  opacity: 1;
}
.product-upload-page .uploads-settings .uploads-item-header .toggle-uploads-item-settings .close-dropdown,
.product-upload-page .uploads-settings .edit-all-header .toggle-uploads-item-settings .close-dropdown {
  opacity: 0;
}
.product-upload-page .uploads-settings .uploads-item-body,
.product-upload-page .uploads-settings .edit-all-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s;
}
.product-upload-page .uploads-settings .upload-finished-container h5 {
  text-align: center;
  border: 1px solid #d3e8e9;
  border-top: 0;
  color: #abc0c0;
  padding: 2.5rem;
  letter-spacing: 0.125rem;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.product-upload-page .uploads-settings .my-products-link {
  padding: 1.25rem;
  display: block;
  text-align: center;
  border: 1px solid #d3e8e9;
  border-top: 0;
  text-decoration: underline;
  width: 100%;
  font-family: "Cairo";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.upload-warning-popup .popup-inner {
  background-color: #000000;
  color: #e2fcfc;
  padding: 1.25rem;
}
.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: #abc0c0;
  border: 1px solid #d3e8e9;
}

@media only screen and (min-width: 768px) {
  .product-upload-page {
    padding: 0 1.25rem;
  }
  .product-upload-page .upload-processing-progress {
    grid-template-columns: repeat(2, 1fr);
    margin: 0;
  }
  .product-upload-page .upload-processing-progress .upload-processing-item:nth-of-type(2n) {
    border-right: 0;
  }
  .product-upload-page .uploads-settings {
    max-width: 30.375rem;
  }
  .product-upload-page .uploads-settings h3 {
    padding: 1.25rem 0;
  }
  .product-upload-page .uploaded-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: flex-start;
    max-width: 57.5rem;
    margin: auto;
  }
}
@media only screen and (min-width: 1280px) {
  .product-upload-page .upload-processing-progress {
    grid-template-columns: repeat(2, 1fr);
    margin: 0;
  }
  .product-upload-page .upload-processing-progress .upload-processing-item:nth-of-type(2n) {
    border-right: 0;
  }
  .upload-warning-popup .popup-inner {
    width: 50%;
    margin-left: auto;
  }
}
.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%;
}
.landing-page p {
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
}
.landing-page section .center-box {
  padding: 0 1.25rem;
}
.landing-page .hero .center-box {
  padding: 0;
}
.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;
}
.landing-page .hero .text-container {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  max-width: 22.625rem;
}
.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%;
}
.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;
}
.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;
}
.landing-page .hero .hero-imgs .empty:nth-of-type(5) {
  grid-column: 3/5;
  grid-row: 5/6;
}
.landing-page .feedback {
  background-color: #ffffff;
  padding: 5rem 0;
}
.landing-page .feedback .center-box {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.landing-page .feedback-text {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  max-width: 43.0625rem;
}
.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;
}
.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;
}
.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;
}
.landing-page .safety .safety-content {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.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;
}
.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;
}
.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;
}
.landing-page .safety .mockup-img {
  margin-top: 5rem;
  width: 87.5%;
}

.listing-title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media only screen and (min-width: 768px) {
  .landing-page .hero .center-box .hero-text {
    width: 100%;
    max-width: 1000px;
    justify-self: end;
    gap: 1.25rem;
    justify-content: space-between;
  }
  .landing-page .hero .center-box .text-container {
    padding-right: 1.25rem;
  }
  .landing-page .feedback .center-box {
    display: grid;
    grid-template-columns: 3fr 5fr;
    gap: 0;
  }
  .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 {
    flex-direction: row;
    gap: 0;
    grid-column: 1/3;
  }
  .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 img {
    width: 15rem;
  }
  .landing-page .feedback .process-item .process-text {
    padding-right: 1.25rem;
  }
  .landing-page .safety .center-box {
    display: grid;
    grid-template-columns: 3fr 5fr;
    gap: 0;
  }
  .landing-page .safety .center-box .safety-content {
    gap: 5rem;
  }
  .landing-page .safety .center-box .safety-content .grid {
    display: flex;
    width: auto;
  }
  .landing-page .safety .center-box .safety-content .grid-item {
    width: 33%;
    max-width: 10.9375rem;
  }
  .landing-page .safety .center-box .safety-content .grid-item:nth-of-type(2) {
    border-left: 0;
  }
  .landing-page .safety .center-box .safety-content .grid-item:nth-of-type(3) {
    border-left: 0;
    border-top: 1px solid #d3e8e9;
  }
  .landing-page .safety .center-box .safety-content p {
    max-width: 22.625rem;
  }
  .landing-page .safety .center-box .mockup-img {
    justify-self: center;
    width: 50%;
    grid-column: 1/3;
  }
}
@media only screen and (min-width: 1024px) {
  .landing-page h2 {
    padding-top: 0;
  }
  .landing-page section .center-box {
    max-width: 2000px;
    margin: auto;
    width: 100%;
    padding: 0 1.25rem;
  }
  .landing-page .hero .center-box {
    max-width: unset;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media only screen and (min-width: 1280px) {
  .landing-page {
    padding: 0;
  }
  .landing-page section {
    max-width: 100%;
  }
  .landing-page section .center-box {
    padding: 0 2.5rem;
  }
  .landing-page .hero .hero-imgs {
    grid-template-rows: repeat(3, 1fr);
  }
  .landing-page .hero .hero-imgs img:nth-of-type(4) {
    display: none;
  }
  .landing-page .hero .hero-imgs .empty:nth-of-type(4) {
    display: none;
  }
  .landing-page .hero .hero-imgs .empty:nth-of-type(5) {
    display: none;
  }
  .landing-page .feedback {
    padding: 5rem 0;
  }
  .landing-page .feedback .process-item .process-img img {
    width: 21.875rem;
  }
  .landing-page .safety {
    padding: 5rem 0 0;
  }
}
: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;
}

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

main {
  padding: 0 1.25rem;
}
main section {
  max-width: 2000px;
  margin: auto;
}

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

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

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

.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%;
}

.empty-btn {
  border-bottom: 1px solid transparent;
  transition: border-bottom-color 0.3s;
}

.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;
}

.open-popup {
  cursor: pointer;
}

.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;
}

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

.popup {
  position: fixed;
  width: 100%;
  z-index: 600;
}
.popup .popup-bg {
  position: absolute;
  width: 100%;
  left: 0;
  height: 100vh;
  z-index: -1;
}

.tooltip-popup {
  position: fixed;
  flex-direction: column;
  overflow: auto;
}
.tooltip-popup.active {
  inset: 0;
}
.tooltip-popup.active .popup-bg {
  position: fixed;
}
.tooltip-popup.active .popup-inner {
  display: flex;
}
.tooltip-popup .popup-bg {
  inset: 0;
  background-color: transparent;
  opacity: 0.8;
}
.tooltip-popup .popup-inner {
  position: relative;
  flex: 1;
  min-height: 100%;
  justify-content: center;
  align-items: center; /* alapból középen */
  padding: 1rem; /* ugyanaz mint az inset volt */
  pointer-events: none; /* hogy csak a wrapper legyen kattintható */
}
.tooltip-popup .popup-inner-wrapper {
  pointer-events: all;
  background-color: #000000;
  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: 600px;
  cursor: auto;
}
.tooltip-popup .popup-inner-wrapper .close-popup {
  cursor: pointer;
}
.tooltip-popup .popup-inner-wrapper .close-popup .icon {
  background-color: #d3e8e9;
}
.tooltip-popup .popup-inner-wrapper .title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tooltip-popup .popup-inner-wrapper .title-row h3 {
  padding: 0;
  font-family: "Cairo";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}
.tooltip-popup .popup-inner-wrapper img {
  width: 100%;
  height: auto;
  margin: auto;
  display: block;
}
.tooltip-popup .popup-inner-wrapper p {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}
.tooltip-popup .popup-inner-wrapper p.bold {
  font-family: "Azeret Mono";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}

.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;
}

.info-icon {
  background-color: #abc0c0;
  mask-image: url("/img/icons/info-icon.svg");
  -webkit-mask-image: url("/img/icons/info-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 */
}

.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: #abc0c0;
  mask-image: url("/img/icons/star.svg");
  -webkit-mask-image: url("/img/icons/star.svg");
}
.save-icon:hover {
  background-color: #000000;
}
.save-icon.saved {
  background-color: #000000;
  mask-image: url("/img/icons/filled-star.svg");
  -webkit-mask-image: url("/img/icons/filled-star.svg");
}

.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%;
}

.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: #abc0c0;
  border-radius: 50%;
  transition: left 0.3s, background-color 0.3s;
}
.switcher.active .switch {
  left: 50%;
  background-color: #0e8d8d;
}

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;
}

.notifications .notification {
  background-color: #d3e8e9;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: 1rem auto 1.5rem;
  align-items: center;
  padding: 0.75rem 1rem;
}
.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;
}

@media only screen and (min-width: 1024px) {
  html {
    font-size: 16px;
  }
  .notifications .notification {
    padding: 1.75rem 2.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .badge span {
    display: block;
  }
  .badge.character-badge {
    padding-right: 0.75rem;
  }
}
@media only screen and (min-width: 1280px) {
  html {
    font-size: 18px;
  }
  main {
    padding: 0 2.5rem;
  }
  .filled-btn:disabled:hover {
    opacity: 0.5;
  }
  .filled-btn:hover {
    opacity: 0.75;
  }
  .empty-btn.active:hover {
    border-bottom-color: transparent !important;
  }
  .empty-btn:hover {
    border-bottom-color: #000000 !important;
  }
}

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