@charset "UTF-8";
/* ==========================================================================
   Вхід в особистий кабінет - Figma «Submenu» 2351:120205 (ПК 530x576)
   і 2346:82063 (моб 390x732). Підключає модуль хедера.
   ========================================================================== */
.v-auth .modal-dialog {
  max-width: 530px;
  margin: var(--space-4) auto;
}

.v-auth__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-4);
  background: var(--c-white);
  border: 0;
  border-radius: 0;
}

.v-auth__main {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.v-auth__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  min-height: 44px;
}

.v-auth__title {
  font: var(--t-subtitle);
  letter-spacing: var(--t-subtitle-ls);
  color: var(--c-text);
}

.v-auth__fields {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

/* «Забули пароль?» - праворуч під полями (Figma 2351:120218) */
.v-auth__forgot {
  align-self: flex-end;
  font: var(--t-subbody);
  letter-spacing: var(--t-subbody-ls);
  color: var(--c-primary);
}

.v-auth__buttons {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

/* розділювач «або»: лінія - текст - лінія (Figma «Adv divider») */
.v-auth__or {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  min-height: 16px;
}

.v-auth__or .v-divider {
  flex: 1 0 0;
}

.v-auth__or-text {
  font: var(--t-subbody);
  letter-spacing: var(--t-subbody-ls);
  color: var(--c-text-muted);
}

.v-auth__bottom {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  min-height: 40px;
  margin: 0;
  padding: var(--space-2) 0;
  font: var(--t-body);
  letter-spacing: var(--t-body-ls);
  color: var(--c-text);
}

.v-auth__bottom a {
  color: var(--c-primary);
}

/* Моб (Figma 2346:82063): не по центру, а шторкою знизу на всю ширину */
@media (max-width: 1023.98px) {
  .v-auth .modal-dialog {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    max-width: none;
    margin: 0;
  }
}
/* --- Оцінка зірками в модалці відгуку (форми в макеті немає, NOTES п. 40) --- */
.v-rate {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.v-rate__label {
  font: var(--t-subbody-medium);
  letter-spacing: var(--t-subbody-ls);
  color: var(--c-text);
}

/* зірки в зворотному порядку, щоб підсвічувати «до наведеної» самим CSS */
.v-rate__stars {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
}

.v-rate__input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.v-rate__star {
  display: flex;
  padding: 2px;
  color: var(--c-grey-light);
  cursor: pointer;
  transition: color var(--dur-fast) var(--ease-out);
}

.v-rate__input:checked ~ .v-rate__star,
.v-rate__star:hover,
.v-rate__star:hover ~ .v-rate__star {
  color: var(--c-star, var(--c-primary));
}

.v-rate__input:focus-visible + .v-rate__star {
  outline: 2px solid var(--c-primary);
  outline-offset: 2px;
}