/* @import "frappe.css"; */
@import "macchiato.css";

/**
* Custom styling for a catppuccin style waybar
* Config settings listed in order from left -> right on bar
* */

/**
* Global configuration for theme 
* */
* {
  font-family: Liga SFMono Nerd Font;
  font-size: 25px;
  border-radius: 1.00em;
}

/* Primary monitor configuration */
#notifications,
#workspaces {
  margin: 0.5em;
  padding-left: 5px;
  padding-right: 5px;
  color: @peach;
  font-weight: bold;
  background-color: @surface0;
  border: 2px solid @surface1;
}

/* Wlr/workspaces configuration  */
#window,
#workspaces {
  color: @peach;
}

#workspaces label {
  font-size: 35px;
}

#workspaces button {
  padding: 0 0.5em;
  background-color: @surface0;
  color: @text;
  margin: 0.25em;
}

#workspaces button.active {
  color: @blue;
}

#workspaces button.urgent {
  background-color: @red;
  color: @text;
}

/* window */
window#waybar {
  border: 2px solid @surface1;
  background: @base;
  color: @text;
  transition-property: background-color;
  transition-duration: 0.5s;
  opacity: 0.9;
}

window#waybar.hidden {
  opacity: 0.2;
}

tooltip {
  background: @base;
  border: 1px solid @blue;
}

tooltip label {
  color: white;
}

label:focus {
  background-color: #000000;
}

button {
  /* Use box-shadow instead of border so the text isn't offset */
  box-shadow: inset 0 -3px transparent;
  /* Avoid rounded borders under each button name */
  border: none;
  border-radius: 0;
}

/* Remove border from parent waybar */
box {
  border: none;
}


#custom-notificaton,
#custom-updates,
#custom-github,
#cpu,
#temperature,
#custom-gpu-temperature,
#memory,
#disk,
#bluetooth,
#pulseaudio,
#network {
  padding: 0 0.5em;
}

/* Unique colors for modules */
#cpu {
  color: @red;
}

#memory {
  color: @yellow;
}

#custom-gpu-temperature,
#temperature {
  color: @blue;
}

#network {
  color: @yellow;
}

#pulseaudio {
  color: #cad3f5;
}

#custom-github {
  color: @blue;
}

#custom-updates {
  color: @red;
}

#pulseaudio.muted {
  background-color: #90b1b1;
  color: #2a5c45;
}

#temperature.critical {
  background-color: #eb4d4b;
}

#clock {
  font-size: 20px;
  font-weight: 900;
}

/* Custom styling for the logout icon on end */
#custom-wlogout {
  font-size: 1.00em;
  padding-right: 0.5em;
  padding-left: 0.5em;
  color: @blue;
}

#custom-separator-right,
#custom-separator-left {
  font-size: 30px;
  padding-left: 1em;
  padding-right: 1em;
  color: @text;
}

@keyframes blink {
  to {
    background-color: #ffffff;
    color: #000000;
  }
}
