/* Ninja UI - SAFE master (nao invadir HUD/missoes nativos do React) */
@import url("variables.css");
@import url("reset.css");
@import url("base.css");
@import url("components.css");
@import url("animations.css");
@import url("loot.css");
@import url("wiki.css");
@import url("profile.css");
/* DESATIVADO de proposito (quebrava o jogo nativo):
   layout.css / missions.css / hunts.css / responsive.css
   Esses arquivos sobrescreviam .mission-card, .missions-overlay e _topHud_
*/

/* Typography and icon cleanup */
html, body, #root,
#root input, #root select, #root textarea,
#root button, #root label, #root p, #root span, #root div {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
  font-synthesis: none;
}

#root h1, #root h2, #root h3,
[class*="_title_"], [class*="_headerTitle_"],
.equipment-modal__header h2,
.inventory-modal__header h2 {
  font-family: "NinjaTitle", Georgia, serif !important;
  letter-spacing: .04em !important;
}

.equipment-modal,
.equipment-modal button,
.equipment-modal .slot-label,
.equipment-modal__stats,
.equipment-modal__stats h3,
.equipment-tooltip,
.inventory-modal,
.inventory-modal button {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
}

.equipment-modal__header h2,
.equipment-modal__stats h3 {
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
}

.equipment-modal__stats {
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.equipment-modal__stats strong,
.equipment-modal__stats b {
  font-weight: 700 !important;
}

.equipment-slot,
.inventory-item {
  font-family: "Segoe UI Emoji", "Noto Color Emoji", "Apple Color Emoji", "Segoe UI", sans-serif !important;
}

.equipment-slot .item-icon,
.inventory-item .item-icon,
.equipment-slot img,
.inventory-item img {
  font-family: "Segoe UI Emoji", "Noto Color Emoji", "Apple Color Emoji", sans-serif !important;
  font-size: 25px !important;
  line-height: 1 !important;
  text-align: center !important;
  image-rendering: auto !important;
}

.equipment-slot .slot-label {
  font-size: 8px !important;
  letter-spacing: .04em !important;
  white-space: nowrap !important;
}

.equipment-modal__inventory,
.equipment-modal__paperdoll {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
}
/* ===== NOVA REFORMA VISUAL - HUD E EQUIPAMENTOS ===== */
#root, #root * {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
  font-synthesis: none !important;
}

#root h1, #root h2, #root h3,
#root [class*="title"], #root [class*="Title"],
.equipment-modal__header h2,
.inventory-modal__header h2,
.shop-title {
  font-family: "NinjaTitle", Georgia, serif !important;
  font-weight: 700 !important;
}

