/**
 * Mobile layout — media query + html.ruh-is-mobile.
 * WP menu: header owns burger + #ruh-mnav.
 * Mega passthrough: RMM owns toggle/offcanvas; nav-bar stays visible.
 */

.ruh-mbar { display: none; }
.ruh-nav-scrim { display: none; position: fixed; inset: 0; z-index: 2147482998; background: rgba(0,0,0,.45); border: 0; cursor: pointer; }
.ruh-nav-scrim.is-on { display: block !important; }
/* WP menu only — never touch mega/shortcode submenu display */
.rekhi-hdr.ruh-menu-src-wp_menu .rekhi-hdr__nav-bar ul.sub-menu {
  display: none !important;
  position: absolute !important;
}
.ruh-mnav.is-open .ruh-mnav__list {
  display: block !important;
  position: static !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  transform: none !important;
  width: 100% !important;
}

/* ——— WP menu source ——— */
@media (max-width: 1024px) {
  .rekhi-hdr.ruh-menu-src-wp_menu .rekhi-hdr__brand-grid { display: none !important; }
  .rekhi-hdr.ruh-menu-src-wp_menu .rekhi-hdr__nav-bar { display: none !important; }
  .rekhi-hdr.ruh-menu-src-wp_menu .ruh-mbar {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    padding: 8px 12px 12px !important;
    box-sizing: border-box !important;
    gap: 8px !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .rekhi-hdr.ruh-menu-src-wp_menu .ruh-mbar__burger,
  .rekhi-hdr.ruh-menu-src-wp_menu [data-ruh-mnav-open] {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .rekhi-hdr.ruh-menu-src-wp_menu .rekhi-hdr__nav-bar .rmm-toggle,
  .rekhi-hdr.ruh-menu-src-wp_menu .ruh-mnav .rmm-toggle,
  .rekhi-hdr.ruh-menu-src-wp_menu .rekhi-mega-menu__hamburger,
  .rekhi-hdr.ruh-menu-src-wp_menu .rekhi-mega-menu__mobile-bar {
    display: none !important;
  }
}

html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-wp_menu .rekhi-hdr__brand-grid { display: none !important; }
html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-wp_menu .rekhi-hdr__nav-bar { display: none !important; }
html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-wp_menu .ruh-mbar {
  display: flex !important;
  flex-direction: column;
  width: 100%;
  padding: 8px 12px 12px;
  box-sizing: border-box;
  gap: 8px;
}

/* ——— Mega / shortcode: placement chrome + toggle seat only. Source owns open/close. ——— */
@media (max-width: 1024px) {
  .rekhi-hdr.ruh-mobile-owner-mega_menu .rekhi-hdr__brand-grid,
  .rekhi-hdr.ruh-menu-src-rekhi_mega_menu .rekhi-hdr__brand-grid,
  .rekhi-hdr.ruh-menu-src-mega_shortcode .rekhi-hdr__brand-grid { display: none !important; }
  .rekhi-hdr.ruh-mobile-owner-mega_menu .ruh-mbar,
  .rekhi-hdr.ruh-menu-src-rekhi_mega_menu .ruh-mbar,
  .rekhi-hdr.ruh-menu-src-mega_shortcode .ruh-mbar {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    padding: 8px 12px 8px !important;
    box-sizing: border-box !important;
    gap: 8px !important;
  }
  .rekhi-hdr.ruh-mobile-owner-mega_menu .ruh-mnav,
  .rekhi-hdr.ruh-menu-src-rekhi_mega_menu .ruh-mnav,
  .rekhi-hdr.ruh-menu-src-mega_shortcode .ruh-mnav { display: none !important; }

  .rekhi-hdr .ruh-mbar__side--burger .rmm-toggle,
  .rekhi-hdr .ruh-mbar__side--burger .rmm-toggle[hidden] {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: var(--ruh-burger-bg, rgba(255,255,255,.18)) !important;
    color: var(--ruh-burger-color, #fff) !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 0 !important;
    box-shadow: 0 0 0 1px rgba(255,255,255,.2);
  }
  .rekhi-hdr .ruh-mbar__side--burger .rmm-toggle .rmm-toggle__label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
  }
  .rekhi-hdr .ruh-mbar__side--burger .rmm-toggle .rmm-icon {
    display: block !important;
    width: 20px !important;
    height: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: currentColor !important;
    border-radius: 1px !important;
    box-shadow: 0 -6px 0 currentColor, 0 6px 0 currentColor !important;
    font: 0/0 a !important;
    color: inherit !important;
  }
  .rekhi-hdr .ruh-mbar__side--burger .rmm-toggle .rmm-icon::before,
  .rekhi-hdr .ruh-mbar__side--burger .rmm-toggle .rmm-icon::after {
    content: none !important;
    display: none !important;
  }
  .rekhi-hdr .ruh-mbar__side--burger:has(.rmm-toggle) > [data-ruh-mega-open],
  .rekhi-hdr .ruh-mbar__side--burger:has(.rmm-toggle) > .ruh-mbar__burger:not(.rmm-toggle) {
    display: none !important;
  }
  .rekhi-hdr .ruh-mbar__side--burger:not(:has(.rmm-toggle)) > .ruh-mbar__burger,
  .rekhi-hdr .ruh-mbar__side--burger:not(:has(.rmm-toggle)) > [data-ruh-mega-open] {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}
html.ruh-is-mobile .rekhi-hdr.ruh-mobile-owner-mega_menu .rekhi-hdr__brand-grid,
html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-rekhi_mega_menu .rekhi-hdr__brand-grid,
html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-mega_shortcode .rekhi-hdr__brand-grid { display: none !important; }
html.ruh-is-mobile .rekhi-hdr.ruh-mobile-owner-mega_menu .ruh-mbar,
html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-rekhi_mega_menu .ruh-mbar,
html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-mega_shortcode .ruh-mbar { display: flex !important; }
html.ruh-is-mobile .rekhi-hdr.ruh-mobile-owner-mega_menu .ruh-mnav,
html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-rekhi_mega_menu .ruh-mnav,
html.ruh-is-mobile .rekhi-hdr.ruh-menu-src-mega_shortcode .ruh-mnav { display: none !important; }

@media (min-width: 1025px) {
  html:not(.ruh-is-mobile) .ruh-mbar { display: none !important; }
}

.ruh-mbar__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 52px;
  gap: 8px;
}
.ruh-mbar__side {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}
.ruh-mbar__logo {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  text-align: center;
}
.ruh-mbar__logo a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}
.ruh-mbar__logo img {
  display: block !important;
  max-height: var(--ruh-logo-h-m, 56px) !important;
  width: auto !important;
  max-width: min(var(--ruh-logo-max-w, 200px), 58vw) !important;
  height: auto !important;
  object-fit: contain !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.ruh-mbar__burger {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--ruh-burger-bg, rgba(255,255,255,0.18)) !important;
  color: var(--ruh-burger-color, #fff) !important;
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  padding: 10px !important;
  cursor: pointer !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.2);
  pointer-events: auto !important;
  z-index: 20 !important;
}
.ruh-mbar__burger span {
  display: block !important;
  width: 100% !important;
  height: 2px !important;
  background: currentColor !important;
  border-radius: 1px !important;
}

.ruh-mbar__search { width: 100%; }
.ruh-mbar__search .rekhi-hdr__search { width: 100%; }
/* WhatsApp + Get Quote under search — always visible on mobile chrome */
html.ruh-is-mobile .rekhi-hdr .ruh-mbar__actions,
.ruh-mbar__actions {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  gap: 8px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.ruh-mbar__actions a,
.ruh-mbar__actions .rekhi-hdr__btn {
  flex: 1 1 0;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 700;
  color: #fff;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Trust pills — marquee scrolls; fade/pulse/flash/static fit ALL pills */
.rekhi-hdr__trust-inner {
  justify-content: flex-start !important;
  overflow: hidden;
  max-width: 100%;
}
.rekhi-hdr .rekhi-hdr__trust-pills {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 6px 0 !important;
  overflow: hidden !important;
}
.rekhi-hdr .rekhi-hdr__trust-pills.is-fit {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-content: center !important;
  gap: var(--ruh-pill-gap, 5px) !important;
  max-height: 64px !important;
  overflow: hidden !important;
}
.rekhi-hdr .rekhi-hdr__pill {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
  font-size: var(--ruh-pill-fs, 0.72rem) !important;
  padding: var(--ruh-pill-py, 4px) var(--ruh-pill-px, 10px) !important;
}
@media (max-width: 1024px) {
  .rekhi-hdr .rekhi-hdr__trust { overflow: hidden; }
  .rekhi-hdr .rekhi-hdr__trust-pills.is-fit { max-height: 64px !important; }
}
html.ruh-is-mobile .rekhi-hdr .rekhi-hdr__trust-pills {
  width: 100% !important;
  overflow: hidden !important;
}
html.ruh-is-mobile .rekhi-hdr .rekhi-hdr__trust-pills.is-fit {
  display: flex !important;
  flex-wrap: wrap !important;
  max-height: 64px !important;
}

/* Full-screen menu */
.ruh-mnav[hidden] { display: none !important; }
.ruh-mnav { display: none; }
.ruh-mnav.is-open {
  display: flex !important;
  flex-direction: column !important;
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  height: 100dvh !important;
  z-index: 2147483646 !important;
  background: var(--ruh-drawer-bg, #0a0a0a) !important;
  color: var(--ruh-drawer-text, #fff) !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}
.ruh-mnav__top {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--ruh-drawer-border, rgba(255,255,255,0.12));
  background: var(--ruh-drawer-bg, #111);
  color: var(--ruh-drawer-text, inherit);
}
.ruh-mnav__top-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
/* Desktop lang slots never show on phone; mobile slot never on desktop (see frontend.css) */
html.ruh-is-mobile .rekhi-hdr .ruh-lang--actions,
html.ruh-is-mobile .rekhi-hdr .ruh-lang--trust {
  display: none !important;
}
html.ruh-is-mobile .rekhi-hdr__trust:not(:has(.rekhi-hdr__trust-pills)) {
  display: none !important;
}
.ruh-mnav__top strong {
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: inherit;
}
.ruh-mnav__close {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 10px;
  background: rgba(255,255,255,0.12);
  color: inherit;
  font-size: 22px;
  cursor: pointer;
}
.ruh-mnav__trust {
  flex: 0 0 auto;
  border-bottom: 1px solid var(--ruh-drawer-border, rgba(255,255,255,0.1));
  overflow: hidden;
  padding: 8px 0;
  background: var(--ruh-drawer-bg, #0f0f0f);
  color: var(--ruh-drawer-text, inherit);
}
.ruh-mnav__pills {
  padding: 4px 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
.ruh-mnav__pills .ruh-pill-rail.is-marquee {
  --ruh-marquee-dur: 8s;
}
.ruh-mnav__list-wrap .ruh-mnav__list,
.ruh-mnav__list-wrap .menu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  position: static !important;
}
.ruh-mnav__list-wrap {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Inside header mobile panel: neutralize source off-canvas so content scrolls in-slot */
.ruh-mnav .ruh-menu-slot--mobile ul.rmm-menu,
.ruh-mnav .ruh-menu-slot--mobile ul.rmm-nav {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: static;
  height: auto;
  max-height: none;
  overflow: visible;
  margin: 0;
  padding: 0;
  list-style: none;
  background: transparent;
  box-shadow: none;
  transform: none;
}
.ruh-mnav .ruh-menu-slot--mobile .rmm-nav.rmm-is-mobile,
.ruh-mnav .ruh-menu-slot--mobile .rmm-nav.rmm-is-mobile.rmm-is-open {
  position: static;
  inset: auto;
  width: 100%;
  height: auto;
  max-width: none;
  box-shadow: none;
  background: transparent;
  overflow: visible;
}
/* Layout only inside mobile panel — Mega Menu owns fonts/colors */
.ruh-mnav .ruh-menu-slot--mobile .rmm-menu > .rmm-item,
.ruh-mnav .ruh-menu-slot--mobile .rmm-menu > .menu-item {
  display: block;
  width: 100%;
}
.ruh-mnav .ruh-menu-slot--mobile .rmm-menu > .rmm-item > .rmm-link,
.ruh-mnav .ruh-menu-slot--mobile .rmm-menu > .menu-item > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.ruh-mnav .ruh-menu-slot--mobile .rmm-panel {
  position: static;
  width: 100%;
  max-width: none;
  left: auto;
  transform: none;
  box-shadow: none;
}
.ruh-mnav .ruh-menu-slot--mobile .rmm-item.is-open > .rmm-panel,
.ruh-mnav .ruh-menu-slot--mobile .rmm-item.ruh-open > .rmm-panel,
.ruh-mnav .ruh-menu-slot--mobile .menu-item.is-open > .rmm-panel,
.ruh-mnav .ruh-menu-slot--mobile .menu-item.ruh-open > .rmm-panel,
.ruh-mnav .ruh-menu-slot--mobile .rmm-panel:not([hidden]) {
  display: block;
  visibility: visible;
  height: auto;
  position: static;
}
.ruh-mnav .ruh-menu-slot--mobile .rmm-panel[hidden] { display: none; }
.ruh-mnav .ruh-menu-slot--mobile .rmm-columns {
  display: flex;
  flex-direction: column;
  grid-template-columns: 1fr;
}
.ruh-mnav .ruh-menu-slot--mobile .rmm-column { width: 100%; max-width: 100%; }
.ruh-mnav .rmm-toggle { display: none; }
.ruh-mnav__list,
.ruh-mnav__list-wrap ul,
.ruh-mnav .menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ruh-mnav__list > li > a,
.ruh-mnav__list .menu-item > a,
.ruh-mnav .menu > li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  color: inherit !important;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.ruh-mnav .sub-menu {
  display: none;
  list-style: none;
  margin: 0;
  padding: 0;
  background: rgba(255,255,255,0.04);
}
.ruh-mnav .menu-item.is-open > .sub-menu,
.ruh-mnav .menu-item.ruh-open > .sub-menu {
  display: block !important;
}
.ruh-mnav .sub-menu a {
  padding: 10px 18px 10px 28px;
  font-weight: 500;
  font-size: 14px;
  opacity: 0.9;
  color: inherit !important;
  text-decoration: none;
  display: block;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.ruh-mnav__foot {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px 20px;
  border-top: 1px solid var(--ruh-drawer-border, rgba(255,255,255,0.12));
  background: var(--ruh-drawer-bg, #111);
}
.ruh-mnav__foot a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 700;
  color: #fff !important;
}
.ruh-mnav__foot a.ruh-mnav__wa { background: #128c7e !important; }
.ruh-mnav__foot a.ruh-mnav__cta { background: var(--rekhi-accent, #e10600) !important; }
.ruh-mnav__foot a.ruh-mnav__mail { background: rgba(255,255,255,0.1) !important; }

html.ruh-nav-lock,
html.ruh-nav-lock body {
  overflow: hidden !important;
  touch-action: none !important;
}
