/* vim:fileencoding=utf-8:foldmethod=marker
*/

/*  SOCIO-CYBEREENG — THE OPERATING SYSTEM
    Waybar style: WHITE PANEL
    LinaraOS [2026]
*/

/* Define colors */
/* {{{ */
@define-color background1 rgba(240, 240, 250, 1);
@define-color background2 rgba(21, 21, 32, 1);
@define-color backgroundw rgba(250, 250, 250, 1);
@define-color background  #151520;

/* FIX: was undefined -> modules silently lost background */
@define-color module_bg rgba(250, 250, 250, 1);

@define-color sepepator #ffffff;
@define-color warning #f38ba8;
@define-color caution #45475a;
@define-color performance #000000;
@define-color audio #000000;
@define-color misc #000000;
@define-color date #000000;
@define-color work #000000;
@define-color window #000000;
@define-color resize #eba0ac;
@define-color process #000000;
@define-color text #000000;
/* }}} */

/* Reset all styles */
/* {{{ */
* {
  border: none;
  border-radius: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  box-shadow: none;
  text-shadow: none;
}

/* }}} */

/* Main bar keyframes */
/* {{{ */

@keyframes blink-urgent-workspace {
  to {
    color: @warning;
  }
}

@keyframes blink-critical-text {
  to {
    color: @sepepator;
  }
}

@keyframes blink-modifier-text {
  to {
    color: @sepepator;
  }
}

@keyframes blink-special-workspace {
  to {
    color: @window;
  }
}

/* }}} */

/* Main bar defaults */
/* {{{ */
window#waybar {
  background: transparent;
  border: none;
  box-shadow: none;
}

#waybar.main {
  background: @backgroundw;
  font-family: "Home Video";
  font-size: 12px;
  color: @text;
}

#waybar.main button {
  font-family: HomeVideo;
  font-size: 12px;
  color: @text;
}

/* }}} */

/* Main bar modules */
/* {{{ */
#waybar.main #custom-battery,
#waybar.main #keyboard-state,
#waybar.main #network,
#waybar.main #battery,
#waybar.main #backlight,
#waybar.main #clock,
#waybar.main #cpu,
#waybar.main #language,
#waybar.main #memory.swap,
#waybar.main #memory.ram,
#waybar.main #submap,
#waybar.main #pulseaudio,
#waybar.main #temperature,
#waybar.main #tray,
#waybar.main #window,
#waybar.main #disk {
  padding-left: 8pt;
  padding-right: 8pt;
  margin: 2px 0;
  background: @module_bg;
}

#waybar.main #custom-battery,
#waybar.main #keyboard-state,
#waybar.main #network,
#waybar.main #battery,
#waybar.main #backlight,
#waybar.main #clock,
#waybar.main #cpu,
#waybar.main #language,
#waybar.main #memory.swap,
#waybar.main #memory.ram,
#waybar.main #submap,
#waybar.main #pulseaudio,
#waybar.main #temperature,
#waybar.main #tray,
#waybar.main #disk {
  border-bottom: 1.2px solid rgb(152, 217, 255);
}

#waybar.main #window {
  font-weight: 600;
  font-size: 10pt;
}

/* }}} */

/* Module colors */
/* {{{ */
#waybar.main #cpu,
#waybar.main #temperature,
#waybar.main #memory.ram,
#waybar.main #memory.swap,
#waybar.main #disk,
#waybar.main #network {
  color: @performance;
  background: @backgroundw;
}

#waybar.main #pulseaudio {
  color: @audio;
  background: @backgroundw;
}

#waybar.main #custom-battery,
#waybar.main #language,
#waybar.main #backlight,
#waybar.main #battery {
  color: @misc;
  background: @backgroundw;
}

#waybar.main #clock {
  color: @date;
  background: @backgroundw;
  border-radius: 0pt 6pt 6pt 0pt;
}

#waybar.main #window {
  color: @window;
  box-shadow: none;
  font-style: italic;
}

#waybar.main #network.info {
  padding-right: 10px;
  padding-left: 10px;
  color: @caution;
}

#waybar.main #network.info.wifi.normal,
#waybar.main #network.info.ethernet {
  color: @performance;
  padding-right: 15px;
}

#waybar.main #network.info.wifi {
  color: @warning;
  padding-right: 15px;
}

/* }}} */

/* Submap */
/* {{{ */
#waybar.main #submap.󰲏 {
  color: @resize;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-name: blink-modifier-text;
  animation-duration: 1s;
  animation-timing-function: steps(15);
  box-shadow: none;
}

