/* ============================================================================
   mds-hub-feed.css · „Teme de investiții” în feedul contului (lot 28)
   Cardurile sunt cele de pe pagina Acțiuni (mds-hub.css, modelul „Afiș”), puse pe o bandă
   care se derulează. Paginile pluginului nu au clasa .mdsx, deci jetoanele se pun aici.
   Mărimi de text: 13.5/20, 15.5/22, 15.5/24, 21.5/28, 25/30.
   ============================================================================ */
.xhb.xhb-fr{ --e-s1:#141416; --e-s2:#1c1c1f; --e-s3:#242428; --e-ink:#f5f3f0; --e-ink2:#9c9a96; --e-ink3:#7d7a74; --e-hair:rgba(255,255,255,.07); --g1:#f4212e; --g5:#00ba7c; --lk:#1d9bf0; --xf:var(--ec-f, 'Hanken Grotesk', system-ui, sans-serif);
  position:relative; margin:8px 0 28px; padding:24px 0 4px; border-top:1px solid var(--e-hair); color:var(--e-ink); font-family:var(--xf); }

/* antetul: titlul, fraza și săgețile (doar cu mouse) */
.xhb-fr__h{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:16px; }
.xhb-fr .xhb-fr__h h2{ margin:0; color:var(--e-ink); font:700 21.5px/28px var(--xf); letter-spacing:-.015em; }
.xhb-fr .xhb-fr__h p{ margin:4px 0 0; color:var(--e-ink2); font:400 13.5px/20px var(--xf); }
.xhb-fr__n{ display:flex; gap:8px; flex:none; }
.xhb-fr__n button{ display:grid; place-items:center; width:36px; height:36px; padding:0; border:0; border-radius:50%; background:var(--e-s2); color:var(--e-ink); cursor:pointer; transition:background .15s, opacity .15s; }
.xhb-fr__n button:hover{ background:var(--e-s3); }
.xhb-fr__n button:disabled{ opacity:.35; cursor:default; }
.xhb-fr__n button:focus-visible{ outline:2px solid var(--lk); outline-offset:2px; }
.xhb-fr__n svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.xhb-fr__n button + button svg{ transform:scaleX(-1); }
@media (hover:none){ .xhb-fr__n{ display:none; } }

/* banda */
.xhb-fr__r{ display:flex; gap:12px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; }
.xhb-fr__r::-webkit-scrollbar{ display:none; }
.xhb-fr .xhb-fr__r > .xhb-th.xhb-tc{ display:flex; flex:0 0 216px; min-height:304px; padding:20px; scroll-snap-align:start; }
.xhb-fr .xhb-tc__k strong{ font-size:25px; line-height:30px; }
.xhb-fr .xhb-tc__d{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.xhb-fr .xhb-tc__c em{ white-space:nowrap; }

/* „Ai 3 companii aici”: sus pe card, pe sticlă */
.xhb-fr__w{ position:absolute; top:14px; left:14px; z-index:1; display:inline-flex; align-items:center; height:28px; padding:0 12px; border-radius:999px; background:rgba(11,11,13,.55); -webkit-backdrop-filter:blur(14px) saturate(1.4); backdrop-filter:blur(14px) saturate(1.4); color:#f5f3f0; font:600 13.5px/1 var(--xf); white-space:nowrap; }
.xhb-tc:not(.xhb-tc--ph) .xhb-fr__w{ background:var(--e-s3); }

.xhb-fr__all{ margin-top:14px; font-size:15.5px; }

/* pe telefon banda iese până la marginea ecranului (24 px, ca restul paginii) */
@media (max-width:992px){
  .xhb-fr__r{ margin:0 calc(-1 * var(--ec-gut, 24px)); padding:0 var(--ec-gut, 24px); scroll-padding:0 var(--ec-gut, 24px); }
  .xhb-fr .xhb-fr__r > .xhb-th.xhb-tc{ flex-basis:72%; max-width:300px; min-height:300px; }
}
@media (prefers-reduced-motion:reduce){ .xhb-fr__r{ scroll-behavior:auto; } }

/* „Face parte din temele” pe pagina unei știri (lot 28): rânduri ca în setările telefonului */
.xhb.xhb-nt{ --e-s1:#141416; --e-s2:#1c1c1f; --e-s3:#242428; --e-ink:#f5f3f0; --e-ink2:#9c9a96; --e-ink3:#7d7a74; --e-hair:rgba(255,255,255,.07); --xf:var(--ec-f, 'Hanken Grotesk', system-ui, sans-serif);
  margin:32px 0 0; color:var(--e-ink); font-family:var(--xf); }
.xhb-nt__l{ overflow:hidden; border-radius:20px; background:var(--e-s1); }
.xhb-nt__r{ position:relative; display:flex; align-items:center; gap:12px; min-height:68px; padding:12px 16px; color:var(--e-ink) !important; text-decoration:none !important; transition:background .15s; }
.xhb-nt__r + .xhb-nt__r::before{ content:""; position:absolute; top:0; left:72px; right:0; height:1px; background:var(--e-hair); }
.xhb-nt__r:hover{ background:var(--e-s2); }
.xhb-nt__r:focus-visible{ outline:2px solid #1d9bf0; outline-offset:-2px; }
.xhb-nt__i{ display:grid; place-items:center; width:44px; height:44px; flex:none; overflow:hidden; border-radius:12px; background:var(--e-s3); }
.xhb-nt__i img{ width:100%; height:100%; object-fit:cover; }
.xhb-nt__i b{ color:var(--e-ink2); font:600 15.5px/1 var(--xf); }
.xhb-nt__t{ flex:1; min-width:0; }
.xhb-nt__t b{ display:block; overflow:hidden; font:600 15.5px/22px var(--xf); white-space:nowrap; text-overflow:ellipsis; }
.xhb-nt__t small{ display:block; overflow:hidden; color:var(--e-ink3); font:400 13.5px/20px var(--xf); white-space:nowrap; text-overflow:ellipsis; }
.xhb-nt__v{ flex:none; text-align:right; }
.xhb-nt__v b{ display:block; font:600 15.5px/22px var(--xf); font-variant-numeric:tabular-nums; }
.xhb-nt__v small{ display:block; color:var(--e-ink3); font:400 13.5px/20px var(--xf); }
.xhb-nt .xhb-up{ color:#00ba7c; } .xhb-nt .xhb-dn{ color:#f4212e; } .xhb-nt .xhb-fl{ color:var(--e-ink2); }
.xhb-nt__c{ width:16px; height:16px; flex:none; fill:none; stroke:var(--e-ink3); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:992px){ .xhb-nt__r{ padding:12px 14px; } .xhb-nt__r + .xhb-nt__r::before{ left:70px; } }
.xhb.xhb-nt{ display:block; width:100%; }