/* RXOPD mobile alignment final patch - 2026-06-29
   Scope: visual/layout only. No backend, database, auth, payment, role permission, or module workflow change. */
:root{
  --rx-mobile-card-line:#dcecff;
  --rx-mobile-green:#10a66a;
  --rx-mobile-blue:#1769e0;
  --rx-mobile-ink:#0b2540;
  --rx-mobile-shadow:0 12px 28px rgba(11,94,215,.09);
}

/* Public/role header: keep the same white hanging header feel as the index page and keep content below it. */
body.rx-standard-shell .rx-topbar,
body.rx-standard-shell .rx-topbar.rx-hanging-header,
body.rx-standard-shell header.rx-topbar.rx-hanging-header{
  position:sticky!important;
  top:0!important;
  left:auto!important;
  right:auto!important;
  transform:none!important;
  translate:none!important;
  width:min(1180px,calc(100% - 16px))!important;
  max-width:1180px!important;
  min-height:58px!important;
  height:auto!important;
  margin:0 auto 12px!important;
  padding:8px 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  z-index:1000!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(220,236,255,.96)!important;
  border-top:0!important;
  border-radius:0 0 20px 20px!important;
  box-shadow:0 12px 30px rgba(15,50,90,.12)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  overflow:visible!important;
}
body.rx-standard-shell .rx-page,
body.rx-standard-shell .rx-topbar + .rx-page{
  margin-top:0!important;
  padding-top:10px!important;
  clear:both!important;
}
body.rx-standard-shell .rx-page > :first-child{margin-top:0!important;}

