/* Shared compact toolbar; screen-specific grids and all business data stay intact. */
#app .content > .workspace-topbar {
  display:grid;grid-template-columns:76px minmax(120px,1fr) auto auto;
  grid-template-rows:auto auto;gap:6px 12px;align-items:center;
  height:auto;min-height:96px;padding:8px 14px;flex-shrink:0;
  background:#090909;backdrop-filter:none;overflow:visible;
}
#app .workspace-topbar > .mobile-menu {
  grid-column:1;grid-row:1 / 3;display:flex;flex-direction:column;
  width:76px;min-width:76px;max-width:76px;height:76px;min-height:76px;
  padding:6px;gap:5px;flex:none;border:1px solid #d4ae44;border-radius:14px;
  background:#211c0f;color:#fff;font-size:13px;line-height:1.2;
}
#app .workspace-topbar > .mobile-menu > span:first-child {font-size:29px;line-height:1;}
#app .workspace-topbar > .mobile-menu[aria-expanded="true"] {background:#d4ae44;color:#111;}
#app .workspace-topbar > .workspace-title {display:block!important;grid-column:2;grid-row:1;min-width:0;}
#app .workspace-topbar .page-title {font-size:18px;line-height:1.3;margin:0;}
#app .workspace-topbar > .topbar-employee {grid-column:4;grid-row:1;margin:0;gap:6px;min-width:0;max-width:220px;}
#app .workspace-topbar .topbar-employee strong {display:block;font-size:13px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
#app .workspace-topbar .topbar-employee .avatar {width:30px;height:30px;flex-basis:30px;}
#app .workspace-topbar > .topbar-status {grid-column:3;grid-row:1;display:flex;gap:6px;align-items:center;min-width:0;}
#app .workspace-topbar .connection-status {width:auto;min-height:32px;padding:4px 8px;gap:6px;font-size:11px;line-height:1.4;max-width:320px;white-space:normal;}
#app .workspace-topbar .connection-status span {display:inline;}
#app .workspace-topbar .connection-status i {flex:0 0 8px;width:8px;height:8px;}
#app .workspace-topbar .connection-status .small-action {flex:none;}
#app .workspace-topbar > .top-actions {
  grid-column:2 / -1;grid-row:2;display:flex;align-items:center;justify-content:flex-start;
  flex-wrap:nowrap;gap:6px;margin:0;min-width:0;width:100%;padding:3px 0;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#a88c48 #171717;
}
#app .workspace-topbar .top-actions > button,
#app .workspace-topbar .saher-window-controls > button {
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  flex:0 0 auto;width:auto;min-width:78px;max-width:none;height:40px;min-height:40px;
  padding:6px 12px;border-radius:10px;font-family:inherit;font-size:12px;
  font-weight:700;line-height:1.25;white-space:nowrap;
}
#app .workspace-topbar .top-actions > button[hidden] {display:none!important;}
#app .workspace-topbar .saher-window-controls {gap:6px;flex:none;}
#app .workspace-topbar .saher-window-controls [data-window-close] {min-width:42px;width:42px;padding:3px;font-size:26px;}
#app .workspace-topbar .top-actions .notification-count,
#app .workspace-topbar .top-actions .approval-count {position:static;transform:none;min-width:22px;height:22px;padding:2px 5px;line-height:18px;font-size:10px;}
#app .workspace-topbar #business-offline-status {order:initial;flex:none;margin:0!important;padding:0!important;line-height:1.4!important;font-size:11px!important;}
#app .workspace-topbar #business-offline-status > summary,
#app .workspace-topbar #offline-review-notice > summary {
  box-sizing:border-box;display:list-item;list-style-position:inside;cursor:pointer;
  max-width:none!important;padding:6px 9px!important;min-height:32px;
  border:1px solid #bd9b48;border-radius:9px;background:#edf5ff;color:#111!important;
  font-size:11px;line-height:1.5;white-space:nowrap;
}
#app .workspace-topbar #offline-review-notice > summary,
#app .workspace-topbar #business-offline-status[data-attention="true"] > summary {background:#fff3d7;}
#app .workspace-topbar #business-offline-status .sync-status-body {
  position:fixed;inset:auto;top:104px;inset-inline-end:12px;z-index:16001;
  width:min(450px,calc(100vw - 24px));max-height:calc(100dvh - 180px);
  overflow:auto;box-sizing:border-box;padding:14px;border:1px solid #bd9b48;border-radius:12px;
  background:#fff;color:#111;box-shadow:0 8px 24px #0006;line-height:1.8;
}
#app .workspace-topbar .sync-status-body :is(p,summary,span) {color:#111!important;}
#app .workspace-topbar .sync-status-body p {margin:0 0 10px;}
#app .workspace-topbar .sync-status-body button {margin:4px;min-height:36px;}
#app .workspace-topbar :is(button,summary):focus-visible {outline:2px solid #ffe393;outline-offset:-3px;}
@media(max-width:1050px) {
  #app .content > .workspace-topbar {grid-template-columns:68px minmax(0,1fr) auto;grid-template-rows:auto auto auto;padding:6px 10px;gap:4px 8px;}
  #app .workspace-topbar > .mobile-menu {width:68px;min-width:68px;max-width:68px;height:68px;min-height:68px;}
  #app .workspace-topbar > .topbar-employee {grid-column:3;max-width:160px;}
  #app .workspace-topbar > .topbar-status {grid-column:2 / -1;grid-row:2;overflow-x:auto;scrollbar-width:thin;}
  #app .workspace-topbar > .topbar-status > * {flex-shrink:0;}
  #app .workspace-topbar > .top-actions {grid-column:1 / -1;grid-row:3;}
  #app .workspace-topbar #business-offline-status .sync-status-body {top:140px;}
}
@media(max-width:600px) {
  #app .content > .workspace-topbar {grid-template-columns:64px minmax(0,1fr) auto;padding:5px 6px;gap:4px 6px;}
  #app .workspace-topbar > .mobile-menu {width:64px;min-width:64px;max-width:64px;height:64px;min-height:64px;font-size:12px;}
  #app .workspace-topbar .page-title {font-size:15px;}
  #app .workspace-topbar > .topbar-employee {max-width:92px;}
  #app .workspace-topbar .topbar-employee strong {font-size:11px;}
  #app .workspace-topbar .topbar-employee .avatar {display:none;}
  #app .workspace-topbar .top-actions > button {height:40px;min-height:40px;min-width:74px;font-size:11px;padding:5px 9px;}
}
@media print {#app .content > .workspace-topbar {display:none!important;}}
