/* 
__        __          _                 
\ \      / /_ _ _   _| |__   __ _ _ __  
\ \ /\ / / _` | | | | '_ \ / _` | '__| 
\ V  V / (_| | |_| | |_) | (_| | |    
\_/\_/ \__,_|\__, |_.__/ \__,_|_|    
            |___/                   

by Aleslul
----------------------------------------
*/


* {
	border: none;
	border-radius: 10px;
    font-family: "JetbrainsMono Nerd Font";
	font-size: 15px;
	min-height: 10px;
}

window {}

window#waybar {
	background-color: #1A1B26;
	border-radius: 15px;
	margin-top: 6px;
}

window#waybar.hidden {
	opacity: 0.2;
	background-color: #1A1B26;
}

#window {
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 10px;
	transition: none;
    color: transparent;
	background: transparent;
	background-color: #1A1B26;
}

#workspaces {
	margin: 6px;  
	border-radius: 1000px;
	background: #222330;
	transition: none;
	padding: 5px 6px;
}

#workspaces button {
	border-radius: 1000px;
	text-shadow: none;
	box-shadow: none;
	animation: ws_normal 20s ease-in-out 1;
	color: #B5E8E6;
	background: transparent;
	margin: 3px;
	border: none;
	padding: 0px;
	padding-left: 3px;
	padding-right: 3px;
}


#workspaces button.urgent {
    background: rgba(255, 200, 0, 0.35);
    border-bottom: 0px dashed #F7768E;
    color: #e0af68;
}

#workspaces button.persistent {
	border-radius: 1000px;
	background-color: #7aa2f7;
	color: #7aa2f7;
	font-size: 4px;
}

#workspaces button.empty {
	border-radius: 1000px;
	background-color: #583794;
	padding-top: 0px;
	padding-bottom: 0px;
}

#workspaces button.active {
	border-radius: 1000px;
    color: #e0af68;
    background-color: #e0af68;
	padding-top: 0px;
	padding-top: 0px;
	padding-left: 12px;
	padding-right: 12px;
	margin-left: 3px;
	margin-right: 3px;
    font-size: 2px;
	animation: ws_active 20s ease-in-out 1;
    transition: all 0.4s cubic-bezier(.55,-0.68,.48,1.682);
}

#workspaces button:hover {
	animation: ws_hover 20s ease-in-out 1;
    transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}

@keyframes scaleUp {
    0% {
        font-size: 10px;
    }
    100% {
        font-size: 16px; 
    }
}


/* 
	NOTE: NETWORK AND BLUETOOTH ARE TWO DIFERENTS MODULES BUT THEY'RE 
	CONFIGURATED IN SUCH A WAY TATH THEY LOOK LIKE A SINGLE MODULE
*/

#network {
	margin-top: 6px;
	margin-left: 0px;
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 6px;
	border-radius: 0px 18px 18px 0px;
	font-size: 14px;
	font-weight:bold;
	transition: none;
	color: #e0af68;
	background: #222330;
}

#bluetooth {
	margin-top: 6px;
	margin-left: 8px;
	padding-left: 15px;
	padding-right: 0px;
	padding-bottom: 2px;
	margin-bottom: 6px;
	border-radius: 18px 0px 0px 18px;
	font-size: 14px;
	font-weight: 700;
	transition: none;
	color: #7aa2f7;
	background: #222330;
}

#tray {
	margin-top: 6px;
	margin-left: 8px;
	padding-left: 10px;
	margin-bottom: 6px;
	padding-right: 10px;
	border-radius: 18px;
	font-size: 14px;
	font-weight: bold;
	transition: none;
	color: #B5E8E0;
	background: #222330;
}

#pulseaudio {
	margin-top: 6px;
	margin-left: 8px;
	padding-left: 15px;
	margin-bottom: 6px;
	border-radius: 18px 0px 0px 18px;
	font-size: 14px;
	font-weight: bold;
	transition: none;
	color: #F1F1F1;
	background: #222330;
}

#battery {
	margin-top: 6px;
	margin-left: 0px;
	padding-left: 10px;
	padding-right: 15px;
	margin-bottom: 6px;
	border-radius: 0px 18px 18px 0px;
	transition: none;
	font-size: 14px;
	font-weight: bold;
	color: #161320;
	background: #222330;
}

