/* GITRIX Topbar Release – Command Bar v1 (enterprise) */
.gx-topbar.gx-topbar-release{
  position:relative;
  z-index:2000;
  /* Layout: flex (robust at different zoom/DPI). The search row remains supported
     but can be hidden without leaving a reserved gap. */
  display:flex;
  align-items:center;
  min-height:72px;
  gap:16px;
  padding:0 18px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  backdrop-filter:saturate(140%) blur(16px);
  -webkit-backdrop-filter:saturate(140%) blur(16px);
}
.gx-topbar.gx-topbar-release .gx-topbar-row1{ display:contents; }
.gx-topbar.gx-topbar-release .gx-topbar-left{
  display:flex;
  align-items:center;
  gap:12px;
  /* allow inner pills to shrink + ellipsis */
  min-width:0;
  flex:1 1 auto;
}
.gx-topbar.gx-topbar-release .gx-logo.small{
  width:52px;height:52px;
  border-radius:16px;
  font-size:20px;
}
.gx-topbar.gx-topbar-release #gx-topbar-row2{
  /* middle search area (kept for future use) */
  flex:0 1 620px;
  min-width:260px;
  max-width:620px;
  width:clamp(260px, 46vw, 620px);
  margin:0 8px;
  padding:0;
}
/* Temporarily hide search/command bar (no reserved space) */
body.gx-search-hidden .gx-topbar.gx-topbar-release #gx-topbar-row2{ display:none; }

.gx-topbar.gx-topbar-release .gx-topbar-right{
  display:flex;
  align-items:center;
  gap:10px;
  /* push right group to the edge */
  margin-left:auto;
  flex:0 0 auto;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.gx-topbar.gx-topbar-release .gx-topbar-right .pill{
  height:44px;
  display:inline-flex;
  align-items:center;
  padding:0 12px;
  border-radius:999px;
  font-size:13px;
  white-space:nowrap;
  max-width:260px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.gx-topbar.gx-topbar-release #gx-me-partner::before{ content:"Workspace: "; opacity:.65; margin-right:6px; }
.gx-topbar.gx-topbar-release #gx-me-partner::after{ content:" ▼"; opacity:.65; }
.gx-topbar.gx-topbar-release #gx-me-name{
  position:relative;
  padding-left:46px;
  max-width:240px;
}
.gx-topbar.gx-topbar-release #gx-me-name::before{
  content: attr(data-initials);
  position:absolute;
  left:8px;
  width:30px;height:30px;
  border-radius:999px;
  display:grid;
  place-items:center;
  font-weight:800;
  font-size:12px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.12);
}
.gx-topbar.gx-topbar-release .gx-topbar-right .btn,
.gx-topbar.gx-topbar-release .gx-topbar-right select.btn{
  height:44px;
  border-radius:14px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:transform .10s ease, filter .10s ease;
}
.gx-topbar.gx-topbar-release .gx-topbar-right .btn:active,
.gx-topbar.gx-topbar-release .gx-topbar-right select.btn:active{ transform:scale(.98); }
.gx-topbar.gx-topbar-release .gx-topbar-right .btn:hover,
.gx-topbar.gx-topbar-release .gx-topbar-right select.btn:hover{ filter:brightness(1.04); }
.gx-topbar-compact-toggle{ min-width:44px; }
.gx-topbar.gx-topbar-release #gx-theme{ min-width:200px; max-width:340px; flex:1 1 260px; }

.gx-topbar.gx-topbar-release .gx-cmdbar{ width:100%; }
.gx-topbar.gx-topbar-release .gx-cmdbar input{
  width:100%;
  height:44px;
  border-radius:16px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  padding:0 78px 0 14px;
  outline:none;
}
.gx-topbar.gx-topbar-release .gx-cmd-hint{
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  font-size:12px;
  opacity:.65;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.12);
}

/* State 1: focus */
body.gx-topbar-c1 .gx-topbar.gx-topbar-release{ min-height:56px; }

