/* ==UserStyle==
@name           Gruvbox for Proxmox
@namespace      git.m3.fyi/Marsn3
@version        1.0.4
@description    Gruvbox Theme for Proxmox
@author         Marsn3
@homepageURL https://git.m3.fyi/Marsn3/userstyles
@updateURL https://git.m3.fyi/Marsn3/userstyles/~raw/main/src/proxmox.user.css
@license MIT
==/UserStyle== */
@-moz-document domain("pve.m3.fyi"),domain("pve.mniermann.de") {
  .x-progress.critical .x-progress-bar,
  .proxmox-invalid-row {
    background-color: var(--red);
  }
  #proxmoxlogo-1018-img {
    filter: invert(100%) sepia(100%);
  }
  .critical {
    color: var(--red);
  }
  .warning {
    color: var(--yellow);
  }
  .good {
    color: var(--green);
  }
  .x-progress.warning .x-progress-bar {
    background-color: var(--yellow);
  }
  .x-progress-default .x-progress-bar-default {
    background-color: var(--green);
  }
  .x-progress-default {
    background-color: var(--fg4);
    border: none;
  }
  .x-mask {
    background-color: rgb(var(--rgb-bg4) / 70%) !important;
  }
  .x-tab-icon-el-default,
  .x-column-header,
  .x-tab.x-tab-disabled.x-tab-default .x-tab-icon-el,
  .x-tab.x-tab-active.x-tab-default .x-tab-icon-el,
  .x-btn-icon-el-default-small,
  .x-treelist-item-icon,
  .x-treelist-item-text,
  .x-btn-inner-default-small,
  .x-tab-inner-default,
  .proxmox-inline-button .x-btn-inner,
  .x-btn-inner-default-toolbar-small,
  .x-mask-msg-inner,
  .x-legend-item,
  .x-tip-body-form-invalid,
  .x-body,
  .x-menu-item-text-default,
  .x-treelist-item-expander,
  .x-treelist-row-over > * > .x-treelist-item-icon,
  .x-treelist-row-over > * > .x-treelist-item-text {
    color: var(--fg);
  }
  #userinfo {
    background-color: var(--bg4) !important;
    border-color: var(--fg) !important;
  }
  .x-grid-with-row-lines .x-grid-item-selected + .x-grid-item {
    border-top-color: var(--fg2);
  }
  .x-btn-wrap-default-toolbar-small.x-btn-split-right:after,
  .x-btn-wrap-default-toolbar-small.x-btn-arrow-right:after {
    filter: var(--filter-reset) var(--filter-bg);
  }
  .x-treelist-pve-nav,
  .x-grid-item {
    background-color: var(--bg3);
    color: var(--fg);
  }
  .x-treelist-item-selected > .x-treelist-row,
  .x-grid-item-selected,
  .x-menu-item-default.x-menu-item-focus,
  .x-menu-item-default.x-menu-item-active,
  .x-treelist-row-over,
  .x-column-header-over,
  .x-keyboard-mode .x-btn-focus.x-btn-default-toolbar-small,
  .x-keyboard-mode .x-btn-focus.x-btn-pressed.x-btn-default-toolbar-small,
  .x-treelist-row-over > * > .x-treelist-item-expander,
  .x-keyboard-mode .x-btn-focus.x-btn-over.x-btn-default-toolbar-small,
  .x-btn-over.x-btn-over.x-btn-default-toolbar-small,
  #noVNC_modifiers {
    border-color: var(--bg3);
    box-shadow: none;
    background-color: var(--fg4);
    color: var(--fg);
  }
  .x-keyboard-mode .x-grid-item-focused,
  .x-keyboard-mode .x-column-header.x-column-header-focus {
    color: var(--fg2);
  }
  .x-grid-with-row-lines .x-grid-item {
    border-color: var(--fg4);
  }
  .x-tree-icon-custom.stopped,
  .x-grid-icon-custom.stopped,
  .x-tree-icon-custom.offline,
  .x-grid-icon-custom.offline {
    color: var(--fg3);
  }
  .x-tree-icon-custom.running {
    color: var(--bg);
  }
  .noVNC_panel,
  .noVNC_panel .noVNC_heading {
    background: var(--bg);
    color: var(--fg);
  }
  .usage-wrapper {
    border: 1px solid var(--bg1);
  }
  .usage {
    background-color: var(--bg1);
  }
  .x-tree-icon-custom {
    color: var(--bg1);
  }
  .x-toolbar-default .x-toolbar-separator-horizontal {
    border-left-color: var(--fg4);
    border-right-color: var(--fg);
  }
  .fa-ceph:before,
  .x-tree-arrows .x-tree-expander,
  .x-grid-row-console,
  .pve-itype-icon-cpu,
  .pve-itype-icon-memory,
  .x-menu-item-icon-default,
  .pve-itype-icon-serial,
  .noVNC_button {
    filter: var(--filter-reset) var(--filter-fg);
  }
  .x-btn-default-toolbar-small {
    border-color: var(--fg4);
    background-color: var(--fg3);
  }
  .x-btn.x-btn-disabled.x-btn-default-toolbar-small {
    background-color: var(--fg3);
  }

  .x-tree-icon-custom.running:after,
  .x-grid-icon-custom.running:after,
  .x-window-header-title-default,
  .x-panel-header-title-default,
  .x-tree-icon-custom.online:after,
  .x-grid-icon-custom.online:after {
    text-shadow: none;
    color: var(--green);
  }
  .x-boundlist,
  .x-mask-msg,
  #noVNC_control_bar,
  #noVNC_control_bar_handle,
  .noVNC_panel .noVNC_heading {
    background: var(--bg);
    border-color: var(--bg4);
  }
  .x-form-item-label-default {
    color: var(--fg3);
  }
  .x-tab.x-tab-disabled.x-tab-default {
    border-color: var(--bg4);
    background-color: var(--bg2);
  }
  .x-form-invalid-field-default,
  .x-form-text-default,
  .x-tab-bar-default,
  .x-menu-body-default {
    background-color: var(--bg3);
    color: var(--fg);
  }
  .x-form-trigger-wrap-default.x-form-trigger-wrap-focus,
  .x-tool-tool-el {
    border-color: var(--green);
  }
  .x-column-header {
    border-right: 1px solid var(--bg3);
  }
  .x-panel-header-default,
  .x-column-header,
  .x-grid-header-ct {
    background-color: var(--bg2);
    border-color: var(--bg4);
  }
  .x-grid-header-ct {
    border: 1px solid var(--bg4);
  }
  .x-column-header-trigger,
  .x-menu-icon-separator-default {
    background-color: var(--bg2);
    border-left: 1px solid var(--bg4);
  }
  .x-window-header-default .x-tool-img,
  .x-panel-header-default .x-tool-tool-el {
    background-color: var(--bg2);
  }
  body.x-border-layout-ct,
  div.x-border-layout-ct {
    background-color: var(--bg1);
  }
  .x-form-trigger-wrap-default.x-form-trigger-wrap-invalid {
    border-color: var(--red);
  }
  .x-splitter-collapsed .x-layout-split-bottom,
  .x-layout-split-bottom,
  .x-column-header-sort-DESC .x-column-header-text-inner {
    filter: var(--filter-reset) var(--filter-fg2);
  }
  .x-toolbar-default {
    background-color: var(--bg2);
    border-color: var(--bg4);
  }
  .x-btn-over.x-btn-default-small {
    background-color: var(--green-dim);
    border-color: var(--green-dim);
  }
  .x-btn-default-small,
  .x-tab.x-tab-active.x-tab-default,
  .x-btn.x-btn-disabled.x-btn-default-small {
    background-color: var(--green);
    border-color: var(--green);
  }
  .x-body {
    color: var(--fg);
    background: var(--bg);
  }
  .x-window-default {
    border-color: var(--bg4);
    background-color: var(--bg4);
  }
  .x-window-header-default,
  .x-panel-default,
  .x-form-trigger-wrap-default,
  .x-tab-default,
  .x-grid-with-col-lines .x-grid-item-selected .x-grid-cell {
    border-color: var(--bg4);
  }
  .x-form-trigger-default {
    background-color: var(--bg1);
  }
  .x-window-header-default-top,
  .x-toolbar-footer,
  .x-tab-default-top {
    background-color: var(--bg2);
  }
  .x-tip-form-invalid {
    background-color: var(--bg3);
    border: var(--bg4);
  }
  .x-legend-item-marker,
  .x-surface,
  .x-surface-canvas {
    filter: brightness(60%) grayscale(100) sepia(100%);
  }
  .x-window-body-default,
  .x-panel-body-default,
  .x-message-box .x-window-body {
    border-color: var(--bg4);
    background: var(--bg);
    color: var(--fg);
  }
  .x-form-text-default::placeholder {
    color: var(--fg3);
  }

  .x-keyboard-mode .x-tab-default-top.x-tab-focus.x-tab-default,
  .x-keyboard-mode .x-tab-default-top.x-tab-focus.x-tab-over.x-tab-default,
  .x-keyboard-mode .x-tab-default-top.x-tab-active.x-tab-over.x-tab-default,
  .x-keyboard-mode .x-btn-focus.x-btn-default-small,
  .x-keyboard-mode .x-btn-focus.x-btn-pressed.x-btn-default-small,
  .x-keyboard-mode .x-btn-focus.x-btn-over.x-btn-default-small {
    background: var(--green-dim);
    border-color: var(--green-dim);
    box-shadow: none;
  }
  .x-boundlist-item-over,
  .x-boundlist-selected,
  .x-tab-over.x-tab-default {
    background: var(--green);
    border-color: var(--green);
  }
  .x-legend-horizontal .x-legend-item {
    border-color: var(--fg4) !important;
  }
  .x-boundlist-item,
  .x-legend-container,
  .x-legend {
    background: var(--bg2);
    color: var(--fg);
    box-shadow: none;
    border-color: var(--bg4);
  }
}