/*
Theme Name: Wszechnica Wszechwiedzy
Theme URI: https://www.wszechwiedza.pl/
Author: Wszechwiedza
Description: Motyw z responsywnym menu (desktop: dropdown, mobile: akordeon).
Version: 1.0.1
Text Domain: wszechnica
*/

/* ===== BAZA ===== */
:root{
  --ww-bg: #f3efe7;
  --ww-fg: #2d2417;
  --ww-accent: #8a6a3f;
  --ww-accent-2: #c3a57a;
  --ww-border: rgba(0,0,0,.12);
  --radius: 10px;
  --shadow: 0 8px 24px rgba(0,0,0,.12);
  --h-header: 64px;
  --bp: 992px;
  --z-nav: 1000;
  --z-dd: 1100;
}

*{ box-sizing:border-box }
html{ scroll-behavior:smooth }
body{
  margin:0;
  background:var(--ww-bg);
  color:var(--ww-fg);
  font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,"Helvetica Neue",Arial;
}
img{ max-width:100%; height:auto; display:block }
a{ color:var(--ww-fg); text-decoration:none }
a:hover{ color:var(--ww-accent) }
:focus-visible{ outline:2px solid color-mix(in oklab, var(--ww-accent) 60%, transparent); outline-offset:2px }

.container{ width:min(1100px,100%); margin:auto; padding:0 16px }
.section{ padding:24px 0 }

/* ===== HEADER/BRAND ===== */
.site-header{ position:sticky; top:0; z-index:var(--z-nav); background:var(--ww-bg); border-bottom:1px solid var(--ww-border) }
.site-header .brand{ display:flex; align-items:center; gap:12px; height:var(--h-header); padding:0 16px }
.site-header .brand .logo{ height:36px; width:auto }


