/* Zitutė duomenys. Spalvos ir šriftai pagal zitute.lt ir app.zitute.lt:
   popierius, bazaltas, kaulas, plokštumos, medus. Hanken Grotesk tekstui, Space Mono žymoms ir kodams. */
:root {
  --popierius: #FBFAF9;
  --balta: #FFFFFF;
  --ploks: #F1EDE4;
  --kaulas: #EDE7DB;
  --ink: #151614;
  --ink2: rgba(21, 22, 20, .55);
  --ink45: rgba(21, 22, 20, .45);
  --linija: rgba(21, 22, 20, .13);
  --linija-sv: rgba(21, 22, 20, .07);
  --medus: #C9963C;
  --medus-tekstas: #8A6420;
  --medus-fonas: rgba(201, 150, 60, .16);
  --zalia-tekstas: #2F5F2B;
  --zalia-fonas: rgba(63, 125, 58, .13);
  --r-kortele: 16px;
  --r-mygtukas: 14px;
  --r-zenkliukas: 10px;
  --seselis: 0 8px 24px rgba(21, 22, 20, .04);
  --sans: "Hanken Grotesk", -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "Space Mono", ui-monospace, "SF Mono", Menlo, monospace;
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.45;
  color: var(--ink);
  background: var(--popierius);
  font-variant-numeric: tabular-nums;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: var(--popierius); }
a { color: var(--ink); text-decoration-color: var(--medus); text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
a:hover { color: var(--medus-tekstas); }
:focus-visible { outline: 2px solid var(--medus); outline-offset: 2px; }
h1 { font-size: 32px; line-height: 1.1; font-weight: 700; margin: 0 0 18px; letter-spacing: -0.02em; }
h2 { font-size: 18px; font-weight: 700; margin: 36px 0 14px; letter-spacing: -0.01em; }

/* Mono žymos: kaip Zitutėje, retinta Space Mono smulkiems paaiškinimams */
.zyma-mono, legend, .rodikliai span, .lentele th, .grafiko-pavadinimas, .vartu-forma label {
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em; color: var(--ink2); font-weight: 400; text-transform: uppercase;
}
.vartu-forma input { font-family: var(--sans); text-transform: none; letter-spacing: 0; font-size: 15px; height: 46px; }

/* Viršutinė juosta */
.virsus { display: flex; align-items: center; gap: 28px; padding: 0 28px; height: 64px; background: rgba(251, 250, 249, .92);
  backdrop-filter: blur(8px); border-bottom: 1px solid var(--linija); position: sticky; top: 0; z-index: 5; }
.zenklas { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); white-space: nowrap; }
.zenklas img { height: 20px; width: auto; display: block; }
.zenklas span { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; color: var(--ink2); padding-top: 3px; }
.virsus nav { display: flex; gap: 4px; flex: 1; overflow-x: auto; }
.virsus nav a { color: var(--ink2); text-decoration: none; padding: 7px 13px; border-radius: 999px; white-space: nowrap; font-weight: 500; }
.virsus nav a:hover { color: var(--ink); background: var(--ploks); }
.virsus nav a[aria-current] { color: var(--kaulas); background: var(--ink); }
.kas { font-size: 13px; color: var(--ink2); white-space: nowrap; }
.kas a { color: var(--ink); margin-left: 12px; }

/* Formos */
label { display: block; font-size: 13px; color: var(--ink2); margin-bottom: 12px; }
input, select { display: block; width: 100%; margin-top: 5px; font: inherit; font-size: 14px; color: var(--ink); background: var(--popierius);
  border: 1px solid var(--linija); border-radius: 12px; padding: 9px 12px; }
