/* ============================================================================
   mds-piete.css · paginile de piață: Valute, Mărfuri (lot 191)
   ⚠ Se încarcă după mds-hub.css și folosește aceleași jetoane și aceleași piese
     (antet, bandă de cifre, carduri de brokeri, întrebări). Aici sunt doar piesele noi.
     Mărimi: 13.5 / 15.5 / 20 / 25 / 30 (telefon 25), colțuri 20px, interior 28px 32px.
   ============================================================================ */

/* steagurile: dreptunghi 4:3 cu colțuri mici, nu cerc */
.xpt .xpt-fl{ display:inline-block; flex:none; width:24px; height:18px; line-height:18px; border-radius:4px; background-size:cover; background-position:center; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
.xpt .xpt-fl--s{ width:16px; height:12px; line-height:12px; border-radius:2px; }
.fi-eu{ background-image:url(../vendor/flag-icons/flags/4x3/eu.svg); }

/* perechea: moneda de bază în față (jos-stânga), cealaltă în spate (sus-dreapta) */
.xpt-pr{ position:relative; display:inline-block; flex:none; width:34px; height:28px; }
.xpt-pr .xpt-fl{ position:absolute; width:22px; height:16px; line-height:16px; border-radius:4px; }
.xpt-pr .xpt-fl:first-child{ top:0; right:0; }
.xpt-pr .xpt-fl:last-child{ left:0; bottom:0; box-shadow:0 0 0 2px var(--e-s1), inset 0 0 0 1px rgba(255,255,255,.08); }
.xpt-mi{ display:block; flex:none; width:28px; height:28px; border-radius:8px; object-fit:contain; }

/* linia de stare a prețurilor: verde = în timp real, gri = închidere */
.xpt-lv{ display:flex; align-items:center; gap:8px; margin:-8px 0 18px; color:var(--e-ink3); font:400 13.5px/18px var(--xf); font-variant-numeric:tabular-nums; }
.xpt-lv__d{ width:8px; height:8px; flex:none; border-radius:50%; background:var(--g5); box-shadow:0 0 0 3px rgba(0,186,124,.18); animation:xpt-pl 2s ease-in-out infinite; }
.xpt-lv.is-off .xpt-lv__d{ background:var(--e-ink3); box-shadow:0 0 0 3px rgba(125,122,116,.18); animation:none; }
@keyframes xpt-pl{ 50%{ box-shadow:0 0 0 5px rgba(0,186,124,.06); } }

/* o valoare schimbată de script clipește scurt în culoarea mișcării */
.xpt .is-fu{ animation:xpt-fu 1.2s ease-out; }
.xpt .is-fd{ animation:xpt-fd 1.2s ease-out; }
@keyframes xpt-fu{ 0%{ background:rgba(0,186,124,.24); } 100%{ background:transparent; } }
@keyframes xpt-fd{ 0%{ background:rgba(244,33,46,.24); } 100%{ background:transparent; } }
@media (prefers-reduced-motion:reduce){ .xpt-lv__d, .xpt .is-fu, .xpt .is-fd{ animation:none; } }

/* banda de cifre: variația sub valoare (blocul ei e învelit, deci marginea de sub antet se pune aici) */
.xhb-top--coll + [data-pt-b] > .xhb-fig{ margin-top:0; }
.xpt-fig small{ overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.xpt-fig__u{ color:var(--e-ink3); }
.xpt-fig b span{ border-radius:6px; }
.xpt-fig__c{ display:block; margin-top:2px; font:600 13.5px/18px var(--xf); font-style:normal; font-variant-numeric:tabular-nums; }

/* grupele: carduri cu rânduri, două pe rând (patru pe ecran mare doar la valute) */
.xpt-gpg{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.xpt-gpg--3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.xpt-gp{ min-width:0; padding:20px 24px 8px; border-radius:20px; background:var(--e-s1); }
.mdsx .xhb .xpt-gp h3{ display:flex; align-items:center; gap:8px; margin:0 0 6px; color:var(--e-ink); font:600 15.5px/22px var(--xf); }
.xpt-gp__r{ display:flex; align-items:center; gap:12px; padding:11px 0; border-top:1px solid var(--e-hair); }
.xpt-gp__n{ flex:1; min-width:0; }
.xpt-gp__n b{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink); font:600 15.5px/22px var(--xf); transition:color .15s; }
.xpt-gp__n small{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
a.xpt-gp__r:hover .xpt-gp__n b{ color:var(--lk); }
.xpt-gp__v{ flex:none; text-align:right; }
.xpt-gp__v b{ display:block; color:var(--e-ink); font:500 15.5px/22px var(--xf); font-variant-numeric:tabular-nums; white-space:nowrap; }
.xpt-gp__v em{ display:block; font:600 13.5px/18px var(--xf); font-style:normal; font-variant-numeric:tabular-nums; }
.xpt-gp__v span, .xpt-gp__v em{ border-radius:6px; }

/* cât costă azi: plăci mari */
.xpt-ccg{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.xpt-cc{ display:flex; flex-direction:column; gap:6px; min-width:0; padding:24px; border-radius:20px; background:var(--e-s1); transition:background .15s; }
a.xpt-cc:hover{ background:var(--e-s2); }
.xpt-cc__h{ display:flex; align-items:center; gap:10px; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-cc strong{ color:var(--e-ink); font:600 30px/36px var(--xf); letter-spacing:-.01em; font-variant-numeric:tabular-nums; white-space:nowrap; }
.xpt-cc__r{ display:flex; justify-content:space-between; gap:8px; margin-top:6px; padding-top:12px; border-top:1px solid var(--e-hair); color:var(--e-ink2); font:400 13.5px/18px var(--xf); }
.xpt-cc__r b{ font:600 13.5px/18px var(--xf); font-variant-numeric:tabular-nums; }
.xpt-note{ margin:10px 4px 0; color:var(--e-ink3); font:400 13.5px/20px var(--xf); }

/* convertorul */
.xpt-cv{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:end; gap:16px; padding:28px 32px; border-radius:20px; background:var(--e-s1); }
.xpt-cv__f{ min-width:0; }
.xpt-cv label{ display:block; margin-bottom:8px; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-cv__in{ display:flex; align-items:center; gap:8px; height:56px; padding:0 6px 0 18px; border-radius:14px; background:var(--e-s3); }
.xpt-cv input, .xpt-cv output{ flex:1; width:0; min-width:0; overflow:hidden; text-overflow:ellipsis; border:0; background:none; color:var(--e-ink); font:600 20px/26px var(--xf); font-variant-numeric:tabular-nums; outline:none; white-space:nowrap; }
.xpt-cv__in:focus-within{ box-shadow:0 0 0 2px rgba(29,155,240,.55); }
.xpt-cv select{ flex:none; max-width:46%; height:44px; padding:0 30px 0 12px; border:0; border-radius:10px; background:var(--e-s2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239c9a96' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center/14px; color:var(--e-ink); font:600 15.5px/1 var(--xf); -webkit-appearance:none; appearance:none; text-overflow:ellipsis; cursor:pointer; }
.xpt-cv__x{ display:grid; place-items:center; width:44px; height:44px; margin-bottom:6px; padding:0; border:0; border-radius:50%; background:var(--e-s3); color:var(--e-ink2); cursor:pointer; transition:background .15s, color .15s; }
.xpt-cv__x:hover{ background:var(--e-s2); color:var(--e-ink); }
.xpt-cv__x svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.xpt-cv__n{ grid-column:1 / -1; margin:0; color:var(--e-ink3); font:400 13.5px/18px var(--xf); font-variant-numeric:tabular-nums; }

/* matricea variațiilor */
.xpt-mx{ padding:28px 32px; overflow-x:auto; border-radius:20px; background:var(--e-s1); }
.xpt-mx table{ width:100%; border-collapse:separate; border-spacing:4px; font-variant-numeric:tabular-nums; }
.xpt-mx th{ padding:6px 8px; color:var(--e-ink2); font:600 13.5px/18px var(--xf); text-align:center; white-space:nowrap; }
.xpt-mx th:first-child{ text-align:left; }
.xpt-mx th .xpt-fl{ margin-right:6px; vertical-align:-1px; }
.xpt-mx td{ padding:12px 8px; border-radius:10px; text-align:center; font:600 13.5px/18px var(--xf); white-space:nowrap; transition:background .3s; }
.xpt-mx__z{ background:var(--e-s2); color:var(--e-ink3); }
.xpt-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }

/* toate perechile: rândul tabelului de la Acțiuni, cu iconița perechii */
.xpt-al .xhb-al__hd, .xpt-al .xpt-al__r{ display:grid; grid-template-columns:28px 34px minmax(0,1fr) 120px 84px; align-items:center; column-gap:12px; }
.xpt-al .xpt-al__r{ padding:11px 0; }
a.xpt-al__r:hover .xhb-al__n b{ color:var(--lk); }
.xpt-al .xhb-al__p span, .xpt-al em{ border-radius:6px; }

/* aurul și argintul: două panouri */
.xhb-mk.xpt-mk2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.xpt-au__k{ display:flex; align-items:center; gap:10px; }
.xpt-au .xpt-mi{ width:24px; height:24px; }

/* un an: bare plus / minus, din mijloc */
.xpt-dv{ padding:28px 32px; border-radius:20px; background:var(--e-s1); }
.xpt-dv__r{ display:grid; grid-template-columns:28px 160px minmax(0,1fr) 64px; align-items:center; column-gap:14px; padding:10px 0; border-top:1px solid var(--e-hair); }
.xpt-dv__r:first-child{ padding-top:0; border-top:0; }
.xpt-dv__r b{ overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink); font:600 15.5px/22px var(--xf); transition:color .15s; }
a.xpt-dv__r:hover b{ color:var(--lk); }
.xpt-dv__ax{ position:relative; height:8px; }
.xpt-dv__ax::before{ content:""; position:absolute; left:50%; top:-6px; bottom:-6px; width:1px; background:rgba(255,255,255,.18); }
.xpt-dv__ax i{ position:absolute; top:0; bottom:0; border-radius:99px; }
.xpt-dv__ax i.is-up{ left:50%; background:var(--g5); }
.xpt-dv__ax i.is-dn{ right:50%; background:var(--g1); }
.xpt-dv__r em{ text-align:right; font:600 13.5px/18px var(--xf); font-style:normal; font-variant-numeric:tabular-nums; }

/* cum investești: panouri cu pastile către paginile site-ului */
.xpt-viag{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.xpt-via{ display:flex; flex-direction:column; min-width:0; padding:28px 32px; border-radius:20px; background:var(--e-s1); }
.mdsx .xhb .xpt-via h3{ margin:0; color:var(--e-ink); font:600 15.5px/22px var(--xf); }
.xpt-via p{ margin:6px 0 0; color:var(--e-ink2); font:400 15.5px/24px var(--xf); }
.xpt-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.xpt-chip{ display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 14px; border-radius:999px; background:var(--e-s3); color:var(--e-ink); font:600 15.5px/1 var(--xf); transition:background .15s; }
.xpt-chip:hover{ background:#2c2c31; }
.xpt-chip small{ color:var(--e-ink3); font:400 13.5px/1 var(--xf); }

@media (max-width:1099px){
  .xpt-ccg{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .xpt-gpg--3{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:899px){
  .xpt-gpg.xhb-rail, .xpt-ccg.xhb-rail, .xpt-viag.xhb-rail{ display:flex; gap:12px; margin:0 -16px; padding:0 16px 4px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:0 16px; scrollbar-width:none; }
  .xpt-gpg.xhb-rail::-webkit-scrollbar, .xpt-ccg.xhb-rail::-webkit-scrollbar, .xpt-viag.xhb-rail::-webkit-scrollbar{ display:none; }
  .xpt-gpg.xhb-rail > .xpt-gp{ flex:0 0 84%; scroll-snap-align:start; }
  .xpt-ccg.xhb-rail > .xpt-cc{ flex:0 0 64%; scroll-snap-align:start; }
  .xpt-viag.xhb-rail > .xpt-via{ flex:0 0 84%; scroll-snap-align:start; padding:24px 20px; }
  .xpt-gp{ padding:18px 20px 6px; }
  .xpt-cc{ padding:20px; }
  .xpt-cc strong{ font-size:25px; line-height:30px; }
  .xpt-cv{ grid-template-columns:minmax(0,1fr); padding:24px 20px; }
  .xpt-cv__x{ justify-self:center; margin:0; transform:rotate(90deg); }
  .xpt-mx{ padding:16px 12px; }
  .xpt-mx td{ padding:10px 4px; }
  .xpt-al .xhb-al__hd, .xpt-al .xpt-al__r{ grid-template-columns:22px 34px minmax(0,1fr) auto; column-gap:10px; }
  .xpt-al .xpt-al__r > em{ grid-column:4; grid-row:2; margin-top:-2px; }
  .xpt-al .xpt-al__r > .xhb-al__i, .xpt-al .xpt-al__r > .xpt-pr, .xpt-al .xpt-al__r > .xhb-al__n{ grid-row:1 / 3; }
  .xhb-mk.xpt-mk2{ display:flex; }
  .xpt-dv{ padding:24px 20px; }
  .xpt-dv__r{ grid-template-columns:28px 96px minmax(0,1fr) 52px; column-gap:10px; }
}

/* ═══ INDICI ═══ */
/* harta: patru coloane de plăci, colorate după variație */
.xpt-hm{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.xpt-hm__c{ display:flex; flex-direction:column; gap:8px; min-width:0; }
.mdsx .xhb .xpt-hm__c h3{ display:flex; align-items:center; gap:8px; min-height:22px; margin:0 0 4px 4px; color:var(--e-ink2); font:600 13.5px/18px var(--xf); }
.xpt-tile{ display:grid; grid-template-columns:24px minmax(0,1fr) auto; grid-template-areas:"f n n" "p p c"; align-items:center; column-gap:10px; row-gap:6px; padding:12px 14px; border-radius:14px; background:var(--e-s1); transition:filter .15s, background .3s; }
a.xpt-tile:hover{ filter:brightness(1.15); }
.xpt-tile .xpt-fl{ grid-area:f; }
.xpt-tile b{ grid-area:n; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink); font:600 15.5px/22px var(--xf); }
.xpt-tile small{ grid-area:p; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:rgba(245,243,240,.62); font:400 13.5px/18px var(--xf); font-variant-numeric:tabular-nums; }
.xpt-tile em{ grid-area:c; justify-self:end; font:600 15.5px/22px var(--xf); font-style:normal; font-variant-numeric:tabular-nums; border-radius:6px; }
.xpt-tile.xpt-tu3{ background:color-mix(in srgb,#00ba7c 34%,#141416); } .xpt-tile.xpt-tu2{ background:color-mix(in srgb,#00ba7c 20%,#141416); } .xpt-tile.xpt-tu1{ background:color-mix(in srgb,#00ba7c 9%,#141416); }
.xpt-tile.xpt-td1{ background:color-mix(in srgb,#f4212e 10%,#141416); } .xpt-tile.xpt-td2{ background:color-mix(in srgb,#f4212e 22%,#141416); } .xpt-tile.xpt-td3{ background:color-mix(in srgb,#f4212e 34%,#141416); }
.xpt-tile[class*="xpt-tu"] em{ color:#2fe0a0!important; } .xpt-tile[class*="xpt-td"] em{ color:#ff5a64!important; }

/* două coloane: creșterile pe un an și bursele deschise acum */
.xpt-two{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:stretch; }
.xpt-two__c{ display:flex; flex-direction:column; min-width:0; }
.xpt-two .xhb-sh{ min-height:84px; }
.xpt-note--two{ margin-top:10px; }
.xpt-rk{ flex:1; padding:6px 24px 10px; border-radius:20px; background:var(--e-s1); }
.xpt-rk__r{ display:grid; grid-template-columns:20px 24px minmax(0,1fr) auto; align-items:center; column-gap:12px; padding:11px 0; border-top:1px solid var(--e-hair); }
.xpt-rk__r:first-child{ border-top:0; }
.xpt-rk__i{ color:var(--e-ink3); font:500 13.5px/1 var(--xf); font-variant-numeric:tabular-nums; }
.xpt-rk__n{ min-width:0; }
.xpt-rk__n b{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink); font:600 15.5px/22px var(--xf); transition:color .15s; }
a.xpt-rk__r:hover .xpt-rk__n b{ color:var(--lk); }
.xpt-rk__n small{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-rk__r em{ font:600 15.5px/22px var(--xf); font-style:normal; font-variant-numeric:tabular-nums; }

/* bursele, la ora vizitatorului */
.xpt-cl{ flex:1; padding:22px 24px 18px; border-radius:20px; background:var(--e-s1); }
.xpt-cl__hd{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin:0; padding-bottom:12px; }
.xpt-cl__hd b{ color:var(--e-ink); font:600 15.5px/22px var(--xf); font-variant-numeric:tabular-nums; }
.xpt-cl__hd span{ overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-cl__fb{ margin:0; padding:0; list-style:none; }
.xpt-cl__fb li{ display:flex; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--e-hair); color:var(--e-ink); font:600 15.5px/22px var(--xf); }
.xpt-cl__fb small{ color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-cl__r, .xpt-cl__ax{ display:grid; grid-template-columns:24px 104px minmax(0,1fr) 92px; align-items:center; column-gap:12px; }
.xpt-cl__r{ padding:11px 0; border-top:1px solid var(--e-hair); }
.xpt-cl__r b{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink); font:600 15.5px/22px var(--xf); }
.xpt-cl__r small{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-cl__tl{ position:relative; height:8px; border-radius:99px; background:var(--e-s3); }
.xpt-cl__tl i{ position:absolute; top:0; bottom:0; border-radius:99px; background:rgba(29,155,240,.4); }
.xpt-cl__r.is-on .xpt-cl__tl i{ background:rgba(0,186,124,.6); }
.xpt-cl__tl s{ position:absolute; top:-6px; width:2px; height:20px; margin-left:-1px; border-radius:2px; background:#fff; text-decoration:none; }
.xpt-cl__st{ text-align:right; color:var(--e-ink2); font:600 13.5px/18px var(--xf); }
.xpt-cl__r.is-on .xpt-cl__st{ color:var(--g5); }
.xpt-cl__st small{ font-weight:400; font-variant-numeric:tabular-nums; white-space:nowrap; }
.xpt-cl__ax{ padding-top:8px; color:var(--e-ink3); font:400 13.5px/18px var(--xf); font-variant-numeric:tabular-nums; }
.xpt-cl__ax div{ grid-column:3; display:flex; justify-content:space-between; }

/* toți indicii: steagul în locul iconiței perechii */
.xpt-al__r--f .xpt-fl{ justify-self:start; }

@media (max-width:1099px){
  .xpt-hm{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .xpt-two{ grid-template-columns:minmax(0,1fr); }
  .xpt-two .xhb-sh{ min-height:0; }
}
@media (max-width:899px){
  .xpt-hm.xhb-rail{ display:flex; gap:12px; margin:0 -16px; padding:0 16px 4px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:0 16px; scrollbar-width:none; }
  .xpt-hm.xhb-rail::-webkit-scrollbar{ display:none; }
  .xpt-hm.xhb-rail > .xpt-hm__c{ flex:0 0 72%; scroll-snap-align:start; }
  .xpt-rk{ padding:4px 16px 8px; }
  .xpt-cl{ padding:18px 16px 14px; }
  .xpt-cl__r, .xpt-cl__ax{ grid-template-columns:24px 112px minmax(0,1fr) 84px; column-gap:10px; }
}
.xpt-fig small .xpt-fl{ margin-right:6px; vertical-align:-1px; }

/* ═══ CRYPTO ═══ */
/* clasamentul și tabelul categoriei: aceleași rânduri ca la Acțiuni, plus volatilitatea și distanța de maxim */
.xpt-crt .c-vol, .xpt-crt .c-hi{ color:var(--e-ink2); }
.xpt-crt .xhb-t__co{ display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; }
.xpt-crt a.xhb-t__co:hover b{ color:var(--lk); }
.xpt-crt .xhb-t__co small{ display:block; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-crt .xhb-lg, .xpt-al__r--cr .xhb-lg, .xpt-hi .xhb-lg{ border-radius:50%; background:var(--e-s3); overflow:hidden; }
.xpt-al__r--cr .xhb-lg{ width:28px; height:28px; justify-self:start; font-size:11.5px; }
@media (max-width:899px){
  .xhb-t.xpt-crt[data-k="vol"] td.c-vol{ display:block!important; grid-area:m; font:600 13.5px/18px var(--xf); text-align:right; }
  .xhb-t.xpt-crt[data-k="vol"] td.c-vol::before, .xhb-t.xpt-crt[data-k="r1"] td.c-r1::before{ content:attr(data-l) " "; color:var(--e-ink3); font-weight:400; }
}

/* dominanța: o bară împărțită și legenda ei */
.xpt-dm{ padding:28px 32px; border-radius:20px; background:var(--e-s1); }
.xpt-dm__big{ margin:0 0 18px; color:var(--e-ink2); font:400 15.5px/24px var(--xf); }
.xpt-dm__big b{ color:var(--e-ink); font:600 25px/30px var(--xf); letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.xpt-dm__bar{ display:flex; gap:3px; height:14px; border-radius:99px; overflow:hidden; }
.xpt-dm__bar i{ min-width:3px; }
.xpt-dm__btc{ background:#f7931a; }
.xpt-dm__eth{ background:#8c8cf2; }
.xpt-dm__st{ background:#26a17b; }
.xpt-dm__alt{ background:var(--e-s3); }
.xpt-dm__l{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:20px 0 0; padding:0; list-style:none; }
.xpt-dm__l li{ display:grid; grid-template-columns:10px minmax(0,1fr); grid-template-areas:"k b" ". e" ". s"; column-gap:10px; align-items:center; }
.xpt-dm__k{ grid-area:k; width:10px; height:10px; border-radius:3px; }
.xpt-dm__l b{ grid-area:b; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink2); font:500 13.5px/18px var(--xf); }
.xpt-dm__l em{ grid-area:e; color:var(--e-ink); font:600 20px/26px var(--xf); font-style:normal; font-variant-numeric:tabular-nums; }
.xpt-dm__l small{ grid-area:s; color:var(--e-ink3); font:400 13.5px/18px var(--xf); font-variant-numeric:tabular-nums; }

/* față de maximul pe un an: bara arată cât lipsește până la maxim */
.xpt-hi{ padding:28px 32px; border-radius:20px; background:var(--e-s1); }
.xpt-hi__r{ display:grid; grid-template-columns:24px 160px minmax(0,1fr) 84px; align-items:center; column-gap:14px; padding:10px 0; border-top:1px solid var(--e-hair); color:inherit; text-decoration:none; }
.xpt-hi__r:first-child{ padding-top:0; border-top:0; }
.xpt-hi__r .xhb-lg{ width:24px; height:24px; font-size:10px; }
.xpt-hi__r b{ overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink); font:600 15.5px/22px var(--xf); transition:color .15s; }
a.xpt-hi__r:hover b{ color:var(--lk); }
.xpt-hi__ax{ position:relative; height:8px; border-radius:99px; background:var(--e-s3); }
.xpt-hi__ax i{ position:absolute; top:0; right:0; bottom:0; border-radius:99px; background:var(--g1); opacity:.75; }
.xpt-hi__r em{ text-align:right; color:var(--e-ink2); font:600 13.5px/18px var(--xf); font-style:normal; font-variant-numeric:tabular-nums; white-space:nowrap; }

/* categoria: textul despre ea */
.xpt-ab{ max-width:760px; padding:28px 32px; border-radius:20px; background:var(--e-s1); }
.xpt-ab p{ margin:0; color:var(--e-ink2); font:400 15.5px/24px var(--xf); }

@media (max-width:899px){
  .xpt-dm, .xpt-hi, .xpt-ab{ padding:24px 20px; }
  .xpt-dm__l{ grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:18px; }
  .xpt-dm__big b{ font-size:20px; line-height:26px; }
  .xpt-hi__r{ grid-template-columns:24px 104px minmax(0,1fr) 64px; column-gap:10px; }
  
}
@media (max-width:899px){
  .xpt-al .xpt-al__r--cr > .xhb-lg{ grid-row:1 / 3; }
}

/* ═══ ETF-URI ═══ */
/* filele și filtrul UCITS pe același rând */
.xpt-etb{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.xpt-etb .xhb-tabs{ margin-bottom:0; }
.xpt-uc{ display:inline-flex; align-items:center; gap:10px; color:var(--e-ink2); font:500 13.5px/18px var(--xf); cursor:pointer; user-select:none; }
.xpt-uc input{ position:absolute; opacity:0; width:1px; height:1px; }
.xpt-uc__s{ position:relative; flex:none; width:36px; height:22px; border-radius:99px; background:var(--e-s3); transition:background .2s; }
.xpt-uc__s::after{ content:""; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%; background:#fff; transition:transform .2s; }
.xpt-uc input:checked + .xpt-uc__s{ background:var(--g5); }
.xpt-uc input:checked + .xpt-uc__s::after{ transform:translateX(14px); }
.xpt-uc input:focus-visible + .xpt-uc__s{ outline:2px solid var(--lk); outline-offset:2px; }
.xpt-etf[data-uc="1"] tbody[data-uc="0"], .xpt-etf[data-uc="0"] tbody[data-uc="1"]{ display:none!important; }
.xpt-etf .xhb-t__co{ display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; }
.xpt-etf a.xhb-t__co:hover b{ color:var(--lk); }
.xpt-etf .xhb-t__co > span{ min-width:0; }
.xpt-etf .xhb-t__co b{ display:block; max-width:300px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.xpt-etf .xhb-t__co small{ display:block; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-etf .xhb-lg, .xpt-cmp .xhb-lg{ border-radius:8px; background:var(--e-s3); overflow:hidden; font-size:11.5px; }
.xpt-etf .c-ter, .xpt-etf .c-dist, .xpt-etf .c-cap{ color:var(--e-ink2); }
.xpt-etf .c-dist{ text-align:left!important; }
.xpt-etf td.xpt-none, .xpt-etf tr.xpt-none td{ padding:20px 16px; color:var(--e-ink3); text-align:left; white-space:normal; }
.xpt-etf td.c-dist small{ display:block; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
@media (max-width:899px){
  .xpt-etb{ flex-direction:column; align-items:stretch; }
  .xpt-etf .xhb-t__co b{ max-width:none; }
  .xhb-t.xpt-etf[data-k="cap"] td.c-r1, .xhb-t.xpt-etf[data-k="ter"] td.c-ter, .xhb-t.xpt-etf[data-k="dy"] td.c-dist{ display:block!important; grid-area:m; font:600 13.5px/18px var(--xf); text-align:right; }
  .xhb-t.xpt-etf[data-k="cap"] td.c-r1::before, .xhb-t.xpt-etf[data-k="ter"] td.c-ter::before, .xhb-t.xpt-etf[data-k="r1"] td.c-r1::before{ content:attr(data-l) " "; color:var(--e-ink3); font-weight:400; }
  .xhb-t.xpt-etf tr.xpt-none{ display:block; }
  .xhb-t.xpt-etf tr.xpt-none td{ display:block!important; }
}

/* același indice: rânduri compacte, primul (cel mai ieftin) evidențiat */
.xpt-cmp{ display:grid; gap:8px; }
.xpt-cmp__r{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) repeat(4,112px); align-items:center; column-gap:16px; padding:16px 20px; border-radius:16px; background:var(--e-s1); }
.xpt-cmp__r.is-best{ box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--g5) 55%,transparent); background:color-mix(in srgb,var(--g5) 7%,var(--e-s1)); }
.xpt-cmp__r .xhb-t__co{ display:flex; align-items:center; gap:12px; min-width:0; color:inherit; text-decoration:none; }
.xpt-cmp__r .xhb-t__co > span{ min-width:0; }
.xpt-cmp__r .xhb-t__co b{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--e-ink); font:600 15.5px/22px var(--xf); }
.xpt-cmp__r a.xhb-t__co:hover b{ color:var(--lk); }
.xpt-cmp__r .xhb-t__co small{ display:block; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-cmp__v small{ display:block; color:var(--e-ink3); font:400 13.5px/18px var(--xf); }
.xpt-cmp__v b{ display:block; color:var(--e-ink); font:600 15.5px/22px var(--xf); font-variant-numeric:tabular-nums; white-space:nowrap; }
.xpt-cmp__r.is-best .xpt-cmp__v:nth-child(2) b{ color:var(--g5); }
.xpt-cmp__tag{ position:absolute; top:-9px; left:20px; padding:2px 10px; border-radius:99px; background:var(--g5); color:#0b0b0d; font:600 11.5px/16px var(--xf); font-style:normal; }
@media (max-width:899px){
  .xpt-cmp__r{ grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:12px; padding:16px; }
  .xpt-cmp__r > .xhb-t__co{ grid-column:1 / -1; }
}
@media (max-width:899px){
  .xhb-t.xpt-etf[data-k="dy"] td.c-dist small{ display:inline; margin-left:6px; color:var(--g5); font-weight:600; }
}
@media (max-width:899px){
  .xpt-etf .xhb-t__co b{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
}