/*
Theme Name: DocsMatter
Theme URI: https://docsmatter.joho.se/
Author: Joaquim Homrighausen
Author URI: https://www.webbplatsen.se/
Description: A clean, fast, Bootstrap 5–based documentation theme for WordPress.
Version: 1.0.0
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: docsmatter
Tags: block-styles, editor-style, wide-blocks, left-sidebar, two-columns, translation-ready
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.1

Copyright 2025 Joaquim Homrighausen. All rights reserved.
*/

/* Disable Bootstrap animations site-wide */
*,
::before,
::after {
    transition: none !important;
    animation: none !important;
}
.fade,
.collapsing,
.modal,
.offcanvas,
.dropdown-menu,
.toast {
    transition: none !important;
    animation: none !important;
    opacity: 1 !important;
}
/* Restore proper visibility for Bootstrap backdrops */
:root {
    --bs-backdrop-opacity: 0.60;
}
.offcanvas-backdrop,
.modal-backdrop {
    transition: none !important;
    background: var(--bs-backdrop-bg, #000);
}
.offcanvas-backdrop.show,
.modal-backdrop.show {
    opacity: var(--bs-backdrop-opacity) !important;
}
.offcanvas-backdrop:not(.show),
.modal-backdrop:not(.show) {
    opacity: 0 !important;
}
/*
*/
.docsmattter-logo {
}
.docsmattter-logo-img {
    width: 140px !important;
    height: 140px !important;
    min-width: 140px !important;
    min-height: 140px !important;
}
.docsmattter-logo-img-header {
    width: 2.4rem !important;
    height: 2.4rem !important;
    min-width: 2.4rem !important;
    min-height: 2.4rem !important;
}
.docsmattter-cover-img {
    max-height:600px !important;
}
.bs5socialmedia-icon {
    width: 2rem !important;
    height: 2rem !important;
    max-width: 2rem !important;
    max-height: 2rem !important;
}
.docsmattter-error-box {
    margin: 0 auto;
    margin-top: 25px;
    margin-bottom: 25px;
    text-align: center !important;
    padding: 25px;
    padding-bottom: 40px;
    background-color: var(--bs-danger-bg-subtle);
    border: 2px solid var(--bs-danger-border-subtle);
    color: var(--bs-danger);
    border-radius: 5px;
    max-width: 1280px;
}
.docsmattter-error-box h3 {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--bs-danger) !important;
}
.docsmattter-menuheader {
    font-size: 1.0rem;
    margin-bottom: 0.1rem;
}
.docsmattter-menuitem {
    font-size: 0.9rem;
    margin-bottom: 0.1rem;
}
.docsmatteroffcanvas-section {
    margin-top: 1.6rem !important;
}
.docsmatteroffcanvas-section .h5 {
    font-size: 1.0rem !important;
    text-transform: uppercase !important;
}
.docsmatteroffcanvas-section .plugin {
    margin-top: 1.5rem !important;
}
.docsmatteroffcanvas-section .plugin-content {
    margin-left: 1rem !important;
}
.docsmatteroffcanvas-section .plugin h2 {
    font-size: 1.0rem !important;
    text-transform: uppercase !important;
}
.docsmatteroffcanvas-section .plugin .plugin-content {
    font-size: 0.9rem !important;
}
.docsmatteroffcanvas-section .plugin .plugin-content a {
    text-decoration: none !important;
    color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1)) !important;
}
.docsmatteroffcanvas-section .plugin .plugin-content a:hover {
    text-decoration: underline !important;
    text-underline-offset: 0.25em !important;
    --bs-link-color-rgb: var(--bs-link-hover-color-rgb) !important;;
}
.docsmatteroffcanvas-section .plugin .plugin-content a:not([href]):not([class]),
.docsmatteroffcanvas-section .plugin .plugin-content a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none;
}

