:root{
  --brown-dark: #5C4033;
  --brown: #8B5E34;
  --brown-light: #DAB49D;
  --text: #1f1f1f;
  --paper: #fff;
}

.reviews-page{max-width: 1100px; margin: 0 auto; padding: 0 16px 24px;}

.page-hero{
  margin: 0 auto 18px;
  border-radius: 16px;
  padding: 24px 18px;
  color: #fff;
  background: linear-gradient(120deg, var(--brown-dark), var(--brown));
  position: relative;
  overflow: hidden;
}
.page-hero h1{margin: 0 0 6px; font-size: 1.9rem; font-weight: 800;}
.page-hero p{margin: 0; opacity: .95}
.hero-stats{display:flex; gap:10px; margin-top:10px; flex-wrap: wrap;}
.chip{
  display:inline-flex; align-items:center; gap:6px;
  background: rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.35);
  padding:6px 10px; border-radius: 999px; font-weight:700;
}

.page-actions{margin-top:10px;}
.btn{
  display:inline-block; background:#fff; color:var(--brown-dark);
  padding:8px 12px; border-radius:12px; font-weight:700; text-decoration:none;
  border: 1px solid rgba(0,0,0,.06);
}
.btn:hover{filter:brightness(1.05);}

.page-layout{
  display:grid;
  grid-template-columns: 1.7fr 1fr;
  gap: 18px;
}
@media (max-width: 900px){
  .page-layout{grid-template-columns: 1fr;}
}

.list-col{}
.form-col{position: sticky; top: 14px; align-self: start;}

.review-card{
  background: var(--paper);
  border:2px solid var(--brown);
  border-radius:14px;
  padding:12px 14px;
  box-shadow:0 6px 14px rgba(139, 94, 52, .16);
}
.review-card + .review-card{margin-top:12px;}