#waybar.main #submap. {
  color: @date;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-name: blink-modifier-text;
  animation-duration: 1s;
  animation-timing-function: steps(15);
  box-shadow: none;
}

/* }}} */

/* Main bar criticals */
/* {{{ */
#waybar.main #memory.swap.critical,
#waybar.main #memory.ram.critical,
#waybar.main #cpu.critical,
#waybar.main #temperature.critical {
  color: @warning;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-name: blink-critical-text;
  animation-duration: 1s;
  animation-timing-function: steps(15);
}

#waybar.main #workspaces button.urgent,
#waybar.main #workspaces button.special.urgent {
  transition: all 0s ease;
  background-image: linear-gradient(-63.435deg,
      transparent 25%,
      @background 25%,
      @background 75%,
      transparent 75%);
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-name: blink-urgent-workspace;
  animation-duration: 1s;
  animation-timing-function: steps(15);
}

/* }}} */

/* Main bar warnings */
/* {{{ */
#waybar.main #pulseaudio.output.muted,
#waybar.main #pulseaudio.input.source-muted {
  color: @sepepator;
}

#waybar.main #custom-battery.warning,
#waybar.main #custom-battery.critical {
  color: @warning;
}

/* }}} */

/* Battery charging */
/* {{{ */
#waybar.main #custom-battery.charging {
  color: @misc;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-name: blink-modifier-text;
  animation-duration: 1s;
  animation-timing-function: steps(15);
}

/* }}} */

/* Workspaces */
/* {{{ */

#waybar.main #workspaces {
  padding-left: 20px;
  padding-right: 4px;
  margin-top: -6px;
  margin-bottom: -6px;
  background-image: linear-gradient(-243.435deg,
      @backgroundw 18px,
      @sepepator 18px,
      @sepepator 21px,
      transparent 21px,
      transparent calc(100% -21px),
      @sepepator calc(100% -21px),
      @sepepator calc(100% - 19px),
      transparent calc(100% - 19px));
}

#waybar.main #workspaces button {
  color: #45585a;
  background: transparent;
  transition: all 0.25s ease;
  padding-right: 16px;
  padding-left: 16px;
  font-style: italic;
  margin-left: -17px;
  padding-top: 6px;
  padding-bottom: 6px;
  background-image: linear-gradient(-63.435deg,
      transparent 25%,
      @backgroundw 25%,
      @backgroundw 75%,
      transparent 75%);
}

/* Focused workspace */
#waybar.main #workspaces button.visible {
  color: @text;
  background-image: linear-gradient(-63.435deg,
      transparent 25%,
      @caution 25%,
      @caution 75%,
      transparent 75%);
}

/* Focused workspace & monitor */
#waybar.main #workspaces button.active {
  color: @window;
  background-image: linear-gradient(-63.435deg,
      transparent 24%,
      @sepepator 24%,
      @sepepator 28%,
      @background1 28%,
      @background1 73%,
      @sepepator 73%,
      @sepepator 76%,
      transparent 76%);
}

#waybar.main #workspaces button:hover {
  color: @window;
}

/* Special workspace animation */
#waybar.main #workspaces button.special.active {
  transition: all 0s ease;
  border: 1.5px solid transparent;
  color: @sepepator;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-name: blink-special-workspace;
  animation-duration: 1s;
  animation-timing-function: steps(15);
}

/* }}} */

/* Custom icons as spacers */
/* {{{ */
#waybar.main #custom-spacer1,
#waybar.main #custom-spacer2,
#waybar.main #custom-spacer3,
#waybar.main #custom-spacer4,
#waybar.main #custom-spacer5,
#waybar.main #custom-spacer6 {
  font-size: 14pt;
  font-weight: bold;
  color: transparent;
  padding-left: 4px;
  padding-right: 4px;
  margin-bottom: -4px;
  margin-top: -4px;
}

/* FIX: @transparent was undefined -> use plain keyword */
#waybar.main #custom-spacer1 {
  background-image: linear-gradient(63.435deg,
      transparent 47.5%,
      @sepepator 52.4%);
}

#waybar.main #custom-spacer2 {
  background-image: linear-gradient(63.435deg,
      @sepepator 47.6%,
      @sepepator 52.4%);
}

#waybar.main #custom-spacer3 {
  background-image: linear-gradient(63.435deg,
      @background2 47.5%,
      @sepepator 47.6%,
      @sepepator 52.4%,
      @background1 52.5%);
}

