/* =============================================================================
   Vinvictus Theme v2.0.0 - Armory Module Styles
   ============================================================================= */

:root {
  /* Armory-specific spacing */
  --armory-padding-sm: 0.5rem;
  --armory-padding-md: 1rem;
  --armory-padding-lg: 1.5rem;
  --armory-padding-xl: 2rem;
  --armory-margin-sm: 0.5rem;
  --armory-margin-md: 1rem;
  --armory-margin-lg: 1.5rem;
  --armory-margin-xl: 2rem;

  /* Typography */
  --armory-font-size-xs: 0.5rem;
  --armory-font-size-sm: 0.8rem;
  --armory-font-size-base: 1rem;
  --armory-font-size-md: 1.2rem;
  --armory-font-size-lg: 1.4rem;
  --armory-font-weight-normal: 400;
  --armory-font-weight-semibold: 600;
  --armory-line-height: 1.5;

  /* Icon sizes */
  --armory-icon-xs: 1rem;
  --armory-icon-sm: 2rem;
  --armory-icon-md: 4rem;
  --armory-icon-lg: 6rem;

  /* Table dimensions */
  --armory-table-row-height: 3rem;
  --armory-table-row-height-sm: 2.8rem;
  --armory-table-cell-padding: 0.3rem 0.6rem;
  --armory-table-cell-padding-sm: 0.3rem 0.25rem;

  /* Borders and radius */
  --armory-border-radius: 0.5rem;
  --armory-border-radius-sm: 0.25rem;

  /* Transitions */
  --armory-transition-fast: 0.2s ease-in-out;
  --armory-transition-standard: 0.3s ease-in-out;

  /* Button dimensions */
  --armory-btn-padding: 0.5rem 1rem;
  --armory-btn-border-width: 0.3rem;

  /* Quality colors */
  --quality-poor: #9d9d9d;
  --quality-common: #ffffff;
  --quality-uncommon: #1eff00;
  --quality-rare: #0070dd;
  --quality-epic: #a335ee;
  --quality-legendary: #ff8000;
  --quality-artifact: #e6cc80;
  --quality-heirloom: #00ccff;

  /* Class colors */
  --class-warrior: #c79c6e;
  --class-paladin: #f58cba;
  --class-hunter: #abd473;
  --class-rogue: #fff569;
  --class-priest: #ffffff;
  --class-death-knight: #c41f3b;
  --class-shaman: #0070de;
  --class-mage: #40c7eb;
  --class-warlock: #8787ed;
  --class-druid: #ff7d0a;

  /* Faction colors */
  --faction-alliance: #0078ff;
  --faction-horde: #ff0000;
  --faction-neutral: #ffcc00;
}

/* Search Forms */
.page-subbody {
  margin-bottom: var(--armory-margin-xl);
  background: var(--bg-darker);
  padding: var(--armory-padding-lg);
}

.page-subbody .form-control,
.page-subbody select {
  transition: border-color var(--armory-transition-fast);
  border: 1px solid var(--border-light);
  background: var(--bg-dark);
  color: var(--color-white);
  font-size: var(--armory-font-size-base);
  font-family: 'Poppins', sans-serif;
}

.page-subbody .form-control:focus,
.page-subbody select:focus {
  outline: none;
  border-color: var(--border-primary);
  background: var(--bg-dark);
  color: var(--color-white);
}

.page-subbody .form-control::placeholder {
  color: var(--color-grey);
}

.page-subbody select option {
  background: var(--bg-dark);
  color: var(--color-white);
}

.page-subbody .nice_button {
  transition: all var(--armory-transition-standard);
  cursor: pointer;
  box-shadow: none;
  border-bottom: var(--armory-btn-border-width) solid var(--btn-primary-border-bottom);
  border: none;
  border-radius: var(--armory-border-radius);
  background-color: var(--btn-primary);
  padding: var(--armory-btn-padding);
  color: var(--btn-txt-dark);
  font-style: normal;
  font-weight: var(--armory-font-weight-semibold);
  font-size: var(--armory-font-size-md);
  font-family: 'Poppins', sans-serif;
  text-shadow: none;
  text-transform: uppercase;
}

.page-subbody .nice_button:hover {
  border-bottom: var(--armory-btn-border-width) solid var(--btn-secondary-border-bottom);
  background-color: var(--btn-secondary);
  color: var(--btn-txt-dark);
}

/* Search Results */
#search_box {
  border: 1px solid var(--border-light);
  background: var(--bg-darker);
  padding: var(--armory-padding-md);
}

