/* ════════════════════════════════════════════════════════════════════
   L'ULTIMA ECLISSI — Output `equip` nel main log (stile tabulare)
   ────────────────────────────────────────────────────────────────────
   Da caricare DOPO lue-mud-theme.css. Riusa le sue variabili.
   Tutte le classi sono prefissate `lue-eqlog-*` per evitare collisioni.
═════════════════════════════════════════════════════════════════════ */

/* Header del blocco — riusa il pattern di .lue-msg-location */
.lue-eqlog-header {
  font-family: var(--lue-font-ui);
  font-size: 9px;
  color: var(--lue-fg-gold);
  letter-spacing: .12em;
  text-transform: uppercase;
  margin: 4px 0 8px;
  border-left: 2px solid var(--lue-fg-gold);
  padding-left: 8px;
  text-shadow: 1px 1px 0 #000;
}

/* Riga singola — grid a 4 colonne */
.lue-eqlog-row {
  font-family: var(--lue-font-text);
  font-size: 18px;
  line-height: 1.4;
  display: grid;
  grid-template-columns: 150px 28px 1fr 110px;
  gap: 10px;
  align-items: center;
  padding: 1px 0;
}

/* Colonna 1: slot label fra parentesi quadre (stile MUD classico) */
.lue-eqlog-row .lue-eqlog-slot {
  color: var(--lue-fg-dim);
  font-family: var(--lue-font-ui);
  font-size: 8px;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.lue-eqlog-row .lue-eqlog-slot::before {
  content: "[";
  color: var(--lue-fg-muted);
  margin-right: 3px;
}
.lue-eqlog-row .lue-eqlog-slot::after {
  content: "]";
  color: var(--lue-fg-muted);
  margin-left: 3px;
}

/* Colonna 2: icona */
.lue-eqlog-row .lue-eqlog-icon {
  color: var(--lue-fg-gold);
  font-size: 18px;
  text-align: center;
}

/* Colonna 3: nome item — colore varia per rarità (vedi .r-* sotto) */
.lue-eqlog-row .lue-eqlog-name {
  font-size: 18px;
  color: var(--lue-fg);
}

/* Colonna 4: tag rarità (uppercase piccolo a destra) */
.lue-eqlog-row .lue-eqlog-rarity {
  font-family: var(--lue-font-ui);
  font-size: 7px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lue-fg-muted);
  text-align: right;
  white-space: nowrap;
  align-self: center;
}

/* Stati slot vuoto */
.lue-eqlog-row.empty .lue-eqlog-slot::before,
.lue-eqlog-row.empty .lue-eqlog-slot::after { color: var(--lue-fg-muted); }
.lue-eqlog-row.empty .lue-eqlog-icon { color: var(--lue-fg-muted); }
.lue-eqlog-row.empty .lue-eqlog-name {
  color: var(--lue-fg-muted);
  font-style: italic;
}
.lue-eqlog-row.empty .lue-eqlog-rarity { display: none; }

/* Colore nome + tag per rarità.
   La classe rarità va messa SUL .lue-eqlog-row (es. <div class="lue-eqlog-row r-rare">)
   Nome e tag ereditano automaticamente. */
.lue-eqlog-row.r-common    .lue-eqlog-name   { color: var(--lue-fg); }
.lue-eqlog-row.r-common    .lue-eqlog-rarity { color: var(--lue-fg-muted); }

.lue-eqlog-row.r-uncommon  .lue-eqlog-name   { color: #6fbf73; }
.lue-eqlog-row.r-uncommon  .lue-eqlog-rarity { color: #6fbf73; }

.lue-eqlog-row.r-rare      .lue-eqlog-name   { color: #6aa9e8; }
.lue-eqlog-row.r-rare      .lue-eqlog-rarity { color: #6aa9e8; }

.lue-eqlog-row.r-epic      .lue-eqlog-name   { color: #b87cdc; }
.lue-eqlog-row.r-epic      .lue-eqlog-rarity { color: #b87cdc; }

.lue-eqlog-row.r-legendary .lue-eqlog-name   { color: var(--lue-fg-gold); }
.lue-eqlog-row.r-legendary .lue-eqlog-rarity { color: var(--lue-fg-gold); }

/* Footer riassuntivo (peso, statistiche totali, ecc.) */
.lue-eqlog-footer {
  font-family: var(--lue-font-text);
  font-size: 14px;
  color: var(--lue-fg-muted);
  margin-top: 8px;
  font-style: italic;
}

/* == Scoped overrides nel terminal dashboard ==
   .db-output * { font-size:19px !important } ha spec (1,1,0).
   Questi selettori (1,2,0) ripristinano le dimensioni corrette. */
#dashboard-container .db-output .lue-eqlog-header {
  font-size: 9px !important;
  font-family: var(--lue-font-ui) !important;
}
#dashboard-container .db-output .lue-eqlog-row .lue-eqlog-slot {
  font-size: 8px !important;
  font-family: var(--lue-font-ui) !important;
}
#dashboard-container .db-output .lue-eqlog-row .lue-eqlog-rarity {
  font-size: 7px !important;
  font-family: var(--lue-font-ui) !important;
}
#dashboard-container .db-output .lue-eqlog-row .lue-eqlog-name {
  font-size: var(--db-fs, 18px) !important;
  font-family: var(--lue-font-text) !important;
}
#dashboard-container .db-output .lue-eqlog-row .lue-eqlog-icon {
  font-size: var(--db-fs, 18px) !important;
}
#dashboard-container .db-output .lue-eqlog-footer {
  font-size: calc(var(--db-fs, 18px) * 0.78) !important;
  font-family: var(--lue-font-text) !important;
}

/* Separatore dopo l'header */
.lue-eqlog-sep {
  border: none;
  border-top: 1px solid var(--lue-border-gold, #c09820);
  margin: 2px 0 6px;
  opacity: 0.5;
}

/* Fix Bootstrap .row flex layout per il blocco equip log */
#dashboard-container .db-output .row[data-sc="cmd-eq"] {
  flex-direction: column;
  align-items: flex-start;
}

/* Tile item nella colonna icona — scala col testo del log (--db-fs) */
.lue-eqlog-tile {
  width: calc(var(--db-fs, 18px) * 1.45);
  height: calc(var(--db-fs, 18px) * 1.45);
  image-rendering: pixelated;
  vertical-align: middle;
  display: inline-block;
}