/* Way Pulse — language switcher (EN / RU only, main map page) */
#wp-lang-switch {
  position: fixed;
  z-index: 900;
  display: none;
  gap: 4px;
  padding: 4px;
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}

/* FAB column stack (bottom → top): lang switcher, KPI fab, registry, geo, fuel */
:root {
  --wp-fab-size: 56px;
  --wp-fab-gap: 14px;
  --wp-lang-height: 44px;
  --wp-nav-gap: 8px;
  --wp-lang-gap: 10px;
}

/* Main map — bottom-right, just above bottom nav (blue KPI FAB stays above this) */
body.wp-page-main #wp-lang-switch {
  display: flex !important;
  right: 30px;
  left: auto;
  top: auto;
  bottom: calc(
    var(--wp-bottom-offset, 0px) + env(safe-area-inset-bottom, 0px) + var(--wp-nav-gap)
  );
  justify-content: center;
  min-width: 56px;
  visibility: visible;
  pointer-events: auto;
}

/* Never show language switcher on login or other pages */
body.login-page #wp-lang-switch,
body:not(.wp-page-main) #wp-lang-switch {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

@media (max-width: 767px) {
  body.wp-page-main #wp-lang-switch {
    right: 16px;
    left: auto;
    min-width: 48px;
  }

  /* Bottom nav must stay above lang switcher and receive taps on Account tab */
  body.wp-page-main #root .MuiBottomNavigation-root {
    z-index: 2200 !important;
    position: relative;
  }
}

#wp-lang-switch button {
  min-width: 44px;
  min-height: 36px;
  padding: 6px 12px;
  border: none;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  background: transparent;
  color: rgba(255, 255, 255, 0.65);
  font-family: 'Inter', 'Roboto', sans-serif;
  touch-action: manipulation;
}

#wp-lang-switch button.active {
  background: linear-gradient(135deg, #0ea5e9, #3b82f6);
  color: #fff;
}

#wp-lang-switch button:hover:not(.active) {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

/* Login — hide Traccar system language selector completely */
body.login-page #root .MuiFormControl-root:has(.MuiSelect-root),
body.login-page #root .MuiSelect-root,
body.login-page #root .MuiInputBase-root:has(.react-country-flag),
body.login-page #root .MuiFormControl-root:has(.react-country-flag),
body.login-page #root .MuiFormControl-root:has([class*="CountryFlag"]) {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

.wp-lang-listbox .wp-lang-hidden-option {
  display: none !important;
}

body.wp-page-main .MuiPopover-root [role="listbox"].wp-lang-listbox [role="option"]:not(.wp-lang-allowed) {
  display: none !important;
}

/* Traccar account menu above Way Pulse FABs */
body.wp-page-main .MuiPopover-root .MuiMenu-paper,
body.wp-page-main .MuiMenu-root .MuiPaper-root {
  z-index: 5000 !important;
}

/* Hide Way Pulse controls while account menu is open */
body.wp-account-menu-open #wp-lang-switch,
body.wp-account-menu-open .wp-fab,
body.wp-account-menu-open .wp-registry-fab,
body.wp-account-menu-open .wp-geo-fab,
body.wp-account-menu-open .wp-fuel-fab {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Bottom nav always receives taps (Account, Settings, etc.) */
body.wp-page-main #root .MuiBottomNavigation-root {
  pointer-events: auto !important;
}

body.wp-page-main #root .MuiBottomNavigationAction-root {
  pointer-events: auto !important;
}

/* Hide when vehicle detail panel is open */
body.wp-vehicle-panel-open #wp-lang-switch {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* FAB column — right side; blue KPI FAB above lang switcher */
body.wp-page-main .wp-fab {
  bottom: calc(
    var(--wp-bottom-offset, 0px) + env(safe-area-inset-bottom, 0px) + var(--wp-nav-gap) +
      var(--wp-lang-height) + var(--wp-lang-gap)
  ) !important;
  right: 30px !important;
  left: auto !important;
}

body.wp-page-main .wp-registry-fab {
  bottom: calc(
    var(--wp-bottom-offset, 0px) + env(safe-area-inset-bottom, 0px) + var(--wp-nav-gap) +
      var(--wp-lang-height) + var(--wp-lang-gap) + var(--wp-fab-size) + var(--wp-fab-gap)
  ) !important;
  right: 30px !important;
  left: auto !important;
}

body.wp-page-main .wp-geo-fab {
  bottom: calc(
    var(--wp-bottom-offset, 0px) + env(safe-area-inset-bottom, 0px) + var(--wp-nav-gap) +
      var(--wp-lang-height) + var(--wp-lang-gap) + var(--wp-fab-size) + var(--wp-fab-gap) +
      var(--wp-fab-size) + var(--wp-fab-gap)
  ) !important;
  right: 30px !important;
  left: auto !important;
}

body.wp-page-main .wp-fuel-fab {
  bottom: calc(
    var(--wp-bottom-offset, 0px) + env(safe-area-inset-bottom, 0px) + var(--wp-nav-gap) +
      var(--wp-lang-height) + var(--wp-lang-gap) + var(--wp-fab-size) + var(--wp-fab-gap) +
      var(--wp-fab-size) + var(--wp-fab-gap) + var(--wp-fab-size) + var(--wp-fab-gap)
  ) !important;
  right: 30px !important;
  left: auto !important;
}

@media (max-width: 768px) {
  body.wp-page-main .wp-fab,
  body.wp-page-main .wp-registry-fab,
  body.wp-page-main .wp-geo-fab,
  body.wp-page-main .wp-fuel-fab {
    right: 16px !important;
  }
}
