/* topbar-open.css — topbar open/close with progress pushed in-flow under inner */
:root{
  --tb-pad: 6px;          /* current reduced topbar padding */
  --progress-h: 6px;      /* current reduced progress thickness */
}

.topbar{
  display: flex !important;
  flex-direction: column !important;   /* stack inner then progress */
  border-bottom: 0 !important;         /* separator moves to .topbar-inner */
}

.topbar-inner{
  padding-block: var(--tb-pad) !important;
  transition: padding 200ms ease;
  border-bottom: 1px solid var(--border, #e6e6e6) !important;
}
:root[data-theme="dark"] .topbar-inner{ border-bottom-color:#2a2a2a !important; }

/* Progress container becomes part of normal flow (sits right under inner) */
#progressWrap, .progress-wrap{
  position: static !important;
  height: var(--progress-h) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}
#progressBar{ height: 100% !important; background: transparent !important; }
#progressBar .progress-fill, .progress-fill{ height: 100% !important; }

/* When open, the inner area grows (progress naturally pushes down) */
.topbar.is-open .topbar-inner{
  padding-block: calc(var(--tb-pad) * 8) !important;
}