/* ==========================================================================
   HelpGent — knowledge base block styles. Loaded on articles (after kb.css) and inside the doc editor,
   so writers see what readers get. Registered in inc/knowledge-base.php:
   Group › Note / Tip / Warning (callout boxes) · List › Steps (numbered steps)
   Colours fall back to the theme values because the editor doesn't load common.css.
   ========================================================================== */

/* ── steps — list style "Steps" ─────────────────────────────────────────── */
ol.is-style-kb-steps{list-style:none;padding-left:0;counter-reset:kb-step;display:grid;gap:14px}
ol.is-style-kb-steps>li{position:relative;counter-increment:kb-step;padding:2px 0 0 46px;margin:0;min-height:30px}
ol.is-style-kb-steps>li::before{content:counter(kb-step);position:absolute;left:0;top:0;display:grid;place-items:center;
  width:30px;height:30px;border-radius:50%;background:var(--accent-soft,#EEEBFE);color:var(--accent-hover,#4F3BD9);font-size:14px;font-weight:700;line-height:1}
ol.is-style-kb-steps>li:not(:last-child)::after{content:"";position:absolute;left:14.5px;top:36px;bottom:-12px;width:1px;background:var(--line-2,#DAD6E3)}
ul.is-style-kb-steps{padding-left:1.4em}   /* "Steps" picked on a bulleted list: numbers need an ordered list */

/* ── callouts — group styles "Note", "Tip", "Warning" ───────────────────── */
:is(.is-style-kb-note,.is-style-kb-tip,.is-style-kb-warning){--c:var(--accent,#6551F2);--bg:var(--accent-soft,#EEEBFE);
  position:relative;margin-block:1.6em;padding:16px 20px 16px 52px;border-radius:12px;
  background:var(--bg);border:1px solid color-mix(in srgb,var(--c) 22%,transparent);color:var(--text,#383345);font-size:.96em;line-height:1.65}
.is-style-kb-tip{--c:#2E9E4E;--bg:#EAF7EE}
.is-style-kb-warning{--c:#D9822B;--bg:#FDF3E6}
:is(.is-style-kb-note,.is-style-kb-tip,.is-style-kb-warning)::before{content:"";position:absolute;left:18px;top:18px;width:20px;height:20px;background:var(--c);
  -webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat;
  --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 16v-4.5M12 8h.01'/%3E%3C/svg%3E")}
.is-style-kb-tip::before{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 22h4M12 2a7 7 0 0 0-4 12.7c.6.5 1 1.2 1 2V17h6v-.3c0-.8.4-1.5 1-2A7 7 0 0 0 12 2Z'/%3E%3C/svg%3E")}
.is-style-kb-warning::before{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0ZM12 9v4M12 17h.01'/%3E%3C/svg%3E")}
:is(.is-style-kb-note,.is-style-kb-tip,.is-style-kb-warning)>*{margin-block:0}
:is(.is-style-kb-note,.is-style-kb-tip,.is-style-kb-warning)>*+*{margin-top:.6em}
:is(.is-style-kb-note,.is-style-kb-tip,.is-style-kb-warning) a{color:var(--text,#383345)}