/* ===================================================================== */
/* OWN PROFILE / INVENTORY (#player-info-modal .pi-shell.is-me): wooden    */
/* "Inventory" and "Equipment" signs, 3D category tabs, framed item slots  */
/* and labelled menu buttons. The frame, close button and equipment slots  */
/* come from profile-dialog.css. Presentation only; markup and behaviour   */
/* live in items.js / inventory.js.                                        */
/* ===================================================================== */

body #player-info-modal .pi-shell.is-me{
  --iv-wood: linear-gradient(180deg, #d79a58 0%, #b87438 52%, #8d5226 100%);
  --iv-grain: repeating-linear-gradient(92deg, rgba(60, 28, 6, 0) 0 22px, rgba(60, 28, 6, 0.16) 22px 24px);
  --iv-card: linear-gradient(180deg, #0c2144, #081a38);
  --iv-btn: linear-gradient(180deg, #1b5fb8 0%, #123f86 52%, #0c2c62 100%);
  --iv-btn-on: linear-gradient(180deg, #4aa6ff 0%, #2677e6 52%, #1757bd 100%);
  font-family: Georgia, "Times New Roman", serif;
}
body #player-info-modal .pi-shell.is-me .pi-board{ padding-top: 24px; }

/* ---- dark-blue cards ---- */
body #player-info-modal .pi-shell.is-me .pi-inventory-card,
body #player-info-modal .pi-shell.is-me .pi-equipment-card{
  position: relative;
  border: 3px solid rgba(120, 190, 255, 0.5) !important;
  border-radius: 18px !important;
  background: var(--iv-card) !important;
  box-shadow: inset 0 3px 10px rgba(0, 0, 0, 0.45), 0 3px 0 #061a38 !important;
}
body #player-info-modal .pi-shell.is-me .pi-equipment-info-card{
  border: 3px solid rgba(120, 190, 255, 0.5) !important;
  border-radius: 16px !important;
  background: var(--iv-card) !important;
  box-shadow: inset 0 3px 10px rgba(0, 0, 0, 0.45), 0 3px 0 #061a38 !important;
}

/* ---- wooden signs (the markup has empty heading hosts; the text is CSS) ---- */
body #player-info-modal .pi-shell.is-me .pi-inventory-card > .pi-section-head,
body #player-info-modal .pi-shell.is-me .pi-equipment-card > .pi-section-title{
  position: absolute !important;
  top: -22px;
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  z-index: 4;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 5px 34px 7px !important;
  border: 3px solid #4a2a10 !important;
  border-radius: 12px !important;
  background: var(--iv-grain), var(--iv-wood) !important;
  box-shadow: 0 4px 0 #2a1608, 0 6px 10px rgba(0, 0, 0, 0.45), inset 0 2px 0 rgba(255, 224, 170, 0.5) !important;
  pointer-events: none;
  white-space: nowrap;
}
body #player-info-modal .pi-shell.is-me .pi-inventory-card > .pi-section-head > *{ display: none; }
body #player-info-modal .pi-shell.is-me .pi-inventory-card > .pi-section-head::after,
body #player-info-modal .pi-shell.is-me .pi-equipment-card > .pi-section-title::after{
  display: block;
  color: #fff;
  font: 900 clamp(16px, 2vw, 24px)/1.1 Georgia, "Times New Roman", serif;
  letter-spacing: 0.04em;
  text-transform: none;
  -webkit-text-stroke: 5px #0a1c3c;
  paint-order: stroke fill;
  text-shadow: 0 3px 0 rgba(10, 28, 60, 0.9);
}
body #player-info-modal .pi-shell.is-me .pi-inventory-card > .pi-section-head::after{ content: "Inventory"; }
body #player-info-modal .pi-shell.is-me .pi-equipment-card > .pi-section-title::after{ content: "Equipment"; }
body #player-info-modal .pi-shell.is-me .pi-inventory-card{ padding-top: 28px !important; }
body #player-info-modal .pi-shell.is-me .pi-equipment-card{ padding-top: 24px !important; }

/* ---- category tabs ---- */
body #player-info-modal .pi-shell.is-me .pi-tab{
  border: 3px solid #0b2c5e !important;
  border-radius: 14px !important;
  background: var(--iv-btn) !important;
  box-shadow: 0 3px 0 #061a38, inset 0 2px 0 rgba(255, 255, 255, 0.25) !important;
  color: #fff !important;
  font-family: Georgia, serif !important;
  font-weight: 900 !important;
  text-shadow: 0 2px 0 rgba(0, 20, 60, 0.85);
  transition: filter 120ms ease, transform 120ms ease;
}
body #player-info-modal .pi-shell.is-me .pi-tab:hover{ filter: brightness(1.15); transform: translateY(-1px); }
body #player-info-modal .pi-shell.is-me .pi-tab.is-active{
  background: var(--iv-btn-on) !important;
  box-shadow: 0 3px 0 #061a38, 0 0 0 2px #8fd2ff, inset 0 3px 0 rgba(255, 255, 255, 0.45) !important;
}

