/* My Ease Theme adjustments for errantruminant.com / toddwarner.io
 * This is code-injected at that site level
 */

/*@import "../tw-font-family-fira.css";*/
@import "../tw-font-family-overpass.css";
@import "../tw-font-family-red-hat.css";
@import "../tw-font-family-cormorant.css";
@import "../tw-font-serif-crimson.css?v=20260212";
@import "../tw-font-sans-averia.css";
@import "../tw-font-mono-courier-prime.css";

:root {
    /* fonts */
    --er-fontstack-serif-crimson: "Crimson Text", "Crimson Pro", Amiri, serif;
    --er-fontstack-sans-averia: "Averia Sans", "Averia Sans Libre", sans-serif;
    --er-fontstack-display-red-hat: "Red Hat Display", Overpass, sans-serif;
    --er-fontstack-display-cormorant: "Cormorant Garamond", Cormorant, Overpass, sans-serif;
    --er-fontstack-display-overpass: Overpass, "Red Hat Display", sans-serif;
    --er-fontstack-sans-red-hat: "Red Hat text", Overpass, sans-serif;
    --er-fontstack-mono-courier: "Courier Prime", Courier, Cousine, Cursor, monospace;

    /* colors */
    --er-color-primary-text: rgb(33 41 49 / 1.0);
    --er-color-secondary-text: rgb(133 153 173 / 1.0); /* primary-lighter */
    --er-color-header-text: var(--er-color-primary-text);
    --er-color-color-bg-pre: rgb(246 246 246 / 1.0);
    --er-color-link: rgb(59 38 9 / 1.0);
    --er-color-link-hover: var(--er-color-link);
    --er-opacity-link-hover: 0.8;
    
    --ease-primary-text: rgb(51 51 51 / 1.0);
    --ease-color-secondary-text: rgb(153 153 153 / 1.0);
    --ease-color-header-text: rgb(21 23 26 / 1.0);
    --ease-color-color-bg-pre: var(--er-color-color-bg-pre);
    --ease-color-link: rgb(26 24 21 / 1.0);
    --ease-color-link-hover: var(--ease-color-link);
    --ease-opacity-link-hover: 0.8;

    --color-primary-text: var(--er-color-primary-text,
                              var(--ease-primary-text));
    --color-secondary-text: var(--er-color-secondary-text,
                                var(--ease-color-secondary-text));
    --color-darker-gray: var(--er-color-header-text,
                             var(--ease-color-header-text));
    --color-lighter-gray: var(--er-color-color-bg-pre,
                              var(--ease-color-color-bg-pre));
    --ghost-accent-color: var(--er-color-link, var(--ease-color-link));

    --er-color-bg-body: #a8a8a8;
    --er-color-bg-site-content: white;
    --er-site-box-shadow: rgba(0, 0, 0, 0.60) 0 0 15px 2px;
    --er-color-hr: var(--color-secondary-text);

    /* everything else */
    --er-gh-head-members-visibility: hidden;
    --er-header-font-family: var(--er-fontstack-display-overpass);
    --er-header-font-family2: var(--er-header-font-family);
    --er-header-font-weight: 500;
    --er-header-font-weight2: 500;
    --er-content-font-family: var(--er-fontstack-serif-crimson);
    --er-content-line-height: 1.5;
    --er-mono-content-font-family: var(--er-fontstack-mono-courier);
    --er-baseline-font-size: 10px;
    --er-content-font-size: 1.9rem;
    --er-reference-font-size: 85%;
    --er-reference-color: currentcolor;
    /* note, fancy indenting is not supported in all browsers */
    --er-reference-indent: 2em hanging each-line;
    --content-font-size: var(--er-content-font-size);
    --content-width: 65vw;
    --container-width: var(--content-width);
    --head-nav-gap: 2rem;
    --content-spacing-multiplier: 0.5;
}

html {
    font-size: var(--er-baseline-font-size);
}

