
// Bar module rings
.cpubar { color: $base0C; }
.gpubar { color: $base0E; }
.membar { color: $base08; }
.batbar { color: $base0B; }
.cpubar, .gpubar, .membar, .batbar { @include background-base2; margin: $gaps-window 0; }

// Window chrome
.sys-win            { padding: $popup-scale * 10pt; font-size: $popup-scale * $panel-font-size; }
.sys-section        { margin-bottom: 0; }
.sys-section-header { margin-bottom: $popup-scale * 10pt; }

.sys-label {
  font-size: 0.72em;
  font-weight: bold;
  letter-spacing: 0.14em;
  @include color-body;
}

.section-accent {
  min-width: 3px;
  border-radius: 2px;
  margin-right: $popup-scale * 8pt;
}

.cpu-accent { background-color: $base0C; }
.gpu-accent { background-color: $base0E; }
.ram-accent { background-color: $base08; }
.bat-accent { background-color: $base0B; }

.section-sep {
  background-color: $base03;
  min-height: 2px;
  margin: $popup-scale * 6pt 0 $popup-scale * 10pt;
}

// All rings and progress tracks share the same background
.cpu-usage-ring, .cpu-freq-ring,
.gpu-ring, .gpu-freq-ring,
.ram-ring, .swap-ring, .bat-ring,
.vram-bar { @include background-base2; }

// Ring colors
.cpu-usage-ring                { color: $base0C; }
.cpu-freq-ring, .gpu-freq-ring { color: $base0D; }
.gpu-ring                      { color: $base0E; }
.ram-ring                      { color: $base08; }
.swap-ring                     { color: $base09; }

// Ring margins - freq rings use larger margins for concentric overlay effect
.cpu-usage-ring, .gpu-ring { margin: $popup-scale * 3pt; }
.ram-ring, .bat-ring       { margin: $popup-scale * 4pt; }
.swap-ring                 { margin: $popup-scale * 3.5pt; }
.cpu-freq-ring             { margin: $popup-scale * 12px; }
.gpu-freq-ring             { margin: $popup-scale * 13px; }

// Shared label patterns
.gpu-ring-value, .gpu-stat-value, .ram-used-label { font-weight: bold; @include color-body; }
.gpu-ring-value { font-size: 0.82em; }
.gpu-stat-value { font-size: 0.85em; }
.ram-used-label { font-size: 0.95em; }

.gpu-ring-label, .gpu-stat-label,
.vram-usage-label, .swap-section-label { font-size: 0.62em; @include color-active; }
.gpu-ring-label, .vram-usage-label, .swap-section-label { margin-top: 2pt; }

.cpu-core-label  { font-size: 0.7em; @include color-active; }
.bat-ring-label  { font-size: 0.7em; @include color-body; }
.ram-total-label { font-size: 0.72em; @include color-active; }

// GPU stats row
.gpu-stats-row { margin-top: $popup-scale * 6pt; margin-bottom: $popup-scale * 2pt; }

// VRAM
.vram-row { margin-top: $popup-scale * 6pt; }

.vram-bar {
  @include border-radius;
  padding: $popup-scale * 2pt;
}

.vram-bar trough * {
  background-color: $base0E;
  @include border-radius;
}

// RAM cached ring overrides group background
.ram-cached-ring {
  @include color-active;
  background-color: transparent;
  margin: $popup-scale * 4pt;
}
