body:not(.mobile-layout) #game-wrapper .column,
body:not(.mobile-layout) #game-wrapper .side-drawer,
body:not(.mobile-layout) #game-wrapper .right-sidebar-content,
body:not(.mobile-layout) #game-wrapper .hud-window {
  background-image: url("../png/bg.png");
}

body:not(.mobile-layout) :is(#skill-window, #battle-window, #friend-window, #hunting-analyser-window, .container-window),
body:not(.mobile-layout) :is(#skill-window, #battle-window, #friend-window, #hunting-analyser-window, .container-window) > .footer,
body:not(.mobile-layout) #battle-window :is(.battle-window-types, .battle-window-target-wrapper),
body:not(.mobile-layout) #hunting-analyser-window > .trade-window-actions {
  background-image: url("../png/bg.png");
}

body:not(.mobile-layout) :is(#skill-window, #battle-window, #friend-window, #hunting-analyser-window, .container-window) {
  color: white;
  box-sizing: border-box;
  border: 1px solid #0c0d0c;
  padding: 1px;
  box-shadow: inset 1px 1px #777a72, inset -1px -1px #292c27;
}

body:not(.mobile-layout) :is(#skill-window, #battle-window, #friend-window, #hunting-analyser-window, .container-window) > .header {
  background-image: url("../png/bg2.png");
  box-shadow: inset 0 -1px #292c27;
}

body:not(.mobile-layout) #skill-window .skill-wrapper > .skill,
body:not(.mobile-layout) #battle-window .battle-window-target-title,
body:not(.mobile-layout) #hunting-analyser-window .trade-window-actions button {
  color: white;
}

/* Keep presence colors even over the existing inline color and hover highlight. */
body:not(.mobile-layout) #friend-window .friend-entry[data-online="true"] {
  color: #66ff66 !important;
}

body:not(.mobile-layout) #friend-window .friend-entry[data-online="false"] {
  color: #ff6b6b !important;
}

body:not(.mobile-layout) #game-wrapper .hud-window {
  width: 100%;
  flex: 0 0 auto;
  max-height: none;
  color: white;
  position: relative;
  cursor: move;
  user-select: none;
}

body:not(.mobile-layout) .hud-window > .header {
  flex-direction: row;
  position: absolute;
  top: 0;
  left: 8px;
  height: 14px;
  padding: 0;
  border: 0;
  background: transparent;
  z-index: 1;
}

body:not(.mobile-layout) .hud-window > .header:empty {
  display: none;
}

body:not(.mobile-layout) #vitals-window .bar {
  cursor: move;
}

body:not(.mobile-layout) #equipment-window .slot {
  cursor: default;
}

/* The loot picker overrides the normal slot and HUD drag cursors only while armed. */
body.loot-container-targeting #equipment-window,
body.loot-container-targeting #equipment-window .slot,
body.loot-container-targeting #equipment-window *,
body.loot-container-targeting .container-window,
body.loot-container-targeting .container-window * {
  cursor: var(--loot-target-cursor);
}

body:not(.mobile-layout) .hud-window > .body {
  display: block;
  flex: 0 0 auto;
  min-height: 0;
  padding: 0;
  overflow: visible;
}

body:not(.mobile-layout) .hud-window .equipment-options-wrapper {
  margin-top: 14px;
}

body:not(.mobile-layout) .hud-compact .first-wrapper {
  width: 100%;
}

body:not(.mobile-layout) .hud-window > .header .hud-icon-button {
  width: 16px;
  height: 14px;
  margin: 0;
  background-size: 200% 100%;
  background-position: left center;
}

body:not(.mobile-layout) .hud-window > .header .hud-icon-button:active {
  background-position: right center;
}

body:not(.mobile-layout) .hud-compact #hud-shrink-button {
  background-image: url("../png/window/max_button_small.png");
}

body:not(.mobile-layout) #health-bar > .percentage,
body:not(.mobile-layout) #mana-bar > .percentage {
  display: none;
}

