Files
NightSpire/web-next/app/armory.css
T
Inna beba7301a1 Armería: PvP campos de batalla, logros por categoría, bandas/mazmorras y página de hermandad
- PvP: pestaña Campos de batalla (pvpstats) con resultado, stats por partida y fecha/hora.
- Logros: rejilla por categoría con anillos de progreso + detalle por categoría
  (datos de Achievement.db2 + Achievement_Category.db2, iconos vía wowhead).
- Bandas: progreso por dificultad (10/25/heroico) con jefes reales de DungeonEncounter.db2
  y tooltip de jefes; agrupado por expansión (Clásico/TBC/WotLK).
- Mazmorras: mismo sistema, Normal + Heroico, Clásico/TBC/WotLK.
- Página de hermandad estilo armería: cabecera (emblema, puntos = unión de logros de
  miembros sin duplicar, nº miembros, fundada), pestañas Hermandad/Logros, roster con
  iconos de clase/raza, columna Función (rol por spec), filtros clase/función,
  orden por rango/puntos/nivel de objeto/nivel/nombre, paginación.
- Barra lateral: mensaje diario con login (iron-session, gated por pertenencia),
  logros recientes y desgloses de clases y funciones.
- Cabecera de personaje: enlace a la hermandad + nombre del reino.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-17 01:18:30 +00:00

852 lines
50 KiB
CSS

