/* ==UserStyle==
@name           Svelte.dev
@namespace      github.com/openstyles/stylus
@version        1.1.0
@description    Cybernetic docs!
@author         Rudraksh Tripathi
==/UserStyle== */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap');

@-moz-document url-prefix("https://svelte.dev/") {
    :root {
        --sk-font-family-ui: "JetBrains Mono" !important;
        --sk-font-family-heading: 'Rajdhani Variable' !important;
        --sk-font-family-mono: "JetBrains Mono" !important;
        --sk-font-family-body: "Inter" !important;
        --sk-font-size-body: 1.6rem !important;
        --sk-font-size-body-small: 1.6rem !important;
        --sk-bg-0: hsl(220 8% 8% / 1) !important;
        --sk-bg-1: hsl(220 10% 10% / 1) !important;
        --sk-bg-2: hsl(220 12% 13% / 1) !important;
        --sk-bg-3:
        --sk-font-size-h1: 5rem !important;
    }

    h1 {
        font-size: 5rem !important;
    }

    .home-link.svelte-wyep2e {
        width: 12.5rem!important;
    }

    .links.svelte-wyep2e {
        gap: 10px !important;
    }

    .breadcrumbs {
        font-family: "JetBrains Mono" !important;
        font-size: 1.2em !important;
        font-weight: 800 !important;
/*         letter-spacing: .05em; */
        letter-spacing: .1em;
        margin-bottom: 5px !important;
    }

    h1 {
        font-weight: 400 !important;
    }

    h3.svelte-1e4cvs7, h3 {
        font-family: "JetBrains Mono" !important;
        text-transform: uppercase !important;
        font-size: 0.88em !important;
        font-weight: 800 !important;
        letter-spacing: .1em;
        margin-bottom: .5em;
    }

    code {
        font-weight: 600 !important;
    }

    .page.svelte-1e4cvs7 {
        color: #545b68 !important;
    }

    .page.svelte-1e4cvs7:hover {
        color: #d3dbec !important;
        text-decoration: none !important;
    }

    .controls.svelte-72zfh9 span:where(.svelte-72zfh9) {
        font-weight: 800 !important;
        letter-spacing: .05em !important;
        font-size: 1.5em !important
    }

    a:hover {
        text-underline-offset: 5px !important;
    }

    .svelte-ro60mh {
        font-size: 1.13em !important;
        margin-bottom: 5px !important
    }

    li.svelte-ro60mh {
        font-size: 1em !important;
        text-decoration: none !important;
        color: #545b68 !important;
        line-height: 1.3 !important;
        font-family: Rajdhani Variable !important;
        font-weight: 500 !important;
    }

    li a {
/*         text-decoration: none !important; */
        color: #545b68 !important;
    }

    .on-this-page.svelte-ro60mh nav:where(.svelte-ro60mh) a.active:where(.svelte-ro60mh) {
        color: #d3dbec !important;
        text-decoration: none !important
    }

    li a:hover {
        color: #d3dbec !important;
        text-decoration: none !important;
    }

    .breadcrumbs.svelte-bkdwgg span:where(.svelte-bkdwgg):not(:last-child):after {
        content: "›" !important;
        font-size: 1.35em !important;
        margin: 0 7px !important;
    }

    #docs-content > header > div > span:nth-child(1) {
        filter: saturate(0) brightness(0.88);
    }

    [aria-current=page].svelte-1e4cvs7 {
        text-decoration: none!important;
        color: #d3dbec !important;
    }

    .svelte-bkdwgg {
        color: #f96743 !important;
    }

    [aria-current=page].svelte-1e4cvs7::before {
        content: '';
        position: absolute;
        left: -13px;
        top: 16%;
        height: 70%;
        border-left: 3px solid #f97453;
    }

    ul.svelte-1e4cvs7 ul:where(.svelte-1e4cvs7) * {
        font-family: "Rajdhani Variable" !important;
        font-size: 1.16em;

/*         font-family: "JetBrains Mono" !important;
        font-size: 0.95em !important; */

        font-weight: 500 !important;
    }

    a.svelte-1e4cvs7 {
        font-size: 0.9em !important
    }

    .links.svelte-wyep2e, .links.svelte-wyep2e *, .svelte-wyep2e {
        font-family: JetBrains Mono !important;
/*         font-family: Rajdhani Variable !important; */
        font-weight: 800 !important;
        letter-spacing: 0.05em !important;
        text-transform: uppercase;
        font-size: 16px !important;
    }

    .links.svelte-wyep2e a:where(.svelte-wyep2e).secondary {
        font-size: 16px !important;
        text-transform: capitalize !important;
        letter-spacing: 0 !important;
    }

    .links.svelte-wyep2e {
        margin-left: 30px !important;
    }

    svg.svelte-r1j42q {
        margin-left: 7px !important;
    }

    nav.svelte-wyep2e {
        background-color: var(--sk-bg-0) !important;
    }

    .menu.svelte-wyep2e .external-links:where(.svelte-wyep2e) {
        gap: 10px !important;
    }

    .dropdown-content.svelte-1n638ht {
        width: 15rem !important;
    }

    .text.svelte-xe9wq3 .code-block .controls .ts-toggle {
        font-family: JetBrains Mono;
        font-weight: 800;
        letter-spacing: .05em !important;
        gap: 5px;
        margin-top: -5px !important;
    }

    .filename {
        font-weight: 700 !important;
        margin-top: -5px !important;
    }

    .ts-toggle {
        border-radius: none !important;
        border-style: none !important;
        border-color: none !important;
        border-width: none !important;
    }

    .text.svelte-xe9wq3 .code-block .controls .filename {
        position: relative;
        padding-left: 24px; /* Add some space for the icon */
        margin-top: -7px !important
    }

    .text.svelte-xe9wq3 .code-block .controls .filename::before {
        content: '';
        position: absolute;
        left: 0;
        top: 51%;
        transform: translateY(-50%);
        width: 16px;  /* Adjust size as needed */
        height: 16px; /* Adjust size as needed */
        background-image: url('https://upload.wikimedia.org/wikipedia/commons/1/1b/Svelte_Logo.svg');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        filter: invert(1) saturate(0) contrast(1);
    }

    a {
        text-underline-offset: 5px !important;
    }

    :root.dark .home-link.svelte-wyep2e {
        background-image: url('https://i.postimg.cc/HkW4QsHm/Group-2-1.png') !important;
    }

    .contents.svelte-16shhk1 * {
        font-family: Rajdhani Variable !important;
        font-weight: 500 !important;
        font-size: 1.7rem !important;
    }

    .breadcrumbs.svelte-155hkc1 {
        text-transform: uppercase !important;
        margin-bottom: 0 !important;
    }

    div.secondary-nav.svelte-1a0lpc4 > details > summary > svg {
        margin-left: 0 !important;
    }

    .raised, .text.svelte-xe9wq3 details:before {
        border-radius: none !important;
        border-style: none !important;
        border-color: none !important;
        border-width: none !important;
    }

    div.breadcrumbs.svelte-155hkc1 > :not(span:last-child) {
        color: #545b68;
    }

    .text.svelte-xe9wq3 .code-block pre {
        border-radius: .45rem !important;
        background-color: hsl(220 10% 10% / 1) !important;
    }

    .text.svelte-xe9wq3 .code-block .controls:has(.filename) {
        background-color: hsl(220deg 14.05% 15.89%) !important;
    }

    .text.svelte-xe9wq3 .code-block {
        padding: 4px !important;
        border: none !important;
        background-color: hsl(218.18deg 13.58% 15.88%) !important;
        border-radius: .7rem !important;
    }

    .text.svelte-xe9wq3 .code-block .controls .copy-to-clipboard {
        margin-top: -5px !important;
        margin-right: 2px !important;
    }

    .text.svelte-xe9wq3 blockquote:has(details.legacy[open]):before {
        content: '';
        position: absolute;
        left: 0;
        top: 10%;
        z-index: -2 !important;
        transform: translateY(-50%);
        width: 100%;  /* Adjust size as needed */
        height: 16px; /* Adjust size as needed */
        border-top: 7px solid #f96743 !important;
        filter: blur(32px) saturate(2) !important;
    }

    .text.svelte-xe9wq3 blockquote:has(details.legacy) {
        border-top: 1px solid #f96743;
        padding-top: 10px !important;
        background-position: 13px 13px !important;
        background-size: 2rem 2rem !important;
/*         overflow-y: hidden !important; */
    }

    .text.svelte-xe9wq3 blockquote:has(details.legacy[open]):after {
        content: '';
        position: absolute;
        left: -50px;
        top: -40%;
        z-index: -1 !important;
        transform: translateY(-50%);
        width: 110%;  /* Adjust size as needed */
        height: 16px; /* Adjust size as needed */
        border-top: 75px solid #17191c !important;
        filter: blur(10px)
    }

    .text.svelte-xe9wq3 .code-block .controls:not(:has(.filename)) {
        background: none !important;
        margin: 7px 3px !important;
    }

    blockquote {
        margin-top: 30px !important;
    }

    blockquote > details > summary {
        font-family: "JetBrains Mono" !important;
        text-transform: uppercase !important;
        font-size: 1.3em !important;
        font-weight: 800 !important;
        letter-spacing: .05em;
    }

    .legacy :is(.text.svelte-xe9wq3 details>summary):after {
        display: none !important;
    }

    .text.svelte-xe9wq3 details[open]>summary {
        margin-bottom: none !important;
    }
}