/* Poradnik: schematy w treści artykułu (pole „schemat”, app/poradnik.py _schemat; KANON.md sekcja 8).
   Ładowany tylko na stronie artykułu. Ikony z katalogu (docs/redakcja/IKONY.md).
   Biała karta na kremowym tle strony (tło strony to #FFF6EA — karta w tym samym kolorze znikała). */
.schemat{margin:40px 0;padding:28px 32px 32px;border-radius:28px;background:#FFFFFF;border:1px solid #F0E2D0;
  box-shadow:0 12px 32px rgba(122,52,20,.07);display:flex;flex-direction:column;gap:24px}
.schemat-tytul{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:clamp(20px,2.2vw,24px);line-height:1.2;
  letter-spacing:-0.01em;color:#1F1A17;padding-bottom:16px;border-bottom:1px solid #F3E7D8}
.schemat-ik{flex:0 0 auto;width:52px;height:52px;border-radius:50%;background:#FFEDE2;color:#C2410C;display:flex;
  align-items:center;justify-content:center;position:relative;z-index:1;box-shadow:0 0 0 6px #FFFFFF}
.schemat-ik .ik{width:26px;height:26px;fill:currentColor}
.schemat-lista{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.schemat-el{display:flex;align-items:flex-start;gap:16px;margin:0;position:relative}
.schemat-opis{display:flex;flex-direction:column;gap:4px;padding-top:2px;font-size:17px;line-height:1.5;color:#3A322D}
.schemat-etykieta{align-self:flex-start;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:#B23A1E;background:#FFF1E8;border-radius:999px;padding:3px 10px}

/* kroki: numer w rogu ikony, pionowy łącznik przez środki ikon */
.schemat-kroki .schemat-lista{counter-reset:krok;gap:24px}
.schemat-kroki .schemat-el{counter-increment:krok}
.schemat-kroki .schemat-ik::after{content:counter(krok);position:absolute;top:-4px;right:-4px;width:22px;height:22px;
  border-radius:50%;background:#C2410C;color:#FFFFFF;font-size:12px;font-weight:800;display:flex;align-items:center;
  justify-content:center;box-shadow:0 0 0 2px #FFFFFF}
.schemat-kroki .schemat-el:not(:last-child)::before{content:"";position:absolute;left:25px;top:52px;bottom:-24px;width:2px;
  background:linear-gradient(#F2C7B0,#F2C7B0) center/2px 100% no-repeat}

/* oś czasu: poziomo na szerokim ekranie (linia przez środki ikon), pionowo na telefonie */
.schemat-os-czasu .schemat-lista{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px}
.schemat-os-czasu .schemat-el{flex-direction:column;gap:12px}
.schemat-os-czasu .schemat-el::before{content:"";position:absolute;left:26px;right:-46px;top:25px;height:2px;background:#F2C7B0}
.schemat-os-czasu .schemat-el:last-child::before{content:none}
.schemat-os-czasu .schemat-opis{padding-top:0;font-size:16px}

/* porównanie: kolumny-karty na kremowym tle wewnątrz białej karty */
.schemat-kolumny{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:16px}
.schemat-kolumna{background:#FFF8F1;border:1px solid #F3E7D8;border-radius:22px;padding:20px;display:flex;flex-direction:column;gap:14px}
.schemat-naglowek,.tresc .schemat-naglowek{margin:0;display:flex;align-items:center;gap:12px;font-family:'Bricolage Grotesque',sans-serif;
  font-weight:800;font-size:18px;line-height:1.2;color:#1F1A17}
.schemat-kolumna .schemat-ik{width:44px;height:44px;box-shadow:none;background:#FFFFFF}
.schemat-kolumna .schemat-ik .ik{width:24px;height:24px}
.schemat-kolumna ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:16px;line-height:1.5;color:#3A322D}
.schemat-kolumna li{position:relative;padding-left:18px}
.schemat-kolumna li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:#EE5B2B}
.tresc .schemat li,.schemat li{margin:0;line-height:1.5}

/* przypisy [n] z app/poradnik.py _przypisy: mały wyciszony indeks, nie przerywa czytania */
.przypis{font-size:.55em;line-height:0;vertical-align:super;margin-left:1px;font-weight:500}
.przypis a{color:#CDBFB1;text-decoration:none;padding:0 1px}
.przypis a:hover,.przypis a:focus-visible{color:#C2410C;text-decoration:underline}
.przypis-sep{color:#CDBFB1}
.bibliografia li:target{background:#FFF1E8;border-radius:8px}

@media (max-width: 640px){
  .schemat{padding:20px 18px 22px;border-radius:22px;gap:20px;margin:32px 0}
  .schemat-os-czasu .schemat-lista{grid-template-columns:minmax(0,1fr)}
  .schemat-os-czasu .schemat-el{flex-direction:row;gap:16px}
  .schemat-os-czasu .schemat-el::before{left:25px;right:auto;top:52px;bottom:-20px;width:2px;height:auto}
  .schemat-os-czasu .schemat-opis{padding-top:2px}
}

/* pilne = zawsze pełne czerwone tło z białym tekstem: ramka „Kiedy pilnie do weterynarza” i cytat > w treści */
.ramka-pilnie,.tresc blockquote{background:#B3261E;border:0;color:#FFFFFF;box-shadow:0 12px 32px rgba(179,38,30,.22)}
.tresc blockquote{border-radius:24px;padding:20px 24px}
.ramka-pilnie h2,.ramka-pilnie li,.tresc blockquote p,.tresc blockquote li,.tresc blockquote strong{color:#FFFFFF}
.ramka-pilnie li::marker,.tresc blockquote li::marker{color:#FFD9D2}
.ramka-pilnie a,.tresc blockquote a{color:#FFFFFF;text-decoration:underline}

/* tabele w treści (app/poradnik.py _tabela): biała karta, nagłówek kremowy, ocena jako pigułka */
.tabela-karta{margin:8px 0;background:#FFFFFF;border:1px solid #F0E2D0;border-radius:24px;overflow:hidden;
  box-shadow:0 12px 32px rgba(122,52,20,.06)}
.tresc .tabela-karta table{font-size:16px;line-height:1.5}
.tresc .tabela-karta th{background:#FFF8F1;color:#7A6A5D;font-size:12px;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;padding:14px 18px;border-bottom:1px solid #F0E2D0}
.tresc .tabela-karta td{padding:16px 18px;border-bottom:1px solid #F5EBDF;color:#3A322D}
.tresc .tabela-karta tr:last-child td{border-bottom:0}
.tresc .tabela-karta td:first-child{font-weight:700;color:#1F1A17}
.ocena{display:inline-block;font-size:14px;font-weight:800;line-height:1.3;border-radius:999px;padding:4px 12px}
.ocena-tak{background:#E3F4EC;color:#0B6E63}
.ocena-umiar{background:#FFF1D6;color:#8A5A00}
.ocena-nie{background:#FDE4DC;color:#B23A1E}

@media (max-width: 640px){
  .tresc .tabela-karta table,.tresc .tabela-karta tbody,.tresc .tabela-karta tr,.tresc .tabela-karta td{display:block;width:auto}
  .tresc .tabela-karta thead{display:none}
  .tresc .tabela-karta tr{padding:16px 18px;border-bottom:1px solid #F5EBDF}
  .tresc .tabela-karta tr:last-child{border-bottom:0}
  .tresc .tabela-karta td{padding:4px 0;border:0}
  .tresc .tabela-karta td:first-child{font-size:17px;padding-bottom:6px}
  .tresc .tabela-karta td[data-etykieta]:not(:first-child)::before{content:attr(data-etykieta);display:block;font-size:11px;
    font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#9C8B7D;margin-bottom:2px}
}