/* ============================================================
   FinVize REDESIGN 2026-06 — sdílené komponenty (prefix rdx-)
   Vrstvený obsah, akordeony, kapitolová navigace, steppery,
   záložky scénářů, karty parametrů, sticky CTA, tooltipy.
   Závisí na CSS proměnných z css/style.css (:root).
   ============================================================ */

/* ---------- Progress bar čtení ---------- */
.rdx-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:2000;
  background:linear-gradient(90deg,var(--accent-blue),var(--accent-gold));
  transition:width .1s linear;pointer-events:none}

/* ---------- Kicker (malý nadpis sekce) ---------- */
.rdx-kicker{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent-blue-light);font-weight:600;margin-bottom:.3rem}

/* ---------- „V kostce" box ---------- */
.rdx-tldr{border:1px solid var(--border-light);background:rgba(201,168,76,.05);
  border-radius:14px;padding:1.2rem 1.4rem;margin:1.4rem 0}
.rdx-tldr-h{display:flex;align-items:center;gap:.5rem;font-weight:600;
  color:var(--accent-gold-light);font-size:.92rem;margin-bottom:.6rem}
.rdx-tldr ul{list-style:none;margin:0;padding:0}
.rdx-tldr li{padding:.22rem 0 .22rem 1.4rem;position:relative;font-size:.92rem;
  color:var(--text-secondary);line-height:1.6}
.rdx-tldr li::before{content:'◆';position:absolute;left:0;top:.42rem;
  color:var(--accent-gold);font-size:.6rem}

/* ---------- Akordeon (vrstva 3 — Do hloubky) ---------- */
details.rdx-acc{border:1px solid var(--border);border-radius:12px;margin:.7rem 0;
  background:var(--bg-card);overflow:hidden}
details.rdx-acc>summary{cursor:pointer;padding:.95rem 1.2rem;font-weight:500;
  font-size:.95rem;list-style:none;display:flex;justify-content:space-between;
  align-items:center;gap:1rem;transition:background .2s,color .2s;color:var(--text-primary)}
details.rdx-acc>summary::-webkit-details-marker{display:none}
details.rdx-acc>summary::after{content:'+';color:var(--accent-gold);font-size:1.3rem;
  font-weight:300;line-height:1;transition:transform .25s;flex-shrink:0}
details.rdx-acc[open]>summary::after{transform:rotate(45deg)}
details.rdx-acc[open]>summary{color:var(--accent-gold-light);border-bottom:1px solid var(--border)}
details.rdx-acc>summary:hover{background:rgba(74,123,255,.06)}
.rdx-acc-body{padding:1rem 1.2rem;font-size:.93rem;color:var(--text-secondary)}
.rdx-acc-body>p{margin-bottom:.8rem}
details.rdx-acc.rdx-warn>summary{color:#f5c8a0}
details.rdx-acc.rdx-warn{border-color:rgba(248,150,80,.25)}

/* ---------- Layout s kapitolovou boční navigací ---------- */
.rdx-layout{max-width:1100px;margin:0 auto;padding:1rem 2rem 4rem;
  display:grid;grid-template-columns:220px minmax(0,1fr);gap:3rem;position:relative;z-index:1}
.rdx-chapnav{position:sticky;top:90px;align-self:start;font-size:.85rem;max-height:calc(100vh - 110px);overflow:auto}
.rdx-chapnav-t{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-muted);margin:1.2rem 0 .6rem}
.rdx-chapnav-t:first-child{margin-top:0}
.rdx-chapnav a{display:block;color:var(--text-secondary);text-decoration:none;
  padding:.34rem .8rem;border-left:2px solid var(--border);transition:all .2s;line-height:1.45}
.rdx-chapnav a:hover{color:var(--text-primary)}
.rdx-chapnav a.rdx-act{color:var(--accent-gold-light);border-left-color:var(--accent-gold);
  background:rgba(201,168,76,.05)}
.rdx-article{max-width:680px;min-width:0}
@media(max-width:900px){.rdx-layout{grid-template-columns:1fr}.rdx-chapnav{display:none}}

/* ---------- Mapa kapitol (karty) ---------- */
.rdx-map{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:.9rem;margin:1.5rem 0}
.rdx-chap{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;
  padding:1.1rem 1.2rem;cursor:pointer;transition:all .25s;position:relative;
  text-decoration:none;color:var(--text-primary);display:block}
.rdx-chap:hover{border-color:var(--accent-gold);transform:translateY(-3px)}
.rdx-chap-num{font-family:'Playfair Display',serif;color:var(--accent-gold);font-size:1.05rem}
.rdx-chap h3{font-size:.98rem;margin:.2rem 0 .3rem;font-weight:600}
.rdx-chap small{color:var(--text-muted);font-size:.76rem;display:flex;gap:.8rem}
.rdx-chap .rdx-lvl{color:var(--accent-cyan)}
.rdx-chap.rdx-done::after{content:'✓';position:absolute;top:.8rem;right:.9rem;
  font-size:.85rem;color:var(--accent-green)}

