/*  === ODRÁŽKY – SEZNAMY – FAQ  === */


/*  === Jednoduché odrážky === */

.pk-bullets--dot{
  --pk:#1aa3d9;
  --lh:1.65;          /* line-height */
  --dot:8px;          /* velikost tečky */
  --dot-offset:0px;   /* jemné doladění (např. 1px až 3px), když bude potřeba */
  list-style:none;
  margin:0;
  padding:0;
}


.pk-bullets--dot li{
  display:flex;
  align-items:flex-start; /* kotva na začátek (1. řádek) */
  gap:10px;
  margin:10px 0;
  line-height:var(--lh);
}


.pk-bullets--dot li::before{
  content:"";
  width:var(--dot);
  height:var(--dot);
  border-radius:50%;
  background:var(--pk);
  flex:0 0 var(--dot);


  /* střed tečky přesně do středu 1. řádku */
  margin-top:calc((1em * var(--lh) - var(--dot)) / 2 + var(--dot-offset));
}





/*  === Box s fajfkami === */


.bullets-box{padding:16px 18px;margin:18px 0;background:#fbfdff;border:1px solid #e6f2f8;border-left:4px solid #1aa3d9;border-radius:14px}




/* ZÁKLAD seznam (default = 1 sloupec) */
.bullets-box ul{list-style:none;margin:0;padding:0}
.bullets-box li{position:relative;padding-left:34px;line-height:1.6;margin:10px 0}




/* Kolečko – zarovnání na střed textu (1. řádku) */
.bullets-box li:before{
  content:"";
  position:absolute;
  left:0;
  top:0.8em;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  border-radius:50%;
  background:#e6f6ff;
  border:1px solid #9fd6f0;
}




/* Fajfka – také na stejný vertikální střed */
.bullets-box li:after{
  content:"";
  position:absolute;
  left:7px;
  top:0.8em;
  transform:translateY(-60%) rotate(-45deg);
  width:9px;
  height:5px;
  border-left:3px solid #1aa3d9;
  border-bottom:3px solid #1aa3d9;
}




/* MODIFIKÁTOR: 2 sloupce */
.bullets-box.is-2cols ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;row-gap:10px}
.bullets-box.is-2cols li{margin:0}
.bullets-box.is-2cols li:nth-child(even)::after{
  left:6px; 
}


@media(max-width:640px){.bullets-box.is-2cols ul{grid-template-columns:1fr}}






/*  === FAQ === */


