/**
 * VPPL v2: 排他グループキー対象バリエーションのフロント表示
 *
 * - グレーアウト + 選択不可 + 「購入済み」バッジ
 */

/* バリエーション選択UI: 既購入バリエーションをグレーアウト */
.variations select option.vppl-locked {
    color: #999 !important;
    background-color: #f0f0f0 !important;
    text-decoration: line-through;
}

/* スワッチ系プラグイン (sw_wooswatches など) のラベル要素にも対応 */
.variations .vppl-locked,
.variations [data-vppl-locked="1"] {
    opacity: 0.45;
    cursor: not-allowed !important;
    pointer-events: none;
    position: relative;
    filter: grayscale(80%);
}

.variations .vppl-locked::after,
.variations [data-vppl-locked="1"]::after {
    content: "購入済み";
    display: inline-block;
    margin-left: 6px;
    padding: 2px 6px;
    background: #27ae60;
    color: #fff;
    font-size: 0.75em;
    font-weight: bold;
    border-radius: 3px;
    vertical-align: middle;
    pointer-events: none;
}

/* バリエーション選択後の availability_html バッジ */
.single_variation_wrap .vppl-already-purchased {
    color: #27ae60 !important;
    font-weight: bold;
    padding: 8px 12px;
    background: #eafaf1;
    border-left: 4px solid #27ae60;
    margin: 8px 0;
}

/* セレクトに「(購入済み)」を text で出すためのクラス（JSで付与） */
.variations select option.vppl-locked-option {
    color: #aaa;
}