/* ---- item slots ---- */
body #player-info-modal .pi-shell.is-me .pi-inventory-grid{
  border: 3px solid rgba(120, 190, 255, 0.35);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(4, 14, 32, 0.78), rgba(6, 20, 42, 0.62));
  scrollbar-color: #2f93ff rgba(0, 0, 0, 0.25);
  scrollbar-width: thin;
}
body #player-info-modal .pi-shell.is-me .pi-inventory-chip{
  border: 3px solid rgba(120, 150, 200, 0.55) !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg, #15264e, #0a1431) !important;
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.4), 0 3px 0 #061a38 !important;
  transition: transform 120ms ease, filter 120ms ease;
}
body #player-info-modal .pi-shell.is-me .pi-inventory-chip:not(.is-empty):hover{ filter: brightness(1.18); transform: translateY(-2px); }
body #player-info-modal .pi-shell.is-me .pi-inventory-chip.is-active,
body #player-info-modal .pi-shell.is-me .pi-inventory-chip.is-held{
  border-color: #ffffff !important;
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.4), 0 3px 0 #061a38, 0 0 12px rgba(255, 255, 255, 0.55) !important;
}
body #player-info-modal .pi-shell.is-me .pi-inventory-chip.is-empty{ opacity: 0.55; }
body #player-info-modal .pi-shell.is-me .pi-inventory-qty{
  color: #fff !important;
  font-family: Georgia, serif !important;
  font-weight: 900 !important;
  -webkit-text-stroke: 3px #0a1c3c;
  paint-order: stroke fill;
}
body #player-info-modal .pi-shell.is-me .pi-inventory-foot{ color: #cfe9ff; font-weight: 800; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.6); }

/* ---- menu buttons (Exit / Respawn / Craft / Settings) ---- */
body #player-info-modal .pi-shell.is-me .pi-game-menu-card{
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
body #player-info-modal .pi-shell.is-me .pi-menu-btn{
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border: 3px solid #0b2c5e !important;
  border-radius: 14px !important;
  background: var(--iv-btn-on) !important;
  box-shadow: 0 4px 0 #061a38, inset 0 3px 0 rgba(255, 255, 255, 0.4) !important;
  color: #fff !important;
  font-family: Georgia, serif;
  transition: filter 120ms ease, transform 120ms ease;
}
body #player-info-modal .pi-shell.is-me .pi-menu-btn::after{
  font: 900 9px/1 Georgia, serif;
  letter-spacing: 0;
  text-transform: none;
  text-shadow: 0 2px 0 rgba(0, 20, 60, 0.85);
}
body #player-info-modal .pi-shell.is-me .pi-menu-btn-exit::after{ content: "Exit"; }
body #player-info-modal .pi-shell.is-me .pi-menu-btn-respawn::after{ content: "Respawn"; }
body #player-info-modal .pi-shell.is-me .pi-menu-btn-craft::after{ content: "Craft"; }
body #player-info-modal .pi-shell.is-me .pi-menu-btn-settings::after{ content: "Settings"; }
body #player-info-modal .pi-shell.is-me .pi-menu-btn-exit{
  border-color: #5a1210 !important;
  background: linear-gradient(180deg, #ff6a5c 0%, #d3201a 52%, #a31410 100%) !important;
  box-shadow: 0 4px 0 #3a0a08, inset 0 3px 0 rgba(255, 255, 255, 0.4) !important;
}
body #player-info-modal .pi-shell.is-me .pi-menu-btn:hover{ filter: brightness(1.12); transform: translateY(-1px); }
body #player-info-modal .pi-shell.is-me .pi-menu-btn:active{ transform: translateY(3px); }

/* ---- name / level block + boosts ---- */
body #player-info-modal .pi-shell.is-me .pi-avatar-hero{ color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.7); font-family: Georgia, serif; }
body #player-info-modal .pi-shell.is-me .pi-boost-item{
  border: 2px solid rgba(120, 190, 255, 0.4);
  border-radius: 12px;
  background: rgba(3, 14, 32, 0.7);
  color: #fff;
  font-family: Georgia, serif;
  font-weight: 900;
}

/* ---- hotbar editor ---- */
body #player-info-modal .pi-shell.is-me .pi-hotbar-slot{
  border: 3px solid rgba(120, 150, 200, 0.55) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, #15264e, #0a1431) !important;
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.4), 0 3px 0 #061a38 !important;
}
body #player-info-modal .pi-shell.is-me .pi-hotbar-slot.is-active{ border-color: #fff !important; box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.4), 0 3px 0 #061a38, 0 0 10px rgba(255, 255, 255, 0.5) !important; }

@media (max-width: 720px){
  body #player-info-modal .pi-shell.is-me .pi-board{ padding-top: 28px; gap: 28px; }
  body #player-info-modal .pi-shell.is-me .pi-inventory-card > .pi-section-head,
  body #player-info-modal .pi-shell.is-me .pi-equipment-card > .pi-section-title{ top: -19px; padding: 4px 24px 6px !important; }
  body #player-info-modal .pi-shell.is-me .pi-inventory-card > .pi-section-head::after,
  body #player-info-modal .pi-shell.is-me .pi-equipment-card > .pi-section-title::after{ font-size: 16px; -webkit-text-stroke-width: 4px; }
}
@media (prefers-reduced-motion: reduce){
  body #player-info-modal .pi-shell.is-me .pi-tab, body #player-info-modal .pi-shell.is-me .pi-inventory-chip, body #player-info-modal .pi-shell.is-me .pi-menu-btn{ transition: none; }
}