.docsmatteroffcanvas-section .plugin .plugin-content ul {
    margin-left: 0.25rem !important;
    padding-left: 0 !important;
}
.docsmatteroffcanvas-section .plugin .plugin-content li {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0.25rem !important;
    margin-bottom: 0.5rem !important;
}
.docsmatteroffcanvas-section .plugin-search {
    margin-bottom: 1.2rem !important;
}
.docsmatteroffcanvas-section .plugin-search .plugin-content input {
    padding: 0.5rem !important;
}
.docsmatteroffcanvas-section .plugin-search .plugin-content input[type=text] {
    font-size: 1.0rem !important;
    font-family: monospace !important;
    border:1px solid var(--bs-secondary) !important;
    border-radius: 3px !important;
}
.tag-cloud-link {
}
.tag-cloud-link:hover {
}
.primary-sidebar .widget:not(:last-child) {
    margin-bottom: 1.5rem;
    margin-top: 0 !important;
}
img.custom-logo {
    max-height: 50px !important;
    max-width: 50px !important;
}
img.custom-logo {
    max-height: 32px !important;
    height: auto !important;
    width: auto !important;
    object-fit: contain !important;
}
.navbar .navbar-brand {
    min-width: 0;
}
.navbar .navbar-brand h5 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Soften the invalid look on focus */
#primary-sidebar .wp-block-search__input:focus:invalid {
    outline: 2px solid #0d6efd;
    box-shadow: none;
    border-color: #0d6efd;
}
#primary-sidebar .wp-block-search__input:focus:required {
    outline: 2px solid #0d6efd;
    box-shadow: none;
    border-color: green;
}

#docsmatter-mainnav {
    height: 55px !important;
    max-height: 55px !important;
    min-height: 55px !important;
    box-shadow: none !important;
    border: 0 !important;
}

.docsmatter-postdate {
    text-align: right;
}
.docsmatter-posttags {
}
.docsmattter-footer {
    font-size: 0.75em !important;
    margin-top: 75px !important;
    /*background: var(--bs-tertiary-bg) !important;*/
}
.docsmattter-more-menu {
    width: 300px !important;
    max-width:300px !important;
    max-height: calc(100vh - 80px) !important;
    overflow-y: scroll !important;
}
/* Show active page */
a.active-nav, a.active-nav:visited, a.active-nav:active {
    /*background-color: var(--bs-secondary-bg) !important;*/
    /*border-radius: 3px !important;*/
    color: var(--bs-body-color) !important;
    display: inline-block !important;
    font-weight: bold;
}
a.active-nav:hover {
    text-decoration: none !important;
}
a.badge, a.badge:hover, a.badge:visited {
    text-decoration: none !important;
}
a.active-nav::before, a.active-nav:active::before {
    content: '[\00a0';
}
a.active-nav::after, a.active-nav:active::after {
    content: '\00a0]';
}

/* Overrides */

.wp-block-search__label {
    display:none !important;
}
.wp-block-search__input {
    border-radius: 5px;
    font-family: var(--bs-font-monospace) !important;
}
.wp-block-search__input:focus {
}
.wp-block-search__button {
    border-radius: 5px;
}
.screen-reader-text {
    /* Hidden but accessible */
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}
.screen-reader-text:focus {
    /* When focused (e.g. a “Skip to content” link), make it clearly visible */
    position: fixed;
    top: .5rem;
    left: .5rem;
    z-index: 10000;
    width: auto;
    height: auto;
    margin: 0;
    padding: .5rem .75rem;
    clip: auto;
    clip-path: none;
    white-space: normal;
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    border: 2px solid var(--bs-primary);
    border-radius: .25rem;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(0,0,0,.06);
    text-decoration: none;
    font-weight: 600;
}
body, html {
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
}
.docsmattter-menuarea {
    height: 100%;
    overflow-y: auto;
}
.docsmatter-contentarea {
    height: 100%;
    overflow-y: auto;
}
#docsmatter-contentarea-inner {
    max-width:1280px;
}
[data-bs-theme=dark] {
    --color-navlink: var(--bs-warning-text-emphasis);
}
[data-bs-theme=light] {
    --color-navlink: #814141;
}
a, a:visited, a:active {
    text-decoration: none !important;
}
a:hover {
    text-decoration: underline !important;
}
a.nav-link, a.nav-link:visited, a.nav-link:hover {
    color: var(--color-navlink);
}
a.nav-link:hover {
}