body:not(.mobile-layout) .hud-compact .equipment.wrapper {
  display: grid;
  grid-template-columns: 34px 34px 70px;
  justify-content: space-between;
  align-items: start;
  gap: 4px;
}

body:not(.mobile-layout) .hud-compact .equipment-column {
  display: contents;
}

body:not(.mobile-layout) .hud-compact .slot:not(#left-slot):not(#right-slot),
body:not(.mobile-layout) .hud-compact #status-bar,
body:not(.mobile-layout) .hud-compact .equipment-buttons,
body:not(.mobile-layout) .hud-compact #stop-actions {
  display: none;
}

body:not(.mobile-layout) .hud-compact #left-slot { grid-column: 1; grid-row: 1; }
body:not(.mobile-layout) .hud-compact #right-slot { grid-column: 2; grid-row: 1; }
body:not(.mobile-layout) .hud-compact #player-capacity { grid-column: 1; grid-row: 2; }
body:not(.mobile-layout) .hud-compact .equipment-padding:has(#hub-button) { grid-column: 2; grid-row: 2; }
body:not(.mobile-layout) .hud-compact .combat-modes {
  grid-column: 3;
  grid-row: 1 / 3;
  grid-template-columns: repeat(3, 22px);
  margin-left: 0;
}
body:not(.mobile-layout) .hud-compact .combat-offensive { grid-column: 1; grid-row: 1; }
body:not(.mobile-layout) .hud-compact .combat-balanced { grid-column: 2; grid-row: 1; }
body:not(.mobile-layout) .hud-compact .combat-defensive { grid-column: 3; grid-row: 1; }
body:not(.mobile-layout) .hud-compact #stand-mode { grid-column: 1; grid-row: 2; }
body:not(.mobile-layout) .hud-compact #chase-mode { grid-column: 2; grid-row: 2; }
body:not(.mobile-layout) .hud-compact #secure-mode { grid-column: 3; grid-row: 2; }

body:not(.mobile-layout) #battle-menu {
  background-image: url('../png/bg.png');
  padding: 2px;
  color: white;
}

body:not(.mobile-layout) #battle-menu > .menu-header {
  background-image: url('../png/bg2.png');
  box-shadow: inset 0 -1px #292c27;
}

body:not(.mobile-layout) .battle-window-types {
  display: grid;
  grid-template-columns: repeat(5, 22px);
  justify-content: center;
  gap: 2px;
  padding: 2px 0;
}

body:not(.mobile-layout) .battle-window-types > button {
  display: grid;
  place-items: center;
  width: 100%;
  height: 24px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  font-size: 0;
  opacity: 1;
}

body:not(.mobile-layout) .battle-window-types > button::before {
  content: '';
  width: 20px;
  height: 20px;
  background-image: var(--battle-filter-icon);
  background-repeat: no-repeat;
  background-position: 0 -40px;
  image-rendering: pixelated;
}

body:not(.mobile-layout) .battle-window-types > button.off::before { background-position: 0 0; }
body:not(.mobile-layout) .battle-window-types > button:active::before { background-position: 0 -60px; }
body:not(.mobile-layout) .battle-window-types > button.off:active::before { background-position: 0 -20px; }
body:not(.mobile-layout) .battle-window-types > button:focus-visible { outline: 1px solid #ddd; }
body:not(.mobile-layout) .battle-window-types > [filter="players"] { --battle-filter-icon: url('../png/battle/battle_players.png'); }
body:not(.mobile-layout) .battle-window-types > [filter="npcs"] { --battle-filter-icon: url('../png/battle/battle_npcs.png'); }
body:not(.mobile-layout) .battle-window-types > [filter="monsters"] { --battle-filter-icon: url('../png/battle/battle_monsters.png'); }
body:not(.mobile-layout) .battle-window-types > [filter="nonskulled"] { --battle-filter-icon: url('../png/battle/battle_skulls.png'); }
body:not(.mobile-layout) .battle-window-types > [filter="party"] { --battle-filter-icon: url('../png/battle/battle_party.png'); }

body:not(.mobile-layout) .battle-window-target-wrapper {
  height: 26px;
  margin-bottom: 0;
  border-color: transparent;
}

body:not(.mobile-layout) .battle-window-target-canvas {
  flex: 0 0 24px;
}

body:not(.mobile-layout) .battle-window-target-canvas > canvas {
  width: 24px;
  height: 24px;
  image-rendering: pixelated;
}

body:not(.mobile-layout) .battle-window-target-stats {
  padding: 0 2px;
}

body:not(.mobile-layout) .battle-window-target-title {
  font-size: 11px;
  line-height: 15px;
}

body:not(.mobile-layout) .battle-window-bar-wrapper {
  height: 4px;
  margin: 0;
  box-shadow: none;
}

body:not(.mobile-layout) .battle-window-target-stats-bar.health {
  height: 100%;
  border: 0;
  background-image: none;
  box-shadow: none;
}

#quest-log-placeholder { display: none; }

body:not(.mobile-layout) #quest-log-placeholder {
  display: block;
  grid-column: 1;
  grid-row: 3;
  background: url('../png/options/button_questlog.png') left center / 200% 100% no-repeat;
  cursor: pointer;
}

