/* Documentation templates (page-documentation.php, page-developer-documentation.php).
   Shared rules use .doc-content; page-specific rules keep .user-doc-content / .dev-doc-content. */

/* --- shared --- */
html { scroll-behavior: smooth; }
/* TOC */
.doc-toc a { display: block; padding: 0.25rem 0; transition: color .15s; }
.doc-toc a:hover { color: #96598a; }
.doc-toc a.active { color: #96598a; font-weight: 600; }
.doc-toc li.toc-h2 > a { font-weight: 600; color: #334155; }
.doc-toc li.toc-h2 > a.active { color: #96598a; }
.doc-toc ul.toc-sub { margin: 0 0 0.25rem 0.75rem; padding-left: 0.75rem; border-left: 1px solid #e2e8f0; }
.doc-toc ul.toc-sub a { font-size: 0.8rem; }
/* Headings */
.doc-content h2 { font-size: 1.875rem; font-weight: 800; color: #1e293b; margin-top: 3.5rem; margin-bottom: 1.25rem; padding-bottom: 0.5rem; border-bottom: 1px solid #e2e8f0; }
.doc-content h3 { font-size: 1.4rem; font-weight: 700; color: #334155; margin-top: 2.5rem; margin-bottom: 1rem; }
.doc-content h4 { font-size: 1.1rem; font-weight: 700; color: #475569; margin-top: 2rem; margin-bottom: 0.75rem; }
.doc-content h2:first-child { margin-top: 0; }
.doc-content .heading-anchor { margin-left: 0.4rem; color: #cbd5e1; text-decoration: none; font-weight: 400; opacity: 0; transition: opacity .15s; }
.doc-content h2:hover .heading-anchor, .doc-content h3:hover .heading-anchor, .doc-content h4:hover .heading-anchor { opacity: 1; }
.doc-content .heading-anchor:hover { color: #96598a; }
/* Text */
.doc-content p { margin-bottom: 1.25rem; line-height: 1.75; color: #475569; }
.doc-content ul, .doc-content ol { margin-bottom: 1.5rem; padding-left: 1.5rem; color: #475569; }
.doc-content ul ul li { list-style-type: circle; }
.doc-content a { color: #96598a; font-weight: 600; text-decoration: underline; text-decoration-color: #d284c4; text-underline-offset: 2px; }
.doc-content a:hover { color: #d284c4; }
.doc-content strong { color: #1e293b; }
/* Tables */
.doc-content figure.wp-block-table { margin: 1.25rem 0 2rem; overflow-x: auto; border: 1px solid #e2e8f0; border-radius: 0.75rem; }
.doc-content table tr:last-child td { border-bottom: none; }
.doc-content table tr:hover td { background: #fdfaff; }
.doc-content hr { border: none; border-top: 1px solid #e2e8f0; margin: 3rem 0; }

/* --- user guide only --- */
/* HTML examples (md2blocks :::html): never let a wide mock widen the page */
.doc-example { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.user-doc-content ul li { list-style-type: disc; margin-bottom: 0.5rem; line-height: 1.7; }
.user-doc-content ol li { list-style-type: decimal; margin-bottom: 0.5rem; line-height: 1.7; }
.user-doc-content ul ul, .user-doc-content ol ul { margin: 0.4rem 0; }
.user-doc-content code { background: #f1f5f9; padding: 0.15rem 0.4rem; border-radius: 0.3rem; font-size: 0.85em; color: #96598a; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
/* Images */
.user-doc-content figure.wp-block-image { margin: 1.5rem 0 2rem; }
.user-doc-content figure.wp-block-image img { border-radius: 0.75rem; border: 1px solid #e2e8f0; box-shadow: 0 10px 30px -15px rgba(15, 23, 42, 0.25); max-width: 100%; height: auto; }
.user-doc-content figure.wp-block-image figcaption { font-size: 0.8rem; color: #64748b; text-align: center; margin-top: 0.5rem; }
.user-doc-content figure.wp-block-table table { width: 100%; border-collapse: collapse; margin: 0; font-size: 0.9rem; }
.user-doc-content table th { background: #f8fafc; padding: 0.7rem 0.9rem; text-align: left; font-weight: 700; color: #1e293b; border-bottom: 2px solid #e2e8f0; }
.user-doc-content table td { padding: 0.7rem 0.9rem; border-bottom: 1px solid #e2e8f0; vertical-align: top; color: #475569; line-height: 1.6; }
.user-doc-content table th:first-child { width: 28%; }
@media (max-width: 640px) {
        .doc-example [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
        .doc-example [style*="inline-block"][style*="width:"] { max-width: 100%; }
        .doc-example [style*="max-width:420px"] { max-width: 100% !important; }
    }

/* --- developer docs only --- */
.dev-doc-content ul li { list-style-type: disc; margin-bottom: 0.4rem; line-height: 1.7; }
.dev-doc-content ol li { list-style-type: decimal; margin-bottom: 0.4rem; line-height: 1.7; }
.dev-doc-content ul ul, .dev-doc-content ol ul { margin: 0.4rem 0 0.4rem 0; }
/* Inline code */
.dev-doc-content code { background: #f1f5f9; padding: 0.15rem 0.4rem; border-radius: 0.3rem; font-size: 0.85em; color: #96598a; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; word-break: break-word; }
/* Code blocks */
.dev-doc-content pre.wp-block-code { position: relative; background: #0f172a; color: #e2e8f0; padding: 2.4rem 1.25rem 1.25rem 1.25rem; border-radius: 0.75rem; overflow-x: auto; margin: 1.25rem 0 1.75rem; font-size: 0.85rem; line-height: 1.65; border: 1px solid #1e293b; }
.dev-doc-content pre.wp-block-code code { background: transparent; color: inherit; padding: 0; font-size: inherit; border-radius: 0; white-space: pre; display: block; }
.dev-doc-content pre.wp-block-code code.hljs { background: transparent; padding: 0; }
.dev-doc-content pre.wp-block-code .code-lang { position: absolute; top: 0.5rem; right: 3.25rem; font-size: 0.65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #64748b; }
.dev-doc-content pre.wp-block-code .code-copy { position: absolute; top: 0.45rem; right: 0.6rem; font-size: 0.7rem; font-weight: 700; color: #94a3b8; background: #1e293b; border: 1px solid #334155; border-radius: 0.4rem; padding: 0.2rem 0.5rem; cursor: pointer; transition: all .15s; }
.dev-doc-content pre.wp-block-code .code-copy:hover { color: #fff; border-color: #96598a; }
.dev-doc-content pre.wp-block-code .code-copy.copied { color: #10b981; border-color: #10b981; }
.dev-doc-content figure.wp-block-table table { width: 100%; border-collapse: collapse; margin: 0; font-size: 0.875rem; }
.dev-doc-content table th { background: #f8fafc; padding: 0.65rem 0.9rem; text-align: left; font-weight: 700; color: #1e293b; border-bottom: 2px solid #e2e8f0; white-space: nowrap; }
.dev-doc-content table td { padding: 0.65rem 0.9rem; border-bottom: 1px solid #e2e8f0; vertical-align: top; color: #475569; line-height: 1.6; }
.dev-doc-content table td code, .dev-doc-content table th code { white-space: normal; overflow-wrap: anywhere; }
.dev-doc-content table th:first-child { width: 30%; }
.dev-doc-content table td:first-child code { overflow-wrap: break-word; word-break: normal; }
.dev-doc-content figure.hooks-table table { font-size: 0.8rem; }
.dev-doc-content figure.hooks-table th:nth-child(1) { width: 31%; }
.dev-doc-content figure.hooks-table th:nth-child(2) { width: 5%; }
.dev-doc-content figure.hooks-table th:nth-child(3) { width: 28%; }
.dev-doc-content figure.hooks-table th:nth-child(4) { width: 36%; }
.dev-doc-content figure.hooks-table td:nth-child(2) { white-space: nowrap; }
.dev-doc-content figure.hooks-table tr[id] { scroll-margin-top: 6rem; }
.dev-doc-content figure.hooks-table tr:target td { background: #fdf4ff; }
.dev-doc-content img { border-radius: 0.5rem; border: 1px solid #e2e8f0; }