.faq{padding:16px 18px;margin:18px 0;background:#fbfdff;border:1px solid #e6f2f8;border-left:4px solid #1aa3d9;border-radius:14px}
.faq details+details{border-top:1px solid #e6f2f8}
.faq details{padding:12px 0}
.faq details:first-child{padding-top:0}
.faq details:last-child{padding-bottom:0}




.faq summary{cursor:pointer;font-weight:700;line-height:1.45;list-style:none;position:relative;padding-left:34px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:#e6f6ff;border:1px solid #9fd6f0}




/* mínus (open), plus (closed) – bez závislosti na fontu */
.faq summary:after{content:"";position:absolute;left:11px;top:50%;transform:translate(-50%,-50%);width:10px;height:2px;background:#1aa3d9;border-radius:2px}
.faq details:not([open]) summary:after{width:10px;height:10px;background:
  linear-gradient(#1aa3d9,#1aa3d9) center/10px 2px no-repeat,
  linear-gradient(#1aa3d9,#1aa3d9) center/2px 10px no-repeat}




.faq .a{margin:8px 0 0;padding-left:34px;line-height:1.65;color:#334155}




/* === Průvodce krok za krokem (bloky pod sebou) === */

.pk-steps{
  /* Barvy */
  --brand:#0ea5e9;
  --brand2:#0b84c6;
  --t:#0f172a;
  --m:#475569;
  --b:#d7e7f5;
  --bg:#f7fbff;

  margin:22px 0;
  color:var(--t);
}

.pk-steps__title{
  margin:0 0 14px;
  font:800 1.9rem/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial;
  letter-spacing:-.01em;
}

.pk-steps__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:14px;
  grid-template-columns:1fr;
}

.pk-step{
  position:relative;
  padding:12px 16px 12px;
  border:1.5px dashed var(--b);
  border-radius:16px;
  background:var(--bg);
}

.pk-step__badge{
  position:absolute;
  left:24px;
  top:-6px;
  width:40px;
  height:40px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--brand);
  color:#fff;
  font-weight:900;
  border:4px solid #fff;
  box-shadow:0 8px 18px rgba(15,23,42,.12);
}

/* Výchozí (stránka + kategorie): kompaktní odsazení jako dřív */
.pk-step__head{
  margin:0 0 4px;
  padding-left:60px;
  font:900 1.6rem/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial;
  letter-spacing:-.01em;
}

.pk-step__text{
  margin:0;
  padding-left:60px;
  color:var(--m);
  line-height:1.5;
}

/* Výchozí svislá spojnice mezi kroky */
.pk-step:not(:last-child)::after{
  content:"";
  position:absolute;
  left:44px;      /* přibližně pod středem kolečka v původním kompaktním layoutu */
  top:34px;
  bottom:-14px;
  width:2px;
  background:rgba(14,165,233,.35);
  border-radius:2px;
}


/* =========================================================
   POUZE BLOG (detail článku Shoptetu): oprava velkých mezer + přesné zarovnání
   ========================================================= */

body.type-post .pk-step{
  /* stejné hodnoty jako badge (jen pro výpočty na blogu) */
  --badge-left:24px;
  --badge-size:40px;

  /* mezera mezi kolečkem a textem (menší = kompaktnější) */
  --badge-gap:4px; /* doporučeno 0–8px */

  /* STŘED kolečka (border je už zahrnutý v --badge-size díky border-box) */
  --badge-center-x: calc(var(--badge-left) + (var(--badge-size) / 2));

  /* kde má začínat text (za kolečkem + mezera) */
  --text-offset: calc(var(--badge-left) + var(--badge-size) + var(--badge-gap));
}

/* aby se badge na blogu řídil proměnnou (pro jistotu) */
body.type-post .pk-step__badge{
  left:var(--badge-left) !important;
}

/* text začne až za kolečkem (jen blog) */
body.type-post .pk-step__head,
body.type-post .pk-step__text{
  padding-left:var(--text-offset) !important;
}

/* menší, kontrolovaná mezera mezi nadpisem a textem (jen blog) */
body.type-post .pk-step__head{
  margin:0 0 6px !important;
}

/* blog často přepisuje marginy odstavců → zrušit */
body.type-post .pk-step__text,
body.type-post .pk-step__text p{
  margin:0 !important;
}

/* řízené mezery uvnitř textu (to, co chcete) */
body.type-post .pk-step__text > *{
  margin:0 !important;
}
body.type-post .pk-step__text > * + *{
  margin-top:8px !important;
}

/* prázdné odstavce (Enter v editoru) */
body.type-post .pk-step__text p:empty{
  display:none !important;
}

/* ČÁRA: přesně na střed kolečka (jen blog) */
body.type-post .pk-step:not(:last-child)::after{
  left:var(--badge-center-x) !important;
  transform:translateX(-50%) !important; /* dorovnání na střed */
}







/* === Číselný seznam === */


ol.pk-steps{
  --pk:#00a8ee;
  counter-reset:i;
  list-style:none;
  padding:0;
  margin:16px 0;
}

ol.pk-steps>li{
  counter-increment:i;
  display:flex;
  align-items:center;
  gap:12px;
  margin:10px 0;
  line-height:1.6;
}

ol.pk-steps>li::before{
  content:counter(i);
  width:26px;
  height:26px;
  border-radius:999px;
  background:var(--pk);
  color:#fff;

  flex:0 0 26px;
  display:flex;
  align-items:center;
  justify-content:center;

  font-weight:700;
  font-size:13px;
  line-height:1;

  /* keep site font (do NOT set font-family here) */
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
}

/* Optická korekce pro dvouciferná čísla (10,11,12...) */
ol.pk-steps>li:nth-child(n+10)::before{
  padding-left:1px;            /* jemný posun doprava */
  box-sizing:border-box;
}