/*
 * DM SEO front-end styles for content blocks that Rank Math used to own:
 * table of contents, FAQ (both markups), HowTo, and the silo "More in this series" list.
 *
 * Theme-agnostic: colours come from currentColor and a few custom properties a site can override,
 * e.g. in Oxygen global CSS:  :root { --dm-seo-accent: #0f766e; --dm-seo-radius: 10px; }
 */
:root {
    --dm-seo-accent: currentColor;
    --dm-seo-border: color-mix(in srgb, currentColor 14%, transparent);
    --dm-seo-bg: color-mix(in srgb, currentColor 4%, transparent);
    --dm-seo-radius: 8px;
    --dm-seo-gap: 1.5em;
}

/* ---------- Table of contents ---------- */
.wp-block-rank-math-toc-block,
#rank-math-toc,
.dm-seo-toc {
    margin: var(--dm-seo-gap) 0;
    padding: 1em 1.25em;
    border: 1px solid var(--dm-seo-border);
    border-radius: var(--dm-seo-radius);
    background: var(--dm-seo-bg);
}
.wp-block-rank-math-toc-block > h2,
.wp-block-rank-math-toc-block > h3,
.wp-block-rank-math-toc-block > p:first-child,
.dm-seo-toc-title {
    margin: 0 0 .5em;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}
.wp-block-rank-math-toc-block nav ul,
.wp-block-rank-math-toc-block nav ol,
.dm-seo-toc ul,
.dm-seo-toc ol {
    margin: 0;
    padding-left: 1.2em;
    list-style: decimal;
}
.wp-block-rank-math-toc-block nav ul ul,
.wp-block-rank-math-toc-block nav ol ol,
.dm-seo-toc ul ul,
.dm-seo-toc ol ol {
    margin-top: .25em;
    list-style: lower-alpha;
}
.wp-block-rank-math-toc-block li,
.dm-seo-toc li {
    margin: .25em 0;
    line-height: 1.45;
}
.wp-block-rank-math-toc-block a,
.dm-seo-toc a {
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid transparent;
}
.wp-block-rank-math-toc-block a:hover,
.wp-block-rank-math-toc-block a:focus-visible,
.dm-seo-toc a:hover,
.dm-seo-toc a:focus-visible {
    color: var(--dm-seo-accent);
    border-bottom-color: currentColor;
}

/* ---------- FAQ: saved Rank Math markup (.wp-block-rank-math-faq-block / .rank-math-faq-item),
              rendered Rank Math markup (#rank-math-faq / .rank-math-list-item)
              and the native dh-seo/faq block (.dm-faq / .dm-faq__item) ---------- */
.wp-block-rank-math-faq-block,
#rank-math-faq,
.rank-math-block,
.dm-faq {
    margin: var(--dm-seo-gap) 0;
}
.rank-math-faq-item,
.rank-math-list-item,
.dm-faq__item {
    margin: 0 0 .75em;
    padding: 1em 1.25em;
    border: 1px solid var(--dm-seo-border);
    border-radius: var(--dm-seo-radius);
    background: var(--dm-seo-bg);
}
#rank-math-faq .rank-math-list,
.dm-faq__list {
    margin: 0;
    padding: 0;
    list-style: none;
}
.rank-math-question,
.dm-faq__q {
    margin: 0 0 .4em;
    font-size: 1.1em;
    line-height: 1.35;
}
.rank-math-answer,
.dm-faq__a {
    margin: 0;
    line-height: 1.6;
}
.rank-math-answer > :first-child,
.dm-faq__a > :first-child { margin-top: 0; }
.rank-math-answer > :last-child,
.dm-faq__a > :last-child { margin-bottom: 0; }
.rank-math-answer img.alignright,
.dm-faq__a img.alignright {
    float: right;
    max-width: 40%;
    margin: 0 0 .5em 1em;
}

/* ---------- HowTo ---------- */
#rank-math-howto .rank-math-howto-duration,
#rank-math-howto .rank-math-howto-description {
    margin-bottom: 1em;
}
#rank-math-howto .rank-math-steps {
    margin: 0;
    padding-left: 1.4em;
}
#rank-math-howto .rank-math-step {
    margin: 0 0 1em;
}
#rank-math-howto .rank-math-step-title {
    margin: 0 0 .3em;
}

/* ---------- Silo list ("More in this series") ---------- */
p.dh-silo-title {
    margin: var(--dm-seo-gap) 0 .4em;
}
ul.dh-silo {
    margin: 0 0 var(--dm-seo-gap);
    padding: .75em 1.25em .75em 2.2em;
    border-left: 3px solid var(--dm-seo-accent);
    background: var(--dm-seo-bg);
    border-radius: 0 var(--dm-seo-radius) var(--dm-seo-radius) 0;
}
ul.dh-silo li { margin: .2em 0; }

@media print {
    .wp-block-rank-math-toc-block, .dm-seo-toc { display: none; }
    .rank-math-faq-item, .rank-math-list-item, .dm-faq__item { break-inside: avoid; }
}