/* ============================================================
   DobreZiola — single.css
   Pojedynczy wpis: layout 2-kolumnowy, typografia treści,
   sidebar (autorka, TOC, newsletter, recent), komentarze.
   ============================================================ */

/* ---------- Layout ---------- */
.dz-single-main, .dz-page-main { background: var(--dz-cream); }
.dz-single-wrap, .dz-page-wrap {
	max-width: var(--dz-max); margin: 0 auto;
	padding: clamp(1.5rem,4vw,3rem) var(--dz-pad);
	display: grid; gap: clamp(2rem,4vw,3.5rem);
	grid-template-columns: minmax(0, 1fr) 340px;
	align-items: start;
	width: 100%;
	max-width: min(var(--dz-max), 100%);   /* nigdy szerszy niż ekran */
}
.dz-page-wrap { grid-template-columns: minmax(0, 820px); justify-content: center; }
/* Lewa kolumna: artykuł + komentarze w jednym kontenerze (siatka ma dokładnie 2 elementy) */
.dz-single-primary {
	min-width: 0;
	overflow-x: clip;   /* kolumna nigdy nie rozciąga siatki */
	max-width: 100%;
}

/* ---------- Header wpisu ---------- */
.dz-single-header { margin-bottom: 1.5rem; }
.dz-single-header .dz-badge { margin-bottom: 1rem; }
.dz-single-title {
	font-size: clamp(2rem, 4.5vw, 3.1rem); line-height: 1.12;
	margin: 0 0 1rem; letter-spacing: -0.02em;
}
.dz-page-title { font-size: clamp(2rem,4.5vw,3rem); margin: .5rem 0 1rem; }

/* Meta */
.dz-post-meta { display: flex; flex-wrap: wrap; gap: 1.25rem; color: var(--dz-text-muted); font-size: .88rem; }
.dz-meta-item { display: inline-flex; align-items: center; gap: .4rem; }
.dz-meta-icon { color: var(--dz-green-light); flex-shrink: 0; }

/* Zdjęcie główne */
.dz-single-featured, .dz-page-featured { margin: 0 0 2rem; border-radius: var(--dz-r-lg); overflow: hidden; box-shadow: var(--dz-shadow-md); }
.dz-single-img { width: 100%; height: auto; }

/* ---------- TOC mobile ---------- */
.dz-toc-mobile {
	margin: 0 0 2rem; padding: 0; background: var(--dz-green-mist);
	border: 1px solid var(--dz-green-pale); border-radius: var(--dz-r-md);
}
.dz-toc-mobile summary {
	padding: 1rem 1.25rem; font-family: var(--dz-font-head); font-weight: 600;
	font-size: 1.05rem; color: var(--dz-green-dark); cursor: pointer; list-style: none;
	display: flex; align-items: center; justify-content: space-between;
}
.dz-toc-mobile summary::-webkit-details-marker { display: none; }
.dz-toc-mobile summary::after { content: '▾'; transition: transform var(--dz-t); }
.dz-toc-mobile[open] summary::after { transform: rotate(180deg); }
.dz-toc-mobile .dz-toc-list { padding: 0 1.25rem 1.25rem; }
@media (min-width: 769px) { .dz-toc-mobile { display: none; } }

/* ============================================================
   TREŚĆ WPISU — typografia long-form
   ============================================================ */
.dz-single-content {
	font-size: 1.09rem; line-height: 1.85; color: var(--dz-text);
	overflow-wrap: break-word; word-wrap: break-word;
	word-break: break-word;
	min-width: 0; max-width: 100%;
	overflow-x: clip;
}
/* ── UNIWERSALNY GUARD: żadne dziecko treści nie przekroczy szerokości ── */
.dz-single-content > * {
	max-width: 100%;
}
/* Elementy zastępowane (replaced) + osadzenia (ads, mapy, yt) — twardo */
.dz-single-content img,
.dz-single-content iframe,
.dz-single-content video,
.dz-single-content embed,
.dz-single-content object,
.dz-single-content canvas,
.dz-single-content svg,
.dz-single-content ins,           /* AdSense wstawia <ins class="adsbygoogle"> */
.dz-single-content .adsbygoogle {
	max-width: 100% !important;
	height: auto;
}
/* Bardzo długie słowa / linki bez spacji w listach i akapitach */
.dz-single-content p,
.dz-single-content li,
.dz-single-content td,
.dz-single-content a,
.dz-single-content h1,
.dz-single-content h2,
.dz-single-content h3,
.dz-single-content h4 {
	overflow-wrap: anywhere;
	word-break: break-word;
}
.dz-single-content > * + * { margin-top: 1.35rem; }
.dz-single-content p { margin: 0 0 1.35rem; }

