/* Shared navigation: dashboard and device views keep the same geometry. */
body, body.dashboard-exo { --sidebar-width: 240px; }
.sidebar.sidebar-v2 {
  background: #f6f8fa; color: #274154; border-right: 1px solid #dbe3e9;
  height: 100dvh; min-height: 0; max-height: 100dvh; min-width: 0;
}
.scada-workspace .sidebar.sidebar-v2 {
  height: calc(100dvh - var(--dashboard-header-height));
  max-height: calc(100dvh - var(--dashboard-header-height));
}
.sidebar-v2 .brand { min-height: 62px; padding: 16px; border-color: #dbe3e9; flex-shrink: 0; }
.sidebar-v2 .brand-product { color: #526a7c; letter-spacing: 0; }
.sidebar-v2 .sidebar-status { display: block; position: relative; padding: 0; border-top: 1px solid #dbe3e9; border-color: #dbe3e9; flex-shrink: 0; }
.sidebar-v2 .sidebar-status > summary { display: flex; align-items: center; gap: 10px; padding: 9px 14px; cursor: pointer; list-style: none; }
.sidebar-v2 .sidebar-status > summary::-webkit-details-marker { display: none; }
.sidebar-v2 .sidebar-status > summary > span:nth-child(2) { flex: 1; min-width: 0; }
.sidebar-v2 .sidebar-status > summary::after { content: ""; width: 6px; height: 6px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(-45deg); flex-shrink: 0; }
.sidebar-v2 .sidebar-status[open] > summary, .sidebar-v2 .sidebar-status > summary:hover { background: #e7f0f7; }
.sidebar-v2 .sidebar-attention-panel { position: absolute; bottom: calc(100% + 4px); left: 8px; right: 8px; z-index: 50; border: 1px solid #c8d5df; border-radius: 4px; background: #fff; box-shadow: 0 4px 16px rgba(30,55,75,.15); }
.sidebar-v2 .sidebar-attention-heading { display: flex; align-items: center; justify-content: space-between; padding: 6px 8px; border-bottom: 1px solid #dbe3e9; }
.sidebar-v2 .sidebar-attention-heading strong { font-size: 12px; }
.sidebar-v2 .sidebar-attention-heading button { width: 28px; height: 28px; padding: 0; font-size: 20px; border: 0; background: transparent; color: #526a7c; box-shadow: none; }
.sidebar-v2 #sidebarAttentionList { max-height: min(400px, calc(100dvh - 310px)); min-height: 40px; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.sidebar-v2 #sidebarAttentionList button { display: block; width: 100%; min-height: 40px; padding: 9px 10px; border: 0; border-bottom: 1px solid #edf2f6; border-radius: 0; color: #274154; background: transparent; text-align: left; box-shadow: none; overflow-wrap: anywhere; }
.sidebar-v2 #sidebarAttentionList button:hover { background: #e7f0f7; }
.sidebar-v2 #sidebarAttentionList strong { display: block; font-size: 12px; }
.sidebar-v2 #sidebarAttentionList small { font-size: 11px; }
.sidebar-v2 #sidebarAttentionList p { margin: 10px; font-size: 12px; }
.sidebar-v2 .sidebar-status strong, .sidebar-v2 .user-name { color: #274154; }
.sidebar-v2 .sidebar-status small, .sidebar-v2 .nav-group-title, .sidebar-v2 .user-role { color: #5d7182; letter-spacing: 0; }
.sidebar-v2 .signal-dot { background: #7c8c98; box-shadow: none; flex-shrink: 0; }
.sidebar-v2 .signal-dot[data-state="ok"] { background: #238344; }
.sidebar-v2 .signal-dot[data-state="warning"] { background: #a56d13; }
.sidebar-v2 .signal-dot[data-state="error"] { background: #b52d39; }
.sidebar-v2 .sidebar-workspace { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto; }
.sidebar-v2 .nav { padding: 6px 8px; flex-shrink: 0; }
.sidebar-v2 .nav-group { margin: 0; }
.sidebar-v2 .nav-group-title { display: none; }
.sidebar-v2 .nav button {
  min-height: 36px; padding: 7px 10px; margin: 0; border: 0; border-radius: 3px;
  font-size: 13px; line-height: 1.4; color: #274154; background: transparent; box-shadow: none;
}
.sidebar-v2 .nav button:hover { background: #edf2f6; }
.sidebar-v2 .nav button.active { background: #e7f0f7; color: #00518a; box-shadow: inset 3px 0 #00518a; font-weight: 700; }
.sidebar-v2 .sidebar-objects {
  display: flex; flex-direction: column; flex: 1 0 193px; min-height: 193px;
  padding: 8px 8px 0; border-top: 1px solid #dbe3e9; overflow: hidden;
}
.sidebar-v2 .sidebar-tree-heading { display: flex; align-items: center; justify-content: space-between; padding: 0 6px 4px; }
.sidebar-v2 .sidebar-tree-heading strong { font-size: 12px; font-weight: 600; }
.sidebar-v2 .sidebar-tree-heading button {
  width: 28px; height: 28px; padding: 0; border: 0; border-radius: 3px; background: transparent; color: #526a7c; font-size: 19px;
}
.sidebar-v2 #sidebarSearch {
  flex-shrink: 0; width: 100%; min-width: 0; min-height: 32px; padding: 6px 8px;
  font-size: 12px; color: #274154; background: #fff; border: 1px solid #c8d5df; border-radius: 3px;
}
.sidebar-v2 #sidebarSearch::placeholder { color: #617486; }
.sidebar-v2 .sidebar-tree-filters { display: flex; gap: 2px; padding-top: 5px; flex-shrink: 0; }
.sidebar-v2 .sidebar-tree-filters button { flex: 1; min-width: 0; min-height: 28px; padding: 4px 3px; font-size: 11px; color: #526a7c; background: transparent; border: 0; border-radius: 3px; box-shadow: none; }
.sidebar-v2 .sidebar-tree-filters button[aria-pressed="true"] { background: #e7f0f7; color: #00518a; box-shadow: inset 0 -2px #00518a; }
.sidebar-v2 .site-tree { flex: 1; min-height: 0; margin: 6px 0 0; padding: 0 0 6px; border: 0; overflow: auto; scrollbar-gutter: stable; }
.sidebar-v2 .sidebar-object { margin-bottom: 4px; }
.sidebar-v2 .sidebar-object-row { display: flex; align-items: stretch; gap: 1px; border-radius: 3px; }
.sidebar-v2 .sidebar-object-row:hover, .sidebar-v2 .sidebar-object-row:focus-within { background: #edf2f6; }
.sidebar-v2 .sidebar-object-row.is-current { background: #e7f0f7; box-shadow: inset 2px 0 #00518a; }
.sidebar-v2 .sidebar-object-toggle {
  width: 26px; height: 32px; margin-top: 2px; align-self: flex-start; padding: 0; border: 0; border-radius: 3px; background: transparent; color: #526a7c; flex-shrink: 0;
}
.sidebar-v2 .sidebar-object-toggle::before { content: ""; display: inline-block; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); }
.sidebar-v2 .sidebar-object-toggle[aria-expanded="true"]::before { transform: rotate(45deg); }
.sidebar-v2 .tree-object, .sidebar-v2 .tree-device {
  min-width: 0; min-height: 32px; margin: 0; padding: 6px; gap: 7px;
  border: 0; border-radius: 3px; background: transparent; color: #274154; font-size: 12px; line-height: 1.4; box-shadow: none;
}
.sidebar-v2 .tree-object { flex: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 3px; min-height: 48px; padding: 8px 5px; font-size: 13px; text-align: left; }
.sidebar-v2 .sidebar-object-name { display: block; width: 100%; font-weight: 600; white-space: normal; }
.sidebar-v2 .tree-device { padding-left: 15px; }
.sidebar-v2 .tree-device-name, .sidebar-v2 .sidebar-object-name { min-width: 0; overflow-wrap: anywhere; }
.sidebar-v2 .sidebar-object-count { flex-shrink: 0; font-variant-numeric: tabular-nums; }
.sidebar-v2 .sidebar-object-summary { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; min-height: 16px; color: #617486; font-size: 11px; font-weight: 400; }
.sidebar-v2 .sidebar-favorite { width: 23px; min-height: 32px; margin-top: 2px; align-self: flex-start; flex-shrink: 0; padding: 0; font-size: 16px; border: 0; border-radius: 3px; color: #617486; background: transparent; box-shadow: none; opacity: 0; pointer-events: none; }
.sidebar-v2 .sidebar-object-row:hover .sidebar-favorite,
.sidebar-v2 .sidebar-object-row:focus-within .sidebar-favorite,
.sidebar-v2 .sidebar-favorite[aria-pressed="true"] { opacity: 1; pointer-events: auto; }
.sidebar-v2 .sidebar-favorite:hover { background: #edf2f6; }
.sidebar-v2 .sidebar-favorite[aria-pressed="true"] { color: #976115; }
.sidebar-v2 .tree-device:hover { background: #edf2f6; color: #00518a; }
.sidebar-v2 .tree-object:hover, .sidebar-v2 .sidebar-object-toggle:hover, .sidebar-v2 .tree-object.active { background: transparent; color: #00518a; box-shadow: none; }
.sidebar-v2 .tree-device.active { background: #e7f0f7; color: #00518a; box-shadow: inset 2px 0 #00518a; }
.sidebar-v2 .tree-devices { margin-left: 13px; border-left: 1px solid #dbe3e9; padding-left: 4px; }
.sidebar-v2 .tree-state { width: 7px; height: 7px; box-shadow: none; background: #7c8c98; }
.sidebar-v2 .tree-state.online { background: #238344; }
.sidebar-v2 .tree-state.offline { background: #b52d39; }
.sidebar-v2 .tree-state.partial { background: #a56d13; }
.sidebar-v2 .tree-state.unknown { background: #7c8c98; }
.sidebar-v2 .sidebar-tree-empty { margin: 10px 6px; font-size: 12px; color: #617486; }
.sidebar-v2 .sidebar-administration { flex-shrink: 0; margin: 6px 8px 0; border-top: 1px solid #dbe3e9; }
.sidebar-v2 .sidebar-administration > summary { padding: 10px 8px; font-size: 12px; font-weight: 600; cursor: pointer; }
.sidebar-v2 .sidebar-administration .nav { padding: 0 0 6px; }
.sidebar-v2 .sidebar-alarm-summary { flex-shrink: 0; gap: 0; padding: 5px 8px; border-color: #dbe3e9; }
.sidebar-v2 .sidebar-alarm-summary button, .sidebar-v2 .sidebar-alarm-summary button:hover {
  min-height: 27px; padding: 4px 6px; color: #274154; background: transparent; font-size: 11px; border-radius: 3px; gap: 6px;
}
.sidebar-v2 .sidebar-alarm-summary button:hover { background: #e7f0f7; }
.sidebar-v2 .sidebar-alarm-counts { gap: 8px; }
.sidebar-v2 .sidebar-alarm-counts b, .sidebar-v2 #sidebarOfflineCount, .sidebar-v2 #sidebarUnknownCount { color: #274154; font-size: 12px; }
.sidebar-v2 .sidebar-alarm-counts .alarm-a { color: #ae3434; }
.sidebar-v2 .sidebar-alarm-counts .alarm-b { color: #976115; }
.sidebar-v2 .sidebar-alarm-counts .alarm-c { color: #315f87; }
.sidebar-v2 .sidebar-footer { flex-shrink: 0; margin: 0; padding: 8px; border-color: #dbe3e9; position: relative; }
.sidebar-v2 .sidebar-account { position: relative; }
.sidebar-v2 .user-card { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; padding: 8px; border: 0; border-radius: 3px; background: #eaf0f5; cursor: pointer; list-style: none; }
.sidebar-v2 .user-card::-webkit-details-marker { display: none; }
.sidebar-v2 .user-card::after { content: ""; width: 6px; height: 6px; border-top: 1.5px solid #526a7c; border-right: 1.5px solid #526a7c; transform: rotate(-45deg); flex-shrink: 0; }
.sidebar-v2 .user-card > span { min-width: 0; }
.sidebar-v2 .user-name, .sidebar-v2 .user-role { display: block; overflow-wrap: anywhere; line-height: 1.4; }
.sidebar-v2 .user-role { margin-top: 2px; }
.sidebar-v2 .sidebar-account-menu { position: absolute; bottom: calc(100% + 6px); left: 0; right: 0; z-index: 50; padding: 5px; border: 1px solid #c8d5df; border-radius: 4px; background: #fff; box-shadow: 0 4px 16px rgba(30,55,75,.12); }
.sidebar-v2 .sidebar-account-menu .ghost { width: 100%; margin: 0; padding: 9px; border: 0; border-radius: 3px; color: #274154; background: transparent; font-size: 13px; text-align: left; }
.sidebar-v2 .sidebar-account-menu .ghost:hover { background: #e7f0f7; }
.sidebar-v2 [hidden] { display: none !important; }
.sidebar-v2 button:focus-visible, .sidebar-v2 summary:focus-visible, .sidebar-v2 input:focus-visible { outline: 2px solid #2475af; outline-offset: -2px; }
.object-device-filter { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13px; color: #526a7c; }
.monitoring-order-list { max-height: min(50dvh, 420px); overflow-y: auto; scrollbar-gutter: stable; }
.monitoring-order-item .order-position { width: 64px; flex: 0 0 64px; min-width: 0; }
.monitoring-order-item .order-handle { cursor: grab; touch-action: auto; }
.monitoring-order-item.is-dragging { opacity: .5; }
.monitoring-order-item.is-drop-target { box-shadow: inset 0 -2px #00518a; }
@media (max-width: 600px) {
  .monitoring-order-item { gap: 4px; flex-wrap: wrap; }
  .monitoring-order-item > span { flex-basis: calc(100% - 44px); }
  .monitoring-order-item .order-position { margin-left: 36px; }
}
@media (max-width: 900px) { .sidebar.sidebar-v2 { display: none; } }
@media (hover: none), (pointer: coarse) {
  .sidebar-v2 .sidebar-favorite { opacity: 1; pointer-events: auto; }
}