body {
    background-color: var(--er-color-bg-body);
    font-family: var(--er-content-font-family);

    & .gh-head-menu {
        margin-inline: 16px !important;
    }

    & .gh-powered-by {
        display: none;
    }

    & #rendered-md .site,
    & .site {
        max-width: 85%;
        margin-inline: auto;
        margin-block: 2%;
        box-shadow: var(--er-site-box-shadow);
        & .site-cover {
            min-height: 300px;
        }
        & .site-content {
            background-color: var(--er-color-bg-site-content);
            & .pagination-left, .pagination-right {
                font-family: var(--er-header-font-family);
                font-weight: var(--er-header-font-weight);
            }
            h1, h2, h3, h4, h5, h6 {
                /* because sometimes the margin is lost; I'm not sure why */
                margin-block-start: calc(1.6em * var(--content-spacing-multiplier, 1));
            }
            h1, h2, h3, h4 {
                font-family: var(--er-header-font-family);
                font-weight: var(--er-header-font-weight);
                line-height: 1.5;
            }
            h5, h6 {
                font-family: var(--er-content-font-family);
                font-family: var(--er-header-font-family2);
                font-weight: var(--er-header-font-weight2);
                text-transform: uppercase;
            }
            h6 { font-weight: normal; }
            pre, pre code, code, td code {
                font-family: var(--er-mono-content-font-family);
            }
        }

        & .gh-foot {
            background-color: var(--er-color-bg-site-content);
        }

        & #gh-head {
            width: 100%;
        }

        /* can hide ghost-managed membership stuff */
        /*
        & .gh-head-members {
            visibility: var(--er-gh-head-members-visibility);
        }
        & .gh-comments {
            display: none;
        }
        */

        & .site-cover > .cover-content {
            box-sizing: border-box;
            max-width: 70%;
            & > .search {
                box-sizing: border-box;
                max-width: 100%;
            }
            & > .cover-description {
               font-family: var(--er-fontstack-mono-courier);
            }
        }
        & .bmc-buttons, & .bmc-buttons-right {
            display: flex; gap: 2%;
            justify-content: flex-start;
            width: 50%;
            margin-block: 2em 0;
            & p {
                margin-block: 0;
                img {
                    border: 2px #3b2609ff solid;
                    border-radius: 10px;
                    &:hover {
                        border: 2px #ae6f1aff solid;
                    }
                }
                & a { border: none; }
            }
            DISPLAY: NONE; /* DISABLED */
        } /* .bmc-buttons */
        & .bmc-buttons-right {
            margin-inline: auto 0;
        } /* .bmc-buttons-right */
        & .marketing-buttons, & .marketing-buttons-right {
            display: flex; gap: 2%;
            justify-content: flex-start;
            margin-block: 2em 0;
            & p {
                margin-block: 0;
                img {
                    &:hover {
                        opacity: 0.6;
                    }
                }
                & a { border: none; }
            }
            width: 50%;
        } /* .marketing-buttons */
        & .mbuttons1 { width: 12.5%; }
        & .mbuttons2 { width: 25%; }
        & .mbuttons3 { width: 37.5%; }
        & .mbuttons4 { width: 50%; }
        & .marketing-buttons-right {
            margin-inline: auto 0;
        } /* .marketing-buttons-right */
    } /* .site */

    & .gh-content {
        & .er-horizontal-line {
            width: 100%;
            border-bottom: 2px solid var(--er-color-hr);
            margin-inline: auto;
        }
        & p {
            text-align: start;
            text-justify: auto;
            overflow-wrap: break-word;
            word-break: normal;
            hyphens: auto;
            line-height: var(--er-content-line-height);
            font-size: 1em;
            margin-bottom: 1em;
        }
        & .er-pubdate p {
            font-size: 0.8em;
            color: var(--er-color-hr);
            margin-block-start: 2em;
            border-block-start: 1px solid;
            text-align: end;
        }
        & .reference {
            display: flex; flex-direction: column;
            align-items: flex-end;
            p {
                /* fancy indenting not supported in all browsers */
                /* text-indent: var(--er-reference-indent); */
                text-indent: -3em;
                margin-inline-start: 3em;
                color: var(--er-reference-color);
                font-size: var(--er-reference-font-size);
                width: 85%;
            }
        }
        & blockquote :last-child {
            margin-bottom: 0;
        }
        & table:not(.gist table) {
            background: none;
        }
    }
} /* body */


@media print {
    :root {
        --content-width: 100%;
        --er-color-bg-body: transparent;
    }
    body {
        & > #announcement-bar-root {
            display: none;
        }
        & #gh-head, .gh-head-members, .pagination-container, .gh-comments {
            display: none;
        }
        & #jarallax-container-0 { display: none; }
        & .site-cover {
            min-height: unset !important;
            max-height: unset !important;
            height: 175px;
            background-color: dimgray;
            background-repeat: no-repeat;
            background-image: url("/content/images/2026/02/sheep-banner-big-edit-narrow-banner.jpg");
        }
        & > .site {
            box-shadow: none;
            & .site-cover {
                width: 100%;
                & > .cover-content > .search {
                    display: none;
                }
            } /* .site */
        }
        & footer.gh-foot .gh-copyright {
            & .er-footer-subscribe,
              .er-footer-copyright-rdot,
              .er-footer-colophon {
                  display: none;
              }
        }
    } /* body */
}