/* ==========================================================
   MERCATO — overlay negozio a rotazione giornaliera.
   Contenitore/card/bordo neon: components.css. Qui solo le
   differenze (testata, griglia offerte, pulsanti d'acquisto).
   ================================================---------- */

.mk-head { display: flex; align-items: center; justify-content: space-between; }
.mk-titolo { font-size: 1rem; letter-spacing: 2px; color: var(--info); text-shadow: 0 0 8px rgba(0,200,255,.5); }
.mk-close {
    font-family: inherit; font-size: 0.85rem; cursor: pointer; padding: 4px 10px;
    color: var(--testo); background: rgba(255,0,85,0.15); border: 1px solid var(--pericolo);
}
.mk-close:hover { background: rgba(255,0,85,0.35); }

.mk-risorse { font-size: 0.82rem; color: var(--info); letter-spacing: 0.5px; }
.mk-nota { font-size: 0.72rem; color: rgba(224,208,255,0.6); margin: 0; }

/* Griglia delle offerte */
.mk-grid { display: flex; flex-direction: column; gap: 8px; }

.mk-offer {
    display: flex; align-items: center; gap: 10px;
    background: var(--surface-scura); border: 1px solid rgba(112,56,248,0.4);
    border-left-width: 3px; padding: 9px 11px;
}
.mk-offer.esaurita { opacity: 0.5; }
.mk-ico { font-size: 1.5rem; width: 30px; text-align: center; flex-shrink: 0; }
.mk-info { flex: 1; min-width: 0; }
.mk-nome { font-size: 0.86rem; color: var(--testo); font-weight: 600; }
.mk-sub { font-size: 0.68rem; letter-spacing: 1px; text-transform: uppercase; color: rgba(224,208,255,0.55); }
.mk-rar { font-size: 0.72rem; font-weight: 700; margin-left: 4px; }

/* Bordo per rarità (colori del design system) */
.mk-offer.rar-bordo-comune      { border-left-color: rgba(201,210,227,.5); }
.mk-offer.rar-bordo-raro        { border-left-color: #3fa9ff; }
.mk-offer.rar-bordo-epico       { border-left-color: #c072ff; }
.mk-offer.rar-bordo-leggendario { border-left-color: #ffb03a; box-shadow: 0 0 10px rgba(255,176,58,.15); }

/* Pulsante d'acquisto */
.mk-buy {
    font-family: inherit; font-size: 0.82rem; font-weight: 700; cursor: pointer;
    flex-shrink: 0; padding: 7px 12px; letter-spacing: 0.5px;
    color: var(--verde, #7CFFB2); background: rgba(0,200,120,0.14); border: 1px solid rgba(0,200,120,0.6);
}
.mk-buy:hover { background: rgba(0,200,120,0.3); }
.mk-buy.nope, .mk-buy:disabled { cursor: default; opacity: 0.4; }
.mk-buy.fatto { color: rgba(224,208,255,0.7); background: rgba(112,56,248,0.12); border-color: rgba(112,56,248,0.4); }

/* Riga reroll */
.mk-reroll-riga { display: flex; justify-content: center; }
.mk-reroll {
    font-family: inherit; font-size: 0.8rem; cursor: pointer; padding: 8px 14px; letter-spacing: 0.5px;
    color: var(--info); background: rgba(0,200,255,0.12); border: 1px solid var(--info);
}
.mk-reroll:hover { background: rgba(0,200,255,0.28); }
.mk-reroll.nope, .mk-reroll:disabled { cursor: default; opacity: 0.4; }