/**
 * WebBiz Toolkit - Spoiler 劇透遮罩（編輯器）
 * 三種樣式：模糊、塗黑、底線
 */

/* 編輯器共用基礎樣式 */
.wp-block [class*="webbiz-spoiler--"],
.editor-styles-wrapper [class*="webbiz-spoiler--"],
.block-editor-rich-text__editable [class*="webbiz-spoiler--"] {
    display: inline !important;
    position: relative !important;
    font-weight: 500 !important;
}

/* 模糊樣式 - 編輯器 */
.wp-block .webbiz-spoiler--blur,
.editor-styles-wrapper .webbiz-spoiler--blur,
.block-editor-rich-text__editable .webbiz-spoiler--blur {
    background: linear-gradient(135deg, #374151 0%, #4b5563 100%) !important;
    color: #fff !important;
    padding: 1px 6px !important;
    border-radius: 3px !important;
}

.wp-block .webbiz-spoiler--blur::before,
.editor-styles-wrapper .webbiz-spoiler--blur::before,
.block-editor-rich-text__editable .webbiz-spoiler--blur::before {
    content: 'blur ' !important;
    font-size: 0.7em !important;
    opacity: 0.7 !important;
    text-transform: uppercase !important;
}

/* 塗黑樣式 - 編輯器 */
.wp-block .webbiz-spoiler--blackout,
.editor-styles-wrapper .webbiz-spoiler--blackout,
.block-editor-rich-text__editable .webbiz-spoiler--blackout {
    background: #1f2937 !important;
    color: #fff !important;
    padding: 2px 6px !important;
    border-radius: 3px !important;
}

.wp-block .webbiz-spoiler--blackout::before,
.editor-styles-wrapper .webbiz-spoiler--blackout::before,
.block-editor-rich-text__editable .webbiz-spoiler--blackout::before {
    content: 'black ' !important;
    font-size: 0.7em !important;
    opacity: 0.7 !important;
    text-transform: uppercase !important;
}

/* 底線樣式 - 編輯器 */
.wp-block .webbiz-spoiler--underline,
.editor-styles-wrapper .webbiz-spoiler--underline,
.block-editor-rich-text__editable .webbiz-spoiler--underline {
    background: #fef2f2 !important;
    color: #dc2626 !important;
    padding: 1px 4px !important;
    border-bottom: 2px solid #dc2626 !important;
    border-radius: 0 !important;
}

.wp-block .webbiz-spoiler--underline::before,
.editor-styles-wrapper .webbiz-spoiler--underline::before,
.block-editor-rich-text__editable .webbiz-spoiler--underline::before {
    content: 'line ' !important;
    font-size: 0.7em !important;
    opacity: 0.7 !important;
    text-transform: uppercase !important;
}