/* ======================================================================
   Legal-text layout for the regulation pages (תקנות התכנון והבנייה).

   WHY A DEDICATED SHEET
   These pages carry verbatim statutory text, which has different needs
   from the marketing pages: dense numbered hierarchy, stable anchors, and
   above all SCREENSHOT-ABILITY. Inspectors screenshot a single section and
   paste it into a defect report, so every section card has to be compact
   AND self-identifying: it names the regulation and the part it came from,
   so the screenshot still makes sense once it is out of context.

   Deliberately tight spacing: a part can run to hundreds of sections, and
   airy cards would turn a reference document into endless scrolling.
   ====================================================================== */

.law-wrap { max-width: 860px; margin: 0 auto; }

/* ---------- compact table of contents at the top of a part ---------- */
.law-idx {
  background: #f7f8fb;
  border: 1px solid #e6e9f0;
  border-radius: 12px;
  padding: 12px 15px;
  margin: 16px 0 20px;
}
.law-idx h2 { font-size: .95rem; margin: 0 0 8px; color: #0F1B3E; }
.law-idx ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px 16px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.law-idx li { font-size: .87rem; line-height: 1.5; }
.law-idx a { color: #2743b3; text-decoration: none; }
.law-idx a:hover { text-decoration: underline; }
.law-idx .law-idx__n { color: #98a0b0; font-family: "JetBrains Mono", monospace; font-size: .82em; margin-inline-end: 4px; }

/* ---------- structural headings ---------- */
.law-perek {
  font-size: 1.1rem;
  margin: 30px 0 4px;
  padding: 7px 12px;
  background: #0F1B3E;
  color: #fff;
  border-radius: 9px;
  scroll-margin-top: 88px;
}
.law-siman {
  font-size: .98rem;
  margin: 22px 0 4px;
  padding-bottom: 5px;
  border-bottom: 2px solid #e6e9f0;
  color: #0F1B3E;
  scroll-margin-top: 88px;
}
.law-perek:first-child, .law-siman:first-of-type { margin-top: 8px; }

/* ---------- one section (סעיף / פרט) = one screenshot unit ---------- */
.law-seif {
  margin: 9px 0;
  padding: 10px 13px;
  background: #fff;
  border: 1px solid #e6e9f0;
  border-radius: 10px;
}
.law-seif__h {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: .97rem;
  margin: 0 0 6px;
  line-height: 1.45;
  color: #0F1B3E;
  scroll-margin-top: 88px;
}
.law-seif__t { flex: 1 1 auto; }
.law-seif__n {
  flex: 0 0 auto;
  font-family: "JetBrains Mono", monospace;
  font-weight: 700;
  background: #eef1fb;
  color: #2743b3;
  padding: 1px 7px;
  border-radius: 6px;
  font-size: .86em;
}
/* Context label: what makes a lone screenshot readable. */
.law-seif__ctx {
  flex: 0 0 auto;
  font-size: .67rem;
  font-weight: 600;
  color: #a2a9b8;
  white-space: nowrap;
}

/* ---------- numbered body hierarchy ---------- */
.law-row { display: flex; gap: 7px; line-height: 1.72; margin: 3px 0; font-size: .93rem; }
.law-l0 { padding-inline-start: 0; }
.law-l1 { padding-inline-start: 18px; }
.law-l2 { padding-inline-start: 38px; }
.law-l3 { padding-inline-start: 58px; }
.law-l4 { padding-inline-start: 78px; }
.law-mk { flex: 0 0 auto; font-weight: 600; color: #2743b3; min-width: 24px; }
.law-tx { flex: 1 1 auto; }
.law-def { margin: 2px 0; }
.law-note { color: #8a8f9c; font-style: italic; }
.law-center { display: block; text-align: center; font-weight: 600; }
.law-seif a { color: #2743b3; text-decoration: none; border-bottom: 1px dashed currentColor; }
.law-seif a:hover { background: #eef1fb; }

/* ---------- statutory data tables (minimum heights, areas, occupancy) ----------
   Wide tables scroll inside their own box so the page body never scrolls. */
.law-tablewrap { overflow-x: auto; margin: 8px 0; -webkit-overflow-scrolling: touch; }
.law-tablewrap table { border-collapse: collapse; width: 100%; min-width: 320px; font-size: .89rem; }
.law-tablewrap th, .law-tablewrap td {
  border: 1px solid #e0e4ee;
  padding: 6px 9px;
  text-align: right;
  vertical-align: top;
  line-height: 1.6;
}
.law-tablewrap th { background: #f2f4fa; font-weight: 700; color: #0F1B3E; }
.law-tablewrap tr:nth-child(even) td { background: #fafbfd; }
.law-tablewrap small { color: #7d8496; font-weight: 600; }

/* Inline fraction (thermal resistance units, etc.). */
.law-frac { display: inline-flex; flex-direction: column; text-align: center; vertical-align: middle; font-size: .85em; line-height: 1.18; margin: 0 .25em; }
.law-frac .law-den { border-top: 1px solid currentColor; }

/* ---------- official diagrams (חלק ג׳: stair geometry, headroom, door swing) ---------- */
.law-fig {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 8px auto 4px;
  background: #fff;
  border: 1px solid #e0e4ee;
  border-radius: 8px;
  padding: 6px;
}
.law-center { display: block; text-align: center; font-weight: 600; margin: 8px 0; }
.law-big { font-size: 1.08em; font-weight: 700; }

/* ---------- source + disclaimer boxes ---------- */
.law-src {
  background: #eef1fb;
  border: 1px solid #dfe4f5;
  border-radius: 12px;
  padding: 11px 15px;
  margin: 14px 0;
  font-size: .9rem;
  line-height: 1.65;
}
.law-src a { color: #2743b3; }
.law-disc {
  font-size: .86rem;
  color: #5c6270;
  background: #fbfaf6;
  border: 1px solid #ece7d8;
  border-radius: 11px;
  padding: 10px 14px;
  margin: 16px 0;
  line-height: 1.65;
}

/* ---------- part index cards (hub page) ---------- */
.law-parts { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 9px; grid-template-columns: repeat(auto-fill, minmax(265px, 1fr)); }
.law-parts li { margin: 0; }
.law-parts a {
  display: block;
  padding: 10px 13px;
  background: #fff;
  border: 1px solid #e6e9f0;
  border-radius: 10px;
  text-decoration: none;
  color: #0F1B3E;
  line-height: 1.45;
  height: 100%;
}
.law-parts a:hover { border-color: #2743b3; background: #f7f8fb; }
.law-parts b { display: block; font-size: .93rem; }
.law-parts span { display: block; font-size: .78rem; color: #7d8496; margin-top: 2px; }
.law-parts .law-off { color: #a2a9b8; }

@media (max-width: 640px) {
  .law-seif { padding: 9px 11px; }
  .law-seif__ctx { display: none; }
  .law-l1 { padding-inline-start: 12px; }
  .law-l2 { padding-inline-start: 26px; }
  .law-l3 { padding-inline-start: 40px; }
  .law-l4 { padding-inline-start: 54px; }
}
