/* Guacamolyn header branch selector */
.branch-picker{
  position:relative;
  min-height:48px;
  padding:0 13px 0 14px;
  gap:10px;
  overflow:visible;
}

.branch-picker-label{
  flex:0 0 auto;
  color:rgba(255,255,255,.64);
  font-size:12px;
  font-weight:700;
  letter-spacing:.055em;
  line-height:1;
  text-transform:uppercase;
}

.branch-picker-trigger{
  display:none;
  min-width:176px;
  max-width:260px;
  min-height:46px;
  padding:0;
  border:0;
  background:transparent;
  color:#fff;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  text-align:left;
  cursor:pointer;
}

.branch-picker.is-enhanced .branch-picker-trigger{
  display:flex;
}

.branch-picker-value{
  min-width:0;
  overflow:hidden;
  font-size:14px;
  font-weight:650;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.branch-picker-chevron{
  width:18px;
  height:18px;
  flex:0 0 18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .18s ease;
}

.branch-picker[data-open="true"] .branch-picker-chevron{
  transform:rotate(180deg);
}

.branch-picker.is-enhanced .branch-native-select{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  opacity:0!important;
  pointer-events:none!important;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
}

.branch-picker-menu{
  position:absolute;
  top:calc(100% + 9px);
  left:0;
  z-index:80;
  width:max-content;
  min-width:100%;
  max-width:320px;
  padding:7px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:14px;
  background:#123322;
  box-shadow:0 18px 42px rgba(5,23,14,.28);
  transform-origin:top center;
}

.branch-picker-menu[hidden]{
  display:none!important;
}

.branch-picker[data-open="true"] .branch-picker-menu{
  animation:branch-picker-in .14s ease-out;
}

.branch-picker-option{
  width:100%;
  min-width:230px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:11px 12px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:rgba(255,255,255,.82);
  font-size:14px;
  font-weight:500;
  line-height:1.3;
  text-align:left;
  cursor:pointer;
  transition:background .14s ease,color .14s ease;
}

.branch-picker-option:hover,
.branch-picker-option:focus-visible{
  outline:none;
  background:rgba(255,255,255,.08);
  color:#fff;
}

.branch-picker-option[aria-selected="true"]{
  background:rgba(255,255,255,.12);
  color:#fff;
  font-weight:650;
}

.branch-picker-check{
  width:17px;
  height:17px;
  flex:0 0 17px;
  fill:none;
  stroke:#cce9d5;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:0;
}

.branch-picker-option[aria-selected="true"] .branch-picker-check{
  opacity:1;
}

@keyframes branch-picker-in{
  from{opacity:0;transform:translateY(-4px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media(max-width:720px){
  .branch-picker{
    width:100%;
  }

  .branch-picker-trigger{
    flex:1;
    min-width:0;
    max-width:none;
  }

  .branch-picker-menu{
    right:0;
    left:0;
    width:auto;
    max-width:none;
  }

  .branch-picker-option{
    min-width:0;
  }
}

@media(prefers-reduced-motion:reduce){
  .branch-picker-chevron{
    transition:none;
  }

  .branch-picker[data-open="true"] .branch-picker-menu{
    animation:none;
  }
}