#waybar.main #custom-spacer4 {
  background-image: linear-gradient(63.435deg,
      transparent 47.5%,
      @sepepator 52.4%);
}

#waybar.main #custom-spacer5 {
  background-image: linear-gradient(-63.435deg,
      transparent 47.5%,
      @sepepator 52.4%);
}

#waybar.main #custom-spacer6 {
  background-image: linear-gradient(-63.435deg,
      transparent 47.5%,
      @sepepator 47.6%,
      @sepepator 52.4%,
      transparent 52.5%);
}

/* }}} */

/* Tray (white panel, always visible) */
/* {{{ */
#waybar.main #tray {
  background: @backgroundw;
  color: @process;
  padding-left: 6pt;
  padding-right: 6pt;
}

/* Highlight tray icons that need attention */
#waybar.main #tray > .needs-attention {
  background: @warning;
  border-radius: 4px;
}

/* Passive icons slightly faded */
#waybar.main #tray > .passive {
  opacity: 0.6;
}

#waybar.main #custom-trayicon {
  font-size: 11pt;
  color: @process;
  font-style: italic;
  background: @backgroundw;
  padding-right: 4pt;
  padding-left: 6pt;
  border-radius: 6pt 0pt 0pt 6pt;
}

/* }}} */

/* Tooltip */
/* {{{ */
tooltip {
  background: @backgroundw;
  border: 3px solid @caution;
  border-radius: 8px;
  font-weight: 500;
  font-family: "Home Video";
}

#waybar.main #tray menu {
  background: @backgroundw;
  color: @text;
  border: 3px solid @caution;
  border-radius: 8px;
}

/* }}} */

/* Indicator bar keyframes */
/* {{{ */
@keyframes blink-critical-battery {
  to {
    border-color: @warning;
    box-shadow:
      inset 0px 3px 4px -5px @warning,
      inset 0px -3px 4px -5px @warning;
  }
}

@keyframes blink-warning-battery {
  to {
    border-color: @warning;
    box-shadow:
      inset 0px 3px 4px -5px @warning,
      inset 0px -3px 4px -5px @warning;
  }
}

@keyframes blink-discharging-battery {
  to {
    border-color: @warning;
    box-shadow:
      inset 0px 3px 4px -5px @warning,
      inset 0px -3px 4px -5px @warning;
  }
}

@keyframes blink-charging-battery {
  to {
    border-color: @misc;
    box-shadow:
      inset 0px 3px 4px -5px @misc,
      inset 0px -3px 4px -5px @misc;
  }
}

@keyframes blink-full-battery {
  to {
    border-color: @misc;
    box-shadow:
      inset 0px 3px 4px -5px @misc,
      inset 0px -3px 4px -5px @misc;
  }
}

/* }}} */

/* Indicator bar battery module */
/* {{{ */

#waybar.indicator {
  font-size: 10px;
  color: rgba(0, 0, 0, 0);
  background: rgba(0, 0, 0, 0);
}

#waybar.indicator #custom-batteryindicator {
  border: 2.5px solid @sepepator;
  background: transparent;
  box-shadow: none;

  border-radius: 7px;
  padding-left: 2247px;
  /* Padding formula:
     (H_rez / scaling) - L_margin - R_margin - 2 * border - (font-size / 2)
     Example: (2880 / 1.25) - 24 - 24 - 2*2.5 - (27/2) = 2237.5px */
}

#waybar.indicator #custom-batteryindicator.critical {
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-name: blink-critical-battery;
  animation-duration: 1s;
  animation-timing-function: steps(15);
}

#waybar.indicator #custom-batteryindicator.warning {
  animation-iteration-count: 4;
  animation-direction: alternate;
  animation-name: blink-warning-battery;
  animation-duration: 0.2s;
  animation-timing-function: steps(15);
}

#waybar.indicator #custom-batteryindicator.discharging {
  animation-iteration-count: 2;
  animation-direction: alternate;
  animation-name: blink-discharging-battery;
  animation-duration: 0.3s;
  animation-timing-function: steps(15);
}

#waybar.indicator #custom-batteryindicator.charging {
  animation-iteration-count: 2;
  animation-direction: alternate;
  animation-name: blink-charging-battery;
  animation-duration: 0.3s;
  animation-timing-function: steps(15);
}

#waybar.indicator #custom-batteryindicator.full {
  animation-iteration-count: 4;
  animation-direction: alternate;
  animation-name: blink-full-battery;
  animation-duration: 0.2s;
  animation-timing-function: steps(15);
}

/* }}} */