/* 統一いいねボタンスタイル - ポータル全体で共通 */
.like-btn-common,
.like-badge,
.likes,
.blog-likes,
.cast-like-btn,
.blog-like-btn {
    background: rgba(0,0,0,0.65) !important;
    color: #fff !important;
    font-size: 14px !important;
    padding: 5px 10px !important;
    border-radius: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    border: none !important;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
    z-index: 10;
    line-height: 1 !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.like-btn-common:active,
.like-badge:active,
.likes:active,
.blog-likes:active,
.cast-like-btn:active,
.blog-like-btn:active {
    transform: scale(0.95);
}

.like-btn-common.liked,
.like-badge.liked,
.likes.liked,
.blog-likes.liked,
.cast-like-btn.liked,
.blog-like-btn.liked {
    background: rgba(235,87,87,0.9) !important;
}

/* ハートの幅を固定してサイズ変化を防止 */
.like-btn-common .heart,
.like-badge .heart,
.likes .heart,
.blog-likes .heart,
.cast-like-btn .heart,
.blog-like-btn .heart {
    color: #ff6b6b !important;
    display: inline-block !important;
    width: 14px !important;
    text-align: center !important;
    font-style: normal;
}

.like-btn-common.liked .heart,
.like-badge.liked .heart,
.likes.liked .heart,
.blog-likes.liked .heart,
.cast-like-btn.liked .heart,
.blog-like-btn.liked .heart {
    color: #fff !important;
}

/* カウント数値のスタイル */
.like-btn-common .count,
.like-badge .count,
.likes .count,
.blog-likes .count,
.cast-like-btn .count,
.blog-like-btn .count {
    font-size: 13px !important;
    min-width: 12px;
    text-align: left;
}

/* クリック領域拡張 */
.like-btn-common::after,
.like-badge::after,
.likes::after,
.blog-likes::after,
.cast-like-btn::after,
.blog-like-btn::after {
    content: '';
    position: absolute;
    top: -4px;
    left: -4px;
    right: -8px;
    bottom: -8px;
    z-index: 10;
}