body:not(.mobile-layout) #quest-log-placeholder:active {
  background-position: right center;
}

/* Expanded equipment: offset side columns reserve room for the upper controls. */
body:not(.mobile-layout) #equipment-window:not(.hud-compact) .equipment-options-wrapper { margin-top: 0; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) .equipment.wrapper {
  display: grid;
  grid-template-columns: repeat(3, 34px) 48px;
  grid-template-rows: repeat(4, 34px);
  gap: 2px;
  justify-content: start;
  align-items: start;
  position: relative;
}
body:not(.mobile-layout) #equipment-window:not(.hud-compact) .equipment-column { display: contents; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) .equipment-column > .equipment-padding:not(#player-capacity) { display: none; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #shoulder-slot { grid-column: 1; grid-row: 1; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #left-slot { grid-column: 1; grid-row: 2; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #ring-slot { grid-column: 1; grid-row: 3; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #head-slot { grid-column: 2; grid-row: 1; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #armor-slot { grid-column: 2; grid-row: 2; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #legs-slot { grid-column: 2; grid-row: 3; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #boots-slot { grid-column: 2; grid-row: 4; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #backpack-slot { grid-column: 3; grid-row: 1; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #right-slot { grid-column: 3; grid-row: 2; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #quiver-slot { grid-column: 3; grid-row: 3; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) :is(#shoulder-slot, #left-slot, #ring-slot, #backpack-slot, #right-slot, #quiver-slot) { top: 14px; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #hud-store-inbox-button { top: -15px; height: 12px; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #player-capacity {
  grid-column: 3; grid-row: 4;
  box-sizing: border-box; width: 34px; height: 20px; min-height: 20px;
  position: relative; top: 14px; line-height: 9px;
  display: flex; flex-direction: column; justify-content: center;
  background: url('../png/bg2.png');
  border: 1px solid #111; box-shadow: inset 1px 1px #555;
}
body:not(.mobile-layout) #equipment-window:not(.hud-compact) .equipment.wrapper::before {
  content: ''; grid-column: 1; grid-row: 4;
  width: 34px; height: 20px; box-sizing: border-box;
  position: relative; top: 14px;
  background: url('../png/bg2.png'); border: 1px solid #111;
  box-shadow: inset 1px 1px #555;
}
body:not(.mobile-layout) #equipment-window:not(.hud-compact) .combat-modes {
  grid-column: 4; grid-row: 1 / 5;
  margin-left: 2px; align-content: start;
}
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #status-bar { box-sizing: border-box; width: 106px; min-height: 16px; flex-wrap: wrap; }
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #stop-actions {
  position: absolute; bottom: -20px; right: 0;
  width: 48px; height: 16px; margin: 0; padding: 0;
  border: 0; border-radius: 0;
  background: url('../png/button_gray.png') left center / 200% 100% no-repeat;
}
body:not(.mobile-layout) #equipment-window:not(.hud-compact) #stop-actions:active { background-position: right center; }
