/* File: wp-content/plugins/wpmc-drl-review/assets/css/sidebar-mascot.css */

.wpmc-forum-sidebar-mascot {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    margin: 18px 0 12px;
    border-top: 1px solid var(--drl-line);
    padding-top: 16px;
}

.wpmc-forum-sidebar-mascot__link {
    display: grid;
    width: 100%;
    place-items: center;
    gap: 5px;
    color: var(--drl-text);
    text-align: center;
    text-decoration: none;
}

.wpmc-forum-sidebar-mascot__visual {
    position: relative;
    display: block;
    width: 108px;
    aspect-ratio: 2 / 3;
    contain: layout paint;
    transition: transform 180ms ease;
}

.wpmc-forum-sidebar-mascot__sprite {
    position: absolute;
    inset: 0;
    display: block;
    background-image: var(--wpmc-forum-sidebar-sprite);
    background-position: var(--wpmc-forum-sidebar-frame-position, 0%) 0;
    background-repeat: no-repeat;
    background-size: 700% 100%;
    filter: drop-shadow(0 8px 10px color-mix(in srgb, #000 18%, transparent));
    will-change: background-position;
}

.wpmc-forum-sidebar-mascot__link > strong {
    color: var(--drl-text-muted);
    font-size: 12px;
    font-weight: 720;
    letter-spacing: 0.01em;
    transition: color 160ms ease;
}

.wpmc-forum-sidebar-mascot__link:is(:hover, :focus-visible) .wpmc-forum-sidebar-mascot__visual {
    transform: translateY(-2px);
}

.wpmc-forum-sidebar-mascot__link:is(:hover, :focus-visible) > strong {
    color: var(--drl-workspace-nav);
}

.drl-sidebar[data-drl-sidebar-expanded="false"] .wpmc-forum-sidebar-mascot {
    display: none;
}

@media (prefers-reduced-motion: reduce) {
    .wpmc-forum-sidebar-mascot__visual,
    .wpmc-forum-sidebar-mascot__link > strong {
        transition: none;
    }
}