.offline-open { border:1px solid #cfe2d5; border-radius:7px; padding:7px; background:#eaf5ee; color:#164e2c; cursor:pointer; font-size:11px; }
#offlineOpen { position:relative; }
#offlineOpen[data-has-updates="true"]::after { content:'●'; position:absolute; top:1px; right:4px; color:#c62828; font-size:10px; }
.offline-dialog { width:min(560px, calc(100vw - 36px)); max-height:80vh; border:0; border-radius:12px; padding:18px; color:#164e2c; font:14px/1.5 Arial,sans-serif; z-index:100000; }
.offline-dialog::backdrop { background:rgba(0,0,0,.4); }
.offline-dialog h2 { font-size:18px; }
.offline-dialog button { margin:5px 8px 5px 0; padding:9px 12px; border:1px solid #cfe2d5; border-radius:7px; background:#eaf5ee; color:#164e2c; cursor:pointer; }
.offline-dialog button:disabled { opacity:.5; cursor:wait; }
.offline-card { border-top:1px solid #cfe2d5; padding:10px 0; }
.offline-card p { margin:5px 0; }
#connectivityBadge { position:fixed; right:8px; bottom:40px; z-index:4000; border-radius:6px; padding:6px 9px; background:#fff4cf; color:#614600; font:12px Arial,sans-serif; max-width:80vw; }
#map.offline-map { background:#eef1ec; }
#adminMapLink[hidden], #adminLink[hidden] { display:none !important; }
@media(max-width:768px) {
  body.map-page { overflow:hidden; overscroll-behavior:none; }
  #header #offlineOpen { flex:0 0 110px; width:110px; height:42px; padding:4px 10px; font-size:10px; line-height:1.2; }
  #header .header-right { min-width:0; }
  #header .area-switcher { min-width:0; }
  .offline-open { max-width:110px; font-size:10px; }
}
/* Give desktop header items their own space instead of overlapping absolute boxes. */
@media(min-width:769px) {
  #header { box-sizing:border-box; width:100%; padding:0 12px; gap:14px; }
  #header .header-left { position:static; flex:0 0 auto; }
  #header .header-title { flex:1 1 0; min-width:0; max-width:none; text-align:center; }
  #header .header-right { position:static; transform:none; flex:0 1 auto; min-width:0; }
  #header #userInfo { max-width:140px; overflow:hidden; text-overflow:ellipsis; }
  #header #offlineOpen { flex:0 0 auto; max-width:175px; line-height:1.3; }
  #header #btnLogout, #header .header-action { flex-shrink:0; }
}