/* Focus (state 1): hide clutter ONLY in the visible topbar row (items in overflow remain available) */
body.gx-topbar-c1 .gx-topbar.gx-topbar-release .gx-topbar-right > #gx-theme{ display:none !important; }
body.gx-topbar-c1 .gx-topbar.gx-topbar-release .gx-topbar-right > #gx-reset-theme{ display:none !important; }
body.gx-topbar-c1 .gx-topbar.gx-topbar-release .gx-topbar-right > #gx-prefs-toggle{ display:none !important; }
/* NOTE: Zen toggle must never be hidden */

body.gx-topbar-c1 .gx-topbar.gx-topbar-release #gx-topbar-row2{ display:none; }
body.gx-topbar-c1 .gx-topbar.gx-topbar-release .gx-logo.small{ width:44px;height:44px;border-radius:14px;font-size:18px; }
body.gx-topbar-c1 .gx-topbar.gx-topbar-release .gx-subtitle{ display:none; }

/* State 0: zen (hidden) */
body.gx-topbar-c2 .gx-topbar.gx-topbar-release{ display:none; }

.gx-topbar-restore{
  position:fixed;
  top:10px;
  left:50%;
  transform:translateX(-50%);
  z-index:9999;
  display:none;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
  cursor:pointer;
  user-select:none;
}
.gx-topbar-restore kbd{
  font-size:12px;
  opacity:.7;
  border:1px solid rgba(255,255,255,.14);
  padding:2px 8px;
  border-radius:999px;
}
.gx-topbar-restore .gx-restore-label{
  max-width:0;
  overflow:hidden;
  white-space:nowrap;
  opacity:0;
  transition:max-width .18s ease, opacity .18s ease;
}
.gx-topbar-restore:hover .gx-restore-label{ max-width:260px; opacity:.92; }
.gx-topbar-restore .gx-restore-ico{
  width:26px;height:26px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
}
body.gx-topbar-c2 .gx-topbar-restore{ display:flex; }

@media (max-width: 1100px){
  .gx-topbar.gx-topbar-release #gx-theme{ min-width:200px; max-width:340px; flex:1 1 260px; }
}
@media (max-width: 980px){
  body:not(.gx-topbar-force-open) .gx-topbar.gx-topbar-release #gx-topbar-row2{ display:none; }
}

.gx-topbar.gx-topbar-release #gx-me-name:not([data-initials])::before{ content:"GX"; }

/* Notifications */
.gx-topbar.gx-topbar-release #gx-notify{ width:44px; padding:0; }

/* ===== Pinned Topbar (user option) ===== */
body.gx-topbar-pinned .gx-topbar.gx-topbar-release{
  position: sticky;
  top: 0;
  z-index: 1000;
}
body.gx-topbar-pinned .gx-layout{ padding-top: 0; }
/* Zen overrides pinned */
body.gx-topbar-c2.gx-topbar-pinned .gx-layout{
  padding-top: 0;
}

/* Pinned indicator */
body.gx-topbar-pinned .gx-topbar.gx-topbar-release{
  box-shadow: 0 10px 30px rgba(0,0,0,.20);
}
body.gx-topbar-pinned #gx-topbar-pin{
  border-color: rgba(255,255,255,.24);
  background: rgba(255,255,255,.10);
}
body.gx-topbar-pinned #gx-topbar-pin::after{
  content:"";
  width:6px;height:6px;
  border-radius:999px;
  display:inline-block;
  margin-left:8px;
  background: rgba(255,255,255,.55);
}

/* State 1 (compact): keep only essentials on the right */
body.gx-topbar-c1 .gx-topbar.gx-topbar-release #gx-topbar-row2{ display:none; }
body.gx-topbar-c1 .gx-topbar.gx-topbar-release #gx-logout.gx-logout-icon{ width:44px; min-width:44px; padding:0; border-radius:14px; }



/* ===== User chip (initials-only -> expands on hover/focus) ===== */
.gx-topbar.gx-topbar-release .gx-topbar-right #gx-me-wrap.gx-me-chip{
  height:44px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 12px 0 8px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.04);
  cursor:pointer;
  user-select:none;
  outline:none;
}
.gx-topbar.gx-topbar-release .gx-topbar-right #gx-me-wrap.gx-me-chip:focus-visible{
  box-shadow: 0 0 0 3px rgba(255,255,255,.18);
}

