/*
 * RV_SOCIAL_HOWL_COUNT_UNDER_LABEL_V99M_20260613
 * Uses uploaded traced wolf icon and stacks Howl count under label.
 */

.rv99b-howl-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center;
    gap: 8px;
    line-height: 1 !important;
}

.rv99b-howl-action .rv99b-wolf-icon {
    width: 28px;
    height: 28px;
    display: block;
    flex: 0 0 28px;
    margin: 0 !important;
    vertical-align: middle !important;
    transform: translateY(0);
    pointer-events: none;
    color: currentColor;
}

.rv99b-howl-action .rv99b-wolf-icon path {
    fill: currentColor;
}

.rv99m-howl-stack {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    min-width: 0;
    line-height: 1 !important;
}

.rv99m-howl-label {
    display: block;
    line-height: 1 !important;
    font: inherit;
    font-weight: inherit;
    color: inherit;
}

.rv99m-howl-count {
    display: block;
    line-height: 1 !important;
    font-size: 11px;
    font-weight: 850;
    color: #98a2b3;
    letter-spacing: .01em;
}

.rv99b-howl-action.rv99b-howled {
    color: #e10600 !important;
}

.rv99b-howl-action.rv99b-howled .rv99m-howl-count {
    color: rgba(225, 6, 0, .72);
}

.rv99b-howl-action.rv99b-howled .rv99b-wolf-icon {
    filter: drop-shadow(0 1px 2px rgba(225, 6, 0, .24));
}

.rv31-actions .rv99b-howl-action,
.rv98a-actionbar .rv99b-howl-action,
button.rv99b-howl-action,
a.rv99b-howl-action {
    display: inline-flex !important;
    align-items: center !important;
}


/* RV_SOCIAL_HOWL_REELS_ICON_ONLY_V99N_20260613_START */
/*
 * Reels/Stories vertical rail override:
 * The circular button should contain only the wolf icon.
 * The count sits below the circle, matching the other rail actions.
 */
.rv99n-reel-howl {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    line-height: 1 !important;
    overflow: visible !important;
}

.rv99n-reel-howl .rv99b-wolf-icon {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    display: block !important;
    margin: 0 !important;
    transform: none !important;
    vertical-align: middle !important;
}

.rv99n-reel-howl .rv99m-howl-stack,
.rv99n-reel-howl .rv99m-howl-label,
.rv99n-reel-howl .rv99m-howl-count,
.rv99n-reel-howl .rv99b-howl-word {
    display: none !important;
}

.rv99n-reel-howl-count {
    display: block !important;
    width: 100%;
    text-align: center !important;
    margin: 5px auto 0 !important;
    padding: 0 !important;
    color: #f2f4f7 !important;
    font-size: 17px !important;
    font-weight: 1000 !important;
    line-height: 1 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.rv99n-reel-howl-wrap {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}
/* RV_SOCIAL_HOWL_REELS_ICON_ONLY_V99N_20260613_END */


/* RV_SOCIAL_HOWL_PROFILE_PAGE_FIX_V99O_20260613_START */
/*
 * Profile-page Howl layout:
 * icon + label centered, count underneath.
 * Does not apply to reels/stories vertical rails.
 */

body.rv99o-profile-page .rv99b-howl-action:not(.rv99n-reel-howl),
.rv99o-profile-scope .rv99b-howl-action:not(.rv99n-reel-howl) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    line-height: 1 !important;
    overflow: visible !important;
}

body.rv99o-profile-page .rv99b-howl-action:not(.rv99n-reel-howl) .rv99b-wolf-icon,
.rv99o-profile-scope .rv99b-howl-action:not(.rv99n-reel-howl) .rv99b-wolf-icon {
    width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    display: block !important;
    margin: 0 !important;
    transform: translateY(0) !important;
}

body.rv99o-profile-page .rv99b-howl-action:not(.rv99n-reel-howl) .rv99m-howl-stack,
.rv99o-profile-scope .rv99b-howl-action:not(.rv99n-reel-howl) .rv99m-howl-stack {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 2px !important;
    line-height: 1 !important;
    min-width: 0 !important;
}

body.rv99o-profile-page .rv99b-howl-action:not(.rv99n-reel-howl) .rv99m-howl-label,
.rv99o-profile-scope .rv99b-howl-action:not(.rv99n-reel-howl) .rv99m-howl-label {
    display: block !important;
    line-height: 1 !important;
}

body.rv99o-profile-page .rv99b-howl-action:not(.rv99n-reel-howl) .rv99m-howl-count,
.rv99o-profile-scope .rv99b-howl-action:not(.rv99n-reel-howl) .rv99m-howl-count {
    display: block !important;
    margin-top: 2px !important;
    color: #98a2b3 !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
}

body.rv99o-profile-page .rv99b-howl-action.rv99b-howled:not(.rv99n-reel-howl) .rv99m-howl-count,
.rv99o-profile-scope .rv99b-howl-action.rv99b-howled:not(.rv99n-reel-howl) .rv99m-howl-count {
    color: rgba(225, 6, 0, .72) !important;
}
/* RV_SOCIAL_HOWL_PROFILE_PAGE_FIX_V99O_20260613_END */