/**
 * UserHub Pro - 前端样式
 *
 * 目录索引 (Table of Contents)
 * ============================================================================
 *
 * 1. BASE - 基础样式
 *    1.1 CSS Variables          - CSS 变量定义
 *    1.2 Button Reset           - 按钮样式重置（覆盖主题）
 *
 * 2. LAYOUT - 布局组件
 *    2.1 Fullpage Template      - 全屏认证页模板
 *    2.2 Form Container         - 表单容器
 *
 * 3. COMPONENTS - 通用组件
 *    3.1 Buttons                - 按钮样式
 *    3.2 Forms                  - 表单元素
 *    3.3 Messages               - 消息提示
 *    3.4 Modal                  - 模态框
 *    3.5 Toast                  - Toast 提示
 *    3.6 Pagination             - 分页组件
 *    3.7 Loading                - 加载状态
 *    3.8 Empty State            - 空状态
 *    3.9 Lightbox               - 图片预览
 *    3.10 Confirm Dialog        - 确认对话框
 *
 * 4. USER CENTER - 用户中心
 *    4.1 Layout                 - 用户中心布局
 *    4.2 Navigation             - 导航菜单（轻量 Tab）
 *    4.3 Header                 - 头部区域
 *    4.4 Content                - 内容区域
 *    4.5 Settings               - 设置页面
 *    4.6 Overview               - 动态页面
 *
 * 5. FEATURES - 功能模块
 *    5.1 Social Login           - 社交登录
 *    5.2 Login Modal            - 登录模态框
 *    5.3 Avatar Manager         - 头像管理
 *    5.4 Post Actions           - 点赞收藏
 *    5.5 User Comments          - 用户评论
 *    5.6 Login Logs             - 登录日志
 *
 * 6. MODULES - 业务模块
 *    6.1 Points System          - 积分系统
 *    6.2 Checkin Calendar       - 签到日历
 *    6.3 Badges                 - 徽章系统
 *    6.4 Follow System          - 关注系统
 *    6.5 Poster                 - 分享海报
 *    6.6 Notifications          - 通知中心
 *    6.7 Reports                - 举报系统
 *
 * 7. CONTENT - 内容模块
 *    7.1 Creations              - 创作中心
 *    7.2 Submissions            - 投稿系统
 *    7.3 Thoughts               - 想法系统
 *
 * 8. PAGES - 页面特定样式
 *    8.1 User Profile           - 用户公开主页
 *    8.2 404 Page               - 404 页面
 *    8.3 Access Denied          - 无权访问
 *
 * 9. RESPONSIVE - 响应式样式
 *    9.1 Mobile (max-width: 768px)
 *    9.2 Small Mobile (max-width: 480px)
 *
 * ============================================================================
 */

/* ==========================================================================
   1. BASE - 基础样式
   ========================================================================== */

/* --------------------------------------------------------------------------
   1.1 CSS Variables - CSS 变量定义
   -------------------------------------------------------------------------- */
/* Shared tokens are loaded by the uap-design-system style dependency. */

/* Video cover settings shared by the inline composer and the thought editor. */
.uap-video-cover-editor[hidden] {
    display: none !important;
}

.uap-video-cover-editor {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    margin-top: 10px;
    box-sizing: border-box;
    border: 1px solid var(--uap-border);
    border-radius: 10px;
    background: var(--uap-surface);
    color: var(--uap-text);
}

.uap-video-cover-preview {
    width: 80px;
    height: 80px;
    flex: 0 0 80px;
    object-fit: contain;
    border-radius: 6px;
    background: var(--uap-bg);
}

.uap-video-cover-body {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13px;
}

.uap-video-cover-editor .uap-video-cover-hint,
.uap-video-cover-editor .uap-video-cover-status {
    margin: 6px 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--uap-text-muted);
    overflow-wrap: anywhere;
}

.uap-video-cover-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.uap-video-cover-actions button {
    appearance: none;
    padding: 6px 10px !important;
    margin: 0 !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 32px !important;
    max-width: 100%;
    border: 1px solid var(--uap-border) !important;
    border-radius: 6px !important;
    background: var(--uap-surface) !important;
    color: var(--uap-text) !important;
    font: inherit;
    font-size: 12px;
    line-height: 1.5;
    white-space: normal;
    cursor: pointer;
}

.uap-video-cover-actions button:hover {
    background: var(--uap-bg) !important;
}

.uap-video-cover-actions button:disabled,
.uap-video-cover-edit:disabled {
    opacity: 0.5;
    cursor: default;
}