/* ============================================
   认证/小黑屋页面 优化 v1.0
   ============================================ */

/* --- 认证页面 --- */
.verify-desc {
  padding: 32px !important;
  color: #475569 !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

.verify-users-title {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
}

.verify-box {
  border-radius: var(--r-lg) !important;
  transition: all var(--t-fast) !important;
}

.verify-box:hover {
  background: #FAFBFC !important;
}

.verify-box img {
  border-radius: 50% !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}

.verify-button button {
  border-radius: var(--r-lg) !important;
  padding: 12px 32px !important;
  background: linear-gradient(135deg, var(--gold), var(--gold-dark)) !important;
  color: #fff !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 12px var(--gold-bg-25) !important;
}

/* --- 验证码组件 --- */
.verify-number span {
  border-radius: var(--r-md) !important;
}

.verify-number.picked span {
  background: var(--gold) !important;
}


/* ============================================
   认证服务页面 优化 v1.0
   ============================================ */

.verify-desc {
  color: #475569 !important;
  font-size: 15px !important;
}

.verify-users-title {
  color: #0F172A !important;
  font-weight: 700 !important;
}

.verify-users-title::before,
.verify-users-title::after {
  border-image-source: linear-gradient(to right, transparent 0%, #E2E8F0 100%) !important;
}

.verify-box {
  border-radius: var(--r-lg) !important;
  transition: all var(--t-fast) !important;
}

.verify-box:hover {
  background: #FAFBFC !important;
}

.verify-box img {
  border: 2px solid #F1F5F9 !important;
}

.verify-button button {
  background: linear-gradient(135deg, var(--gold), var(--gold-dark)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--r-md) !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(245,158,11,0.25) !important;
}

.verify-number.picked span {
  background: var(--gold) !important;
}


/* ============================================
   海报/分享组件 优化 v1.0
   ============================================ */

.poster-box .modal-content {
  border-radius: var(--r-xl) !important;
  overflow: hidden !important;
}

.poster-content {
  gap: 0 !important;
}

.poster-box-left {
  background: #FAFBFC !important;
  border-radius: var(--r-lg) 0 0 var(--r-lg) !important;
}

.poster-box-left .poster-info h2 {
  font-weight: 700 !important;
  color: #0F172A !important;
}

.poster-box-left .poster-info p {
  color: #64748B !important;
}

.poster-footer {
  border-top: 1px dashed #E2E8F0 !important;
}

.poster-footer-right img {
  border: 1px solid #E2E8F0 !important;
  border-radius: var(--r-md) !important;
}

.poster-share {
  background: #F8FAFC !important;
}

.poster-content button,
.poster-content .button {
  border-radius: var(--r-md) !important;
  font-size: 12px !important;
  transition: all var(--t-fast) !important;
}

.poster-content button:hover,
.poster-content .button:hover {
  opacity: 0.9 !important;
  transform: translateY(-1px) !important;
}

.poster-content .poster-share-download {
  background: #1E293B !important;
  color: #fff !important;
}

.share-text {
  color: var(--gold-dark) !important;
  font-size: 13px !important;
}

.poster-date {
  border-radius: var(--r-md) !important;
  overflow: hidden !important;
}


/* ============================================
   空白/404页面 优化 v1.0
   ============================================ */

.empty-page {
  color: #94A3B8 !important;
  padding: 40px 20px !important;
}

.empty-page i {
  font-size: 80px !important;
  color: #CBD5E1 !important;
  margin-bottom: 16px !important;
}

.empty-page h2 {
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #64748B !important;
  margin-bottom: 8px !important;
}

.empty-page img {
  opacity: 0.6 !important;
  margin-bottom: 20px !important;
}

.empty-page .button.text.empty {
  color: var(--gold-dark) !important;
  border: 1.5px solid var(--gold-bg-30) !important;
  border-radius: var(--r-md) !important;
  padding: 8px 20px !important;
  transition: all var(--t-fast) !important;
  background: none !important;
}

.empty-page .button.text.empty:hover {
  background: var(--gold-bg) !important;
  border-color: var(--gold) !important;
}


/* ============================================
   公告页面 优化 v1.0
   ============================================ */

.announcement-show-more {
  border-radius: var(--r-md) !important;
  background: #FAFBFC !important;
}

.announcement-show-more span:first-child {
  color: #0F172A !important;
}

.announcement-box h2.title {
  color: #0F172A !important;
}

.announcement-date {
  color: #94A3B8 !important;
}

.announcement-des {
  color: #475569 !important;
  line-height: 1.7 !important;
}

.announcement-read-more a {
  color: var(--gold-dark) !important;
  border-bottom-color: var(--gold-bg-30) !important;
}


/* ============================================
   支付弹窗 优化 v1.0
   ============================================ */

.pay-box .modal-content {
  border-radius: var(--r-xl) !important;
  overflow: hidden !important;
}

.pay-type {
  border-radius: var(--r-md) !important;
}

.pay-type i.b2-bank-card-fill {
  color: #22C55E !important;
}

.pay-content {
  padding: 20px 24px !important;
}


/* ============================================
   签到页面 优化 v1.0
   ============================================ */

.user-w-qd-list-title {
  background: linear-gradient(135deg, var(--gold), var(--gold-dark)) !important;
  border-radius: var(--r-md) var(--r-md) 0 0 !important;
}

.task-day-list li {
  transition: background var(--t-fast) !important;
  border-radius: var(--r-sm) !important;
}

.task-day-list li:hover {
  background: #FAFBFC !important;
}

.task-day-list li i {
  color: var(--gold-dark) !important;
}

.task-day-list li .task-finish-icon i {
  background: linear-gradient(135deg, var(--gold), var(--gold-dark)) !important;
  border-radius: 50% !important;
}


/* ============================================
   任务中心/签到页面 优化 v1.0
   ============================================ */

/* --- 任务列表 --- */
.task-day-list li {
  border-radius: var(--r-md) !important;
  padding: 12px 16px !important;
  transition: background var(--t-fast) !important;
}

.task-day-list li:hover {
  background: #FAFBFC !important;
}

.task-day-list li i {
  color: #94A3B8 !important;
  font-size: 18px !important;
}

.task-day-list li .task-finish-icon i {
  background: linear-gradient(135deg, #22C55E, #16A34A) !important;
  color: #fff !important;
  border-radius: 50% !important;
  width: 20px !important;
  height: 20px !important;
  line-height: 20px !important;
  text-align: center !important;
  font-size: 12px !important;
}

/* --- 签到日历 --- */
.user-w-qd-list-title {
  background: linear-gradient(135deg, var(--gold), var(--gold-dark)) !important;
  border-radius: var(--r-md) var(--r-md) 0 0 !important;
  font-weight: 600 !important;
}


/* ============================================
   支付弹窗 优化 v1.0
   ============================================ */

.pay-box .modal-content {
  border-radius: var(--r-xl) !important;
  overflow: hidden !important;
}

.pay-type-list {
  border-radius: var(--r-md) !important;
}

.pay-type-list li {
  border-radius: var(--r-md) !important;
  transition: all var(--t-fast) !important;
}

.pay-type-list li.picked {
  border-color: var(--gold) !important;
  background: var(--gold-bg) !important;
}

.pay-button button {
  border-radius: var(--r-lg) !important;
  font-weight: 600 !important;
  background: linear-gradient(135deg, var(--gold), var(--gold-dark)) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px var(--gold-bg-25) !important;
}

.pay-price {
  color: var(--gold-dark) !important;
  font-weight: 700 !important;
}


/* ============================================
   Misc Pages - Mobile (768px)
   ============================================ */
@media screen and (max-width: 768px) {

  /* 认证 */
  .verify-desc {
    padding: 20px !important;
    font-size: 14px !important;
  }

  .verify-users-title {
    font-size: 17px !important;
  }

  .verify-button button {
    min-height: 44px !important;
    width: 100% !important;
    padding: 12px 24px !important;
    border-radius: var(--r-md) !important;
  }

  /* 海报 */
  .poster-box .modal-content {
    border-radius: var(--r-lg) !important;
    max-width: 95% !important;
  }

  .poster-content {
    flex-direction: column !important;
  }

  .poster-box-left {
    border-radius: var(--r-lg) var(--r-lg) 0 0 !important;
  }

  .poster-box-left .poster-info h2 {
    font-size: 16px !important;
  }

  /* 404 */
  .empty-page {
    padding: 30px 16px !important;
  }

  .empty-page i {
    font-size: 60px !important;
  }

  .empty-page h2 {
    font-size: 16px !important;
  }

  .empty-page .button.text.empty {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  /* 公告 */
  .announcement-box h2.title {
    font-size: 16px !important;
  }

  .announcement-des {
    font-size: 13px !important;
  }

  /* 支付 */
  .pay-box .modal-content {
    border-radius: var(--r-lg) !important;
    max-width: 95% !important;
  }

  .pay-content {
    padding: 16px !important;
  }

  .pay-button button {
    min-height: 44px !important;
    width: 100% !important;
  }

  /* 签到/任务 */
  .task-day-list li {
    padding: 10px 12px !important;
  }

  .user-w-qd-list-title {
    font-size: 14px !important;
  }
}

@media screen and (max-width: 480px) {

  .verify-desc {
    padding: 16px !important;
    font-size: 13px !important;
  }

  .empty-page i {
    font-size: 48px !important;
  }

  .announcement-box h2.title {
    font-size: 14px !important;
  }
}


/* ============================================
   用户设置页面 (users/*/settings) 优化 v1.0
   ============================================ */

/* --- 用户面板头部 --- */
.user-panel {
  border-radius: 0 0 var(--r-xl) var(--r-xl) !important;
  overflow: hidden !important;
}

.user-panel .avatar {
  border: 3px solid #fff !important;
  border-radius: 50% !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
  transition: transform var(--t-fast) !important;
}

.user-panel .avatar:hover {
  transform: scale(1.05) !important;
}

.user-panel .editor-avatar {
  border-radius: 50% !important;
  background: rgba(0,0,0,0.5) !important;
  backdrop-filter: blur(4px) !important;
}

.user-panel-info h1 {
  font-weight: 700 !important;
  color: var(--text-primary) !important;
}

.user-panel-editor-button {
  border-radius: var(--r-md) !important;
  transition: all var(--t-fast) !important;
}

/* --- 用户页面布局 --- */
.author-page {
  gap: 20px !important;
}

.author-page-left {
  min-width: 200px !important;
}

.author-page-right-in.box.b2-radius {
  border-radius: var(--r-lg) !important;
  box-shadow: var(--shadow-sm) !important;
  border: 1px solid var(--border-light) !important;
  overflow: hidden !important;
}

/* --- 左侧导航 --- */
.user-sidebar-info {
  border-radius: var(--r-md) !important;
  padding: 10px 14px !important;
  transition: all var(--t-fast) !important;
  margin-bottom: 2px !important;
}

.user-sidebar-info:hover {
  background: var(--gold-bg-03) !important;
}

.user-sidebar-info.active {
  background: var(--gold-bg) !important;
}

.user-sidebar-info.active p {
  color: var(--gold-dark) !important;
  font-weight: 600 !important;
}

.user-sidebar-info p i {
  font-size: 18px !important;
  width: 24px !important;
  text-align: center !important;
}

/* --- 设置页面主体 --- */
.author-edit-page {
  padding: 24px 28px !important;
}

.author-edit-page h2 {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--text-primary) !important;
  margin-bottom: 4px !important;
}

.author-edit-list {
  margin-top: 16px !important;
}

.author-edit-list > li {
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--border-light) !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
}

.author-edit-list > li:last-child {
  border-bottom: none !important;
}

/* --- 设置项名称 --- */
.edit-name {
  width: 140px !important;
  min-width: 140px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--text-primary) !important;
  padding-top: 8px !important;
}

