/**
 * SITE-SCOPED topbar skin — colours, backgrounds, borders, radii.
 * Packs may fork this file only; never fork topbar-construct.css.
 * Loaded after chrome (admin.css / user.css) so skin wins without !important wall.
 */

.mve-topbar__list a {
    border-radius: 9px !important;
    color: rgba(255,255,255,.5) !important;
transition: all .6s ease;
    background: rgb(0 0 0 / 58%);
    border-left: 20px dashed rgba(0,0,0,0)  !important;
padding-left:0px  !important;
margin-bottom: 2px  !important;
}

.mve-topbar__list a:hover {
transition: all .3s ease;
    color:  rgb(0 255 203) !important;
    border-left: 1px dotted rgb(0 255 203) !important;
    padding-left: 19px !important;
    background: rgb(255 255 255 / 88%) ;
}


.mve-topbar__panel {
background: linear-gradient(to bottom, rgba(84, 45, 0, 0) 0%, rgba(153, 81, 0, 0.5) 15%, rgba(162, 86, 0, 0.57) 10%, rgba(146, 76, 0, 1) 20%, rgba(122, 61, 0, 1) 30%, rgba(104, 54, 0, 1) 40%, rgba(116, 52, 0, 1) 50%, rgba(130, 50, 0, 1) 70%, rgba(104, 47, 0, 1) 84%, rgba(74, 43, 0, 1) 100%);
border: 10x solid rgba(0,0,0,0) !important;
border-radius: 0px 0px 0px 20px !important;
padding-right: 0px  !important;
padding-top: 15px  !important;=
}

:root {
  --tb-topbar-bg: linear-gradient(
    to bottom,
    rgba(105, 128, 133, 0.95) 0%,
    rgba(72, 78, 76, 0.88) 50%,
    rgba(7, 9, 7, 0.88) 51%,
    rgba(7, 5, 6, 0.8) 100%
  );
  --tb-topbar-border: #2a3040;
  --tb-topbar-user-fg: #dbe3ff;
  --tb-topbar-muted: #9da3b1;
  --tb-topbar-plan-fg: #9eb0d4;
  --tb-topbar-plan-border: rgba(255, 255, 255, 0.18);
  --tb-topbar-plan-bg: rgba(255, 255, 255, 0.06);
  --tb-topbar-plan-border-hover: rgba(255, 255, 255, 0.35);
  --tb-topbar-plan-bg-hover: rgba(255, 255, 255, 0.12);
  --tb-topbar-pill-radius: 999px;
  --tb-topbar-ctrl-radius: 8px;
  --tb-topbar-hud-bg: rgba(255, 255, 255, 0.08);
  --tb-topbar-hud-fg: rgba(255, 255, 255, 0.92);
  --tb-topbar-hud-radius: 4px;
  --tb-topbar-btn-bg: #1a1e2a;
  --tb-topbar-btn-fg: #dbe3ff;
  --tb-topbar-btn-border: #33384a;
  --tb-topbar-btn-bg-hover: #26354f;
  --tb-topbar-btn-border-hover: #5d8ced;
  --tb-topbar-btn-fg-hover: #fff;
  --tb-topbar-health-bg: #161922;
  --tb-topbar-health-border: #2a3040;
  --tb-topbar-health-ok-border: #166534;
  --tb-topbar-health-ok-bg: #14532d;
  --tb-topbar-health-ok-fg: #86efac;
  --tb-topbar-health-bad-border: #991b1b;
  --tb-topbar-health-bad-bg: #450a0a;
  --tb-topbar-health-bad-fg: #fca5a5;
  --tb-topbar-lib-fg: #9fb0c8;
  --tb-topbar-lib-bad-fg: #fca5a5;
  --tb-site-topbar-bg: rgba(15, 16, 21, 0.82);
  --tb-site-topbar-link: var(--tb-accent, #5d8ced);
}

/* Lab/admin chrome only — public .tb-site-topbar.admin-topbar uses --tb-site-topbar-* below. */
.admin-topbar:not(.tb-site-topbar) {
  border-bottom: 1px solid var(--tb-topbar-border);
  background: var(--tb-topbar-bg);
}

.admin-user-name {
  color: var(--tb-topbar-user-fg);
}

.admin-user-plan-pill {
  border: 1px solid var(--tb-topbar-plan-border);
  border-radius: var(--tb-topbar-pill-radius);
  background: var(--tb-topbar-plan-bg);
  color: var(--tb-topbar-plan-fg);
}

.admin-user-plan-pill:hover {
  border-color: var(--tb-topbar-plan-border-hover);
  background: var(--tb-topbar-plan-bg-hover);
  color: var(--tb-topbar-user-fg);
}

.admin-topbar-tool-slot .scene-component-count-hud {
  border-radius: var(--tb-topbar-hud-radius);
  background: var(--tb-topbar-hud-bg);
  color: var(--tb-topbar-hud-fg);
}

.admin-topbar-tool-slot .al-transport-perf-pill {
  border-radius: var(--tb-topbar-hud-radius);
}

.admin-clock {
  color: var(--tb-topbar-muted);
}

.health-icon {
  border-radius: 6px;
  border: 1px solid var(--tb-topbar-health-border);
  background: var(--tb-topbar-health-bg);
}

.health-icon.ok {
  border-color: var(--tb-topbar-health-ok-border);
  background: var(--tb-topbar-health-ok-bg);
  color: var(--tb-topbar-health-ok-fg);
}

.health-icon.bad {
  border-color: var(--tb-topbar-health-bad-border);
  background: var(--tb-topbar-health-bad-bg);
  color: var(--tb-topbar-health-bad-fg);
}

.admin-lib-versions {
  color: var(--tb-topbar-lib-fg);
}

.admin-lib-versions.admin-lib-versions--bad {
  color: var(--tb-topbar-lib-bad-fg);
}

.admin-ffmpeg-loading {
  color: var(--tb-topbar-lib-fg);
}

.admin-ffmpeg-readout {
  color: var(--tb-topbar-lib-fg);
}

.btn-icon {
  border-radius: var(--tb-topbar-ctrl-radius);
  background: var(--tb-topbar-btn-bg);
  color: var(--tb-topbar-btn-fg);
  border: 1px solid var(--tb-topbar-btn-border);
}

.btn-icon:hover {
  background: var(--tb-topbar-btn-bg-hover);
  border-color: var(--tb-topbar-btn-border-hover);
  color: var(--tb-topbar-btn-fg-hover);
}

.tb-site-topbar {
  background: var(--tb-site-topbar-bg);
  border-bottom: 1px solid var(--tb-rule, var(--tb-topbar-border));
}

.tb-site-topbar__nav--menu a,
.tb-site-topbar__nav--menu span,
.tb-site-topbar__nav-link {
  color: var(--tb-site-topbar-link);
}

.al-top-bar-radius,
.wl-top-bar-radius,
.vl-top-bar-radius,
.ll-top-bar-radius,
.ml-top-bar-radius ,
.al-transport-radius,
.wl-transport-radius,
.vl-transport-radius,
.ll-transport-radius {
  border-radius: 2px !important;
}


