/* Neon Glass Waybar — Segmented floating pills with glassmorphism */

* {
  font-family: "Inter", "Symbols Nerd Font", sans-serif;
  font-size: 13px;
  font-weight: 500;
  border: none;
  border-radius: 0;
  min-height: 0;
}

window#waybar {
  /* The main bar background is transparent so the wallpaper shows through */
  background: transparent;
  color: @text;
}

/* 
 * The pill containers: left, center, right.
 * Glassmorphism: semi-transparent base + blur (blur requires hyprland layerrule if waybar doesn't natively blur, but alpha base helps).
 */
.modules-left,
.modules-center,
.modules-right {
  background: alpha(@base, 0.45);
  border: 1px solid alpha(@accent, 0.2);
  border-radius: 20px;
  margin: 4px 6px;
  padding: 2px 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

/* Add a glowing top border effect on hover or generally to accent the glass */
.modules-left {
  border-top: 1px solid alpha(@accent, 0.6);
}
.modules-center {
  border-top: 1px solid alpha(@text, 0.3);
}
.modules-right {
  border-top: 1px solid alpha(@accentAlt, 0.6);
}

/* Remove default padding from individual modules so they fit snug in the pill */
#workspaces button,
#window,
#clock,
#tray,
#pulseaudio,
#battery,
#custom-notification,
#custom-vpn,
#custom-powerprofile,
#custom-updates,
#custom-doctor {
  padding: 0 8px;
  margin: 0 2px;
}

/* Workspaces */
#workspaces button {
  color: @subtext;
  border-radius: 12px;
  transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}

#workspaces button:hover {
  background: alpha(@surface, 0.5);
  color: @text;
}

#workspaces button.active {
  color: @accent;
  background: alpha(@accent, 0.15);
  box-shadow: 0 0 8px alpha(@accent, 0.4);
}

#workspaces button.urgent {
  color: @bad;
  background: alpha(@bad, 0.15);
}

/* Indicators */
#battery.charging { color: @good; }
#battery.warning:not(.charging) { color: @warn; }
#battery.critical:not(.charging) {
  color: @bad;
  animation: blink 1s steps(2, start) infinite;
}

#pulseaudio.muted { color: @muted; }

#custom-updates { color: @accentAlt; }
#custom-doctor { color: @bad; }
#custom-vpn { color: @accent; }

@keyframes blink {
  to { color: @text; }
}

tooltip {
  background: alpha(@base, 0.85);
  border: 1px solid alpha(@accent, 0.4);
  border-radius: 12px;
}
tooltip label {
  color: @text;
}