/* UmrahRoom Global Shell Lock v1 — 2026-10-03
   One header + one mobile bottom navigation across public and Community pages.
   This file is loaded last intentionally to neutralize page-specific shell drift. */
:root{
  --ur-shell-blue:#0874f9;
  --ur-shell-navy:#0b2358;
  --ur-shell-muted:#526b8b;
  --ur-shell-line:#dce7f5;
  --ur-shell-mobile-header:54px;
  --ur-shell-mobile-nav:60px;
}

/* Shared mobile controls exist in markup on every page; desktop keeps the full site nav. */
.ur-global-mobile-actions{display:none}
.ur-global-mobile-nav{display:none}

@media (max-width:900px){
  html,body{overflow-x:hidden!important}
  html body.ur-app-shell{padding-bottom:calc(var(--ur-shell-mobile-nav) + env(safe-area-inset-bottom))!important}
  html body #mainContent{overflow-x:clip}

  /* Global header: identical on Home, Hotels, Community and all subpages. */
  html body .ur-global-header{
    position:relative!important;
    inset:auto!important;
    z-index:1250!important;
    width:100%!important;
    height:60px!important;
    min-height:60px!important;
    background:#fff!important;
    border-bottom:1px solid #e8eef7!important;
    box-shadow:none!important;
    filter:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  html body .ur-global-header .nav-row{
    width:100%!important;
    max-width:none!important;
    height:60px!important;
    min-height:60px!important;
    padding:0 12px!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
  }
  html body .ur-global-header .site-brand{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    min-width:0!important;
    flex:0 1 auto!important;
  }
  html body .ur-global-header .site-brand img{
    display:block!important;
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    object-fit:contain!important;
    border-radius:8px!important;
  }
  html body .ur-global-header .ur-brand-word{
    display:block!important;
    color:var(--ur-shell-navy)!important;
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
    font-size:18px!important;
    line-height:1!important;
    letter-spacing:-.5px!important;
    font-weight:800!important;
    white-space:nowrap!important;
  }

  /* No page-specific mobile drawer/header controls: the app shell is stable. */
  html body .ur-global-header .site-nav,
  html body .ur-global-header .nav-actions,
  html body .ur-global-header .nav-toggle,
  html body .mobile-menu-backdrop{
    display:none!important;
  }
  html body.menu-open{overflow:auto!important}

  html body .ur-global-header .ur-global-mobile-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:6px!important;
    margin-inline-start:auto!important;
    min-width:0!important;
  }
  html body .ur-global-header .ur-global-lang-mini{
    display:flex!important;
    align-items:center!important;
    flex:0 0 auto!important;
    height:34px!important;
    padding:2px!important;
    border:1px solid #dbe7f5!important;
    border-radius:999px!important;
    background:#fff!important;
  }
  html body .ur-global-header .ur-global-lang-mini a{
    display:grid!important;
    place-items:center!important;
    min-width:34px!important;
    height:28px!important;
    padding:0 7px!important;
    border:0!important;
    border-radius:999px!important;
    background:transparent!important;
    color:var(--ur-shell-navy)!important;
    text-decoration:none!important;
    font:800 9px/1 Inter,system-ui,sans-serif!important;
  }
  html body .ur-global-header .ur-global-lang-mini a.active{
    background:var(--ur-shell-blue)!important;
    color:#fff!important;
  }
  html body .ur-global-header .ur-global-head-icon,
  html body .ur-global-header .ur-global-profile-mini{
    width:33px!important;
    height:33px!important;
    min-width:33px!important;
    min-height:33px!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    border:0!important;
    border-radius:50%!important;
    text-decoration:none!important;
    position:relative!important;
    box-shadow:none!important;
  }
  html body .ur-global-header .ur-global-head-icon{
    background:#fff!important;
    color:var(--ur-shell-navy)!important;
  }
  html body .ur-global-header .ur-global-head-icon svg{
    width:21px!important;
    height:21px!important;
    stroke-width:1.8!important;
  }
  html body .ur-global-header .ur-global-profile-mini{
    background:#7078c8!important;
    color:#fff!important;
    font:800 11px/1 Inter,system-ui,sans-serif!important;
  }
  html body .ur-global-header .ur-global-head-icon .badge{
    position:absolute!important;
    top:-3px!important;
    inset-inline-end:-2px!important;
    min-width:15px!important;
    height:15px!important;
    padding:0 3px!important;
    border:2px solid #fff!important;
    border-radius:999px!important;
    display:grid!important;
    place-items:center!important;
    background:#ef2b2d!important;
    color:#fff!important;
    font:800 7px/1 Inter,system-ui,sans-serif!important;
  }

  /* Single global app navigation. No Community-specific replacement bar. */
  html body .ur-community-bottom-nav{display:none!important}
  html body .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav{
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    height:auto!important;
    min-height:var(--ur-shell-mobile-nav)!important;
    margin:0!important;
    padding:4px max(2px,env(safe-area-inset-right)) calc(4px + env(safe-area-inset-bottom)) max(2px,env(safe-area-inset-left))!important;
    z-index:6000!important;
    overflow:visible!important;
    border:0!important;
    border-top:1px solid var(--ur-shell-line)!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:0 -6px 18px rgba(17,61,113,.07)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    direction:ltr!important;
  }
  html[dir="rtl"] body .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav{direction:rtl!important}
  html body .mobile-sticky-actions.ur-global-mobile-nav>a,
  html body .mobile-sticky-actions.ur-global-mobile-nav>button{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
    min-height:50px!important;
    width:auto!important;
    margin:0!important;
    padding:0 1px!important;
    gap:2px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:var(--ur-shell-muted)!important;
    text-decoration:none!important;
    font:700 7.4px/1.05 Inter,system-ui,sans-serif!important;
    text-align:center!important;
  }
  html body .mobile-sticky-actions.ur-global-mobile-nav>a.active,
  html body .mobile-sticky-actions.ur-global-mobile-nav>button.active{
    color:var(--ur-shell-blue)!important;
    background:transparent!important;
  }
  html body .mobile-sticky-actions.ur-global-mobile-nav svg{
    display:block!important;
    width:20px!important;
    height:20px!important;
    margin:0!important;
    overflow:visible!important;
  }
  html body .mobile-sticky-actions.ur-global-mobile-nav .ur-nav-icon .active-shape{display:none!important}
  html body .mobile-sticky-actions.ur-global-mobile-nav .ur-nav-icon .inactive-shape{display:inline!important}
  html body .mobile-sticky-actions.ur-global-mobile-nav>a.active .ur-nav-icon .active-shape,
  html body .mobile-sticky-actions.ur-global-mobile-nav>button.active .ur-nav-icon .active-shape{display:inline!important}
  html body .mobile-sticky-actions.ur-global-mobile-nav>a.active .ur-nav-icon .inactive-shape,
  html body .mobile-sticky-actions.ur-global-mobile-nav>button.active .ur-nav-icon .inactive-shape{display:none!important}
  html body .mobile-sticky-actions.ur-global-mobile-nav span{
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    color:inherit!important;
    font:inherit!important;
  }
  html body .mobile-sticky-actions.ur-global-mobile-nav .ur-global-nav-notify>b{
    position:absolute!important;
    top:1px!important;
    inset-inline-start:calc(50% + 5px)!important;
    min-width:15px!important;
    height:15px!important;
    padding:0 3px!important;
    display:grid!important;
    place-items:center!important;
    border:2px solid #fff!important;
    border-radius:999px!important;
    background:#ef2b2d!important;
    color:#fff!important;
    font:800 7px/1 Inter,system-ui,sans-serif!important;
  }

  /* Avoid collisions with the global nav. */
  html body .floating-actions{display:none!important}
  html body .site-footer{margin-bottom:0!important}
}

