@import url("willow.css");
@import url("redhatmono.css");
@import url("gully.css");

/* Colors */

:root {
    --primary: #101010;
    --secondary: #f9a911;
    --teriary: #efee00;

    --primary-text: #fff;
    --primary-code: #1f1f1f;
}

/* Styles */

body {
    background-color: var(--primary);
    color: var(--primary-text);
    font-family: "Gully";
    width: min(896px, 100vw);
    margin: 0 auto;
    padding: 35px;
    min-height: calc(100% - 70px);
    box-shadow: 0px 0px 50px #000;
}

:root {
    font-family: "Gully";
}

html {
    background-image: url("./background.webp");
    background-color: #FFF;
    height: 100%;
}

:is(h1, h2, h3, h4, h5, h6) {
    font-family: "Willow";
}

:any-link {
    background: linear-gradient(
        90deg,
        rgb(255, 150, 150) 0%,
        rgb(255, 194, 102) 10%,
        rgb(244, 255, 107) 20%,
        rgb(176, 253, 173) 30%,
        rgb(155, 255, 254) 40%,
        rgb(192, 246, 255) 50%,
        rgb(96, 172, 255) 60%,
        rgb(138, 79, 255) 70%,
        rgb(217, 110, 255) 80%,
        rgb(255, 126, 237) 90%,
        rgb(255, 145, 145) 100%
    );
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

th,
td {
    text-align: center;
}

#ThemeList {
    padding: 0;
    margin: 0;
}

#ThemeList li {
    width: fit-content;
    display: inline-block;
    list-style: none;

}

code {
    background-color: var(--primary-code);
    display: inline-block;
    font-family: "RH Mono";
}

code.preformatted-text {
    display: block;
    white-space: pre-wrap;
    padding: 5px;
    font-size: small;
}

[aria-label=breadcrumbs] ol {
    padding: 0;
}

[aria-label=breadcrumbs] li {
    list-style: none;
    display: inline-block;
}

[aria-label=breadcrumbs] li + li::before {
    content: " / ";
}

/* Syntax Highlighting */

.lang-element {
    font-style: italic;
    color: #ffbcff;
}

.lang-attribute {
    color: #ffb669;
}

.lang-string {
    color: #b3f5ff;
}