/* --- 设置项值 --- */
.edit-value {
  flex: 1 !important;
  font-size: 14px !important;
  color: var(--text-secondary) !important;
}

/* --- 输入框 --- */
.edit-input input[type="text"],
.edit-input input[type="password"],
.edit-input textarea {
  width: 100% !important;
  max-width: 360px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--r-md) !important;
  background: #fff !important;
  color: var(--text-primary) !important;
  transition: border-color var(--t-fast), box-shadow var(--t-fast) !important;
}

.edit-input input[type="text"]:focus,
.edit-input input[type="password"]:focus,
.edit-input textarea:focus {
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 3px var(--gold-bg-10) !important;
  outline: none !important;
}

/* --- 编辑按钮 --- */
.user-edit-button {
  font-size: 13px !important;
  color: var(--gold-dark) !important;
  cursor: pointer !important;
  transition: color var(--t-fast) !important;
  padding: 6px 12px !important;
  border-radius: var(--r-sm) !important;
}

.user-edit-button:hover {
  color: var(--gold) !important;
  background: var(--gold-bg) !important;
}

/* --- 头像设置 --- */
.avatar-set {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.avatar-set .avatar {
  border-radius: 50% !important;
  border: 2px solid var(--border) !important;
  transition: border-color var(--t-fast) !important;
}

.avatar-set .avatar:hover {
  border-color: var(--gold) !important;
}

/* --- 性别选择 --- */
.setting-sex {
  display: flex !important;
  gap: 8px !important;
}

.setting-sex label,
.setting-sex button {
  padding: 6px 16px !important;
  border-radius: var(--r-sm) !important;
  font-size: 13px !important;
  transition: all var(--t-fast) !important;
  cursor: pointer !important;
}

/* --- 描述文字 --- */
.setting-des {
  font-size: 12px !important;
  color: var(--text-muted) !important;
  margin-top: 6px !important;
  line-height: 1.5 !important;
}

.setting-des-add {
  font-size: 13px !important;
  color: var(--gold-dark) !important;
  cursor: pointer !important;
  transition: color var(--t-fast) !important;
  margin-top: 8px !important;
}

.setting-des-add:hover {
  color: var(--gold) !important;
}

/* --- 密码修改区域 --- */
.user-setting-password .edit-input {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.reset-pass input {
  max-width: 360px !important;
}

/* --- 验证码 --- */
.user-settings-code {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.user-settings-code input {
  max-width: 200px !important;
}

/* --- 地址列表 --- */
.user-address-list li {
  margin-bottom: 8px !important;
}

.user-address-list .user-address-info {
  font-size: 13px !important;
  border: 1px dashed var(--border) !important;
  border-radius: var(--r-md) !important;
  padding: 10px 14px !important;
  background: #FAFBFC !important;
  transition: border-color var(--t-fast) !important;
}

.user-address-list .user-address-info:hover {
  border-color: var(--gold-bg-30) !important;
}

.address-input input {
  max-width: 100% !important;
}

/* --- 作者统计表格 --- */
.author-table {
  border-radius: var(--r-md) !important;
  overflow: hidden !important;
}

/* --- 关注按钮 --- */
.author-has-follow button {
  border-radius: var(--r-full) !important;
  padding: 6px 20px !important;
  font-size: 13px !important;
  transition: all var(--t-fast) !important;
}


/* --- Settings Mobile (768px) --- */
@media screen and (max-width: 768px) {

  /* 用户页面改为垂直布局 */
  .author-page {
    flex-direction: column !important;
    gap: 12px !important;
  }

  .author-page-left {
    width: 100% !important;
    min-width: unset !important;
  }

  /* 左侧导航改为横向滚动 */
  .author-page-left .user-sidebar {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 4px !important;
    padding: 8px 0 !important;
    scrollbar-width: none !important;
  }

  .author-page-left .user-sidebar::-webkit-scrollbar {
    display: none !important;
  }

  .author-page-left .user-sidebar-info {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    padding: 8px 14px !important;
    border-radius: var(--r-full) !important;
    font-size: 13px !important;
  }

  .author-page-left .user-sidebar-info p {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
  }

  .author-page-left .user-sidebar-info p i {
    font-size: 15px !important;
  }

  /* 设置页面主体 */
  .author-edit-page {
    padding: 16px !important;
  }

  .author-edit-page h2 {
    font-size: 16px !important;
  }

  /* 设置项改为垂直布局 */
  .author-edit-list > li {
    flex-direction: column !important;
    gap: 6px !important;
    padding: 14px 0 !important;
  }

  .edit-name {
    width: 100% !important;
    min-width: unset !important;
    font-size: 13px !important;
    padding-top: 0 !important;
  }

  .edit-value {
    width: 100% !important;
  }

  .edit-input input[type="text"],
  .edit-input input[type="password"],
  .edit-input textarea {
    max-width: 100% !important;
    width: 100% !important;
    font-size: 14px !important;
    min-height: 44px !important;
  }

  .user-settings-code {
    flex-wrap: wrap !important;
  }

  .user-settings-code input {
    max-width: 100% !important;
    width: 100% !important;
  }

  .user-edit-button {
    font-size: 12px !important;
  }

  /* 用户面板 */
  .user-panel .avatar {
    width: 80px !important;
    height: 80px !important;
  }

  .user-panel-info h1 {
    font-size: 18px !important;
  }

  .author-page-right-in.box.b2-radius {
    border-radius: var(--r-md) !important;
  }

  /* 地址输入 */
  .address-input input {
    width: 100% !important;
  }
}

@media screen and (max-width: 480px) {

  .author-edit-page {
    padding: 12px !important;
  }

  .author-edit-page h2 {
    font-size: 15px !important;
  }

  .edit-name {
    font-size: 12px !important;
  }

  .user-panel .avatar {
    width: 64px !important;
    height: 64px !important;
  }

  .user-panel-info h1 {
    font-size: 16px !important;
  }
}