/* Shared design tokens + accessibility baseline. See ../DESIGN.md */
:root {
  --red: #B91C1C; --red-light: #DC2626; --red-soft: #FEE2E2; --red-tint: #FFF5F5;
  --dark: #1a1a1a; --mid: #4a4a4a; --subtle: #6b6b6b;
  --border: #ddd; --border-strong: #ccc; --track: #e5e5e5;
  --bg: #f5f5f3; --white: #ffffff; --card: #ffffff; --section-bg: #fafaf8;
  --green: #15803d; --amber: #b45309; --info: #1e3a5f;
  /* האדום של לוגו LEVTLV: רק לסמן המותג (קו, סמל), לא לכפתורים */
  --brand-red: #E40F16;
}

/* Visible keyboard focus everywhere (page rules no longer suppress outlines). */
:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline-offset: 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* תמונה שנבחרה בטופס, עם כפתור הסרה (createPhotoPicker ב-common.js) */
.photo-thumb { position: relative; display: inline-block; }
.photo-remove { position: absolute; top: -8px; inset-inline-end: -8px; width: 26px; height: 26px; border-radius: 50%; border: 2px solid #fff;
  background: var(--dark); color: #fff; font-size: 12px; line-height: 1; padding: 0; cursor: pointer; }

/* הודעת "הפרטים מולאו מהפעם הקודמת" בטפסי הדיירים (common.js) */
.profile-note { font-size: 0.88rem; color: var(--mid); background: var(--section-bg); border: 1px solid var(--border); border-radius: 8px; padding: 0.6rem 0.9rem; margin-bottom: 1rem; }
.profile-clear { background: none; border: none; padding: 0; color: var(--red); font: inherit; font-weight: 600; text-decoration: underline; cursor: pointer; }

/* הודעת "השם לא משויך לדירה" בטפסים, עם בקשה לנציגות (showNotListed ב-common.js) */
.resident-box { background: var(--red-tint); border: 1px solid var(--red-soft); border-inline-start: 4px solid var(--red); border-radius: 8px; padding: 0.9rem 1rem; margin: 0 0 1.2rem; }
.resident-box-text { font-weight: 600; color: var(--dark); margin: 0 0 0.4rem; }
.resident-box-hint { font-size: 0.86rem; color: var(--mid); margin: 0.3rem 0 0; }
.resident-box-status { font-size: 0.9rem; font-weight: 600; color: var(--green); margin: 0.5rem 0 0; }
.resident-box-status:empty { display: none; }
.resident-box-btn { margin-top: 0.5rem; background: var(--white); color: var(--red); border: 1.5px solid var(--red); border-radius: 8px; padding: 0.5rem 1rem; min-height: 40px; font: inherit; font-weight: 700; cursor: pointer; }
.resident-box-btn:hover:not(:disabled) { background: var(--red); color: #fff; }
.resident-box-btn:disabled { opacity: 0.6; cursor: default; }
/* המשך הטופס כשהשם לא זוהה (lockAfterBox): אפור ולא לחיץ */
.form-locked { opacity: 0.4; filter: grayscale(1); pointer-events: none; user-select: none; transition: opacity 0.2s; }
/* שדה מלכודת למנועים: לא נראה ולא נגיש, בלי להזיז את הדף (לא left שלילי: בעמוד מימין לשמאל זה יוצר גלילה) */
/* !important: כללי השדות של כל טופס (input { width: 100% }) לא יגברו עליו */
.resident-box-trap { position: absolute !important; width: 1px !important; height: 1px !important; min-width: 0 !important; padding: 0 !important; margin: -1px !important; border: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; }

/* ---------- מעטפת LEVTLV: כותרת ותחתית משותפות (siteHeader / siteFooter ב-common.js) ---------- */
.site-header { background: var(--white); border-top: 3px solid var(--brand-red); border-bottom: 1px solid var(--border); }
/* הכותרת לא מתהפכת עם השפה: הלוגו תמיד מימין ובורר השפות משמאל */
.site-header-inner { direction: rtl; max-width: 960px; margin: 0 auto; padding: 0.6rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display: inline-flex; flex-direction: column; gap: 4px; flex-shrink: 0; color: var(--dark); text-decoration: none; }
.brand img { display: block; height: 38px; width: auto; }
.brand-place { display: flex; align-items: center; gap: 6px; font-family: "Assistant", sans-serif; font-size: 11px; font-weight: 500; line-height: 1; letter-spacing: 0.18em; white-space: nowrap; }
.brand-place::before, .brand-place::after { content: ""; flex: 1; height: 1.5px; background: var(--brand-red); }
.lang-switch { display: flex; gap: 6px; direction: ltr; }
.lang-switch button { background: none; border: 1px solid var(--border); border-radius: 20px; padding: 5px 14px; min-height: 36px; cursor: pointer; font-family: "Assistant", sans-serif; font-size: 13px; color: var(--mid); transition: all 0.15s; }
.lang-switch button.active { background: var(--red); color: #fff; border-color: var(--red); }
.lang-short { display: none; }
@media (max-width: 520px) {
  .site-header-inner { padding: 0.5rem 0.9rem; }
  .brand img { height: 30px; }
  .brand-place { font-size: 10px; letter-spacing: 0.12em; }
  .lang-switch button { padding: 5px 0; min-width: 40px; }
  .lang-long { display: none; }
  .lang-short { display: inline; }
}

/* ראש הדף בדפים הפנימיים: חזרה לדף הראשי ושם השירות */
.page-head { max-width: 560px; margin: 0 auto; padding: 0.9rem 1.2rem 0; }
.home-link { display: inline-block; font-size: 0.88rem; color: var(--mid); text-decoration: none; }
.home-link:hover { color: var(--red); }
.page-title { font-family: "Playfair Display", serif; font-size: 1.7rem; font-weight: 600; line-height: 1.25; margin-top: 0.35rem; color: var(--dark); }
@media (max-width: 600px) { .page-title { font-size: 1.45rem; } }

.site-footer { text-align: center; padding: 1.4rem 1rem 2rem; border-top: 1px solid var(--border); color: var(--subtle); font-family: "Assistant", sans-serif; font-size: 0.82rem; line-height: 1.6; }
.site-footer strong { color: var(--dark); font-weight: 700; letter-spacing: 0.04em; }
