/* Green Pi Interactive City V6.4
 * Transparent top bar shell + language selector styled to match menu buttons.
 */

/* Make the main menu shell transparent. Keep only pills/buttons visible. */
.gp-topbar-main-shell{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding:10px 6px !important;
}
.gp-topbar-locations-shell{
  background:rgba(8,29,40,.42) !important;
  border-color:rgba(255,255,255,.10) !important;
  box-shadow:0 14px 36px rgba(0,20,33,.20) !important;
  backdrop-filter:blur(14px) saturate(1.05) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.05) !important;
}

/* Buttons/chips keep the visual language. */
.gp-topbar-nav .gp-group-tab,
.gp-topbar-quote,
.gp-topbar-location-chip,
.gp-topbar-dropdown-close{
  box-shadow:none !important;
}

/* Brand side spacing when shell no longer exists */
.gp-topbar-brand{
  padding-left:4px !important;
}
.gp-topbar-nav{gap:10px !important}
.gp-topbar-actions{gap:12px !important}

/* Language selector should visually match the menu pills instead of the white native box. */
.gp-topbar-language{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:44px !important;
  max-width:none !important;
}
.gp-topbar-language .gp-language-mounted,
.gp-topbar-language #gtranslate_wrapper,
.gp-topbar-language .gtranslate_wrapper,
.gp-topbar-language .gt_float_switcher,
.gp-topbar-language .gt_switcher_wrapper,
.gp-topbar-language .switcher{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  background:transparent !important;
}
.gp-topbar-language select,
.gp-topbar-language select.gt_selector,
.gp-topbar-language .switcher .selected a,
.gp-topbar-language .gt_float_switcher .gt-selected{
  min-width:152px !important;
  height:44px !important;
  padding:0 40px 0 14px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:13px !important;
  background-color:rgba(255,255,255,.05) !important;
  color:rgba(255,255,255,.82) !important;
  font-size:14px !important;
  font-weight:750 !important;
  line-height:42px !important;
  box-shadow:none !important;
}
.gp-topbar-language select,
.gp-topbar-language select.gt_selector{
  -webkit-appearance:none !important;
  appearance:none !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.8)' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 14px center !important;
  background-size:14px 14px !important;
}
.gp-topbar-language .switcher .selected a,
.gp-topbar-language .gt_float_switcher .gt-selected{
  display:flex !important;
  align-items:center !important;
  line-height:1 !important;
}
.gp-topbar-language .switcher .selected a:hover,
.gp-topbar-language .switcher .selected a:focus,
.gp-topbar-language .gt_float_switcher .gt-selected:hover,
.gp-topbar-language select:hover,
.gp-topbar-language select:focus,
.gp-topbar-nav .gp-group-tab:hover,
.gp-topbar-nav .gp-group-tab.is-active{
  border-color:rgba(53,211,154,.55) !important;
  background:linear-gradient(90deg,rgba(53,211,154,.16),rgba(8,117,201,.10)) !important;
  color:#fff !important;
}
.gp-topbar-language .switcher .selected a:after,
.gp-topbar-language .gt_float_switcher .gt-selected:after{
  content:'▾';
  margin-left:auto;
  color:rgba(255,255,255,.8);
  font-size:12px;
  line-height:1;
}
.gp-topbar-language .switcher .option{
  margin-top:8px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:14px !important;
  background:rgba(8,29,40,.94) !important;
  box-shadow:0 14px 36px rgba(0,20,33,.28) !important;
  overflow:hidden !important;
}
.gp-topbar-language .switcher .option a,
.gp-topbar-language .gt_float_switcher a{
  color:#fff !important;
}
.gp-topbar-language img{max-height:16px !important;width:auto !important}

@media (max-width:900px){
  .gp-topbar-language select,
  .gp-topbar-language select.gt_selector,
  .gp-topbar-language .switcher .selected a,
  .gp-topbar-language .gt_float_switcher .gt-selected{
    min-width:132px !important;
    height:38px !important;
    padding:0 34px 0 12px !important;
    font-size:12px !important;
    border-radius:12px !important;
  }
}
