/* ==========================================================================
   MOK gomb-linkek (.mok-btn) — a HUGERTE „Gomb beszúrása" (mokbutton) plugin
   által a szerkesztett törzsekbe (cikk, oldal, esemény, kedvezmény, …)
   beszúrt CTA-linkek stílusa.

   Miért saját osztály, és nem a meglévő .btn / .btn-primary?
   A publikus CSS-ben a gomb-osztályok csak bizonyos konténerekben élnek
   (`.aloldal-wrap .btn`, `.cms-content a.btn` — utóbbi a `.btn-secondary`-t
   is kékre festené), a `.btn-primary` pedig belső `.btn-label` span-t vár.
   A `.mok-btn` konténer-független, így a HUGERTE szerkesztő-iframe-ben
   (content_css) és bármely publikus nézetben ugyanúgy néz ki.

   Színek: a márka-változók (styles.css :root), fallbackkel — a szerkesztő
   iframe-jében nincsenek definiálva.

   Specificitás: az `a.mok-btn:link` (0,2,1) felülírja a törzs-linkek
   `.cms-content a` / `.article-body a` (0,1,1) színszabályát.
   ========================================================================== */
a.mok-btn,
a.mok-btn:link,
a.mok-btn:visited {
  display: inline-block;
  padding: 10px 22px;
  border: 2px solid var(--mok-blue, #1c2481);
  border-radius: 4px;
  background: var(--mok-blue, #1c2481);
  color: #fff;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
a.mok-btn:hover,
a.mok-btn:focus-visible {
  background: var(--mok-blue-dark, #141b66);
  border-color: var(--mok-blue-dark, #141b66);
  color: #fff;
  text-decoration: none;
}
a.mok-btn:focus-visible {
  outline: 2px solid var(--mok-blue, #1c2481);
  outline-offset: 2px;
}

/* Másodlagos — krém háttér, kék felirat. */
a.mok-btn.mok-btn--secondary,
a.mok-btn.mok-btn--secondary:link,
a.mok-btn.mok-btn--secondary:visited {
  background: var(--mok-cream, #f0e8df);
  border-color: var(--mok-cream, #f0e8df);
  color: var(--mok-blue, #1c2481);
}
a.mok-btn.mok-btn--secondary:hover,
a.mok-btn.mok-btn--secondary:focus-visible {
  background: var(--mok-cream-dark, #e4d9cc);
  border-color: var(--mok-cream-dark, #e4d9cc);
  color: var(--mok-blue-dark, #141b66);
}

/* Körvonalas — átlátszó háttér, kék keret és felirat. */
a.mok-btn.mok-btn--outline,
a.mok-btn.mok-btn--outline:link,
a.mok-btn.mok-btn--outline:visited {
  background: transparent;
  border-color: var(--mok-blue, #1c2481);
  color: var(--mok-blue, #1c2481);
}
a.mok-btn.mok-btn--outline:hover,
a.mok-btn.mok-btn--outline:focus-visible {
  background: #eef0ff;
  color: var(--mok-blue-dark, #141b66);
}