/* ---------- Statline (3 čísla vedle sebe) ---------- */
.rdx-statline{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.8rem;margin:1.4rem 0}
.rdx-stat{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;
  padding:1rem;text-align:center}
.rdx-stat b{display:block;font-size:1.45rem;font-weight:700;color:var(--accent-gold-light)}
.rdx-stat span{font-size:.78rem;color:var(--text-muted);line-height:1.45;display:block;margin-top:.2rem}

/* ---------- Záložky (scénáře, alokace…) ---------- */
.rdx-tabs{display:flex;gap:.4rem;margin-bottom:1.2rem;flex-wrap:wrap}
.rdx-tab{padding:.55rem 1.2rem;border-radius:10px;border:1px solid var(--border);
  background:transparent;color:var(--text-secondary);font-family:inherit;font-size:.88rem;
  cursor:pointer;transition:all .2s}
.rdx-tab:hover{color:var(--text-primary);border-color:var(--accent-blue)}
.rdx-tab.rdx-on{border-color:var(--border-light);background:rgba(201,168,76,.08);
  color:var(--accent-gold-light);font-weight:600}
.rdx-tabpane{display:none}
.rdx-tabpane.rdx-on{display:block}
.rdx-tabpane.rdx-grid2.rdx-on{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:center}
@media(max-width:760px){.rdx-tabpane.rdx-grid2.rdx-on{grid-template-columns:1fr}}

/* ---------- Stepper „Jak to funguje" ---------- */
.rdx-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1rem;
  counter-reset:rdxs;margin:1.8rem 0 .5rem}
.rdx-step{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;
  padding:1.3rem 1.2rem 1.1rem;position:relative;counter-increment:rdxs}
.rdx-step::before{content:counter(rdxs);position:absolute;top:-14px;left:1rem;width:28px;
  height:28px;border-radius:50%;background:var(--gradient-gold);color:var(--bg-primary);
  font-weight:700;font-size:.85rem;display:flex;align-items:center;justify-content:center}
.rdx-step h4{font-size:.92rem;margin:.3rem 0;font-weight:600;color:var(--text-primary)}
.rdx-step p{font-size:.82rem;color:var(--text-secondary);line-height:1.55;margin:0}

/* ---------- Vhodný / nevhodný ---------- */
.rdx-fit{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.4rem 0}
.rdx-fitcard{border-radius:16px;padding:1.4rem;border:1px solid}
.rdx-fitcard.rdx-yes{border-color:rgba(74,222,128,.3);background:rgba(74,222,128,.05)}
.rdx-fitcard.rdx-no{border-color:rgba(248,113,113,.3);background:rgba(248,113,113,.05)}
.rdx-fitcard h4{margin:0 0 .7rem;font-size:1rem}
.rdx-fitcard.rdx-yes h4{color:var(--accent-green)}
.rdx-fitcard.rdx-no h4{color:var(--accent-red)}
.rdx-fitcard ul{list-style:none;margin:0;padding:0}
.rdx-fitcard li{padding:.28rem 0 .28rem 1.5rem;position:relative;font-size:.9rem;
  color:var(--text-secondary);line-height:1.55}
.rdx-fitcard.rdx-yes li::before{content:'✓';position:absolute;left:0;color:var(--accent-green)}
.rdx-fitcard.rdx-no li::before{content:'✕';position:absolute;left:0;color:var(--accent-red)}
@media(max-width:760px){.rdx-fit{grid-template-columns:1fr}}

/* ---------- Karta parametrů produktu ---------- */
.rdx-params{background:var(--bg-card-solid);border:1px solid var(--border-light);
  border-radius:18px;padding:1.5rem;box-shadow:0 10px 50px rgba(0,0,0,.4)}
.rdx-params-t{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-muted);margin-bottom:1rem}
.rdx-prow{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;
  border-bottom:1px solid rgba(255,255,255,.05);font-size:.92rem}
.rdx-prow:last-of-type{border-bottom:none}
.rdx-prow span{color:var(--text-secondary)}
.rdx-prow b{font-weight:600;text-align:right;color:var(--text-primary)}
.rdx-prow b.rdx-gold{color:var(--accent-gold-light)}
.rdx-riskbar{display:flex;gap:4px;margin-top:1rem}
.rdx-riskbar i{flex:1;height:6px;border-radius:3px;background:rgba(160,168,208,.2)}
.rdx-riskbar i.rdx-on{background:var(--gradient-gold)}
.rdx-riskcap{display:flex;justify-content:space-between;font-size:.7rem;
  color:var(--text-muted);margin-top:.3rem}

/* ---------- Odznaky ---------- */
.rdx-badges{display:flex;gap:.5rem;margin-top:1.2rem;flex-wrap:wrap}
.rdx-badge{font-size:.74rem;border:1px solid var(--border);border-radius:99px;
  padding:.25rem .8rem;color:var(--text-secondary)}
