:root,
html {
  --wot-color-theme: rgba(var(--primary-color-500), 1);

  --safe-top: var(--status-bar-height);
  --safe-bottom: env(safe-area-inset-bottom);

  --tmc: #f8b932;
  --bmc: #f8b932;
  --b21: #212121;
  --tc: #9ca3af;

}

/* 主要文字颜色 */
.tmc{
  color: #f8b932;
}

/* 主要背景颜色 */
.bmc{
  background: #f8b932;
}

/* 背景颜色 */
.b21{
  background: #212121;
}

/* 文字颜色 */
.tc{
  color: #9ca3af;
}

.header-left {
  display: flex;
  align-items: center;

  .back-action {
    display: flex;
    align-items: center;
    cursor: pointer;
    color: var(--el-text-color-regular);
    font-size: 14px;
    transition: color 0.2s;

    .el-icon {
      font-size: 16px;
      margin-right: 4px;
    }

    &:hover {
      color: #f8b932;
    }
  }

  :deep(.header-divider) {
    margin: 0 16px;
    height: 1em;
  }

  .title-line {
    display: flex;
    align-items: center;
    .decorate-bar {
      width: 4px;
      height: 16px;
      border-radius: 2px;
      margin-right: 10px;
      background-color: #f8b932;
    }
    .title-text {
      font-size: 16px;
      font-weight: bold;
      color: var(--el-text-color-primary);
    }
  }
}