/* Explore Near You: all category images sit in the same visual slot inside their cards. */
body.rx-standard-shell .rxhome-near-section{
  overflow:hidden!important;
}
body.rx-standard-shell .rxhome-near-grid{
  align-items:stretch!important;
}
body.rx-standard-shell .rxhome-map-card,
body.rx-standard-shell .rxhome-near-card{
  height:auto!important;
  min-height:142px!important;
  border-radius:14px!important;
}
body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card){
  display:grid!important;
  grid-template-rows:auto auto minmax(62px,1fr) auto!important;
  align-items:start!important;
  padding:10px!important;
  gap:3px!important;
  overflow:hidden!important;
}
body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card) small,
body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card) strong,
body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card) em{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  text-align:left!important;
}
body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card) strong{
  min-height:28px!important;
  margin:0!important;
  overflow:hidden!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
}
body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card) img{
  display:block!important;
  width:100%!important;
  height:68px!important;
  max-height:68px!important;
  min-height:68px!important;
  object-fit:contain!important;
  object-position:center center!important;
  align-self:center!important;
  justify-self:center!important;
  margin:2px 0 3px!important;
  padding:4px!important;
  border-radius:10px!important;
  background:#f3f8ff!important;
}
body.rx-standard-shell .rxhome-map-card img{
  width:100%!important;
  height:100%!important;
  min-height:142px!important;
  object-fit:cover!important;
  object-position:center center!important;
}
body.rx-standard-shell .rxhome-viewall-card{
  min-height:142px!important;
  display:grid!important;
  place-content:center!important;
  justify-items:center!important;
  align-items:center!important;
  text-align:center!important;
  gap:4px!important;
  padding:10px!important;
  background:linear-gradient(160deg,#10b981 0%,#059669 100%)!important;
  border-color:rgba(5,150,105,.24)!important;
  color:#fff!important;
}

/* Featured Doctors & Chambers: Find Doctors and Find Chambers must remain side by side. */
body.rx-standard-shell .rx20-home-head .rx20-home-links,
body.rx-standard-shell .rx20-home-links{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:stretch!important;
  justify-content:flex-end!important;
  gap:8px!important;
  width:min(100%,330px)!important;
  min-width:0!important;
  grid-template-columns:none!important;
}
body.rx-standard-shell .rx20-home-links a{
  flex:1 1 0!important;
  min-width:0!important;
  min-height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:nowrap!important;
  border-radius:13px!important;
  background:var(--rx-mobile-green)!important;
  color:#fff!important;
  border:1px solid rgba(8,121,68,.18)!important;
  box-shadow:0 10px 20px rgba(16,166,106,.18)!important;
  font-weight:950!important;
}

/* Logged-in desk topbars: carry the same white rounded header visual and keep page body below header on mobile. */
.clean-admin-shell .clean-admin-topbar,
.staff-desk-shell .staff-topbar,
.company-desk-shell .company-topbar{
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(220,236,255,.96)!important;
  border-top:0!important;
  border-radius:0 0 20px 20px!important;
  box-shadow:0 12px 30px rgba(15,50,90,.12)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.clean-admin-shell .clean-admin-page,
.staff-desk-shell .staff-page{
  padding-top:96px!important;
}
.company-desk-shell .company-page{
  padding-top:1.15rem!important;
}

/* Admin Desk only: when the side menu is open, do not keep the hamburger floating above it. */
.clean-admin-shell.admin-sidebar-open .clean-admin-menu-button{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

@media(max-width:860px){
  .clean-admin-shell .clean-admin-topbar{
    left:8px!important;
    right:8px!important;
    top:0!important;
    width:auto!important;
    min-height:64px!important;
    height:auto!important;
    padding:8px 12px 8px 72px!important;
    align-items:center!important;
    z-index:50!important;
  }
  .clean-admin-shell .clean-admin-page{
    margin-left:0!important;
    padding:92px 12px 28px!important;
  }
}
@media(max-width:900px){
  .staff-desk-shell .staff-topbar{
    left:8px!important;
    right:8px!important;
    top:0!important;
    width:auto!important;
    min-height:64px!important;
    height:auto!important;
    padding:8px 12px 8px 70px!important;
    align-items:center!important;
    z-index:50!important;
  }
  .staff-desk-shell .staff-page{
    margin-left:0!important;
    padding:92px 12px 28px!important;
  }
}
@media(max-width:720px){
  body.rx-standard-shell .rx-topbar,
  body.rx-standard-shell .rx-topbar.rx-hanging-header,
  body.rx-standard-shell header.rx-topbar.rx-hanging-header{
    width:calc(100% - 10px)!important;
    min-height:56px!important;
    margin:0 auto 12px!important;
    padding:7px 9px!important;
    border-radius:0 0 18px 18px!important;
  }
  body.rx-standard-shell .rx-page,
  body.rx-standard-shell .rx-topbar + .rx-page{
    padding-top:10px!important;
  }
  body.rx-standard-shell .rxhome-map-card,
  body.rx-standard-shell .rxhome-near-card{
    min-height:122px!important;
    max-width:154px!important;
    flex-basis:154px!important;
  }
  body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card){
    grid-template-rows:auto auto 54px auto!important;
    padding:8px!important;
    gap:2px!important;
  }
  body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card) strong{
    min-height:24px!important;
  }
  body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card) img{
    height:54px!important;
    min-height:54px!important;
    max-height:54px!important;
    padding:3px!important;
    border-radius:8px!important;
  }
  body.rx-standard-shell .rxhome-map-card img{
    min-height:122px!important;
  }
  body.rx-standard-shell .rxhome-viewall-card{
    min-height:122px!important;
  }
  body.rx-standard-shell .rx20-home-head{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  body.rx-standard-shell .rx20-home-head .rx20-home-links,
  body.rx-standard-shell .rx20-home-links{
    width:100%!important;
    max-width:100%!important;
    justify-content:center!important;
  }
  body.rx-standard-shell .rx20-home-links a{
    min-height:40px!important;
    padding:8px 6px!important;
    font-size:11.6px!important;
    line-height:1!important;
  }
  .company-desk-shell .company-topbar{
    width:calc(100vw - 12px)!important;
    min-height:56px!important;
    margin:0 auto 12px!important;
    top:0!important;
    border-radius:0 0 18px 18px!important;
  }
  .company-desk-shell .company-page{
    padding-top:.95rem!important;
  }
}
@media(max-width:390px){
  body.rx-standard-shell .rxhome-map-card,
  body.rx-standard-shell .rxhome-near-card{
    min-height:116px!important;
    max-width:146px!important;
    flex-basis:146px!important;
  }
  body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card){
    grid-template-rows:auto auto 48px auto!important;
  }
  body.rx-standard-shell .rxhome-near-card:not(.rxhome-viewall-card) img{
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
  }
  body.rx-standard-shell .rxhome-map-card img,
  body.rx-standard-shell .rxhome-viewall-card{
    min-height:116px!important;
  }
  body.rx-standard-shell .rx20-home-links a{
    font-size:10.8px!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }
}