/* Shared app bar (header.php) on pages that do not load css/main.css: the Angular /for-hospitals/ app.
   Copied from the header rules in main.css, site-enhancements.css and responsive-layout.css, scoped to
   nav.custom-header so nothing else on the page changes. Keep in step with those files when the header changes. */

/* Old Angular app bar: hidden while the shared one is used (html.rs-hdr, set by js/site-header.js).
   Its slot keeps the shared bar's height so the page and the fixed product row sit right below it. */
html.rs-hdr app-top-nav { height: var(--rs-hdr, 80px) !important; background: #4895e9 url(/assets/img/header_bg_small.png) top/cover no-repeat; }
html.rs-hdr app-top-nav > * { display: none !important; }
html.rs-hdr .static-nav-2 { top: var(--rs-hdr, 80px) !important; }

nav.custom-header { font-family: Montserrat, sans-serif; font-size: 1rem; background-image: url(/assets/img/header_bg_small.png) !important; background-repeat: no-repeat; background-size: cover; background-position: top; height: 80px; z-index: 1030; }
nav.custom-header .navbar-brand .img-fluid { width: 180px; }
nav.custom-header .nav-item .nav-link { font-size: 1rem; padding: 10px 15px; font-weight: 600; text-transform: none; color: #fff !important; }
nav.custom-header .nav-item .nav-link:hover, nav.custom-header .nav-item .nav-link:focus { color: #2fc9ef !important; border-radius: 7px 0 7px 7px; border: none; outline: none; }
nav.custom-header .dropdown-menu { font-size: 1rem; padding: .5rem 0; }
nav.custom-header .dropdown-item { font-size: 1rem; color: #212529; }
nav.custom-header .font-weight-600 { font-weight: 600 !important; }
nav.custom-header .book-demo-btn { background-color: #fff; color: #437ceb; font-size: 1rem; padding: .5rem 1rem; margin-right: 1.5rem; border-radius: 30px; }
nav.custom-header .book-demo-btn:hover { background-color: #efebeb !important; color: #437ceb; }
nav.custom-header .header-login-btn { background-color: transparent; border: 2px solid #fff; color: #fff; font-size: 1rem; padding: .5rem 1rem; border-radius: 30px; }
nav.custom-header .header-login-btn:hover { background-color: #fff !important; color: #437ceb; }
nav.custom-header .navbar-toggler:focus { outline: 0 !important; }

@media screen and (max-width: 1370px) {
  nav.custom-header .navbar-brand .img-fluid { max-width: 150px !important; }
}
@media screen and (max-width: 1024px) {
  nav.custom-header { padding-left: 0; padding-right: 0; height: auto !important; }
  nav.custom-header .navbar-brand { margin-left: 2rem; }
  nav.custom-header .navbar-brand img { padding-left: 0 !important; }
  nav.custom-header .navbar-collapse { background-color: #4895e9; }
  nav.custom-header .navbar-collapse .side-btn { margin-right: 0; justify-content: center; }
  nav.custom-header .navbar-collapse .side-btn .book-demo-btn, nav.custom-header .navbar-collapse .side-btn .header-login-btn { font-size: 1rem !important; margin-right: .5rem; }
  nav.custom-header .navbar-toggler { background-color: transparent; border: 0; color: #fff !important; cursor: pointer !important; }
  nav.custom-header #navbarSupportedContent .navbar-nav .nav-link { padding: 10px 6px; }
  nav.custom-header .dropdown-menu { padding: 8px 15px; }
}
@media screen and (max-width: 991px) {
  nav.custom-header { padding: .5rem 1rem; }
  nav.custom-header .fa-bars { color: #fff; font-size: 20px; }
  nav.custom-header .navbar-collapse .dropdown-menu a { white-space: unset; width: unset; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  nav.custom-header .navbar-nav .nav-link { padding-left: .6rem; padding-right: .6rem; }
}
@media screen and (max-width: 768px) {
  nav.custom-header .dropdown-menu { top: 70%; }
  nav.custom-header .dropdown { position: relative; z-index: 50; }
  nav.custom-header .dropdown-item { font-size: 16px !important; white-space: unset !important; }
  nav.custom-header .navbar-brand img { width: 172px !important; padding-left: 25px; }
  nav.custom-header .navbar-collapse { background-color: #4895e9; max-width: 100%; z-index: 10; }
}
@media (max-width: 767.98px) {
  nav.custom-header .btn { white-space: normal; }
  nav.custom-header .navbar-collapse { max-height: calc(100vh - 80px); overflow-y: auto; }
}
@media (hover: none) and (pointer: coarse) {
  nav.custom-header .nav-link, nav.custom-header .dropdown-item, nav.custom-header .btn { min-height: 44px; display: inline-flex; align-items: center; }
  nav.custom-header .dropdown-item { display: block; line-height: 2; }
}
/* responsive-layout.css loads after main.css on the PHP pages, so these come last here too */
@media (min-width: 1280px) and (max-width: 1439.98px) {
  nav.custom-header #navbarSupportedContent .navbar-nav .nav-link { padding: 10px 11px; white-space: nowrap; }
  nav.custom-header .book-demo-btn { margin-right: 1rem; white-space: nowrap; }
  nav.custom-header .header-login-btn { white-space: nowrap; }
}
@media (min-width: 992px) and (max-width: 1279.98px) {
  nav.custom-header { padding-left: .75rem; padding-right: .75rem; }
  nav.custom-header .navbar-brand { margin-right: .5rem; margin-left: 0; }
  nav.custom-header #navbarSupportedContent .navbar-nav .nav-link { padding: 8px; font-size: .88rem; white-space: nowrap; }
  nav.custom-header #navbarSupportedContent .side-btn { flex-wrap: nowrap; white-space: nowrap; margin-left: auto; }
  nav.custom-header .book-demo-btn, nav.custom-header .header-login-btn { font-size: .88rem; padding: .4rem .85rem; white-space: nowrap; margin-top: 0; margin-bottom: 0; }
  nav.custom-header .book-demo-btn { margin-right: .5rem; }
}
