/* psk-news - sectiunea crypto (/cripto/ si /cripto/<moneda>/). Doar pe aceste pagini; tokenurile vin din tema si din child. */
.cripto { --c-sus: #047857; --c-jos: #B91C1C; --c-sus-fond: #ECFDF5; --c-jos-fond: #FEF2F2; --c-mono: var(--font-mono, ui-monospace, 'SF Mono', Consolas, monospace); padding-bottom: 40px; }
.cripto .doar-cititor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cripto .c-lei, .cripto .c-usd { font-variant-numeric: tabular-nums; }
/* (21 oct, Marius: „prețurile trebuie să fie în dolari prima dată”) implicit dolari; body.cripto-lei (comutatorul) arata leii */
.cripto .c-lei { display: none; }
body.cripto-lei .cripto .c-lei { display: inline; }
body.cripto-lei .cripto .c-usd { display: none; }
.cripto .c-pret, .cripto .c-suma { font-family: var(--c-mono); font-weight: 600; white-space: nowrap; }

/* ---------- variatii ---------- */
.c-var { display: inline-block; font-family: var(--c-mono); font-weight: 600; font-size: 13px; white-space: nowrap; padding: 2px 6px; border-radius: 4px; }
.c-var--sus { color: var(--c-sus); background: var(--c-sus-fond); }
.c-var--jos { color: var(--c-jos); background: var(--c-jos-fond); }
.c-var--zero { color: var(--gri); background: var(--fond); }
.c-var--sus::before { content: "▲ "; font-size: 9px; }
.c-var--jos::before { content: "▼ "; font-size: 9px; }
.c-spark--sus { color: var(--c-sus); }
.c-spark--jos { color: var(--c-jos); }

/* ---------- capul sectiunii ---------- */
.c-cap { display: grid; gap: 14px; margin: 4px 0 18px; }
@media (min-width: 900px) { .c-cap { grid-template-columns: minmax(0, 1fr) auto; align-items: end; } }
.c-cap h1 { font-family: var(--font-titlu); font-size: clamp(28px, 3.8vw, 42px); font-weight: 800; letter-spacing: -.03em; margin-bottom: 8px; }
.c-lead { font-size: 16px; line-height: 1.55; color: var(--gri); max-width: 760px; margin: 0; }
.c-cap__unelte { display: grid; gap: 8px; justify-items: start; }
@media (min-width: 900px) { .c-cap__unelte { justify-items: end; text-align: right; } }
.c-actualizat { font-family: var(--c-mono); font-size: 12px; color: var(--gri); margin: 0; }
.c-comutator { display: inline-flex; background: var(--hartie); border: 1px solid var(--linie); border-radius: 999px; padding: 3px; }
.c-comutator__btn { border: 0; background: transparent; border-radius: 999px; padding: 6px 14px; font: 700 12.5px var(--font-ui); color: var(--gri); cursor: pointer; }
.c-comutator__btn.activ { background: var(--ink); color: #fff; }

/* ---------- casetele pietei ---------- */
.c-casete { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 22px; }
@media (min-width: 700px) { .c-casete { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .c-casete { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.c-caseta { display: block; background: var(--hartie); border-radius: var(--raza); box-shadow: var(--umbra); padding: 14px 16px; text-decoration: none; color: inherit; min-width: 0; }
.c-caseta--link:hover { box-shadow: 0 0 0 1px var(--accent); }
.c-caseta h2 { display: flex; align-items: center; gap: 6px; font-family: var(--c-mono); font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gri); margin-bottom: 8px; }
.c-caseta h2 img { border-radius: 50%; }
.c-caseta__val { font-family: var(--c-mono); font-size: 18px; font-weight: 700; letter-spacing: -.03em; margin: 0 0 6px; color: var(--ink); white-space: nowrap; }
@media (min-width: 1000px) and (max-width: 1199px) { .c-caseta__val { font-size: 16px; } }
.c-caseta__din { font-size: 13px; color: var(--gri2); font-weight: 600; }
.c-caseta__sub { font-size: 12.5px; color: var(--gri); margin: 0; }
.c-caseta__sub .c-var { font-size: 12px; padding: 1px 5px; }
.c-frica { position: relative; height: 6px; border-radius: 3px; background: linear-gradient(90deg, #DC2626 0%, #F59E0B 50%, #059669 100%); margin: 2px 0 8px; }
.c-frica span { position: absolute; top: -3px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: #fff; border: 2px solid var(--ink); box-sizing: border-box; }

/* ---------- tabelul ---------- */
.c-tabel-sectiune { background: var(--hartie); border-radius: var(--raza); box-shadow: var(--umbra); padding: 14px 0 16px; margin-bottom: 22px; }
.c-unelte { display: grid; gap: 8px; padding: 0 16px 12px; }
@media (min-width: 800px) { .c-unelte { grid-template-columns: 320px 1fr; align-items: center; } }
.c-cauta input { width: 100%; box-sizing: border-box; padding: 10px 14px; border: 1px solid var(--linie); border-radius: 8px; font: 500 14px var(--font-ui); background: var(--fond); color: var(--ink); }
.c-cauta input:focus { outline: 2px solid var(--accent); border-color: var(--accent); background: #fff; }
.c-unelte__nota { font-size: 12.5px; color: var(--gri); margin: 0; }
.c-tabel-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.c-tabel { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 640px; table-layout: fixed; }
col.c-col-rang { width: 46px; } col.c-col-pret { width: 132px; } col.c-col-1h, col.c-col-24h, col.c-col-7d { width: 84px; } col.c-col-mcap { width: 136px; } col.c-col-vol { width: 136px; } col.c-col-spark { width: 150px; }
.c-tabel th, .c-tabel td { padding: 10px 12px; border-top: 1px solid var(--linie); text-align: right; white-space: nowrap; vertical-align: middle; }
.c-tabel thead th { border-top: 0; border-bottom: 1px solid var(--linie); font-family: var(--c-mono); font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gri); padding-top: 4px; }
.c-tabel th button { all: unset; cursor: pointer; }
.c-tabel th[aria-sort] button { color: var(--ink); }
.c-tabel th[aria-sort="ascending"] button::after { content: " ↑"; }
.c-tabel th[aria-sort="descending"] button::after { content: " ↓"; }
.c-tabel .c-col-rang, .c-tabel .c-col-nume { text-align: left; }
.c-tabel .c-col-rang { color: var(--gri); font-family: var(--c-mono); font-size: 12px; padding-left: 16px; padding-right: 6px; }
.c-tabel td.c-col-nume { overflow: hidden; text-overflow: ellipsis; }
.c-tabel tbody tr:hover { background: var(--fond); }
.c-tabel .c-col-rang, .c-tabel .c-col-nume { position: sticky; background: var(--hartie); z-index: 1; }
.c-tabel .c-col-rang { left: 0; }
.c-tabel .c-col-nume { left: 46px; box-shadow: 6px 0 8px -6px rgba(15, 23, 42, .12); }
.c-tabel tbody tr:hover .c-col-rang, .c-tabel tbody tr:hover .c-col-nume { background: var(--fond); }
.c-moneda { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; font-weight: 700; }
a.c-moneda:hover .c-moneda__nume { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
a.c-moneda .c-moneda__nume { border-bottom: 1px solid var(--linie); }
.c-moneda img { border-radius: 50%; flex: none; }
.c-moneda__sim { font-family: var(--c-mono); font-size: 11px; font-weight: 600; color: var(--gri2); text-transform: uppercase; }
.c-tabel .c-col-pret { font-family: var(--c-mono); font-weight: 600; }
.c-tabel .c-col-spark { width: 130px; padding-right: 16px; }
.c-tabel .c-col-spark svg { display: inline-block; vertical-align: middle; }
.c-tabel .c-ascuns { display: none; }
/* pe ecran ingust: toate coloanele raman (ca pe CoinGecko), tabelul se deruleaza orizontal, iar # si moneda stau lipite la stanga */
@media (max-width: 760px) {
  .c-tabel { table-layout: auto; min-width: 900px; }
  col.c-col-rang { width: 40px; } col.c-col-nume { width: 190px; }
  .c-tabel th, .c-tabel td { padding: 10px 8px; }
  .c-tabel .c-col-rang { padding-left: 12px; }
  .c-tabel .c-col-nume { left: 40px; }
  .c-moneda__nume { max-width: 118px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
.c-mai-multe { text-align: center; margin: 14px 0 4px; }
.c-nota { font-size: 12.5px; line-height: 1.5; color: var(--gri); margin: 14px 16px 0; }
.c-nota a { color: var(--accent-text); }
.c-gol-mare { background: var(--hartie); border-radius: var(--raza); box-shadow: var(--umbra); padding: 30px 20px; text-align: center; color: var(--gri); margin: 10px 0 24px; }
.c-gol-mare h1 { font-family: var(--font-titlu); margin-bottom: 10px; color: var(--ink); }

/* ---------- stiri ---------- */
.c-stiri { margin-bottom: 22px; }
.c-stiri__grila { display: grid; gap: 0 28px; }
@media (min-width: 800px) { .c-stiri__grila { grid-template-columns: 1fr 1fr; } }

/* ---------- pagina monedei ---------- */
.c-moneda-cap { display: grid; gap: 16px; background: var(--hartie); border-radius: var(--raza); box-shadow: var(--umbra); padding: 18px 18px 16px; margin: 4px 0 18px; }
@media (min-width: 860px) { .c-moneda-cap { grid-template-columns: minmax(0, 1fr) minmax(320px, 440px); align-items: start; padding: 22px 26px 20px; } }
.c-moneda-cap__id { display: flex; gap: 14px; align-items: flex-start; min-width: 0; }
.c-moneda-cap__id img { border-radius: 50%; flex: none; margin-top: 4px; }
.c-moneda-cap h1 { font-family: var(--font-titlu); font-size: clamp(24px, 3.4vw, 36px); font-weight: 800; letter-spacing: -.03em; }
.c-sim { font-family: var(--c-mono); font-size: .5em; font-weight: 600; color: var(--gri); letter-spacing: 0; vertical-align: middle; }
.c-moneda-cap__meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 8px 0 0; font-size: 12.5px; color: var(--gri); }
.c-rang, .c-eticheta { font-family: var(--c-mono); font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 4px; background: var(--fond); color: var(--ink2); }
.c-rang { background: var(--ink); color: #fff; }
.c-pret-mare { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-family: var(--c-mono); font-size: clamp(28px, 4vw, 40px); font-weight: 700; letter-spacing: -.03em; margin: 0; color: var(--ink); }
.c-pret-mare .c-var { font-size: 14px; }
.c-pret-alt { font-family: var(--c-mono); font-size: 14px; color: var(--gri); margin: 4px 0 12px; }
.c-interval { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; font-size: 11.5px; color: var(--gri); }
.c-interval__et--dr { text-align: right; }
.c-interval__bara { grid-column: 1 / -1; position: relative; height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--c-jos-fond), var(--c-sus-fond)); border: 1px solid var(--linie); }
.c-interval__bara span { position: absolute; top: -4px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--accent); border: 2px solid #fff; box-sizing: border-box; box-shadow: 0 0 0 1px var(--linie); }
.c-interval__val { font-family: var(--c-mono); font-weight: 600; color: var(--ink); font-size: 12.5px; }
.c-interval__val--dr { text-align: right; }

/* grafic */
.c-grafic-sectiune { background: var(--hartie); border-radius: var(--raza); box-shadow: var(--umbra); padding: 16px 16px 12px; margin-bottom: 22px; }
.c-grafic-cap { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.c-grafic-cap h2 { font-family: var(--font-titlu); font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.c-grafic-unelte { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.c-taburi { display: inline-flex; gap: 2px; background: var(--fond); border-radius: 8px; padding: 3px; }
.c-tab { border: 0; background: transparent; border-radius: 6px; padding: 6px 12px; font: 700 12.5px var(--c-mono); color: var(--gri); cursor: pointer; }
.c-tab.activ { background: var(--hartie); color: var(--ink); box-shadow: var(--umbra); }
.c-grafic { position: relative; }
.c-grafic__zona { position: relative; height: 290px; }
@media (max-width: 600px) { .c-grafic__zona { height: 220px; } }
.c-grafic__svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; overflow: visible; touch-action: pan-y; }
.c-grila { stroke: var(--linie); stroke-width: 1; vector-effect: non-scaling-stroke; }
.c-cursor { stroke: var(--gri2); stroke-width: 1; stroke-dasharray: 3 3; vector-effect: non-scaling-stroke; }
.c-grafic__y { position: absolute; inset: 0; pointer-events: none; }
.c-grafic__y span { position: absolute; right: 4px; transform: translateY(-110%); font: 600 11px/1 var(--c-mono); color: var(--gri); background: rgba(255, 255, 255, .8); padding: 2px 5px; border-radius: 3px; }
.c-grafic__x { display: flex; justify-content: space-between; padding: 8px 2px 0; font: 600 11px var(--c-mono); color: var(--gri); }
.c-tooltip { position: absolute; z-index: 2; transform: translate(-50%, calc(-100% - 14px)); background: var(--ink); color: #fff; padding: 7px 11px; border-radius: 6px; font: 12px/1.4 var(--font-ui); white-space: nowrap; pointer-events: none; box-shadow: 0 6px 18px rgba(15, 23, 42, .2); }
.c-tooltip--dr { transform: translate(-100%, calc(-100% - 14px)); }
.c-tooltip b { display: block; font-family: var(--c-mono); font-size: 14px; }
.c-tooltip span { color: rgba(255, 255, 255, .72); }
.c-gol { color: var(--gri); padding: 40px 0; text-align: center; }

/* indicatori + performanta + convertor */
.c-doua { display: grid; gap: 18px; margin-bottom: 22px; }
@media (min-width: 900px) { .c-doua { grid-template-columns: 1.25fr 1fr; align-items: start; } }
.c-coloana { display: grid; gap: 18px; }
.c-dl { margin: 0; }
.c-dl > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 14px; padding: 9px 0; border-top: 1px solid var(--linie); align-items: start; }
.c-dl > div:first-child { border-top: 0; }
.c-dl dt { font-size: 13.5px; color: var(--gri); }
.c-dl dd { margin: 0; text-align: right; font-family: var(--c-mono); font-weight: 600; font-size: 14px; color: var(--ink); }
.c-dl dd small { display: block; font-family: var(--font-ui); font-weight: 500; font-size: 12px; color: var(--gri); }
.c-oferta { display: block; height: 5px; border-radius: 3px; background: var(--fond); margin: 6px 0 4px; overflow: hidden; }
.c-oferta span { display: block; height: 100%; background: var(--accent); border-radius: 3px; }
.c-dl .c-linkuri { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.c-dl .c-linkuri a { font-family: var(--font-ui); font-size: 12.5px; font-weight: 700; color: var(--accent-text); text-decoration: none; padding: 3px 9px; border: 1px solid var(--linie); border-radius: 999px; }
.c-perf { width: 100%; border-collapse: collapse; table-layout: fixed; }
.c-perf th { font-family: var(--c-mono); font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gri); padding: 8px 4px 4px; text-align: center; }
.c-perf td { padding: 2px 4px 8px; text-align: center; }
.c-perf td .c-var { font-size: 12.5px; }
.c-convertor__form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.c-convertor__form label { display: grid; gap: 4px; }
.c-convertor__form span { font-family: var(--c-mono); font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gri); }
.c-convertor__form input { width: 100%; box-sizing: border-box; padding: 9px 12px; border: 1px solid var(--linie); border-radius: 8px; font: 600 15px var(--c-mono); background: var(--fond); color: var(--ink); }
.c-convertor__form input:focus { outline: 2px solid var(--accent); border-color: var(--accent); background: #fff; }
.c-convertor .c-nota { margin: 10px 0 0; }

/* despre + alte monede */
.cripto .c-despre.pagina { max-width: none; margin: 0 0 22px; }
.cripto .c-despre h2 { font-family: var(--font-titlu); font-size: 22px; font-weight: 800; letter-spacing: -.02em; margin-bottom: 10px; }
.c-altele { margin-bottom: 22px; }
.c-altele__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 0 24px; }
@media (min-width: 700px) { .c-altele__lista { grid-template-columns: 1fr 1fr; } }
.c-altele__lista a { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--linie); text-decoration: none; color: inherit; font-size: 14px; }
.c-altele__lista li:first-child a, .c-altele__lista li:nth-child(2) a { border-top: 0; }
@media (max-width: 699px) { .c-altele__lista li:nth-child(2) a { border-top: 1px solid var(--linie); } }
.c-altele__lista img { border-radius: 50%; }
.c-altele__nume { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.c-altele__nume small { font-family: var(--c-mono); color: var(--gri2); font-weight: 600; }
.c-altele__lista a:hover .c-altele__nume { color: var(--accent-text); }
.c-altele__lista .c-var { font-size: 12px; }

/* ---------- blocul din capul categoriei crypto: top 5 + butonul spre toate preturile ---------- */
.c-top5 { background: var(--hartie); border-radius: var(--raza); box-shadow: var(--umbra); padding: 14px 16px 16px; margin: 0 0 22px; }
.c-top5__cap { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin-bottom: 10px; }
.c-top5__cap h2 { font-family: var(--font-titlu); font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.c-top5__cap .c-actualizat { margin: 0; }
.c-top5__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
@media (min-width: 640px) { .c-top5__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 900px) { .c-top5__lista { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.c-top5__lista a { display: grid; grid-template-columns: 28px minmax(0, 1fr); grid-template-rows: auto auto auto; column-gap: 10px; row-gap: 3px; align-items: center; padding: 10px 12px; border: 1px solid var(--linie); border-radius: 8px; text-decoration: none; color: inherit; min-width: 0; }
.c-top5__lista a:hover { border-color: var(--accent); }
.c-top5__lista img { grid-row: 1 / 4; border-radius: 50%; }
.c-top5__nume { font-weight: 700; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.c-top5__nume small { font-family: var(--c-mono); font-weight: 600; color: var(--gri2); font-size: 11px; }
.c-top5__pret { font-size: 15px; }
.c-top5__lista .c-var { justify-self: start; font-size: 12px; padding: 1px 6px; }
.c-top5__act { margin: 12px 0 0; }
.c-top5__btn { font-family: var(--font-ui); }
@media (max-width: 639px) { .c-top5__btn { display: block; text-align: center; } }