/* Estilos de la armería, en la línea del tema (oscuro + dorado #d79602). Reutiliza
main-wide, nice_button, forum-input y los colores de calidad qN de forum.css. */
.armory-search { position: relative; margin: 10px 0 18px; }
.armory-search-form { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.armory-search .forum-input { flex: 1 1 260px; margin: 0; }
/* Desplegable de autocompletar (tipo wowhead) */
.armory-suggest {
position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 50; max-height: 420px; overflow-y: auto;
background: #14110d; border: 1px solid #2a2723; border-radius: 4px;
box-shadow: 0 8px 24px rgba(0, 0, 0, .6);
}
.armory-suggest-group { border-bottom: 1px solid #201d18; }
.armory-suggest-group:last-child { border-bottom: 0; }
.armory-suggest-head {
font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: #6d6a5e; font-weight: bold;
padding: 6px 12px; background: rgba(255, 255, 255, .02);
}
.armory-suggest-item {
display: flex; justify-content: space-between; align-items: center; gap: 10px; width: 100%;
padding: 8px 12px; background: none; border: 0; cursor: pointer; text-align: left; text-decoration: none;
font-size: 13px; font-weight: bold; color: #d4cdbb; transition: background .1s;
}
.armory-suggest-item:hover { background: rgba(255, 255, 255, .05); }
.armory-suggest-sub { font-size: 11px; color: #6d6a5e; font-weight: normal; white-space: nowrap; }
.armory-tabs { display: flex; gap: 6px; border-bottom: 1px solid #2a2723; margin-bottom: 16px; flex-wrap: wrap; }
.armory-tab {
padding: 8px 16px; color: #8a8578; text-decoration: none; font-weight: bold; text-transform: uppercase;
font-size: 13px; border-bottom: 2px solid transparent; transition: all .15s;
}
.armory-tab:hover { color: #d79602; }
.armory-tab.active { color: #d79602; border-bottom-color: #d79602; }
.armory-hint { color: #6d6a5e; text-align: center; padding: 24px 0; }
.armory-list { display: flex; flex-direction: column; gap: 6px; }
.armory-row {
display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
padding: 10px 14px; border-radius: 3px; text-decoration: none;
background: rgba(0, 0, 0, .18); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03);
transition: background .15s;
}
a.armory-row:hover { background: rgba(255, 255, 255, .05); }
.armory-name { font-weight: bold; font-size: 14px; color: #d4cdbb; text-decoration: none; }
a.armory-name:hover { text-decoration: underline; }
.armory-meta { font-size: 12px; color: #6d6a5e; }
/* Ficha de personaje: dos columnas (modelo 3D | equipo). */
.armory-char { display: flex; gap: 20px; flex-wrap: wrap; align-items: flex-start; }
.armory-char-left { flex: 1 1 320px; }
.armory-char-right { flex: 1 1 320px; }
.armory-char-name { font-size: 28px; font-weight: bold; margin: 0; }
.armory-char-sub { color: #8a8578; font-size: 14px; margin: 6px 0 10px; }
.armory-char-tags { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.armory-faction { font-size: 11px; text-transform: uppercase; font-weight: bold; padding: 2px 8px; border-radius: 3px; }
.armory-faction.alliance { color: #4a90d9; background: rgba(74, 144, 217, .12); }
.armory-faction.horde { color: #cc3038; background: rgba(204, 48, 56, .12); }
.armory-status { font-size: 11px; text-transform: uppercase; font-weight: bold; }
.armory-status.online { color: #1eff00; }
.armory-status.offline { color: #6d6a5e; }
.armory-guild-tag { color: #8a8578; font-size: 13px; text-decoration: none; }
.armory-guild-tag:hover { color: #d79602; }
.armory-section-title { font-size: 15px; text-transform: uppercase; color: #8a8578; margin: 0 0 12px; }
.armory-equip { display: flex; flex-direction: column; gap: 4px; }
.armory-equip-slot {
display: flex; justify-content: space-between; align-items: center; gap: 10px;
padding: 7px 12px; border-radius: 3px; background: rgba(0, 0, 0, .18);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03);
}
.armory-equip-slot.empty { opacity: .45; }
.armory-item { font-weight: bold; font-size: 13px; text-decoration: none; }
.armory-item:hover { text-decoration: none; }
.armory-slot-name { font-size: 11px; color: #6d6a5e; text-align: right; white-space: nowrap; }
/* Visor 3D */
.armory-model {
margin-top: 8px; border-radius: 3px; overflow: hidden; background: rgba(0, 0, 0, .3);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03);
}
.armory-model-canvas { width: 100%; height: 420px; }
.armory-model .armory-hint { padding: 12px; }
@media (max-width: 767px) {
.armory-model-canvas { height: 320px; }
}
/* ===== Ficha de personaje estilo paperdoll (rediseño nemesis, tema NightSpire) ===== */
.armory-sheet { display: flex; flex-direction: column; gap: 20px; }
.armory-sheet-head { }
/* Paperdoll: equipo izq · modelo 3D · equipo der */
.armory-paperdoll {
display: grid; grid-template-columns: 1fr minmax(300px, 1.15fr) 1fr; gap: 14px; align-items: start;
}
.armory-gear-col { display: flex; flex-direction: column; gap: 6px; }
.armory-model-col { display: flex; flex-direction: column; gap: 10px; }
.armory-weapons { display: flex; gap: 6px; }
.armory-weapons .armory-cell { flex: 1 1 0; }
/* Celda de equipo */
.armory-cell {
display: flex; align-items: center; gap: 9px; padding: 6px 9px; border-radius: 3px; min-height: 46px;
background: rgba(0, 0, 0, .22); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03);
text-decoration: none; transition: background .12s;
}
a.armory-cell:hover { background: rgba(255, 255, 255, .06); }
.armory-cell.empty { opacity: .4; }
.armory-cell-icon {
width: 36px; height: 36px; flex: 0 0 36px; border-radius: 3px;
background: #0d0b08 center/cover no-repeat; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07);
}
.armory-cell-icon.q1 { box-shadow: inset 0 0 0 1px #9d9d9d; }
.armory-cell-icon.q2 { box-shadow: inset 0 0 0 1px #1eff00; }
.armory-cell-icon.q3 { box-shadow: inset 0 0 0 1px #0070dd; }
.armory-cell-icon.q4 { box-shadow: inset 0 0 0 1px #a335ee; }
.armory-cell-icon.q5 { box-shadow: inset 0 0 0 1px #ff8000; }
.armory-cell-icon.q6 { box-shadow: inset 0 0 0 1px #e6cc80; }
.armory-cell-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.armory-cell-name {
font-size: 12px; font-weight: bold; line-height: 1.25; text-decoration: none;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.armory-cell-meta { display: flex; gap: 8px; align-items: center; }
.armory-cell-ilvl { font-size: 11px; color: #d79602; font-weight: bold; }
.armory-cell-slot { font-size: 10px; color: #6d6a5e; text-transform: uppercase; letter-spacing: .03em; }
/* Paneles inferiores: stats + profesiones */
.armory-panels { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; }
.armory-panel {
background: rgba(0, 0, 0, .18); border-radius: 4px; padding: 14px 16px;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03);
}
.armory-stats-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px 20px; }
.armory-stat {
display: flex; justify-content: space-between; gap: 10px; padding: 5px 0;
border-bottom: 1px solid rgba(255, 255, 255, .03);
}
.armory-stat-label { font-size: 12px; color: #8a8578; }
.armory-stat-value { font-size: 13px; font-weight: bold; color: #d4cdbb; }
.armory-stats-pending { text-align: left; padding: 8px 0; color: #8a8578; }
.armory-prof-list { display: flex; flex-direction: column; gap: 7px; }
.armory-prof { display: flex; justify-content: space-between; gap: 10px; }
.armory-prof-name { font-size: 13px; color: #d4cdbb; }
.armory-prof-value { font-size: 13px; font-weight: bold; color: #d79602; }
.armory-prof-max { color: #6d6a5e; font-weight: normal; }
@media (max-width: 900px) {
.armory-paperdoll { grid-template-columns: 1fr; }
.armory-panels { grid-template-columns: 1fr; }
}
/* ===== Paperdoll de iconos (override: tiles solo-icono alrededor del modelo) ===== */
.armory-paperdoll {
display: grid; grid-template-columns: auto minmax(280px, 1fr) auto; gap: 18px;
align-items: start; justify-items: center;
}
.armory-slots-col { display: flex; flex-direction: column; gap: 9px; }
.armory-slot {
width: 58px; height: 58px; border-radius: 5px; display: block;
background: #0d0b08 center/cover no-repeat; box-shadow: inset 0 0 0 2px #3a352c;
}
.armory-slot.empty { box-shadow: inset 0 0 0 2px #29251e; opacity: .5; }
a.armory-slot { transition: transform .1s; }
a.armory-slot:hover { transform: scale(1.06); }
.armory-slot.q1 { box-shadow: inset 0 0 0 2px #9d9d9d, 0 0 6px rgba(157, 157, 157, .4); }
.armory-slot.q2 { box-shadow: inset 0 0 0 2px #1eff00, 0 0 6px rgba(30, 255, 0, .35); }
.armory-slot.q3 { box-shadow: inset 0 0 0 2px #0070dd, 0 0 6px rgba(0, 112, 221, .4); }
.armory-slot.q4 { box-shadow: inset 0 0 0 2px #a335ee, 0 0 7px rgba(163, 53, 238, .45); }
.armory-slot.q5 { box-shadow: inset 0 0 0 2px #ff8000, 0 0 7px rgba(255, 128, 0, .45); }
.armory-slot.q6 { box-shadow: inset 0 0 0 2px #e6cc80, 0 0 8px rgba(230, 204, 128, .5); }
.armory-center { display: flex; flex-direction: column; gap: 10px; width: 100%; max-width: 460px; }
.armory-center .armory-model { margin-top: 0; }
.armory-weapons { display: flex; gap: 10px; justify-content: center; }
.armory-bars { display: flex; justify-content: space-between; padding: 4px 6px; font-size: 15px; }
.armory-bar { color: #8a8578; }
.armory-bar.health b { color: #ff5555; }
.armory-bar.mana b { color: #4a90d9; }
@media (max-width: 900px) {
.armory-paperdoll { display: flex; flex-direction: column; align-items: center; }
.armory-slots-col { flex-direction: row; flex-wrap: wrap; justify-content: center; }
.armory-center { order: -1; }
}
/* ===== Barra de herramientas del paperdoll (toggles MH/OH + vista modelo/lista) ===== */
.armory-doll-wrap { display: flex; flex-direction: column; gap: 12px; }
.armory-toolbar { display: flex; gap: 8px; align-items: center; justify-content: flex-end; }
.armory-toggle {
font-size: 11px; font-weight: bold; letter-spacing: .03em; padding: 5px 10px; border-radius: 3px;
border: 1px solid #2a2723; background: rgba(0, 0, 0, .25); color: #6d6a5e; cursor: pointer; transition: all .12s;
}
.armory-toggle.on { color: #1eff00; border-color: rgba(30, 255, 0, .35); }
.armory-toggle.off { color: #8a8578; }
.armory-toggle:hover { background: rgba(255, 255, 255, .06); }
.armory-view-switch { display: inline-flex; margin-left: 4px; border: 1px solid #2a2723; border-radius: 3px; overflow: hidden; }
.armory-view-switch button {
background: rgba(0, 0, 0, .25); color: #6d6a5e; border: 0; padding: 6px 11px; cursor: pointer; font-size: 13px; transition: all .12s;
}
.armory-view-switch button:hover { background: rgba(255, 255, 255, .06); color: #d4cdbb; }
.armory-view-switch button.active { background: #d79602; color: #14110d; }
/* Vista lista de equipo */
.armory-listview { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 6px; }
.armory-listrow {
display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 3px; text-decoration: none;
background: rgba(0, 0, 0, .2); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03); transition: background .12s;
}
.armory-listrow:hover { background: rgba(255, 255, 255, .05); }
.armory-slot.small { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 3px; }
.armory-listrow-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.armory-listrow .armory-cell-name {
font-size: 12px; font-weight: bold; text-decoration: none; line-height: 1.2;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Icono del ítem como capa hija (wowhead sobrescribe el background del <a>, no el hijo) */
.armory-slot { position: relative; overflow: hidden; }
.armory-slot-icon {
position: absolute; inset: 2px; border-radius: 3px;
background-position: center; background-size: cover; background-repeat: no-repeat;
}
/* Badge de puntos de logros en la cabecera */
.armory-achpoints { font-size: 13px; font-weight: bold; color: #d79602; display: inline-flex; align-items: center; gap: 5px; }
.armory-achpoints i { font-size: 12px; }
/* Panel de talentos */
.armory-talents-panel { background: rgba(0,0,0,.18); border-radius: 4px; padding: 14px 16px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); }
.armory-spec { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px; }
.armory-spec-name { font-size: 16px; font-weight: bold; color: #d79602; }
.armory-spec-dist { font-size: 13px; color: #8a8578; font-weight: bold; letter-spacing: .05em; }
.armory-trees { display: flex; flex-direction: column; gap: 8px; }
.armory-tree { display: grid; grid-template-columns: 130px 1fr 32px; align-items: center; gap: 10px; }
.armory-tree-name { font-size: 13px; color: #d4cdbb; }
.armory-tree-bar { position: relative; height: 8px; background: rgba(255,255,255,.05); border-radius: 4px; overflow: hidden; }
.armory-tree-bar > span { position: absolute; inset: 0 auto 0 0; background: linear-gradient(90deg, #a8791a, #d79602); border-radius: 4px; }
.armory-tree-pts { font-size: 13px; font-weight: bold; color: #d4cdbb; text-align: right; }
/* ===== Árbol de talentos (rejilla con iconos) ===== */
.armory-spec-total { margin-left: auto; font-size: 12px; color: #6d6a5e; }
.armory-talent-trees { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.armory-talent-tree { background: rgba(0,0,0,.2); border-radius: 4px; padding: 10px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); }
.armory-talent-tree-head { display: flex; justify-content: space-between; font-size: 13px; font-weight: bold; color: #d4cdbb; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,.05); }
.armory-talent-tree-pts { color: #d79602; }
.armory-talent-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; justify-items: center; }
.armory-talent { position: relative; width: 40px; height: 40px; border-radius: 5px; display: block; background: #0d0b08; box-shadow: inset 0 0 0 1px #2a2723; overflow: hidden; }
.armory-talent-icon { position: absolute; inset: 1px; background-position: center; background-size: cover; border-radius: 4px; }
.armory-talent.off .armory-talent-icon { filter: grayscale(1) brightness(.45); }
.armory-talent.on { box-shadow: inset 0 0 0 2px #1eff00, 0 0 5px rgba(30,255,0,.35); }
.armory-talent.max { box-shadow: inset 0 0 0 2px #d79602, 0 0 6px rgba(215,150,2,.45); }
.armory-talent-rank { position: absolute; right: 0; bottom: 0; z-index: 2; font-size: 10px; font-weight: bold; line-height: 1; padding: 1px 3px; border-radius: 3px 0 0 0; background: rgba(0,0,0,.82); color: #fff; }
.armory-talent.max .armory-talent-rank { color: #ffd100; }
@media (max-width: 700px) { .armory-talent-trees { grid-template-columns: 1fr; } }
/* Compactar la rejilla: columnas de ancho fijo y centradas (como el juego) */
.armory-talent-grid { grid-template-columns: repeat(4, 44px); gap: 10px; justify-content: center; }
.armory-talent { width: 44px; height: 44px; }
/* wowhead (iconizeLinks) inyecta un background-image inline en el <a>; sin su CSS
se repite en mosaico (visible en la vista lista). Ponemos nuestros propios iconos
en un <span> hijo, así que anulamos el background que inyecta wowhead. */
a.armory-slot, a.armory-listrow, a.armory-talent { background-image: none !important; }
/* ===== Panel de Especialización (spec primaria + doble spec) ===== */
.armory-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.armory-spec-box {
display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 4px; min-height: 64px;
background: rgba(0, 0, 0, .22); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04);
}
.armory-spec-box.active { box-shadow: inset 0 0 0 1px rgba(215, 150, 2, .55), 0 0 8px rgba(215, 150, 2, .12); }
.armory-spec-box.na { justify-content: center; opacity: .5; }
.armory-spec-box-icon {
width: 46px; height: 46px; flex: 0 0 46px; border-radius: 5px;
background: #0d0b08 center/cover no-repeat; box-shadow: inset 0 0 0 2px #d79602;
}
.armory-spec-box-name { font-size: 16px; font-weight: bold; color: #d79602; }
.armory-spec-box-dist { font-size: 13px; color: #8a8578; font-weight: bold; letter-spacing: .05em; margin-top: 2px; }
.armory-spec-box-na { font-size: 20px; font-weight: bold; color: #6d6a5e; letter-spacing: .12em; }
@media (max-width: 600px) { .armory-specs { grid-template-columns: 1fr; } }
/* Rango de profesión bajo el nombre */
.armory-prof-nameblock { display: flex; flex-direction: column; gap: 1px; }
.armory-prof-rank { font-size: 11px; color: #6d6a5e; }
/* Nivel de objeto medio junto al nombre del personaje */
.armory-char-ilvl { font-size: 15px; font-weight: normal; color: #8a8578; }
/* ===== Actividad reciente (logros con fecha) ===== */
.armory-activity { display: flex; flex-direction: column; }
.armory-activity-row { display: flex; align-items: center; gap: 11px; padding: 9px 4px; border-bottom: 1px solid rgba(255,255,255,.04); }
.armory-activity-row:last-child { border-bottom: 0; }
.armory-activity-icon { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 4px; background: #0d0b08 center/cover no-repeat; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.armory-activity-text { flex: 1; font-size: 13px; color: #8a8578; }
.armory-activity-link { font-weight: bold; text-decoration: none; }
.armory-activity-link:hover { text-decoration: underline; }
.armory-activity-date { font-size: 12px; color: #6d6a5e; font-style: italic; white-space: nowrap; }
/* Evitar el mosaico de icono que inyecta wowhead en el enlace */
a.armory-activity-link { background-image: none !important; }
/* Botón "Ver primera actividad" */
.armory-activity-more {
display: block; width: 100%; margin-top: 12px; padding: 13px; border-radius: 4px; cursor: pointer;
background: rgba(0,0,0,.25); border: 1px solid #2a2723; color: #8a8578;
font-weight: bold; text-transform: uppercase; letter-spacing: .08em; font-size: 12px; transition: all .12s;
}
.armory-activity-more:hover:not(:disabled) { color: #d79602; border-color: rgba(215,150,2,.4); }
.armory-activity-more:disabled { opacity: .5; cursor: default; }
/* Buscador de logros + paginación */
.armory-ach-search {
width: 100%; margin-bottom: 10px; padding: 9px 12px; border-radius: 4px;
background: #14110d; border: 1px solid #2a2723; color: #d4cdbb; font-size: 13px;
}
.armory-ach-search:focus { outline: none; border-color: #d79602; }
.armory-activity.loading { opacity: .5; pointer-events: none; }
.armory-pager { display: flex; gap: 4px; justify-content: center; margin-top: 12px; flex-wrap: wrap; }
.armory-pager button {
min-width: 34px; padding: 6px 10px; border-radius: 3px; cursor: pointer; font-weight: bold; font-size: 13px;
background: rgba(0,0,0,.25); border: 1px solid #2a2723; color: #8a8578; transition: all .12s;
}
.armory-pager button:hover:not(:disabled) { color: #d79602; border-color: rgba(215,150,2,.4); }
.armory-pager button.active { background: #d79602; color: #14110d; border-color: #d79602; }
.armory-pager button:disabled { opacity: .4; cursor: default; }
.armory-pager-dots { color: #6d6a5e; padding: 6px 2px; align-self: center; }
/* ===== Profesiones con barras (Primarias / Secundarias) ===== */
.armory-prof-groups { display: flex; flex-direction: column; gap: 16px; }
.armory-prof-grouptitle { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #6d6a5e; margin: 0 0 10px; font-weight: bold; }
.armory-prof-row { display: flex; align-items: center; gap: 11px; margin-bottom: 11px; }
.armory-prof-row:last-child { margin-bottom: 0; }
.armory-prof-icon { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 4px; background: #0d0b08 center/cover no-repeat; box-shadow: inset 0 0 0 1px rgba(255,255,255,.09); }
.armory-prof-body { flex: 1; min-width: 0; }
.armory-prof-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 5px; }
.armory-prof-name { font-size: 13px; font-weight: bold; color: #d4cdbb; }
.armory-prof-rank { font-size: 11px; color: #6d6a5e; font-weight: normal; }
.armory-prof-value { font-size: 13px; font-weight: bold; color: #d79602; white-space: nowrap; }
.armory-prof-max { color: #6d6a5e; font-weight: normal; }
.armory-prof-bar { height: 7px; background: rgba(255,255,255,.06); border-radius: 4px; overflow: hidden; }
.armory-prof-bar > span { display: block; height: 100%; background: linear-gradient(90deg, #a8791a, #e0b030); border-radius: 4px; }
/* ===== Barra de XP/Nivel ===== */
.armory-xpbar { margin: 8px 0 18px; }
.armory-xpbar-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.armory-xpbar-label { font-size: 13px; color: #8a8578; }
.armory-xpbar-value { font-size: 18px; font-weight: bold; color: #d79602; }
.armory-xpbar-track { height: 10px; background: rgba(255,255,255,.05); border-radius: 5px; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); }
.armory-xpbar-track > span { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #7a5cff, #b452d6 45%, #e0813a 80%, #f0b429); }
/* ===== Pestañas de la ficha ===== */
.armory-ctabbar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.armory-ctab {
display: inline-flex; align-items: center; gap: 8px; padding: 11px 16px; border-radius: 6px; cursor: pointer;
background: rgba(0,0,0,.25); border: 1px solid #2a2723; color: #d4cdbb; font-weight: bold; font-size: 14px; transition: all .12s;
}
.armory-ctab i { color: #8a8578; }
.armory-ctab:hover { border-color: rgba(215,150,2,.4); }
.armory-ctab.active { background: #d79602; color: #14110d; border-color: #d79602; }
.armory-ctab.active i { color: #14110d; }
.armory-ctab-count { font-size: 12px; padding: 1px 8px; border-radius: 10px; background: rgba(0,0,0,.3); color: #d79602; }
.armory-ctab.active .armory-ctab-count { background: rgba(0,0,0,.25); color: #14110d; }
.armory-ctab-panel { display: flex; flex-direction: column; gap: 16px; }
/* ===== PvP ===== */
.armory-pvp { display: flex; flex-direction: column; gap: 8px; }
.armory-pvp-stat { display: flex; justify-content: space-between; padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,.03); }
.armory-pvp-label { font-size: 12px; color: #8a8578; }
.armory-pvp-value { font-size: 13px; font-weight: bold; color: #d4cdbb; }
/* ===== Glifos ===== */
.armory-glyphs { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; }
.armory-glyph { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.armory-glyph:last-child { margin-bottom: 0; }
.armory-glyph-icon { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 4px; background: #0d0b08 center/cover no-repeat; box-shadow: inset 0 0 0 1px rgba(163,53,238,.5); }
.armory-glyph-name { font-size: 13px; color: #d4cdbb; }
/* ===== Pestaña Misiones ===== */
.armory-quest-filters { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; margin-bottom: 10px; }
.armory-quest-status { padding: 9px 12px; border-radius: 4px; background: #14110d; border: 1px solid #2a2723; color: #d4cdbb; font-size: 13px; cursor: pointer; }
.armory-quest-status:focus { outline: none; border-color: #d79602; }
.armory-quest-count { font-size: 12px; color: #8a8578; margin: 0 0 12px; }
.armory-quest-table { width: 100%; border-collapse: collapse; }
.armory-quest-table.loading { opacity: .5; }
.armory-quest-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #6d6a5e; padding: 8px 6px; border-bottom: 1px solid #2a2723; }
.armory-quest-th-status, .armory-quest-td-status { text-align: right; white-space: nowrap; }
.armory-quest-table td { padding: 9px 6px; border-bottom: 1px solid rgba(255,255,255,.03); font-size: 13px; }
.armory-quest-link { color: #ffd100; text-decoration: none; font-weight: bold; }
.armory-quest-link:hover { text-decoration: underline; }
a.armory-quest-link { background-image: none !important; }
.armory-quest-badge { font-size: 11px; font-weight: bold; padding: 2px 9px; border-radius: 10px; }
.armory-quest-badge.completed { color: #1eff00; background: rgba(30,255,0,.1); }
.armory-quest-badge.inprogress { color: #d79602; background: rgba(215,150,2,.1); }
@media (max-width: 600px) { .armory-quest-filters { grid-template-columns: 1fr; } }
/* ===== Colecciones (Monturas / Mascotas) ===== */
.armory-collection-head { font-size: 14px; color: #d4cdbb; padding: 11px 14px; margin-bottom: 14px; background: rgba(0,0,0,.2); border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); }
.armory-collection { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; }
.armory-coll-card { display: flex; align-items: center; gap: 11px; padding: 9px 12px; border-radius: 4px; text-decoration: none; background: rgba(0,0,0,.2); box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); transition: background .12s; }
.armory-coll-card:hover { background: rgba(255,255,255,.05); }
.armory-coll-icon { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 4px; background: #0d0b08 center/cover no-repeat; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.armory-coll-name { font-size: 13px; font-weight: bold; color: #d4cdbb; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a.armory-coll-card { background-image: none !important; }
/* ===== Toggle Primaria/Secundaria + distribución + 4 columnas (árboles + glifos) ===== */
.armory-spec-toggle { display: flex; gap: 8px; justify-content: center; margin-bottom: 16px; }
.armory-spec-toggle button { padding: 9px 20px; border-radius: 6px; background: rgba(0,0,0,.25); border: 1px solid #2a2723; color: #d4cdbb; font-weight: bold; font-size: 14px; cursor: pointer; transition: all .12s; }
.armory-spec-toggle button:hover { border-color: rgba(215,150,2,.4); }
.armory-spec-toggle button.active { background: #d79602; color: #14110d; border-color: #d79602; }
.armory-spec-toggle-dot { font-weight: normal; font-size: 12px; opacity: .85; }
.armory-tdist { text-align: center; padding: 16px; margin-bottom: 16px; background: rgba(0,0,0,.2); border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); }
.armory-tdist-label { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: #8a8578; margin-bottom: 6px; }
.armory-tdist-value { font-size: 26px; font-weight: bold; color: #d79602; letter-spacing: .05em; }
.armory-talent-cols { display: grid; grid-template-columns: repeat(3, auto) minmax(200px, 1fr); gap: 14px; justify-content: center; align-items: start; }
.armory-glyph-col .armory-glyph-group { margin-bottom: 14px; }
@media (max-width: 980px) { .armory-talent-cols { grid-template-columns: 1fr; } }
/* ===== Misiones: título, desplegable de estado, filas con ID ===== */
.armory-quest-title { font-size: 20px; font-weight: bold; color: #d4cdbb; margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.armory-quest-title i { color: #d79602; }
.armory-quest-title-count { font-size: 15px; font-weight: normal; color: #8a8578; }
.armory-quest-id { font-size: 11px; color: #6d6a5e; font-weight: bold; }
a.armory-quest-link { font-weight: bold; }
/* Desplegable custom de estado */
.armory-dropdown { position: relative; }
.armory-dropdown-btn { display: flex; align-items: center; gap: 8px; width: 100%; padding: 9px 12px; border-radius: 4px; background: #14110d; border: 1px solid #2a2723; color: #d4cdbb; font-size: 13px; cursor: pointer; }
.armory-dropdown-btn:hover { border-color: #d79602; }
.armory-dropdown-caret { margin-left: auto; color: #6d6a5e; }
.armory-dropdown-list { position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 60; background: #14110d; border: 1px solid #2a2723; border-radius: 4px; box-shadow: 0 8px 24px rgba(0,0,0,.6); overflow: hidden; }
.armory-dropdown-item { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 12px; background: none; border: 0; color: #d4cdbb; font-size: 13px; cursor: pointer; text-align: left; }
.armory-dropdown-item:hover { background: rgba(255,255,255,.06); }
.armory-dropdown-item.active { background: rgba(215,150,2,.12); }
.armory-dropdown-noicon { width: 14px; display: inline-block; }
/* Logros: enlace amarillo + fecha */
.armory-ach-link { color: #ffd100 !important; }
.armory-ach-date { color: #d4cdbb; font-variant-numeric: tabular-nums; }
.armory-ach-filters { grid-template-columns: 1fr 1fr; }
/* ===== Reputaciones ===== */
.armory-reps { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px 24px; margin-top: 14px; }
.armory-rep-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 5px; }
.armory-rep-name { font-size: 13px; font-weight: bold; color: #d4cdbb; }
.armory-rep-rank { font-size: 12px; font-weight: bold; }
.armory-rep-nums { font-size: 11px; color: #6d6a5e; }
.armory-rep-bar { height: 8px; background: rgba(255,255,255,.06); border-radius: 4px; overflow: hidden; }
.armory-rep-bar > span { display: block; height: 100%; border-radius: 4px; }
/* ===== PvP: tiles de estadísticas ===== */
.armory-pvp-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; }
.armory-pvp-tile { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 22px 14px; border-radius: 8px; background: rgba(0,0,0,.22); box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); }
.armory-pvp-tile-num { font-size: 30px; font-weight: bold; line-height: 1; }
.armory-pvp-tile-lbl { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: #8a8578; }
/* ===== PvP: ranking mundial ===== */
.armory-pvprank-header { text-align: center; margin-bottom: 16px; }
.armory-pvprank-header .armory-quest-title { justify-content: center; font-size: 24px; }
.armory-pvprank-desc { color: #8a8578; font-size: 14px; margin: 4px 0 0; }
.armory-rank-table th { color: #d79602; }
.armory-rank-th-pos { width: 60px; }
.armory-rank-th-kills, .armory-rank-th-time { text-align: right; }
.armory-rank-pos { font-weight: bold; color: #d4cdbb; white-space: nowrap; }
.armory-rank-medal { font-size: 15px; }
.armory-rank-name { color: #ffd100; text-decoration: none; font-weight: bold; }
.armory-rank-name:hover { text-decoration: underline; }
.armory-rank-kills { text-align: right; color: #ff5555; font-weight: bold; font-variant-numeric: tabular-nums; }
.armory-rank-time { text-align: right; color: #8a8578; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* Fix alineación de la tabla de ranking (cabeceras derecha + anchos de columna) */
.armory-rank-table th.armory-rank-th-kills, .armory-rank-table td.armory-rank-kills,
.armory-rank-table th.armory-rank-th-time, .armory-rank-table td.armory-rank-time { text-align: right; }
.armory-rank-th-pos, .armory-rank-pos { width: 70px; }
.armory-rank-th-kills, .armory-rank-kills { width: 120px; }
.armory-rank-th-time, .armory-rank-time { width: 150px; }
/* ===== Arena (brackets 2v2/3v3/5v5) ===== */
.armory-arena { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.armory-arena-card { text-align: center; padding: 20px 16px; border-radius: 8px; background: rgba(0,0,0,.22); box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); }
.armory-arena-bracket { font-size: 15px; font-weight: bold; color: #d79602; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 10px; }
.armory-arena-rating { font-size: 34px; font-weight: bold; color: #d4cdbb; line-height: 1; }
.armory-arena-rating-lbl { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #6d6a5e; margin: 4px 0 14px; }
.armory-arena-rows { display: flex; flex-direction: column; gap: 6px; text-align: left; }
.armory-arena-row { display: flex; justify-content: space-between; font-size: 13px; color: #8a8578; padding: 3px 0; border-top: 1px solid rgba(255,255,255,.04); }
.armory-arena-row span:last-child { color: #d4cdbb; font-weight: bold; }
.armory-arena-w { color: #1eff00; }
.armory-arena-l { color: #ff5555; }
.armory-arena-nogames { font-size: 13px; color: #6d6a5e; padding: 10px 0; }
/* Badge de modo de arena (puntuado/sin partidas) */
.armory-arena-mode { display: inline-block; font-size: 10px; font-weight: bold; text-transform: uppercase; letter-spacing: .05em; padding: 2px 10px; border-radius: 10px; margin-bottom: 12px; }
.armory-arena-mode.rated { color: #d79602; background: rgba(215,150,2,.14); }
.armory-arena-mode.none { color: #6d6a5e; background: rgba(255,255,255,.04); }
/* ===== Campos de batalla (PvP) ===== */
.armory-bg-panel { padding: 18px; }
.armory-bg-header { margin-bottom: 14px; }
.armory-bg-desc { margin: 4px 0 0; color: #9a9488; font-size: 13px; }
.armory-bg-summary {
display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 16px;
}
.armory-bg-stat {
display: flex; flex-direction: column; align-items: center; gap: 4px;
background: #17140f; border: 1px solid #2b2620; border-radius: 8px; padding: 12px 8px;
}
.armory-bg-stat-num { font-size: 22px; font-weight: 700; }
.armory-bg-stat-lbl { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: #8a847a; }
.armory-bg-table-wrap { overflow-x: auto; }
.armory-bg-table { width: 100%; }
.armory-bg-table th.armory-bg-c, .armory-bg-table td.armory-bg-c { text-align: center; white-space: nowrap; }
.armory-bg-name { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; white-space: nowrap; }
.armory-bg-ico {
display: inline-flex; align-items: center; justify-content: center;
width: 24px; height: 24px; border-radius: 5px; color: #fff; font-size: 12px;
box-shadow: inset 0 0 0 1px rgba(255,255,255,.15);
}
.armory-bg-res {
display: inline-block; min-width: 68px; padding: 3px 8px; border-radius: 5px;
font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
}
.armory-bg-res.win { background: rgba(46,204,113,.15); color: #4ee08a; border: 1px solid rgba(46,204,113,.4); }
.armory-bg-res.loss { background: rgba(255,85,85,.13); color: #ff7a7a; border: 1px solid rgba(255,85,85,.4); }
.armory-bg-kb { color: #ffd100; font-weight: 600; }
.armory-bg-honor { color: #e0a13a; font-weight: 600; }
.armory-bg-date { color: #8a847a; font-size: 12px; }
@media (max-width: 640px) {
.armory-bg-summary { grid-template-columns: repeat(2, 1fr); }
}
/* Fecha + hora del BG (apilado) */
.armory-bg-dt { display: inline-flex; flex-direction: column; align-items: flex-end; line-height: 1.25; }
.armory-bg-dt-d { color: #cfc8bb; font-size: 12px; }
.armory-bg-dt-t { color: #8a847a; font-size: 11px; font-variant-numeric: tabular-nums; }
/* ===== Logros: rejilla de categorías (anillos) ===== */
.armory-ach2 { padding: 16px; }
.armory-ach2-summary { margin: 0 0 16px; color: #b8b0a2; font-size: 14px; }
.armory-ach-grid {
display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px;
}
.armory-ach-card {
display: flex; flex-direction: column; align-items: center; gap: 10px;
background: #17140f; border: 1px solid #2b2620; border-radius: 10px;
padding: 18px 10px 14px; cursor: pointer; transition: border-color .15s, background .15s, transform .1s;
font-family: inherit; text-align: center;
}
.armory-ach-card:hover { border-color: #c8a24c; background: #1e1a13; transform: translateY(-2px); }
.armory-ach-ring {
position: relative; width: 86px; height: 86px; border-radius: 50%;
display: flex; align-items: center; justify-content: center;
}
.armory-ach-ring::before {
content: ''; position: absolute; inset: 11px; border-radius: 50%; background: #17140f;
}
.armory-ach-card:hover .armory-ach-ring::before { background: #1e1a13; }
.armory-ach-ring-pct {
position: relative; z-index: 1; font-size: 18px; font-weight: 700; color: #fff;
}
.armory-ach-ring.feats {
background: #241f19; color: #7d7568; font-size: 30px;
}
.armory-ach-ring.feats::before { inset: 4px; }
.armory-ach-ring.feats > i { position: relative; z-index: 1; }
.armory-ach-cat-name { color: #e6b53c; font-size: 14px; font-weight: 600; line-height: 1.2; }
.armory-ach-cat-pts { color: #d9c9a0; font-size: 13px; display: inline-flex; align-items: center; gap: 5px; }
.armory-ach-cat-pts > i { color: #c8a24c; }
/* ===== Logros: detalle de una categoría ===== */
.armory-ach2-head { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.armory-ach2-back {
display: inline-flex; align-items: center; gap: 7px; background: #17140f; border: 1px solid #2b2620;
color: #d9c9a0; border-radius: 8px; padding: 8px 14px; cursor: pointer; font-family: inherit; font-size: 13px;
transition: border-color .15s, color .15s;
}
.armory-ach2-back:hover { border-color: #c8a24c; color: #fff; }
.armory-ach2-title { font-size: 20px; font-weight: 700; color: #e6b53c; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.armory-ach2-sub { font-size: 13px; font-weight: 400; color: #8a847a; }
.armory-ach2-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; transition: opacity .15s; }
.armory-ach2-list.loading { opacity: .5; }
.armory-ach2-item {
display: flex; align-items: flex-start; gap: 14px;
background: #17140f; border: 1px solid #2b2620; border-radius: 8px; padding: 12px 14px;
}
.armory-ach2-item:hover { border-color: #3a342b; }
.armory-ach2-icon, .armory-ach2-name { background-image: none !important; }
.armory-ach2-icon {
flex: 0 0 auto; width: 48px; height: 48px; border-radius: 6px; overflow: hidden;
border: 1px solid #3a342b; display: block;
}
.armory-ach2-icon img { width: 100%; height: 100%; display: block; }
.armory-ach2-body { flex: 1 1 auto; min-width: 0; }
.armory-ach2-name { color: #4a9eff; font-weight: 600; font-size: 15px; text-decoration: none; }
.armory-ach2-name:hover { text-decoration: underline; }
.armory-ach2-desc { margin: 3px 0 0; color: #b8b0a2; font-size: 13px; line-height: 1.35; }
.armory-ach2-reward { margin: 5px 0 0; color: #7fd18a; font-size: 12px; }
.armory-ach2-reward > i { margin-right: 4px; }
.armory-ach2-meta { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.armory-ach2-pts {
display: inline-flex; align-items: center; gap: 5px; color: #ffd100; font-weight: 700; font-size: 15px;
}
.armory-ach2-pts > i { color: #c8a24c; }
.armory-ach2-date { color: #7d7568; font-size: 12px; font-variant-numeric: tabular-nums; }
@media (max-width: 560px) {
.armory-ach-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
.armory-ach2-meta { flex-direction: row; gap: 12px; }
}
/* Fix: los anillos se aplastaban (flex-shrink en columna) -> forzar tamaño fijo */
.armory-ach-ring { flex: 0 0 86px; box-sizing: border-box; }
.armory-ach-ring.feats { flex: 0 0 86px; }
.armory-ach-card { min-height: 168px; justify-content: flex-start; }
.armory-ach-cat-name { margin-top: 2px; }
/* Fix hueco iconos: wowhead iconiza los <a> (ins/del + padding). Neutralizar. */
.armory-ach2-item { align-items: center; }
.armory-ach2-icon {
padding: 0 !important; width: 48px !important; height: 48px !important;
margin: 0 !important;
}
.armory-ach2-icon img { width: 48px !important; height: 48px !important; }
.armory-ach2-icon ins, .armory-ach2-icon del,
.armory-ach2-name ins, .armory-ach2-name del { display: none !important; }
.armory-ach2-name { padding-left: 0 !important; background-image: none !important; }
/* Fix descuadre: nombres de 2 líneas (JcJ, Mazmorras) empujaban el escudo.
Reservar altura fija para el nombre y anclar los puntos abajo. */
.armory-ach-card { justify-content: flex-start; }
.armory-ach-cat-name {
min-height: 2.5em; display: flex; align-items: center; justify-content: center;
margin-top: 4px;
}
.armory-ach-cat-pts { margin-top: auto; padding-top: 4px; }
/* Override: el margin-top:auto sacaba los escudos fuera de la tarjeta.
Quitarlo y usar solo altura reservada del nombre para alinear los puntos. */
.armory-ach-card { min-height: 0 !important; justify-content: flex-start; gap: 8px; padding: 18px 10px 16px; }
.armory-ach-cat-name { min-height: 2.6em; margin-top: 0; }
.armory-ach-cat-pts { margin-top: 0 !important; padding-top: 0; }
/* Iconos del detalle: asegurar caja limpia sin restos de wowhead */
.armory-ach2-item { align-items: center; }
.armory-ach2-icon {
width: 48px !important; height: 48px !important; padding: 0 !important; margin: 0 !important;
overflow: hidden; border-radius: 6px;
}
.armory-ach2-icon img { width: 48px !important; height: 48px !important; display: block !important; }
.armory-ach2-icon ins, .armory-ach2-icon del,
.armory-ach2-name ins, .armory-ach2-name del { display: none !important; }
.armory-ach2-name { padding-left: 0 !important; }
/* ==== Reset definitivo de la tarjeta de categoría (deshace fixes previos) ==== */
.armory-ach-card {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 10px !important;
min-height: 196px !important;
padding: 18px 10px 16px !important;
overflow: visible !important;
}
.armory-ach-ring {
flex: 0 0 86px !important;
width: 86px !important;
height: 86px !important;
box-sizing: border-box !important;
}
.armory-ach-ring.feats { flex: 0 0 86px !important; width: 86px !important; height: 86px !important; }
.armory-ach-cat-name {
min-height: 2.6em !important;
margin: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.armory-ach-cat-pts {
margin: 0 !important;
padding-top: 2px !important;
}
/* ===== Pestaña Bandas (progreso de raids) ===== */
.armory-raids { padding: 16px; }
.armory-raid-grid {
display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px;
}
.armory-raid-card {
background: #17140f; border: 1px solid #2b2620; border-radius: 10px; overflow: visible;
display: flex; flex-direction: column;
}
.armory-raid-banner {
border-radius: 10px 10px 0 0; padding: 14px 14px 12px; min-height: 62px;
display: flex; flex-direction: column; justify-content: center; gap: 3px;
box-shadow: inset 0 -40px 40px -30px rgba(0,0,0,.6);
}
.armory-raid-name { color: #fff; font-weight: 700; font-size: 15px; line-height: 1.2; text-shadow: 0 1px 3px rgba(0,0,0,.7); }
.armory-raid-count { color: rgba(255,255,255,.75); font-size: 12px; text-shadow: 0 1px 2px rgba(0,0,0,.7); }
.armory-raid-diffs { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 7px; }
.armory-raid-row { position: relative; display: flex; align-items: center; gap: 10px; }
.armory-raid-diff-lbl {
flex: 0 0 68px; color: #d9a441; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px;
}
.armory-raid-bar {
position: relative; flex: 1 1 auto; height: 22px; border-radius: 5px; overflow: hidden;
background: #241f19; border: 1px solid #322c24; cursor: default;
}
.armory-raid-bar-fill { position: absolute; inset: 0 auto 0 0; height: 100%; border-radius: 4px 0 0 4px; transition: width .3s; }
.armory-raid-bar.full .armory-raid-bar-fill { background: linear-gradient(90deg, #2f9e4f, #37c15f); width: 100% !important; }
.armory-raid-bar.partial .armory-raid-bar-fill { background: linear-gradient(90deg, #c8781f, #e0902f); }
.armory-raid-bar.empty .armory-raid-bar-fill { background: transparent; }
.armory-raid-bar-txt {
position: relative; z-index: 1; display: block; text-align: center; line-height: 22px;
font-size: 12px; font-weight: 700; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
/* Tooltip de jefes */
.armory-raid-tip {
position: absolute; left: 78px; bottom: calc(100% + 8px); z-index: 30;
min-width: 220px; max-width: 280px;
background: #0d0b08; border: 1px solid #c8a24c; border-radius: 8px; padding: 10px 12px;
box-shadow: 0 8px 24px rgba(0,0,0,.6);
opacity: 0; visibility: hidden; transform: translateY(4px); transition: opacity .12s, transform .12s;
pointer-events: none;
}
.armory-raid-row:hover .armory-raid-tip { opacity: 1; visibility: visible; transform: translateY(0); }
.armory-raid-tip-head { color: #e6b53c; font-weight: 700; font-size: 13px; margin-bottom: 6px; border-bottom: 1px solid #2b2620; padding-bottom: 5px; }
.armory-raid-tip ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.armory-raid-tip li { font-size: 12px; color: #9a948a; display: flex; gap: 6px; }
.armory-raid-tip li.killed { color: #7fd18a; }
.armory-raid-tip li.alive { color: #8a847a; }
.armory-raid-tip-x { color: inherit; font-weight: 700; opacity: .85; min-width: 24px; }
@media (max-width: 560px) {
.armory-raid-grid { grid-template-columns: 1fr; }
}
/* Cabeceras de expansión en Bandas */
.armory-raid-exp { margin-bottom: 22px; }
.armory-raid-exp:last-child { margin-bottom: 0; }
.armory-raid-exp-title {
margin: 0 0 12px; font-size: 15px; font-weight: 700; color: #e6b53c;
text-transform: uppercase; letter-spacing: 1px;
padding-bottom: 8px; border-bottom: 1px solid #2b2620;
}
/* ===== Página de hermandad ===== */
.armory-guild-page { max-width: 1200px; margin: 0 auto; }
.armory-guild-head { display: flex; align-items: center; gap: 18px; margin: 8px 0 4px; }
.armory-guild-emblem {
flex: 0 0 auto; width: 76px; height: 76px; border-radius: 50%;
display: flex; align-items: center; justify-content: center; font-size: 34px;
border: 2px solid #c8a24c; box-shadow: inset 0 0 20px rgba(0,0,0,.5);
}
.armory-guild-title { margin: 0; font-size: 28px; font-weight: 800; color: #fff; line-height: 1.1; }
.armory-guild-realm { color: #9a948a; font-size: 13px; margin-top: 2px; }
.armory-guild-stats { display: flex; gap: 18px; margin-top: 8px; flex-wrap: wrap; }
.armory-guild-stat { display: inline-flex; align-items: center; gap: 6px; color: #d9c9a0; font-size: 14px; }
.armory-guild-stat > i { color: #c8a24c; }
.armory-guild-stat.muted { color: #8a847a; }
.armory-guild-tabbar { display: flex; gap: 8px; border-bottom: 1px solid #2b2620; margin: 16px 0 18px; }
.armory-guild-tab { padding: 8px 16px; border-radius: 6px 6px 0 0; font-weight: 700; font-size: 14px; color: #9a948a; }
.armory-guild-tab.active { background: #c8a24c; color: #1a1710; }
.armory-guild-layout { display: grid; grid-template-columns: 1fr 340px; gap: 22px; align-items: start; }
.armory-guild-section { font-size: 14px; text-transform: uppercase; letter-spacing: .5px; color: #b8b0a2; margin: 0 0 12px; font-weight: 700; }
/* Filtros */
.armory-guild-filters { display: flex; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.armory-guild-filter { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #8a847a; }
.armory-guild-filter select {
background: #17140f; border: 1px solid #3a342b; color: #e6ddc9; border-radius: 6px;
padding: 8px 10px; font-family: inherit; font-size: 13px; min-width: 190px; cursor: pointer;
}
.armory-guild-filter select:focus { outline: none; border-color: #c8a24c; }
/* Tabla roster */
.armory-guild-table { width: 100%; border-collapse: collapse; transition: opacity .15s; }
.armory-guild-table.loading { opacity: .5; }
.armory-guild-table th {
text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: #c8a24c;
padding: 8px 10px; border-bottom: 1px solid #2b2620; font-weight: 700;
}
.armory-guild-table th.armory-gt-c, .armory-guild-table td.armory-gt-c { text-align: center; }
.armory-guild-table th.armory-gt-pts, .armory-guild-table td.armory-gt-pts { text-align: right; }
.armory-guild-table td { padding: 7px 10px; border-bottom: 1px solid #201c16; }
.armory-guild-table tbody tr:hover { background: #17140f; }
.armory-gt-name { display: inline-flex; align-items: center; gap: 9px; font-weight: 600; text-decoration: none; }
.armory-gt-name:hover { text-decoration: underline; }
.armory-gt-avatar { width: 26px; height: 26px; border-radius: 50%; border: 1px solid #3a342b; object-fit: cover; }
.armory-gt-ico { width: 24px; height: 24px; border-radius: 5px; vertical-align: middle; }
.armory-gt-level { color: #cfc8bb; font-weight: 600; }
.armory-gt-rank { color: #b8b0a2; font-size: 13px; }
.armory-gt-points { color: #ffd100; font-weight: 700; display: inline-flex; align-items: center; gap: 5px; }
.armory-gt-points > i { color: #c8a24c; }
/* Barra lateral */
.armory-guild-side { display: flex; flex-direction: column; gap: 16px; }
.armory-guild-card { background: #17140f; border: 1px solid #2b2620; border-radius: 10px; padding: 14px 16px; }
.armory-guild-card-title { margin: 0 0 10px; font-size: 13px; text-transform: uppercase; letter-spacing: .5px; color: #c8a24c; font-weight: 700; }
.armory-guild-motd-locked { color: #8a847a; font-size: 13px; line-height: 1.4; }
.armory-guild-motd-locked > i { margin-right: 6px; color: #6a6459; }
.armory-guild-recent { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.armory-guild-recent-item { display: flex; align-items: center; gap: 10px; }
.armory-guild-recent-ico { width: 34px; height: 34px; border-radius: 6px; border: 1px solid #3a342b; }
.armory-guild-recent-name { flex: 1 1 auto; color: #e6b53c; font-size: 13px; font-weight: 600; }
.armory-guild-recent-date { color: #7d7568; font-size: 11px; }
.armory-guild-chart-lbl { font-size: 12px; color: #9a948a; margin-bottom: 8px; }
.armory-guild-chart { display: flex; align-items: flex-end; gap: 5px; height: 96px; }
.armory-guild-bar-col { flex: 1 1 0; height: 100%; display: flex; align-items: flex-end; }
.armory-guild-bar-wrap { width: 100%; height: 100%; display: flex; align-items: flex-end; }
.armory-guild-bar { width: 100%; min-height: 3px; border-radius: 3px 3px 0 0; }
@media (max-width: 900px) {
.armory-guild-layout { grid-template-columns: 1fr; }
}
/* Tag de reino en la cabecera del personaje */
.armory-realm {
display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 12px;
background: #17140f; border: 1px solid #2b2620; color: #9a948a; font-size: 12px;
}
/* Logros de hermandad + realm inline */
.armory-guild-realm-inline { color: #7d7568; font-weight: 400; text-transform: none; letter-spacing: 0; }
.armory-guild-tab { text-decoration: none; }
.armory-guild-page .armory-ach2 { margin-top: 4px; }
/* Columna Función + desglose de funciones */
.armory-gt-role {
display: inline-flex; align-items: center; justify-content: center;
width: 26px; height: 26px; border-radius: 50%; background: #17140f;
border: 1px solid currentColor; font-size: 12px;
}
.armory-guild-roles { display: flex; flex-direction: column; gap: 8px; }
.armory-guild-role-row { display: grid; grid-template-columns: 62px 1fr 24px; align-items: center; gap: 8px; }
.armory-guild-role-lbl { font-size: 12px; font-weight: 700; }
.armory-guild-role-track { height: 16px; background: #241f19; border: 1px solid #322c24; border-radius: 4px; overflow: hidden; }
.armory-guild-role-fill { height: 100%; min-width: 2px; border-radius: 3px; transition: width .3s; }
.armory-guild-role-n { font-size: 12px; color: #cfc8bb; text-align: right; font-variant-numeric: tabular-nums; }
/* Fix botón azul de pestaña + mensaje diario + ilvl */
.armory-guild-tab { color: #c9c2b5 !important; }
.armory-guild-tab:hover { color: #fff !important; }
.armory-guild-tab.active { color: #1a1710 !important; }
.armory-guild-motd { color: #cfc8bb; font-size: 13px; line-height: 1.45; white-space: pre-wrap; }
.armory-guild-login { color: #e6b53c !important; text-decoration: underline; font-weight: 600; }
.armory-gt-ilvl { color: #7fb4ff; font-weight: 700; }