@define-color black #1c1f26;
@define-color gray #2b303b;
@define-color white #d8dee9;
@define-color red   #bf616a;
@define-color blue  #8fa1be;

* {
    border: none;
    border-radius: 0;
    font-family: "Nunito SemiBold", "Font Awesome 6 Free Solid", "Font Awesome 6 Free Brand", "Font Awesome 6 Free";
    font-size: 14px;
    transition: none;
    box-shadow: none;
}

/* Customize tooltips and tray menus */
tooltip, menu {
    padding: 0px;
    border: 2px solid @red;
    border-radius: 10px;
    background-color: @black;
}
menuitem {
    margin: 5px;
    padding: 0px;
}
menuitem:hover {
    color: @white;
    background-color: @gray;
    /*margin: 2px 2px;*/
    border-radius: 5px;
}

.main {
    background: @black;
    opacity: 0.8;
    color: @white;
}

.tray {
    background: none;
}

/* Apply to all widgets */
.modules-right widget > label, .modules-right widget > box {
    padding: 0 10px;
}

.tray .modules-right {
	background: @black;
    margin: 10px;
	margin-top: 0px;
    padding: 5px;
	border-radius: 5px;
	color: @white;
    opacity: 0.8;
}

/*#tray {*/
    /*margin: 5px;*/
    /*padding: 5px;*/
    /*[>margin-right: 90px;<]*/
    /*border-radius: 5px;*/
    /*background-color: @black;*/
/*}*/

.modules-right button {
    padding: 0 10px;
    color: @white;
}
.modules-right button:hover {
    background:none;
}

#workspaces button {
    background: transparent;
    color: @white;
    padding: 0px 5px;
    text-shadow: none;
}

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

#workspaces button.focused {
    background-color: @white;
    color: @black;
}

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

#mode {
    background: @red;
    padding: 0px 10px;
}