/*
 * Moduły treści – style modułów na stronie.
 * Aby zmienić: skopiuj ten plik do /wp-content/themes/TWOJ-MOTYW/moduly-tresci/moduly.css
 * (wtyczka użyje wtedy pliku z motywu zamiast tego).
 */

/* YouTube i Vimeo – responsywne 16:9 */
.mt-youtube, .mt-vimeo { position: relative; width: 100%; aspect-ratio: 16 / 9; margin: 1.5em 0; }
.mt-youtube iframe, .mt-vimeo iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Film z pliku – responsywny; proporcje z ustawień modułu albo z pliku */
.mt-film { position: relative; width: 100%; margin: 1.5em auto; background: #000; overflow: hidden; }
.mt-film video { display: block; width: 100%; height: auto; max-width: 100%; }
.mt-film--proporcje video { position: absolute; inset: 0; height: 100%; object-fit: cover; }
.mt-film--pion { width: min(100%, calc(90vh * var(--mt-film-ar, .5625))); } /* pionowy nie wyższy niż ekran */

/* Link / przycisk */
.mt-link { display: block; }
.mt-link--left { text-align: left; }
.mt-link--center { text-align: center; }
.mt-link--right { text-align: right; }

/* Akordeon */
.mt-akordeon { margin: 1.5em 0; }
.mt-akordeon__element { border-bottom: 1px solid rgba(0, 0, 0, .15); }
.mt-akordeon__tytul {
  position: relative; padding: 14px 40px 14px 0; font-weight: 600; cursor: pointer; list-style: none;
}
.mt-akordeon__tytul::-webkit-details-marker { display: none; }
.mt-akordeon__tytul::after {
  content: '+'; position: absolute; right: 8px; top: 50%; transform: translateY(-50%) rotate(0);
  font-size: 1.4em; font-weight: 400; line-height: 1; transition: transform .35s ease;
}
/* Plus obraca się o 45° w „×” – także w trakcie animacji zamykania (klasa mt-zamykanie) */
.mt-akordeon__element[open]:not(.mt-zamykanie) > .mt-akordeon__tytul::after { transform: translateY(-50%) rotate(45deg); }
.mt-akordeon__tresc { padding: 0 0 14px; box-sizing: border-box; }
.mt-akordeon__tresc img { max-width: 100%; height: auto; }
.mt-akordeon__tresc > :last-child { margin-bottom: 0; }

/* Karuzela */
.mt-karuzela { margin: 1.5em 0; }
/* Kropki karuzeli: neutralizują style list z treści (np. .lista ul li – wcięcie i ikona punktora)
   i stoją pod slajdami, a nie na zdjęciach. Wygląd kropek zostaje z motywu lub karuzela.css. */
.mt-karuzela .krz-dots { position: static; padding: 0; margin: 1.5rem 0 0; list-style: none; background: none; }
.mt-karuzela .krz-dots > li { padding: 0; background: none; list-style: none; }
.mt-karuzela .krz-dots > li::before, .mt-karuzela .krz-dots > li::after { content: none; }
.mt-karuzela__zdjecie img { width: 100%; height: auto; }
.mt-karuzela__tytul { margin: .8em 0 .4em; }
.mt-karuzela__tekst > :last-child { margin-bottom: 0; }

/* Tabela – na wąskich ekranach przewija się w poziomie */
.mt-tabela-ramka { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 1.5em 0; }
.mt-tabela-ramka:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.mt-tabela { width: 100%; border-collapse: collapse; font-size: inherit; line-height: 1.45; }
.mt-tabela caption { caption-side: bottom; padding-top: .6em; font-size: .9em; opacity: .75; text-align: left; }
.mt-tabela th, .mt-tabela td { padding: .65em .9em; border-bottom: 1px solid rgba(0, 0, 0, .12); text-align: left; vertical-align: top; }
.mt-tabela thead th { border-bottom-width: 2px; border-bottom-color: rgba(0, 0, 0, .3); font-weight: 600; white-space: nowrap; }
.mt-tabela tbody th { font-weight: 600; }
.mt-tabela--paski tbody tr:nth-child(odd) { background: rgba(0, 0, 0, .035); }
.mt-tabela--siatka th, .mt-tabela--siatka td { border: 1px solid rgba(0, 0, 0, .15); }
.mt-tabela--srodek th, .mt-tabela--srodek td { text-align: center; }
.mt-tabela--srodek tbody th { text-align: left; }
/* listy treści (.lista ul li) nie wpływają na tabelę */
.mt-tabela td::before, .mt-tabela th::before { content: none; }

/* Spis treści (menu do nagłówków H2) */
.mt-spis { margin: 1.5em 0; padding: 1em 1.2em; border: 1px solid rgba(0, 0, 0, .12); border-radius: 6px; background: #fff; box-sizing: border-box; }
.mt-spis__tytul { margin: 0 0 .5em; font-weight: 600; }
.mt-spis__lista, .lista .mt-spis__lista { margin: 0; padding: 0 0 0 1.4em; }
.mt-spis--lista ul.mt-spis__lista { list-style: none; padding-left: 0; }
.mt-spis__element, .lista .mt-spis__element { margin: .25em 0; padding: 0; background: none; }
.mt-spis__element::before, .lista .mt-spis__element::before { content: none; }
.mt-spis__link { text-decoration: none; }
.mt-spis__link:hover, .mt-spis__link:focus { text-decoration: underline; }
.mt-spis__link--aktywny { font-weight: 600; }
/* pasek poziomy – przewijany palcem, bez łamania linii */
.mt-spis--pasek { display: flex; align-items: center; gap: 1em; padding: .6em 1em; }
.mt-spis--pasek .mt-spis__tytul { margin: 0; white-space: nowrap; }
.mt-spis--pasek .mt-spis__lista { display: flex; gap: .4em 1.4em; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.mt-spis--pasek .mt-spis__element { margin: 0; white-space: nowrap; flex: 0 0 auto; }
.mt-spis--pasek .mt-spis__link--aktywny { text-decoration: underline; text-underline-offset: .3em; }
/* przypięty u góry ekranu (opcja „przyklejony”) */
.mt-spis--przypiety { position: fixed; left: 0; right: 0; z-index: 90; margin: 0; border-radius: 0; border-width: 0 0 1px; box-shadow: 0 2px 10px rgba(0, 0, 0, .08); }
.mt-spis--przypiety.mt-spis--lista { max-height: 60vh; overflow-y: auto; }
@media (max-width: 600px) {
  .mt-spis--pasek .mt-spis__tytul { display: none; }
}

/* Spis zwijany (<details>) */
.mt-spis__zwin > summary { display: flex; align-items: center; justify-content: space-between; gap: 1em; margin: 0; cursor: pointer; list-style: none; }
.mt-spis__zwin > summary::-webkit-details-marker { display: none; }
.mt-spis__zwin > summary::after { content: ''; flex: 0 0 auto; width: .55em; height: .55em; margin-right: .2em; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-25%); transition: transform .3s cubic-bezier(.4, 0, .2, 1); }
.mt-spis__zwin[open]:not(.mt-spis--zamykanie) > summary::after { transform: rotate(-135deg) translateY(-25%); }
/* odstęp pod napisem jest częścią listy – zwija się razem z nią, bez skoku */
.mt-spis .mt-spis__zwin .mt-spis__lista { padding-top: .6em; box-sizing: content-box; }
.mt-spis__zwin > summary:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .mt-spis__zwin > summary::after { transition: none; } }