.item-icon,
.item-icon-placeholder {
  display: inline-block;
  vertical-align: middle;
  margin-right: 0.5rem;
  width: var(--armory-icon-md);
  height: var(--armory-icon-md);
}

.item-icon img {
  vertical-align: middle;
  border-radius: var(--armory-border-radius-sm);
  image-rendering: auto;
  aspect-ratio: 1 / 1;
  width: var(--armory-icon-md);
  height: var(--armory-icon-md);
  object-fit: contain;
  -ms-interpolation-mode: bicubic;
}

.item-icon .fa-spinner {
  color: var(--color-grey);
  font-size: var(--armory-font-size-md);
}

/* Tables */
.nice_table {
  border-collapse: collapse;
  background: var(--bg-darker);
  width: 100%;
  font-size: var(--armory-font-size-base);
  font-family: 'Poppins', sans-serif;
}

.nice_table thead th {
  border-bottom: 1px solid var(--border-light);
  background: var(--bg-dark);
  padding: var(--armory-table-cell-padding);
  color: var(--color-white);
  font-style: normal;
  font-weight: var(--armory-font-weight-semibold);
  font-size: var(--armory-font-size-sm);
  font-family: 'Poppins', sans-serif;
  text-align: left;
  text-transform: uppercase;
}

#search_results_items thead th,
#search_results_characters thead th,
#search_results_guilds thead th {
  background: var(--bg-dark);
  padding: var(--armory-table-cell-padding);
  color: var(--color-white);
  font-style: normal;
  font-weight: var(--armory-font-weight-semibold);
  font-size: var(--armory-font-size-sm);
  font-family: 'Poppins', sans-serif;
  text-transform: uppercase;
}

.nice_table #search_results_items th {
  width: fit-content !important;
}

.nice_table.dataTable tbody tr td,
.nice_table.dataTable thead + tbody tr:first-child td {
  color: var(--color-white) !important;
  font-style: var(--armory-font-weight-normal) !important;
  font-weight: 400 !important;
  font-size: var(--armory-font-size-sm) !important;
  font-family: 'Poppins', sans-serif !important;
}

.nice_table tbody td {
  vertical-align: middle;
  box-sizing: border-box;
  border-bottom: 1px solid var(--border-light);
  background: var(--bg-darker);
  padding: var(--armory-table-cell-padding);
  height: var(--armory-table-row-height);
  color: var(--color-white);
  font-style: normal;
  font-size: var(--armory-font-size-base);
  font-family: 'Poppins', sans-serif;
}

.nice_table tbody tr:hover {
  background: var(--bg-dark);
}

.nice_table tbody tr:hover td {
  background: var(--bg-dark);
  color: var(--bg-primary);
}

.nice_table tbody tr:hover a {
  color: var(--bg-primary);
  text-decoration: none;
}

.nice_table th:first-child,
.nice_table td:first-child {
  padding: var(--armory-padding-sm) !important;
  width: fit-content !important;
  min-width: fit-content !important;
  text-align: left !important;
  vertical-align: middle !important;
}

.nice_table td:first-child img {
  display: block;
  aspect-ratio: 1 / 1 !important;
  width: var(--armory-icon-sm) !important;
  height: var(--armory-icon-sm) !important;
  object-fit: cover !important;
}

.nice_table td:first-child .fa-spinner,
.nice_table td:first-child i {
  display: inline-block;
  text-align: left;
  color: var(--brand-primary);
  font-size: var(--armory-font-size-md);
}

.nice_table td:first-child div {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background: #333;
  width: var(--armory-icon-sm);
  height: var(--armory-icon-sm);
  color: #666;
  font-size: var(--armory-font-size-sm);
}

.nice_table td:first-child span {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  height: var(--armory-icon-sm);
}

/* DataTables */
.dataTables_wrapper {
  background: var(--bg-darker);
  padding: var(--armory-padding-md) 0;
  color: var(--color-white);
  font-family: 'Poppins', sans-serif;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {
  margin: var(--armory-margin-sm) 0;
  color: var(--color-white);
  font-family: 'Poppins', sans-serif;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  transition: all var(--armory-transition-fast);
  margin: 0 0.125rem;
  border: 1px solid var(--border-light);
  border-radius: var(--armory-border-radius-sm);
  background: var(--bg-dark);
  padding: var(--armory-padding-sm) 0.75rem;
  color: var(--color-white);
  font-family: 'Poppins', sans-serif;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: var(--bg-primary);
  color: var(--bg-dark);
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--bg-primary);
  color: var(--bg-dark);
}

