/* CareSync Pilot v0.47.63 — compact two-row header.
   Keeps both Office and Carer navigation visible and tidy. */
header{
  min-height:46px !important;
  height:auto !important;
  padding:3px 10px !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-rows:40px auto !important;
  align-items:center !important;
  gap:0 8px !important;
  flex-wrap:nowrap !important;
  overflow:visible !important;
}
header .brand{
  grid-column:1 !important;grid-row:1 !important;
  display:flex !important;align-items:center !important;
  font-size:20px !important;line-height:1 !important;
  padding:0 !important;margin:0 !important;
}
header .brand img{height:34px !important;width:auto !important;margin-right:5px !important}
header .brand small{font-size:9px !important}
header .session-user{
  grid-column:2 !important;grid-row:1 !important;
  margin:0 !important;display:flex !important;align-items:center !important;
  gap:5px !important;white-space:nowrap !important;font-size:12px !important;
}
header .session-user button{padding:6px 9px !important;font-size:12px !important;line-height:1 !important}

/* Both navigation types use the compact second row. */
header .office-nav,
header .carer-mobile-nav{
  display:flex !important;
  grid-column:1 / -1 !important;
  grid-row:2 !important;
  width:100% !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-wrap:nowrap !important;
  gap:18px !important;
  margin:0 !important;
  padding:4px 0 6px !important;
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch;
}
header .office-nav a,
header .carer-mobile-nav a{
  display:block !important;
  flex:0 0 auto !important;
  margin:0 !important;
  padding:5px 0 !important;
  font-size:13px !important;
  line-height:1.1 !important;
  white-space:nowrap !important;
}

/* On phones keep the same structure, just slightly tighter. */
@media(max-width:800px){
  header{padding:3px 8px !important}
  header .brand{font-size:18px !important}
  header .brand img{height:32px !important}
  header .brand small{display:none !important}
  header .session-user{font-size:11px !important}
  header .session-user button{padding:5px 8px !important;font-size:11px !important}
  header .office-nav,
  header .carer-mobile-nav{gap:12px !important;padding:3px 0 5px !important}
  header .office-nav a,
  header .carer-mobile-nav a{font-size:12px !important;padding:5px 0 !important}
}