/* =========================================================
   REVIEWS — unified styles (FORM + LIST + POPUP)
   Вставить в КОНЕЦ main.css
   ========================================================= */

/* ================================
   ТЮНИНГ (прозрачность / фон)
   Тут можешь играться
   ================================ */
:root{
  /* ФОН ФОРМЫ (Shortcode maclay_review_form) */
  --mrev-form-bg: rgba(43, 30, 226, 0);   /* сделай .85 /.75 если хочешь прозрачнее */
  --mrev-form-border: rgba(0,0,0,.08);

  /* ФОН КАРТОЧЕК ОТЗЫВОВ */
  --mrev-card-bg: rgba(43, 30, 226, 0);  /* сделай .85 /.75 если хочешь прозрачнее */
  --mrev-card-border: rgba(0,0,0,.12);

  /* Тени */
  --mrev-form-shadow: 0 10px 30px rgba(0,0,0,.08);
  --mrev-card-shadow: 0 10px 24px rgba(0,0,0,.06);
}

/* =========================================================
   REVIEWS — FORM (Shortcode maclay_review_form)
   ========================================================= */

.mrev-card{
  background: var(--mrev-form-bg);                 /* <-- ПРОЗРАЧНОСТЬ ФОРМЫ */
  border: 1px solid var(--mrev-form-border);      /* <-- ОКАНТОВКА ФОРМЫ */
  border-radius:18px;
  box-shadow: var(--mrev-form-shadow);
  padding:18px 18px 16px;
  margin:18px 0 10px;
  backdrop-filter: blur(4px); /* если не нравится — удали строку */
}

.mrev-card__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}

.mrev-head{
  font-size:16px;
  font-weight:600;
  color:#222;
  margin:0;
}

.mrev-ratingbar{
  font-size:14px;
  font-weight:500;
  color:#222;
  white-space:nowrap;
  margin-top:2px;
}

.mrev-ratingbar__star{
  color:#f2c200;
  margin:0 6px;
}

.mrev-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin:0 0 26px;
}

.mrev-meta__found{
  font-size:14px;
  color:#333;
  opacity:.9;
  white-space:nowrap;
}

.mrev-meta__perpage select{
  border:0;
  background:transparent;
  font-size:14px;
  cursor:pointer;
  outline:none;
  padding:4px 6px;
  border-radius:8px;
}

.mrev-meta__perpage select:hover{
  background:rgba(0,0,0,.04);
}

.mrev-form{
  display:grid;
  grid-template-columns:180px 1fr;
  gap:18px;
  align-items:start;
}

.mrev-left{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:10px;
  padding:6px 6px 0;
}

.mrev-avatar{
  width:88px;
  height:88px;
  border-radius:50%;
  overflow:hidden;
  background:#f3f6f6;
  display:flex;
  align-items:center;
  justify-content:center;
}

.mrev-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.mrev-change-avatar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#0e0866;
  font-size:14px;
  cursor:pointer;
  margin:0;
}

.mrev-right input[type="text"],
.mrev-right textarea{
  width:100%;
  border:1px solid rgba(0,0,0,.12);
  border-radius:10px;
  padding:12px 14px;
  font-size:14px;
  outline:none;
  background:rgba(255,255,255,.95);
}

.mrev-row--top{
  display:grid;
  grid-template-columns:260px 1fr 300px;
  gap:14px;
  align-items:center;
}

.mrev-right textarea{
  min-height:110px;
  resize:vertical;
  margin-top:12px;
}

.mrev-rating{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.mrev-rating__label{
  font-size:14px;
  color:#333;
  white-space:nowrap;
}

.mrev-stars{
  display:flex;
  flex-direction:row-reverse;
  gap:4px;
}

.mrev-stars input{ display:none; }

.mrev-stars label{
  font-size:18px;
  color:#c9c9c9;
  cursor:pointer;
  line-height:1;
}

.mrev-stars input:checked ~ label,
.mrev-stars label:hover,
.mrev-stars label:hover ~ label{
  color:#f2c200;
}

.mrev-row--bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:12px;
}

