/* WarZone MU v2 — v2-iconos-display (2026-11-11)
 *
 * Estilos SOLO para los iconos cableados en este parche: monedas,
 * jefes de invasión y mini-jefes, mapa de Tormenta Island, castillo,
 * eventos y portada de noticias; precio multi-moneda del market;
 * emblemas de módulo y tarjetas de guía de INFO estilo MuDream.
 * No toca main.css ni ninguna regla existente: todas las clases
 * empiezan por .wz- (salvo el ajuste de .news-item/.upd, que solo
 * afecta a los <img> nuevos que llevan clase propia).
 */

/* --- Iconos de moneda (18px por defecto; el tamaño lo pone el HTML) --- */
.wz-cur-ico{display:inline-block;vertical-align:-4px;margin-right:4px}
.wz-acct-row .wz-cur-ico,.wz-acc-kv .wz-cur-ico,.mt-balance .wz-cur-ico,
.mk-card-price .wz-cur-ico,.mk-price-value .wz-cur-ico,
.sub .wz-cur-ico,.rk-sec small .wz-cur-ico{margin-right:5px}
.mk-card-price .wz-cur-ico{vertical-align:-3px}
label .wz-cur-ico{vertical-align:-4px}

/* --- Precio multi-moneda: solo icono + número por pareja, en orden
 * fijo (Zen, WCoinC, Bless, Soul, Chaos). Sin texto ni "+": las
 * parejas se separan con gap. --- */
.wz-price-list{display:inline-flex;flex-wrap:wrap;gap:2px 12px;align-items:center}
.wz-price-pair{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.wz-price-pair .wz-cur-ico{margin-right:0}
.mk-card-price .wz-price-pair .wz-cur-ico,.mk-price-value .wz-price-pair .wz-cur-ico{vertical-align:-4px}
.mt-pay-group{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:12px 0}
.mt-pay-group legend{font-size:13px;color:var(--muted);padding:0 6px}
.mt-pay-opt{display:flex;align-items:center;gap:8px;padding:7px 8px;border:1px solid transparent;border-radius:8px;cursor:pointer;margin:2px 0}
.mt-pay-opt:hover{border-color:var(--line);background:rgba(255,255,255,.03)}
.mt-pay-opt input{accent-color:#c9a227;flex:0 0 auto}
.mt-pay-opt .wz-cur-ico{margin-right:0}
.mt-pay-bal{font-size:13px;color:var(--muted);white-space:nowrap}
.mt-pay-bal .wz-cur-ico{margin-right:0}

/* --- Jefes y mini-jefes (INFO) --- */
.wz-boss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin:14px 0 6px}
.wz-boss-card{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:14px 10px 12px;text-align:center}
.wz-boss-card img{width:120px;height:120px;object-fit:contain;display:block;margin:0 auto 8px}
.wz-boss-card h4{margin:0 0 4px;font-size:15px;color:#fff}
.wz-boss-card .wz-boss-meta{font-size:12.5px;color:var(--muted)}
.wz-ico-note{font-size:13px;color:var(--muted);margin:8px 0 0}

/* --- Eventos clásicos (INFO) --- */
.wz-event-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:14px 0 6px}
.wz-event-card{border:1px solid var(--line);border-radius:12px;background:var(--panel);overflow:hidden}
.wz-event-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.wz-event-card h4{margin:10px 12px 12px;font-size:15px;color:#fff}
@media (max-width:700px){.wz-event-grid{grid-template-columns:1fr}}

/* --- Mapa de Tormenta Island y castillo --- */
.wz-map-figure,.wz-castle-figure{margin:14px 0 6px}
.wz-map-figure img,.wz-castle-figure img{width:100%;max-width:900px;border-radius:12px;border:1px solid var(--line);display:block}
.wz-castle-figure img{max-width:800px}
.wz-map-figure figcaption,.wz-castle-figure figcaption{font-size:13px;color:var(--muted);margin-top:8px}

/* --- Portada de noticias (por defecto, sin columna de imagen en la BD) --- */
.wz-news-cover{width:100%;aspect-ratio:1200/630;object-fit:cover;border-radius:12px;border:1px solid var(--line);display:block;margin:0 0 18px}
.news-item .wz-news-thumb{width:100%;aspect-ratio:1200/630;object-fit:cover;border-radius:8px;display:block;margin:0 0 12px}
.upd .wz-upd-cover{width:100%;aspect-ratio:1200/630;object-fit:cover;border-radius:8px;display:block;margin:0 0 12px}

/* --- Emblemas de módulo (cabecera de cada página de módulo) --- */
.page-head .wz-mod-emblem{float:left;width:64px;height:64px;margin:2px 14px 8px 0;border-radius:12px}
@media (max-width:480px){.page-head .wz-mod-emblem{width:52px;height:52px;margin-right:10px}}
.wz-mod-headline{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.wz-mod-headline img{width:52px;height:52px;border-radius:10px;flex:0 0 52px}
.wz-mod-headline h2{margin:0}

/* --- Tarjetas de guía de INFO, estilo MuDream ("Guías y sistemas"):
 * emblema grande arriba-izquierda, título, descripción y flecha.
 * La tarjeta entera es el enlace a su sección (o a su página). --- */
.wz-guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0 6px}
.wz-guide-card{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);text-decoration:none;color:inherit}
.wz-guide-card:hover{border-color:#d4a017}
.wz-guide-card img{width:68px;height:68px;flex:0 0 68px;border-radius:10px;object-fit:cover}
.wz-guide-card .wz-guide-body{flex:1;min-width:0}
.wz-guide-card h3{margin:0 0 4px;font-size:16px;color:#fff}
.wz-guide-card p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.45}
.wz-guide-card .wz-guide-arrow{flex:0 0 auto;color:#d4a017;font-size:18px;line-height:1;margin-top:2px}
@media (max-width:900px){.wz-guide-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.wz-guide-grid{grid-template-columns:1fr}}