kbd,samp,pre,code {
    font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace !important;
}
pre,samp,pre,code {
    font-size: 0.9em !important;
    line-height: 1.0em !important;
}
pre, code {
    white-space: pre-wrap !important;
    tab-width: 4 !important;
}
[data-bs-theme=dark] {
    --color-monostuff: var(--bs-dark-bg-subtle);
}
[data-bs-theme=light] {
    --color-monostuff: var(--bs-light-bg-subtle);
}
pre {
    background-color: var(--color-monostuff) !important;
    color: var(--bs-light-text-emphasis) !important;
    border: 1px solid var(--bs-light-border-subtle) !important;
    border-radius: .4rem !important;
    line-height: 1.4em !important;
    margin-bottom: 20px;
    overflow-wrap: break-word;
    white-space: pre !important;
    padding: 0.6em 0.6em !important;
    overflow-x: auto !important;
}
div > code,
p > code,
li > code,
dd > code,
td > code {
    /*
    background-color: var(--bs-black) !important;
    color: var(--bs-light) !important;
    */
    background-color: var(--color-monostuff) !important;
    color: var(--bs-light-text-emphasis) !important;
    border: 1px solid var(--bs-light-border-subtle) !important;
    border-radius: .4rem !important;

    word-wrap: break-word !important;
    page-break-inside: avoid !important;
    padding: .3rem .3rem .2rem !important;
    /*border: 0 !important;*/
    box-decoration-break: clone !important;
    -webkit-box-decoration-break: clone !important;
    overflow-x: auto !important;
    white-space: pre !important;
}
p > code {
    border: 0 !important;
}
div > code {
    display: block !important;
    margin-top: 0.5em !important;
    margin-bottom: 0.6em !important;
    padding: 0.4rem !important;
    line-height: 1.3em !important;
}
a {
    text-underline-offset: 0.25em !important;
}
a:hover {
    text-underline-offset: 0.25em !important;
}
.collapsing {
    transition-delay: 0ms !important;
    transition: none !important;
}
.collapse.show {
    transition-delay: 0ms !important;
    transition: none !important;
}
.collapse.collapsing {
    transition-delay: 0ms !important;
    transition: none !important;
}
.offcanvas-backdrop {
    transition-delay: 0ms !important;
    transition: none !important;
}
blockquote {
    margin-bottom: 1rem !important;
    margin-right: 2rem !important;
    font-size: 1.1rem !important;
    font-style: italic !important;
    border-left: 3px solid var(--bs-secondary) !important;
    padding-left: 1rem !important;
    margin-left: 1rem !important;
}
blockquote > :last-child {
    margin-bottom: 0;
}
p img {
    padding: 0.25rem;
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    max-width: 100%;
    height: auto;
}
.accordion {
    --bs-accordion-bg: var(--bs-tertiary-bg) !important;
    --bs-accordion-transition: none !important;
    --bs-accordion-border-width: 0 !important;
    --bs-accordion-btn-icon-transition: none !important;
    --bs-accordion-btn-icon-width: 1rem !important;
    --bs-accordion-body-padding-x: 1rem !important;
    --bs-accordion-body-padding-y: 0.2rem !important;
    border: 0;
}
.accordion-button:focus {
    box-shadow: 2px 0 var(--bs-success-text-emphasis) inset !important;
    border-radius: 0 !important;
}
.accordion-button:not(.collapsed) {
    color: inherit !important;
    background-color: inherit !important;
}
.accordion-button-active {
    box-shadow: 2px 0 var(--bs-success-text-emphasis) inset !important;
    border-radius: 0 !important;
}

/* Content */

@media print {
    .docsmatter-hide-on-print {
        display:none !important;
        border:5px red !important;
    }
}