/* ===== HERO / KARTY (lekki szlif) ===== */
.ww-hero { background: radial-gradient(100% 100% at 0% 0%, #f7f7fb 0%, #ffffff 70%); border: 1px solid rgba(0,0,0,.05); }
.ww-article .ww-thumb-placeholder {
  width: 100%; aspect-ratio: 16 / 9;
  background: repeating-linear-gradient(45deg, #f2f2f6, #f2f2f6 10px, #ececf2 10px, #ececf2 20px);
  display: block;
}
.ww-cat-tile { background:#f8f9fb; border:1px solid rgba(0,0,0,.06); transition: transform .15s ease, box-shadow .15s ease; }
.ww-cat-tile:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.06); }
.ww-thumb { object-fit:cover; height:100%; width:100%; border-top-left-radius:.75rem; border-top-right-radius:.75rem; }

/* ===== Webmaster link (stopka) ===== */
p.webmaster { color:#707070; }
p.webmaster a { color:#808080; text-decoration:none; }
p.webmaster a:hover { color:#5050e0; }

/* ===== STOPKA – jedna, spójna definicja ===== */
.site-footer{
  margin-top:32px; padding:24px 0;
  background:#4d2c00; color:#fff; text-align:center;
  border-top:1px solid var(--ww-border);
}
.site-footer .container{
  display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between;
}
.site-footer p{ margin:0; color:#fff; }

/* Docelowo (bez !important), jeśli nigdzie indziej nie ma kolizji */
.site-footer, footer, #colophon{
  background:#4d2c00;
  color:#fff;
  text-align:center;
  padding:16px 0;
  border-top:1px solid rgba(0,0,0,.12);
}
.site-footer p, footer p, #colophon p{ margin:0.3em 0; color:#fff; }
.site-footer a, footer a, #colophon a{ color:#fff; text-decoration:none; }
.site-footer a:hover, footer a:hover, #colophon a:hover{ opacity:.85; }

.category-landing {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 20px;
}

.category-title {
  text-align: center;
  font-size: 2em;
  margin-bottom: 20px;
  color: #003399;
}

.category-description {
  font-size: 1.1em;
  color: #444;
  margin-bottom: 40px;
  text-align: justify;
}

.post-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.post-item {
  border-bottom: 1px solid #ddd;
  margin-bottom: 25px;
  padding-bottom: 15px;
}

.post-title a {
  text-decoration: none;
  color: #003399;
}

.post-title a:hover {
  text-decoration: underline;
}

.post-excerpt {
  color: #333;
  font-size: 1em;
  line-height: 1.5;
  margin-top: 8px;
}

.pagination {
  text-align: center;
  margin-top: 30px;
}

.category-note {
  margin: 16px 0 32px;
  font-weight: 500;
  color: #333;
}

/* === Justowanie na stronach kategorii === */
.category-landing .category-description,
.category-landing .post-excerpt,
.category-landing .post-excerpt p,
.category-landing .entry-summary,
.category-landing .entry-summary p,
.category-landing .wp-block-paragraph {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;              /* ładniejsze łamanie słów */
  overflow-wrap: anywhere;    /* awaryjne łamanie bardzo długich wyrazów/URL-i */
}

/* Opcjonalnie: wszystkie akapity w sekcji treści kategorii */
.category-landing .category-intro p,
.category-landing .category-posts p {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
  overflow-wrap: anywhere;
}

/* Drobna kosmetyka listy wpisów, aby nie „schodkowało” przy długich tytułach */
.category-landing .post-title {
  margin: 0 0 6px;
  line-height: 1.25;
  word-break: break-word;
}

/* Jeżeli opis kategorii bywa długi — uczytelnienie interlinii */
.category-landing .category-description {
  line-height: 1.6;
}

/* Jeżeli używasz <p class="category-note"> (stałe zdanie pod opisem) */
.category-landing .category-note {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

/* Justowanie treści tylko na stronie głównej */
.entry-content,
.page-content,
.post-excerpt,
main p {
  text-align: justify;
  text-justify: inter-word;
}
.wp-singular h1,
.wp-singular h2,
.wp-singular h3,
.wp-singular h4,
.wp-singular h5,
.category h1,
.category h2,
.category h3,
.category h4,
.category h5 {
  color:#4d2c00;
  text-shadow: 1px 1px 3px #705050;
  text-align: left;
}

.wp-singular h1:hover,
.wp-singular h2:hover,
.wp-singular h3:hover,
.wp-singular h4:hover, 
.wp-singular h5:hover, 
.category h1:hover,
.category h2:hover,
.category h3:hover,
.category h4:hover,
.category h5:hover {
  color:#7d2c00;
  text-shadow: 1px 1px 1px #705050;
  text-decoration: none;
}
.category .post-title {
  font-size: 1.2em;
  text-decoration: none;
}
.post-excerpt p{
  font-size: 0.8em;
}
/* Kontener rysunku */
figure {
  margin: 1.5rem auto;
  padding: 0;
  max-width: 100%;
}

/* Obraz/SVG wewnątrz figure: ładne wyśrodkowanie */
figure > img,
figure > svg,
figure > picture {
  display: block;
  margin-inline: auto;
  max-width: 100%;
  height: auto;
}

/* Podpis pod rysunkiem */
figure > figcaption {
  margin-top: .6rem;
  font-size: .95rem;
  line-height: 1.4;
  color: #5a6470;              /* delikatnie przygaszony */
  text-align: center;          /* wyśrodkowany */
  font-style: italic;          /* „opis rysunku” wygląda lepiej kursywą */
}
.caption-muted {
  font-size: .9rem;
  color: #6b7280;
  letter-spacing: .1px;
  text-align: center;
}

/* numeracja rysunków */
body { counter-reset: fig; }

/* obramowanie i układ figure */
.jxg-figure { margin: 1.5rem 0; border: 1px solid #e5e7eb; border-radius: 12px; background:#fff; }
.jxg-figure .fig-header { padding: .75rem 1rem .25rem 1rem; border-bottom: 1px solid #f1f5f9; }
.jxg-figure .fig-eyebrow { font: 600 12px/1.2 system-ui, sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#64748b; }
.jxg-figure .fig-title { font: 600 18px/1.4 system-ui, sans-serif; color:#0f172a; }
.jxg-figure .fig-caption { display:flex; gap:.5rem; align-items:center; padding:.5rem 1rem .9rem 1rem; color:#334155; font: 400 14px/1.5 system-ui, sans-serif; }
.jxg-figure .fig-number::before { counter-increment: fig; content: "Rys. " counter(fig) "."; font-weight:600; margin-right:.25rem; }

/* przycisk eksportu */
.fig-export { margin-left:auto; font:600 12px/1 system-ui,sans-serif; padding:.4rem .6rem; border:1px solid #cbd5e1; border-radius:8px; background:#f8fafc; cursor:pointer; }
.fig-export:hover { background:#eef2f7; }

/* pudełko JSXGraph */
.jxgbox { width: min(100%, 720px); height: 420px; border:0; border-radius: 0 0 12px 12px; }

/* klasy dla tekstów na wykresie */
.jxg-title { font: 600 16px/1.2 system-ui, sans-serif; fill:#0f172a; }
.jxg-axlabel { font: 500 13px/1.2 system-ui, sans-serif; fill:#334155; }
.jxg-badge { font: 500 12px/1 system-ui, sans-serif; fill:#0f172a; background:#e2e8f0; padding:.2rem .4rem; border-radius:6px; }
.math { font-variant-ligatures: none; }