.mrev-submit{
  margin-left:auto;
  border:0;
  border-radius:14px;
  padding:14px 18px;
  background:linear-gradient(135deg, #2f32ff, #24068d);
  color:#fff;
  display:flex;
  align-items:center;
  gap:14px;
  cursor:pointer;
  min-width:240px;
  justify-content:space-between;
  box-shadow:0 10px 22px rgba(36,6,141,.20);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.mrev-submit:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 26px rgba(36,6,141,.26);
  filter:saturate(1.05);
}

.mrev-arrow{ font-size:18px; }

.mrev-msg{
  margin:10px 0 12px;
  padding:10px 12px;
  border-radius:10px;
  font-size:14px;
}

.mrev-msg--ok{ background:#eaffea; color:#145214; }
.mrev-msg--err{ background:#ffecec; color:#7a1414; }

/* FORM responsive */
@media (max-width: 1100px){
  .mrev-row--top{ grid-template-columns:1fr; }
  .mrev-rating{ justify-content:flex-start; }
}

@media (max-width: 860px){
  .mrev-card__top{
    flex-direction:column;
    align-items:flex-start;
  }

  .mrev-form{ grid-template-columns:1fr; }

  .mrev-left{
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    text-align:left;
    padding:0;
    gap:14px;
  }

  .mrev-change-avatar{ align-self:center; }

  .mrev-submit{
    min-width:0;
    width:100%;
  }

  .mrev-meta{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }
}

@media (max-width: 520px){
  .mrev-left{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }
}

/* =========================================================
   REVIEWS PAGE — LIST (cards)
   ========================================================= */

.main .reviews-page{
  margin:70px 0;
}

.main .reviews-page .title-text{
  margin:36px 0 72px;
}

.main .reviews-page .review{
  margin-bottom:16px;
}

/* Карточка отзыва */
.main .reviews-page .review-block{
  background: var(--mrev-card-bg);                  /* <-- ПРОЗРАЧНОСТЬ КАРТОЧКИ */
  border: 1px solid var(--mrev-card-border);       /* <-- ОКАНТОВКА КАРТОЧКИ */
  box-shadow: var(--mrev-card-shadow);
  padding:35px 32px;
  border-radius:64px;

  display:flex;
  flex-direction:column;
  gap:14px;

  backdrop-filter: blur(4px); /* если не нравится — удали */
}

/* Аватар всегда круглый */
.main .reviews-page .review-block .user-photo{
  width:76px;
  height:76px;
  border-radius:50% !important;
  object-fit:cover;
  display:block;
  flex:0 0 auto;
  overflow:hidden;
}

/* Верх карточки: аватар + блок меты справа */
.main .reviews-page .review-top{
  display:flex;
  align-items:flex-start;
  gap:14px;
}

/* Мета: дата+источник / рейтинг / имя (как ты просил) */
.main .reviews-page .review-meta{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.main .reviews-page .review-meta__top{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:20px;
  font-weight:500;
}

.main .reviews-page .review-meta__stars{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:2px;
}

.main .reviews-page .review-meta__stars img{
  width:18px;
  height:18px;
  display:block;
}

.main .reviews-page .review-meta__name{
  font-size:20px;
  font-weight:600;
  text-decoration:underline;
}

.main .reviews-page .review-block .review-text{
  font-size:16px;
  line-height:24px;
  color:#777;
}

.main .reviews-page .review-block .photos-attached_text{
  font-size:16px;
  color:#054b6f;
  margin-top:16px;
}

/* Шахматка 60/40 + reverse */
.main .reviews-page .reviews-item{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  align-items:stretch;
}

.main .reviews-page .reviews-item.is-reversed{
  flex-direction:row-reverse;
}

.main .reviews-page .review.w-60{ flex:0 0 calc(60% - 8px); }
.main .reviews-page .review.w-40{ flex:0 0 calc(40% - 8px); }

/* Кнопка "Развернуть" */
.main .reviews-page .review-more{
  border:0;
  background:transparent;
  color:#054b6f;
  cursor:pointer;
  padding:0;
  width:max-content;
  font-size:14px;
}

.main .reviews-page .review-more:hover{
  text-decoration:underline;
}

/* Фото: стопка маленьких превью (без блюра) */
.main .reviews-page .review-photos-stack{
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;

  position:relative;
  width:92px;
  height:92px;
}

.main .reviews-page .review-photos-stack__layer{
  position:absolute;
  inset:0;
  border-radius:16px;
  overflow:hidden;
  background:#eef2f2;

  transform:translate(calc(var(--i) * 8px), calc(var(--i) * -6px));
  box-shadow:0 10px 24px rgba(0,0,0,.10);
}

.main .reviews-page .review-photos-stack__layer img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.main .reviews-page .review-photos-stack__count{
  position:absolute;
  right:-10px;
  bottom:-10px;
  min-width:28px;
  height:28px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(0,0,0,.65);
  color:#fff;
  font-size:13px;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 8px 18px rgba(0,0,0,.18);
}

/* "Показать ещё" */
.main .reviews-page .show-more-reviews{
  margin:72px auto 0;
  width:312px;
  border-radius:32px;
  padding:5px 5px 5px 33px;
  display:flex;
  justify-content:space-between;
  background: var(--mrev-card-bg) !important;       /* <-- тоже можно сделать прозрачнее */
  border: 1px solid var(--mrev-card-border) !important;
}

.main .reviews-page .show-more-reviews a{
  display:flex;
  align-items:center;
}

.main .reviews-page .show-more-reviews img{
  display:block !important;
}

.main .reviews-page .show-more-reviews::after{
  display:none !important;
}

/* LIST responsive */
@media (max-width: 1199px){
  .main .reviews-page .review{
    width:100% !important;
  }

  .main .reviews-page .review.w-60,
  .main .reviews-page .review.w-40{
    flex:0 0 100%;
  }

  .main .reviews-page .reviews-item,
  .main .reviews-page .reviews-item.is-reversed{
    flex-direction:column;
  }
}

@media (max-width: 576px){
  .main .reviews-page .review-photos-stack{
    width:80px;
    height:80px;
  }
}

/* =========================================================
   POPUP gallery
   ========================================================= */

html.mrev-lock,
html.mrev-lock body{
  overflow:hidden;
}

.mrev-gallery{
  position:fixed;
  inset:0;
  z-index:9999;
}

.mrev-gallery__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.55);
}

.mrev-gallery__panel{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:min(980px, calc(100vw - 24px));
  height:min(720px, calc(100vh - 24px));
  background:#fff;
  border-radius:18px;
  overflow:hidden;

  display:grid;
  grid-template-columns:64px 1fr 64px;
  align-items:stretch;
}

.mrev-gallery__close{
  position:absolute;
  right:12px;
  top:10px;
  border:0;
  background:rgba(0,0,0,.06);
  width:40px;
  height:40px;
  border-radius:12px;
  cursor:pointer;
  font-size:24px;
  line-height:1;
}

.mrev-gallery__nav{
  border:0;
  background:transparent;
  cursor:pointer;
  font-size:44px;
  opacity:.75;
}

.mrev-gallery__nav:hover{ opacity:1; }

.mrev-gallery__stage{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
}

.mrev-gallery__img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  display:block;
}

.mrev-gallery__counter{
  position:absolute;
  left:14px;
  bottom:12px;
  background:rgba(0,0,0,.55);
  color:#fff;
  padding:6px 10px;
  border-radius:10px;
  font-size:14px;
}

/* =========================================================
   ACCOUNT overrides
   ========================================================= */

.page-template-page-account .mrev-card{
  background:transparent;
  box-shadow:none;
  border:0;
  padding:0;
  backdrop-filter:none;
}

.page-template-page-account .mrev-meta{
  display:none !important;
}

/* =========================================================
   REVIEWS FORM — Mobile fixes (чтобы ничего не разъезжалось)
   Вставить В КОНЕЦ блока REVIEWS
   ========================================================= */

@media (max-width: 860px){

  /* контейнер не должен раздуваться */
  .mrev-card,
  .mrev-form,
  .mrev-right,
  .mrev-row--top{
    min-width:0;
  }

  /* форма одной колонкой */
  .mrev-form{
    grid-template-columns:1fr !important;
  }

  /* верх: аватар + "изменить аватар" не должны распирать */
  .mrev-left{
    flex-direction:row !important;
    align-items:center;
    justify-content:flex-start;
    gap:12px;
    padding:0;
  }

  .mrev-change-avatar{
    max-width:100%;
    white-space:normal;
    text-align:left;
  }

  /* ТРИ поля сверху должны стать одним столбцом */
  .mrev-row--top{
    grid-template-columns:1fr !important;
    gap:10px;
  }

  /* Рейтинг внутри формы: переносим, чтобы не уходил вправо */
  .mrev-rating{
    justify-content:flex-start !important;
    flex-wrap:wrap;
    gap:8px;
  }

  .mrev-rating__label{
    white-space:normal !important;  /* важное: убираем "в одну строку" */
    line-height:1.2;
  }

  /* Инпуты и textarea точно не шире контейнера */
  .mrev-right input[type="text"],
  .mrev-right textarea{
    max-width:100%;
    width:100%;
    box-sizing:border-box;
  }

  /* Низ формы: файл + кнопка — в столбик */
  .mrev-row--bottom{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }

  .mrev-submit{
    width:100%;
    min-width:0;
  }

  /* Верх карточки формы (заголовок + рейтинг агенства) — тоже перенос */
  .mrev-card__top{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }

  .mrev-ratingbar{
    white-space:normal;     /* чтобы "Рейтинг турагентства: ★ 5.0" переносился */
    line-height:1.2;
  }

  /* блок "Найдено / на странице" в столбик */
  .mrev-meta{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }
}

/* На совсем мелких — аватар сверху, чтобы было красиво */
@media (max-width: 520px){
  .mrev-left{
    flex-direction:column !important;
    align-items:flex-start;
  }
}