/* Lead paragraph (pierwszy akapit) */
.dz-single-content > p:first-of-type {
	font-size: 1.22rem; line-height: 1.7; color: var(--dz-text-soft); font-weight: 400;
}

/* Nagłówki w treści */
.dz-single-content h2 {
	font-size: clamp(1.6rem,3vw,2.1rem); line-height: 1.25;
	margin: 2.75rem 0 1rem; padding-top: .5rem; position: relative;
}
.dz-single-content h2::before {
	content: ''; display: block; width: 44px; height: 3px; margin-bottom: 1rem;
	background: linear-gradient(90deg, var(--dz-gold), transparent); border-radius: 2px;
}
.dz-single-content h3 { font-size: clamp(1.3rem,2.4vw,1.6rem); margin: 2rem 0 .85rem; color: var(--dz-green-mid); }
.dz-single-content h4 { font-size: 1.2rem; margin: 1.75rem 0 .65rem; }

/* Linki w treści */
.dz-single-content a { color: var(--dz-green-mid); text-decoration: underline; text-decoration-color: var(--dz-gold-soft); text-underline-offset: 3px; text-decoration-thickness: 1.5px; transition: all var(--dz-t); }
.dz-single-content a:hover { color: var(--dz-green-dark); text-decoration-color: var(--dz-green-dark); }

/* Wyróżnienia */
.dz-single-content strong, .dz-single-content b { color: var(--dz-green-dark); font-weight: 700; }

/* Listy */
.dz-single-content ul, .dz-single-content ol { margin: 0 0 1.35rem; padding-left: 1.5rem; }
.dz-single-content li { margin-bottom: .6rem; padding-left: .35rem; }
.dz-single-content ul li::marker { color: var(--dz-green-light); }
.dz-single-content ol li::marker { color: var(--dz-green-light); font-weight: 600; }
/* Lista z liściami zamiast bulletów (opcjonalna klasa .dz-leaf-list) */
.dz-single-content ul.dz-leaf-list { list-style: none; padding-left: 0; }
.dz-single-content ul.dz-leaf-list li { position: relative; padding-left: 1.85rem; }
.dz-single-content ul.dz-leaf-list li::before {
	content: ''; position: absolute; left: 0; top: .55em; width: 14px; height: 14px;
	background: var(--dz-green-light); border-radius: 50% 0 50% 50%; transform: rotate(45deg);
}

/* Cytaty */
.dz-single-content blockquote {
	margin: 2rem 0; padding: 1.5rem 1.75rem;
	background: var(--dz-green-mist); border-left: 4px solid var(--dz-green-light);
	border-radius: 0 var(--dz-r-md) var(--dz-r-md) 0;
	font-size: 1.15rem; line-height: 1.65; font-style: italic; color: var(--dz-green-dark);
}
.dz-single-content blockquote p:last-child { margin-bottom: 0; }
.dz-single-content blockquote cite { display: block; margin-top: .75rem; font-size: .9rem; font-style: normal; color: var(--dz-text-muted); }

/* Obrazy w treści */
.dz-single-content img {
	max-width: 100% !important; height: auto !important;  /* bije inline style z Bloggera */
	border-radius: var(--dz-r-md); box-shadow: var(--dz-shadow-sm); margin: 1.5rem auto;
}
.dz-single-content :where(iframe, video, embed, object) { max-width: 100% !important; }
.dz-single-content figure { margin: 2rem 0; max-width: 100%; overflow: hidden; }
.dz-single-content figcaption { text-align: center; font-size: .85rem; color: var(--dz-text-muted); margin-top: .65rem; font-style: italic; }
/* WordPress alignment — na mobile zdejmujemy float żeby nie wyjeżdżało */
@media (max-width: 680px) {
	.dz-single-content .alignleft,
	.dz-single-content .alignright {
		float: none !important; margin: 1rem auto !important;
		display: block; max-width: 100% !important;
	}
	.dz-single-content .wp-caption,
	.dz-single-content .wp-block-image,
	.dz-single-content [class*="size-"] { max-width: 100% !important; width: auto !important; }
}

