/* ==========================================================================
   Cross-design fixes — loaded after assets/presets/{id}.css (design-skins.php).
   1. Mobile menu panel: explicit background + contrasting text in EVERY preset
      (preset rules that recolour header/nav links must not leak in).
   2. RTL phone / email alignment: keep LTR digit order, align with RTL flow.
   ========================================================================== */

/* ── 1. Mobile menu panel ─────────────────────────────────────────────── */
/* Panel palette per colour scheme (Settings → תפריט מובייל).
   Colours are mixed with a fixed dark / light base so the result stays dark
   (or light) whatever the preset's tokens are → contrast always ≥ 7:1. */
body #mobile-nav.mobile-nav {
  --zg-mp-bg: color-mix(in srgb, var(--color-primary, #334155) 12%, #0b0d12);
  --zg-mp-fg: #ffffff;
  --zg-mp-fg-soft: rgba(255, 255, 255, .86);
  --zg-mp-hover: color-mix(in srgb, var(--color-primary, #60a5fa) 35%, #ffffff);
  --zg-mp-line: rgba(255, 255, 255, .14);
  --zg-mp-close-bg: rgba(255, 255, 255, .12);
}
body.zg-mnav-c-light #mobile-nav.mobile-nav {
  --zg-mp-bg: color-mix(in srgb, var(--color-bg, #ffffff) 15%, #ffffff);
  --zg-mp-fg: #14161a;
  --zg-mp-fg-soft: #2b2f36;
  --zg-mp-hover: color-mix(in srgb, var(--color-primary, #1d4ed8) 55%, #000000);
  --zg-mp-line: rgba(0, 0, 0, .12);
  --zg-mp-close-bg: rgba(0, 0, 0, .07);
}
body.zg-mnav-c-white #mobile-nav.mobile-nav {
  --zg-mp-bg: #ffffff;
  --zg-mp-fg: #111111;
  --zg-mp-fg-soft: #2b2f36;
  --zg-mp-hover: color-mix(in srgb, var(--color-primary, #1d4ed8) 55%, #000000);
  --zg-mp-line: rgba(0, 0, 0, .12);
  --zg-mp-close-bg: rgba(0, 0, 0, .07);
}

body #mobile-nav.mobile-nav {
  background: var(--zg-mp-bg) !important;
  background-image: none !important;
  color: var(--zg-mp-fg) !important;
}
body #mobile-nav.mobile-nav a,
body #mobile-nav.mobile-nav a *,
body #mobile-nav.mobile-nav li,
body #mobile-nav.mobile-nav span,
body #mobile-nav.mobile-nav a[href^="tel:"],
body #mobile-nav.mobile-nav .submenu-toggle {
  color: var(--zg-mp-fg) !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
  opacity: 1;
}
body #mobile-nav.mobile-nav a { background: transparent !important; }
body #mobile-nav.mobile-nav .sub-menu a,
body #mobile-nav.mobile-nav .sub-menu a * { color: var(--zg-mp-fg-soft) !important; }
body #mobile-nav.mobile-nav a:hover,
body #mobile-nav.mobile-nav a:focus-visible,
body #mobile-nav.mobile-nav .current-menu-item > a { color: var(--zg-mp-hover) !important; }
body #mobile-nav.mobile-nav svg { color: inherit; }
body #mobile-nav.mobile-nav .submenu-toggle svg { stroke: currentColor; }

/* Close (✕): always visible, ≥44px tap target. */
body #mobile-nav.mobile-nav .mobile-nav-close {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 44px !important;
  min-height: 44px !important;
  width: 44px;
  height: 44px;
  padding: 0 !important;
  border-radius: 50%;
  background: var(--zg-mp-close-bg) !important;
  border: 1px solid var(--zg-mp-line) !important;
  color: var(--zg-mp-fg) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: 1.9rem !important;
  line-height: 1 !important;
  opacity: 1 !important;
  z-index: 3;
}
body #mobile-nav.mobile-nav .mobile-nav-close:hover,
body #mobile-nav.mobile-nav .mobile-nav-close:focus-visible { color: var(--zg-mp-hover) !important; outline: 2px solid currentColor; outline-offset: 2px; }

/* Keep-header mode: header takes the panel colour (menu-motion.js copies the
   panel background into --zg-mm-bg) — its icon must follow the panel text. */
body.zg-mm-keep.menu-open #site-header .menu-toggle span { background-color: var(--zg-mp-fg-hdr, #fff) !important; }
body.zg-mm-keep.menu-open.zg-mnav-c-light #site-header .menu-toggle span,
body.zg-mm-keep.menu-open.zg-mnav-c-white #site-header .menu-toggle span { background-color: #14161a !important; }

/* Hamburger icon on the header: 44px target + a two-tone halo so the bars
   read on both light and dark headers (transparent over hero and scrolled). */
#site-header .menu-toggle {
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
}
#site-header .menu-toggle span {
  filter: drop-shadow(0 0 1px rgba(0, 0, 0, .45)) drop-shadow(0 0 1px rgba(255, 255, 255, .35));
}
/* A solid (non-transparent) header that is not scrolled had white bars on a
   light bar background (base rule) — use the heading colour there. Presets
   that style the bars with !important keep theirs. */
body #site-header:not(.transparent):not(.scrolled) .menu-toggle span { background: var(--color-heading, var(--color-secondary, #111)); }

/* ── 2. RTL phone / email alignment ───────────────────────────────────── */
/* dir="ltr" on a block-level value (grid/flex item, block link) made
   text-align:start resolve to LEFT. match-parent resolves start/end against
   the parent's (RTL) direction, so the number sits on the right like the rest
   of the row, and a centred parent stays centred. */
html[dir="rtl"] body :is([dir="ltr"], a[href^="tel:"], a[href^="mailto:"]):not(input):not(textarea):not(select):not(pre):not(code) {
  unicode-bidi: isolate;
  text-align: match-parent;
  /* v311 — Chrome computes the unprefixed match-parent as plain "start" and then
     resolves it against the element's OWN (ltr) direction = LEFT, so the phone
     still hugged the left edge. The prefixed value resolves against the parent
     (verified: grid row, value box 211px, text now flush right; a centred
     parent stays centred). Firefox drops it and keeps its correct match-parent. */
  text-align: -webkit-match-parent;
}
/* Form fields for phone / email: LTR digits, but right-aligned in the RTL form. */
html[dir="rtl"] body :is(input[type="tel"], input[type="email"]) { direction: ltr; text-align: right; }
html[dir="rtl"] body :is(input[type="tel"], input[type="email"])::placeholder { text-align: right; }

/* Preset values that set direction:ltr in CSS on block-level boxes. */
body.zg-preset-nielsen .nl-fact dd,
body.zg-preset-residence .rs-voice-count,
body.zg-preset-wroblewski .wb-ltr { text-align: match-parent; text-align: -webkit-match-parent; }

/* v283 — event-type cards: a library icon (theme SVG / Google Material Symbol) sits in the
   circle at the same size as the built-in glyphs. */
.zg-events__icon svg { width: 26px; height: 26px; }
.zg-events__icon [class*="material-symbols"] { font-size: 28px; line-height: 1; color: inherit; }

/* v284 — content tables: on desktop the text WRAPS (2+ lines) so the table fits the
   column with no sideways scroll; on mobile the horizontal scroll stays. */
@media (min-width: 769px) {
  html body .entry-content table, html body .zg-spec-v2 .entry-content > table, html body [class*="zg-table"] table, html body table.zg-table {
    display: table !important; width: 100% !important; max-width: 100% !important; table-layout: auto; overflow: visible !important;
  }
  html body .entry-content table :is(th, td), html body [class*="zg-table"] :is(th, td) { white-space: normal !important; word-break: normal; overflow-wrap: anywhere; min-width: 0 !important; }
  html body [class*="zg-table"]:not(table) { overflow-x: visible !important; }
}

/* v284 — contact rows "label | value": short values (phone) were pushed to the far
   LEFT end of a space-between row while long ones (address) filled it. The value box
   takes the rest of the row and starts next to the label (right, in RTL), every design. */
/* v301 — scoped to content rows only: it also caught the HEADER call button wrapper
   (.nav-phone-wrap > a[tel]) and stretched the button across the header. */
html[dir="rtl"] body :is(main, #site-footer, .sidebar-card) :is(li, div, p, dl) > :is(span, div, p, dd, strong):has(> a[href^="tel:"], > a[href^="mailto:"], > [dir="ltr"], > a[href*="wa.me"]):not(.nav-phone-wrap):not(:has(> a[class*="btn"])):not(:has(> a[class*="button"])) {
  flex: 1 1 auto; justify-content: flex-start; text-align: right; margin-inline-start: 0;
}
html[dir="rtl"] body :is(main, #site-footer, .sidebar-card) a:is([href^="tel:"], [href^="mailto:"])[dir="ltr"] { display: inline-block; }

/* v289 — desktop dropdown menus: presets recolour header links light (transparent header
   over a dark hero) and that leaked into the WHITE dropdown panel (and the dark / light
   modes swap the tokens under it). The panel and its links always use one token pair. */
html body:not(#zg-x) :is(#site-header, .main-nav) .sub-menu {
  background: var(--color-bg, #fff) !important; border: 1px solid color-mix(in srgb, var(--color-heading, #111) 12%, transparent) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.18) !important;
}
html body:not(#zg-x) :is(#site-header, .main-nav) .sub-menu :is(a, span) {
  color: var(--color-heading, #111) !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; opacity: 1 !important;
}
html body:not(#zg-x) :is(#site-header, .main-nav) .sub-menu a:is(:hover, :focus-visible),
html body:not(#zg-x) :is(#site-header, .main-nav) .sub-menu .current-menu-item > a {
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-bg, #fff)) !important; color: var(--color-heading, #111) !important;
}

/* ── No empty columns (footer / contact without form) ───────────────────────
   footer.php prints only columns that have content and tags the grid with
   footer-grid--cols-N; presets that hard-code 3/4 tracks are overridden here
   so the existing columns fill the row (no empty 4th slot). */
@media (min-width: 1025px) {
  html body #site-footer .footer-grid.footer-grid--cols-3 { grid-template-columns: 1.5fr 1fr 1.2fr !important; }
  html body #site-footer .footer-grid.footer-grid--cols-2 { grid-template-columns: 1.5fr 1fr !important; }
}
@media (min-width: 641px) {
  html body #site-footer .footer-grid.footer-grid--cols-1 { grid-template-columns: minmax(0, 1fr) !important; max-width: 720px; margin-inline: auto; }
}
html body #site-footer .footer-grid > .footer-col:not(:has(li, p, table, a, img, iframe)) { display: none !important; }

/* Contact sections: when forms are off the templates skip the form column and
   add .zg-noform to the section + its grid — the remaining content becomes ONE
   centred column. (The default .contact-grid keeps its v247 2-col info/hours.) */
html body #contact .zg-noform:not(section):not(.contact-grid) {
  grid-template-columns: minmax(0, 1fr) !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  max-width: 720px !important;
  margin-inline: auto !important;
}
html body #contact .zg-noform:not(section):not(.contact-grid) > :not(svg):not([aria-hidden="true"]) {
  grid-column: 1 / -1 !important;
  flex: 0 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: auto !important;
}
html body #contact .zg-noform :is(ul, ol, dl)[class*="contact"],
html body #contact .zg-noform :is(ul, ol)[class*="info"],
html body #contact .zg-noform :is(ul, ol)[class*="chips"] { margin-inline: auto; }

/* Safety net: a form column / card left empty (form stripped) never shows. */
html body #contact :is([class*="form-wrap"], [class*="formwrap"], [class*="form-col"], [class*="formcol"], [class*="__form"], .contact-form):not(:has(form, input, textarea, iframe, img)) { display: none !important; }
html body :is(.sidebar-card--leadform, .zg-lead-card, .service-lead):not(:has(form, input, textarea)) { display: none !important; }

/* ==========================================================================
   Form field parity (all designs) — the phone field must be the exact twin of
   the name / email fields. Causes found:
   1. style.css set .form-group input[type=tel] to direction:rtl, while the rule
      above (line ~117) sets tel to direction:ltr + text-align:right — and the
      later "#zg-contact-form input { text-align:start }" (ID specificity) wins
      over that, so with direction:ltr "start" = LEFT: the phone value and
      placeholder jumped to the left edge of the contact form.
   2. Fields sit in grid / flex rows (.form-row, .zg-heroform__row) without
      min-width:0, so an input's intrinsic (size=20) width could push its cell
      wider or narrower than its sibling; mixed box-sizing did the rest.
   3. Some sheets size inputs by [type] lists — a type missing from a list got
      the browser default box (different height / padding / font).
   One rule set, same box for every text-like control in any form.
   ========================================================================== */
html body form :is(.form-row, .form-group, [class*="__row"], [class*="-row"], [class*="__field"], [class*="-field"]) { min-width: 0; }
html body form :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=reset]):not([type=hidden]):not([type=file]):not([type=range]):not([type=color]):not([type=image]), select, textarea) {
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box !important;
  margin-inline: 0;
  font-family: inherit;
  line-height: 1.4;
  vertical-align: top;
}
html body form :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=reset]):not([type=hidden]):not([type=file]):not([type=range]):not([type=color]):not([type=image]), select) {
  min-height: 3rem;
}
html body form input[type="tel"], html body form input[type="email"], html body form input[type="number"] { -webkit-appearance: none; appearance: none; }
/* tel / email: digits + addresses read LTR, but the field aligns right like its RTL siblings */
html[dir="rtl"] body form :is(input[type="tel"], input[type="email"]),
html[dir="rtl"] body #zg-contact-form :is(input[type="tel"], input[type="email"]) {
  direction: ltr !important;
  text-align: right !important;
  unicode-bidi: plaintext;
}
html[dir="rtl"] body form :is(input[type="tel"], input[type="email"])::placeholder { direction: ltr; text-align: right; }

