/**
 * Lemonx Compatibility Styles for Frontend
 * 
 * 2026-02-09 v4：
 * 
 * 策略：用 .lemonx-visual-root.lemonx-visual-root（双重类名，特异性 0,2,0）
 * 作为前缀，确保特异性高于 Elementor Kit 的 .elementor-kit-XXX（特异性 0,1,0）。
 * 
 * 只重置最容易被主题/Elementor 污染的属性（不用 all:revert，避免破坏布局）。
 * 
 * 优先级链（从低到高）：
 *   Elementor .elementor-kit-XXX button   (0,1,1)
 *   < compat .lemonx-visual-root.lemonx-visual-root button  (0,2,1)
 *   < boosted 用户 .lemonx-visual-root .cert-tab  (0,2,0) — 同级但后加载
 *   < boosted 用户 .lemonx-visual-root .cert-tab.active  (0,3,0) — 最高
 */

/* ========================================
   按钮：清除主题/Elementor 的背景、颜色、边框、阴影等
   特异性: (0,2,1) — 覆盖 .elementor-kit-XXX button (0,1,1)
   ======================================== */

/* 按钮重置：特异性 (0,1,1)，低于 boosted 用户 CSS 的 (0,2,0) */
/* 但高于 Elementor 无前缀的 button (0,0,1) */
/* 对于 Elementor Kit 的 .elementor-kit-XXX button (0,1,1)，靠加载顺序取胜（compat 后加载） */
.lemonx-visual-root :where(button),
.lemonx-visual-root :where(button:hover),
.lemonx-visual-root :where(button:focus),
.lemonx-visual-root :where(button:focus-visible),
.lemonx-visual-root :where(button:active) {
    background: none;
    background-color: transparent;
    color: inherit;
    border: none;
    border-radius: 0;
    padding: 0;
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    text-transform: none;
    text-decoration: none;
    box-shadow: none;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: none;
}

.lemonx-visual-root :where(input[type="button"]),
.lemonx-visual-root :where(input[type="submit"]),
.lemonx-visual-root :where(input[type="reset"]) {
    background: none;
    background-color: transparent;
    color: inherit;
    border: none;
    padding: 0;
    font-family: inherit;
    font-size: inherit;
    box-shadow: none;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
}

/* ========================================
   链接：清除主题/Elementor 的颜色、下划线、阴影等
   ======================================== */

.lemonx-visual-root :where(a),
.lemonx-visual-root :where(a:hover),
.lemonx-visual-root :where(a:focus),
.lemonx-visual-root :where(a:active),
.lemonx-visual-root :where(a:visited) {
    color: inherit;
    text-decoration: none;
    background: none;
    border: none;
    outline: none;
    box-shadow: none;
    transition: none;
}

/* ========================================
   标题：清除主题/Elementor 的字体、颜色、间距等
   ======================================== */

.lemonx-visual-root :where(h1),
.lemonx-visual-root :where(h2),
.lemonx-visual-root :where(h3),
.lemonx-visual-root :where(h4),
.lemonx-visual-root :where(h5),
.lemonx-visual-root :where(h6) {
    color: inherit;
    font-family: inherit;
    font-size: revert;
    font-weight: revert;
    line-height: revert;
    margin: revert;
    padding: 0;
    letter-spacing: normal;
    text-transform: none;
}

/* ========================================
   段落/文本：清除主题的字体、颜色覆盖
   ======================================== */

.lemonx-visual-root :where(p) {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    margin: revert;
}

/* ========================================
   图片：确保响应式 + 清除主题边框/阴影
   ======================================== */

.lemonx-visual-root :where(img) {
    max-width: 100%;
    height: auto;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

/* ========================================
   SVG：清除 Elementor 对 SVG fill/stroke 的全局样式
   ======================================== */

.lemonx-visual-root :where(svg) {
    fill: revert;
    stroke: revert;
    width: revert;
    height: revert;
}

/* ========================================
   表单元素：清除主题覆盖
   ======================================== */

.lemonx-visual-root :where(input:not([type="button"]):not([type="submit"]):not([type="reset"])),
.lemonx-visual-root :where(textarea),
.lemonx-visual-root :where(select) {
    background: revert;
    color: inherit;
    border: revert;
    padding: revert;
    font-family: inherit;
    font-size: inherit;
    border-radius: revert;
    outline: revert;
}

/* ========================================
   Lemonx 自身的 UI 按钮（非用户内容）
   ======================================== */

.lemonx-visual-root .lemonx-btn {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    font-weight: 500;
    text-align: center;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    background-color: #10b981;
    color: white;
    transition: background-color 0.2s ease;
}

.lemonx-visual-root .lemonx-btn:hover {
    background-color: #059669;
}