/* V34 — FIX REAL DO DOCK. Base direta: V32 original.
   Objetivo: manter os três assets V32, restaurar + dos slots vazios e
   alinhar 4 consumíveis no painel direito sem deixar as regras antigas
   de data-ui-profile comprimirem/substituírem o dock. */

/* As regras antigas de desktop/large têm especificidade maior que V32.
   Este bloco é deliberadamente mais específico e vem por último. */
html body[data-ui-profile] .hunter-status{
  position:fixed!important;
  left:9px!important;
  right:auto!important;
  top:auto!important;
  bottom:9px!important;
  width:var(--zk32-status-w)!important;
  height:var(--zk32-h)!important;
  transform:none!important;
}
html body[data-ui-profile] .hunter-status .status-window{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  clip-path:none!important;
  background:transparent url('assets/ui/hotbar_v32/status_panel.png') center/100% 100% no-repeat!important;
  box-shadow:none!important;
}
html body[data-ui-profile] .hunter-status .window-body{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  padding:0!important;
  display:block!important;
  background:transparent!important;
}
html body[data-ui-profile] .hunter-status .charline,
html body[data-ui-profile] .hunter-status .status-badges{display:none!important}
html body[data-ui-profile] .hunter-status .hud-meter-line{height:14.5%!important}
html body[data-ui-profile] .hunter-status .hp-line{top:21.2%!important}
html body[data-ui-profile] .hunter-status .ki-line{top:40.2%!important}
html body[data-ui-profile] .hunter-status .hud-meter-line .meter{height:100%!important}
html body[data-ui-profile] .hunter-status .hud-row{height:100%!important;font-size:inherit!important}
html body[data-ui-profile] .hunter-status .xp-meter{height:13.2%!important}
html body[data-ui-profile] .hunter-status .stamina{height:12.4%!important;display:block!important}

html body[data-ui-profile] .hunter-footer{
  position:fixed!important;
  left:calc(var(--zk32-origin-x) + var(--zk32-status-w) + var(--zk32-gap))!important;
  right:auto!important;
  bottom:9px!important;
  width:calc(var(--zk32-center-w) + var(--zk32-right-w) + var(--zk32-gap))!important;
  height:var(--zk32-h)!important;
  min-width:0!important;
  transform:none!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html body[data-ui-profile] .hunter-centerbar{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  grid-template-columns:none!important;
  grid-template-rows:none!important;
  border:0!important;
  border-radius:0!important;
  clip-path:none!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html body[data-ui-profile] .hunter-centerbar::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:var(--zk32-center-w)!important;
  height:var(--zk32-h)!important;
  background:transparent url('assets/ui/hotbar_v32/hotbar_panel.png') center/100% 100% no-repeat!important;
  pointer-events:none!important;
  z-index:0!important;
}
html body[data-ui-profile] .hunter-centerbar .hunter-quick{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:var(--zk32-center-w)!important;
  height:21%!important;
  display:grid!important;
  grid-template-columns:7.5% 27% 38% 27% .5%!important;
  gap:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}
html body[data-ui-profile] .hunter-centerbar .hunter-quick button{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:transparent!important;
  box-shadow:none!important;
}

/* Hotbar: os slots continuam sendo os botões reais do game.js; só a pele é o asset. */
html body[data-ui-profile] #hotbar{
  position:absolute!important;
  left:0!important;
  top:clamp(24px,1.6vw,30px)!important;
  width:var(--zk32-center-w)!important;
  height:calc(var(--zk32-h) - clamp(29px,1.9vw,35px))!important;
  padding:0 clamp(13px,.9vw,17px) clamp(5px,.35vw,7px)!important;
  display:grid!important;
  grid-template-columns:repeat(10,1fr)!important;
  grid-template-rows:repeat(2,1fr)!important;
  column-gap:1.22%!important;
  row-gap:5.1%!important;
  align-content:stretch!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  justify-items:stretch!important;
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
}
html body[data-ui-profile] #hotbar .action-slot{
  position:relative!important;
  width:auto!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  padding:3px!important;
  border:0!important;
  border-radius:6px!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
