/* EB Engagement Missions — namespaced, ~2 KB, no framework. */
.eb-m { margin: 1.5em 0; font-size: 1rem; }
.eb-m-card {
  border: 1px solid #e5e7eb; border-radius: 12px; padding: 1.25em 1.5em;
  margin: 1em 0; background: #fff;
}
.eb-m-card h2, .eb-m-card h3 { margin-top: 0; }
/* Readable body text inside cards — the theme shrinks bare <p>/<span> here. */
.eb-m-card p { font-size: 1.05rem; line-height: 1.6; }
.eb-m-check-row span { font-size: 1rem; line-height: 1.5; }
/* Extra selectors + resets so the theme's giant pill button styling
   (uppercase, huge padding, full-width, theme accent) never wins on our
   form submit button (2026-07-18: "Kérem a kihívást" rendered as an
   oversized theme pill). */
.eb-m .eb-m-btn,
.eb-m button.eb-m-btn,
.eb-m form button.eb-m-btn {
  display: inline-block; background: #E8871A !important; color: #fff !important;
  border: none !important; border-radius: 8px !important;
  padding: 0.6em 1.4em !important; font-weight: 700;
  cursor: pointer; text-decoration: none; font-size: 1rem !important;
  width: auto !important; min-height: 0 !important; line-height: 1.3 !important;
  text-transform: none !important; letter-spacing: normal !important;
  box-shadow: none !important;
}
.eb-m-btn:hover, .eb-m-btn:focus { background: #c96f0e !important; }
.eb-m-btn:focus-visible { outline: 3px solid #111827; outline-offset: 2px; }
.eb-m-btn[disabled] { opacity: 0.6; cursor: default; }
.eb-m-progress {
  background: #e5e7eb; border-radius: 6px; height: 10px; overflow: hidden;
}
.eb-m-progress-fill { display: block; height: 100%; background: #E8871A; }
.eb-m-progress-label { color: #6b7280; font-size: 0.85em; margin: 0.3em 0 0.8em; }
.eb-m-readbar {
  position: relative; border: 1px solid #e5e7eb; border-radius: 8px;
  padding: 0.7em 1em; margin: 1.2em 0; background: #f9fafb; overflow: hidden;
}
.eb-m-readbar-fill {
  position: absolute; left: 0; top: 0; bottom: 0; width: 0;
  background: rgba(232, 135, 26, 0.15); transition: width 1s linear;
}
.eb-m-readbar-label { position: relative; z-index: 1; font-size: 0.9em; }
.eb-m-readbar-complete { border-color: #16a34a; }
.eb-m-question { border: none; margin: 1em 0; padding: 0; }
.eb-m-question legend {
  font-weight: 700; margin-bottom: 0.5em; font-size: 1.15rem !important;
  line-height: 1.4;
}
/* Same theme-override treatment as .eb-m-btn (2026-07-20: quiz answer
   buttons rendered as huge uppercase theme pills, same root cause as the
   2026-07-18 submit-button fix — the theme's default <button> styling
   was never neutralized here). background/color stay non-!important so
   .eb-m-correct/.eb-m-incorrect (below, later in cascade) can still win. */
.eb-m-option {
  display: block; width: 100% !important; text-align: left; margin: 0.4em 0;
  padding: 0.6em 0.9em !important; border: 1px solid #d1d5db; border-radius: 8px !important;
  background: #fff; color: #111827; cursor: pointer;
  font-size: 1rem !important; font-weight: 400 !important;
  text-transform: none !important; letter-spacing: normal !important;
  line-height: 1.4 !important; box-shadow: none !important; min-height: 0 !important;
}
.eb-m-option:hover, .eb-m-option:focus { border-color: #E8871A; }
.eb-m-option:focus-visible { outline: 3px solid #111827; outline-offset: 1px; }
.eb-m-correct { border-color: #16a34a; background: #f0fdf4; }
.eb-m-incorrect { border-color: #dc2626; background: #fef2f2; }
.eb-m-explain {
  background: #f9fafb; border-left: 4px solid #E8871A; padding: 0.6em 0.9em;
  margin: 0.6em 0; font-size: 1rem !important; line-height: 1.5;
}
.eb-m-done { color: #16a34a; font-weight: 700; }
/* Path a challenge email deep-linked to (/kuldetesek/?ut=<path>): draw the
   eye so the visitor continues their flow instead of re-choosing. */
.eb-m-focus {
  border-color: #E8871A; box-shadow: 0 0 0 3px rgba(232, 135, 26, 0.18);
}
/* Deep-linked "mai küldetés" block pinned to the top of the hub. */
.eb-m-stepfocus { margin: 0 0 1.5em; }
.eb-m-eyebrow {
  margin: 0 0 0.3em; font-size: 0.8rem; font-weight: 700; letter-spacing: .4px;
  text-transform: uppercase; color: #E8871A;
}
.eb-m-chosen { border-color: #E8871A; background: #fff7ed; }
/* DCA illustrator inputs + result. */
.eb-m-dca-field {
  display: block; font-size: 0.95rem; font-weight: 600; margin: 0.8em 0 0.2em;
}
.eb-m-dca-field .eb-m-input { margin-top: 0.3em; font-weight: 400; }
.eb-m-dca-result { margin-top: 0.6em; }
.eb-m-dca-row {
  margin: 0.3em 0; padding: 0.4em 0.7em; background: #f9fafb; border-radius: 6px;
  font-size: 1rem; line-height: 1.5;
}
.eb-m-check-row {
  display: flex; gap: 0.6em; align-items: flex-start; margin: 0.5em 0;
  cursor: pointer;
}
.eb-m-check-row input { margin-top: 0.3em; }
.eb-m-input {
  display: block; width: 100%; max-width: 24em; padding: 0.55em 0.8em;
  border: 1px solid #d1d5db; border-radius: 8px; margin: 0.8em 0; font-size: 1em;
}
.eb-m-msg { font-size: 0.92em; color: #374151; min-height: 1.2em; }
.eb-m-xp { color: #6b7280; }
.eb-m-visually-hidden {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
@media (max-width: 480px) {
  .eb-m-card { padding: 1em; }
}