@media (max-width:560px){
  html body .ur-global-header{height:var(--ur-shell-mobile-header)!important;min-height:var(--ur-shell-mobile-header)!important}
  html body .ur-global-header .nav-row{
    height:var(--ur-shell-mobile-header)!important;
    min-height:var(--ur-shell-mobile-header)!important;
    padding-inline:10px!important;
  }
  html body .ur-global-header .site-brand{gap:6px!important}
  html body .ur-global-header .site-brand img{width:34px!important;height:34px!important;min-width:34px!important}
  html body .ur-global-header .ur-brand-word{font-size:17px!important}
  html body .ur-global-header .ur-global-mobile-actions{gap:5px!important}
  html body .ur-global-header .ur-global-lang-mini{height:32px!important}
  html body .ur-global-header .ur-global-lang-mini a{min-width:31px!important;height:26px!important;padding:0 5px!important;font-size:8.5px!important}
  html body .ur-global-header .ur-global-head-icon,
  html body .ur-global-header .ur-global-profile-mini{width:31px!important;height:31px!important;min-width:31px!important;min-height:31px!important}
  html body .ur-global-header .ur-global-head-icon svg{width:20px!important;height:20px!important}
  html body .mobile-sticky-actions.ur-global-mobile-nav>a,
  html body .mobile-sticky-actions.ur-global-mobile-nav>button{min-height:48px!important;font-size:7px!important}
  html body .mobile-sticky-actions.ur-global-mobile-nav svg{width:19px!important;height:19px!important}
}

@media (min-width:901px){
  html body .ur-global-mobile-actions,
  html body .ur-global-mobile-nav{display:none!important}
}

/* Community's desktop sub-navigation stays available on large screens, but it is
   content navigation rather than a second mobile app bar. Hiding it on mobile
   keeps Home -> Community transitions visually continuous. */
@media (max-width:900px){
  html body.community-app .urc-topnav{display:none!important}
}

/* Functional pass: authenticated account avatars use the member profile photo when available. */
html body .ur-global-header .ur-global-profile-mini img,
html body .ur-global-header .ur-account-icon img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  border-radius:50%!important;
}
html body .ur-global-header .ur-global-profile-mini,
html body .ur-global-header .ur-account-icon{overflow:hidden!important;}