.review-head{display:flex; justify-content:space-between; align-items:center;}
.review-who{font-weight:800; color:var(--text); max-width:60%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.stars{color: var(--brown); letter-spacing: .5px; font-size: 18px;}
.review-comment{margin:8px 0 6px; line-height:1.45;}
.review-ts{opacity:.7; font-size:.9em;}

.form-box{
  background:#fff; border:2px solid var(--brown); border-radius:16px; padding:14px;
  box-shadow:0 8px 18px rgba(139, 94, 52, .15);
}
.form-box h2{margin:0 0 8px; color:var(--brown-dark); font-size:1.2rem;}
.form-grid{display:grid; gap:10px;}
.form-row{display:grid; grid-template-columns:1fr; gap:8px;}
input[type="text"], textarea{
  border:1px solid #cbb7a3; border-radius:10px; padding:10px 12px; font-size:16px; width:100%;
}
textarea{min-height:110px; resize:vertical;}
button[type="submit"]{
  background: var(--brown); color:#fff; border:none; border-radius:10px; padding:10px 14px; font-weight:800; cursor:pointer;
}
button[type="submit"]:hover{filter:brightness(1.05);}
.errors{color:#b00020; margin-top:6px;}

.stars-input{display:inline-flex; flex-direction: row-reverse; gap:6px;}
.stars-input input{display:none;}
.stars-input label{
  cursor:pointer; font-size:28px; color:#A47148; filter:grayscale(1) opacity(.55);
  transition: transform .1s, filter .2s;
}
.stars-input input:checked ~ label,
.stars-input label:hover,
.stars-input label:hover ~ label{filter:none; transform:scale(1.05);}

.pagination{display:flex; gap:8px; justify-content:center; margin:16px 0 6px;}
.pagination a, .pagination span{
  border:1px solid var(--brown);
  border-radius:10px; padding:6px 10px; text-decoration:none; color:var(--text); background:#fff;
}
.pagination .current{background:var(--brown-light); text-align: center;}
.empty-state{
  border:2px dashed var(--brown-light); padding:16px; border-radius:12px; text-align:center; color:#6b4a3a; background:#fff;
}

.field-error{
  color:#b00020;
  font-size:0.95rem;
  margin-top:6px;
}

:root{
  --brown-dark:#5C4033;
  --brown:#8B5E34;
}

.reviews-header{
  text-align:center;
  margin: 8px 0 18px;
}

.rating-title{
  margin:0;
  font-weight:900;
  color:var(--brown-dark);
  /* גודל גמיש: גדול בדסקטופ, נוח במובייל */
  font-size: clamp(1.6rem, 4.2vw, 2.6rem);
  line-height:1.2;
}

.rating-title .avg{
  font-weight:900;
}

.rating-title .star{
  color:var(--brown);
  font-size:1.15em;     /* כוכב קצת יותר גדול מהמספר */
  margin: 0 .25em;
}

.rating-title .count{
  font-size:.6em;       /* מונה הביקורות קטן ועדין יותר */
  color:#7b5a46;
  font-weight:700;
  margin-inline-start:.35em;
}

/* בסיס נוח למובייל */
html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

/* מסכים צרים – תני קפיצה קלה בגודל ברירת־מחדל */
@media (max-width: 520px) {
  html { font-size: 18px; }
}

/* כותרת דירוג בראש הדף */
.reviews-header { text-align: center; margin: 10px 0 18px; }
.rating-title {
  margin: 0;
  font-weight: 900;
  color: var(--brown-dark, #5C4033);
  font-size: clamp(1.4rem, 5vw, 2.2rem);
  line-height: 1.25;
}
.rating-title .star { font-size: 1.2em; color: var(--brown, #8B5E34); }
.rating-title .count { font-size: .7em; color: #7b5a46; }

/* קלפים של ביקורות */
.review-card{
  padding: clamp(14px, 4.5vw, 20px);
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(139,94,52,.15);
}
.review-head{ display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; }
.review-who{ font-weight:800; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-size: clamp(1.5rem, 4.4vw, 1.25rem);
}
.stars{ color: var(--brown, #8B5E34); letter-spacing:.5px; font-size: clamp(2rem, 5.5vw, 1.6rem); }
.review-comment{ margin:10px 0 6px; line-height:1.6; font-size: clamp(2.3rem, 4.6vw, 1.2rem); }
.review-ts{ opacity:.75; font-size: clamp(1.4rem, 3.6vw, 1rem); }

/* טופס */
.review-form h3{ margin: 18px 0 10px; font-size: clamp(1.2rem, 5vw, 1.6rem); color: var(--brown-dark, #5C4033); }
input[type="text"], textarea{
  width:100%;
  font-size: clamp(1rem, 4.4vw, 1.125rem);
  padding: 12px 14px;
  min-height: 44px;            /* יעד נגישות */
  border-radius: 12px;
}
textarea{ min-height: 120px; line-height:1.5; }
button[type="submit"]{
  font-size: clamp(1rem, 4.4vw, 1.125rem);
  padding: 12px 16px;
  min-height: 48px;
  border-radius: 12px;
}

/* כוכבים לבחירת דירוג – גדולים במגע */
.stars-input{ display:inline-flex; flex-direction:row-reverse; gap:8px; }
.stars-input input{ display:none; }
.stars-input label{
  cursor:pointer;
  font-size: clamp(28px, 9vw, 40px);
  color:#A47148;
  filter: grayscale(1) opacity(.55);
  transition: transform .1s, filter .2s;
}
.stars-input input:checked ~ label,
.stars-input label:hover,
.stars-input label:hover ~ label{
  filter:none; transform:scale(1.05);
}

/* פאג'ינציה */
.pagination{ display:flex; gap:10px; justify-content:center; margin:16px 0; }
.pagination a, .pagination span{
  padding: 10px 14px;
  font-size: clamp(.95rem, 3.8vw, 1.05rem);
  border-radius: 999px;
}

/* הגדלת אזורי לחיצה במכשירי מגע */
@media (pointer: coarse) {
  .slot-btn, .btn, .pagination a { min-height: 44px; }
}

/* --- 1) כל הביקורות באותו גודל, במיוחד האחרונה --- */
.reviews-grid{ --card-fs: clamp(14px, 0.95vw, 16px); }
.review-card{ font-size: var(--card-fs); }
.reviews-grid > .review-card:last-child{ font-size: var(--card-fs) !important; }
/* כדי שלא יהיו אלמנטים פנימיים שמגדילים לבד */
.review-card *{ font-size: inherit; }

/* --- 2) מניעת גלישה במובייל (גוגל/אימבד/טקסט ארוך) --- */
.reviews-wrap, .review-card{
  overflow-wrap: anywhere;
  word-break: break-word;
  box-sizing: border-box;
}
.review-card img,
.review-card iframe,
.review-card video{
  max-width: 100%;
  height: auto;
  display: block;
}

/* אם יש הטמעה/באנר של גוגל (התאימי לשמות המחלקות אצלך אם שונים) */
.google-embed, .google-badge, .g-review, .gmb-widget, .gmap-embed{
  max-width: 100%;
  overflow: hidden;
  display: block;
}

/* כוכבי הדירוג שלא יגלשו לרוחב במסכים צרים */
.stars-input{
  display: inline-flex;
  gap: 6px;
  max-width: 100%;
  flex-wrap: nowrap;
}
.stars-input input{           /* מסתיר את כפתורי ה-radio עצמם */
  position: absolute; inset: 0; opacity: 0; width: 1px; height: 1px;
}
.stars-input label{ line-height: 1; }

/* התאמות למסכים ממש צרים */
@media (max-width: 480px){
  .stars-input label{ font-size: 7vw; }  /* מצטמצם יפה במובייל */
  .reviews-wrap{ padding-inline: 10px; }
  .rating-title{ display: flex; flex-wrap: wrap; gap: 6px; }
}


/* === Hotfix: גדלי טקסט הגיוניים + מניעת גלישה === */

/* קונטיינר – אם ה-HTML שלך משתמש ב .reviews-wrap (לא .reviews-page) */
.reviews-wrap { max-width: 1100px; margin-inline: auto; padding: 0 16px 24px; }

/* 1) תיקון clamp הפוכים – min חייב להיות קטן מ-max */
.review-who      { font-size: clamp(0.95rem, 1.1vw, 1.25rem) !important; }
.stars           { font-size: clamp(0.90rem, 1.1vw, 1.40rem) !important; }
.review-comment  { font-size: clamp(0.95rem, 1.1vw, 1.20rem) !important; }
.review-ts       { font-size: clamp(0.75rem, 1.0vw, 0.95rem) !important; }

/* 2) שכל הכרטיסים יהיו עקביים, גם האחרונה */
.reviews-grid{ --card-fs: clamp(14px, 0.95vw, 16px); }
.review-card{ font-size: var(--card-fs) !important; }
.reviews-grid > .review-card:last-child{ font-size: var(--card-fs) !important; }
/* לאפשר לירושה לעבוד כדי שלא יהיו חריגות נקודתיות */
.review-card *{ font-size: inherit !important; }

/* 3) Flex + אליפסיס בלי גלישה לרוחב */
.review-head{ min-width: 0; }  /* מאפשר לכותרת “להישבר” אם צריך */
.review-who { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 4) מניעת גלילה אופקית ומדיה מגיבה */
html, body{ max-width: 100%; overflow-x: hidden; }
.reviews-wrap, .review-card{ box-sizing: border-box; overflow-wrap: anywhere; word-break: break-word; }
.review-card img,
.review-card iframe,
.review-card video{ max-width: 100%; height: auto; display: block; }

/* 5) וידג'טים של גוגל/אימבד – לא לחרוג מהרוחב */
.google-embed, .google-badge, .g-review, .gmb-widget, .gmap-embed{
  display:block; max-width:100%; overflow:hidden;
}

/* 6) כוכבי דירוג במובייל – גדולים אך לא שוברים שורה */
.stars-input{ display:inline-flex; flex-wrap:nowrap; gap:6px; max-width:100%; }
.stars-input input{ position:absolute; inset:0; width:1px; height:1px; opacity:0; }
.stars-input label{ line-height:1; font-size: clamp(24px, 8vw, 36px); }

/* 7) אם עדיין גדול מדי במובייל, נבטל את הגדלת הבסיס שם */
@media (max-width: 520px){
  html { font-size: 16px; }           /* היה אצלך 18px – זה מקטין מעט ובטוח */
  .reviews-wrap { padding-inline: 10px; }
  .rating-title{ display:flex; flex-wrap:wrap; gap:6px; }
}


/* 🔧 בלוק "השאירו ביקורת" לא יחרוג מהרוחב */

/* תני לעמודות ה-Grid אפשרות להצטמצם */
.page-layout{
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
}
.page-layout > *{ min-width: 0; }  /* קריטי ב-Grid כדי למנוע גלישה */

/* טור הטופס/הבלוק עצמו */
.form-col,
.review-form{
  min-width: 0;
  max-width: 100%;
}

/* ודאי שכל מה שבטופס נספר בתוך הרוחב (padding+border) */
.review-form,
.review-form *{
  box-sizing: border-box;
}

/* הטופס לעולם לא יחרוג מהרוחב */
.review-form form{ width: 100%; }
.form-box{ max-width: 100%; overflow: hidden; }

/* שדות לא יעברו את הקונטיינר */
input[type="text"],
textarea{
  max-width: 100%;
}

/* במובייל עדיף לבטל sticky אם הוא גורם לגלישה אנכית/אופקית */
@media (max-width: 900px){
  .page-layout{ grid-template-columns: 1fr; }
  .form-col{ position: static; }
}

/* חלופה: להדר fixed (תמיד מוצמד למסך) + פיצוי רווח למעלה */
body > header{ position: fixed !important; inset: 0 0 auto 0; z-index: 5000; }

.review-form { scroll-margin-top: 80px; } /* גובה ההדר הדביק שלך */

.no-reviews {
    margin-top: 60px;
    text-align: center;
    font-size: 18px;
}