.gx-topbar.gx-topbar-release .gx-me-badge{
  width:34px;height:34px;
  border-radius:999px;
  display:grid;
  place-items:center;
  font-weight:850;
  font-size:12px;
  letter-spacing:.02em;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.12);
}

/* Collapsed by default: only initials visible */
.gx-topbar.gx-topbar-release .gx-me-lines{
  max-width:0;
  opacity:0;
  overflow:hidden;
  white-space:nowrap;
  transform: translateX(-6px);
  transition: max-width .22s ease, opacity .18s ease, transform .22s ease;
}

/* Expand on hover or keyboard focus */
.gx-topbar.gx-topbar-release #gx-me-wrap:hover .gx-me-lines,
.gx-topbar.gx-topbar-release #gx-me-wrap:focus .gx-me-lines,
.gx-topbar.gx-topbar-release #gx-me-wrap:focus-within .gx-me-lines{
  max-width:360px;
  opacity:1;
  transform: translateX(0);
}


/* Override legacy #gx-me-name sizing when used inside the combined chip */
.gx-topbar.gx-topbar-release #gx-me-wrap #gx-me-name{
  position:static;
  padding-left:0;
  max-width:none;
}

.gx-topbar.gx-topbar-release .gx-me-line1{
  font-size:13px;
  font-weight:700;
  line-height:1.1;
  max-width:320px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.gx-topbar.gx-topbar-release .gx-me-line2{
  font-size:12px;
  opacity:.78;
  line-height:1.1;
  display:flex;
  gap:8px;
  align-items:center;
}
.gx-topbar.gx-topbar-release .gx-me-dot{ opacity:.6; }

/* Reset legacy pill decorations for the old separate fields */
.gx-topbar.gx-topbar-release #gx-me-wrap #gx-me-partner::before,
.gx-topbar.gx-topbar-release #gx-me-wrap #gx-me-partner::after,
.gx-topbar.gx-topbar-release #gx-me-wrap #gx-me-name::before{
  content: "";
  display:none;
}

/* On narrow screens keep the user chip compact (no expand) */
@media (max-width: 820px){
  .gx-topbar.gx-topbar-release #gx-me-wrap .gx-me-lines{ display:none; }
  .gx-topbar.gx-topbar-release #gx-me-wrap{ padding-right:8px; }
}




/* ─────────────────────────────────────────────────────────
   Overflow dropdown (small windows): actions are moved here by gx_topbar_release.js
   ───────────────────────────────────────────────────────── */
.gx-overflow-wrap{ position:relative; display:inline-flex; align-items:center; }
.gx-overflow{ width:44px; height:44px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; }

.gx-overflow-dd{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width: 220px;
  padding: 8px;
  border-radius: 16px;
  background: rgba(18,20,26,.97);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
  opacity:0;
  transform: translateY(-6px) scale(.98);
  pointer-events:none;
  transition: opacity .16s ease, transform .16s ease;
  z-index: 2600;
}

.gx-overflow-wrap.is-open .gx-overflow-dd{
  opacity:1;
  transform: translateY(0) scale(1);
  pointer-events:auto;
}


/* --- Overflow: make Theme select fully usable (no hover/collapsed state) --- */
.gx-overflow-dd #gx-theme-wrap{
  cursor:default;
  overflow:visible; /* allow native select dropdown positioning */
  padding:0;
  gap:0;
}
.gx-overflow-dd #gx-theme-wrap .gx-tb-ico{ display:none; }
.gx-overflow-dd #gx-theme{
  max-width:100% !important;
  min-width:0 !important;
  width:100% !important;
  flex:1 1 auto !important;
  opacity:1 !important;
  transform:none !important;
  overflow:visible !important;
  pointer-events:auto !important;
}
/* Make moved controls fit a vertical menu */
.gx-overflow-dd .btn,
.gx-overflow-dd .gx-tb-item,
.gx-overflow-dd .gx-me-chip{
  width:100%;
  justify-content:flex-start;
  margin: 4px 0;
}

.gx-overflow-dd #gx-theme-wrap{
  padding: 6px 10px;
}

.gx-overflow-dd #gx-theme{
  width: 100%;
}

