
/**
 * Ant Design CSS Override
 */
@import '~antd/lib/tree/style/index';

@import '../../index';
@import '../../../../mixins/index';

 @import "./mixin.less";

 @ps-tree-prefix-cls: ~"@{polestar-prefix}-tree";
 @tree-showline-icon-color: @text-color;
 
 @keyframes spin {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
   }
   100% {
     -webkit-transform: rotate(0deg);
     transform: rotate(359deg);
     }
 }
 
 .@{ps-tree-prefix-cls}-container {
   display: flex;
   flex-direction: column;
   .@{ps-tree-prefix-cls}-header {
     display: flex;
     .@{ant-prefix}-input-suffix {
       i {
         cursor: pointer;
       }
     }
   }
   .@{tree-prefix-cls} {
     overflow: auto;
     li {
       padding: 0;
       &.@{tree-prefix-cls}-treenode-loading {
         span {
           &.@{tree-prefix-cls}-switcher {
             &.@{tree-prefix-cls}-switcher_open,
             &.@{tree-prefix-cls}-switcher_close {
               top: 11px !important;
             }
           }
         }
       }
       .@{tree-prefix-cls}-node-content-wrapper {
         color: @gray-9;
         font-size: @font-size-base;
       }
       span {
         &.@{tree-prefix-cls}-switcher {
           line-height: 22px;
           &.@{tree-prefix-cls}-switcher-noop {
             cursor: default;
           }
           &.@{tree-prefix-cls}-switcher_open {
             .antTreeSwitcherIcon();
           }
           &.@{tree-prefix-cls}-switcher_close {
             .antTreeSwitcherIcon();
             &:after {
               transform: rotate(270deg) scale(1);
             }
           }
         }
         svg {
           display: none;
         }
       }
       // When node is loading
       &.@{tree-prefix-cls}-treenode-loading {
         span {
           &.@{tree-prefix-cls}-switcher {
             &.@{tree-prefix-cls}-switcher_open,
             &.@{tree-prefix-cls}-switcher_close {
               .@{tree-prefix-cls}-switcher-loading-icon {
                 width: 14px;
                 height: 5px;
                 top: 0;
                 left: 6px;
                 .antTreeSwitcherIcon("tree-loading-icon");
                 animation: spin 1.5s linear infinite;
               }
             }
           }
         }
       }
     }
     .@{tree-prefix-cls}-node-content-wrapper {
         font-size: @font-size-sm;
       &:hover {
         color: @primary-color;
         padding: 0 3px;
       }
     }
 
     li {
       .@{tree-prefix-cls}-node-content-wrapper{
         padding: 0;
       }
     }
   }
   .@{ps-tree-prefix-cls}-show-plus {
     li {
       span {
         &.@{tree-prefix-cls}-switcher {
           &.@{tree-prefix-cls}-switcher_open {
             .antTreeSwitcherIcon("tree-minus-icon");
           }
           &.@{tree-prefix-cls}-switcher_close {
             .antTreeSwitcherIcon("tree-plus-icon");
           }
         }
       }
     }
   }

   .tree-loading {
     padding-left: 10px;
     padding-top: 10px;

     margin: 0;
      // padding: 0;
      display: flex;
      // justify-content: center;
      // align-items: center;
      color: @primary-6;
      font-size: @font-size-base;
      &:before {
        font-family: "polestar";
        content: '\E263';
        margin: 0 5px 0 0;
        animation-name: spin;
        animation-duration: 2000ms;
        animation-iteration-count: infinite;
        animation-timing-function: linear;
      }

   }
 }
 
 .ant-tree.ant-tree-directory {
  .ant-tree-switcher.ant-tree-switcher_close::after {
    display: none;
  }
  .ant-tree-switcher.ant-tree-switcher_open::after {
    display: none;
  }
}