html body[data-ui-profile] #hotbar .action-slot::after{display:none!important;content:none!important}
html body[data-ui-profile] #hotbar .action-slot img{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:72%!important;
  height:72%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  transform:translate(-50%,-50%)!important;
  object-fit:contain!important;
}
/* O número minúsculo era o que sobrava visualmente quando o + perdia a disputa de CSS. */
html body[data-ui-profile] #hotbar .action-slot.empty .slot-key{display:none!important}
html body[data-ui-profile] #hotbar .action-slot .empty-plus{
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  place-items:center!important;
  z-index:6!important;
  color:#92abc0!important;
  background:transparent!important;
  font:400 clamp(16px,1.08vw,21px)/1 Arial,sans-serif!important;
  text-shadow:0 1px 2px #000,0 0 5px rgba(54,195,255,.24)!important;
  pointer-events:none!important;
}
html body[data-ui-profile] #hotbar .action-slot.empty:hover .empty-plus{color:#e7fbff!important}
html body[data-ui-profile] #hotbar .action-slot .slot-key{
  left:3px!important;right:auto!important;top:2px!important;
  width:auto!important;height:auto!important;
  padding:0!important;border:0!important;background:transparent!important;
  font:900 clamp(6px,.45vw,8px)/1 Arial,sans-serif!important;
}
html body[data-ui-profile] #hotbar .action-slot .slot-count{
  right:3px!important;bottom:2px!important;
  padding:0!important;border:0!important;background:transparent!important;
  font:800 clamp(6px,.43vw,8px)/1 Arial,sans-serif!important;
}

