/**
 * XWRR Frontend Theme - 前端主题自适应样式
 * 简约精致风格
 * Version: 1.0
 */

/* ==================== 主题变量系统 ==================== */
:root {
    color-scheme: light dark;
    
    --xwrr-primary: #2271b1;
    --xwrr-primary-hover: #135e96;
    --xwrr-primary-light: rgba(34, 113, 177, 0.1);
    
    --xwrr-accent: #0ea5e9;
    --xwrr-accent-hover: #0284c7;
    
    --xwrr-success: #22c55e;
    --xwrr-success-hover: #16a34a;
    --xwrr-success-light: rgba(34, 197, 94, 0.1);
    
    --xwrr-warning: #f59e0b;
    --xwrr-warning-hover: #d97706;
    --xwrr-warning-light: rgba(245, 158, 11, 0.1);
    
    --xwrr-error: #ef4444;
    --xwrr-error-hover: #dc2626;
    --xwrr-error-light: rgba(239, 68, 68, 0.1);
    
    --xwrr-info: #3b82f6;
    --xwrr-info-light: rgba(59, 130, 246, 0.1);
    
    --xwrr-bg: #ffffff;
    --xwrr-bg-secondary: #f6f7f7;
    --xwrr-bg-tertiary: #f0f0f1;
    --xwrr-bg-elevated: #ffffff;
    
    --xwrr-text: #1d2327;
    --xwrr-text-secondary: #50575e;
    --xwrr-text-muted: #646970;
    --xwrr-text-inverse: #ffffff;
    
    --xwrr-border: #dcdcde;
    --xwrr-border-light: #e0e0e0;
    --xwrr-border-strong: #8c8f94;
    
    --xwrr-link: #2271b1;
    --xwrr-link-hover: #135e96;
    
    --xwrr-input-bg: #ffffff;
    --xwrr-input-border: #8c8f94;
    --xwrr-input-text: #2c3338;
    --xwrr-input-placeholder: #787c82;
    
    --xwrr-radius-sm: 4px;
    --xwrr-radius-md: 6px;
    --xwrr-radius-lg: 8px;
    --xwrr-radius-xl: 12px;
    --xwrr-radius-full: 9999px;
    
    --xwrr-space-1: 4px;
    --xwrr-space-2: 8px;
    --xwrr-space-3: 12px;
    --xwrr-space-4: 16px;
    --xwrr-space-5: 20px;
    --xwrr-space-6: 24px;
    --xwrr-space-8: 32px;
    
    --xwrr-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans SC", "Microsoft YaHei", sans-serif;
    --xwrr-font-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, monospace;
    
    --xwrr-text-xs: 12px;
    --xwrr-text-sm: 14px;
    --xwrr-text-base: 16px;
    --xwrr-text-lg: 18px;
    --xwrr-text-xl: 20px;
    --xwrr-text-2xl: 24px;
    --xwrr-text-3xl: 30px;
    
    --xwrr-gradient-purple: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --xwrr-gradient-blue: linear-gradient(135deg, #3b8d99 0%, #6b6b83 100%);
    --xwrr-gradient-green: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    --xwrr-gradient-orange: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}

/* ==================== 深色主题自动适配 ==================== */
@media (prefers-color-scheme: dark) {
    :root {
        --xwrr-bg: #2a2a2a;
        --xwrr-bg-secondary: #2a2a2a;
        --xwrr-bg-tertiary: #3a3a3a;
        --xwrr-bg-elevated: #2a2a2a;
        
        --xwrr-text: #e0e0e0;
        --xwrr-text-secondary: #a0a0a0;
        --xwrr-text-muted: #888888;
        --xwrr-text-inverse: #1a1a1a;
        
        --xwrr-border: #3a3a3a;
        --xwrr-border-light: #333333;
        --xwrr-border-strong: #555555;
        
        --xwrr-primary-light: rgba(34, 113, 177, 0.2);
        --xwrr-success-light: rgba(34, 197, 94, 0.2);
        --xwrr-warning-light: rgba(245, 158, 11, 0.2);
        --xwrr-error-light: rgba(239, 68, 68, 0.2);
        --xwrr-info-light: rgba(59, 130, 246, 0.2);
        
        --xwrr-link: #72aee6;
        --xwrr-link-hover: #a0d4f4;
        
        --xwrr-input-bg: #2a2a2a;
        --xwrr-input-border: #404040;
        --xwrr-input-text: #e0e0e0;
        --xwrr-input-placeholder: #888888;
    }
}

/* ==================== 常见主题框架深色模式支持 ==================== */
html.dark,
html[data-theme="dark"],
body.dark-mode,
body[data-theme="dark"],
.wp-dark-mode,
.theme-dark,
html.wp-dark-mode-active,
body.wp-dark-mode-active,
body.generatepress-dark-mode,
.generatepress-dark-mode,
body.ast-dark-mode,
.elementor-dark-mode,
body.et_divi_dark_mode,
body.fusion-dark-mode,
body.flatsome-dark {
    --xwrr-bg: #2a2a2a;
    --xwrr-bg-secondary: #2a2a2a;
    --xwrr-bg-tertiary: #3a3a3a;
    --xwrr-bg-elevated: #2a2a2a;
    
    --xwrr-text: #e0e0e0;
    --xwrr-text-secondary: #a0a0a0;
    --xwrr-text-muted: #888888;
    --xwrr-text-inverse: #1a1a1a;
    
    --xwrr-border: #3a3a3a;
    --xwrr-border-light: #333333;
    --xwrr-border-strong: #555555;
    
    --xwrr-primary-light: rgba(34, 113, 177, 0.2);
    --xwrr-success-light: rgba(34, 197, 94, 0.2);
    --xwrr-warning-light: rgba(245, 158, 11, 0.2);
    --xwrr-error-light: rgba(239, 68, 68, 0.2);
    --xwrr-info-light: rgba(59, 130, 246, 0.2);
    
    --xwrr-link: #72aee6;
    --xwrr-link-hover: #a0d4f4;
    
    --xwrr-input-bg: #2a2a2a;
    --xwrr-input-border: #404040;
    --xwrr-input-text: #e0e0e0;
    --xwrr-input-placeholder: #888888;
}

/* ==================== 基础组件样式 ==================== */
.xwrr-theme-text { color: var(--xwrr-text); }
.xwrr-theme-text-secondary { color: var(--xwrr-text-secondary); }
.xwrr-theme-text-muted { color: var(--xwrr-text-muted); }
.xwrr-theme-bg { background-color: var(--xwrr-bg); }
.xwrr-theme-bg-secondary { background-color: var(--xwrr-bg-secondary); }
.xwrr-theme-bg-tertiary { background-color: var(--xwrr-bg-tertiary); }
.xwrr-theme-border { border-color: var(--xwrr-border); }
.xwrr-theme-border-light { border-color: var(--xwrr-border-light); }
.xwrr-theme-link { color: var(--xwrr-link); }

.xwrr-card-theme {
    background-color: var(--xwrr-bg-elevated);
    border: 1px solid var(--xwrr-border);
    color: var(--xwrr-text);
}

.xwrr-input-theme {
    background-color: var(--xwrr-input-bg);
    border: 1px solid var(--xwrr-input-border);
    color: var(--xwrr-input-text);
}

.xwrr-input-theme::placeholder { color: var(--xwrr-input-placeholder); }
.xwrr-input-theme:focus { border-color: var(--xwrr-primary); outline: none; }

.xwrr-btn-theme-primary {
    background-color: var(--xwrr-primary);
    color: var(--xwrr-text-inverse);
    border: none;
}

.xwrr-btn-theme-secondary {
    background-color: var(--xwrr-bg-secondary);
    color: var(--xwrr-text);
    border: 1px solid var(--xwrr-border);
}

.xwrr-message-theme {
    padding: var(--xwrr-space-4);
    border-radius: var(--xwrr-radius-lg);
    margin-bottom: var(--xwrr-space-4);
    font-size: var(--xwrr-text-sm);
    line-height: 1.6;
}

.xwrr-message-theme.success { background: var(--xwrr-success-light); color: var(--xwrr-success); border: 1px solid var(--xwrr-success); }
.xwrr-message-theme.error { background: var(--xwrr-error-light); color: var(--xwrr-error); border: 1px solid var(--xwrr-error); }
.xwrr-message-theme.warning { background: var(--xwrr-warning-light); color: var(--xwrr-warning); border: 1px solid var(--xwrr-warning); }
.xwrr-message-theme.info { background: var(--xwrr-info-light); color: var(--xwrr-info); border: 1px solid var(--xwrr-info); }

.xwrr-badge-theme {
    display: inline-flex;
    align-items: center;
    padding: var(--xwrr-space-1) var(--xwrr-space-3);
    border-radius: var(--xwrr-radius-full);
    font-size: var(--xwrr-text-xs);
    font-weight: 600;
}

.xwrr-badge-theme.success { background: var(--xwrr-success-light); color: var(--xwrr-success); }
.xwrr-badge-theme.error { background: var(--xwrr-error-light); color: var(--xwrr-error); }
.xwrr-badge-theme.warning { background: var(--xwrr-warning-light); color: var(--xwrr-warning); }
.xwrr-badge-theme.info { background: var(--xwrr-info-light); color: var(--xwrr-primary); }

.xwrr-divider-theme {
    height: 1px;
    background: var(--xwrr-border);
    margin: var(--xwrr-space-5) 0;
}

/* ==================== 无障碍支持 ==================== */
@media (prefers-contrast: high) {
    :root {
        --xwrr-border: #000000;
        --xwrr-text: #000000;
        --xwrr-input-border: #000000;
    }
}

@media (prefers-reduced-motion: reduce) {
    .xwrr-card-theme,
    .xwrr-btn-theme-primary,
    .xwrr-btn-theme-secondary,
    .xwrr-input-theme {
        transition: none;
    }
}