.rdx-badge.rdx-gold{border-color:var(--border-light);color:var(--accent-gold-light)}

/* ---------- Sticky CTA lišta ---------- */
.rdx-sticky-cta{position:fixed;bottom:0;left:0;right:0;background:rgba(10,16,48,.92);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-top:1px solid var(--border-light);padding:.8rem 2rem;display:flex;
  justify-content:space-between;align-items:center;gap:1rem;z-index:900;
  transform:translateY(110%);transition:transform .35s}
.rdx-sticky-cta.rdx-show{transform:translateY(0)}
.rdx-sticky-info{font-size:.85rem;color:var(--text-secondary);min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rdx-sticky-info b{color:var(--accent-gold-light)}
.rdx-sticky-btns{display:flex;gap:.7rem;flex-shrink:0}
body.rdx-has-sticky{padding-bottom:74px}
@media(max-width:640px){.rdx-sticky-info{display:none}.rdx-sticky-cta{justify-content:center}}

/* ---------- Slovníčkový tooltip ---------- */
.rdx-gl{border-bottom:1px dotted var(--accent-gold);cursor:help;position:relative;
  color:var(--text-primary)}
.rdx-gl:hover::after,.rdx-gl:focus::after{content:attr(data-tip);position:absolute;
  bottom:130%;left:50%;transform:translateX(-50%);background:var(--bg-card-solid);
  border:1px solid var(--border-light);color:var(--text-secondary);font-size:.78rem;
  line-height:1.5;padding:.6rem .8rem;border-radius:10px;width:min(260px,70vw);z-index:120;
  box-shadow:0 8px 30px rgba(0,0,0,.5);white-space:normal}

/* ---------- Navigace mezi kapitolami ---------- */
.rdx-next{display:flex;justify-content:space-between;margin-top:3rem;gap:1rem}
.rdx-next a{flex:1;background:var(--bg-card);border:1px solid var(--border);
  border-radius:12px;padding:.9rem 1.1rem;text-decoration:none;color:var(--text-primary);
  font-size:.9rem;transition:border-color .2s}
.rdx-next a:hover{border-color:var(--accent-gold)}
.rdx-next a small{display:block;color:var(--text-muted);font-size:.72rem}
.rdx-next a.rdx-fwd{text-align:right;border-color:var(--border-light)}

/* ---------- Mřížka karet (služby, kalkulačky, rozcestníky) ---------- */
.rdx-cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;margin:1.5rem 0}
.rdx-gcard{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;
  padding:1.4rem;transition:all .25s;cursor:pointer;text-decoration:none;color:var(--text-primary);display:block}
.rdx-gcard:hover{border-color:var(--accent-gold);transform:translateY(-3px);box-shadow:var(--shadow-card)}
.rdx-gcard h3{font-size:1.02rem;margin:.5rem 0 .4rem;font-weight:600}
.rdx-gcard p{font-size:.86rem;color:var(--text-secondary);line-height:1.55;margin:0}
.rdx-gcard .rdx-gfor{display:block;margin-top:.7rem;font-size:.74rem;color:var(--accent-cyan)}
.rdx-gcard.rdx-open{border-color:var(--accent-gold)}
.rdx-gicon{width:38px;height:38px;border-radius:10px;background:rgba(74,123,255,.12);
  display:flex;align-items:center;justify-content:center}
.rdx-gicon svg{width:20px;height:20px;stroke:var(--accent-blue-light);fill:none;stroke-width:1.8}

/* ---------- Detail služby (rozbalovací panel pod mřížkou) ---------- */
.rdx-svc-detail{grid-column:1/-1;background:var(--bg-card-solid);border:1px solid var(--border-light);
  border-radius:16px;padding:1.8rem;display:none;animation:rdxFade .3s}
.rdx-svc-detail.rdx-on{display:block}
@keyframes rdxFade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---------- Užší textový sloupec pro dlouhé texty ---------- */
.rdx-prose{max-width:70ch}

/* ---------- SVG ikonky inline ---------- */
.rdx-i{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;
  vertical-align:-3px;flex-shrink:0}

/* ---------- Tlačítka ---------- */
.rdx-btn{padding:.6rem 1.4rem;border-radius:10px;font-size:.88rem;font-weight:600;
  text-decoration:none;cursor:pointer;border:1px solid var(--border);
  color:var(--text-primary);background:transparent;display:inline-block;
  font-family:inherit;transition:all .2s}
.rdx-btn:hover{border-color:var(--accent-blue);transform:translateY(-1px)}
.rdx-btn.rdx-gold{background:var(--gradient-gold);color:var(--bg-primary);border:none;
  box-shadow:var(--shadow-gold)}
.rdx-btn.rdx-gold:hover{opacity:.92}

/* ---------- Scénáře jako záložky: karta přes celou šířku ---------- */
.scenarios-grid .scenario-card.rdx-tabpane{margin:0;max-width:none}