/* v307 — phone fields, every form in every design (contact, hero, popup, steps,
   footer, sidebar): digits read LTR but the field and its placeholder align
   RIGHT. Two :not(#id) raise specificity above any preset sheet, including ones
   that set tel to direction:rtl or text-align:start/left with !important. */
html[dir="rtl"] body:not(#zg-t1):not(#zg-t2) input[type="tel"] {
  direction: ltr !important;
  text-align: right !important;
  unicode-bidi: plaintext !important;
}
html[dir="rtl"] body:not(#zg-t1):not(#zg-t2) input[type="tel"]::placeholder {
  direction: rtl !important;
  text-align: right !important;
}

/* ==========================================================================
   v-next — ABOUT SECTION WITHOUT A PHOTO (every preset)
   With AI images on, zapgroup_get_image() returns '' until the photo is
   generated, and each preset's about template then printed an EMPTY media
   column (a dark pill/plate, an empty arch, a blank frame…). Now an empty media
   column is removed and its grid collapses to one column, so the copy takes the
   full width and the section reads as intentionally text-led. As soon as an
   image exists (primary or extra), nothing here applies.
   ========================================================================== */
#about :is(.au-story__media,.au-about__media,.about-beam-media-wrap,.about-bloom-media-wrap,.clx-about-media,.cl-about__media,.fx-collage,.fg-sheet__media,.gz-profile__figure,.ga-about__media,.hn-spread__media,.hy-about__media,.ins-profile__media,.about-levant__media,.about-lifecoach-media-wrap,.mc-about-visual,.about-mirage__media,.nb-about__media,.nm-about__media,.about-orbit-media-wrap,.pt-about__media,.rams-about-media,.about-ranch__media,.rh-polaroids,.rand-about-media,.rs-about-media,.about-roast-media,.sch-about-media,.sk-about__media,.sx-about__media,.stu-story-media,.mn-about__media,.tt-about__media,.vb-story__media,.wb-statement__media,.wb-about__media,.about-image-wrap):not(:has(img,picture,video,iframe)) { display: none !important; }
#about :has(> :is(.au-story__media,.au-about__media,.about-beam-media-wrap,.about-bloom-media-wrap,.clx-about-media,.cl-about__media,.fx-collage,.fg-sheet__media,.gz-profile__figure,.ga-about__media,.hn-spread__media,.hy-about__media,.ins-profile__media,.about-levant__media,.about-lifecoach-media-wrap,.mc-about-visual,.about-mirage__media,.nb-about__media,.nm-about__media,.about-orbit-media-wrap,.pt-about__media,.rams-about-media,.about-ranch__media,.rh-polaroids,.rand-about-media,.rs-about-media,.about-roast-media,.sch-about-media,.sk-about__media,.sx-about__media,.stu-story-media,.mn-about__media,.tt-about__media,.vb-story__media,.wb-statement__media,.wb-about__media,.about-image-wrap)):not(:has(> :is(.au-story__media,.au-about__media,.about-beam-media-wrap,.about-bloom-media-wrap,.clx-about-media,.cl-about__media,.fx-collage,.fg-sheet__media,.gz-profile__figure,.ga-about__media,.hn-spread__media,.hy-about__media,.ins-profile__media,.about-levant__media,.about-lifecoach-media-wrap,.mc-about-visual,.about-mirage__media,.nb-about__media,.nm-about__media,.about-orbit-media-wrap,.pt-about__media,.rams-about-media,.about-ranch__media,.rh-polaroids,.rand-about-media,.rs-about-media,.about-roast-media,.sch-about-media,.sk-about__media,.sx-about__media,.stu-story-media,.mn-about__media,.tt-about__media,.vb-story__media,.wb-statement__media,.wb-about__media,.about-image-wrap) :is(img,picture,video,iframe))) {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: none !important;
  column-gap: 0 !important;
}
#about :has(> :is(.au-story__media,.au-about__media,.about-beam-media-wrap,.about-bloom-media-wrap,.clx-about-media,.cl-about__media,.fx-collage,.fg-sheet__media,.gz-profile__figure,.ga-about__media,.hn-spread__media,.hy-about__media,.ins-profile__media,.about-levant__media,.about-lifecoach-media-wrap,.mc-about-visual,.about-mirage__media,.nb-about__media,.nm-about__media,.about-orbit-media-wrap,.pt-about__media,.rams-about-media,.about-ranch__media,.rh-polaroids,.rand-about-media,.rs-about-media,.about-roast-media,.sch-about-media,.sk-about__media,.sx-about__media,.stu-story-media,.mn-about__media,.tt-about__media,.vb-story__media,.wb-statement__media,.wb-about__media,.about-image-wrap)):not(:has(> :is(.au-story__media,.au-about__media,.about-beam-media-wrap,.about-bloom-media-wrap,.clx-about-media,.cl-about__media,.fx-collage,.fg-sheet__media,.gz-profile__figure,.ga-about__media,.hn-spread__media,.hy-about__media,.ins-profile__media,.about-levant__media,.about-lifecoach-media-wrap,.mc-about-visual,.about-mirage__media,.nb-about__media,.nm-about__media,.about-orbit-media-wrap,.pt-about__media,.rams-about-media,.about-ranch__media,.rh-polaroids,.rand-about-media,.rs-about-media,.about-roast-media,.sch-about-media,.sk-about__media,.sx-about__media,.stu-story-media,.mn-about__media,.tt-about__media,.vb-story__media,.wb-statement__media,.wb-about__media,.about-image-wrap) :is(img,picture,video,iframe))) > * {
  grid-column: 1 / -1 !important;
  grid-row: auto !important;
  max-width: 100% !important;
  flex: 1 1 100%;
}
/* Templates that drop the <figure> itself when there is no photo. */
#about:not(:has(img,picture,video,iframe)) :is(.br-about__grid,.nx-about__wrap,.bq-story__wrap) {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: none !important;
}
#about:not(:has(img,picture,video,iframe)) :is(.br-about__grid,.nx-about__wrap,.bq-story__wrap) > * { grid-column: 1 / -1 !important; max-width: 100% !important; }
/* Vignelli: title + text keep their editorial 2-column page instead of 3 with a blank third. */
@media (min-width: 561px) {
  #about .vg-about__page:not(:has(.vg-about__col--media :is(img,picture,video,iframe))) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) !important; }
  #about .vg-about__page:not(:has(.vg-about__col--media :is(img,picture,video,iframe))) > * { grid-column: auto !important; }
}
#about .vg-about__page:not(:has(.vg-about__col--media :is(img,picture,video,iframe))) > .vg-about__col--media { display: none !important; }
/* Frost has its own .no-image layout already; keep the copy measure readable everywhere. */
#about :has(> :is(.au-story__media,.au-about__media,.about-beam-media-wrap,.about-bloom-media-wrap,.clx-about-media,.cl-about__media,.fx-collage,.fg-sheet__media,.gz-profile__figure,.ga-about__media,.hn-spread__media,.hy-about__media,.ins-profile__media,.about-levant__media,.about-lifecoach-media-wrap,.mc-about-visual,.about-mirage__media,.nb-about__media,.nm-about__media,.about-orbit-media-wrap,.pt-about__media,.rams-about-media,.about-ranch__media,.rh-polaroids,.rand-about-media,.rs-about-media,.about-roast-media,.sch-about-media,.sk-about__media,.sx-about__media,.stu-story-media,.mn-about__media,.tt-about__media,.vb-story__media,.wb-statement__media,.wb-about__media,.about-image-wrap)):not(:has(> :is(.au-story__media,.au-about__media,.about-beam-media-wrap,.about-bloom-media-wrap,.clx-about-media,.cl-about__media,.fx-collage,.fg-sheet__media,.gz-profile__figure,.ga-about__media,.hn-spread__media,.hy-about__media,.ins-profile__media,.about-levant__media,.about-lifecoach-media-wrap,.mc-about-visual,.about-mirage__media,.nb-about__media,.nm-about__media,.about-orbit-media-wrap,.pt-about__media,.rams-about-media,.about-ranch__media,.rh-polaroids,.rand-about-media,.rs-about-media,.about-roast-media,.sch-about-media,.sk-about__media,.sx-about__media,.stu-story-media,.mn-about__media,.tt-about__media,.vb-story__media,.wb-statement__media,.wb-about__media,.about-image-wrap) :is(img,picture,video,iframe))) :is(p, .about-summary__p) { max-width: 72ch; }