/* Tabele */
/* Tabele — JS owija je w .dz-table-scroll; fallback gdy JS niedostępny */
.dz-table-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
	max-width: 100%; margin: 1.75rem 0;
	border-radius: var(--dz-r-md); box-shadow: var(--dz-shadow-sm);
}
.dz-single-content table {
	width: 100%; border-collapse: collapse; font-size: .95rem;
	margin: 0; box-shadow: none; border-radius: 0;  /* margin/shadow przeniesione na wrapper */
}
/* Fallback — gdy tabela NIE jest w wrapperze (JS się nie załadował) */
.dz-single-content table:not(.dz-table-scroll > table) {
	display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;
	margin: 1.75rem 0; box-shadow: var(--dz-shadow-sm);
	border-radius: var(--dz-r-md); max-width: 100%;
}
.dz-single-content th { background: var(--dz-green-dark); color: #fff; padding: .85rem 1rem; text-align: left; font-family: var(--dz-font-head); }
.dz-single-content td { padding: .75rem 1rem; border-bottom: 1px solid var(--dz-border); background: var(--dz-white); }
.dz-single-content tr:nth-child(even) td { background: var(--dz-green-mist); }

/* Kod */
.dz-single-content code { background: var(--dz-green-pale); padding: .15em .45em; border-radius: var(--dz-r-sm); font-size: .9em; color: var(--dz-green-dark); overflow-wrap: anywhere; }
.dz-single-content pre { background: #1e293b; color: #e2e8f0; padding: 1.25rem; border-radius: var(--dz-r-md); overflow-x: auto; margin: 1.75rem 0; }
.dz-single-content pre code { background: transparent; padding: 0; color: inherit; }

/* Pierwsze zdjęcie — fetchpriority, większe */
.dz-single-content > p:first-of-type img,
.dz-single-content > figure:first-child img { width: 100%; }

/* Box "uwaga / wskazówka" — opcjonalna klasa */
.dz-single-content .dz-note {
	margin: 1.75rem 0; padding: 1.25rem 1.5rem;
	background: var(--dz-green-mist); border: 1px solid var(--dz-green-pale);
	border-radius: var(--dz-r-md); display: flex; gap: .85rem;
}

/* ---------- Stopka wpisu ---------- */
.dz-single-footer { margin-top: 2.5rem; padding-top: 1.75rem; border-top: 1px solid var(--dz-border); }
.dz-single-tags { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: 1.5rem; }
.dz-tags-label { font-size: .85rem; font-weight: 600; color: var(--dz-text-muted); text-transform: uppercase; letter-spacing: .05em; }
.dz-tag {
	display: inline-block; padding: .35rem .85rem; font-size: .82rem;
	background: var(--dz-green-pale); color: var(--dz-green-dark);
	border-radius: var(--dz-r-full); transition: all var(--dz-t);
}
.dz-tag:hover { background: var(--dz-green-dark); color: #fff; }

/* Share */
.dz-share { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; }
.dz-share-label { font-size: .85rem; font-weight: 600; color: var(--dz-text-muted); text-transform: uppercase; letter-spacing: .05em; margin-right: .25rem; }
.dz-share-btn {
	display: flex; align-items: center; justify-content: center;
	width: 42px; height: 42px; border-radius: var(--dz-r-full);
	background: var(--dz-green-pale); color: var(--dz-green-dark); transition: all var(--dz-t);
}
.dz-share-btn:hover { color: #fff; transform: translateY(-3px); }
.dz-share-fb:hover { background: #1877f2; }
.dz-share-pin:hover { background: #e60023; }
.dz-share-x:hover { background: #000; }
.dz-share-mail:hover { background: var(--dz-green-mid); }

/* Page links (paginacja treści) */
.dz-page-links { margin: 2rem 0; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.dz-page-links a, .dz-page-links > span { display: inline-flex; min-width: 36px; height: 36px; align-items: center; justify-content: center; padding: 0 .65rem; border: 1px solid var(--dz-border); border-radius: var(--dz-r-sm); }
.dz-page-links a:hover { background: var(--dz-green-pale); }

/* ============================================================
   SIDEBAR
   ============================================================ */
.dz-sidebar { display: flex; flex-direction: column; gap: 1.5rem; }
.dz-widget {
	background: var(--dz-white); border: 1px solid var(--dz-border);
	border-radius: var(--dz-r-lg); padding: 1.5rem;
}
.dz-widget-title { font-size: 1.1rem; margin: 0 0 1rem; display: flex; align-items: center; gap: .5rem; }

/* Author box */
.dz-author-box { text-align: center; background: linear-gradient(160deg, var(--dz-white), var(--dz-green-mist)); }
.dz-author-avatar { width: 90px; height: 90px; margin: 0 auto 1rem; border-radius: 50%; overflow: hidden; border: 3px solid var(--dz-white); box-shadow: var(--dz-shadow-md); }
.dz-author-avatar img { width: 100%; height: 100%; object-fit: cover; }
.dz-author-avatar-placeholder { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: var(--dz-green-pale); color: var(--dz-green-light); }
.dz-author-name { font-size: 1.2rem; margin: 0 0 .65rem; display: flex; align-items: center; justify-content: center; gap: .35rem; }
.dz-author-leaf { color: var(--dz-gold); display: inline-flex; }
.dz-author-bio { font-size: .9rem; line-height: 1.6; color: var(--dz-text-soft); margin: 0 0 1.25rem; }

/* TOC sticky */
/* Spis treści w normalnym przepływie (drugi w sidebarze) */
.dz-toc--sticky { position: static; }
.dz-toc-list { list-style: none; counter-reset: toc; padding: 0; margin: 0; }
.dz-toc-item { counter-increment: toc; line-height: 1.4; }
.dz-toc-item a {
	display: block; padding: .5rem .75rem .5rem 2.4rem; position: relative;
	font-size: .9rem; color: var(--dz-text-soft); border-radius: var(--dz-r-sm);
	border-left: 2px solid transparent; transition: all var(--dz-t);
}
.dz-toc-item a::before {
	content: counter(toc); position: absolute; left: .65rem; top: .5rem;
	width: 1.3rem; height: 1.3rem; display: flex; align-items: center; justify-content: center;
	font-size: .72rem; font-weight: 600; color: var(--dz-green-light);
	background: var(--dz-green-pale); border-radius: 50%;
}
.dz-toc-item--h3 a { padding-left: 3rem; font-size: .85rem; }
.dz-toc-item--h3 a::before { left: 1.2rem; transform: scale(.82); }
.dz-toc-item a:hover { background: var(--dz-green-mist); color: var(--dz-green-dark); border-left-color: var(--dz-green-light); }
.dz-toc-item a.dz-toc-active { background: var(--dz-green-pale); color: var(--dz-green-dark); font-weight: 600; border-left-color: var(--dz-green-dark); }
.dz-toc-item a.dz-toc-active::before { background: var(--dz-green-dark); color: #fff; }

/* Newsletter */
.dz-newsletter { position: relative; text-align: center; background: linear-gradient(160deg, var(--dz-green-dark), var(--dz-green-mid)); color: #fff; overflow: hidden; }
.dz-newsletter::after { content: ''; position: absolute; width: 160px; height: 160px; bottom: -70px; right: -50px; background: rgba(255,255,255,.06); border-radius: 50% 0 50% 50%; transform: rotate(30deg); }
.dz-newsletter-deco { position: relative; display: inline-flex; color: var(--dz-gold-soft); margin-bottom: .5rem; }
.dz-newsletter-title { color: #fff; justify-content: center; position: relative; }
.dz-newsletter-text { font-size: .9rem; line-height: 1.6; color: rgba(255,255,255,.85); margin: 0 0 1.25rem; position: relative; }
.dz-newsletter-form { display: flex; flex-direction: column; gap: .6rem; position: relative; }
.dz-newsletter-input { padding: .8rem 1rem; border: none; border-radius: var(--dz-r-full); font-family: inherit; font-size: .95rem; text-align: center; }
.dz-newsletter-input:focus { outline: 2px solid var(--dz-gold-soft); }
.dz-newsletter-btn { background: var(--dz-gold); color: var(--dz-green-dark); }
.dz-newsletter-btn:hover { background: #fff; color: var(--dz-green-dark); }
.dz-newsletter-hint { font-size: .8rem; color: rgba(255,255,255,.7); position: relative; }

/* Recent posts */
.dz-recent-list { list-style: none; display: flex; flex-direction: column; gap: 1rem; }
.dz-recent-link { display: flex; gap: .85rem; align-items: center; color: inherit; }
.dz-recent-thumb { width: 70px; height: 56px; flex-shrink: 0; border-radius: var(--dz-r-sm); overflow: hidden; background: var(--dz-green-mist); }
.dz-recent-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dz-t); }
.dz-recent-link:hover .dz-recent-thumb img { transform: scale(1.08); }
.dz-recent-thumb-placeholder { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: var(--dz-green-light); opacity: .4; }
.dz-recent-title { display: block; font-family: var(--dz-font-head); font-size: .92rem; line-height: 1.3; color: var(--dz-green-dark); font-weight: 500; transition: color var(--dz-t); display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dz-recent-link:hover .dz-recent-title { color: var(--dz-green-mid); }
.dz-recent-date { font-size: .76rem; color: var(--dz-text-muted); margin-top: .2rem; display: block; }

/* Widget generyczny */
.dz-widget ul { list-style: none; }
.dz-widget li { margin-bottom: .5rem; }
.dz-widget a { color: var(--dz-text-soft); }
.dz-widget a:hover { color: var(--dz-green-dark); }

/* ============================================================
   KOMENTARZE
   ============================================================ */
.dz-comments { max-width: 820px; margin: 3rem 0 0; padding-top: 2.5rem; border-top: 1px solid var(--dz-border); }
.dz-comments-title { font-size: 1.5rem; margin-bottom: 1.5rem; }
.dz-comment-list { list-style: none; }
.dz-comment-list .comment { margin-bottom: 1.5rem; }
.dz-comment-list .comment-body { background: var(--dz-white); border: 1px solid var(--dz-border); border-radius: var(--dz-r-md); padding: 1.25rem 1.5rem; }
.dz-comment-list .children { list-style: none; margin-top: 1.5rem; padding-left: clamp(1rem,3vw,2.5rem); }
.dz-comments .comment-author { display: flex; align-items: center; gap: .65rem; margin-bottom: .5rem; }
.dz-comments .comment-author .avatar { border-radius: 50%; }
.dz-comments .fn { font-family: var(--dz-font-head); font-weight: 600; color: var(--dz-green-dark); font-style: normal; }
.dz-comments .comment-meta { font-size: .8rem; color: var(--dz-text-muted); margin-bottom: .65rem; }
.dz-comments .comment-meta a { color: var(--dz-text-muted); }
.dz-comment-notes { font-size: .85rem; color: var(--dz-text-muted); }
.dz-comments .comment-form { background: var(--dz-white); border: 1px solid var(--dz-border); border-radius: var(--dz-r-lg); padding: 1.75rem; margin-top: 2rem; }
.dz-comments .comment-form input[type="text"], .dz-comments .comment-form input[type="email"], .dz-comments .comment-form input[type="url"], .dz-comments .comment-form textarea {
	width: 100%; padding: .75rem 1rem; border: 1px solid var(--dz-border); border-radius: var(--dz-r-sm); font-family: inherit; font-size: 1rem; margin-top: .35rem;
}
.dz-comments .comment-form textarea:focus, .dz-comments .comment-form input:focus { outline: none; border-color: var(--dz-green-light); box-shadow: 0 0 0 3px var(--dz-green-pale); }
.dz-comments .comment-form p { margin-bottom: 1rem; }
.dz-comments-closed { color: var(--dz-text-muted); font-style: italic; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 980px) {
	.dz-single-wrap { grid-template-columns: 1fr; }
	.dz-sidebar { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
	.dz-toc--sticky { position: static; grid-column: 1 / -1; }
	.dz-author-box { grid-column: 1 / -1; }
}
/* Na telefonach spis treści jest już nad treścią (rozwijany) — nie dublujemy go w sidebarze */
@media (max-width: 768px) {
	.dz-toc--sticky { display: none; }
	/* Tabele — obsługa przez .dz-table-scroll wrapper (patrz JS + reguły wyżej) */
}
@media (max-width: 600px) {
	.dz-sidebar { grid-template-columns: 1fr; }
	.dz-single-content { font-size: 1.05rem; }
	.dz-single-content > p:first-of-type { font-size: 1.12rem; }
}