#battery.charging, #battery.plugged {
	color: #161320;
	background-color: transparent;
	background: #222330;
}

#battery.critical:not(.charging) {
    background-color: #B5E8E0;
	background: #222330;
    color: #161320;
    animation-name: blink;
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

@keyframes blink {
    to {
        color: #FFFFFF;
    }
}

#backlight {
	margin-top: 6px;
	margin-left: 0px;
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 6px;
	border-radius: 0px;
	font-size: 14px;
	font-weight: bold;
	transition: none;
	color: #F1F1F1;
	background: #222330;
}

#clock {
	margin-top: 6px;
	margin-left: 8px;
	padding-left: 10px;
	padding-right: 10px;
	margin-right: 0px;
	margin-bottom: 6px;
	border-radius: 18px;
	transition: none;
	font-size: 14px;
	font-weight: bold;
	color: #F1F1F1;
	background: #222330;
}

#disk {	
        margin-top: 6px;
	margin-left: 8px;
	padding-left: 10px;
	margin-bottom: 6px;
	padding-right: 10px;
	border-radius: 18px;
        font-size: 14px;
        font-weight: bold;
	transition: none;
	color: #F1F1F1;
	background: #222330;
}

#window {
	margin-top: 6px;
	margin-left: 8px;
	padding-left: 12px;
	margin-bottom: 6px;
	padding-right: 12px;
	border-radius: 18px;
	font-size: 14px;
	font-weight: bold;
	transition: none;
	color: #e0af68;
	background: #222330;
}

#window.no-window{
	background: transparent;
}

#cpu {
	margin-top: 6px;
	margin-left: 8px;
	padding-left: 10px;
	margin-bottom: 6px;
	padding-right: 10px;
	border-radius: 18px;
	font-size: 14px;
	font-weight: bold;
	transition: none;
	color: #F1F1F1;
	background: #222330;
}

#custom-launcher {
	margin-top: 6px;
	margin-left: 8px;
	margin-bottom: 6px;
	margin-right: 0px;
	padding-left: 8px;
	padding-right: 0px;
	border-radius: 18px 0px 0px 18px;
	font-size: 14px;
	font-weight: bold;
	transition: none;
	color: #F7768e;
	background: #222330;
}

#memory {
	margin: 6px 0px 6px 0px;
	padding-left: 0px;
	padding-right: 10px;
	border-radius: 0px 18px 18px 0px;
	font-size: 14px;
	font-weight: bold;
	transition: none;
	color: #F1F1F1;
	background: #222330;
}

#tray {
	margin-top: 6px;
	margin-left: 8px;
	padding-left: 10px;
	margin-bottom: 0px;
	padding-right: 10px;
	border-radius: 10px;
	transition: none;
	color: #B5E8E0;
	background: #161320;
}

#hyprland-language {
	font-size: 14px;
	margin-left: 8px;
	padding-left: 10px;
	padding-right: 5px;
	border-radius: 10px;
	transition: none;
	color: #e0af68;
	background: transparent;
}

#language {
	margin-top: 6px;
	margin-left: 8px;
	margin-bottom: 6px;
	padding-left: 10px;
	padding-right: 0px;
	border-radius: 18px 0px 0px 18px;
	font-size: 14px;
	font-weight: bold;
	transition: none;
	color: #e0af68;
	background: #222330;
}

#custom-swaync{
	margin-top: 6px;
	margin-left: 0px;
	margin-right: 15px;
	margin-bottom: 6px;
	padding-left: 0px;
	padding-right: 10px;
	border-radius: 0px 18px 18px 0px;
	font-size: 16px;
	font-weight: 700;
	transition: none;
	color: #F7768e;
	background: #222330;
}

#custom-power {
	margin-top: 6px;
	margin-left: 15px;
	margin-bottom: 6px;
	margin-right: 0px;
	padding: 0px 10px;
	border-radius: 18px;
	font-size: 25px;
	font-weight: bold;
	transition: none;
	color: #E0AF68;
	background: transparent;
}

#custom-power:hover {
	color: #F7768e;
}

#custom-updates {
	margin-top: 6px;
	margin-left: 8px;
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 0px;
	border-radius: 10px;
	transition: none;
	color: #161320;
	background: #E8A2AF;
}

tooltip {
	background-color: #222330;
	border-radius: 10px;
}

tooltip label {
	font-weight: bold;
	color: #F1F1F1;
}