/* v314 — the <br> before "מספר מקשר": it already starts a new line after a block-level
   phone note (it would only add an empty line there) and is meaningless in flex wraps. */
:is(.contact-phone-note, .nav-phone-note, .zg-fc-phone__val > span) + br.zg-msakiv-br { display: none; }

/* =====================================================================
   v321 — CORNERS (advanced design → "פינות") global override layer.
   body.zg-radius-sharp   → every element square (border-radius 0), all designs.
   body.zg-radius-rounded → components follow the --radius-* tokens (pill buttons).
   body.zg-radius-medium  → untouched: each design keeps its native corners.
   Intentional circles (avatars, dots, round icon buttons, knobs, blobs, social
   icons, slider arrows, the float dock) keep their shape. Pseudo-elements are
   never matched (* does not select ::before/::after), so decorative dots survive.
   ===================================================================== */
body.zg-radius-sharp {
  --radius-sm: 0px; --radius-md: 0px; --radius-lg: 0px; --radius: 0px; --r: 0px;
}
body.zg-radius-sharp *:not(:is(
  [class*="avatar"], [class*="dot"], [class*="circle"], [class*="blob"], [class*="__orb"],
  [class*="glow"], [class*="halo"], [class*="-disc"], [class*="__disc"], [class*="knob"], [class*="switch"],
  [class*="track"], [class*="toggle"], [class*="play-"], [class*="-play"], [class*="__play"], [class*="pulse"], [class*="spinner"],
  [class*="ico"], [class*="arrow"], [class*="__go"], [class*="-go"], [class*="__num"],
  [class*="-num"], [class*="__x"], [class*="-led"], [class*="check"], [class*="bullet"],
  [class*="sticker"], [class*="-sun"], [class*="__arch"], [class*="-arch"], [class*="-ring"], [class*="zg-pie"],
  [class*="social"], [class*="float"], [class*="dock"], [class*="slider__btn"],
  [class*="lightbox-nav"], [class*="scrollcue"], [class*="__fill"], [class*="initial"],
  [class*="a11y"], [class*="zg-le-"], #wpadminbar, #wpadminbar *,
  [style*="50%"], [style*="999px"], [style*="9999px"]
)) {
  border-radius: 0 !important;
}