/* Barra superior */
[class*="_topHud_"] {
  height: 58px !important;
  grid-template-columns: 210px minmax(0, 1fr) 112px !important;
  background: linear-gradient(180deg, #17191c 0%, #0d0f12 100%) !important;
  border-bottom: 2px solid #a8792d !important;
  box-shadow: 0 4px 18px #000b !important;
}
[class*="_topHudMenuButton_"] {
  min-width: 78px !important;
  width: auto !important;
  padding: 2px 9px !important;
  background: transparent !important;
  border-right: 1px solid #3b3020 !important;
}
[class*="_topHudMenuLabel_"] {
  font-size: 10px !important;
  letter-spacing: .3px !important;
  white-space: nowrap !important;
}
[class*="_topHudMenuIcon_"] {
  width: 25px !important;
  height: 25px !important;
}
[class*="_topHudCurrencyLabel_"],
[class*="_topHudCurrencyValue_"] {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
  font-size: 14px !important;
  letter-spacing: .2px !important;
}

/* Area lateral */
[class*="_leftPanelArea_"] {
  width: 300px !important;
  zoom: .86 !important;
  top: 66px !important;
  left: 8px !important;
  gap: 8px !important;
}
[class*="_characterPanel_"] {
  width: 300px !important;
  height: 270px !important;
}
[class*="_characterPanel_"] [class*="_name_"] {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
  font-size: 16px !important;
}
[class*="_characterPanel_"] [class*="_characterClass_"],
[class*="_characterPanel_"] [class*="_level_"],
[class*="_characterPanel_"] [class*="_statLabel_"],
[class*="_characterPanel_"] [class*="_statBarText_"] {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
}

/* Modal de equipamentos */
.equipment-overlay {
  background: rgba(3, 5, 7, .78) !important;
  backdrop-filter: blur(3px) !important;
}
.equipment-modal {
  width: min(920px, calc(100vw - 34px)) !important;
  height: min(620px, calc(100vh - 88px)) !important;
  max-width: none !important;
  max-height: none !important;
  color: #e8e1d4 !important;
  background: linear-gradient(135deg, #171a1e, #0d0f12) !important;
  border: 1px solid #a8792d !important;
  border-radius: 6px !important;
  box-shadow: 0 18px 55px #000e, inset 0 0 0 1px #ffffff0b !important;
}
.equipment-modal__header {
  min-height: 54px !important;
  padding: 10px 18px !important;
  background: linear-gradient(90deg, #23272c, #15181c) !important;
  border-bottom: 1px solid #624a27 !important;
}
.equipment-modal__header h2 {
  color: #efc15b !important;
  font-size: 20px !important;
  letter-spacing: .12em !important;
}
.equipment-modal__close {
  color: #bca577 !important;
  font-family: "Segoe UI", sans-serif !important;
  font-size: 24px !important;
}
.equipment-modal__body {
  display: grid !important;
  grid-template-columns: 252px minmax(250px, 1fr) 238px !important;
  min-height: 0 !important;
}
.equipment-modal__paperdoll {
  width: auto !important;
  padding: 18px !important;
  gap: 10px !important;
  background: linear-gradient(180deg, #111418, #0a0c0f) !important;
  border-right: 1px solid #3d3325 !important;
}
.equipment-slot {
  width: 58px !important;
  height: 58px !important;
  background: linear-gradient(145deg, #252a2e, #15181b) !important;
  border: 1px solid #4c5255 !important;
  box-shadow: inset 0 0 0 1px #ffffff08, 0 2px 5px #0008 !important;
}
.equipment-slot:hover {
  background: linear-gradient(145deg, #44351e, #1d1810) !important;
  border-color: #d0a64c !important;
  box-shadow: 0 0 14px #c58b4333 !important;
}
.equipment-slot .slot-label {
  color: #8b918f !important;
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
  font-size: 8px !important;
  letter-spacing: .08em !important;
}
.equipment-slot .item-icon {
  font-size: 0 !important;
  color: transparent !important;
}
.equipment-slot .item-icon img {
  display: block !important;
  width: 38px !important;
  height: 38px !important;
  object-fit: contain !important;
}
.equipment-modal__inventory {
  align-content: flex-start !important;
  gap: 10px !important;
  padding: 18px !important;
  background: #0d1013 !important;
}
.inventory-item {
  width: 58px !important;
  height: 58px !important;
  background: linear-gradient(145deg, #24292d, #15181b) !important;
  border: 1px solid #444b50 !important;
}
.inventory-item .item-icon {
  font-size: 0 !important;
  color: transparent !important;
}
.inventory-item .item-icon img {
  display: block !important;
  width: 38px !important;
  height: 38px !important;
  object-fit: contain !important;
}
.equipment-modal__stats {
  width: auto !important;
  padding: 18px !important;
  background: linear-gradient(180deg, #15181b, #0c0e10) !important;
  border-left: 1px solid #3d3325 !important;
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
}
.equipment-modal__stats h3 {
  color: #efc15b !important;
  font-family: "NinjaTitle", Georgia, serif !important;
  font-size: 15px !important;
  letter-spacing: .1em !important;
}
.stat-row {
  margin-bottom: 8px !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
}
.stat-label { color: #a9adaf !important; }
.stat-value { color: #f3eee3 !important; font-weight: 700 !important; }

@media (max-width: 900px) {
  .equipment-modal__body { grid-template-columns: 210px minmax(180px, 1fr) 190px !important; }
  .equipment-modal__paperdoll { padding: 12px !important; }
  .equipment-slot, .inventory-item { width: 50px !important; height: 50px !important; }
}