/* Keep user chip compact on small widths (text stays hidden) */
@media (max-width: 980px){
  .gx-topbar.gx-topbar-release .gx-brandtext{ display:none; }
  .gx-topbar.gx-topbar-release .gx-topbar-left{ gap:10px; }
  .gx-topbar.gx-topbar-release #gx-me-wrap .gx-me-lines{ max-width:0 !important; opacity:0 !important; transform: translateX(-6px) !important; }
}



/* Theme chip: collapsed (icon only) -> expands to reveal select */
#gx-theme-wrap{
  height:44px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 12px 0 10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  cursor:pointer;
  user-select:none;
  overflow:hidden;
}

#gx-theme-wrap .gx-tb-ico{
  width:22px;
  display:inline-flex;
  justify-content:center;
  opacity:.9;
}

/* collapsed */
#gx-theme-wrap #gx-theme{
  min-width:0 !important;
  max-width:0;
  opacity:0;
  transform: translateX(-6px);
  transition: max-width .22s ease, opacity .18s ease, transform .22s ease;
  overflow:hidden;
}

/* expand */
#gx-theme-wrap:hover #gx-theme,
#gx-theme-wrap:focus-within #gx-theme{
  max-width:340px;
  opacity:1;
  transform: translateX(0);
}

/* on small widths keep collapsed even on hover (to avoid overlap) */
@media (max-width: 980px){
  #gx-theme-wrap:hover #gx-theme{ max-width:0; opacity:0; transform: translateX(-6px); }
}


/* === PATCH: overflow dropdown stability + hamburger visibility (2026-01) === */

/* Show hamburger only on small screens */
#gx-hamburger{ display:none; width:44px; height:44px; padding:0; border-radius:14px; }
@media (max-width: 980px){
  #gx-hamburger{ display:inline-flex; align-items:center; justify-content:center; }
}

/* Overflow dropdown: enforce vertical menu layout + robust anchoring */
.gx-overflow-dd{
  display:flex;
  flex-direction:column;
  gap:10px;
  max-width: calc(100vw - 16px);
  transform-origin: top right;
}

/* Normalize spacing of moved items (prevents “giant gaps” / weird centering) */
.gx-overflow-dd > *{ margin:0 !important; }
.gx-overflow-dd .btn,
.gx-overflow-dd .pill,
.gx-overflow-dd .gx-tb-item,
.gx-overflow-dd .gx-me-chip,
.gx-overflow-dd select.btn{
  width:100% !important;
  height:44px;
  justify-content:flex-start;
  padding-left:14px;
}

/* If any moved item still has inline-flex centering, this keeps it consistent */
.gx-overflow-dd .btn{ gap:10px; }

/* Prevent the Themes chip from expanding inside overflow (even if moved by mistake) */
.gx-overflow-dd #gx-theme-wrap:hover #gx-theme,
.gx-overflow-dd #gx-theme-wrap:focus-within #gx-theme{
  max-width:0 !important;
  opacity:0 !important;
  transform: translateX(-6px) !important;
}


@media (max-width: 520px){
  .gx-topbar.gx-topbar-release .gx-topbar-right{ gap:8px; }
  .gx-topbar.gx-topbar-release .gx-topbar-right .btn,
  .gx-topbar.gx-topbar-release .gx-topbar-right select.btn{
    height:44px;
    min-width:44px;
    padding:0 12px;
  }
  /* Touch/micro: no label expansion */
  #gx-me-wrap .gx-me-text{ display:none !important; }
}
@media (max-width: 360px){
  /* Survival: keep only overflow + hamburger; everything else goes to overflow */
  .gx-topbar.gx-topbar-release .gx-topbar-right > :not(#gx-overflow-wrap){ display:none !important; }
  #gx-me-wrap{ display:none !important; }
}


/* Overflow dropdown: allow form controls to work */
#gx-overflow-dd select, #gx-overflow-dd input, #gx-overflow-dd textarea{ pointer-events:auto; }

/* === GITRIX G logo – FINAL SCALE FIX === */
/* logo samotné – bez zbytečné výšky */
.gx-topbar-left .gx-logo-gitrix-g{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  height:30px;
  padding-right:0px;
  line-height: 1;
}

.gx-topbar-left .gx-logo-gitrix-g img{
  height:3.75em !important;
  width:auto !important;
  display:auto !important;
  vertical-align: middle;
}