body.zg-radius-rounded {
  --radius-sm: 12px; --radius-md: 20px; --radius-lg: 32px;
}
/* Buttons → pill (matches the admin "מעוגל" card: 20 / 999). */
body.zg-radius-rounded :is(
  .btn, [class*="btn"]:not([class*="btns"]), button:not([class*="ico"]):not([class*="toggle"]):not([class*="arrow"]):not([class*="dot"]),
  input[type="submit"], input[type="button"], .wp-block-button__link, .wp-element-button,
  .form-submit, [class*="__submit"], [class*="-submit"], .nav-cta, [class*="cta"]:is(a, button),
  [class*="pill"], [class*="chip"], [class*="__cat"], [class*="badge"]:not([class*="ico"]), [class*="tag"]:is(a, span)
):not(:is([class*="ico"], [class*="arrow"], [class*="dot"], [class*="toggle"], [class*="social"], [class*="float"], [class*="dock"], [class*="slider__btn"], [class*="a11y"], [class*="zg-le-"], [class*="-play"], [class*="__play"])) {
  border-radius: 999px !important;
}
/* Fields. */
body.zg-radius-rounded :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="color"]),
  select, textarea, [class*="__input"], [class*="-input"], [class*="__field"] > :is(input, select, textarea)
) {
  border-radius: var(--radius-md) !important;
}
/* Cards, panels, forms, popups, cookie banner, thanks, steps form, sidebar boxes. */
body.zg-radius-rounded :is(
  [class*="card"]:not([class*="__"]), [class*="-card"]:not([class*="__"]), [class*="card--"],
  [class*="tile"]:not([class*="__"]), [class*="panel"]:not([class*="__"]),
  .faq-accordion-item, .faq-item, [class*="accordion-item"],
  .zg-pop__box, [class*="modal"]:not([class*="__"]), [class*="cookie"]:not([class*="__"]):not(a):not(button),
  .zg-thanks__card, .zg-thanks--card, [class*="zg-sf"]:is(form, [class*="__box"], [class*="__step"], [class*="__card"]),
  .zg-heroform, .gz-box__form, .sidebar-form, .contact-form, .zg-lead-form, form[class*="form"],
  .gallery-item, [class*="gallery-item"], .wp-block-image img, .entry-content img, [class*="__image-wrap"],
  .service-card-image, .blog-card__image, .about-image-wrap, .zg-pop__img
):not(:is([class*="avatar"], [class*="ico"], [class*="dot"], [class*="circle"], [class*="blob"], [class*="social"], [class*="float"], [class*="dock"], [class*="a11y"], [class*="zg-le-"], [style*="50%"])) {
  border-radius: var(--radius-lg) !important;
}
/* Cards clip their media to the rounded corner. */
body.zg-radius-rounded :is(.service-card, .blog-card, .zg-archive-card, .zg-related__card, .team-card, .review-card, .zg-thanks__card, .gallery-item) {
  overflow: hidden;
}
/* Media inside a rounded card inherits the top corners only through the clip. */
body.zg-radius-rounded :is(.service-card, .blog-card, .zg-archive-card, .zg-related__card) :is(.service-card-image, .blog-card__image, .blog-card__image-wrap, img) {
  border-radius: 0 !important;
}

/* v327 — corners also drive the floating dock, the social icons and the
   accessibility button + panel (they were exempt from the v321 layer). */
html body.zg-radius-sharp:not(#zg-rd1):not(#zg-rd2) :is(.zg-fd__btn, .zg-fd__btn *, .zg-fd__label, .zg-fd [class*="tip"], .social-link, .social-links a, [class*="social-link"], .zg-a11y__toggle, .zg-a11y__panel, .zg-a11y__head, .zg-a11y__btns button, .zg-a11y__reset, .zg-a11y__close, .zg-a11y__switch, .zg-a11y__switch *, .zg-a11y button) { border-radius: 0 !important; }
html body.zg-radius-rounded:not(#zg-rd1):not(#zg-rd2) :is(.zg-fd__btn, .social-link, .social-links a, .zg-a11y__toggle) { border-radius: 999px !important; }
html body.zg-radius-rounded:not(#zg-rd1):not(#zg-rd2) .zg-a11y__panel { border-radius: var(--radius-lg, 20px) !important; overflow: hidden; }
html body.zg-radius-rounded:not(#zg-rd1):not(#zg-rd2) :is(.zg-a11y__btns button, .zg-a11y__reset) { border-radius: var(--radius-md, 12px) !important; }