.dataTables_empty {
  background: var(--bg-darker);
  padding: var(--armory-padding-xl);
  color: var(--color-grey);
  font-style: italic;
  font-size: var(--armory-font-size-base);
  font-family: 'Poppins', sans-serif;
  text-align: center;
}

.nice_table tbody .dataTables_empty {
  vertical-align: middle;
  padding: var(--armory-padding-xl);
  text-align: center;
}

.no-results-message {
  margin: var(--armory-margin-md) 0;
  border: 1px solid var(--border-light);
  border-radius: var(--armory-border-radius-sm);
  background: var(--bg-darker);
  padding: var(--armory-padding-xl);
  color: var(--color-grey);
  font-style: italic;
  font-size: var(--armory-font-size-base);
  font-family: 'Poppins', sans-serif;
  text-align: center;
}

#search_results_characters_info,
#search_results_items_info,
#search_results_guilds_info {
  display: block;
  visibility: visible;
  margin-top: 0.625rem;
  color: var(--color-grey) !important;
  font-size: var(--armory-font-size-sm) !important;
  text-transform: uppercase !important;
}

/* Character Avatars */
.char-avatar {
  display: block;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0;
  width: var(--armory-icon-sm);
  height: var(--armory-icon-sm);
  pointer-events: none;
}

#search_results_characters img {
  border-radius: var(--armory-border-radius-sm);
  width: var(--armory-icon-lg);
  height: var(--armory-icon-lg);
  object-fit: cover;
}

/* Tooltips and Hover Effects */
.tooltip {
  z-index: 9999;
}

.tooltip .tooltip-inner {
  border: 1px solid var(--border-primary);
  background-color: var(--bg-darker);
  padding: 0.5rem 0.75rem;
  max-width: 18.75rem;
  color: var(--bg-primary);
  font-size: var(--armory-font-size-sm);
  font-family: 'Poppins', sans-serif;
  text-align: center;
}

.nice_table tbody tr {
  border-bottom: 1px solid var(--border-light);
  background: var(--bg-darker);
  height: var(--armory-table-row-height);
}

.nice_table tbody tr td,
.nice_table thead + tbody tr:first-child td {
  padding: var(--armory-table-cell-padding) !important;
}

.nice_table .character-row-hover {
  position: relative;
  transition: background-color var(--armory-transition-fast);
}

.nice_table .character-row-hover:hover {
  cursor: pointer;
  background: rgba(0, 0, 0, 0.3);
}

.nice_table .character-row-hover:hover td {
  background: rgba(0, 0, 0, 0.3);
}

.nice_table thead + tbody::before {
  display: none;
}

/* Character Class Colors */
.color-c1 {
  color: var(--class-warrior);
} /* Warrior */
.color-c2 {
  color: var(--class-paladin);
} /* Paladin */
.color-c3 {
  color: var(--class-hunter);
} /* Hunter */
.color-c4 {
  color: var(--class-rogue);
} /* Rogue */
.color-c5 {
  color: var(--class-priest);
} /* Priest */
.color-c6 {
  color: var(--class-death-knight);
} /* Death Knight */
.color-c7 {
  color: var(--class-shaman);
} /* Shaman */
.color-c8 {
  color: var(--class-mage);
} /* Mage */
.color-c9 {
  color: var(--class-warlock);
} /* Warlock */
.color-c11 {
  color: var(--class-druid);
} /* Druid */

/* Faction Colors */
.faction-1 {
  color: var(--faction-alliance);
} /* Alliance */
.faction-2 {
  color: var(--faction-horde);
} /* Horde */

.faction-text.text-alliance {
  color: var(--faction-alliance);
  font-weight: var(--armory-font-weight-semibold);
  font-size: 0.8125rem;
  letter-spacing: 0.03125rem;
  text-transform: uppercase;
}

.faction-text.text-horde {
  color: var(--faction-horde);
  font-weight: var(--armory-font-weight-semibold);
  font-size: 0.8125rem;
  letter-spacing: 0.03125rem;
  text-transform: uppercase;
}

.faction-text.text-neutral {
  color: var(--faction-neutral);
  font-weight: var(--armory-font-weight-semibold);
  font-size: 0.8125rem;
  letter-spacing: 0.03125rem;
  text-transform: uppercase;
}