select { appearance: none; padding-right: 30px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23151614' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; }
input::placeholder { color: var(--ink45); }
input:focus, select:focus { border-color: var(--ink); outline: none; background-color: var(--balta); }
button, .mygtukas { display: inline-flex; align-items: center; justify-content: center; font: inherit; font-weight: 700; font-size: 14px; color: var(--kaulas);
  background: var(--ink); border: 1px solid var(--ink); border-radius: var(--r-mygtukas); padding: 0 18px; height: 42px; cursor: pointer;
  text-decoration: none; white-space: nowrap; }
button:hover, .mygtukas:hover { background: #2a2b28; color: var(--kaulas); }
button.antrinis, .mygtukas.antrinis { background: transparent; color: var(--ink); border: 1.5px solid var(--ink); font-weight: 600; }
button.antrinis:hover, .mygtukas.antrinis:hover { background: var(--ploks); color: var(--ink); }
button.medus, .mygtukas.medus { background: var(--medus); border-color: var(--medus); color: var(--ink); }
button.mazas { height: 30px; padding: 0 10px; font-size: 12px; font-weight: 600; border-radius: var(--r-zenkliukas); }
.klaida { color: var(--medus-tekstas); background: var(--medus-fonas); padding: 10px 14px; border-radius: 12px; }
.pastaba { color: var(--ink2); font-size: 13px; }

/* Prisijungimas */
main.vartai { display: grid; place-items: center; min-height: 100vh; padding: 16px; align-content: center; gap: 28px; }
.vartu-virsus { text-align: center; }
.vartu-virsus img { height: 34px; width: auto; }
.vartu-virsus p { font-family: var(--mono); font-size: 11px; letter-spacing: .2em; color: var(--ink2); margin: 12px 0 0; }
.vartu-forma { width: 100%; max-width: 380px; background: var(--balta); border: 1px solid var(--linija); border-radius: var(--r-kortele); padding: 28px; box-shadow: var(--seselis); }
.vartu-forma h1 { font-size: 22px; margin: 0 0 6px; }
.vartu-forma button { width: 100%; height: 46px; margin-top: 6px; }
.vartu-apacia { font-size: 13px; color: var(--ink2); }

/* Paieška: filtrų juosta + rezultatai */
main.su-juosta { display: grid; grid-template-columns: 300px minmax(0, 1fr); min-height: calc(100vh - 64px); }
.filtrai { background: var(--ploks); border-right: 1px solid var(--linija); padding: 22px 20px 40px; overflow-y: auto; max-height: calc(100vh - 64px); position: sticky; top: 64px; }
.filtrai input, .filtrai select { background-color: var(--popierius); }
.paieskos-laukas { font-weight: 700; color: var(--ink); font-size: 15px; }
.paieskos-laukas input { font-size: 16px; padding: 12px 14px; border: 1.5px solid var(--ink); background: var(--balta); }
fieldset { border: 0; border-top: 1px solid var(--linija); padding: 16px 0 4px; margin: 8px 0 0; }
legend { padding: 0 8px 0 0; color: var(--ink); font-weight: 700; }
.intervalas { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 12px; }
.intervalas span { grid-column: 1 / -1; font-size: 13px; color: var(--ink2); }
.intervalas input { margin-top: 0; }
label.zymimasis { display: flex; gap: 9px; align-items: center; color: var(--ink); font-size: 14px; margin-bottom: 9px; }
label.zymimasis input { width: 17px; height: 17px; margin: 0; accent-color: var(--ink); }
.veiksmai { display: flex; align-items: center; gap: 14px; margin-top: 16px; position: sticky; bottom: -40px; background: var(--ploks); padding: 12px 0; }
.veiksmai button { flex: 1; height: 46px; }
.sarasai ul { list-style: none; padding: 0; margin: 0; }
.sarasai li { margin: 6px 0; }

.rezultatai { padding: 24px 28px 56px; min-width: 0; }
.rezultatu-virsus { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.kiekis { margin: 0; font-size: 16px; }
.kiekis strong { font-size: 40px; font-weight: 700; letter-spacing: -0.03em; margin-right: 4px; }
.kiekis span { display: block; color: var(--ink2); font-size: 13px; margin-top: 2px; }
.rezultatu-veiksmai { display: flex; gap: 8px; align-items: flex-end; }
.rezultatu-veiksmai .rikiuoti { margin: 0; min-width: 190px; }

/* Lentelės: balta kortelė ant popieriaus */
.lentele { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--balta); border: 1px solid var(--linija); border-radius: var(--r-kortele);
  overflow: hidden; font-size: 14px; box-shadow: var(--seselis); }
.lentele th { text-align: left; padding: 12px 12px 10px; border-bottom: 1px solid var(--linija); background: var(--balta); white-space: nowrap; }
.lentele td { padding: 10px 12px; border-bottom: 1px solid var(--linija-sv); vertical-align: top; }
.lentele tr:last-child td { border-bottom: 0; }
.lentele tbody tr:hover td { background: var(--popierius); }
.lentele td a { font-weight: 700; text-decoration: none; color: var(--ink); }
.lentele td a:hover { text-decoration: underline; text-decoration-color: var(--medus); }
.lentele .sk { text-align: right; white-space: nowrap; }
.lentele .data { white-space: nowrap; font-family: var(--mono); font-size: 12px; }
.lentele.siaura { font-size: 13px; }
.smulku { display: block; font-size: 12px; color: var(--ink2); font-weight: 400; }
.evrk { font-family: var(--mono); font-size: 12px; font-weight: 700; }
tr.neaktyvi td { color: var(--ink45); }
tr.neaktyvi td a { color: var(--ink45); text-decoration: line-through; }
tr.pazymeta td { background: var(--medus-fonas) !important; }
.neig { color: var(--medus-tekstas); }
.teig { color: var(--zalia-tekstas); }
.rizika { display: inline-block; font-family: var(--mono); font-size: 10px; letter-spacing: .08em; color: var(--medus-tekstas); background: var(--medus-fonas);
  border-radius: 6px; padding: 1px 6px; margin-left: 4px; }
.puslapiai { display: flex; gap: 16px; align-items: center; justify-content: center; margin: 18px 0; font-size: 14px; }
.puslapiai span { font-family: var(--mono); font-size: 12px; color: var(--ink2); }
.issaugoti { display: flex; gap: 8px; align-items: flex-end; max-width: 640px; margin-top: 28px; }
.issaugoti label { flex: 1; margin: 0; }
.tuscia { color: var(--ink2); font-size: 13px; }
.tuscia-didelis { background: var(--balta); border: 1px dashed var(--linija); border-radius: var(--r-kortele); padding: 30px; color: var(--ink2); }
.tuscia-didelis p:first-child { color: var(--ink); font-weight: 700; font-size: 17px; margin-top: 0; }

/* Puslapiai be juostos */
.lapas, .kortele { max-width: 1200px; margin: 0 auto; padding: 32px 28px 72px; }
.skirtukai { display: flex; gap: 6px; margin-bottom: 18px; overflow-x: auto; padding-bottom: 2px; }
.skirtukai a { padding: 8px 14px; text-decoration: none; color: var(--ink); border: 1px solid var(--linija); border-radius: 999px; white-space: nowrap; font-weight: 500; background: var(--balta); }
.skirtukai a:hover { border-color: var(--ink); }
.skirtukai a[aria-current] { color: var(--kaulas); background: var(--ink); border-color: var(--ink); }
.eilute-filtru { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 18px; background: var(--ploks); border-radius: var(--r-kortele); padding: 16px 18px 16px; }
.eilute-filtru label { margin: 0; min-width: 160px; }

/* Rodiklių juosta */
.rodikliai { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin: 22px 0; }
.rodikliai > div { background: var(--balta); padding: 16px 18px; border: 1px solid var(--linija); border-radius: var(--r-kortele); box-shadow: var(--seselis); }
.rodikliai span { display: block; }
.rodikliai strong { display: block; font-size: 26px; font-weight: 700; letter-spacing: -0.02em; margin-top: 6px; }
.rodikliai em { display: block; font-style: normal; font-size: 12px; color: var(--ink2); margin-top: 3px; }
.rodikliai em.teig { color: var(--zalia-tekstas); } .rodikliai em.neig { color: var(--medus-tekstas); }

/* Įmonės kortelė: įmonės kodas kaip Zitutės ženkliukas */
.korteles-virsus { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; }
.kodas { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; font-family: var(--mono); font-size: 13px; letter-spacing: .14em; color: var(--ink);
  background: var(--kaulas); border-radius: var(--r-zenkliukas); padding: 5px 11px; }
.kodas::before { content: ""; width: 8px; height: 8px; border-radius: 2px; background: var(--medus); }
.kortele h1 { font-size: 38px; margin-bottom: 8px; }
.apie { margin: 2px 0; color: var(--ink2); }
.zyma-raudona { display: inline-block; font-family: var(--mono); font-size: 11px; letter-spacing: .1em; color: var(--medus-tekstas); background: var(--medus-fonas); border-radius: 6px; padding: 2px 8px; margin-left: 8px; }
.rizikos { background: var(--medus-fonas); border-radius: var(--r-kortele); padding: 14px 18px; margin-top: 20px; }
.rizikos p { margin: 0; }
.dviese { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; }
.dviese > section > h2:first-child, .dviese > div > h2:first-child { margin-top: 28px; }
.duomenys { display: grid; grid-template-columns: 150px 1fr; gap: 10px 14px; margin: 0; font-size: 14px; background: var(--balta); border: 1px solid var(--linija);
  border-radius: var(--r-kortele); padding: 18px 20px; box-shadow: var(--seselis); }
.duomenys dt { color: var(--ink2); }
.duomenys dd { margin: 0; }
details { margin-top: 10px; }
summary { cursor: pointer; font-size: 13px; }
.kontaktai { list-style: none; padding: 0; font-size: 13px; }
.laiko-juosta { list-style: none; padding: 0 0 0 16px; border-left: 2px solid var(--kaulas); margin: 0; }
.laiko-juosta li { margin: 0 0 10px; position: relative; }
.laiko-juosta li::before { content: ""; position: absolute; left: -22px; top: 5px; width: 10px; height: 10px; border-radius: 3px; background: var(--medus); }
.laiko-juosta strong { font-family: var(--mono); font-size: 13px; }
.grafiko-pavadinimas { margin: 16px 0 6px; }
.saltinis { font-size: 12px; color: var(--ink2); margin-top: 10px; }
.pazymeta-eilute { background: var(--medus-fonas); padding: 12px 16px; border-radius: 12px; }
.pranesimas { background: var(--zalia-fonas); border-radius: var(--r-kortele); padding: 14px 18px; margin-bottom: 18px; }
form.tarpe { display: inline; margin-left: 6px; }

/* Grafikai (SVG) */
.grafikas { width: 100%; height: auto; display: block; }
.grafikas .teig { fill: var(--ink); }
.grafikas.pelnas .teig { fill: var(--medus); }
.grafikas .neig { fill: var(--medus-tekstas); opacity: .55; }
.grafikas .nulis { stroke: var(--linija); stroke-width: 1; }
.grafikas .reiksme { font-family: var(--mono); font-size: 10px; fill: var(--ink); text-anchor: middle; }
.grafikas .zyma { font-family: var(--mono); font-size: 10px; fill: var(--ink2); text-anchor: middle; }
.grafikas .kaire { text-anchor: start; } .grafikas .desine { text-anchor: end; }
.grafikas .kreive { fill: none; stroke: var(--ink); stroke-width: 2; stroke-linejoin: round; }
.grafikas .taskas { fill: var(--medus); }

@media (max-width: 900px) {
  main.su-juosta { grid-template-columns: 1fr; }
  .filtrai { position: static; max-height: none; border-right: 0; border-bottom: 1px solid var(--linija); }
  .veiksmai { position: static; }
  .dviese { grid-template-columns: 1fr; gap: 0; }
  .virsus { gap: 12px; padding: 0 16px; }
  .zenklas span, .kas { display: none; }
  .rezultatai, .lapas, .kortele { padding-left: 16px; padding-right: 16px; }
  .lentele { display: block; overflow-x: auto; }
  .korteles-virsus { flex-direction: column; }
  .kortele h1 { font-size: 30px; }
  .duomenys { grid-template-columns: 1fr; gap: 2px; }
  .duomenys dd { margin-bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* Kampanijos */
textarea { display: block; width: 100%; margin-top: 5px; font: inherit; font-size: 14px; line-height: 1.55; color: var(--ink); background: var(--popierius);
  border: 1px solid var(--linija); border-radius: 12px; padding: 12px 14px; resize: vertical; }
textarea:focus { border-color: var(--ink); outline: none; background: var(--balta); }
button[disabled] { opacity: .4; cursor: not-allowed; }
code { font-family: var(--mono); font-size: 12px; background: var(--kaulas); border-radius: 6px; padding: 1px 5px; }
.antraste-su-veiksmu { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 8px; }
.antraste-su-veiksmu h1 { margin: 0; }
.atgal { margin: 0 0 10px; font-size: 13px; }
.busena { display: inline-block; font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; border-radius: 6px; padding: 3px 8px; background: var(--kaulas); }
.busena-siunciama, .busena-eileje { background: var(--medus-fonas); color: var(--medus-tekstas); }
.busena-baigta { background: var(--zalia-fonas); color: var(--zalia-tekstas); }
.busena-sustabdyta { background: var(--ink); color: var(--kaulas); }
.kortele-forma { background: var(--balta); border: 1px solid var(--linija); border-radius: var(--r-kortele); padding: 22px; box-shadow: var(--seselis); margin-top: 28px; }
.kampanijos-redaktorius > div { margin-top: 28px; }
.veiksmu-eile { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 12px 0; }
.veiksmu-eile form { margin: 0; }
.laisko-perziura { background: var(--balta); border: 1px solid var(--linija); border-radius: var(--r-kortele); overflow: hidden; box-shadow: var(--seselis); }
.laisko-perziura iframe { width: 100%; height: 420px; border: 0; display: block; }
.laisko-galva { margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--linija-sv); font-size: 13px; background: var(--balta); }
.laisko-galva span { font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink2); display: inline-block; width: 46px; }
.siaura-forma { margin-top: 16px; }
.paleidimas { margin: 8px 0 18px; }
.paleidimas button { width: 100%; height: 50px; font-size: 15px; }

/* 2 etapas: atlyginimų palyginimas ir stebimų įmonių pokyčiai */
.grafikas .kreive.antra { stroke: var(--medus); stroke-width: 2; stroke-dasharray: 5 4; }
.legenda { display: flex; gap: 16px; font-size: 12px; color: var(--ink2); margin: 4px 0 0; }
.legenda span::before { content: ""; display: inline-block; width: 16px; height: 0; border-top: 2px solid var(--ink); vertical-align: middle; margin-right: 6px; }
.legenda span.antra::before { border-top: 2px dashed var(--medus); }
.palyginimas { display: grid; gap: 10px; margin: 14px 0; }
.palyginimas .eil { display: grid; grid-template-columns: minmax(150px, 1.2fr) 2fr minmax(90px, auto); gap: 14px; align-items: center; }
.palyginimas .pav { font-size: 13px; }
.palyginimas .pav small { display: block; color: var(--ink2); font-size: 12px; }
.skale { position: relative; height: 26px; background: var(--ploks); border-radius: 8px; }
.skale .ribos { position: absolute; top: 5px; bottom: 5px; background: var(--kaulas); border-radius: 5px; }
.skale .med { position: absolute; top: 2px; bottom: 2px; width: 2px; background: var(--ink2); }
.skale .ji { position: absolute; top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 3px; background: var(--medus); box-shadow: 0 0 0 2px var(--balta); }
.palyginimas .rez { font-family: var(--mono); font-size: 12px; text-align: right; }
.pokyciai { list-style: none; padding: 0; margin: 0; }
.pokyciai li { padding: 10px 0; border-bottom: 1px solid var(--linija); display: grid; grid-template-columns: 96px 1fr; gap: 12px; }
.pokyciai li .d { font-family: var(--mono); font-size: 12px; color: var(--ink2); padding-top: 2px; }
.pokyciai li.svarbu .tekstas::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 2px; background: var(--medus); margin-right: 8px; }
@media (max-width: 720px) {
  .palyginimas .eil { grid-template-columns: 1fr; gap: 4px; }
  .palyginimas .rez { text-align: left; }
}
