/*sizes*/
:root {
    --page-content-width: 70rem;
    --header-footer-content-width: 80rem; 
}

body {
    background: var(--color-bg);
    color: var(--color-text);
}

select, input, textarea {
    background: var(--color-control);
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

a {
    color: var(--color-text);
    align-content: center;
    transition: color 0.4s ease;

    &:hover {
        color: var(--color-primary);
    }

    &[aria-current="page"] {
        color: var(--color-primary);
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-decoration-color: var(--color-skalio);
        text-underline-offset: 3px;
    }

    &[target=_blank]::after {
        content: "⤴";
        margin-inline-start: 0.25rem;
    }
}

.no-wrap {
    white-space: nowrap;
}

::-webkit-scrollbar {
    width: 0.4rem;
    background-color: transparent;
}

::-webkit-scrollbar-track {
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: var(--color-border-strong);
    border-radius: 0rem;
}