.faction-horde {
  color: #dc3545;
  font-weight: var(--armory-font-weight-semibold);
  text-transform: uppercase;
}

.faction-alliance {
  color: #0d6efd;
  font-weight: var(--armory-font-weight-semibold);
  text-transform: uppercase;
}

/* Item Quality Colors */
.nice_table .q0,
.nice_table .q0 a {
  color: var(--quality-poor);
}
.nice_table .q1,
.nice_table .q1 a {
  color: var(--quality-common);
}
.nice_table .q2,
.nice_table .q2 a {
  color: var(--quality-uncommon);
}
.nice_table .q3,
.nice_table .q3 a {
  color: var(--quality-rare);
}
.nice_table .q4,
.nice_table .q4 a {
  color: var(--quality-epic);
}
.nice_table .q5,
.nice_table .q5 a {
  color: var(--quality-legendary);
}
.nice_table .q6,
.nice_table .q6 a {
  color: var(--quality-artifact);
}
.nice_table .q7,
.nice_table .q7 a {
  color: var(--quality-heirloom);
}

.nice_table .q0,
.nice_table .q0 a,
.nice_table .q1,
.nice_table .q1 a,
.nice_table .q2,
.nice_table .q2 a,
.nice_table .q3,
.nice_table .q3 a,
.nice_table .q4,
.nice_table .q4 a,
.nice_table .q5,
.nice_table .q5 a,
.nice_table .q6,
.nice_table .q6 a,
.nice_table .q7,
.nice_table .q7 a {
  font-style: var(--armory-font-weight-normal) !important;
  font-size: var(--armory-font-size-sm) !important;
  font-family: 'Poppins', sans-serif !important;
}

/* Character Class Colors (Table Context) */
.nice_table .class-1,
.nice_table .class-1 a,
.nice_table .class-2,
.nice_table .class-2 a,
.nice_table .class-3,
.nice_table .class-3 a,
.nice_table .class-4,
.nice_table .class-4 a,
.nice_table .class-5,
.nice_table .class-5 a,
.nice_table .class-6,
.nice_table .class-6 a,
.nice_table .class-7,
.nice_table .class-7 a,
.nice_table .class-8,
.nice_table .class-8 a,
.nice_table .class-9,
.nice_table .class-9 a,
.nice_table .class-11,
.nice_table .class-11 a {
  color: var(--color-white);
  font-style: normal;
  font-size: var(--armory-font-size-base);
  font-family: 'Poppins', sans-serif;
}

.nice_table .faction-1,
.nice_table .faction-1 a,
.nice_table .faction-2,
.nice_table .faction-2 a {
  color: var(--color-white);
  font-style: normal;
  font-size: var(--armory-font-size-base);
  font-family: 'Poppins', sans-serif;
}

/* Responsive Design */
@media (max-width: 768px) {
  .page-subbody .input-group {
    flex-direction: column;
    gap: var(--armory-margin-md);
  }

  .page-subbody .form-control,
  .page-subbody select,
  .page-subbody .nice_button {
    margin: 0;
    width: 100%;
  }

  .nice_table {
    font-size: var(--armory-font-size-sm);
  }

  .nice_table thead th {
    padding: 0.75rem 0.5rem;
    font-size: var(--armory-font-size-xs);
  }

  .nice_table tbody td {
    padding: 0.75rem 0.5rem;
    height: var(--armory-table-row-height);
    font-size: var(--armory-font-size-sm);
  }

  .nice_table tbody td:first-child {
    padding: 0.25rem;
    width: fit-content;
    min-width: fit-content;
  }

  .nice_table tbody td:first-child img,
  .nice_table tbody td:first-child div {
    width: var(--armory-icon-md);
    height: var(--armory-icon-md);
  }

  #search_box {
    padding: var(--armory-padding-sm);
  }
}

@media (max-width: 576px) {
  .nice_table thead th {
    padding: var(--armory-padding-sm) 0.25rem;
    font-size: var(--armory-font-size-xs);
  }

  .nice_table tbody td {
    padding: var(--armory-padding-sm) 0.25rem;
    height: var(--armory-table-row-height-sm);
    font-size: var(--armory-font-size-xs);
  }

  .nice_table tbody td:first-child {
    padding: 0.25rem;
    width: fit-content;
    min-width: fit-content;
  }

  .nice_table tbody td:first-child img,
  .nice_table tbody td:first-child div {
    width: var(--armory-icon-sm);
    height: var(--armory-icon-sm);
  }
}