// 右侧属性面板 css 变量
#tiny-right-panel {
  --ti-lowcode-setting-panel-bg-color: var(--ti-lowcode-base-bg-5);
  --ti-lowcode-setting-panel-tabs-item-title-color: var(--ti-lowcode-base-text-color-1);
  --ti-lowcode-setting-panel-tabs-item-title-active-color: var(--ti-lowcode-base-text-color);
  --ti-lowcode-setting-panel-tabs-item-title-hover-color: var(--ti-lowcode-base-text-color);
  // 插件设置面板左侧边框
  --ti-lowcode-plugin-setting-panel-border-left-color: var(--ti-lowcode-common-border-color-4);
}

// 属性面板-属性-区块关联属性-新建区块属性popover
.block-new-attr-popover {
  --ti-lowcode-attr-popover-menu-item-hover-bg-color: var(--ti-lowcode-base-bg-1);
  --ti-lowcode-attr-popover-menu-item-link-item-bg-color: var(--ti-lowcode-base-primary-color-2);
  --ti-lowcode-attr-popover-menu-item-link-item-color: var(--ti-lowcode-base-gray-0);
  --ti-lowcode-attr-popover-menu-item-color: var(--ti-lowcode-base-text-color);
}

// 属性面板-属性-区块关联属性 icon
.block-link-field {
  --ti-lowcode-block-link-field-link-icon-color: var(--ti-lowcode-base-gray-0);
  --ti-lowcode-block-link-field-link-icon-bg-color: var(--ti-lowcode-base-success-color);
}

.className-container {
  --ti-lowcode-className-selector-container-color: var(--ti-lowcode-base-text-color);
  --ti-lowcode-className-selector-container-error-border-color: var(--ti-lowcode-base-error-color);
  --ti-lowcode-className-selector-container-error-bg-color: rgba(242, 48, 48, 0.1);
  --ti-lowcode-className-selector-error-tips-color: var(--ti-lowcode-base-error-color);
  --ti-lowcode-className-selector-container-border-color: var(--ti-lowcode-base-gray-40);
  --ti-lowcode-className-selector-container-hover-border-color: var(--ti-lowcode-base-gray-90);
  --ti-lowcode-className-selector-container-empty-tips-color: var(--ti-lowcode-base-text-color-1);
  --ti-lowcode-className-selector-container-label-bg-color: rgba(20, 118, 255, 0.1);
  --ti-lowcode-className-selector-container-label-color: var(--ti-lowcode-base-primary-color-2);
  --ti-lowcode-className-selector-container-option-btn-color: var(--ti-lowcode-base-primary-color-2);
  --ti-lowcode-className-selector-dropdown-list-bg-color: var(--ti-lowcode-base-gray-0);
  --ti-lowcode-className-selector-dropdown-list-item-color: var(--ti-lowcode-base-text-color);
  --ti-lowcode-className-selector-dropdown-list-item-active-bg-color: var(--ti-lowcode-base-gray-20);
  --ti-lowcode-className-selector-title-color: var(--ti-lowcode-base-text-color);
  --ti-lowcode-className-selector-dropdown-list-tips-color: var(--ti-lowcode-base-text-color-3);
}

:root {
  --ti-lowcode-className-selector-del-popover-bg-color: var(--ti-lowcode-base-bg-5);
  --ti-lowcode-className-selector-del-popover-title-color: var(--ti-lowcode-base-text-color);
}
