/* ============================================================
   Edge Pilot product page — ÜGYNÖK 2 szekcióinak stílusa.
   Hatókör: csak az .epj-* osztályok (szabálykönyv-nap, napló,
   szabálykövetés-mérés, import-legenda, csomag-listák, FAQ,
   coach-keret). A hero / workflow / mintapélda szekciókat és az
   interaktív MT5 demót (.gs-*, .tm-*, .h-autopilot, .ep-demo)
   EZ A FÁJL SEMMILYEN FORMÁBAN NEM ÉRINTI.
   Tokenek és alaposztályok a lab.css / public-edge-demo.css
   készletéből: --line, --mint, --coral, --muted-1, --mono,
   .shell, .section-*, .cap-card, .p-details, .reveal.
   ============================================================ */

/* --- Közös szekció-ritmus, a .workflow (104/116) mintájára --- */
.epj { padding: 104px 0 116px; }
.epj .section-head { max-width: 760px; }

/* ============================================================
   1) Szabálykönyv-nap: jóváhagyott szabályverzió + egy nap
      ellenőrzései (push-értesítések illusztrációval)
   ============================================================ */
.epj-day { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 22px; align-items: start; }

/* Jóváhagyott szabálykötet — csak a felhasználó hagyhatja jóvá */
.epj-rules { padding: 26px 26px 22px; border: 1px solid var(--line); border-radius: 7px; background: #081426; }
.epj-rules__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.epj-rules__head > span { color: var(--muted-1); font: 500 9px/1.3 var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.epj-rules__ver { padding: 5px 9px; border: 1px solid rgba(103, 232, 249, .3); border-radius: 99px; color: var(--mint); font: 600 9px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.epj-rules__list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.epj-rules__list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; align-items: center; column-gap: 12px; row-gap: 5px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 8px; background: rgba(2, 8, 20, .5); }
.epj-rules__list b { color: #dbe7f1; font-size: 12.5px; font-weight: 500; line-height: 1.3; }
.epj-rules__list .epj-val { grid-row: span 2; color: #eaf4fb; font: 600 15px/1 var(--mono); white-space: nowrap; }
.epj-badge { justify-self: start; padding: 3px 7px; border-radius: 4px; font: 600 8px/1.5 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.epj-badge--stop { color: #075985; background: rgba(103, 232, 249, .75); }
.epj-badge--pause { color: #4a3208; background: rgba(232, 180, 90, .8); }
.epj-badge--flag { color: var(--muted-1); background: rgba(147, 169, 189, .16); }
.epj-rules__foot { display: flex; align-items: center; gap: 8px; margin: 14px 0 0; color: #71879a; font-size: 11.5px; line-height: 1.55; }
.epj-rules__foot::before { content: '\1F512'; font-size: 10px; }

/* Egy nap ellenőrzései: idővonal + értesítés-kártyák */
.epj-timeline { position: relative; display: grid; gap: 14px; padding-left: 30px; }
.epj-timeline::before { content: ''; position: absolute; left: 9px; top: 8px; bottom: 8px; width: 2px; border-radius: 2px; background: linear-gradient(180deg, rgba(103, 232, 249, .05), rgba(103, 232, 249, .3), rgba(255, 128, 102, .55)); }
.epj-event { position: relative; }
.epj-event::before { content: ''; position: absolute; left: -27px; top: 16px; width: 8px; height: 8px; border-radius: 99px; background: #0b1c33; border: 2px solid var(--mint); }
.epj-event.is-warn::before { border-color: #e8b45a; }
.epj-event.is-alert::before { border-color: var(--coral); box-shadow: 0 0 10px rgba(255, 128, 102, .5); }
.epj-channels { margin: 4px 0 0; color: #71879a; font-size: 11.5px; line-height: 1.6; }
.epj-note { padding: 13px 15px; border: 1px solid var(--line); border-radius: 9px; background: rgba(8, 20, 38, .78); }
.epj-note__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
.epj-note__head b { display: flex; align-items: center; gap: 7px; color: #e2edf5; font-size: 12px; font-weight: 600; }
.epj-note__head time { color: #71879a; font: 500 10px/1 var(--mono); }
.epj-note p { margin: 0; color: var(--muted-1); font-size: 12px; line-height: 1.55; }
.epj-note__pill { flex: none; padding: 2px 7px; border-radius: 99px; font: 600 8px/1.6 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.epj-pill--info { color: var(--mint); background: rgba(103, 232, 249, .12); }
.epj-pill--warn { color: #e8b45a; background: rgba(232, 180, 90, .12); }
.epj-pill--alert { color: #ffb3a3; background: rgba(255, 128, 102, .16); }
.epj-note.is-alert { border-color: rgba(255, 128, 102, .38); box-shadow: 0 14px 30px -24px rgba(255, 128, 102, .7); }

/* MT5-sor: ki figyelmeztet és ki tilt */
.epj-mt5 { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 16px; margin-top: 22px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 9px; background: rgba(8, 20, 38, .5); }
.epj-mt5 p { flex: 1 1 340px; margin: 0; color: var(--muted-1); font-size: 12.5px; line-height: 1.65; }
.epj-mt5 p b { color: #dce8f2; font-weight: 600; }
.epj-mt5 small { display: block; margin-top: 6px; color: #71879a; font-size: 11px; line-height: 1.55; }
.epj-plan-chip { flex: none; display: inline-flex; flex-direction: column; gap: 3px; min-width: 128px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: rgba(2, 8, 20, .45); }
.epj-plan-chip b { color: #9cc3d8; font: 600 9px/1.4 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.epj-plan-chip span { color: var(--muted-1); font-size: 11px; line-height: 1.45; }
.epj-plan-chip--expert { border-color: rgba(103, 232, 249, .35); }
.epj-plan-chip--expert b { color: var(--mint); }

/* ============================================================
   2) Napló: kötés + érzelmi/fókusz jegyzet + csatolt grafikonkép
   ============================================================ */
.epj-journal { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); gap: 22px; align-items: start; }

/* Illusztrív naplóbejegyzés (minta, aria-hidden) */
.epj-entry { padding: 22px 22px 18px; border: 1px solid var(--line); border-radius: 9px; background: #081426; }
.epj-entry__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.epj-entry__id { display: flex; align-items: center; gap: 8px; }
.epj-entry__id b { color: #e8f1f8; font-size: 13px; font-weight: 600; }
.epj-dir { padding: 3px 8px; border-radius: 5px; font: 600 9px/1.5 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.epj-dir--long { color: #6ee7b7; background: rgba(110, 231, 183, .12); }
.epj-r { color: #6ee7b7; font: 600 14px/1 var(--mono); }
.epj-entry dl { display: grid; gap: 7px; margin: 0 0 13px; }
.epj-entry dl div { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: 10px; align-items: baseline; }
.epj-entry dt { color: #71879a; font: 500 9px/1.5 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.epj-entry dd { margin: 0; color: #c6d6e3; font-size: 12px; line-height: 1.55; }
.epj-moods { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; padding: 0; list-style: none; }
.epj-mood { padding: 4px 9px; border: 1px solid var(--line); border-radius: 99px; color: #7f9ab2; font-size: 10.5px; line-height: 1.4; }
.epj-mood.is-set { border-color: rgba(103, 232, 249, .45); color: var(--mint); background: rgba(103, 232, 249, .08); }
.epj-attach { display: flex; align-items: center; gap: 13px; padding: 11px 13px; border: 1px dashed rgba(147, 169, 189, .35); border-radius: 9px; background: rgba(2, 8, 20, .4); }
.epj-attach__chart { flex: none; width: 92px; height: 54px; }
.epj-attach__meta b { display: block; color: #c6d6e3; font-size: 11.5px; font-weight: 500; }
.epj-attach__meta span { color: #71879a; font: 500 9.5px/1.6 var(--mono); }

/* Valódi termékfotó: napi brókernap (terv + áttekintés) */
.epj-dailycap { margin: 0; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: #081426; }
.epj-dailycap img { display: block; width: 100%; height: auto; }
.epj-dailycap figcaption { padding: 12px 16px; color: #7f9ab2; font-size: 11.5px; line-height: 1.6; border-top: 1px solid var(--line); }
.epj-journal-facts { display: grid; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.epj-journal-facts li { position: relative; padding: 12px 14px 12px 38px; border: 1px solid var(--line); border-radius: 8px; background: rgba(8, 20, 38, .5); color: var(--muted-1); font-size: 12px; line-height: 1.6; }
.epj-journal-facts li b { color: #dce8f2; font-weight: 600; }
.epj-journal-facts li::before { position: absolute; left: 14px; top: 12px; color: var(--mint); font: 600 11px/1.6 var(--mono); }
.epj-journal-facts li:nth-child(1)::before { content: '01'; }
.epj-journal-facts li:nth-child(2)::before { content: '02'; }
.epj-journal-facts li:nth-child(3)::before { content: '03'; }

/* ============================================================
   3) Szabálykövetés mérése: folyamat-pontszám + szabályonkénti
      radar (saját szabályok betartása, nem profit)
   ============================================================ */
.epj-disc { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); gap: 22px; align-items: stretch; }
.epj-panel { position: relative; padding: 24px; border: 1px solid var(--line); border-radius: 9px; background: #081426; }
.epj-panel__tag { position: absolute; top: 18px; right: 18px; padding: 3px 8px; border: 1px solid rgba(147, 169, 189, .3); border-radius: 99px; color: #7f9ab2; font: 600 8px/1.6 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.epj-gauge { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center; }
.epj-gauge svg { width: min(100%, 250px); height: auto; }
.epj-gauge__num { margin-top: -58px; color: #eaf4fb; font: 600 46px/1 var(--mono); letter-spacing: -.03em; }
.epj-gauge__num small { color: #7f9ab2; font-size: 16px; font-weight: 500; }
.epj-gauge__label { color: #9cc3d8; font: 500 10px/1.6 var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.epj-gauge__cap { max-width: 300px; margin: 8px 0 0; color: var(--muted-1); font-size: 12px; line-height: 1.6; }
.epj-radar { display: flex; flex-direction: column; gap: 12px; }
.epj-radar svg { width: min(100%, 380px); margin: 0 auto; height: auto; }
.epj-radar figcaption { margin: auto 0 0; color: #7f9ab2; font-size: 11.5px; line-height: 1.6; }
.epj-disc-note { display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; padding: 14px 16px; border: 1px solid rgba(103, 232, 249, .22); border-radius: 9px; background: rgba(103, 232, 249, .05); color: #b9cfe0; font-size: 12.5px; line-height: 1.65; }
.epj-disc-note::before { content: '\25CF'; flex: none; margin-top: 3px; color: var(--mint); font-size: 9px; }

/* ============================================================
   4) Integráció-legenda: a három kapcsolódási mód
   ============================================================ */
.epj-import-legend { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: -18px 0 34px; }
.epj-import-legend > div { padding: 14px 16px; border: 1px solid var(--line); border-radius: 8px; background: rgba(8, 20, 38, .5); }
.epj-import-legend b { display: block; margin-bottom: 5px; color: #9cc3d8; font: 600 10px/1.5 var(--mono); letter-spacing: .11em; text-transform: uppercase; }
.epj-import-legend p { margin: 0; color: var(--muted-1); font-size: 11.5px; line-height: 1.6; }

/* ============================================================
   5) Csomagok: Pro/Expert listák + FAQ
   ============================================================ */
.epj-plan-list { display: grid; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; text-align: left; }
.epj-plan-list li { position: relative; padding-left: 24px; color: var(--muted-1); font-size: 12.5px; line-height: 1.55; }
.epj-plan-list li::before { content: '\2713'; position: absolute; left: 2px; top: 0; color: var(--mint); font: 600 11px/1.7 var(--mono); }
.epj-plan-list li.is-muted::before { content: '\2013'; color: #71879a; }
.epj-only { display: inline-block; margin-left: 8px; padding: 2px 7px; border-radius: 4px; color: #075985; background: rgba(103, 232, 249, .75); font: 700 8px/1.6 var(--mono); letter-spacing: .1em; text-transform: uppercase; vertical-align: 1px; }
.epj-faq { display: grid; gap: 10px; margin: 44px 0 0; }
.epj-faq-title { margin: 0 0 6px; color: #9cc3d8; font: 500 10px/1.5 var(--mono); letter-spacing: .14em; text-transform: uppercase; }

/* ============================================================
   6) Coach napi keret
   ============================================================ */
.epj-coach-frame { margin-top: 6px; color: #7f9ab2; }

/* ============================================================
   Reszponzív törések
   ============================================================ */
@media (max-width: 1020px) {
    .epj-day, .epj-journal, .epj-disc { grid-template-columns: minmax(0, 1fr); }
    .epj-import-legend { grid-template-columns: minmax(0, 1fr); margin-top: -8px; }
}
@media (max-width: 640px) {
    .epj { padding: 72px 0 80px; }
    .epj-rules, .epj-entry, .epj-panel { padding: 18px 16px 16px; }
    .epj-timeline { padding-left: 24px; }
    .epj-event::before { left: -21px; }
    .epj-entry dl div { grid-template-columns: 106px minmax(0, 1fr); }
    .epj-gauge__num { margin-top: -44px; font-size: 38px; }
    .epj-mt5 { padding: 15px 16px; }
    .epj-plan-chip { min-width: 100%; }
}