/*
 * Akademia Du Ponta, Slownik pojec i Pomoc: spis lekcji, lekcje, wyprowadzenia wzorow, quiz,
 * siatka hasel slownika z indeksem liter, FAQ. Tylko zmienne kolorow z app.css (jasny i ciemny motyw).
 */

/* Spis lekcji i spisy stron */
.spis-akademii ol, .spis-pomocy ol { margin:8px 0 0; padding-left:22px; columns:2 260px; column-gap:28px; }
.spis-akademii li, .spis-pomocy li { margin:3px 0; break-inside:avoid; color:var(--text-3); }
.spis-akademii a, .spis-pomocy a { color:var(--text); text-decoration:none; font-weight:500; }
.spis-akademii a:hover, .spis-pomocy a:hover { color:var(--clay); text-decoration:underline; }
.spis-pomocy { margin-bottom:14px; }

/* Lekcje */
.lekcja { scroll-margin-top:calc(var(--topbar) + 12px); }
.lekcja .sekcja-glowa .liczba { margin-left:auto; }
.do-spisu { font-size:.8rem; color:var(--text-3); text-decoration:none; }
.do-spisu:hover { color:var(--clay); }
.lekcja-tresc > :first-child { margin-top:0; }
.lekcja-tresc h3 { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.lekcja-tresc .tabela-w { margin:10px 0 14px; }
.lekcja-tresc .tabela { color:var(--text); }
.lekcja-tresc .wzor { margin:8px 0; }
.lekcja-tresc .dymek-dane { display:block; margin:6px 0 12px; }
.lekcja-tresc .rownanie, .lekcja-tresc .drzewo { margin:10px 0; }
.lekcja-tresc .komunikat { margin:10px 0 14px; }
.wzor-wyprowadzenie { display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; font-size:1rem; padding:12px 14px; }
.skreslony { text-decoration:line-through; text-decoration-color:var(--clay); text-decoration-thickness:2px; color:var(--text-2); }
.strona-salda { display:inline-block; min-width:26px; font-family:var(--mono); font-size:.72rem; color:var(--text-3); }
.tabela-mapy td:first-child { white-space:nowrap; }
.tabela-dzwigni td:first-child, .tabela-dzwigni td:last-child { white-space:nowrap; }
.tabela-dzwigni td:nth-child(3) { white-space:nowrap; }
.tabela-dzwigni td:nth-child(2) { min-width:240px; }
.przyklad .dymek { margin-left:4px; }

/* Pulapki, strony pomocy, skroty (listy definicji) */
.pulapki, .pomoc-strony, .haslo-meta { margin:0; }
.pulapki dt, .pomoc-strony dt { font-weight:600; color:var(--text); margin-top:12px; }
.pulapki dt:first-child, .pomoc-strony dt:first-child { margin-top:0; }
.pulapki dd, .pomoc-strony dd { margin:3px 0 0; color:var(--text-2); line-height:1.6; }
.pomoc-strony dt a { color:var(--text); text-decoration:none; }
.pomoc-strony dt a:hover { color:var(--clay); }
.skroty { display:grid; grid-template-columns:max-content 1fr; gap:6px 16px; margin:0; font-size:.92rem; }
.skroty dt { font-family:var(--mono); font-size:.85rem; color:var(--text); font-weight:600; }
.skroty dd { margin:0; color:var(--text-2); }

/* Rozwijane odpowiedzi (cwiczenia, FAQ) */
details.rozwin { border:1px solid var(--line); border-radius:var(--r); background:var(--surface-2); margin:8px 0; }
details.rozwin > summary { cursor:pointer; padding:10px 14px; font-weight:500; color:var(--text); list-style:none; display:flex; gap:10px; align-items:baseline; }
details.rozwin > summary::-webkit-details-marker { display:none; }
details.rozwin > summary::before { content:"+"; font-family:var(--mono); color:var(--clay); flex:none; width:12px; }
details.rozwin[open] > summary::before { content:"-"; }
details.rozwin > summary:hover { color:var(--clay); }
details.rozwin > summary:focus-visible { outline:2px solid var(--clay); outline-offset:2px; border-radius:var(--r); }
details.rozwin > p { margin:0; padding:0 14px 12px 36px; color:var(--text-2); line-height:1.65; }
.cwiczenia { padding-left:22px; }
.cwiczenia > li { margin:0 0 16px; }
.cwiczenia > li > p { margin:0 0 6px; }
.faq details.rozwin > summary { font-weight:560; }

/* Quiz */
.quiz .pytanie { border:1px solid var(--line); border-radius:var(--r); padding:12px 14px 8px; margin:0 0 12px; background:var(--surface); }
.quiz legend { font-weight:560; color:var(--text); padding:0 6px; line-height:1.5; }
.pytanie-nr { font-family:var(--mono); color:var(--clay); margin-right:2px; }
.odpowiedz { display:flex; gap:10px; align-items:flex-start; padding:7px 8px; margin:2px 0; border-radius:var(--r); cursor:pointer; color:var(--text-2); line-height:1.5; }
.odpowiedz:hover { background:var(--surface-2); color:var(--text); }
.odpowiedz input { width:18px; height:18px; margin:2px 0 0; flex:none; accent-color:var(--przycisk); }
.odpowiedz:has(input:checked) { background:var(--surface-2); color:var(--text); box-shadow:inset 3px 0 0 var(--clay); }
.wynik-quizu { display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px; margin:0 0 14px; padding:14px 16px; border-radius:var(--r); background:var(--surface-2); border:1px solid var(--line); }
.wynik-quizu p { margin:0; color:var(--text-2); }
.wynik-quizu .wynik-liczba { font-family:var(--serif); font-size:2rem; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; }
.quiz-wyniki { padding-left:22px; margin:0 0 14px; }
.quiz-wyniki > li { margin:0 0 12px; padding:8px 12px; border-left:3px solid var(--line); border-radius:0 var(--r) var(--r) 0; background:var(--surface); }
.quiz-wyniki > li.odp-dobra { border-left-color:var(--dobrze); }
.quiz-wyniki > li.odp-zla { border-left-color:var(--zle); background:var(--tlo-zle); }
.quiz-wyniki p { margin:0 0 4px; }
.pytanie-tresc { font-weight:560; color:var(--text); }

/* Slownik: wyszukiwarka, litery, siatka hasel */
.slownik-szukaj { display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px 12px; margin-bottom:12px; }
.slownik-szukaj .pole { margin:0; flex:1 1 260px; }
.slownik-szukaj .przyciski { margin:0; }
.slownik-litery { display:flex; flex-wrap:wrap; gap:4px; margin:0 0 14px; }
.litera { display:inline-flex; align-items:center; justify-content:center; min-width:32px; height:32px; padding:0 6px; border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface); color:var(--text); font-size:.86rem; font-weight:500; text-decoration:none; }
a.litera:hover { border-color:var(--clay); color:var(--clay); }
.litera.aktywna { background:var(--przycisk); border-color:var(--przycisk); color:#fff; }
.litera.pusta { color:var(--text-3); opacity:.45; background:transparent; }
.litera.wszystkie { padding:0 10px; color:var(--text-2); }
.siatka-hasel { display:grid; grid-template-columns:minmax(0, 1fr); gap:12px; }
@media (min-width:900px) { .siatka-hasel { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
.haslo { border:1px solid var(--line-2); border-radius:var(--r); padding:12px 14px; background:var(--surface-2); scroll-margin-top:calc(var(--topbar) + 12px); min-width:0; }
.haslo:target { border-color:var(--clay); box-shadow:inset 0 0 0 1px var(--clay); }
.haslo-nazwa { font-family:var(--serif); font-size:1.02rem; font-weight:600; margin:0 0 4px; color:var(--text); }
.haslo p { margin:6px 0; color:var(--text-2); font-size:.9rem; line-height:1.6; }
.haslo p b { color:var(--text); font-weight:600; }
.haslo .wzor { background:var(--surface); }
.haslo-meta { display:grid; grid-template-columns:max-content minmax(0, 1fr); gap:4px 12px; font-size:.86rem; margin:8px 0; }
.haslo-meta dt { color:var(--text-3); }
.haslo-meta dd { margin:0; color:var(--text-2); overflow-wrap:anywhere; }
.haslo-wartosc { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; border-top:1px solid var(--line-2); padding-top:8px; margin-top:10px !important; }
.haslo-wartosc b { font-variant-numeric:tabular-nums; font-size:1rem; }
.haslo-wartosc a { margin-left:auto; font-size:.84rem; }

/* Pomoc na stronie bez logowania */
.pomoc-prosta .karta + .karta { margin-top:14px; }
.pomoc-prosta .spis-pomocy { margin-bottom:14px; }

/* Telefon */
@media (max-width:640px) {
  .lekcja .sekcja-glowa { flex-wrap:nowrap; }
  .lekcja .sekcja-glowa h2 { flex:1 1 auto; min-width:0; font-size:1.15rem; }
  .lekcja .sekcja-glowa .liczba { max-width:none; flex:none; }
  .tabela-mapy table, .tabela-dzwigni table, .lekcja-tresc .tabela-w table { min-width:560px; }
  .spis-akademii ol, .spis-pomocy ol { columns:1; }
  .wzor-wyprowadzenie { font-size:.9rem; padding:10px; gap:6px; }
  .skroty { grid-template-columns:minmax(64px, max-content) minmax(0, 1fr); gap:6px 10px; }
  .tabela-dzwigni td:nth-child(3) { white-space:normal; }
  .haslo-wartosc a { margin-left:0; }
  details.rozwin > p { padding-left:14px; }
}

@media print {
  details.rozwin > p { display:block; }
  .do-spisu, .slownik-litery, .slownik-szukaj { display:none; }
}