.docsmatter-pageheading h1 {
    box-sizing: border-box;
    border-bottom: 2px solid var(--bs-secondary-bg);
    padding-top: 8px;
}
.docsmatter-pageheadingnav, .docsmatter-pageheadingnav:visited, .docsmatter-pageheadingnav:hover {
    text-decoration: none !important;
}
.docsmatter-pagecontent h1, .docsmatter-pagecontent div.h1 {
    font-size: 1.6rem;
    margin-bottom: 15px !important;
    padding-bottom: 8px;
}
.docsmatter-pagecontent h2, .docsmatter-pagecontent div.h2 {
    font-size: 1.3rem;
    margin-top: 1em !important;
    margin-bottom: 0.1em !important;
    padding-bottom: 8px;
}
.docsmatter-pagecontent h3, .docsmatter-pagecontent div.h3 {
    font-size: 1.2rem;
    margin-top: 1em !important;
    margin-bottom: 0.1em !important;
    padding-bottom: 8px;
}
.docsmatter-pagecontent h4, .docsmatter-pagecontent div.h4 {
    font-size: 1.1rem;
    margin-top: 1em !important;
    margin-bottom: 0.1em !important;
    padding-bottom: 8px;
}
.docsmatter-pagecontent h5, .docsmatter-pagecontent div.h5 {
    font-size: 1rem;
    margin-top: 1em !important;
    margin-bottom: 0.1em !important;
    padding-bottom: 8px;
}
.docsmatter-pagecontent h6, .docsmatter-pagecontent div.h6 {
    font-size: 0.9rem;
    margin-top: 1em !important;
    margin-bottom: 0.1em !important;
    padding-bottom: 8px;
}
.docsmatter-pagecontent h1,
.docsmatter-pagecontent h2,
.docsmatter-pagecontent h3,
.docsmatter-pagecontent h4,
.docsmatter-pagecontent h5,
.docsmatter-pagecontent h6,
.docsmatter-pagecontent div.h1,
.docsmatter-pagecontent div.h2,
.docsmatter-pagecontent div.h3,
.docsmatter-pagecontent div.h4,
.docsmatter-pagecontent div.h5,
.docsmatter-pagecontent div.h6 {
    /*color: #e6522c;*/
    /*
    color: var(--bs-info-text-emphasis);
    opacity: 0.9;
    */
}
.docsmatter-pagecontent p {
    line-height: 1.5;
}
.docsmatter-searchcontent p {
    margin-top: 0 !important;
    line-height: 1.4 !important;
    font-size: 0.9rem !important;
}
#docsmatter-toc {
    max-width: 30%;
    min-width: 20%;
    margin-left: 0.9rem;
    margin-bottom: 0.9rem;
    padding-left: 10px;
    float:right !important;
    border-left:3px solid var(--bs-secondary);
    box-sizing: border-box !important;
    position: relative;
    z-index: 10;
}
#docsmatter-toc h6 {
    text-transform: uppercase;
    color: var(--bs-info-text-emphasis);
    opacity: 0.8;
}
#docsmatter-toc ul {
    list-style-type: none;
    padding: 0;
}
#docsmatter-toc li {
    margin-left: 2px;
    padding: 0;
    font-size: 0.9em;
}
#docsmatter-toc a {
    text-decoration: none;
    color: var(--bs-success-text-emphasis);
}
#docsmatter-toc a:hover {
    text-decoration: underline;
}
caption {
    margin-bottom: 1em;
}

table {
    empty-cells: show;
    border: 1px solid var(--bs-secondary-bg);
    width: 100%;
    font-size: 0.9em;
}

thead {
    background-color: var(--bs-secondary-bg);
    color: var(--bs-secondary-color);
    text-align: left;
    vertical-align: bottom;
}

tr {
    display: table-row;
    vertical-align: inherit;
    border-color: inherit;
}

th, td {
    padding: 0.5em 1em;
    font-variant-numeric: oldstyle-nums slashed-zero !important;
}

/* highlight.js */

code label {
    padding: 5px 3px 3px 5px !important;
    margin-top: -8px !important;
    margin-right: -9px !important;
    float: right;
    display: inline;
    background-color: var(--bs-secondary-color) !important;
    color: var(--bs-secondary-bg) !important;
    min-width: 75px !important;
    text-align: center;
    text-transform: uppercase;
}

[data-bs-theme=dark] {
    --color-hljs: #c9d1d9;
    --color-hljs-doctag: #ff7b72;
    --color-hljs-title: #d2a8ff;
    --color-hljs-attr: #79c0ff;
    --color-hljs-regexp: #a5d6ff;
    --color-hljs-built_in: #ffa657;
    --color-hljs-comment: #8b949e;
    --color-hljs-name: #7ee787;
    --color-hljs-subst: #c9d1d9;
    --color-hljs-section: #1f6feb;
    --color-hljs-bullet: #f2cc60;
    --color-hljs-emphasis: #c9d1d9;
    --color-hljs-strong: #c9d1d9;
    --color-hljs-addition: #aff5b4;
    --color-hljs-addition-bg: #033a16;
    --color-hljs-deletion: #ffdcd7;
    --color-hljs-deletion-bg: #67060c;
}
[data-bs-theme=light] {
    --color-hljs: #24292e;
    --color-hljs-doctag: #d73a49;
    --color-hljs-title: #6f42c1;
    --color-hljs-attr: #005cc5;
    --color-hljs-regexp: #032f62;
    --color-hljs-built_in: #e36209;
    --color-hljs-comment: #6a737d;
    --color-hljs-name: #22863a;
    --color-hljs-subst: #24292e;
    --color-hljs-section: #005cc5;
    --color-hljs-bullet: #735c0f;
    --color-hljs-emphasis: #24292e;
    --color-hljs-strong: #24292e;
    --color-hljs-addition: #22863a;
    --color-hljs-addition-bg: #f0fff4;
    --color-hljs-deletion: #b31d28;
    --color-hljs-deletion-bg: #ffeef0;
}

