/* 默认亮色主题 */
:root {
    /* 极致蓝 Oceanic Premium 配色 */
    --primary-color: #00A2FF;
    --primary-gradient: linear-gradient(135deg, #00A2FF 0%, #0066FF 100%);
    --background-color: #000b1a;
    /* 深度海洋渐变背景 */
    --ocean-bg: radial-gradient(circle at 50% -20%, #003366 0%, #000c1d 80%, #000000 100%);

    --card-background: rgba(255, 255, 255, 0.08);
    --glass-background: rgba(255, 255, 255, 0.05);
    --text-primary: #ffffff;
    --text-secondary: rgba(255, 255, 255, 0.6);
    --border-color: rgba(255, 255, 255, 0.1);

    /* 玻璃拟态深度增强 */
    --glass-blur: blur(25px);
    --glass-shadow: 0 15px 35px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);
    --glass-border: 1px solid rgba(255, 255, 255, 0.15);

    /* 开奖球精致样式 */
    --number-ball-bg: radial-gradient(circle at 30% 30%, #4facfe 0%, #007AFF 100%);
    --number-ball-shadow: 0 0 15px rgba(0, 162, 255, 0.6);
    --number-ball-text: #ffffff;

    --countdown-bg: rgba(255, 59, 48, 0.2);
    --header-bg: rgba(0, 11, 26, 0.82);
    --header-text: #ffffff;
    --theme-toggle-hover: rgba(0, 122, 255, 0.1);

    /* 按钮相关变量 */
    --primary-btn-bg: #007AFF;
    --primary-btn-text: #ffffff;
    --primary-btn-border: #007AFF;
    --primary-btn-hover-bg: #0056b3;

    --secondary-btn-bg: rgba(0, 122, 255, 0.05);
    --secondary-btn-text: #007AFF;
    --secondary-btn-border: rgba(0, 122, 255, 0.2);
    --secondary-btn-hover-bg: rgba(0, 122, 255, 0.1);
}

/* 暗色主题 */
:root[data-theme="dark"] {
    --primary-color: #00A2FF;
    --primary-gradient: linear-gradient(135deg, #0A84FF 0%, #0056b3 100%);
    --background-color: #000b1a;
    --ocean-bg: radial-gradient(circle at 50% -20%, #001a33 0%, #00050a 100%);
    --card-background: rgba(28, 28, 30, 0.85);
    --glass-background: rgba(0, 20, 42, 0.7);
    --text-primary: #f5f5f7;
    --text-secondary: #98989f;
    --border-color: rgba(10, 132, 255, 0.2);
    --number-ball-bg: #0A84FF;
    --number-ball-text: #ffffff;
    --countdown-bg: #FF453A;
    --header-bg: rgba(28, 28, 30, 0.8);
    --header-text: #f5f5f7;
    --theme-toggle-hover: rgba(10, 132, 255, 0.15);

    /* 玻璃拟态效果 */
    --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.4);

    /* 按钮相关变量 */
    --primary-btn-bg: #0A84FF;
    --primary-btn-text: #ffffff;
    --primary-btn-border: #0A84FF;
    --primary-btn-hover-bg: #0056b3;

    --secondary-btn-bg: rgba(10, 132, 255, 0.1);
    --secondary-btn-text: #0A84FF;
    --secondary-btn-border: rgba(10, 132, 255, 0.3);
    --secondary-btn-hover-bg: rgba(10, 132, 255, 0.15);
}


/* 自动跟随系统主题 */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --primary-color: #0A84FF;
        --background-color: #000000;
        --card-background: #1C1C1E;
        --text-primary: #ffffff;
        --text-secondary: #98989F;
        --border-color: #38383A;
        --number-ball-bg: #0A84FF;
        --number-ball-text: #ffffff;
        --countdown-bg: #FF453A;
        --header-bg: #1C1C1E;
        --header-text: #ffffff;
        --theme-toggle-hover: rgba(255, 255, 255, 0.1);
    }
}


/* 基础样式重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background: var(--background-color);
    /* 使用变量避免主题切换闪烁 */
    color: var(--text-primary);
    margin: 0;
    padding: 0;
    min-height: 100vh;
    /* 安全区域适配 */
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    /* 优化渲染性能 */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 整体布局控制 */
.app {
    max-width: 640px;
    padding-bottom: calc(60px + env(safe-area-inset-bottom));
    /* 修复底部导航遮挡 */
    width: 100%;
    margin: 0 auto;
    position: relative;
    min-height: 100vh;
    background: var(--background-color);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    /* 优化渲染 */
    will-change: auto;
}


/* 底部导航基础定义已迁移至 main.css 以支持 fixed 定位和安全区域适配 */

.bottom-nav-container {
    width: 100%;
    display: flex;
    justify-content: space-around;
}

.nav-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 12px;
    gap: 4px;
}

.nav-item.active {
    color: var(--primary-color);
}

.nav-item i {
    font-size: 20px;
}

/* 通用点击反馈效果 */
button,
.action-button,
.nav-item,
.tab-item,
.tab-btn,
.lhc-tab-btn {
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}

button:active,
.action-button:active,
.tab-item:active,
.tab-btn:active,
.lhc-tab-btn:active {
    transform: scale(0.95);
    opacity: 0.8;
}

.nav-item:active {
    transform: translateY(2px);
    opacity: 0.8;
}

/* 暗色模式适配 */
:root[data-theme="dark"] body {
    background: var(--ocean-bg);
    background-attachment: fixed;
}


/* Header 基础定义已迁移至 main.css 以支持 App-shell 布局 */


/* 添加过渡效果 */
body {
    transition: background-color 0.3s ease, color 0.3s ease;
}

.lottery-card,
.header,
.theme-toggle,
.number-ball {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* 主题切换按钮样式 */
.theme-toggle {
    background: none;
    border: none;
    color: var(--text-primary);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    /* 圆形按钮 */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s;
}

.theme-toggle:hover {
    background-color: var(--theme-toggle-hover);
}

.theme-toggle i {
    font-size: 20px;
}

/* 修改内容区域样式 */
.money-container {
    padding: 85px 5px 60px 5px;
    display: block;
    /* 改用block布局，移除grid */
}

/* 添加广告项样式 */
.money-link {
    display: block;
    margin-bottom: 5px;
    /* 广告之间的间距 */
    text-decoration: none;
    border-radius: 16px;
    /* 大卡片圆角 */
    overflow: hidden;
}

.money-image {
    width: 100%;
    display: block;
}