/* Painel direito: força o asset real V32 a ficar acima de qualquer fundo preto legado. */
html body[data-ui-profile] .hunter-centerbar .combat-settings{
  position:absolute!important;
  left:calc(var(--zk32-center-w) + var(--zk32-gap))!important;
  right:auto!important;
  top:0!important;
  width:var(--zk32-right-w)!important;
  height:var(--zk32-h)!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  isolation:isolate!important;
}
html body[data-ui-profile] .hunter-centerbar .combat-settings::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  background:transparent url('assets/ui/hotbar_v32/target_panel.png') center/100% 100% no-repeat!important;
  z-index:-1!important;
  pointer-events:none!important;
}
html body[data-ui-profile] .hunter-centerbar .combat-settings .setting-line{
  position:absolute!important;
  left:37.7%!important;
  width:54%!important;
  height:16.2%!important;
  padding:0!important;
  display:block!important;
}
html body[data-ui-profile] .hunter-centerbar .combat-settings .loadout-line{top:14%!important}
html body[data-ui-profile] .hunter-centerbar .combat-settings label.setting-line{top:36%!important}
html body[data-ui-profile] .hunter-centerbar .combat-settings .loadout-wrap{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
html body[data-ui-profile] .hunter-centerbar .combat-settings .dropdown-trigger,
html body[data-ui-profile] .hunter-centerbar .combat-settings select{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  padding:0 19% 0 5%!important;
  border:0!important;
  border-radius:4px!important;
  background:#061421!important;
  color:#f2f9ff!important;
  font:800 clamp(6.5px,.50vw,9px)/1 Arial,sans-serif!important;
  box-shadow:none!important;
}

/* Stance continua no DOM e funcional para não quebrar a lógica, mas sai deste espaço visual. */
html body[data-ui-profile] .hunter-centerbar .combat-mini-icons.zk-v34-stance-storage{
  position:absolute!important;
  width:1px!important;height:1px!important;
  left:-9999px!important;top:-9999px!important;
  display:block!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Quatro áreas clicáveis exatamente em cima dos quatro recessos do target_panel.png. */
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumables{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  pointer-events:none!important;
  z-index:4!important;
}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable{
  position:absolute!important;
  top:63.15%!important;
  width:10.95%!important;
  height:24.9%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  box-shadow:none!important;
  display:grid!important;
  place-items:center!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  overflow:hidden!important;
}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable[data-qc-slot="0"]{left:9.45%!important}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable[data-qc-slot="1"]{left:21.97%!important}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable[data-qc-slot="2"]{left:34.41%!important}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable[data-qc-slot="3"]{left:46.85%!important}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable:hover{
  background:rgba(46,190,255,.07)!important;
  box-shadow:inset 0 0 0 1px rgba(109,225,255,.30)!important;
}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable.filled::before{
  content:""!important;
  position:absolute!important;
  inset:14%!important;
  border-radius:5px!important;
  background:#061421!important;
  box-shadow:inset 0 0 6px rgba(0,0,0,.75)!important;
  pointer-events:none!important;
  z-index:0!important;
}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable img{
  position:relative!important;
  z-index:2!important;
  width:78%!important;
  height:78%!important;
  object-fit:contain!important;
  image-rendering:pixelated!important;
  pointer-events:none!important;
}
/* O + vazio já faz parte do asset target_panel.png; o botão invisível fica exatamente por cima. */
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable .zk-v34-qplus{display:none!important}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable .zk-v34-qcount{
  position:absolute!important;
  right:2px!important;
  bottom:1px!important;
  color:#ffe55c!important;
  font:900 clamp(5px,.40vw,7px)/1 Arial,sans-serif!important;
  text-shadow:0 1px 2px #000!important;
  pointer-events:none!important;
}
html body[data-ui-profile] .hunter-centerbar .zk-v34-consumable.cooling::after{
  content:""!important;
  position:absolute!important;
  inset:7%!important;
  border-radius:5px!important;
  background:rgba(0,7,14,.48)!important;
  pointer-events:none!important;
}

/* Range permanece exatamente no bloco pintado à direita. */
html body[data-ui-profile] .hunter-centerbar .combat-bottom-row{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  pointer-events:none!important;
}
html body[data-ui-profile] .hunter-centerbar .range-inline{
  position:absolute!important;
  left:61.2%!important;
  top:62.4%!important;
  width:32.98%!important;
  height:27%!important;
  display:grid!important;
  grid-template-columns:28% 44% 28%!important;
  align-items:stretch!important;
  gap:0!important;
  pointer-events:auto!important;
}
html body[data-ui-profile] .hunter-centerbar .range-inline span{display:none!important}
html body[data-ui-profile] .hunter-centerbar .range-inline button{
  width:auto!important;height:auto!important;min-width:0!important;
  padding:0!important;border:0!important;background:transparent!important;
  color:transparent!important;box-shadow:none!important;
}
html body[data-ui-profile] .hunter-centerbar .range-inline b{
  display:grid!important;
  place-items:center!important;
  width:auto!important;height:auto!important;min-width:0!important;
  margin:8% 6%!important;
  border-radius:4px!important;
  background:#071421!important;
  color:#ffbf27!important;
  font:900 clamp(8px,.65vw,12px)/1 Arial,sans-serif!important;
}

/* Picker pequeno e funcional dos 4 slots de consumível. */
.zk-v34-consumable-picker{
  position:fixed;
  z-index:250;
  min-width:190px;
  padding:6px;
  border:1px solid #168ed0;
  border-radius:6px;
  background:rgba(3,13,23,.98);
  box-shadow:0 8px 22px #000c,0 0 10px rgba(0,157,255,.18);
  display:none;
}
.zk-v34-consumable-picker.show{display:grid;gap:4px}
.zk-v34-consumable-picker button{
  min-height:34px;
  padding:4px 7px;
  border:1px solid #214e70;
  border-radius:4px;
  background:#071928;
  color:#dff7ff;
  display:grid;
  grid-template-columns:28px 1fr auto;
  align-items:center;
  gap:7px;
  text-align:left;
  cursor:pointer;
}
.zk-v34-consumable-picker button:hover{border-color:#42c6ff;background:#0a2336}
.zk-v34-consumable-picker img{width:26px;height:26px;object-fit:contain;image-rendering:pixelated}
.zk-v34-consumable-picker small{color:#7fa8bf;font-size:9px}
.zk-v34-consumable-picker .remove{grid-template-columns:1fr;color:#ffbd80;text-align:center}

/* Em notebook V32 já reduz as variáveis. Apenas evitamos a regra legada que desloca o status. */
@media(max-width:1180px){
  html body[data-ui-profile] .hunter-status{left:8px!important}
}