.hljs {
    color: var(--color-hljs);
    /*background: #0d1117*/
}
.hljs-doctag,
.hljs-keyword,
.hljs-meta .hljs-keyword,
.hljs-template-tag,
.hljs-template-variable,
.hljs-type,
.hljs-variable.language_ {
    color: var(--color-hljs-doctag);
}
.hljs-title,
.hljs-title.class_,
.hljs-title.class_.inherited__,
.hljs-title.function_ {
    color: var(--color-hljs-title);
}
.hljs-attr,
.hljs-attribute,
.hljs-literal,
.hljs-meta,
.hljs-number,
.hljs-operator,
.hljs-variable,
.hljs-selector-attr,
.hljs-selector-class,
.hljs-selector-id {
    color: var(--color-hljs-attr);
}
.hljs-regexp,
.hljs-string,
.hljs-meta .hljs-string {
    color: var(--color-hljs-regexp);
}
.hljs-built_in,
.hljs-symbol {
    color: var(--color-hljs-built_in);
}
.hljs-comment,
.hljs-code,
.hljs-formula {
    color: var(--color-hljs-comment);
}
.hljs-name,
.hljs-quote,
.hljs-selector-tag,
.hljs-selector-pseudo {
    color: var(--color-hljs-name);
}
.hljs-subst {
    color: var(--color-hljs-subst);
}
.hljs-section {
    color: var(--color-hljs-section);
    font-weight: bold
}
.hljs-bullet {
    color: var(--color-hljs-bullet);
}
.hljs-emphasis {
    color: var(--color-hljs-emphasis);
    font-style: italic
}
.hljs-strong {
    color: var(--color-hljs-strong);
    font-weight: bold
}
.hljs-addition {
    color: var(--color-hljs-addition);
    background-color: var(--color-hljs-addition-bg);
}
.hljs-deletion {
    color: var(--color-hljs-deletion);
    background-color: var(--color-hljs-deletion-bg);
}
.hljs-char.escape_,
.hljs-link,
.hljs-params,
.hljs-property,
.hljs-punctuation,
.hljs-tag {
    /* purposely ignored */
}

/* ==== WP compatibility classes (Theme Check) ==== */

/* Captions */
.wp-caption {
    display:inline-block;
    max-width:100%;
    margin:0 0 1rem 0; /* was var(--bs-spacer, 1rem) */
}
.wp-caption img {
    display:block;
    height:auto;
    max-width:100%;
}
.wp-caption-text,
.gallery-caption {
    margin-top:.375rem;
    font-size:var(--bs-font-size-sm, .875rem);
    color:var(--bs-secondary-color, #6c757d);
    line-height:1.3;
}
.gallery-caption { text-align:center; }
/* Author highlight */
.bypostauthor .comment-body,
.bypostauthor .comment-content {
    border-inline-start:.25rem solid var(--bs-primary, #0d6efd);
    padding-inline-start:.5rem;
}
/* Legacy alignment helpers */
.alignleft  { float:left;  margin:0 1rem 1rem 0; }
.alignright { float:right; margin:0 0 1rem 1rem; }
.aligncenter{
    display:block;
    margin-left:auto;
    margin-right:auto;
    margin-top:0;
    margin-bottom:1rem;
}
.alignleft img,
.alignright img,
.aligncenter img { height:auto; max-width:100%; }

@media (max-width:576px){
    .alignleft,.alignright{
        float:none;
        display:block;
        margin:0 0 1rem 0;
    }
}
/* RTL tweaks */
:root[dir="rtl"] .alignleft  { margin:0 0 1rem 1rem; }
:root[dir="rtl"] .alignright { margin:0 1rem 1rem 0; }
