/* Navigation cards — glass card style */

.box2 {
    height: 86px;
    cursor: pointer;
    padding: 0 24px;
    background: var(--card-bg);
    border: 1px solid var(--color-border);
    margin: 16px 0 0;
    -webkit-transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1),
                        box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1),
                        background 280ms cubic-bezier(0.4, 0, 0.2, 1),
                        border-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1),
                     box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1),
                     background 280ms cubic-bezier(0.4, 0, 0.2, 1),
                     border-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1),
                   box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1),
                   background 280ms cubic-bezier(0.4, 0, 0.2, 1),
                   border-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1),
                background 280ms cubic-bezier(0.4, 0, 0.2, 1),
                border-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.box2:hover {
    background: var(--card-bg-hover);
    border-color: rgba(var(--color-primary-rgb), 0.25);
}

.box2:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.xe-comment-entry img {
    float: left;
    display: block;
    margin-right: 10px;
}

.xe-comment {
    transform: translateY(-50%);
    position: absolute;
    margin-left: 50px;
    top: 50%;
}

.xe-comment p {
    margin-bottom: 0;
    margin-right: 15px;
    color: var(--color-text-muted);
    font-size: 12px;
    line-height: 1.4;
}

.page-body.glass-theme .xe-comment .xe-user-name strong {
    color: var(--color-foreground);
    font-weight: 600;
    font-size: 14px;
}

.overflowClip_1 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.overflowClip_2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.submit-tag {
    margin-top: 50px;
}

.img-circle {
    padding: 7px 0;
    border-radius: 12px;
    background: var(--chip-bg);
    box-shadow: var(--neu-raised-sm);
}

@media (prefers-reduced-motion: reduce) {
    .box2:hover {
        transform: none;
        -webkit-transform: none;
        -moz-transform: none;
    }
}