/* ==========================================================================
   Redot Refine — 组件状态 / 动效 / 一致性规范层
   在 redot-home.css 之后加载，依据 kimi-design-skill：
   - Components Are Contracts：补齐 hover / pressed / focus-visible / disabled
   - Surface Over Stroke：状态与选中用填充表达，控件去描边
   - Purposeful Motion：仅 transform/opacity，ease-out，press 0.97
   - 对齐 design/ 截图：底栏激活为品牌红、灰色控件无描边
   ========================================================================== */

body.redot-home {
  -webkit-tap-highlight-color: transparent;
}

/* —— 键盘焦点：统一可见焦点环（principle 6：focus-visible） —— */
body.redot-home a:focus-visible,
body.redot-home button:focus-visible,
body.redot-home [role="button"]:focus-visible {
  outline: 2px solid var(--k-accent);
  outline-offset: 2px;
  border-radius: var(--k-radius-sm);
}

/* ========== 顶栏 ========== */

body.redot-home .redot-topbar {
  z-index: var(--k-z-header);
}

body.redot-home .redot-icon-btn {
  transition: background-color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

@media (hover: hover) and (pointer: fine) {
  body.redot-home .redot-icon-btn:hover {
    background: var(--k-fill-f2);
  }
}

body.redot-home .redot-icon-btn:active {
  transform: scale(var(--k-press-scale));
  background: var(--k-fill-f2-active);
}

/* ========== 总资产 ========== */

body.redot-home .redot-assets-amount {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

body.redot-home .redot-eye {
  transition: color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

body.redot-home .redot-eye:active {
  transform: scale(var(--k-press-scale));
}

/* ========== 快捷操作：Surface Over Stroke —— 去描边，纯填充 ========== */

body.redot-home .redot-quick-icon {
  border: 0;
  background: var(--k-fill-f2);
  transition: background-color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

body.redot-home .redot-quick-item {
  font-size: var(--k-fs-c1);
  font-weight: 500;
}

@media (hover: hover) and (pointer: fine) {
  body.redot-home .redot-quick-item:hover .redot-quick-icon {
    background: var(--k-fill-f2-hover);
  }

  body.redot-home .redot-quick-item.is-primary:hover .redot-quick-icon {
    background: var(--k-ink-strong-hover);
  }
}

body.redot-home .redot-quick-item:active .redot-quick-icon {
  transform: scale(var(--k-press-scale));
  background: var(--k-fill-f2-active);
}

body.redot-home .redot-quick-item.is-primary:active .redot-quick-icon {
  background: var(--k-ink-strong-active);
}

/* ========== Banner / Promo ========== */

body.redot-home .redot-banner {
  border-radius: var(--k-radius-xl);
  transition: transform var(--k-dur-press) var(--k-ease-out);
}

body.redot-home .redot-banner:active {
  transform: scale(0.98);
}

body.redot-home .redot-promo {
  border-radius: var(--k-radius-xl);
}

body.redot-home .redot-promo-cta {
  transition: background-color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

body.redot-home .redot-promo-cta:active {
  transform: scale(var(--k-press-scale));
}

/* ========== 通用行：列表 / 交易 / 菜单 / 持币 —— 按下反馈 ========== */

body.redot-home .redot-tx-row,
body.redot-home .redot-list-row,
body.redot-home .redot-menu-row,
body.redot-home .redot-asset-row {
  border-bottom-color: var(--k-hairline);
  border-radius: var(--k-radius-lg);
  margin: 0 -10px;
  padding-left: 12px;
  padding-right: 12px;
  transition: background-color var(--k-dur-hover) ease;
}

@media (hover: hover) and (pointer: fine) {
  body.redot-home a.redot-tx-row:hover,
  body.redot-home a.redot-list-row:hover,
  body.redot-home a.redot-menu-row:hover,
  body.redot-home a.redot-asset-row:hover {
    background: var(--k-fill-f1);
    opacity: 1; /* 覆盖 redot-home.css 的 0.92 透明度 hover */
  }
}

body.redot-home a.redot-tx-row:active,
body.redot-home a.redot-list-row:active,
body.redot-home a.redot-menu-row:active,
body.redot-home a.redot-asset-row:active {
  background: var(--k-fill-f1-hover);
}

/* 行内排版对齐令牌：标题 b1Emphasized，元信息 c1 */
body.redot-home .redot-tx-title,
body.redot-home .redot-list-title {
  font-size: var(--k-fs-b1);
  font-weight: 500;
}

body.redot-home .redot-tx-time,
body.redot-home .redot-list-sub,
body.redot-home .redot-tx-status {
  font-size: var(--k-fs-c1);
}

/* ========== 状态色统一（tokens status.*） ========== */

body.redot-home .redot-tx-status.is-credit,
body.redot-home .redot-tx-status.is-success {
  color: var(--k-success);
}

body.redot-home .redot-tx-status.is-fail {
  color: var(--k-danger);
}

body.redot-home .redot-tx-status.is-pending {
  color: var(--k-warning);
}

body.redot-home .redot-tx-status.is-debit,
body.redot-home .redot-tx-status.is-cancel {
  color: var(--k-label-3);
}

body.redot-home .redot-alert--ok {
  background: var(--k-success-tint);
  color: var(--k-success);
}

body.redot-home .redot-alert--err {
  background: var(--k-danger-tint);
  color: var(--k-danger);
}

body.redot-home .redot-badge-ok {
  background: var(--k-success-tint);
  color: var(--k-success);
  font-size: var(--k-fs-c1);
  border-radius: var(--k-radius-xxs);
}

body.redot-home .redot-pending-badge {
  background: var(--k-warning-tint);
  color: var(--k-warning-ink);
  font-size: var(--k-fs-c1);
}

body.redot-home .redot-bill-detail-amount.is-credit {
  color: var(--k-success);
}

body.redot-home .redot-bill-detail-amount.is-debit {
  color: var(--k-danger);
}

body.redot-home .redot-bill-detail-amount.is-neutral {
  color: var(--k-label-3);
}

body.redot-home .redot-tx-amt.is-credit {
  color: var(--k-success);
}

body.redot-home .redot-tx-amt.is-debit {
  color: var(--k-danger);
}

body.redot-home .redot-tx-amt.is-neutral {
  color: var(--k-label-3);
}

/* ========== 操作胶囊（资产页 Add funds / Earn / Credit） ========== */

body.redot-home .redot-pill {
  border: 0;
  background: var(--k-fill-f2);
  font-size: var(--k-fs-b2);
  border-radius: var(--k-radius-lg);
  transition: background-color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

body.redot-home .redot-pill--dark,
body.redot-home .redot-pill--dark:hover,
body.redot-home .redot-pill--dark:focus {
  background: var(--k-ink-strong);
  color: var(--k-bg);
}

@media (hover: hover) and (pointer: fine) {
  body.redot-home .redot-pill:hover {
    background: var(--k-fill-f2-hover);
  }

  body.redot-home .redot-pill--dark:hover {
    background: var(--k-ink-strong-hover);
  }
}

body.redot-home .redot-pill:active {
  transform: scale(var(--k-press-scale));
  background: var(--k-fill-f2-active);
}

body.redot-home .redot-pill--dark:active {
  background: var(--k-ink-strong-active);
}

/* ========== 页签（Crypto / Fiat 下划线页签） ========== */

body.redot-home .redot-asset-tabs {
  border-bottom-color: var(--k-hairline);
}

body.redot-home .redot-asset-tab {
  transition: color var(--k-dur-hover) ease;
}

/* ========== 主按钮（提交 / dark / credit CTA）：完整状态契约 ========== */

body.redot-home .redot-submit,
body.redot-home .btn-dark,
body.redot-home .btn.btn-dark,
body.redot-home .redot-credit-cta {
  transition: background-color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

@media (hover: hover) and (pointer: fine) {
  body.redot-home .redot-submit:hover,
  body.redot-home .btn-dark:hover,
  body.redot-home .btn.btn-dark:hover {
    background: var(--k-ink-strong-hover);
  }
}

body.redot-home .redot-submit:active,
body.redot-home .btn-dark:active,
body.redot-home .btn.btn-dark:active,
body.redot-home .redot-credit-cta:active {
  transform: scale(var(--k-press-scale));
}

body.redot-home .redot-submit:disabled,
body.redot-home .btn-dark:disabled,
body.redot-home .btn:disabled {
  background: var(--k-fill-f2);
  color: var(--k-label-4) !important;
  border-color: transparent;
  cursor: not-allowed;
  transform: none;
}

/* ghost / light 次要按钮 */
body.redot-home .redot-submit--ghost,
body.redot-home .btn-light,
body.redot-home .btn.btn-light,
body.redot-home .redot-credit-cta {
  border: 0;
  background: var(--k-fill-f2);
  transition: background-color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

@media (hover: hover) and (pointer: fine) {
  body.redot-home .redot-submit--ghost:hover,
  body.redot-home .btn-light:hover,
  body.redot-home .btn.btn-light:hover,
  body.redot-home .redot-credit-cta:hover {
    background: var(--k-fill-f2-hover);
  }
}

/* btn-primary = 品牌红 */
body.redot-home .btn-primary {
  transition: background-color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

@media (hover: hover) and (pointer: fine) {
  body.redot-home .btn-primary:hover {
    background: var(--k-accent-hover);
    border-color: var(--k-accent-hover);
  }
}

body.redot-home .btn-primary:active {
  background: var(--k-accent-active);
  border-color: var(--k-accent-active);
  transform: scale(var(--k-press-scale));
}

/* ========== 表单：focus 用中性深色边 + 轻填充环（Quiet Utility） ========== */

body.redot-home .form-control:focus,
body.redot-home .form-select:focus,
body.redot-home .form-floating > .form-control:focus,
body.redot-home .form-floating > .form-select:focus {
  background: var(--k-bg);
  border-color: rgba(0, 0, 0, 0.25); /* fills.f4 */
  box-shadow: 0 0 0 3px var(--k-fill-f2) !important;
}

body.redot-home .form-control:disabled,
body.redot-home .form-select:disabled {
  background: var(--k-fill-f1);
  color: var(--k-label-4);
}

/* ========== 悬浮底栏：信息蓝激活（产品决策） ========== */

body.redot-home .redot-tabbar,
.redot-tabbar {
  z-index: var(--k-z-header);
  box-shadow: var(--k-shadow-tabbar);
}

body.redot-home .redot-tab-inner,
.redot-tab-inner {
  transition: background-color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out),
    color var(--k-dur-hover) ease;
}

body.redot-home .redot-tab:active .redot-tab-inner,
.redot-tab:active .redot-tab-inner {
  transform: scale(var(--k-press-scale));
}

body.redot-home .redot-tab.is-active,
.redot-tab.is-active {
  color: var(--k-info);
}

body.redot-home .redot-tab.is-active .redot-tab-inner,
.redot-tab.is-active .redot-tab-inner {
  background: var(--k-info-tint);
}

/* ========== 虚拟卡：去掉无限装饰动画，保留按压反馈 ========== */

body.redot-home a.redot-vcard {
  animation: none; /* Purposeful Motion：去除 zoombg 无限背景动画 */
  border-radius: var(--k-radius-xl);
  transition: transform var(--k-dur-hover) var(--k-ease-out),
    box-shadow var(--k-dur-hover) var(--k-ease-out);
}

@media (hover: hover) and (pointer: fine) {
  body.redot-home a.redot-vcard:hover {
    transform: translateY(-2px);
    box-shadow: var(--k-shadow-small),
      inset 0 1px 0 rgba(255, 255, 255, 0.18);
  }
}

body.redot-home a.redot-vcard:active {
  transform: scale(0.98);
}

/* ========== 骨架层级 ========== */

body.redot-home .redot-skeleton,
.redot-skeleton {
  z-index: var(--k-z-skeleton);
}

/* ========== 转账方式 chips：选中用填充表达 ========== */

body.redot-home .redot-transfer-method-tab {
  border: 0;
  background: var(--k-fill-f2);
  color: var(--k-label-2);
  transition: background-color var(--k-dur-hover) ease,
    color var(--k-dur-hover) ease,
    transform var(--k-dur-press) var(--k-ease-out);
}

body.redot-home .redot-transfer-method-tab.is-active {
  background: var(--k-accent-tint);
  color: var(--k-accent);
}

body.redot-home .redot-transfer-method-tab:active {
  transform: scale(var(--k-press-scale));
}

/* ========== 空状态 ========== */

body.redot-home .redot-empty {
  font-size: var(--k-fs-b2);
  color: var(--k-label-3);
}

/* ========== 动效可达性：减少动态偏好 ========== */

@media (prefers-reduced-motion: reduce) {
  body.redot-home *,
  body.redot-home *::before,
  body.redot-home *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
