/* Frame controls use the operator palette, never the Studio chrome theme. */
.video-service-control,.trend-control,.ah-filter-dialog,.trend-dialog{
  color-scheme:light;
  --theme-text:#17202a;--theme-muted:#667789;
  --theme-surface:#fff;--theme-surface-2:#f2f5f8;--theme-surface-alt:#f2f5f8;
  --theme-input:#f8fafc;--theme-line:#d8e0e8;--theme-line-strong:#b9c5d1;
  --theme-accent:#1976d2;--theme-accent-soft:#e8f2fd;--theme-warning:#f59e0b;
  --theme-danger:#d6334c;--theme-shadow:0 18px 60px #10182040;
  /* Legacy Studio rules also address table cells through these aliases. */
  --text:var(--theme-text);--muted:var(--theme-muted);--line:var(--theme-line);
  --surface:var(--theme-surface);--surface2:var(--theme-surface-2);
  --blue:var(--theme-accent);--blue2:#1565c0;--shadow:var(--theme-shadow);
}
.video-frame-element.service-control{background:transparent}
.video-frame-element.service-control>.video-service-control,.video-frame-element.service-control>.video-navigation-control{pointer-events:none}
.video-service-control{display:flex;width:100%;height:100%;min-width:0;min-height:0;box-sizing:border-box;flex-direction:column;overflow:hidden;border:1px solid var(--theme-line-strong);border-radius:4px;color:var(--theme-text);background:var(--theme-surface);font-family:Inter,system-ui,sans-serif;font-size:11px}
.video-service-control>header{display:flex;min-height:30px;box-sizing:border-box;align-items:center;justify-content:space-between;gap:8px;padding:6px 9px;border-bottom:1px solid var(--theme-line);background:var(--theme-surface-2)}
.video-service-control>header[hidden]{display:none}
.video-service-control>header strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.video-service-control-count{min-width:22px;padding:2px 6px;border-radius:10px;color:#fff;background:var(--theme-accent);text-align:center;font-size:10px}
.video-alarm-history-toolbar{display:flex;min-width:0;flex:none;align-items:center;gap:6px;padding:5px 7px;border-bottom:1px solid var(--theme-line);background:var(--theme-surface)}
.video-alarm-history-playback{display:flex;flex:none;gap:3px}
.video-alarm-history-playback button{display:grid;width:26px;height:26px;box-sizing:border-box;place-items:center;padding:0;border:1px solid var(--theme-line);border-radius:4px;color:var(--theme-muted);background:var(--theme-input);font-size:12px;line-height:1;cursor:pointer}
.video-alarm-history-playback button:hover,.video-alarm-history-playback button:focus-visible{border-color:var(--theme-accent);color:var(--theme-accent);outline:none}
.video-alarm-history-playback button.active{border-color:var(--theme-accent);color:#fff;background:var(--theme-accent)}
.video-alarm-history-filters{display:flex;min-width:0;flex:1;gap:4px;overflow-x:auto}
.video-alarm-history-filters input{width:100px;min-width:78px;height:26px;box-sizing:border-box;padding:3px 6px;border:1px solid var(--theme-line);border-radius:4px;color:var(--theme-text);background:var(--theme-input);font:10px Inter,system-ui,sans-serif}
.video-alarm-history-filters input[type="datetime-local"]{width:142px;min-width:128px}
.video-alarm-history-filters input:focus{border-color:var(--theme-accent);outline:none}
.video-service-control.history-paused>header{box-shadow:inset 3px 0 var(--theme-warning,#f59e0b)}
.video-service-control-table-wrap{min-height:0;flex:1;overflow:auto}
.video-service-control table{width:100%;min-width:var(--control-table-width);table-layout:fixed;border-collapse:collapse;white-space:nowrap}

.alarm-column-resizer{position:absolute;right:0;top:0;bottom:0;width:8px;cursor:col-resize;touch-action:none;user-select:none;z-index:3}
.alarm-column-resizer:hover{border-right:2px solid #3988e8;background:rgba(57,136,232,.16)}
[data-ah-head]>div{position:relative}
.alarm-columns-interactive table{width:var(--control-table-width)}
.alarm-columns-resizing,.alarm-columns-resizing *{cursor:col-resize!important;user-select:none!important}
.video-frame-editor .alarm-column-resizer{display:none}
.video-service-control th,.video-service-control td{padding:6px 8px;border-right:1px solid var(--theme-line);border-bottom:1px solid var(--theme-line);text-align:left}
.video-service-control th,.video-service-control td{overflow:hidden;text-overflow:ellipsis}
.video-service-control th{position:sticky;top:0;color:var(--theme-muted);background:var(--theme-input);font-weight:600}
.video-service-control td{background:var(--theme-surface)}
.video-service-control-empty{text-align:center!important;color:var(--theme-muted)}
.video-service-alarm-acknowledge{padding:3px 7px;border:1px solid var(--theme-accent);border-radius:4px;color:var(--theme-accent);background:transparent;cursor:pointer}
.runtime-video-frame-detail .video-frame-preview-element.service-control{pointer-events:auto}
.video-navigation-control{width:100%;height:100%}
.video-navigation-button{display:flex;width:100%;height:100%;box-sizing:border-box;align-items:center;justify-content:center;gap:9px;padding:7px 14px;border:1px solid var(--theme-line-strong);border-radius:7px;color:var(--theme-text);background:var(--theme-surface);font:600 12px Inter,system-ui,sans-serif;cursor:pointer;opacity:.72;transition:opacity .18s ease,border-color .18s ease,background-color .18s ease,color .18s ease}
.video-navigation-button:hover,.video-navigation-button:focus-visible{border-color:var(--theme-accent);color:var(--theme-accent);background:var(--theme-accent-soft);outline:none;opacity:1}
.video-navigation-control.label-hidden .video-navigation-button{padding-inline:8px}
.video-navigation-button-icon{font-size:20px;line-height:1}
.video-navigation-button-icon svg{display:block;width:32px;height:32px;pointer-events:none}
.video-navigation-control[data-navigation-variant="hamburger"] .video-navigation-button{border:0;border-radius:50%;color:#fff;background:rgba(0,0,0,.1);box-shadow:0 2px 8px rgba(0,0,0,.2);opacity:.35;transition:.3s;touch-action:manipulation}
.video-navigation-control[data-navigation-variant="hamburger"] .video-navigation-button:hover,.video-navigation-control[data-navigation-variant="hamburger"] .video-navigation-button:focus-visible,.video-navigation-control[data-navigation-variant="hamburger"] .video-navigation-button:active{color:#fff;background:rgba(0,0,0,.8);transform:scale(1.1);opacity:1}
.video-navigation-control[data-navigation-variant="grid"] .video-navigation-button{border-radius:3px;background:var(--theme-input)}
.video-navigation-control[data-navigation-variant="list"] .video-navigation-button{justify-content:flex-start;border-left:4px solid var(--theme-accent);border-radius:2px}
.video-navigation-control[data-navigation-variant="compass"] .video-navigation-button{border-radius:999px;color:#fff;background:var(--theme-accent)}
.video-navigation-modal-overlay{position:fixed;z-index:5000;inset:0;background:rgba(4,10,18,.52);font-family:Inter,system-ui,sans-serif}
.video-navigation-modal{position:absolute;top:0;bottom:0;width:min(360px,88vw);display:flex;flex-direction:column;color:var(--theme-text);background:var(--theme-surface);box-shadow:var(--theme-shadow)}
.video-navigation-modal.left{left:0;border-right:1px solid var(--theme-line-strong)}
.video-navigation-modal.right{right:0;border-left:1px solid var(--theme-line-strong)}
.video-navigation-modal>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--theme-line);background:var(--theme-surface-2)}
.video-navigation-modal>header strong{font-size:15px}
.video-navigation-modal>header button{display:grid;width:30px;height:30px;box-sizing:border-box;place-items:center;padding:0;border:1px solid var(--theme-line);border-radius:5px;color:var(--theme-text);background:var(--theme-input);line-height:1;cursor:pointer}
.video-navigation-modal>header button svg{display:block;width:16px;height:16px}
.video-navigation-modal nav{min-height:0;flex:1;overflow:auto;padding:12px}
.video-navigation-modal ul{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.video-navigation-modal ul ul{margin:4px 0 5px 14px;padding-left:9px;border-left:1px solid var(--theme-line)}
.video-navigation-modal summary,.video-navigation-modal li>button{width:100%;box-sizing:border-box;padding:9px 10px;border:0;border-radius:5px;color:var(--theme-text);background:transparent;text-align:left;font-size:12px;cursor:pointer}
.video-navigation-modal summary:hover,.video-navigation-modal li>button:hover{color:var(--theme-accent);background:var(--theme-accent-soft)}
.video-navigation-modal summary::marker{color:var(--theme-accent)}
.video-navigation-modal details[open]>summary{color:var(--theme-accent);background:var(--theme-accent-soft)}
.video-navigation-modal li>button:disabled{color:var(--theme-muted);cursor:default;opacity:.65}
.video-navigation-modal-empty{padding:24px;color:var(--theme-muted);text-align:center}
.alarm-scrollbar-measure{position:fixed;left:-10000px;top:0;width:100px;height:100px;overflow:scroll;visibility:hidden;box-sizing:border-box;border:0;padding:0;pointer-events:none}
.video-service-control [data-column-align="left"]{text-align:left}
.video-service-control [data-column-align="center"]{text-align:center}
.video-service-control [data-column-align="right"]{text-align:right}
