:root {
    --a-size: 1.2rem;
    --p-size: 1rem;
}

.page-icon-text a {
    text-decoration: none;
    position: relative;
    font-size: var(--a-size);
    transition: all .3s ease 0s;
}

.page-icon-text a:hover {
    color: var(--palette-pink);
}

.page-icon-text a::after {
    content: ""; 
    display: block; /* Ensure the pseudo-element takes up space */
    position: absolute;
    height: 0.2rem;
    background-color: var(--palette-pink);
    width: 0%;
    transition: all .3s ease 0s;
}

.page-icon-text a:hover::after {
    width: 100%;
}

.page-icon-text {
    color: var(--color-background);
    font-family: 'JetBrains Mono';
    font-weight: 500;
    display: flex;
    align-items: center;
    padding: 0.5rem;
}

.page-icon-text i {
    font-weight: 700;
    font-size: 1.6rem;
    color: var(--color-hiddentext);
    cursor: default;
}

.page-special svg {
    padding-left: 2rem;
    color: var(--color-hiddentext);
}

.page-icon-text img, .page-icon-text svg {
    /* width: calc(calc(((var(--page-height)*var(--ratio-container-float))) - 4rem)*(1/4)); */
    width: 1.8rem;
    height: auto;
    padding-right: 2rem;
}

.page-text {
    color: var(--color-hiddentext);
    font-family: 'JetBrains Mono';
    font-weight: 400;
    font-size: var(--p-size);
    display: flex;
    align-items: center;
    padding: 0.5rem;
}

.page-overflow {
    max-height: 10rem;
}