@import "../matugen/colors.css";

* {
    border: none;
    border-radius: 0;
    padding: 0;
    margin: 0;
    font-size: 13px;
    font-family: "JetBrainsMono Nerd Font", "NotoSans Nerd Font Mono";
    font-weight: bold;
}

tooltip {
    background: @background;
    color: @foreground;
    border: 1px solid @primary;
    border-radius: 10px;
}

tooltip label {
    color: @foreground;
    padding: 5px;
}

window#waybar {
    background: @background;
    color: @foreground;
    border-bottom: 2px solid @primary;
}

#custom-logo {
font-size: 20px;
margin: 0 15px;
color: @primary;
}

#workspaces button {
padding: 0 4px;
margin-right: 4px;
color: @foreground;
background: transparent;
}

#workspaces button:hover {
background: @surface_container_high;
color: @foreground;
border-bottom: 2px solid @primary;
}

#workspaces button.active {
background: @surface_container_high;
color: @primary;
border-bottom: 2px solid @primary;
}

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

#mode {
background-color: @secondary;
color: @background;
padding: 0 5px;
}

#network {
padding-right: 5px;
padding-left: 5px;
}

#clock, #language, #custom-notification, #backlight, #pulseaudio, #bluetooth, #tray {
margin: 0 5px;
color: @foreground;
}

#custom-notification {
margin-right: 15px;
margin-left: 5px;
color: @foreground;
}

#custom-audio_idle_inhibitor {
margin-left: 5px;
margin-right: 5px;
color: @foreground;
}

#idle_inhibitor {
margin-right: 5px;
margin-left: 7px;
color: @foreground;
font-size: 13px;
}

#idle_inhibitor.activated {
animation: blink-icon 2s infinite alternate;
color: @primary;
}

@keyframes blink-icon {
    from { color: @primary; }
    to   { color: transparent; }
}

#battery {
margin-top: 0;
margin-bottom: 0;
margin-left: 5px;
margin-right: 12px;
color: @foreground;
}

#battery.charging, #battery.plugged {
margin: 0 5px;
color: @foreground;
}

#battery.ok:not(.charging) {
animation: blink-icon 3s infinite alternate;
}

@keyframes blink-icon-yellow {
    from { color: yellow; }
    to   { color: transparent; }
}

#battery.warning:not(.charging) {
animation: blink-icon-yellow 1.5s infinite alternate;
}

@keyframes blink-icon-orange {
    from { color: orange; }
    to   { color: transparent; }
}

#battery.low:not(.charging) {
color: orange;
animation: blink-icon-orange 0.8s infinite alternate;
}

@keyframes blink-icon-red {
    from { color: red; }
    to   { color: transparent; }
}

#battery.critical:not(.charging) {
animation: blink-icon-red 0.3s infinite alternate;
}