/* =====================================================================
   magus_ui.css — KÖZÖS UI-séma (fokozatosan bővül).
   Cél: általános gomb/fejléc-séma minden oldalon, DE nem teljes azonosság
   (az oldal-specifikus tartalom és akcentus-szín megmarad).
   Betöltés: <link rel="stylesheet" href="magus_ui.css?v=N">
   API-változáskor a ?v=N-t bumpolni kell (cache).
   ===================================================================== */

/* --- Közös gomb-séma ------------------------------------------------- */
.mg-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.12);
    color: #e2e8f0;
    font-family: inherit; font-size: .75rem; line-height: 1;
    padding: .35rem .8rem; border-radius: .45rem;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    transition: background .15s, border-color .15s, color .15s;
}
.mg-btn:hover { background: rgba(255,255,255,.08); }

/* Akcentus-variánsok (oldalanként a megfelelő) */
.mg-btn--gold   { color: #d4af37; border-color: rgba(212,175,55,.3); }
.mg-btn--gold:hover   { background: rgba(212,175,55,.1);  border-color: rgba(212,175,55,.5); }

.mg-btn--purple { color: #c084fc; border-color: rgba(168,85,247,.3); }
.mg-btn--purple:hover { background: rgba(168,85,247,.12); border-color: rgba(168,85,247,.5); }

.mg-btn--green  { color: #34d399; border-color: rgba(16,185,129,.3); }
.mg-btn--green:hover  { background: rgba(16,185,129,.1); border-color: rgba(16,185,129,.5); }

.mg-btn--danger {
    color: #f87171;
    background: rgba(248,113,113,.08);
    border-color: rgba(248,113,113,.25);
}
.mg-btn--danger:hover { background: rgba(248,113,113,.16); border-color: rgba(248,113,113,.45); }