.feedback-open {
  padding: 10px 15px;
  font-size: 18px;
  width: fit-content;
  margin-left: auto;
  color: white !important;
  border: 1px solid white;
  /*border-radius: 8px;*/
  cursor: pointer;
  background: rgba(255, 255, 255, 0);
  transition: .4s;
}

.feedback-open:hover {
  background: rgba(255, 255, 255, 0.4);
}

.feedback-close {
  position: absolute;
  right: 40px;
  top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  cursor: pointer;
  transform: rotate(45deg);
}

.feedback-close span {
  display: block;
  width: 18px;
  height: 2px;
  background: #274f43;
}

.feedback-close span:first-child {
  position: absolute;
  transform: rotate(90deg);
}

.feedback-modal {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  height: 100vh;
  width: 350px;
  padding: 40px 20px;
  background: white;
  transform: translateX(100%);
  transition: .6s;
}

.feedback-modal__title {
  font-size: 24px;
  font-weight: 500;
  color: black;
  text-align: center;
}

.feedback-modal__text {
  font-size: 18px;
  font-weight: 400;
  color: #939f91;
  text-align: center;
  margin-bottom: 40px;
}

.feedback-modal textarea, .feedback-modal input {
  width: 100%;
  border: 1px solid #274f43;
  border-radius: 12px;
  padding-left: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
  color: black;
  font-size: 18px;
  min-height: 40px;
}

.feedback-modal button[type="submit"] {
  font-size: 18px;
  font-weight: 500;
  color: white;
  border: 1px solid #274f43;
  border-radius: 12px;
  background: #274f43;
  padding: 8px 12px;
  margin-left: auto;
  margin-right: auto;
  transition: .4s;
  white-space: nowrap;
}

.feedback-modal button[type="submit"]:hover {
  color: #274f43;
  background: white;
}

.feedback-modal--active {
  overflow: hidden;
  padding-right: 17px;
}

.feedback-modal--active .feedback-modal {
  transform: translateY(0%);
}

.payment-systems {
  display: flex;
  justify-content: center;
  width: 100%;
  gap: 20px;
  padding: 20px;
  margin-top: 80px;
}

.payment-systems svg {
  fill: white;
}

.footer-contacts {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.footer-contacts .footer-contacts--date {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.footer-contacts--date, .footer-contacts--tel, .footer-contacts--mail {
  position: relative;
  padding-left: 24px;
}

.footer-contacts--date:before {
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 17 17'%3E%3Cpath d='M8.5 17A8.5 8.5 0 1117 8.5 8.51 8.51 0 018.5 17zm0-16A7.5 7.5 0 1016 8.5 7.51 7.51 0 008.5 1z' fill='white'%3E%3C/path%3E%3Cpath d='M8.5 9a.5.5 0 01-.5-.5v-5a.5.5 0 011 0v5a.5.5 0 01-.5.5z' fill='white'%3E%3C/path%3E%3Cpath d='M11.5 9h-3a.5.5 0 010-1h3a.5.5 0 010 1z' fill='white'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  width: 17px;
  height: 17px;
}

.footer-contacts--tel:before {
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='15.99' viewBox='0 0 16 15.99' data-v-29917f43=''%3E%3Cpath d='M12 16a3.51 3.51 0 01-2-.62 43.61 43.61 0 01-5.26-4.09A43.58 43.58 0 01.62 6 3.52 3.52 0 011 1.49L2.2.29a1.09 1.09 0 011.5 0l2 2a1.06 1.06 0 010 1.5l-.86.86a.7.7 0 00-.1.87 19 19 0 002.48 3.25 19 19 0 003.26 2.45.7.7 0 00.87-.1l.44-.44.42-.42a1.36 1.36 0 01.21-.26h.08a1 1 0 011.14.25l2 2a1.06 1.06 0 010 1.5L14.49 15A3.52 3.52 0 0112 16zM3 1L1.74 2.2a2.52 2.52 0 00-.3 3.21 42.75 42.75 0 004 5.16 43 43 0 005.11 4 2.53 2.53 0 003.23-.29L15 13l-2.42-1.73-.58.56a1.7 1.7 0 01-2.09.25A20 20 0 016.53 9.5 20.06 20.06 0 013.9 6a1.7 1.7 0 01.25-2.09L5 3.08z' fill='white'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
}

.footer-contacts--mail:before {
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' viewBox='0 0 16 12' data-v-29917f43=''%3E%3Cpath d='M15 12H1a1 1 0 01-1-1V1a1 1 0 011-1h14a1 1 0 011 1v10a1 1 0 01-1 1zM1 1v10h14V1H1zm0-.5V1 .5z' fill='white'%3E%3C/path%3E%3Cpath d='M8 7.33a1.5 1.5 0 01-.77-.21l-7-4.19a.5.5 0 11.53-.86l7 4.19a.5.5 0 00.52 0l7-4.19a.5.5 0 11.51.86l-7 4.19a1.5 1.5 0 01-.79.21z' fill='white'%3E%3C/path%3E%3C/svg%3E");  background-repeat: no-repeat;
  width: 16px;
  height: 12px;
}

.error-container {
  display: none;
  flex-direction: column;
  align-items: center;
  margin-bottom: 40px;
}

.error-container img {
  width: 40%;
  margin-bottom: 20px;
  object-fit: contain;
}

.error-container .title {
  font-size: 24px;
  color: rgba(253, 58, 50, 0.65);
  font-weight: bold;
  margin-bottom: 16px;
}

.error-container .text {
  font-size: 18px;
  color: black;
}

.error .error-container {
  display: flex;
}
