/* ╔══════════════════════════════════════════════════════════════════╗
   ║  🎨 Premium UI 质感提升层 (styles-premium.css)                  ║
   ║  设计原则：克制、留白、去饱和、细节深度                          ║
   ║  不使用鲜艳渐变，用单色/近似色 + 微妙阴影 + 精确字重            ║
   ╚══════════════════════════════════════════════════════════════════╝ */

/* ====== 1. 全局色彩体系升级 ====== */
:root {
    /* 背景：暖灰调 */
    --bg-grey: #f6f5f3;
    
    /* 文字：去纯黑 */
    --text-main: #1d1d1f;
    --text-sub: #86868b;
    
    /* 边框：极淡 */
    --border: rgba(0, 0, 0, 0.06);
    
    /* 气泡相关变量交由 default-theme.css 等主题控制。 */

    /* 动效曲线 */
    --ease-premium: cubic-bezier(0.4, 0, 0.2, 1);
}


/* ══════════════════════════════════════════════════════════════════
   2. 聊天界面
   ══════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════════
   [2026-06-13] 聊天界面样式已全部移交给 default-theme.css 等主题文件统一控制
   premium 不再覆盖聊天背景/导航栏/气泡/时间戳/输入栏/按钮，避免主题被污染
   （仅保留消息行左右内边距这一无害的排版规则）
   ══════════════════════════════════════════════════════════════════ */

/* 消息行间距（仅排版，不涉及配色） */
.msg-row {
    padding: 5px 16px;
}


/* [3. 精灵App] 已迁移至 styles-atelier.css */


/* ══════════════════════════════════════════════════════════════════
   4. 购物App 个人界面
   ══════════════════════════════════════════════════════════════════ */

/* 底部Tab */
.shop-bottom-tabs {
    background: #ffffff !important;
    border-top: 0.5px solid rgba(0, 0, 0, 0.06) !important;
}
.shop-bottom-tab {
    color: #aeaeb2 !important;
    transition: color 0.2s ease;
}
.shop-bottom-tab.active {
    color: #1d1d1f !important;
}

/* 我的页面行 */
.shop-me-row {
    padding: 16px 20px !important;
    border-bottom: 0.5px solid rgba(0, 0, 0, 0.04) !important;
    font-size: 15px !important;
    color: #1d1d1f !important;
    gap: 14px !important;
}
.shop-me-row:active {
    background: rgba(0, 0, 0, 0.02) !important;
}
.shop-me-row i:first-child {
    color: #86868b !important;
    font-size: 18px;
}

/* 订单卡片 */
.shop-order-card {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 0.5px solid rgba(0, 0, 0, 0.04);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
    padding: 16px !important;
}
.shop-order-header {
    border-bottom: 0.5px solid rgba(0, 0, 0, 0.04) !important;
}

/* 商品卡片 */
.shop-title {
    color: #1d1d1f !important;
    font-weight: 500 !important;
    letter-spacing: -0.2px;
}
.shop-meta {
    color: #aeaeb2 !important;
}
.shop-note {
    background: rgba(0, 0, 0, 0.03) !important;
    color: #86868b !important;
    border-radius: 6px !important;
}


/* ══════════════════════════════════════════════════════════════════
   5. 美化App 布局调整（已移除：改为使用便签风，与设置app保持一致）
   ══════════════════════════════════════════════════════════════════ */



/* [6. 情侣空间 "TA的状态"] 已迁移至 styles-atelier.css */


/* ══════════════════════════════════════════════════════════════════
   7. 亲属卡界面 (情侣账号 styles-couple-account.css 覆盖)
   ══════════════════════════════════════════════════════════════════ */

/* 页面背景 */
.ca-page {
    background: #fafaf8 !important;
}

/* 顶栏 */
.ca-top-bar {
    border-bottom: 0.5px solid rgba(0, 0, 0, 0.05) !important;
    padding: 14px 20px !important;
}
.ca-top-bar .ca-title {
    font-weight: 700 !important;
    color: #1d1d1f !important;
    letter-spacing: -0.3px;
}

/* 按钮 */
.ca-btn {
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-radius: 18px !important;
    font-weight: 500 !important;
    color: #3a3a3c !important;
    transition: transform 0.1s ease;
}
.ca-btn:active {
    transform: scale(0.96) !important;
    background: rgba(0, 0, 0, 0.02) !important;
}
.ca-btn.primary {
    background: #1d1d1f !important;
    color: #ffffff !important;
    border-color: #1d1d1f !important;
}
.ca-btn.primary:active {
    background: #3a3a3c !important;
}

/* Tab导航 */
.ca-tab-bar {
    border-top: 0.5px solid rgba(0, 0, 0, 0.05) !important;
    background: #ffffff !important;
}
.ca-tab {
    color: #aeaeb2 !important;
}
.ca-tab.active {
    color: #1d1d1f !important;
}

/* 照片墙 */
.pw-stat-num {
    font-weight: 800 !important;
    color: #1d1d1f !important;
    letter-spacing: -1px;
}
.pw-stat-label {
    color: #aeaeb2 !important;
    font-size: 12px !important;
    letter-spacing: 0.5px;
}

/* 绳子 */
.pw-rope {
    background: rgba(0, 0, 0, 0.08) !important;
}
.pw-rope::before,
.pw-rope::after {
    background: rgba(0, 0, 0, 0.15) !important;
}


/* ══════════════════════════════════════════════════════════════════
   8. 通用质感提升
   ══════════════════════════════════════════════════════════════════ */

/* 通用导航栏 */
.nav-bar {
    backdrop-filter: blur(20px) saturate(1.2);
    -webkit-backdrop-filter: blur(20px) saturate(1.2);
}

/* 按钮交互反馈 */
button:active,
.full-btn:active {
    transform: scale(0.97);
    transition: transform 0.1s ease;
}

/* 通用卡片 */
.user-info-card,
.couple-module-card {
    background: #ffffff;
    border: 0.5px solid rgba(0, 0, 0, 0.04);
    border-radius: 14px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

/* 滚动容器 */
.scroll-y {
    scroll-behavior: smooth;
}

/* 模态框 */
.modal-content {
    border-radius: 18px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15), 0 4px 16px rgba(0, 0, 0, 0.08) !important;
}

/* Toast */
#toast {
    border-radius: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 0.2px;
}