npm - @blueking/date-picker - Versions diffs - 2.0.0-beta.9 → 3.0.0-beta.1 - Mend

@blueking/date-picker 2.0.0-beta.9 → 3.0.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (39) hide show

package/README.md +15 -10
package/package.json +14 -79
package/typings/components/baseline-select.vue.d.ts +12 -0
package/typings/components/common-submit.vue.d.ts +10 -19
package/typings/components/common-tab.vue.d.ts +10 -14
package/typings/components/date-list.vue.d.ts +15 -0
package/typings/components/date-panel.vue.d.ts +9 -28
package/typings/components/date-picker.vue.d.ts +8 -15
package/typings/components/date-title.vue.d.ts +6 -0
package/typings/components/natural-picker.vue.d.ts +6 -13
package/typings/components/panel-wrapper.vue.d.ts +12 -21
package/typings/components/recent-picker.vue.d.ts +10 -28
package/typings/components/timezone-picker.vue.d.ts +14 -19
package/typings/date-picker.vue.d.ts +21 -44
package/typings/hooks/use-keydown-enter.d.ts +1 -0
package/typings/hooks/use-validate.d.ts +17 -0
package/typings/lang/lang.d.ts +14 -4
package/typings/utils/constant.d.ts +8 -5
package/typings/utils/cookie.d.ts +4 -0
package/typings/utils/date.d.ts +38 -15
package/typings/utils/duration.d.ts +5 -0
package/typings/utils/index.d.ts +4 -3
package/typings/utils/provider.d.ts +20 -0
package/typings/utils/store.d.ts +1 -1
package/typings/utils/timezone.d.ts +4 -4
package/typings/utils/types.d.ts +22 -14
package/typings/vue2.d.ts +4 -30
package/typings/vue3.d.ts +7 -2
package/vue2/config.json +1 -1
package/vue2/index.es.min.js +25195 -18809
package/vue2/index.iife.min.js +36661 -76
package/vue2/index.umd.min.js +29072 -57
package/vue2/vue2.css +3520 -1
package/vue3/config.json +1 -1
package/vue3/index.es.min.js +2954 -1717
package/vue3/index.iife.min.js +29559 -57
package/vue3/index.umd.min.js +4551 -2
package/vue3/vue3.css +796 -1
package/typings/utils/utils.d.ts +0 -15

package/vue2/vue2.css CHANGED Viewed

@@ -1 +1,3520 @@
-.scroll-bar-style::-webkit-scrollbar{width:4px;height:4px}.scroll-bar-style::-webkit-scrollbar-thumb{background:#ddd;border-radius:20px;box-shadow:inset 0 0 6px #cccccc4d}html,body{padding:0;margin:0}*,*:before,*:after{box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{height:0;box-sizing:content-box}button,input,optgroup,select,textarea{margin:0;font:inherit;color:inherit}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button;-moz-appearance:button;appearance:button}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input[type=checkbox],input[type=radio]{padding:0;box-sizing:border-box}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}::-ms-clear,::-ms-reveal{display:none}input[type=text]::-ms-clear{display:none}input[type=text]::-ms-reveal{display:none}input[type=search]{box-sizing:content-box;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none;-moz-appearance:none;appearance:none}fieldset{padding:.35em .625em .75em;margin:0 2px;border:1px solid #c0c0c0}legend{padding:0;border:0}textarea{overflow:auto}optgroup{font-weight:700}.bk-scroll-y{overflow-y:auto}.bk-scroll-y::-webkit-scrollbar{width:4px;height:4px}.bk-scroll-y::-webkit-scrollbar-thumb{background:#ddd;border-radius:20px;box-shadow:inset 0 0 6px #cccccc4d}.bk-scroll-x{overflow-x:auto}.bk-scroll-x::-webkit-scrollbar{width:4px;height:4px}.bk-scroll-x::-webkit-scrollbar-thumb{background:#ddd;border-radius:20px;box-shadow:inset 0 0 6px #cccccc4d}.time-range-button{display:inline-flex;height:32px;padding:0 14px;font-size:14px;color:#63656e;text-decoration:none;white-space:nowrap;cursor:pointer;background-color:#fff;border:1px solid #c4c6cc;border-radius:2px;outline:none;box-sizing:border-box;transition:background-color ease .3s;-webkit-appearance:none;-moz-appearance:none;appearance:none;align-items:center;justify-content:center}.time-range-button.time-range-button-primary{background-color:#3a84ff;color:#fff;border-color:#3a84ff}.time-range-button.time-range-button-primary:hover{background-color:#5594fa;border-color:#5594fa}.time-range-button.time-range-button-primary:active{background-color:#2c77f4;border-color:#2c77f4;color:#fff}.time-range-button.time-range-button-primary.is-outline{color:#3a84ff;border-color:#3a84ff;background-color:#fff}.time-range-button.time-range-button-primary.is-outline:hover{background-color:#5594fa;border-color:#5594fa;color:#fff}.time-range-button.time-range-button-primary.is-outline:active{background-color:#2c77f4;border-color:#2c77f4;color:#fff}.time-range-button.time-range-button-primary.is-text{color:#3a84ff;background-color:transparent;border:none}.time-range-button.time-range-button-primary.is-text:not(.is-disabled):hover{color:#5594fa}.time-range-button.time-range-button-primary.is-disabled{color:#dcdee5;cursor:not-allowed}.time-range-button.time-range-button-primary.is-disabled:not(.is-text){background-color:#dcdee5;color:#fff;border-color:#dcdee5}.time-range-button.time-range-button-hover-primary:hover{background-color:#5594fa;border-color:#5594fa;color:#fff}.time-range-button.time-range-button-warning{background-color:#ff9c01;color:#fff;border-color:#ff9c01}.time-range-button.time-range-button-warning:hover{background-color:#ffb848;border-color:#ffb848}.time-range-button.time-range-button-warning:active{background-color:#eb9000;border-color:#eb9000;color:#fff}.time-range-button.time-range-button-warning.is-outline{color:#ff9c01;border-color:#ff9c01;background-color:#fff}.time-range-button.time-range-button-warning.is-outline:hover{background-color:#ffb848;border-color:#ffb848;color:#fff}.time-range-button.time-range-button-warning.is-outline:active{background-color:#eb9000;border-color:#eb9000;color:#fff}.time-range-button.time-range-button-warning.is-text{color:#ff9c01;background-color:transparent;border:none}.time-range-button.time-range-button-warning.is-text:not(.is-disabled):hover{color:#ffb848}.time-range-button.time-range-button-warning.is-disabled{color:#dcdee5;cursor:not-allowed}.time-range-button.time-range-button-warning.is-disabled:not(.is-text){background-color:#dcdee5;color:#fff;border-color:#dcdee5}.time-range-button.time-range-button-hover-warning:hover{background-color:#ffb848;border-color:#ffb848;color:#fff}.time-range-button.time-range-button-success{background-color:#2dcb56;color:#fff;border-color:#2dcb56}.time-range-button.time-range-button-success:hover{background-color:#45e35f;border-color:#45e35f}.time-range-button.time-range-button-success:active{background-color:#1ab943;border-color:#1ab943;color:#fff}.time-range-button.time-range-button-success.is-outline{color:#2dcb56;border-color:#2dcb56;background-color:#fff}.time-range-button.time-range-button-success.is-outline:hover{background-color:#45e35f;border-color:#45e35f;color:#fff}.time-range-button.time-range-button-success.is-outline:active{background-color:#1ab943;border-color:#1ab943;color:#fff}.time-range-button.time-range-button-success.is-text{color:#2dcb56;background-color:transparent;border:none}.time-range-button.time-range-button-success.is-text:not(.is-disabled):hover{color:#45e35f}.time-range-button.time-range-button-success.is-disabled{color:#dcdee5;cursor:not-allowed}.time-range-button.time-range-button-success.is-disabled:not(.is-text){background-color:#dcdee5;color:#fff;border-color:#dcdee5}.time-range-button.time-range-button-hover-success:hover{background-color:#45e35f;border-color:#45e35f;color:#fff}.time-range-button.time-range-button-danger{background-color:#ea3636;color:#fff;border-color:#ea3636}.time-range-button.time-range-button-danger:hover{background-color:#ff5656;border-color:#ff5656}.time-range-button.time-range-button-danger:active{background-color:#db2626;border-color:#db2626;color:#fff}.time-range-button.time-range-button-danger.is-outline{color:#ea3636;border-color:#ea3636;background-color:#fff}.time-range-button.time-range-button-danger.is-outline:hover{background-color:#ff5656;border-color:#ff5656;color:#fff}.time-range-button.time-range-button-danger.is-outline:active{background-color:#db2626;border-color:#db2626;color:#fff}.time-range-button.time-range-button-danger.is-text{color:#ea3636;background-color:transparent;border:none}.time-range-button.time-range-button-danger.is-text:not(.is-disabled):hover{color:#ff5656}.time-range-button.time-range-button-danger.is-disabled{color:#dcdee5;cursor:not-allowed}.time-range-button.time-range-button-danger.is-disabled:not(.is-text){background-color:#dcdee5;color:#fff;border-color:#dcdee5}.time-range-button.time-range-button-hover-danger:hover{background-color:#ff5656;border-color:#ff5656;color:#fff}.time-range-button.time-range-button-small{height:26px;padding:0 12px;font-size:12px}.time-range-button.time-range-button-large{height:40px;padding:0 16px;font-size:16px}.time-range-button .time-range-button-text{display:inline-flex;align-items:center;line-height:1}.time-range-button.is-loading{position:relative}.time-range-button.is-loading .time-range-button-loading:not(:last-child){position:absolute}.time-range-button.is-loading .time-range-button-text{visibility:hidden}.time-range-button:hover{border-color:#979ba5}.time-range-button:active{color:#3a84ff;border-color:#3a84ff}.time-range-button.is-text{height:auto;padding:0;font-size:inherit;color:#63656e;text-decoration:none;cursor:pointer;background-color:transparent;border:none;outline:none}.time-range-button.is-disabled{color:#dcdee5;cursor:not-allowed;border-color:#dcdee5}.time-range-button.is-disabled:not(.is-text){background-color:#f9fafd}.time-range-button-group{display:inline-block;font-size:0}.time-range-button-group.time-range-button-group-small .time-range-button{height:26px;padding:0 12px;font-size:12px}.time-range-button-group.time-range-button-group-large .time-range-button{height:40px;padding:0 16px;font-size:16px}.time-range-button-group .time-range-button{height:32px;margin:0 0 0 -1px;border-radius:0}.time-range-button-group .time-range-button:not(.is-disabled){color:#63656e;background-color:#fff;border-color:#c4c6cc}.time-range-button-group .time-range-button.is-disabled{color:#c4c6cc}.time-range-button-group .time-range-button:first-child{border-radius:2px 0 0 2px}.time-range-button-group .time-range-button:last-child{border-radius:0 2px 2px 0}.time-range-button-group .time-range-button:only-child{border-radius:2px}.time-range-button-group .time-range-button:hover:not(.is-disabled),.time-range-button-group .time-range-button.is-selected:not(.is-disabled){position:relative;z-index:1;color:#3a84ff;background-color:#fff;border-color:#3a84ff}.time-range-button-group .time-range-button.is-selected:not(.is-disabled){background-color:#e1ecff}.time-range-button-group .time-range-button.is-selected.is-disabled{background-color:#f0f1f5}.time-range-loading-wrapper{position:static;vertical-align:middle}.time-range-loading-wrapper:not(.time-range-nested-loading):not(.time-range-directive-loading){display:inline-flex}.time-range-loading-wrapper.time-range-directive-loading{width:100%;height:100%}.time-range-loading-wrapper.time-range-directive-loading,.time-range-loading-wrapper.time-range-nested-loading{position:relative}.time-range-loading-wrapper.time-range-directive-loading.is-block,.time-range-loading-wrapper.time-range-nested-loading.is-block{display:block}.time-range-loading-wrapper.time-range-directive-loading .time-range-loading-indicator,.time-range-loading-wrapper.time-range-nested-loading .time-range-loading-indicator{position:absolute;top:50%;left:50%;z-index:11;text-align:center;transform:translate(-50%,-50%)}.time-range-loading-wrapper .dot{display:inline-flex;width:14px;height:14px;margin-right:10px;border-radius:50%;transform:scale(.6);animation-duration:.8s;animation-iteration-count:infinite;animation-name:loading-scale-animate;animation-direction:normal}.time-range-loading-wrapper .oval{position:absolute;width:6px;height:8px;background-color:#63656e;border-radius:8px;animation-duration:1.2s;animation-iteration-count:infinite;animation-name:fade;transform-origin:center 24px}.time-range-loading-wrapper .time-range-loading-mask{position:absolute;top:0;left:0;width:100%;height:100%}.time-range-loading-wrapper .time-range-loading-indicator{display:flex;line-height:1;text-align:center;flex-direction:column}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .oval,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot-1,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot-2,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot-3,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot-4{background-color:#2dcb56}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .oval,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot-1,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot-2,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot-3,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot-4{background-color:#ea3636}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .oval,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot-1,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot-2,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot-3,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot-4{background-color:#ff9c01}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .oval,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot-1,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot-2,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot-3,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot-4{background-color:#3a84ff}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .oval,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot-1,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot-2,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot-3,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot-4{background-color:#fff}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .oval,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot-1,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot-2,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot-3,.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot-4{background-color:#c4c6cc}.time-range-loading-wrapper .time-range-loading-indicator .dot-1{background-color:#ea3636;animation-delay:.1s}.time-range-loading-wrapper .time-range-loading-indicator .dot-2{background-color:#ff9c01;animation-delay:.25s}.time-range-loading-wrapper .time-range-loading-indicator .dot-3{background-color:#2dcb56;animation-delay:.4s}.time-range-loading-wrapper .time-range-loading-indicator .dot-4{background-color:#3a84ff;animation-delay:.55s;margin-right:0}.time-range-loading-wrapper .time-range-loading-indicator .oval-1{transform:rotate(135deg);animation-delay:-.45s}.time-range-loading-wrapper .time-range-loading-indicator .oval-2{transform:rotate(90deg);animation-delay:-.6s}.time-range-loading-wrapper .time-range-loading-indicator .oval-3{transform:rotate(45deg);animation-delay:-.75s}.time-range-loading-wrapper .time-range-loading-indicator .oval-4{transform:rotate(0);animation-delay:-.9s}.time-range-loading-wrapper .time-range-loading-indicator .oval-5{transform:rotate(-45deg);animation-delay:-1.05s}.time-range-loading-wrapper .time-range-loading-indicator .oval-6{transform:rotate(-90deg);animation-delay:-1.2s}.time-range-loading-wrapper .time-range-loading-indicator .oval-7{transform:rotate(-135deg);animation-delay:-1.35s}.time-range-loading-wrapper .time-range-loading-indicator .oval-8{transform:rotate(-180deg);animation-delay:-1.5s}.time-range-loading-wrapper .time-range-loading-indicator .time-range-normal-indicator{display:inline-flex;justify-content:center}.time-range-loading-wrapper .time-range-loading-indicator .time-range-spin-indicator{position:relative;display:inline-flex;justify-content:center;width:48px;height:48px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .time-range-spin-indicator{height:16px;width:16px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .dot{width:3px;height:3px;margin-right:3px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .dot.dot-4{margin-right:0}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .oval{width:2px;height:3px;border-radius:3px;transform-origin:center 8px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .time-range-loading-title{font-size:14px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .time-range-spin-indicator{height:32px;width:32px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .dot{width:6px;height:6px;margin-right:6px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .dot.dot-4{margin-right:0}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .oval{width:4px;height:5px;border-radius:5px;transform-origin:center 16px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .time-range-loading-title{font-size:12px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .time-range-spin-indicator{height:68px;width:68px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .dot{width:20px;height:20px;margin-right:12px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .dot.dot-4{margin-right:0}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .oval{width:8px;height:12px;border-radius:12px;transform-origin:center 34px}.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .time-range-loading-title{font-size:14px}.time-range-loading-wrapper .time-range-loading-indicator .time-range-loading-title{margin-top:8px;font-size:14px;line-height:normal;color:#63656e;text-align:center}.clearfix-style:after{display:block;height:0;clear:both;font-size:0;content:"";visibility:hidden}.time-range-popper{display:none;padding:7px 14px;font-size:12px;color:#fff;background:#333;border-radius:4px}.time-range-popper.light{color:#63656e;background:#fff;box-shadow:#dcdee5 0 0 6px}.time-range-popper .time-range-popper-arrow,.time-range-popper .time-range-popper-arrow:before{position:absolute;width:8px;height:8px;background:inherit}.time-range-popper .time-range-popper-arrow{visibility:hidden}.time-range-popper .time-range-popper-arrow:before{content:"";visibility:visible;transform:rotate(45deg)}.time-range-popper[data-show]{display:block}.time-range-popper[data-popper-placement^=top]>.time-range-popper-arrow{bottom:-4px}.time-range-popper[data-popper-placement^=bottom]>.time-range-popper-arrow{top:-4px}.time-range-popper[data-popper-placement^=left]>.time-range-popper-arrow{right:-4px}.time-range-popper[data-popper-placement^=right]>.time-range-popper-arrow{left:-4px}.time-range-textarea{--textarea-line-height: 20px;display:inline-flex;width:100%;overflow:hidden;font-size:12px;line-height:var(--textarea-line-height);color:#63656e;background-color:#fff;border:1px solid #c4c6cc;border-radius:2px;box-sizing:border-box;transition:all .3s;flex-direction:column}.time-range-textarea ::placeholder{font-size:12px;color:#c4c6cc}.time-range-textarea.resizable{resize:both}.time-range-textarea ::-webkit-scrollbar{-webkit-appearance:none;width:3px}.time-range-textarea ::-webkit-scrollbar-thumb{border-radius:4px;background-color:#dcdee5}.time-range-textarea.is-disabled,.time-range-textarea.is-readonly{background-color:#fafbfd;border-color:#dcdee5}.time-range-textarea.is-disabled .time-range-input--prefix-area,.time-range-textarea.is-readonly .time-range-input--prefix-area,.time-range-textarea.is-disabled .time-range-input--suffix-area,.time-range-textarea.is-readonly .time-range-input--suffix-area,.time-range-textarea.is-disabled .time-range-input--suffix-icon,.time-range-textarea.is-readonly .time-range-input--suffix-icon{cursor:not-allowed;background-color:#fafbfd}.time-range-textarea.is-disabled input,.time-range-textarea.is-readonly input,.time-range-textarea.is-disabled textarea,.time-range-textarea.is-readonly textarea{cursor:not-allowed;background-color:#fafbfd;opacity:1}.time-range-textarea.is-readonly input,.time-range-textarea.is-readonly textarea{cursor:auto}.time-range-textarea>textarea{width:100%;padding:5px 10px;line-height:1.5;text-align:left;border:0;border-radius:2px;outline:none;resize:none}.time-range-textarea--max-length{padding-right:8px;margin:0 0 0 auto;font-size:12px;text-align:right;transform:scale(.8);justify-content:flex-end}.time-range-textarea--max-length.is-over-limit{color:#ea3636}.time-range-textarea--max-length span{color:#979ba5}.time-range-textarea.is-focused:not(.is-readonly){border-color:#3a84ff;outline:0;box-shadow:0 0 3px #a3c5fd}.time-range-input{display:inline-flex;align-items:stretch;width:100%;height:32px;font-size:12px;border:1px solid #c4c6cc;border-radius:2px;transition:all .3s}.time-range-input ::placeholder{font-size:12px;color:#c4c6cc}.time-range-input.is-disabled,.time-range-input.is-readonly{background-color:#fafbfd;border-color:#dcdee5}.time-range-input.is-disabled .time-range-input--prefix-area,.time-range-input.is-readonly .time-range-input--prefix-area,.time-range-input.is-disabled .time-range-input--suffix-area,.time-range-input.is-readonly .time-range-input--suffix-area,.time-range-input.is-disabled .time-range-input--suffix-icon,.time-range-input.is-readonly .time-range-input--suffix-icon{cursor:not-allowed;background-color:#fafbfd}.time-range-input.is-disabled input,.time-range-input.is-readonly input,.time-range-input.is-disabled textarea,.time-range-input.is-readonly textarea{cursor:not-allowed;background-color:#fafbfd;opacity:1}.time-range-input.is-readonly input,.time-range-input.is-readonly textarea{cursor:auto}.time-range-input:hover:not(.is-disabled){border-color:#979ba5}.time-range-input:hover:not(.is-disabled) .show-clear-only-hover{display:flex}.time-range-input.is-simplicity{background-color:transparent;border-color:transparent;border-bottom-color:#c4c6cc}.time-range-input.is-simplicity:hover:not(.is-disabled){background-color:#f5f7fa;border-color:transparent;border-bottom-color:#c4c6cc;box-shadow:none}.time-range-input.is-simplicity:hover:not(.is-disabled) .time-range-input--text,.time-range-input.is-simplicity:hover:not(.is-disabled) .time-range-input--suffix-icon{background-color:#f5f7fa}.time-range-input--suffix-icon{display:flex;height:100%;padding-right:8px;font-size:14px;color:#c4c6cc;background-color:#fff;align-items:center;align-self:center;flex-shrink:0;cursor:pointer}.time-range-input--suffix-icon:hover{color:#313238}.time-range-input--suffix-icon.show-clear-only-hover{display:none}.time-range-input--clear-icon{cursor:pointer;flex-shrink:0}.time-range-input--clear-icon:hover{color:#979ba5}.time-range-input--large{height:40px;font-size:14px}.time-range-input--large ::placeholder{font-size:14px;color:#c4c6cc}.time-range-input--large .time-range-input--max-length{font-size:16px}.time-range-input--large .time-range-input--number-control span:first-child{margin-bottom:4px}.time-range-input--small{height:26px;font-size:12px}.time-range-input--small .time-range-input--max-length,.time-range-input--default,.time-range-input--default .time-range-input--max-length{font-size:12px}.time-range-input.is-focused:not(.is-readonly){border-color:#3a84ff;outline:0;box-shadow:0 0 3px #a3c5fd}.time-range-input.is-focused:not(.is-readonly).is-simplicity{border-color:transparent;border-bottom-color:#3a84ff;box-shadow:none}.time-range-input.is-focused:not(.is-readonly).is-simplicity .time-range-input--text,.time-range-input.is-focused:not(.is-readonly).is-simplicity .time-range-input--suffix-icon{background-color:#f5f7fa}.time-range-input--prefix-area,.time-range-input--suffix-area{display:flex;padding:0 8px;color:#63656e;background-color:#f5f7fa;border-right:1px solid #c4c6cc;align-items:center}.time-range-input--suffix-area{border:0;border-left:1px solid #c4c6cc}.time-range-input--max-length{align-self:center;padding-right:8px;font-size:12px;transform:scale(.8)}.time-range-input--max-length.is-over-limit{color:#ea3636}.time-range-input--max-length span{color:#979ba5}.time-range-input--text{width:100%;padding:0 8px;overflow:hidden;line-height:1;color:#63656e;text-overflow:ellipsis;white-space:nowrap;background-color:#fff;background-image:none;border:none;border-radius:2px;outline:none;box-sizing:border-box;transition:all .3s;flex:1}.time-range-input--text[type=search]::-webkit-search-decoration,.time-range-input--text[type=search]::-webkit-search-cancel-button,.time-range-input--text[type=search]::-webkit-search-results-button,.time-range-input--text[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;-moz-appearance:none;appearance:none}.time-range-input--text [type=search]::-ms-clear{display:none;width:0;height:0}.time-range-input--text [type=search]::-ms-reveal{display:none;width:0;height:0}.time-range-input--text[type=number]::-webkit-inner-spin-button,.time-range-input--text[type=number]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.time-range-input--number-control{display:flex;width:26px;height:100%;padding:4px 0;font-size:0;-webkit-user-select:none;user-select:none;flex-direction:column;align-items:center}.time-range-input--number-control span{display:flex;overflow:hidden;line-height:1;color:#979ba5;text-align:center;cursor:pointer;background-color:#f5f7fa;flex:1;align-items:center}.time-range-input--number-control span.is-disabled{color:#c4c6cc;cursor:not-allowed}.time-range-input--number-control svg{font-size:14px}.time-range-input--number-control span:first-child{transform:rotate(180deg)}.time-range-input--number-control span:not(.is-disabled):hover{background-color:#eaebf0}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 100px white inset!important;box-shadow:0 0 0 100px #fff inset!important}input:-moz-autofill,input:-moz-autofill:hover,input:-moz-autofill:focus,input:-moz-autofill:active{-moz-box-shadow:0 0 0 100px white inset!important;box-shadow:0 0 0 100px #fff inset!important}.text-ov{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.position-relative{position:relative}.position-absolute{position:absolute}.time-range-popover.time-range-pop2-content{position:absolute;padding:12px;font-size:12px;color:#fff;background:#26323d;border-radius:4px;box-sizing:border-box}.time-range-popover.time-range-pop2-content.hidden{display:none}.time-range-popover.time-range-pop2-content .time-range-pop2-arrow{position:absolute;z-index:-1;width:8px;height:8px;background:#333;transform:rotate(45deg)}.time-range-popover.time-range-pop2-content[data-theme^=light]{color:#26323d;background-color:#fff;box-shadow:0 0 6px #dcdee5}.time-range-popover.time-range-pop2-content[data-theme^=light] .time-range-pop2-arrow{background-color:#fff}.time-range-checkbox-group{display:inline-flex;letter-spacing:normal}.time-range-checkbox{display:inline-flex;justify-self:center;align-items:center;font-size:14px;letter-spacing:normal;color:#63656e;cursor:pointer;-webkit-user-select:none;user-select:none}.time-range-checkbox~.time-range-checkbox{margin-left:24px}.time-range-checkbox.is-checked .time-range-checkbox-input{background:#3a84ff;border-color:#3a84ff;transition:all .1s}.time-range-checkbox.is-checked .time-range-checkbox-input.small:after{width:3px;height:6px}.time-range-checkbox.is-checked .time-range-checkbox-input:after{position:absolute;top:50%;left:50%;width:4px;height:8px;border:2px solid #fff;border-top:0;border-left:0;content:"";transform:translate(-50%,-60%) scaleY(1) rotate(45deg);transform-origin:center}.time-range-checkbox.is-indeterminated .time-range-checkbox-input{background:#3a84ff;border-color:#3a84ff;transition:all .1s}.time-range-checkbox.is-indeterminated .time-range-checkbox-input.small:after{width:6px;height:2px}.time-range-checkbox.is-indeterminated .time-range-checkbox-input:after{position:absolute;top:50%;left:50%;width:8px;height:2px;background:#fff;border:none;border-radius:2px;content:"";transform:translate(-50%,-50%)}.time-range-checkbox.is-disabled{color:#c4c6cc;cursor:not-allowed}.time-range-checkbox.is-disabled .time-range-checkbox-input{background:#fafbfd;border-color:#dcdee5}.time-range-checkbox.is-disabled .time-range-checkbox-input:after{background:#dcdee5}.time-range-checkbox.is-disabled.is-checked .time-range-checkbox-input{background:#a3c5fd;border-color:#a3c5fd}.time-range-checkbox.is-disabled.is-checked .time-range-checkbox-input:after{background:#a3c5fd}.time-range-checkbox.is-prechecking{position:relative}.time-range-checkbox.is-prechecking .time-range-checkbox-input{visibility:hidden}.time-range-checkbox-input{position:relative;display:inline-block;width:16px;height:16px;vertical-align:middle;border:1px solid #979ba5;border-radius:2px}.time-range-checkbox-input.small{width:14px;height:14px}.time-range-checkbox-original{position:absolute;top:0;left:0;z-index:-1;width:0;height:0}.time-range-checkbox-label{display:inline-block;margin-left:6px;vertical-align:middle}.time-range-checkbox-checking{position:absolute;font-size:16px;color:#3a84ff;animation:loading 1s linear infinite}.time-range-exception{position:relative;display:flex;width:100%;align-items:center;flex-direction:column;text-align:center}.time-range-exception-img{display:flex;align-items:center;justify-content:center}.time-range-exception-img .exception-image{display:block;height:100%;object-fit:contain}.time-range-exception-title{color:#313238}.time-range-exception-description{color:#63656e}.time-range-exception-page .time-range-exception-img{width:480px;height:240px}.time-range-exception-page .time-range-exception-title{margin-top:18px;font-size:24px;line-height:32px}.time-range-exception-page .time-range-exception-description{margin-top:16px;font-size:14px;line-height:22px}.time-range-exception-page .time-range-exception-footer{margin-top:24px}.time-range-exception-part .time-range-exception-img{width:120px;height:100px}.time-range-exception-part .time-range-exception-title{margin-top:8px;font-size:14px;line-height:22px}.time-range-exception-part .time-range-exception-description{margin-top:8px;font-size:12px;line-height:20px}.time-range-exception-part .time-range-exception-footer{margin-top:8px}@keyframes loading-scale-animate{0%{transform:scale(1)}to{transform:scale(.6)}}@keyframes fade{to{background-color:transparent}}.time-range-transition .time-range-fade-enter-active,.time-range-transition .time-range-fade-leave-active{transition:all .3s cubic-bezier(.55,0,.1,1)}.time-range-transition .time-range-fade-enter,.time-range-transition .time-range-fade-leave-to{opacity:0}.time-range-select .mr5{margin-right:5px}.time-range-select .ml5{margin-left:5px}.time-range-select ul{padding:0;margin:0;font-weight:400;list-style:none}.time-range-select.large .time-range-select-content-wrapper{font-size:14px}.time-range-select.is-focus.normal .time-range-select-trigger .time-range-select-tag.time-range-select-tag--default{border-color:#3a84ff;box-shadow:0 0 3px #a3c5fd}.time-range-select.is-focus .time-range-input--default{border-color:#3a84ff;outline:0;box-shadow:0 0 3px #a3c5fd}.time-range-select.is-focus .time-range-input--default.is-simplicity{border-color:transparent;border-bottom-color:#3a84ff;box-shadow:none}.time-range-select.is-focus .time-range-input--default.is-simplicity .time-range-input--text{background-color:#f5f7fa}.time-range-select.popover-show .time-range-select-trigger .angle-up{transform:rotate(0)}.time-range-select.is-disabled .time-range-input--text{cursor:not-allowed;background-color:#fafbfd}.time-range-select .time-range-input.is-focused{border-color:#3a84ff;outline:0;box-shadow:0 0 3px #a3c5fd}.time-range-select .time-range-input.is-focused.is-simplicity{border-color:transparent;border-bottom-color:#3a84ff;box-shadow:none}.time-range-select .time-range-input--text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:24px;cursor:pointer;background-color:#fff}.time-range-select .time-range-select-trigger{position:relative}.time-range-select .time-range-select-trigger .time-range-tag-input .time-range-tag-input-trigger .clear-icon{margin-right:0}.time-range-select .time-range-select-trigger .time-range-select-tag{width:100%;height:32px;padding:0 28px 0 10px;line-height:normal;color:#63656e;text-align:left;vertical-align:middle;cursor:pointer;background-color:#fff;border:1px solid #c4c6cc;border-radius:2px;outline:none;box-sizing:border-box;transition:all .1s;resize:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;width:auto;align-items:center}.time-range-select .time-range-select-trigger .time-range-select-tag::placeholder{color:#c4c6cc}.time-range-select .time-range-select-trigger .time-range-select-tag.has-prefix{padding-left:0}.time-range-select .time-range-select-trigger .time-range-select-tag-wrapper{display:flex;align-items:center;flex-wrap:wrap;overflow:hidden;gap:4px;padding:4px 0}.time-range-select .time-range-select-trigger .time-range-select-tag.collapse-tag .time-range-select-tag-wrapper{height:30px}.time-range-select .time-range-select-trigger .time-range-select-tag:not(.collapse-tag){position:relative;z-index:1;height:auto;min-height:32px;flex-wrap:wrap}.time-range-select .time-range-select-trigger .time-range-select-tag:not(.is-disabled):hover{border-color:#979ba5}.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled{cursor:not-allowed;background-color:#fafbfd;border-color:#dcdee5}.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled input,.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled .time-range-tag{cursor:not-allowed}.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled .time-range-tag:hover{background-color:#f0f1f5}.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled .time-range-tag .time-range-tag-close{cursor:not-allowed}.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled .is-disabled{padding-left:0}.time-range-select .time-range-select-trigger .time-range-select-tag-input{width:100%;height:32px;line-height:normal;color:#63656e;text-align:left;vertical-align:middle;cursor:pointer;background-color:#fff;border:1px solid #c4c6cc;border-radius:2px;outline:none;box-sizing:border-box;transition:all .1s;resize:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:1%;height:22px;padding:0;margin:0 5px 0 0;background-color:transparent;border:none;flex-grow:1}.time-range-select .time-range-select-trigger .time-range-select-tag-input::placeholder{color:#c4c6cc}.time-range-select .time-range-select-trigger .time-range-select-tag .time-range-tag{max-width:190px;padding:0 4px}.time-range-select .time-range-select-trigger .angle-up{right:4px;transform:rotate(180deg);transition:transform .3s cubic-bezier(.4,0,.2,1);display:flex;width:20px;height:20px;font-size:20px;color:#979ba5;position:absolute;top:0;display:inline-flex;height:100%;align-items:center;justify-content:center}.time-range-select .time-range-select-trigger .clear-icon{right:4px;cursor:pointer;transition:all .1s;display:flex;width:20px;height:20px;font-size:14px;color:#c4c6cc;position:absolute;top:0;display:inline-flex;height:100%;align-items:center;justify-content:center}.time-range-select .time-range-select-trigger .clear-icon:hover{color:#979ba5}.time-range-select .time-range-select-trigger .spinner{right:6px;position:absolute;top:0;display:inline-flex;height:100%;align-items:center;justify-content:center}.time-range-select--prefix-area{display:flex;height:100%;padding:0 10px;margin-right:10px;color:#63656e;background-color:#f5f7fa;border-right:1px solid #c4c6cc;align-items:center}.time-range-popover.time-range-pop2-content.time-range-select-popover{padding:0;border:1px solid #dcdee5;border-radius:2px;box-shadow:0 2px 6px #0000001a}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-empty{display:flex;align-items:center;justify-content:center;height:56px;color:#63656e}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-empty .spinner{display:flex;width:14px;height:14px;margin-right:4px;font-size:14px;color:#c4c6cc;align-items:center;justify-content:center}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-empty span{margin-left:4px;line-height:18px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-dropdown{overflow:auto}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-dropdown::-webkit-scrollbar{width:4px;height:4px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-dropdown::-webkit-scrollbar-thumb{background:#dde4eb;border-radius:20px;box-shadow:inset 0 0 6px #cccccc4d}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-extension{display:flex;height:40px;background-color:#fafbfd;align-items:center;border-top:1px solid #dcdee5;border-radius:0 0 2px 2px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-options{padding:4px 0}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all{padding:4px 0;border-bottom:1px solid #dcdee5}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all .wrapper{display:flex;align-items:center;height:32px;padding:0 12px;cursor:pointer;color:#63656e}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all .wrapper:hover{background-color:#f5f7fa}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all .wrapper.active{background-color:#e1ecff;color:#3a84ff}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all .wrapper .select-all-icon{margin-right:4px;font-size:16px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option{position:relative;display:flex;height:32px;padding:0 12px;line-height:32px;color:#63656e;text-align:left;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option .time-range-select-selected-icon{position:absolute;top:5px;right:10px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option .time-range-select-checkbox{margin-right:6px;pointer-events:none}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option .time-range-select-checkbox .time-range-checkbox-original{opacity:0}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option-item .is-keyword{display:inline-flex;color:#3a84ff}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-hover{background-color:#f5f7fa}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option:hover{color:#63656e;background-color:#f5f7fa}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-selected:not(.is-checkbox){color:#3a84ff;background-color:#e1ecff}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-disabled{color:#c4c6cc;cursor:not-allowed;background-color:transparent}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-multiple{padding-right:32px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-multiple.is-selected{background-color:#fff}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-multiple.is-hover,.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-multiple:hover{background-color:#f5f7fa}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-options-loading{display:flex;align-items:center;justify-content:center}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-options-loading span{margin-left:4px;line-height:18px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group-label{height:32px;padding:0 8px;line-height:32px;color:#979ba5;text-align:left}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group-label.collapsible{cursor:pointer}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group.collapsible .time-range-select-option{padding-left:40px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group.disabled .default-group-label{color:#c4c6cc;cursor:not-allowed}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group .default-group-label{display:flex;-webkit-user-select:none;user-select:none;align-items:center}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group .default-group-label-icon{display:flex;width:12px;height:12px;margin-right:8px;transition:all .1s;align-items:center;justify-content:center}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group .default-group-label-icon.collapse{transform:rotate(-90deg)}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group .time-range-select-option{padding-left:24px}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-search-wrapper{display:flex;margin:4px 8px 0;border-bottom:1px solid #eaebf0;align-items:center}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-search-wrapper .icon-search{margin-left:2px;color:#979ba5}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-search-wrapper .time-range-select-search-input{width:100%;height:32px;line-height:normal;color:#63656e;text-align:left;vertical-align:middle;cursor:pointer;background-color:#fff;border:1px solid #c4c6cc;border-radius:2px;outline:none;box-sizing:border-box;transition:all .1s;resize:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 8px;cursor:text;border:none}.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-search-wrapper .time-range-select-search-input::placeholder{color:#c4c6cc}.time-range-F-scroll-x{overflow-x:auto;scrollbar-color:#a0a0a0 transparent;scrollbar-width:thin}.time-range-F-scroll-x::-webkit-scrollbar{height:6px}.time-range-F-scroll-y{overflow-y:auto}.time-range-F-scroll-y::-webkit-scrollbar{width:4px}.time-range-F-scroll-y::-webkit-scrollbar-thumb{border-radius:4px}.time-range-virtual-render{position:relative}.time-range-virtual-render .time-range-virtual-content,.time-range-virtual-render.time-range-virtual-content{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%}.time-range-virtual-render .time-range-virtual-section{width:1px;background:transparent}.time-range-tag{display:inline-flex;align-items:center;height:22px;padding:0 10px;font-size:12px;line-height:22px;color:#63656e;cursor:default;background-color:#f0f1f5;border-color:#979ba54d;box-sizing:border-box}.time-range-tag.time-range-tag-success{color:#14a568;border-color:#14a5684d;background-color:#e4faf0}.time-range-tag.time-range-tag-success.time-range-tag-filled{background-color:#14a568}.time-range-tag.time-range-tag-success.time-range-tag-filled:hover{background-color:#42b685}.time-range-tag.time-range-tag-success:hover:not(.time-range-tag-filled){background-color:#c9f5e2}.time-range-tag.time-range-tag-info{color:#3a84ff;border-color:#3a84ff4d;background-color:#edf4ff}.time-range-tag.time-range-tag-info.time-range-tag-filled{background-color:#3a84ff}.time-range-tag.time-range-tag-info.time-range-tag-filled:hover{background-color:#609cfe}.time-range-tag.time-range-tag-info:hover:not(.time-range-tag-filled){background-color:#e1ecff}.time-range-tag.time-range-tag-warning{color:#fe9c00;border-color:#fea5004d;background-color:#fff1db}.time-range-tag.time-range-tag-warning.time-range-tag-filled{background-color:#fe9c00}.time-range-tag.time-range-tag-warning.time-range-tag-filled:hover{background-color:#fdaf32}.time-range-tag.time-range-tag-warning:hover:not(.time-range-tag-filled){background-color:#ffe8c3}.time-range-tag.time-range-tag-danger{color:#ea3636;border-color:#ea35364d;background-color:#feebea}.time-range-tag.time-range-tag-danger.time-range-tag-filled{background-color:#ea3536}.time-range-tag.time-range-tag-danger.time-range-tag-filled:hover{background-color:#ed5c5d}.time-range-tag.time-range-tag-danger:hover:not(.time-range-tag-filled){background-color:#fedddc}.time-range-tag:hover{background-color:#dcdee5}.time-range-tag.time-range-tag-filled{color:#fff;background-color:#979ba5}.time-range-tag.time-range-tag-filled:hover{background-color:#acafb6}.time-range-tag.time-range-tag-stroke{padding:0 9px;line-height:20px;border-style:solid;border-width:1px}.time-range-tag.time-range-tag-closable{padding:0 4px 0 10px}.time-range-tag.time-range-tag-checkable{cursor:pointer;background:none}.time-range-tag.time-range-tag-checkable:hover{background:#f0f1f5}.time-range-tag.time-range-tag-check{color:#fff;background:#3a84ff}.time-range-tag.time-range-tag-check:hover{color:#fff;background:#3a84ff;opacity:1}.time-range-tag--defaul{padding:0 8px}.time-range-tag--small{height:16px;padding:0 4px;line-height:16px}.time-range-tag--small .time-range-tag-text{font-size:10px}.time-range-tag-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.time-range-tag-icon{flex-shrink:0;margin-right:4px;font-size:14px;line-height:0}.time-range-tag-close{flex-shrink:0;margin-left:4px;font-size:12px;line-height:0;cursor:pointer}.time-range-tab{position:relative;display:flex}.time-range-tab--top{flex-direction:column}.time-range-tab--right{flex-direction:row-reverse}.time-range-tab-header{position:relative;display:flex;color:#63656e}.time-range-tab--left .time-range-tab-header{border-right:1px solid #dcdee5}.time-range-tab--right .time-range-tab-header{border-left:1px solid #dcdee5}.time-range-tab--vertical-tab .time-range-tab-header{border:0}.time-range-tab--left .time-range-tab-header,.time-range-tab--right .time-range-tab-header{flex-direction:column}.time-range-tab--left .time-range-tab-header>div,.time-range-tab--right .time-range-tab-header>div{flex-direction:column}.time-range-tab--card-tab .time-range-tab-header,.time-range-tab--vertical-tab .time-range-tab-header{background:#f0f1f5}.time-range-tab--card-tab .time-range-tab-header{border-radius:4px 4px 0}.time-range-tab--card .time-range-tab-header,.time-range-tab--vertical-card .time-range-tab-header{border-bottom:1px solid #dcdee5}.time-range-tab--border-card .time-range-tab-header{border:solid #dcdee5;border-width:1px 1px 1px 0}.time-range-tab--border-card .time-range-tab-header{background:#fafbfd}.time-range-tab--unborder-card .time-range-tab-header{border-bottom:1px solid #dcdee5}.time-range-tab-header>div{display:flex;flex-wrap:nowrap}.time-range-tab--card .time-range-tab-header>div,.time-range-tab--vertical-card .time-range-tab-header>div,.time-range-tab--border-card .time-range-tab-header>div{margin-bottom:-1px}.time-range-tab-header-nav{position:relative}.time-range-tab--top .time-range-tab-header-nav{overflow-x:auto;overflow-y:visible}.time-range-tab--left .time-range-tab-header-nav,.time-range-tab--right .time-range-tab-header-nav{overflow-x:visible;overflow-y:auto}.time-range-tab--card .time-range-tab-header-nav,.time-range-tab--border-card .time-range-tab-header-nav,.time-range-tab--vertical-card .time-range-tab-header-nav{border-left:1px solid #dcdee5}.time-range-tab-header-nav::-webkit-scrollbar{display:none;width:0;height:0}.time-range-tab-header-next,.time-range-tab-header-prev{position:absolute;top:1px;bottom:1px;width:15px;background:#fff;content:""}.time-range-tab-header-prev{left:1px}.time-range-tab-header-next{right:1px}.time-range-tab-header-operation .time-range-tab-header-item{padding:0 12px}.time-range-tab-header-setting{justify-self:flex-end;margin-left:auto;white-space:nowrap}.time-range-tab-header-item{display:flex;white-space:nowrap;cursor:pointer;justify-content:center;align-items:center}.time-range-tab--top .time-range-tab-header-item{padding:0 20px}.time-range-tab--left .time-range-tab-header-item,.time-range-tab--right .time-range-tab-header-item{padding:0 12px}.time-range-tab--left .time-range-tab-header-item{text-align:right}.time-range-tab--card .time-range-tab-header-item,.time-range-tab--vertical-card .time-range-tab-header-item{border-top:1px solid #dcdee5}.time-range-tab--card .time-range-tab-header-item,.time-range-tab--border-card .time-range-tab-header-item,.time-range-tab--vertical-card .time-range-tab-header-item{border-right:1px solid #dcdee5}.time-range-tab--card-tab .time-range-tab-header-item{position:relative}.time-range-tab--card-tab .time-range-tab-header-item:not(:first-of-type):before,.time-range-tab--card-tab .time-range-tab-header-item:last-of-type:after{position:absolute;top:50%;left:0;display:block;width:1px;height:16px;margin-top:-8px;background:#c4c6cc;content:""}.time-range-tab--card-tab .time-range-tab-header-item:last-of-type:after{right:0;left:initial}.time-range-tab--card-grid .time-range-tab-header-item{height:40px;margin-right:8px;line-height:40px;background:#eaebf0;border-radius:4px 4px 0 0}.time-range-tab-header-operation .time-range-tab-header-item{padding-right:12px;padding-left:12px}.time-range-tab-header-item:hover{color:#3a84ff}.time-range-tab-header-item:hover .time-range-tab-header--close{display:block;margin-left:5px;color:#ea3636}.time-range-tab-header--active{color:#3a84ff}.time-range-tab--card .time-range-tab-header--active,.time-range-tab--border-card .time-range-tab-header--active,.time-range-tab--vertical-card .time-range-tab-header--active{background:#fff;border-bottom-color:#fff}.time-range-tab--card-tab .time-range-tab-header--active,.time-range-tab--vertical-tab .time-range-tab-header--active{background:#fff}.time-range-tab--card-tab .time-range-tab-header--active{border-radius:4px 4px 0 0}.time-range-tab--card-tab .time-range-tab-header--active:after,.time-range-tab--card-tab .time-range-tab-header--active:before,.time-range-tab--card-tab .time-range-tab-header--active+.time-range-tab-header-item:before{display:none!important}.time-range-tab--card-grid .time-range-tab-header--active{background:#fff}.time-range-tab-header--close{display:none;font-size:16px;color:#c4c6cc}.time-range-tab-header--disabled{cursor:not-allowed}.time-range-tab-header--disabled,.time-range-tab-header--disabled:hover{color:#aaa}.time-range-tab-header-active-bar{position:absolute;width:0;height:0;background:#3a84ff;transition:all ease-in .3s}.time-range-tab-content{flex:1;padding:10px}.time-range-tab--border-card .time-range-tab-content,.time-range-tab--vertical-card .time-range-tab-content{border:solid #dcdee5;border-width:0 1px 1px}.time-range-tab--card-grid .time-range-tab-content{background:#fff;border-radius:0 4px 4px;box-shadow:0 2px 4px #1919290d}.time-range-tab-panel{height:100%}.time-range-popover.time-range-pop-confirm-box{padding:16px}.time-range-pop-confirm-title{font-size:14px;color:#313238;padding-bottom:16px}.time-range-pop-confirm-icon{color:#ff5656;margin-right:4px}.time-range-pop-confirm-content{font-size:12px;color:#63656e;padding:0 0 16px}.time-range-pop-confirm-simple{font-size:14px}.time-range-pop-confirm-footer{display:flex;justify-content:flex-end;align-items:center}.time-range-pop-confirm-footer .time-range-button{margin-left:8px}.common-panel-tab{display:flex;align-items:center}.common-panel-tab .time-range-tab-header{line-height:20px!important;border-bottom:0!important}.common-panel-tab .time-range-tab-header .time-range-tab-header-item{padding:0 0 4px;margin-right:28px}.common-panel-tab .time-range-tab-header--active{font-weight:700;color:#63656e}.common-panel-tab .time-range-tab-content{display:none;width:0;height:0}.common-panel-tab .delete-all{margin-left:auto}.common-panel-tab .delete-all:hover{color:#3a84ff;cursor:pointer}.common-submit{flex:0 0 64px;width:64px;margin-left:8px}.common-favorite{display:flex;flex:0 0 32px;align-items:center;justify-content:center;width:32px;height:32px;margin-left:8px;cursor:pointer;background:#f5f7fa;border-radius:2px}.common-favorite:hover svg path{fill:#3a84ff}.date-panel{display:flex;flex-direction:column;width:220px;-webkit-user-select:none;user-select:none;background:#fff;border:1px solid #dcdee5;box-shadow:0 2px 6px #0000001a}.date-panel-title{display:flex;flex:0 0 40px;align-items:center;height:40px;padding:0 12px;color:#63656e;border-bottom:1px solid #dcdee5}.date-panel-title .title-check{margin-left:auto}.date-panel-title .title-check .time-range-checkbox{pointer-events:none}.date-panel-main{display:flex;flex:1;flex-direction:column;padding:8px 0 12px}.date-panel-main .date-header{display:flex;align-items:center;width:100%;height:24px}.date-panel-main .date-header-center{display:flex;flex:1;align-items:center;justify-content:center;height:100%;font-size:14px;font-weight:700}.date-panel-main .date-header-center .date-split{width:5px;height:2px;margin:0 10px;background-color:#63656e}.date-panel-main .date-header-right,.date-panel-main .date-header-left{display:flex;align-items:center;height:100%;padding:0 6px;font-size:16px}.date-panel-main .date-header-right .hand-icon,.date-panel-main .date-header-left .hand-icon{display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#979ba5}.date-panel-main .date-header-right .hand-icon svg,.date-panel-main .date-header-left .hand-icon svg{width:20px!important;height:20px!important;font-weight:700}.date-panel-main .date-header-right .hand-icon:hover,.date-panel-main .date-header-left .hand-icon:hover{color:#3a84ff;cursor:pointer}.date-panel-main .date-header-right .hand-icon:hover svg,.date-panel-main .date-header-left .hand-icon:hover svg{fill:#3a84ff}.date-panel-main .date-header-right{margin-left:auto}.date-panel-main .date-content{display:flex;flex-direction:column}.date-panel-main .date-content .date-grid{display:flex;align-items:center;width:100%;padding:0 12px;margin:0}.date-panel-main .date-content .date-grid-item{display:flex;flex:0 0 14.285%;align-items:center;justify-content:center;width:14.285%;min-width:28px;height:24px}.date-panel-main .date-content .date-grid-item:not(.not-click):hover{cursor:pointer;background-color:#f0f1f5}.date-panel-main .date-content .date-grid-item.is-today{color:#3a84ff;border:1px solid #a3c5fd;border-radius:2px}.date-panel-main .date-content .date-grid-item.is-last-month{color:#c4c6cc;background-color:#f0f1f5}.date-panel-main .date-content .date-grid-item.is-next-month{color:#c4c6cc}.date-panel-main .date-content .date-grid-item.is-disabled{color:#c4c6cc!important;cursor:not-allowed!important;background-color:#f0f1f5!important}.date-panel-main .date-content .date-grid-item.is-selected{color:#fff!important;background-color:#3a84ff!important;border-radius:2px}.date-wrapper{display:flex;flex-direction:column}.date-wrapper .date-input{display:flex;align-items:center;width:100%;min-height:56px}.date-wrapper .date-input .date-picker{display:flex;align-items:center;width:100%;min-width:360px;height:32px;background:#fff;border:1px solid #c4c6cc;border-radius:2px}.date-wrapper .date-input .date-picker-icon{display:flex;align-items:center;justify-content:center;margin-right:6px;margin-left:8px}.date-wrapper .date-input .date-picker-start,.date-wrapper .date-input .date-picker-end{width:160px;height:24px;padding:0 4px;font-size:12px;color:#63656e;border:none;border-radius:2px}.date-wrapper .date-input .date-picker-start:focus,.date-wrapper .date-input .date-picker-end:focus{background:#e1ecff;border:none;outline:none;box-shadow:none}.date-wrapper .date-input .date-picker-split{display:flex;align-items:center;justify-content:center;padding:0 8px;color:#979ba5}.date-wrapper .date-input .date-picker-clear{display:none!important;flex:0 0 32px;align-items:center;justify-content:center;width:32px;height:32px;font-size:14px;color:#c4c6cc}.date-wrapper .date-input .date-picker-clear:hover{color:#63656e;cursor:pointer}.date-wrapper .date-input .date-picker:hover .date-picker-clear{display:flex!important}.date-wrapper .show-format{display:flex;align-items:center;width:100%;min-width:100%;margin-top:-8px;margin-bottom:12px;color:#979ba5}.date-wrapper .show-format .format-button{margin-left:8px}.date-format-wrapper{display:flex;flex-direction:column;width:520px;padding:12px 15px}.date-format-wrapper .content-title{margin-bottom:12px;font-weight:700;line-height:20px}.date-format-wrapper .content-table{display:flex;flex-direction:column;width:100%;border-collapse:collapse;background-color:#fff;border:1px solid #eaeefb;border-top:0;border-left:0}.date-format-wrapper .content-table th,.date-format-wrapper .content-table td{height:42px;padding:0 16px;line-height:42px;color:#63656e;text-align:left;border:1px solid #eaeefb;border-right:0;border-bottom:0}.date-format-wrapper .content-table thead,.date-format-wrapper .content-table tr{display:flex;align-items:center;width:100%}.date-format-wrapper .content-table thead th,.date-format-wrapper .content-table tr th{flex:1;background-color:#fafbfd}.date-format-wrapper .content-table tbody{display:block;width:calc(100% + 4px);max-height:300px;overflow:auto}.date-format-wrapper .content-table tbody td{display:flex;flex:1;align-items:center}.natural-picker{display:flex;align-items:center;min-height:56px}.natural-picker .natural-date{width:256px}.natural-picker .natural-unit{width:140px;margin-left:8px}.natural-custom-option{display:flex;align-items:center;width:100%;min-width:250px;height:100%;padding:0 12px;margin:0 -12px}.natural-custom-option .time-range-input{background-color:#fff}.recent-picker{display:flex;align-items:center;min-height:56px}.recent-picker .recent-input{border-top-right-radius:0;border-bottom-right-radius:0}.recent-picker .recent-input.is-focused{z-index:2}.recent-picker .recent-unit{width:164px}.recent-picker .recent-unit .time-range-input{margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}.recent-picker .recent-unit .time-range-input--text{border-radius:0}.timezone-picker{width:100%}.timezone-picker-option{display:flex;align-items:center;width:100%;color:#63656e}.timezone-picker-option .option-name{flex:1}.timezone-picker-option .option-country{display:flex;width:100%;margin-left:6px;color:#999}.timezone-picker-option .option-utc{display:inline-flex;align-items:center;justify-content:center;height:20px;padding:0 8px;background:#f0f1f5;border-radius:2px}.timezone-picker-option.is-selected{color:#3a84ff}.timezone-picker-option.is-selected .option-country{color:#699df4}.timezone-picker-option.is-selected .option-utc{color:#fff;background-color:#699df4}.panel-wrapper{width:510px;padding:12px 16px 0;background:#fff;border:1px solid #dcdee5;border-radius:2px;box-shadow:0 2px 6px #0000001a}.panel-wrapper .common-date-list{height:136px;max-height:136px;padding:0 0 4px;margin:12px -10px 0 0;overflow:auto}.panel-wrapper .common-date-list .list-item{display:inline-flex;align-items:center;min-width:calc(33.33% - 8px);height:28px;padding:0 8px;margin-right:8px;margin-bottom:8px;color:#313238;cursor:pointer;background:#f5f7fa;border-radius:2px}.panel-wrapper .common-date-list .list-item.is-recent-item{min-width:inherit;height:24px;padding:0 6px;color:#63656e}.panel-wrapper .common-date-list .list-item.is-selected,.panel-wrapper .common-date-list .list-item:hover{color:#3a84ff;background:#e1ecff}.panel-wrapper .date-pick-tab{padding-top:12px;border-top:1px solid #eaebf0}.panel-wrapper .date-pick-tab .time-range-tab-header-item{margin-right:20px!important}.panel-wrapper .time-zone-panel{display:flex;align-items:center;height:45px;padding:0 16px;margin:0 -16px;color:#313238;background:#fafbfd;border-top:1px solid #dcdee5}.panel-wrapper .time-zone-panel .time-zone{display:flex;align-items:center;margin:0 8px}.panel-wrapper .time-zone-panel .time-zone-area{display:flex;align-items:center;margin-left:8px;color:#979ba5}.panel-wrapper .time-zone-panel .time-zone-tag{display:flex;align-items:center;justify-content:center;width:79px;height:20px;color:#63656e;border:1px solid #dcdee5;border-radius:2px}.panel-wrapper .time-zone-panel .time-zone-btn{margin-left:auto}.panel-wrapper .time-zone-picker{margin:8px 0}.panel-wrapper .common-wrapper{display:flex;flex-direction:column;height:139px;max-height:139px;overflow:auto}.panel-wrapper .common-wrapper .empty-content{height:100px;max-height:100px}.panel-wrapper .common-wrapper .empty-tips{display:flex;align-items:center;justify-content:center}.__bk_date_picker__{box-sizing:border-box;display:inline-flex;align-items:center;height:32px;padding:0 4px;font-size:12px;color:#63656e;border:1px solid #c4c6cc;border-radius:2px}.__bk_date_picker__ div::-webkit-scrollbar,.__bk_date_picker__ ul::-webkit-scrollbar,.__bk_date_picker__ section::-webkit-scrollbar,.__bk_date_picker__ tbody::-webkit-scrollbar,.__bk_date_picker__ article::-webkit-scrollbar{width:4px;height:4px}.__bk_date_picker__ div::-webkit-scrollbar-thumb,.__bk_date_picker__ ul::-webkit-scrollbar-thumb,.__bk_date_picker__ section::-webkit-scrollbar-thumb,.__bk_date_picker__ tbody::-webkit-scrollbar-thumb,.__bk_date_picker__ article::-webkit-scrollbar-thumb{background:#ddd;border-radius:20px;box-shadow:inset 0 0 6px #cccccc4d}.__bk_date_picker__ .date-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;font-size:20px;font-weight:700;color:#989ca7;background:#f5f7fa;border-radius:2px}.__bk_date_picker__ .date-icon-left,.__bk_date_picker__ .date-icon-right{display:inline-flex}.__bk_date_picker__ .date-icon-left svg,.__bk_date_picker__ .date-icon-right svg{width:20px!important;height:20px!important}.__bk_date_picker__ .date-icon:hover{cursor:pointer;background-color:#f0f1f5}.__bk_date_picker__.is-simplicity{border-color:transparent}.__bk_date_picker__.is-simplicity .date-icon{background-color:transparent}.__bk_date_picker__.is-simplicity .date-icon:hover{cursor:pointer;background-color:#f0f1f5}.__bk_date_picker__.is-disabled{color:#c4c6cc;cursor:not-allowed}.__bk_date_picker__.is-disabled .date-icon{color:#c4c6cc;pointer-events:none}.__bk_date_picker__.is-disabled .date-content{pointer-events:none;cursor:not-allowed}.__bk_date_picker__ .date-content{display:flex;align-items:center;height:24px;padding:0 6px;margin:0 4px;-webkit-user-select:none;user-select:none;border-radius:2px}.__bk_date_picker__ .date-content-icon{margin-right:4px}.__bk_date_picker__ .date-content-utc{display:flex;align-items:center;margin-left:4px;font-weight:700;color:#ff9c01}.__bk_date_picker__ .date-content:hover{cursor:pointer;background:#f5f7fa}.__bk-date-picker-popover__{padding:0!important;margin:0!important;color:#63656e!important}.__bk-date-picker-popover__ div::-webkit-scrollbar,.__bk-date-picker-popover__ ul::-webkit-scrollbar,.__bk-date-picker-popover__ section::-webkit-scrollbar,.__bk-date-picker-popover__ tbody::-webkit-scrollbar,.__bk-date-picker-popover__ article::-webkit-scrollbar{width:4px;height:4px}.__bk-date-picker-popover__ div::-webkit-scrollbar-thumb,.__bk-date-picker-popover__ ul::-webkit-scrollbar-thumb,.__bk-date-picker-popover__ section::-webkit-scrollbar-thumb,.__bk-date-picker-popover__ tbody::-webkit-scrollbar-thumb,.__bk-date-picker-popover__ article::-webkit-scrollbar-thumb{background:#ddd;border-radius:20px;box-shadow:inset 0 0 6px #cccccc4d}.__bk-date-picker-popover__ ul{padding:0;margin:0}.__bk-date-picker-popover__ ul li{list-style:none}.__bk-date-picker-popover__ .time-range-select-search-wrapper .icon-search:before{content:""!important}.__bk-date-picker-popover__ .time-range-pop-confirm{margin:20px 16px 16px!important}.__date-tooltips__{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:156px;line-height:20px}.__date-tooltips__ div::-webkit-scrollbar,.__date-tooltips__ ul::-webkit-scrollbar,.__date-tooltips__ section::-webkit-scrollbar,.__date-tooltips__ tbody::-webkit-scrollbar,.__date-tooltips__ article::-webkit-scrollbar{width:4px;height:4px}.__date-tooltips__ div::-webkit-scrollbar-thumb,.__date-tooltips__ ul::-webkit-scrollbar-thumb,.__date-tooltips__ section::-webkit-scrollbar-thumb,.__date-tooltips__ tbody::-webkit-scrollbar-thumb,.__date-tooltips__ article::-webkit-scrollbar-thumb{background:#ddd;border-radius:20px;box-shadow:inset 0 0 6px #cccccc4d}.__date-tooltips__ .date-tooltips-timezone{display:flex;align-items:center;justify-content:center;width:100%;margin-top:4px;color:#ff9c01}.__date-tooltips__ .date-tooltips-diff{display:flex;align-items:center;justify-content:center;padding:0 4px;margin-top:4px;color:#fff;background:#ffffff1f;border-radius:2px}
+.scroll-bar-style::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+.scroll-bar-style::-webkit-scrollbar-thumb {
+  background: #ddd;
+  border-radius: 20px;
+  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
+}
+html,
+body {
+  padding: 0;
+  margin: 0;
+}
+* {
+  box-sizing: border-box;
+}
+/**
+ * HTML5 display definitions
+ * ==========================================================================
+ *
+ * Correct `block` display not defined for any HTML5 element in IE 8/9.
+ * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
+ * Correct `block` display not defined for `main` in IE 11.
+ */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+menu,
+nav,
+section,
+summary {
+  display: block;
+}
+/**
+ * 1. Correct `inline-block` display not defined in IE 8/9.
+ * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
+ */
+audio,
+canvas,
+progress,
+video {
+  /* 1 */
+  display: inline-block;
+  /* 2 */
+  vertical-align: baseline;
+}
+/**
+ * Prevent modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS 5 devices.
+ */
+audio:not([controls]) {
+  display: none;
+  height: 0;
+}
+/**
+ * Address `[hidden]` styling not present in IE 8/9/10.
+ * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
+ */
+[hidden],
+template {
+  display: none;
+}
+/**
+ * Links
+ * ==========================================================================
+ *
+ * Remove the gray background color from active links in IE 10.
+ */
+a {
+  background-color: transparent;
+}
+/**
+ * Improve readability of focused elements when they are also in an
+ * active/hover state.
+ */
+a:active,
+a:hover {
+  outline: 0;
+}
+/**
+ * Text-level semantics
+ * ==========================================================================
+ *
+ * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
+ */
+abbr[title] {
+  border-bottom: 1px dotted;
+}
+/**
+ * Embedded content
+ * ==========================================================================
+ *
+ * Remove border when inside `a` element in IE 8/9/10.
+ */
+img {
+  border: 0;
+}
+/**
+ * Correct overflow not hidden in IE 9/10/11.
+ */
+svg:not(:root) {
+  overflow: hidden;
+}
+/**
+ * Grouping content
+ * ==========================================================================
+ *
+ * Address margin not present in IE 8/9 and Safari.
+ */
+figure {
+  margin: 1em 40px;
+}
+/**
+ * Address differences between Firefox and other browsers.
+ */
+hr {
+  height: 0;
+  box-sizing: content-box;
+}
+/**
+ * Address odd `em`-unit font size rendering in all browsers.
+ *
+ * Forms
+ * ==========================================================================
+ *
+ * Known limitation: by default, Chrome and Safari on OS X allow very limited
+ * styling of `select`, unless a `border` property is set.
+ *
+ * 1. Correct color not being inherited.
+ *    Known issue: affects color of disabled elements.
+ * 2. Correct font properties not being inherited.
+ * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
+ */
+button,
+input,
+optgroup,
+select,
+textarea {
+  /* 3 */
+  margin: 0;
+  /* 2 */
+  font: inherit;
+  /* 1 */
+  color: inherit;
+}
+/**
+ * Address `overflow` set to `hidden` in IE 8/9/10/11.
+ */
+button {
+  overflow: visible;
+}
+/**
+ * Address inconsistent `text-transform` inheritance for `button` and `select`.
+ * All other form control elements do not inherit `text-transform` values.
+ * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
+ * Correct `select` style inheritance in Firefox.
+ */
+button,
+select {
+  text-transform: none;
+}
+/**
+ * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.
+ * 2. Correct inability to style clickable `input` types in iOS.
+ * 3. Improve usability and consistency of cursor style between image-type `input` and others.
+ */
+button,
+html input[type='button'],
+input[type='reset'],
+input[type='submit'] {
+  /* 3 */
+  cursor: pointer;
+  /* 2 */
+  appearance: button;
+}
+/* Re-set default cursor for disabled elements. */
+button[disabled],
+html input[disabled] {
+  cursor: default;
+}
+/* Remove inner padding and border in Firefox 4+. */
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+  padding: 0;
+  border: 0;
+}
+/**
+ * Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet.
+ */
+input {
+  line-height: normal;
+}
+/**
+ * It's recommended that you don't attempt to style these elements.
+ * Firefox's implementation doesn't respect box-sizing, padding, or width.
+ *
+ * 1. Address box sizing set to `content-box` in IE 8/9/10.
+ * 2. Remove excess padding in IE 8/9/10.
+ */
+input[type='checkbox'],
+input[type='radio'] {
+  /* 2 */
+  padding: 0;
+  /* 1 */
+  box-sizing: border-box;
+}
+/**
+ * Fix the cursor style for Chrome's increment/decrement buttons. For certain
+ * `font-size` values of the `input`, it causes the cursor style of the
+ * decrement button to change from `default` to `text`.
+ */
+input[type='number']::-webkit-inner-spin-button,
+input[type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+::-ms-clear,
+::-ms-reveal {
+  display: none;
+}
+input[type='text']::-ms-clear {
+  display: none;
+}
+input[type='text']::-ms-reveal {
+  display: none;
+}
+/**
+ * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
+ * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
+ */
+input[type='search'] {
+  /* 2 */
+  box-sizing: content-box;
+  /* 1 */
+  appearance: textfield;
+}
+/**
+ * Remove inner padding and search cancel button in Safari and Chrome on OS X.
+ * Safari (but not Chrome) clips the cancel button when the search input has
+ * padding (and `textfield` appearance).
+ */
+input[type='search']::-webkit-search-cancel-button,
+input[type='search']::-webkit-search-decoration {
+  appearance: none;
+}
+/**
+ * Define consistent border, margin, and padding.
+ */
+fieldset {
+  padding: 0.35em 0.625em 0.75em;
+  margin: 0 2px;
+  border: 1px solid #c0c0c0;
+}
+/**
+ * 1. Correct `color` not being inherited in IE 8/9/10/11.
+ * 2. Remove padding so people aren't caught out if they zero out fieldsets.
+ */
+legend {
+  /* 2 */
+  padding: 0;
+  /* 1 */
+  border: 0;
+}
+/**
+ * Remove default vertical scrollbar in IE 8/9/10/11.
+ */
+textarea {
+  overflow: auto;
+}
+/**
+ * Don't inherit the `font-weight` (applied by a rule above).
+ * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
+ */
+optgroup {
+  font-weight: bold;
+}
+/**
+* BK-Scroll-Style
+*/
+.bk-scroll-y {
+  overflow-y: auto;
+}
+.bk-scroll-y::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+.bk-scroll-y::-webkit-scrollbar-thumb {
+  background: #ddd;
+  border-radius: 20px;
+  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
+}
+.bk-scroll-x {
+  overflow-x: auto;
+}
+.bk-scroll-x::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+.bk-scroll-x::-webkit-scrollbar-thumb {
+  background: #ddd;
+  border-radius: 20px;
+  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
+}
+.time-range-button {
+  display: inline-flex;
+  height: 32px;
+  padding: 0 14px;
+  font-size: 14px;
+  color: #63656e;
+  text-decoration: none;
+  white-space: nowrap;
+  cursor: pointer;
+  background-color: white;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+  outline: none;
+  box-sizing: border-box;
+  transition: background-color ease 0.3s;
+  appearance: none;
+  align-items: center;
+  justify-content: center;
+}
+.time-range-button.time-range-button-small {
+  height: 26px;
+  padding: 0 12px;
+  font-size: 12px;
+}
+.time-range-button.time-range-button-large {
+  height: 40px;
+  padding: 0 16px;
+  font-size: 16px;
+}
+.time-range-button .time-range-button-text {
+  display: inline-flex;
+  align-items: center;
+  line-height: 1;
+}
+.time-range-button.is-loading {
+  position: relative;
+}
+.time-range-button.is-loading .time-range-button-loading:not(:last-child) {
+  position: absolute;
+}
+.time-range-button.is-loading .time-range-button-text {
+  visibility: hidden;
+}
+.time-range-button:hover {
+  border-color: #979ba5;
+}
+.time-range-button:active {
+  color: #3a84ff;
+  border-color: #3a84ff;
+}
+.time-range-button.is-text {
+  height: auto;
+  padding: 0;
+  font-size: inherit;
+  color: #63656e;
+  text-decoration: none;
+  cursor: pointer;
+  background-color: transparent;
+  border: none;
+  outline: none;
+}
+.time-range-button.is-disabled {
+  color: #dcdee5;
+  cursor: not-allowed;
+  border-color: #dcdee5;
+}
+.time-range-button.is-disabled:not(.is-text) {
+  background-color: #f9fafd;
+}
+.time-range-button-group {
+  display: inline-block;
+  font-size: 0;
+}
+.time-range-button-group.time-range-button-group-small .time-range-button {
+  height: 26px;
+  padding: 0 12px;
+  font-size: 12px;
+}
+.time-range-button-group.time-range-button-group-large .time-range-button {
+  height: 40px;
+  padding: 0 16px;
+  font-size: 16px;
+}
+.time-range-button-group .time-range-button {
+  height: 32px;
+  margin: 0 0 0 -1px;
+  border-radius: 0;
+}
+.time-range-button-group .time-range-button:not(.is-disabled) {
+  color: #63656e;
+  background-color: white;
+  border-color: #c4c6cc;
+}
+.time-range-button-group .time-range-button.is-disabled {
+  color: #c4c6cc;
+}
+.time-range-button-group .time-range-button:first-child {
+  border-radius: 2px 0 0 2px;
+}
+.time-range-button-group .time-range-button:last-child {
+  border-radius: 0 2px 2px 0;
+}
+.time-range-button-group .time-range-button:only-child {
+  border-radius: 2px;
+}
+.time-range-button-group .time-range-button:hover:not(.is-disabled),
+.time-range-button-group .time-range-button.is-selected:not(.is-disabled) {
+  position: relative;
+  z-index: 1;
+  color: #3a84ff;
+  background-color: white;
+  border-color: #3a84ff;
+}
+.time-range-button-group .time-range-button.is-selected:not(.is-disabled) {
+  background-color: #e1ecff;
+}
+.time-range-button-group .time-range-button.is-selected.is-disabled {
+  background-color: #f0f1f5;
+}
+.time-range-button.time-range-button-primary,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary {
+  background-color: #3a84ff;
+  color: white;
+  border-color: #3a84ff;
+}
+.time-range-button.time-range-button-primary:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary:hover {
+  background-color: #5594fa;
+  border-color: #5594fa;
+}
+.time-range-button.time-range-button-primary:active,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary:active {
+  background-color: #2c77f4;
+  border-color: #2c77f4;
+  color: white;
+}
+.time-range-button.time-range-button-primary.is-outline,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary.is-outline {
+  color: #3a84ff;
+  border-color: #3a84ff;
+  background-color: white;
+}
+.time-range-button.time-range-button-primary.is-outline:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary.is-outline:hover {
+  background-color: #5594fa;
+  border-color: #5594fa;
+  color: white;
+}
+.time-range-button.time-range-button-primary.is-outline:active,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary.is-outline:active {
+  background-color: #2c77f4;
+  border-color: #2c77f4;
+  color: white;
+}
+.time-range-button.time-range-button-primary.is-text,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary.is-text {
+  color: #3a84ff;
+  background-color: transparent;
+  border: none;
+}
+.time-range-button.time-range-button-primary.is-text:not(.is-disabled):hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary.is-text:not(.is-disabled):hover {
+  color: #5594fa;
+}
+.time-range-button.time-range-button-primary.is-disabled,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary.is-disabled {
+  color: #dcdee5;
+  cursor: not-allowed;
+}
+.time-range-button.time-range-button-primary.is-disabled:not(.is-text),
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-primary.is-disabled:not(.is-text) {
+  background-color: #dcdee5;
+  color: white;
+  border-color: #dcdee5;
+}
+.time-range-button.time-range-button-hover-primary:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-hover-primary:hover {
+  background-color: #5594fa;
+  border-color: #5594fa;
+  color: white;
+}
+.time-range-button.time-range-button-warning,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning {
+  background-color: #ff9c01;
+  color: white;
+  border-color: #ff9c01;
+}
+.time-range-button.time-range-button-warning:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning:hover {
+  background-color: #ffb848;
+  border-color: #ffb848;
+}
+.time-range-button.time-range-button-warning:active,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning:active {
+  background-color: #eb9000;
+  border-color: #eb9000;
+  color: white;
+}
+.time-range-button.time-range-button-warning.is-outline,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning.is-outline {
+  color: #ff9c01;
+  border-color: #ff9c01;
+  background-color: white;
+}
+.time-range-button.time-range-button-warning.is-outline:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning.is-outline:hover {
+  background-color: #ffb848;
+  border-color: #ffb848;
+  color: white;
+}
+.time-range-button.time-range-button-warning.is-outline:active,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning.is-outline:active {
+  background-color: #eb9000;
+  border-color: #eb9000;
+  color: white;
+}
+.time-range-button.time-range-button-warning.is-text,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning.is-text {
+  color: #ff9c01;
+  background-color: transparent;
+  border: none;
+}
+.time-range-button.time-range-button-warning.is-text:not(.is-disabled):hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning.is-text:not(.is-disabled):hover {
+  color: #ffb848;
+}
+.time-range-button.time-range-button-warning.is-disabled,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning.is-disabled {
+  color: #dcdee5;
+  cursor: not-allowed;
+}
+.time-range-button.time-range-button-warning.is-disabled:not(.is-text),
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-warning.is-disabled:not(.is-text) {
+  background-color: #dcdee5;
+  color: white;
+  border-color: #dcdee5;
+}
+.time-range-button.time-range-button-hover-warning:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-hover-warning:hover {
+  background-color: #ffb848;
+  border-color: #ffb848;
+  color: white;
+}
+.time-range-button.time-range-button-success,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success {
+  background-color: #2dcb56;
+  color: white;
+  border-color: #2dcb56;
+}
+.time-range-button.time-range-button-success:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success:hover {
+  background-color: #45e35f;
+  border-color: #45e35f;
+}
+.time-range-button.time-range-button-success:active,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success:active {
+  background-color: #1ab943;
+  border-color: #1ab943;
+  color: white;
+}
+.time-range-button.time-range-button-success.is-outline,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success.is-outline {
+  color: #2dcb56;
+  border-color: #2dcb56;
+  background-color: white;
+}
+.time-range-button.time-range-button-success.is-outline:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success.is-outline:hover {
+  background-color: #45e35f;
+  border-color: #45e35f;
+  color: white;
+}
+.time-range-button.time-range-button-success.is-outline:active,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success.is-outline:active {
+  background-color: #1ab943;
+  border-color: #1ab943;
+  color: white;
+}
+.time-range-button.time-range-button-success.is-text,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success.is-text {
+  color: #2dcb56;
+  background-color: transparent;
+  border: none;
+}
+.time-range-button.time-range-button-success.is-text:not(.is-disabled):hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success.is-text:not(.is-disabled):hover {
+  color: #45e35f;
+}
+.time-range-button.time-range-button-success.is-disabled,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success.is-disabled {
+  color: #dcdee5;
+  cursor: not-allowed;
+}
+.time-range-button.time-range-button-success.is-disabled:not(.is-text),
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-success.is-disabled:not(.is-text) {
+  background-color: #dcdee5;
+  color: white;
+  border-color: #dcdee5;
+}
+.time-range-button.time-range-button-hover-success:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-hover-success:hover {
+  background-color: #45e35f;
+  border-color: #45e35f;
+  color: white;
+}
+.time-range-button.time-range-button-danger,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger {
+  background-color: #ea3636;
+  color: white;
+  border-color: #ea3636;
+}
+.time-range-button.time-range-button-danger:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger:hover {
+  background-color: #ff5656;
+  border-color: #ff5656;
+}
+.time-range-button.time-range-button-danger:active,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger:active {
+  background-color: #db2626;
+  border-color: #db2626;
+  color: white;
+}
+.time-range-button.time-range-button-danger.is-outline,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger.is-outline {
+  color: #ea3636;
+  border-color: #ea3636;
+  background-color: white;
+}
+.time-range-button.time-range-button-danger.is-outline:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger.is-outline:hover {
+  background-color: #ff5656;
+  border-color: #ff5656;
+  color: white;
+}
+.time-range-button.time-range-button-danger.is-outline:active,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger.is-outline:active {
+  background-color: #db2626;
+  border-color: #db2626;
+  color: white;
+}
+.time-range-button.time-range-button-danger.is-text,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger.is-text {
+  color: #ea3636;
+  background-color: transparent;
+  border: none;
+}
+.time-range-button.time-range-button-danger.is-text:not(.is-disabled):hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger.is-text:not(.is-disabled):hover {
+  color: #ff5656;
+}
+.time-range-button.time-range-button-danger.is-disabled,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger.is-disabled {
+  color: #dcdee5;
+  cursor: not-allowed;
+}
+.time-range-button.time-range-button-danger.is-disabled:not(.is-text),
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-danger.is-disabled:not(.is-text) {
+  background-color: #dcdee5;
+  color: white;
+  border-color: #dcdee5;
+}
+.time-range-button.time-range-button-hover-danger:hover,
+.time-range-button-group .is-selected:not(.is-disabled).time-range-button-hover-danger:hover {
+  background-color: #ff5656;
+  border-color: #ff5656;
+  color: white;
+}
+@keyframes loading-scale-animate {
+  0% {
+    transform: scale(1);
+  }
+  100% {
+    transform: scale(0.6);
+  }
+}
+@keyframes fade {
+  100% {
+    background-color: transparent;
+  }
+}
+.time-range-transition .time-range-fade-enter-active,
+.time-range-transition .time-range-fade-leave-active {
+  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
+}
+.time-range-transition .time-range-fade-enter,
+.time-range-transition .time-range-fade-leave-to {
+  opacity: 0;
+}
+.clearfix-style::after {
+  display: block;
+  height: 0;
+  clear: both;
+  font-size: 0;
+  content: '';
+  visibility: hidden;
+}
+.time-range-popper {
+  display: none;
+  padding: 7px 14px;
+  font-size: 12px;
+  color: #fff;
+  background: #333;
+  border-radius: 4px;
+}
+.time-range-popper.light {
+  color: #63656e;
+  background: #fff;
+  box-shadow: #dcdee5 0 0 6px 0;
+}
+.time-range-popper .time-range-popper-arrow,
+.time-range-popper .time-range-popper-arrow::before {
+  position: absolute;
+  width: 8px;
+  height: 8px;
+  background: inherit;
+}
+.time-range-popper .time-range-popper-arrow {
+  visibility: hidden;
+}
+.time-range-popper .time-range-popper-arrow::before {
+  content: '';
+  visibility: visible;
+  transform: rotate(45deg);
+}
+.time-range-popper[data-show] {
+  display: block;
+}
+.time-range-popper[data-popper-placement^='top'] > .time-range-popper-arrow {
+  bottom: -4px;
+}
+.time-range-popper[data-popper-placement^='bottom'] > .time-range-popper-arrow {
+  top: -4px;
+}
+.time-range-popper[data-popper-placement^='left'] > .time-range-popper-arrow {
+  right: -4px;
+}
+.time-range-popper[data-popper-placement^='right'] > .time-range-popper-arrow {
+  left: -4px;
+}
+.time-range-loading-wrapper {
+  position: static;
+  vertical-align: middle;
+}
+.time-range-loading-wrapper:not(.time-range-nested-loading):not(.time-range-directive-loading) {
+  display: inline-flex;
+}
+.time-range-loading-wrapper.time-range-directive-loading {
+  width: 100%;
+  height: 100%;
+}
+.time-range-loading-wrapper.time-range-directive-loading,
+.time-range-loading-wrapper.time-range-nested-loading {
+  position: relative;
+}
+.time-range-loading-wrapper.time-range-directive-loading.is-block,
+.time-range-loading-wrapper.time-range-nested-loading.is-block {
+  display: block;
+}
+.time-range-loading-wrapper.time-range-directive-loading .time-range-loading-indicator,
+.time-range-loading-wrapper.time-range-nested-loading .time-range-loading-indicator {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  z-index: 11;
+  text-align: center;
+  transform: translate(-50%, -50%);
+}
+.time-range-loading-wrapper .dot {
+  display: inline-flex;
+  width: 14px;
+  height: 14px;
+  margin-right: 10px;
+  border-radius: 50%;
+  transform: scale(0.6);
+  animation-duration: 0.8s;
+  animation-iteration-count: infinite;
+  animation-name: loading-scale-animate;
+  animation-direction: normal;
+}
+.time-range-loading-wrapper .oval {
+  position: absolute;
+  width: 6px;
+  height: 8px;
+  background-color: #63656e;
+  border-radius: 8px;
+  animation-duration: 1.2s;
+  animation-iteration-count: infinite;
+  animation-name: fade;
+  transform-origin: center 24px;
+}
+.time-range-loading-wrapper .time-range-loading-mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.time-range-loading-wrapper .time-range-loading-indicator {
+  display: flex;
+  line-height: 1;
+  text-align: center;
+  flex-direction: column;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .oval,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot-1,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot-2,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot-3,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-success .dot-4 {
+  background-color: #2dcb56;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .oval,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot-1,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot-2,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot-3,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-danger .dot-4 {
+  background-color: #ea3636;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .oval,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot-1,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot-2,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot-3,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-warning .dot-4 {
+  background-color: #ff9c01;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .oval,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot-1,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot-2,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot-3,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-primary .dot-4 {
+  background-color: #3a84ff;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .oval,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot-1,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot-2,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot-3,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-white .dot-4 {
+  background-color: white;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .oval,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot-1,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot-2,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot-3,
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-default .dot-4 {
+  background-color: #c4c6cc;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .dot-1 {
+  background-color: #ea3636;
+  animation-delay: 0.1s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .dot-2 {
+  background-color: #ff9c01;
+  animation-delay: 0.25s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .dot-3 {
+  background-color: #2dcb56;
+  animation-delay: 0.4s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .dot-4 {
+  background-color: #3a84ff;
+  animation-delay: 0.55s;
+  margin-right: 0px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .oval-1 {
+  transform: rotate(135deg);
+  animation-delay: -0.45s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .oval-2 {
+  transform: rotate(90deg);
+  animation-delay: -0.6s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .oval-3 {
+  transform: rotate(45deg);
+  animation-delay: -0.75s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .oval-4 {
+  transform: rotate(0deg);
+  animation-delay: -0.9s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .oval-5 {
+  transform: rotate(-45deg);
+  animation-delay: -1.05s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .oval-6 {
+  transform: rotate(-90deg);
+  animation-delay: -1.2s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .oval-7 {
+  transform: rotate(-135deg);
+  animation-delay: -1.35s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .oval-8 {
+  transform: rotate(-180deg);
+  animation-delay: -1.5s;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .time-range-normal-indicator {
+  display: inline-flex;
+  justify-content: center;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .time-range-spin-indicator {
+  position: relative;
+  display: inline-flex;
+  justify-content: center;
+  width: 48px;
+  height: 48px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .time-range-spin-indicator {
+  height: 16px;
+  width: 16px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .dot {
+  width: 3px;
+  height: 3px;
+  margin-right: 3px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .dot.dot-4 {
+  margin-right: 0;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .oval {
+  width: 2px;
+  height: 3px;
+  border-radius: 3px;
+  transform-origin: center 8px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-mini .time-range-loading-title {
+  font-size: 14px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .time-range-spin-indicator {
+  height: 32px;
+  width: 32px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .dot {
+  width: 6px;
+  height: 6px;
+  margin-right: 6px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .dot.dot-4 {
+  margin-right: 0;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .oval {
+  width: 4px;
+  height: 5px;
+  border-radius: 5px;
+  transform-origin: center 16px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-small .time-range-loading-title {
+  font-size: 12px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .time-range-spin-indicator {
+  height: 68px;
+  width: 68px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .dot {
+  width: 20px;
+  height: 20px;
+  margin-right: 12px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .dot.dot-4 {
+  margin-right: 0;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .oval {
+  width: 8px;
+  height: 12px;
+  border-radius: 12px;
+  transform-origin: center 34px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator.time-range-loading-size-large .time-range-loading-title {
+  font-size: 14px;
+}
+.time-range-loading-wrapper .time-range-loading-indicator .time-range-loading-title {
+  margin-top: 8px;
+  font-size: 14px;
+  line-height: normal;
+  color: #63656e;
+  text-align: center;
+}
+@keyframes loading-scale-animate {
+  0% {
+    transform: scale(1);
+  }
+  100% {
+    transform: scale(0.6);
+  }
+}
+@keyframes fade {
+  100% {
+    background-color: transparent;
+  }
+}
+.time-range-transition .time-range-fade-enter-active,
+.time-range-transition .time-range-fade-leave-active {
+  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
+}
+.time-range-transition .time-range-fade-enter,
+.time-range-transition .time-range-fade-leave-to {
+  opacity: 0;
+}
+.clearfix-style::after {
+  display: block;
+  height: 0;
+  clear: both;
+  font-size: 0;
+  content: '';
+  visibility: hidden;
+}
+.time-range-popper {
+  display: none;
+  padding: 7px 14px;
+  font-size: 12px;
+  color: #fff;
+  background: #333;
+  border-radius: 4px;
+}
+.time-range-popper.light {
+  color: #63656e;
+  background: #fff;
+  box-shadow: #dcdee5 0 0 6px 0;
+}
+.time-range-popper .time-range-popper-arrow,
+.time-range-popper .time-range-popper-arrow::before {
+  position: absolute;
+  width: 8px;
+  height: 8px;
+  background: inherit;
+}
+.time-range-popper .time-range-popper-arrow {
+  visibility: hidden;
+}
+.time-range-popper .time-range-popper-arrow::before {
+  content: '';
+  visibility: visible;
+  transform: rotate(45deg);
+}
+.time-range-popper[data-show] {
+  display: block;
+}
+.time-range-popper[data-popper-placement^='top'] > .time-range-popper-arrow {
+  bottom: -4px;
+}
+.time-range-popper[data-popper-placement^='bottom'] > .time-range-popper-arrow {
+  top: -4px;
+}
+.time-range-popper[data-popper-placement^='left'] > .time-range-popper-arrow {
+  right: -4px;
+}
+.time-range-popper[data-popper-placement^='right'] > .time-range-popper-arrow {
+  left: -4px;
+}
+.time-range-textarea {
+  --textarea-line-height: 20px;
+  display: inline-flex;
+  width: 100%;
+  overflow: hidden;
+  font-size: 12px;
+  line-height: var(--textarea-line-height);
+  color: #63656e;
+  background-color: white;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+  box-sizing: border-box;
+  transition: all 0.3s;
+  flex-direction: column;
+  position: relative;
+}
+.time-range-textarea ::placeholder {
+  font-size: 12px;
+  color: #c4c6cc;
+}
+.time-range-textarea.resizable {
+  resize: vertical;
+}
+.time-range-textarea.resizable > textarea {
+  flex: 1;
+}
+.time-range-textarea ::-webkit-scrollbar {
+  -webkit-appearance: none;
+  width: 3px;
+}
+.time-range-textarea ::-webkit-scrollbar-thumb {
+  border-radius: 4px;
+  background-color: #DCDEE5;
+}
+.time-range-textarea.is-disabled,
+.time-range-textarea.is-readonly {
+  background-color: #fafbfd;
+  border-color: #dcdee5;
+}
+.time-range-textarea.is-disabled .time-range-input--prefix-area,
+.time-range-textarea.is-readonly .time-range-input--prefix-area,
+.time-range-textarea.is-disabled .time-range-input--suffix-area,
+.time-range-textarea.is-readonly .time-range-input--suffix-area,
+.time-range-textarea.is-disabled .time-range-input--suffix-icon,
+.time-range-textarea.is-readonly .time-range-input--suffix-icon {
+  cursor: not-allowed;
+  background-color: #fafbfd;
+}
+.time-range-textarea.is-disabled input,
+.time-range-textarea.is-readonly input,
+.time-range-textarea.is-disabled textarea,
+.time-range-textarea.is-readonly textarea {
+  cursor: not-allowed;
+  background-color: #fafbfd;
+  opacity: 1;
+}
+.time-range-textarea.is-readonly input,
+.time-range-textarea.is-readonly textarea {
+  cursor: auto;
+}
+.time-range-textarea > textarea {
+  width: 100%;
+  padding: 5px 10px;
+  line-height: 1.5;
+  text-align: left;
+  border: 0;
+  border-radius: 2px;
+  outline: none;
+  resize: none;
+}
+.time-range-textarea--max-length {
+  padding-right: 8px;
+  margin: 0;
+  margin-left: auto;
+  font-size: 12px;
+  text-align: right;
+  transform: scale(0.8);
+  justify-content: flex-end;
+}
+.time-range-textarea--max-length.is-over-limit {
+  color: #ea3636;
+}
+.time-range-textarea--max-length span {
+  color: #979ba5;
+}
+.time-range-textarea.is-focused:not(.is-readonly) {
+  border-color: #3a84ff;
+  outline: 0;
+  box-shadow: 0px 0px 3px 0px #a3c5fd;
+}
+.time-range-textarea--suffix-icon {
+  color: #979ba5;
+  padding-right: 8px;
+  font-size: 14px;
+  margin: 0;
+  margin-left: auto;
+  text-align: right;
+  flex-shrink: 0;
+  cursor: pointer;
+}
+.time-range-textarea--suffix-icon:hover {
+  color: #313238;
+}
+.time-range-textarea--suffix-icon.show-clear-only-hover {
+  display: none;
+}
+.time-range-textarea:hover:not(.is-disabled) .show-clear-only-hover {
+  display: flex;
+}
+.time-range-textarea--clear-icon {
+  position: absolute;
+  top: 5px;
+  right: 10px;
+}
+.time-range-input {
+  display: inline-flex;
+  align-items: stretch;
+  width: 100%;
+  height: 32px;
+  font-size: 12px;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+  transition: all 0.3s;
+}
+.time-range-input ::placeholder {
+  font-size: 12px;
+  color: #c4c6cc;
+}
+.time-range-input.is-disabled,
+.time-range-input.is-readonly {
+  background-color: #fafbfd;
+  border-color: #dcdee5;
+}
+.time-range-input.is-disabled .time-range-input--prefix-area,
+.time-range-input.is-readonly .time-range-input--prefix-area,
+.time-range-input.is-disabled .time-range-input--suffix-area,
+.time-range-input.is-readonly .time-range-input--suffix-area,
+.time-range-input.is-disabled .time-range-input--suffix-icon,
+.time-range-input.is-readonly .time-range-input--suffix-icon {
+  cursor: not-allowed;
+  background-color: #fafbfd;
+}
+.time-range-input.is-disabled input,
+.time-range-input.is-readonly input,
+.time-range-input.is-disabled textarea,
+.time-range-input.is-readonly textarea {
+  cursor: not-allowed;
+  background-color: #fafbfd;
+  opacity: 1;
+}
+.time-range-input.is-readonly input,
+.time-range-input.is-readonly textarea {
+  cursor: auto;
+}
+.time-range-input:hover:not(.is-disabled) {
+  border-color: #979ba5;
+}
+.time-range-input:hover:not(.is-disabled) .show-clear-only-hover {
+  display: flex;
+}
+.time-range-input.is-simplicity {
+  background-color: transparent;
+  border-color: transparent;
+  border-bottom-color: #c4c6cc;
+}
+.time-range-input.is-simplicity:hover:not(.is-disabled) {
+  background-color: #f5f7fa;
+  border-color: transparent;
+  border-bottom-color: #c4c6cc;
+  box-shadow: none;
+}
+.time-range-input.is-simplicity:hover:not(.is-disabled) .time-range-input--text,
+.time-range-input.is-simplicity:hover:not(.is-disabled) .time-range-input--suffix-icon {
+  background-color: #f5f7fa;
+}
+.time-range-input--suffix-icon {
+  display: flex;
+  height: 100%;
+  padding-right: 8px;
+  font-size: 14px;
+  color: #c4c6cc;
+  background-color: white;
+  align-items: center;
+  align-self: center;
+  flex-shrink: 0;
+  cursor: pointer;
+}
+.time-range-input--suffix-icon:hover {
+  color: #313238;
+}
+.time-range-input--suffix-icon.show-clear-only-hover {
+  display: none;
+}
+.time-range-input--clear-icon {
+  cursor: pointer;
+  flex-shrink: 0;
+}
+.time-range-input--clear-icon:hover {
+  color: #979ba5;
+}
+.time-range-input--large {
+  height: 40px;
+  font-size: 14px;
+}
+.time-range-input--large ::placeholder {
+  font-size: 14px;
+  color: #c4c6cc;
+}
+.time-range-input--large .time-range-input--max-length {
+  font-size: 16px;
+}
+.time-range-input--large .time-range-input--number-control span:first-child {
+  margin-bottom: 4px;
+}
+.time-range-input--small {
+  height: 26px;
+  font-size: 12px;
+}
+.time-range-input--small .time-range-input--max-length {
+  font-size: 12px;
+}
+.time-range-input--default {
+  font-size: 12px;
+}
+.time-range-input--default .time-range-input--max-length {
+  font-size: 12px;
+}
+.time-range-input.is-focused:not(.is-readonly) {
+  border-color: #3a84ff;
+  outline: 0;
+  box-shadow: 0px 0px 3px 0px #a3c5fd;
+}
+.time-range-input.is-focused:not(.is-readonly).is-simplicity {
+  border-color: transparent;
+  border-bottom-color: #3a84ff;
+  box-shadow: none;
+}
+.time-range-input.is-focused:not(.is-readonly).is-simplicity .time-range-input--text,
+.time-range-input.is-focused:not(.is-readonly).is-simplicity .time-range-input--suffix-icon {
+  background-color: #f5f7fa;
+}
+.time-range-input--prefix-area,
+.time-range-input--suffix-area {
+  display: flex;
+  padding: 0 8px;
+  color: #63656e;
+  background-color: #f5f7fa;
+  border-right: 1px solid #c4c6cc;
+  align-items: center;
+}
+.time-range-input--suffix-area {
+  border: 0;
+  border-left: 1px solid #c4c6cc;
+}
+.time-range-input--max-length {
+  align-self: center;
+  padding-right: 8px;
+  font-size: 12px;
+  transform: scale(0.8);
+}
+.time-range-input--max-length.is-over-limit {
+  color: #ea3636;
+}
+.time-range-input--max-length span {
+  color: #979ba5;
+}
+.time-range-input--text {
+  width: 100%;
+  padding: 0 8px;
+  overflow: hidden;
+  line-height: 1;
+  color: #63656e;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  background-color: white;
+  background-image: none;
+  border: none;
+  border-radius: 2px;
+  outline: none;
+  box-sizing: border-box;
+  transition: all 0.3s;
+  flex: 1;
+}
+.time-range-input--text[type='search']::-webkit-search-decoration,
+.time-range-input--text[type='search']::-webkit-search-cancel-button,
+.time-range-input--text[type='search']::-webkit-search-results-button,
+.time-range-input--text[type='search']::-webkit-search-results-decoration {
+  appearance: none;
+}
+.time-range-input--text [type='search']::-ms-clear {
+  display: none;
+  width: 0;
+  height: 0;
+}
+.time-range-input--text [type='search']::-ms-reveal {
+  display: none;
+  width: 0;
+  height: 0;
+}
+.time-range-input--text[type='number']::-webkit-inner-spin-button,
+.time-range-input--text[type='number']::-webkit-outer-spin-button {
+  margin: 0;
+  appearance: none;
+}
+.time-range-input--number-control {
+  display: flex;
+  width: 26px;
+  height: 100%;
+  padding: 4px 0;
+  font-size: 0;
+  user-select: none;
+  flex-direction: column;
+  align-items: center;
+}
+.time-range-input--number-control span {
+  display: flex;
+  overflow: hidden;
+  line-height: 1;
+  color: #979ba5;
+  text-align: center;
+  cursor: pointer;
+  background-color: #f5f7fa;
+  flex: 1;
+  align-items: center;
+}
+.time-range-input--number-control span.is-disabled {
+  color: #c4c6cc;
+  cursor: not-allowed;
+}
+.time-range-input--number-control svg {
+  font-size: 14px;
+}
+.time-range-input--number-control span:first-child {
+  transform: rotate(180deg);
+}
+.time-range-input--number-control span:not(.is-disabled):hover {
+  background-color: #eaebf0;
+}
+/* 针对 Chrome、Safari 和新版 Edge 的样式 */
+input:-webkit-autofill,
+input:-webkit-autofill:hover,
+input:-webkit-autofill:focus,
+input:-webkit-autofill:active {
+  -webkit-box-shadow: 0 0 0 100px white inset !important;
+  box-shadow: 0 0 0 100px white inset !important;
+}
+/* 针对 Firefox 的样式 */
+input:-moz-autofill,
+input:-moz-autofill:hover,
+input:-moz-autofill:focus,
+input:-moz-autofill:active {
+  -moz-box-shadow: 0 0 0 100px white inset !important;
+  box-shadow: 0 0 0 100px white inset !important;
+}
+.time-range-popover.time-range-pop2-content {
+  position: absolute;
+  padding: 12px;
+  font-size: 12px;
+  color: #fff;
+  background: #26323d;
+  border-radius: 4px;
+  box-sizing: border-box;
+}
+.time-range-popover.time-range-pop2-content.hidden {
+  display: none;
+}
+.time-range-popover.time-range-pop2-content .time-range-pop2-arrow {
+  position: absolute;
+  z-index: -1;
+  width: 8px;
+  height: 8px;
+  background: #333;
+  transform: rotate(45deg);
+}
+.time-range-popover.time-range-pop2-content[data-theme^='light'] {
+  color: #26323d;
+  background-color: #fff;
+  box-shadow: 0 0 6px 0 #dcdee5;
+}
+.time-range-popover.time-range-pop2-content[data-theme^='light'] .time-range-pop2-arrow {
+  background-color: #fff;
+}
+.text-ov {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.position-relative {
+  position: relative;
+}
+.position-absolute {
+  position: absolute;
+}
+.overflow-popover-reference {
+  width: 100%;
+}
+@keyframes loading-scale-animate {
+  0% {
+    transform: scale(1);
+  }
+  100% {
+    transform: scale(0.6);
+  }
+}
+@keyframes fade {
+  100% {
+    background-color: transparent;
+  }
+}
+.time-range-transition .time-range-fade-enter-active,
+.time-range-transition .time-range-fade-leave-active {
+  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
+}
+.time-range-transition .time-range-fade-enter,
+.time-range-transition .time-range-fade-leave-to {
+  opacity: 0;
+}
+.time-range-select .mr5 {
+  margin-right: 5px;
+}
+.time-range-select .ml5 {
+  margin-left: 5px;
+}
+.time-range-select ul {
+  padding: 0;
+  margin: 0;
+  font-weight: normal;
+  list-style: none;
+}
+.time-range-select.large .time-range-select-content-wrapper {
+  font-size: 14px;
+}
+.time-range-select.is-focus:not(.is-disabled).normal .time-range-select-trigger .time-range-select-tag {
+  border-color: #3a84ff;
+  box-shadow: 0px 0px 3px 0px #a3c5fd;
+}
+.time-range-select.is-focus:not(.is-disabled).simplicity .time-range-select-trigger .time-range-select-tag {
+  border-bottom-color: #3a84ff;
+}
+.time-range-select.is-focus .time-range-input {
+  border-color: #3a84ff;
+  outline: 0;
+  box-shadow: 0px 0px 3px 0px #a3c5fd;
+}
+.time-range-select.is-focus .time-range-input.is-simplicity {
+  border-color: transparent;
+  border-bottom-color: #3a84ff;
+  box-shadow: none;
+}
+.time-range-select.is-focus .time-range-input.is-simplicity .time-range-input--text {
+  background-color: #f5f7fa;
+}
+.time-range-select.popover-show .time-range-select-trigger .angle-down {
+  transform: rotate(180deg);
+}
+.time-range-select.is-disabled .time-range-input--text {
+  cursor: not-allowed;
+  background-color: #fafbfd;
+}
+.time-range-select .time-range-input.is-focused {
+  border-color: #3a84ff;
+  outline: 0;
+  box-shadow: 0 0 3px 0 #a3c5fd;
+}
+.time-range-select .time-range-input.is-focused.is-simplicity {
+  border-color: transparent;
+  border-bottom-color: #3a84ff;
+  box-shadow: none;
+}
+.time-range-select .time-range-input--text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  padding-right: 24px;
+  cursor: pointer;
+  background-color: white;
+}
+.time-range-select .time-range-select-trigger {
+  position: relative;
+}
+.time-range-select .time-range-select-trigger .time-range-tag-input .time-range-tag-input-trigger .clear-icon {
+  margin-right: 0;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag {
+  width: 100%;
+  height: 32px;
+  padding: 0 28px 0 10px;
+  line-height: normal;
+  color: #63656e;
+  text-align: left;
+  vertical-align: middle;
+  cursor: pointer;
+  background-color: white;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+  outline: none;
+  box-sizing: border-box;
+  transition: all 0.1s;
+  resize: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: flex;
+  width: auto;
+  align-items: center;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag::placeholder {
+  color: #c4c6cc;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.is-simplicity {
+  background-color: transparent;
+  border-color: transparent;
+  border-bottom-color: #c4c6cc;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.is-simplicity:hover {
+  background-color: #f5f7fa;
+  border-color: transparent;
+  border-bottom-color: #c4c6cc;
+  box-shadow: none;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.has-prefix {
+  padding-left: 0;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag-wrapper {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  overflow: hidden;
+  gap: 4px;
+  padding: 4px 0;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.collapse-tag .time-range-select-tag-wrapper {
+  height: 30px;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag:not(.collapse-tag) {
+  position: relative;
+  z-index: 1;
+  height: auto;
+  min-height: 32px;
+  flex-wrap: wrap;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag:not(.is-disabled,.is-simplicity):hover {
+  border-color: #979ba5;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled {
+  cursor: not-allowed;
+  background-color: #fafbfd;
+  border-color: #dcdee5;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled input {
+  cursor: not-allowed;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled .time-range-tag {
+  cursor: not-allowed;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled .time-range-tag:hover {
+  background-color: #f0f1f5;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled .time-range-tag .time-range-tag-close {
+  cursor: not-allowed;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag.is-disabled .is-disabled {
+  padding-left: 0;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag-input {
+  width: 100%;
+  height: 32px;
+  padding: 0 28px 0 10px;
+  line-height: normal;
+  color: #63656e;
+  text-align: left;
+  vertical-align: middle;
+  cursor: pointer;
+  background-color: white;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+  outline: none;
+  box-sizing: border-box;
+  transition: all 0.1s;
+  resize: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  width: 1%;
+  height: 22px;
+  padding: 0;
+  margin: 0px 5px 0px 0;
+  background-color: transparent;
+  border: none;
+  flex-grow: 1;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag-input::placeholder {
+  color: #c4c6cc;
+}
+.time-range-select .time-range-select-trigger .time-range-select-tag .time-range-tag {
+  max-width: 190px;
+  padding: 0 4px;
+}
+.time-range-select .time-range-select-trigger .angle-down {
+  right: 4px;
+  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  display: flex;
+  width: 20px;
+  height: 20px;
+  font-size: 20px;
+  color: #979ba5;
+  position: absolute;
+  top: 0;
+  display: inline-flex;
+  height: 100%;
+  align-items: center;
+  justify-content: center;
+}
+.time-range-select .time-range-select-trigger .clear-icon {
+  right: 4px;
+  cursor: pointer;
+  transition: all 0.1s;
+  display: flex;
+  width: 20px;
+  height: 20px;
+  font-size: 14px;
+  color: #c4c6cc;
+  position: absolute;
+  top: 0;
+  display: inline-flex;
+  height: 100%;
+  align-items: center;
+  justify-content: center;
+}
+.time-range-select .time-range-select-trigger .clear-icon:hover {
+  color: #979ba5;
+}
+.time-range-select .time-range-select-trigger .spinner {
+  right: 6px;
+  position: absolute;
+  top: 0;
+  display: inline-flex;
+  height: 100%;
+  align-items: center;
+  justify-content: center;
+}
+.time-range-select--prefix-area {
+  display: flex;
+  height: 100%;
+  padding: 0 10px;
+  margin-right: 10px;
+  color: #63656e;
+  background-color: #f5f7fa;
+  border-right: 1px solid #c4c6cc;
+  align-items: center;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover {
+  padding: 0;
+  border: 1px solid #dcdee5;
+  border-radius: 2px;
+  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-empty {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 56px;
+  color: #63656e;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-empty .spinner {
+  display: flex;
+  width: 14px;
+  height: 14px;
+  margin-right: 4px;
+  font-size: 14px;
+  color: #c4c6cc;
+  align-items: center;
+  justify-content: center;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-empty span {
+  margin-left: 4px;
+  line-height: 18px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-dropdown {
+  overflow: auto;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-dropdown::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-dropdown::-webkit-scrollbar-thumb {
+  background: #dde4eb;
+  border-radius: 20px;
+  box-shadow: inset 0 0 6px hsla(0, 0%, 80%, 0.3);
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-extension {
+  display: flex;
+  height: 40px;
+  background-color: #fafbfd;
+  align-items: center;
+  border-top: 1px solid #dcdee5;
+  border-radius: 0 0 2px 2px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-options {
+  padding: 4px 0;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all {
+  padding: 4px 0;
+  border-bottom: 1px solid #dcdee5;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all .wrapper {
+  display: flex;
+  align-items: center;
+  height: 32px;
+  padding: 0 12px;
+  cursor: pointer;
+  color: #63656e;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all .wrapper:hover {
+  background-color: #f5f7fa;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all .wrapper.active {
+  background-color: #e1ecff;
+  color: #3a84ff;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-all .wrapper .select-all-icon {
+  margin-right: 4px;
+  font-size: 16px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option {
+  position: relative;
+  display: flex;
+  min-height: 32px;
+  padding: 0 12px;
+  color: #63656e;
+  text-align: left;
+  cursor: pointer;
+  user-select: none;
+  align-items: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option .time-range-select-selected-icon {
+  position: absolute;
+  top: 5px;
+  right: 10px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option .time-range-select-checkbox {
+  margin-right: 6px;
+  pointer-events: none;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option .time-range-select-checkbox .time-range-checkbox-original {
+  opacity: 0;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option-item {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option-item .is-keyword {
+  display: inline-flex;
+  color: #3a84ff;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-hover {
+  background-color: #f5f7fa;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option:hover {
+  color: #63656e;
+  background-color: #f5f7fa;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-selected:not(.is-checkbox) {
+  color: #3a84ff;
+  background-color: #e1ecff;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-disabled {
+  color: #c4c6cc;
+  cursor: not-allowed;
+  background-color: transparent;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-multiple {
+  padding-right: 32px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-multiple.is-selected {
+  background-color: #fff;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-multiple.is-hover {
+  background-color: #f5f7fa;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-option.is-multiple:hover {
+  background-color: #f5f7fa;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-options-loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-options-loading span {
+  margin-left: 4px;
+  line-height: 18px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group-label {
+  height: 32px;
+  padding: 0 8px;
+  line-height: 32px;
+  color: #979ba5;
+  text-align: left;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group-label.collapsible {
+  cursor: pointer;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group.collapsible .time-range-select-option {
+  padding-left: 40px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group.disabled .default-group-label {
+  color: #c4c6cc;
+  cursor: not-allowed;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group .default-group-label {
+  display: flex;
+  user-select: none;
+  align-items: center;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group .default-group-label-icon {
+  display: flex;
+  width: 12px;
+  height: 12px;
+  margin-right: 8px;
+  transition: all 0.1s;
+  align-items: center;
+  justify-content: center;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group .default-group-label-icon.collapse {
+  transform: rotate(-90deg);
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-option-group .time-range-select-option {
+  padding-left: 24px;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-search-wrapper {
+  display: flex;
+  margin: 4px 8px 0 8px;
+  border-bottom: 1px solid #eaebf0;
+  align-items: center;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-search-wrapper .icon-search {
+  margin-left: 2px;
+  color: #979ba5;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-search-wrapper .time-range-select-search-input {
+  width: 100%;
+  height: 32px;
+  padding: 0 28px 0 10px;
+  line-height: normal;
+  color: #63656e;
+  text-align: left;
+  vertical-align: middle;
+  cursor: pointer;
+  background-color: white;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+  outline: none;
+  box-sizing: border-box;
+  transition: all 0.1s;
+  resize: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  padding: 0 8px;
+  cursor: text;
+  border: none;
+}
+.time-range-popover.time-range-pop2-content.time-range-select-popover .time-range-select-content-wrapper .time-range-select-search-wrapper .time-range-select-search-input::placeholder {
+  color: #c4c6cc;
+}
+.time-range-select-tooltips {
+  max-width: 600px;
+}
+.time-range-select-popover-reference {
+  width: 100%;
+}
+.time-range-checkbox-group {
+  display: inline-flex;
+  letter-spacing: normal;
+}
+.time-range-checkbox {
+  display: inline-flex;
+  justify-self: center;
+  align-items: center;
+  font-size: 14px;
+  letter-spacing: normal;
+  color: #63656e;
+  cursor: pointer;
+  user-select: none;
+}
+.time-range-checkbox ~ .time-range-checkbox {
+  margin-left: 24px;
+}
+.time-range-checkbox.is-checked.is-outline .time-range-checkbox-input {
+  background: #fff;
+}
+.time-range-checkbox.is-checked.is-outline .time-range-checkbox-input::after {
+  border: 2px solid #3a84ff;
+  border-top: 0;
+  border-left: 0;
+}
+.time-range-checkbox.is-checked .time-range-checkbox-input {
+  background: #3a84ff;
+  border-color: #3a84ff;
+  transition: all 0.1s;
+}
+.time-range-checkbox.is-checked .time-range-checkbox-input.small::after {
+  width: 3px;
+  height: 6px;
+}
+.time-range-checkbox.is-checked .time-range-checkbox-input::after {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 4px;
+  height: 8px;
+  border: 2px solid #fff;
+  border-top: 0;
+  border-left: 0;
+  content: '';
+  transform: translate(-50%, -60%) scaleY(1) rotate(45deg);
+  transform-origin: center;
+}
+.time-range-checkbox.is-indeterminated .time-range-checkbox-input {
+  background: #3a84ff;
+  border-color: #3a84ff;
+  transition: all 0.1s;
+}
+.time-range-checkbox.is-indeterminated .time-range-checkbox-input.small::after {
+  width: 6px;
+  height: 2px;
+}
+.time-range-checkbox.is-indeterminated .time-range-checkbox-input::after {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 8px;
+  height: 2px;
+  background: #fff;
+  border: none;
+  border-radius: 2px;
+  content: '';
+  transform: translate(-50%, -50%);
+}
+.time-range-checkbox.is-disabled {
+  color: #c4c6cc;
+  cursor: not-allowed;
+}
+.time-range-checkbox.is-disabled .time-range-checkbox-input {
+  background: #fafbfd;
+  border-color: #dcdee5;
+}
+.time-range-checkbox.is-disabled .time-range-checkbox-input::after {
+  background: #dcdee5;
+}
+.time-range-checkbox.is-disabled.is-checked .time-range-checkbox-input {
+  background: #a3c5fd;
+  border-color: #a3c5fd;
+}
+.time-range-checkbox.is-disabled.is-checked .time-range-checkbox-input::after {
+  background: #a3c5fd;
+}
+.time-range-checkbox.is-prechecking {
+  position: relative;
+}
+.time-range-checkbox.is-prechecking .time-range-checkbox-input {
+  visibility: hidden;
+}
+.time-range-checkbox-input {
+  position: relative;
+  display: inline-block;
+  width: 16px;
+  height: 16px;
+  vertical-align: middle;
+  border: 1px solid #979ba5;
+  border-radius: 2px;
+}
+.time-range-checkbox-input.small {
+  width: 14px;
+  height: 14px;
+}
+.time-range-checkbox-original {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: -1;
+  width: 0;
+  height: 0;
+}
+.time-range-checkbox-label {
+  display: inline-block;
+  margin-left: 6px;
+  vertical-align: middle;
+}
+.time-range-checkbox-checking {
+  position: absolute;
+  font-size: 16px;
+  color: #3a84ff;
+  animation: loading 1s linear infinite;
+}
+.time-range-F-scroll-x {
+  overflow-x: auto;
+  scrollbar-color: #a0a0a0 transparent;
+  scrollbar-width: thin;
+}
+.time-range-F-scroll-x::-webkit-scrollbar {
+  height: 6px;
+}
+.time-range-F-scroll-y {
+  overflow-y: auto;
+}
+.time-range-F-scroll-y::-webkit-scrollbar {
+  width: 4px;
+}
+.time-range-F-scroll-y::-webkit-scrollbar-thumb {
+  border-radius: 4px;
+}
+.time-range-scrollbar {
+  overflow: hidden !important;
+  overflow-anchor: none;
+  touch-action: auto;
+  /*
+ * Scrollbar rail styles
+ */
+  /*
+ * Scrollbar thumb styles
+ */
+}
+.time-range-scrollbar.time-range--active-x > .time-range__rail-x,
+.time-range-scrollbar.time-range--active-y > .time-range__rail-y {
+  display: block;
+}
+.time-range-scrollbar .time-range__rail-x:hover,
+.time-range-scrollbar .time-range__rail-y:hover,
+.time-range-scrollbar .time-range__rail-x:focus,
+.time-range-scrollbar .time-range__rail-y:focus,
+.time-range-scrollbar .time-range__rail-x.time-range--clicking,
+.time-range-scrollbar .time-range__rail-y.time-range--clicking {
+  background-color: #f0f1f5;
+}
+.time-range-scrollbar .time-range__rail-x {
+  display: none;
+  opacity: 0;
+  transition: background-color 0.2s linear, opacity 0.2s linear;
+  height: 10px;
+  bottom: 0px;
+  position: absolute;
+}
+.time-range-scrollbar .time-range__rail-x.time-range-size-small {
+  height: 8px;
+}
+.time-range-scrollbar .time-range__rail-x.time-range-size-small .time-range__thumb-x {
+  height: 6px;
+}
+.time-range-scrollbar .time-range__rail-y {
+  display: none;
+  opacity: 0;
+  transition: background-color 0.2s linear, opacity 0.2s linear;
+  width: 10px;
+  right: 0px;
+  position: absolute;
+  margin-right: 2px;
+}
+.time-range-scrollbar .time-range__rail-y.time-range-size-small {
+  width: 8px;
+}
+.time-range-scrollbar .time-range__rail-y.time-range-size-small .time-range__thumb-y {
+  width: 6px;
+}
+.time-range-scrollbar:hover > .time-range__rail-x,
+.time-range-scrollbar:hover > .time-range__rail-y,
+.time-range-scrollbar.time-range--focus > .time-range__rail-x,
+.time-range-scrollbar.time-range--focus > .time-range__rail-y,
+.time-range-scrollbar.time-range--scrolling-x > .time-range__rail-x,
+.time-range-scrollbar.time-range--scrolling-y > .time-range__rail-y {
+  opacity: 0.9;
+}
+.time-range-scrollbar .time-range__thumb-x {
+  background-color: #dcdee5;
+  border-radius: 8px;
+  transition: background-color 0.2s linear, height 0.2s ease-in-out;
+  height: 8px;
+  bottom: 0px;
+  position: absolute;
+}
+.time-range-scrollbar .time-range__thumb-y {
+  background-color: #dcdee5;
+  border-radius: 8px;
+  transition: background-color 0.2s linear, width 0.2s ease-in-out;
+  width: 8px;
+  right: 0px;
+  position: absolute;
+}
+.time-range-scrollbar .time-range__rail-x:hover > .time-range__thumb-x,
+.time-range-scrollbar .time-range__rail-x:focus > .time-range__thumb-x,
+.time-range-scrollbar .time-range__rail-x.time-range--clicking .time-range__thumb-x {
+  background-color: #979ba5;
+  height: 10px;
+}
+.time-range-scrollbar .time-range__rail-y:hover > .time-range__thumb-y,
+.time-range-scrollbar .time-range__rail-y:focus > .time-range__thumb-y,
+.time-range-scrollbar .time-range__rail-y.time-range--clicking .time-range__thumb-y {
+  background-color: #979ba5;
+  width: 10px;
+}
+.time-range-scrollbar .time-range-size-small > .time-range__thumb-x,
+.time-range-scrollbar .time-range-size-small > .time-range__thumb-x,
+.time-range-scrollbar .time-range-size-small.time-range--clicking .time-range__thumb-x {
+  height: 8px;
+}
+.time-range-scrollbar .time-range-size-small:hover > .time-range__thumb-y,
+.time-range-scrollbar .time-range-size-small:focus > .time-range__thumb-y,
+.time-range-scrollbar .time-range-size-small.time-range--clicking .time-range__thumb-y {
+  width: 8px;
+}
+/* MS supports */
+@supports (-ms-overflow-style: none) {
+  .time-range-scrollbar {
+    overflow: auto !important;
+  }
+}
+@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+  .time-range-scrollbar {
+    overflow: auto !important;
+  }
+}
+.time-range-virtual-render {
+  position: relative;
+}
+.time-range-virtual-render .time-range-virtual-section {
+  width: 1px;
+  background: transparent;
+}
+.time-range-tag {
+  display: inline-flex;
+  align-items: center;
+  height: 22px;
+  padding: 0 10px;
+  font-size: 12px;
+  line-height: 22px;
+  color: #63656e;
+  cursor: default;
+  background-color: #f0f1f5;
+  border-color: rgba(151, 155, 165, 0.3);
+  box-sizing: border-box;
+}
+.time-range-tag.time-range-tag-success {
+  color: #14a568;
+  border-color: rgba(20, 165, 104, 0.3);
+  background-color: #E4FAF0;
+}
+.time-range-tag.time-range-tag-success.time-range-tag-filled {
+  background-color: #14A568;
+}
+.time-range-tag.time-range-tag-success.time-range-tag-filled:hover {
+  background-color: #42B685;
+}
+.time-range-tag.time-range-tag-success:hover:not(.time-range-tag-filled) {
+  background-color: #C9F5E2;
+}
+.time-range-tag.time-range-tag-info {
+  color: #3a84ff;
+  border-color: rgba(58, 132, 255, 0.3);
+  background-color: #EDF4FF;
+}
+.time-range-tag.time-range-tag-info.time-range-tag-filled {
+  background-color: #3A84FF;
+}
+.time-range-tag.time-range-tag-info.time-range-tag-filled:hover {
+  background-color: #609CFE;
+}
+.time-range-tag.time-range-tag-info:hover:not(.time-range-tag-filled) {
+  background-color: #E1ECFF;
+}
+.time-range-tag.time-range-tag-warning {
+  color: #fe9c00;
+  border-color: rgba(254, 165, 0, 0.3);
+  background-color: #FFF1DB;
+}
+.time-range-tag.time-range-tag-warning.time-range-tag-filled {
+  background-color: #FE9C00;
+}
+.time-range-tag.time-range-tag-warning.time-range-tag-filled:hover {
+  background-color: #FDAF32;
+}
+.time-range-tag.time-range-tag-warning:hover:not(.time-range-tag-filled) {
+  background-color: #FFE8C3;
+}
+.time-range-tag.time-range-tag-danger {
+  color: #ea3636;
+  border-color: rgba(234, 53, 54, 0.3);
+  background-color: #FEEBEA;
+}
+.time-range-tag.time-range-tag-danger.time-range-tag-filled {
+  background-color: #EA3536;
+}
+.time-range-tag.time-range-tag-danger.time-range-tag-filled:hover {
+  background-color: #ED5C5D;
+}
+.time-range-tag.time-range-tag-danger:hover:not(.time-range-tag-filled) {
+  background-color: #FEDDDC;
+}
+.time-range-tag:hover {
+  background-color: #dcdee5;
+}
+.time-range-tag.time-range-tag-filled {
+  color: #fff;
+  background-color: #979BA5;
+}
+.time-range-tag.time-range-tag-filled:hover {
+  background-color: #ACAFB6;
+}
+.time-range-tag.time-range-tag-stroke {
+  padding: 0 9px;
+  line-height: 20px;
+  border-style: solid;
+  border-width: 1px;
+}
+.time-range-tag.time-range-tag-closable {
+  padding: 0 4px 0 10px;
+}
+.time-range-tag.time-range-tag-checkable {
+  cursor: pointer;
+  background: none;
+}
+.time-range-tag.time-range-tag-checkable:hover {
+  background: #F0F1F5;
+}
+.time-range-tag.time-range-tag-check {
+  color: #fff;
+  background: #3a84ff;
+}
+.time-range-tag.time-range-tag-check:hover {
+  color: #fff;
+  background: #3a84ff;
+  opacity: 1;
+}
+.time-range-tag--default {
+  padding: 0 8px;
+}
+.time-range-tag--small {
+  height: 16px;
+  padding: 0 4px;
+  line-height: 16px;
+}
+.time-range-tag--small .time-range-tag-text {
+  font-size: 10px;
+}
+.time-range-tag-text {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.time-range-tag-icon {
+  flex-shrink: 0;
+  margin-right: 4px;
+  font-size: 14px;
+  line-height: 0;
+}
+.time-range-tag-close {
+  flex-shrink: 0;
+  margin-left: 4px;
+  font-size: 12px;
+  line-height: 0;
+  cursor: pointer;
+}
+.time-range-exception {
+  position: relative;
+  display: flex;
+  width: 100%;
+  align-items: center;
+  flex-direction: column;
+  text-align: center;
+}
+.time-range-exception-img {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.time-range-exception-img .exception-image {
+  display: block;
+  height: 100%;
+  object-fit: contain;
+}
+.time-range-exception-title {
+  color: #313238;
+}
+.time-range-exception-description {
+  color: #63656e;
+}
+.time-range-exception-page .time-range-exception-img {
+  width: 480px;
+  height: 240px;
+}
+.time-range-exception-page .time-range-exception-title {
+  margin-top: 18px;
+  font-size: 24px;
+  line-height: 32px;
+}
+.time-range-exception-page .time-range-exception-description {
+  margin-top: 16px;
+  font-size: 14px;
+  line-height: 22px;
+}
+.time-range-exception-page .time-range-exception-footer {
+  margin-top: 24px;
+}
+.time-range-exception-part .time-range-exception-img {
+  width: 120px;
+  height: 100px;
+}
+.time-range-exception-part .time-range-exception-title {
+  margin-top: 8px;
+  font-size: 14px;
+  line-height: 22px;
+}
+.time-range-exception-part .time-range-exception-description {
+  margin-top: 8px;
+  font-size: 12px;
+  line-height: 20px;
+}
+.time-range-exception-part .time-range-exception-footer {
+  margin-top: 8px;
+}
+.time-range-popover.time-range-pop-confirm-box {
+  padding: 16px;
+}
+.time-range-pop-confirm-title {
+  font-size: 14px;
+  color: #313238;
+  padding-bottom: 16px;
+}
+.time-range-pop-confirm-icon {
+  color: #ff5656;
+  margin-right: 4px;
+  vertical-align: middle;
+  line-height: 1;
+}
+.time-range-pop-confirm-content {
+  font-size: 12px;
+  color: #63656e;
+  padding: 0 0 16px;
+}
+.time-range-pop-confirm-simple {
+  font-size: 14px;
+}
+.time-range-pop-confirm-footer {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+}
+.time-range-pop-confirm-footer .time-range-button {
+  margin-left: 8px;
+}
+.time-range-tab {
+  position: relative;
+  display: flex;
+}
+.time-range-tab--top {
+  flex-direction: column;
+}
+.time-range-tab--right {
+  flex-direction: row-reverse;
+}
+.time-range-tab-header {
+  position: relative;
+  display: flex;
+  color: #63656e;
+}
+.time-range-tab--left .time-range-tab-header {
+  border-right: 1px solid #dcdee5;
+}
+.time-range-tab--right .time-range-tab-header {
+  border-left: 1px solid #dcdee5;
+}
+.time-range-tab--vertical-tab .time-range-tab-header {
+  border: 0;
+}
+.time-range-tab--left .time-range-tab-header,
+.time-range-tab--right .time-range-tab-header {
+  flex-direction: column;
+}
+.time-range-tab--left .time-range-tab-header .time-range-tab-header-item .time-range-tab-header--has-num,
+.time-range-tab--right .time-range-tab-header .time-range-tab-header-item .time-range-tab-header--has-num {
+  width: 100%;
+}
+.time-range-tab--left .time-range-tab-header .time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square,
+.time-range-tab--right .time-range-tab-header .time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square {
+  border-radius: 2px;
+}
+.time-range-tab--left .time-range-tab-header .time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square,
+.time-range-tab--right .time-range-tab-header .time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square,
+.time-range-tab--left .time-range-tab-header .time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-elliptic,
+.time-range-tab--right .time-range-tab-header .time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-elliptic {
+  background-color: #A3C5FD;
+  color: white;
+}
+.time-range-tab--left .time-range-tab-header > div,
+.time-range-tab--right .time-range-tab-header > div {
+  flex-direction: column;
+}
+.time-range-tab--card-tab .time-range-tab-header,
+.time-range-tab--vertical-tab .time-range-tab-header {
+  background: #F0F1F5;
+}
+.time-range-tab--card-tab .time-range-tab-header {
+  border-radius: 4px 4px 0;
+}
+.time-range-tab--card-tab .time-range-tab-header .time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square {
+  background-color: white;
+}
+.time-range-tab--card-tab .time-range-tab-header .time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-elliptic {
+  background-color: white;
+  color: #63656e;
+}
+.time-range-tab--card-tab .time-range-tab-header .time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square,
+.time-range-tab--card-tab .time-range-tab-header .time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-elliptic {
+  background-color: #A3C5FD;
+  color: white;
+}
+.time-range-tab--card .time-range-tab-header,
+.time-range-tab--vertical-card .time-range-tab-header {
+  border-bottom: 1px solid #dcdee5;
+}
+.time-range-tab--border-card .time-range-tab-header {
+  border: solid #dcdee5;
+  border-width: 1px 1px 1px 0;
+}
+.time-range-tab--border-card .time-range-tab-header {
+  background: #FAFBFD;
+}
+.time-range-tab--unborder-card .time-range-tab-header {
+  border-bottom: 1px solid #dcdee5;
+}
+.time-range-tab-header > div {
+  display: flex;
+  flex-wrap: nowrap;
+}
+.time-range-tab--card .time-range-tab-header > div,
+.time-range-tab--vertical-card .time-range-tab-header > div,
+.time-range-tab--border-card .time-range-tab-header > div {
+  margin-bottom: -1px;
+}
+.time-range-tab-header-nav {
+  position: relative;
+}
+.time-range-tab--top .time-range-tab-header-nav {
+  overflow-x: auto;
+  overflow-y: visible;
+}
+.time-range-tab--left .time-range-tab-header-nav,
+.time-range-tab--right .time-range-tab-header-nav {
+  overflow-x: visible;
+  overflow-y: auto;
+}
+.time-range-tab--card .time-range-tab-header-nav,
+.time-range-tab--border-card .time-range-tab-header-nav,
+.time-range-tab--vertical-card .time-range-tab-header-nav {
+  border-left: 1px solid #dcdee5;
+}
+.time-range-tab-header-nav::-webkit-scrollbar {
+  display: none;
+  width: 0;
+  height: 0;
+}
+.time-range-tab-header-next,
+.time-range-tab-header-prev {
+  position: absolute;
+  top: 1px;
+  bottom: 1px;
+  width: 15px;
+  background: #fff;
+  content: '';
+}
+.time-range-tab-header-prev {
+  left: 1px;
+}
+.time-range-tab-header-next {
+  right: 1px;
+}
+.time-range-tab-header-operation .time-range-tab-header-item {
+  padding: 0 12px;
+}
+.time-range-tab-header-setting {
+  justify-self: flex-end;
+  margin-left: auto;
+  white-space: nowrap;
+}
+.time-range-tab-header-item {
+  display: flex;
+  white-space: nowrap;
+  cursor: pointer;
+  justify-content: center;
+  align-items: center;
+}
+.time-range-tab--top .time-range-tab-header-item {
+  padding: 0 20px;
+}
+.time-range-tab--left .time-range-tab-header-item,
+.time-range-tab--right .time-range-tab-header-item {
+  padding: 0 12px;
+}
+.time-range-tab--left .time-range-tab-header-item {
+  text-align: right;
+}
+.time-range-tab--card .time-range-tab-header-item,
+.time-range-tab--vertical-card .time-range-tab-header-item {
+  border-top: 1px solid #dcdee5;
+}
+.time-range-tab--card .time-range-tab-header-item,
+.time-range-tab--border-card .time-range-tab-header-item,
+.time-range-tab--vertical-card .time-range-tab-header-item {
+  border-right: 1px solid #dcdee5;
+}
+.time-range-tab--card-tab .time-range-tab-header-item {
+  position: relative;
+}
+.time-range-tab--card-tab .time-range-tab-header-item:not(:first-of-type):before,
+.time-range-tab--card-tab .time-range-tab-header-item:last-of-type:after {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  display: block;
+  width: 1px;
+  height: 16px;
+  margin-top: -8px;
+  background: #c4c6cc;
+  content: '';
+}
+.time-range-tab--card-tab .time-range-tab-header-item:last-of-type:after {
+  right: 0;
+  left: initial;
+}
+.time-range-tab--card-grid .time-range-tab-header-item {
+  height: 40px;
+  margin-right: 8px;
+  line-height: 40px;
+  background: #eaebf0;
+  border-radius: 4px 4px 0 0;
+}
+.time-range-tab-header-operation .time-range-tab-header-item {
+  padding-right: 12px;
+  padding-left: 12px;
+}
+.time-range-tab-header-item .time-range-tab-header--has-num {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.time-range-tab-header-item .time-range-tab-header--has-num-right {
+  margin-left: 4px;
+  display: flex;
+  align-items: center;
+  color: #63656e;
+}
+.time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-default,
+.time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-bracket {
+  color: #63656e;
+}
+.time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square,
+.time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-elliptic {
+  background-color: #F0F1F5;
+  color: #979ba5;
+  padding: 0 8px;
+  line-height: 18px;
+  text-align: center;
+}
+.time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square {
+  border-radius: 2px;
+}
+.time-range-tab-header-item .time-range-tab-header--has-num-right .time-range-tab-header--has-num-elliptic {
+  border-radius: 18px;
+}
+.time-range-tab-header-item:hover {
+  color: #3a84ff;
+}
+.time-range-tab-header-item:hover .time-range-tab-header--close {
+  display: block;
+  margin-left: 5px;
+  color: #ea3636;
+}
+.time-range-tab-header--active {
+  color: #3a84ff;
+  /* 激活边框，跟随，不再用固定样式
+      //.@{bk-prefix}-tab--unborder-card & {
+      //  border-bottom: 2px solid @tab-active;
+      //}
+      .@{bk-prefix}-tab--left:not(.@{bk-prefix}-tab--vertical-tab) & {
+        border-right: 2px solid @tab-active;
+      }
+      .@{bk-prefix}-tab--right:not(.@{bk-prefix}-tab--vertical-tab) & {
+        border-left: 2px solid @tab-active;
+      }
+      */
+}
+.time-range-tab--card .time-range-tab-header--active,
+.time-range-tab--border-card .time-range-tab-header--active,
+.time-range-tab--vertical-card .time-range-tab-header--active {
+  background: white;
+  border-bottom-color: white;
+}
+.time-range-tab--card-tab .time-range-tab-header--active,
+.time-range-tab--vertical-tab .time-range-tab-header--active {
+  background: #fff;
+}
+.time-range-tab--card-tab .time-range-tab-header--active {
+  border-radius: 4px 4px 0 0;
+}
+.time-range-tab--card-tab .time-range-tab-header--active:after,
+.time-range-tab--card-tab .time-range-tab-header--active:before,
+.time-range-tab--card-tab .time-range-tab-header--active + .time-range-tab-header-item:before {
+  /* stylelint-disable-next-line declaration-no-important */
+  display: none !important;
+}
+.time-range-tab--card-grid .time-range-tab-header--active {
+  background: #fff;
+}
+.time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-bracket,
+.time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square,
+.time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-elliptic {
+  color: #3a84ff;
+}
+.time-range-tab-header--active .time-range-tab-header--has-num-right .time-range-tab-header--has-num-square {
+  background-color: #E1ECFF;
+}
+.time-range-tab-header--close {
+  display: none;
+  font-size: 16px;
+  color: #c4c6cc;
+}
+.time-range-tab-header--disabled {
+  cursor: not-allowed;
+}
+.time-range-tab-header--disabled,
+.time-range-tab-header--disabled:hover {
+  color: #aaa;
+}
+.time-range-tab-header-active-bar {
+  position: absolute;
+  width: 0;
+  height: 0;
+  background: #3a84ff;
+  transition: all ease-in 300ms;
+}
+.time-range-tab-content {
+  flex: 1;
+  padding: 10px;
+}
+.time-range-tab--border-card .time-range-tab-content,
+.time-range-tab--vertical-card .time-range-tab-content {
+  border: solid #dcdee5;
+  border-width: 0 1px 1px;
+}
+.time-range-tab--card-grid .time-range-tab-content {
+  background: #fff;
+  border-radius: 0 4px 4px 4px;
+  box-shadow: 0 2px 4px 0 #1919290d;
+}
+.time-range-tab-panel {
+  height: 100%;
+}
+.bk-timezone-picker {
+  width: 100%;
+}
+.bk-timezone-picker-option {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  color: #63656e;
+}
+.bk-timezone-picker-option .option-name {
+  flex: 1;
+}
+.bk-timezone-picker-option .option-country {
+  display: flex;
+  width: 100%;
+  margin-left: 6px;
+  color: #999;
+}
+.bk-timezone-picker-option .option-utc {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 20px;
+  padding: 0 8px;
+  background: #f0f1f5;
+  border-radius: 2px;
+}
+.bk-timezone-picker-option.is-selected {
+  color: #3a84ff;
+}
+.bk-timezone-picker-option.is-selected .option-country {
+  color: #699df4;
+}
+.bk-timezone-picker-option.is-selected .option-utc {
+  color: white;
+  background-color: #699df4;
+}
+/* stylelint-disable-next-line selector-class-pattern */
+.__bk-timezone-picker-popover__ {
+  width: fit-content !important;
+}.common-panel-tab {
+  display: flex;
+  align-items: center;
+}
+.common-panel-tab .time-range-tab-header {
+  /* stylelint-disable-next-line declaration-no-important */
+  line-height: 20px !important;
+  /* stylelint-disable-next-line declaration-no-important */
+  border-bottom: 0 !important;
+}
+.common-panel-tab .time-range-tab-header .time-range-tab-header-item {
+  padding: 0;
+  padding-bottom: 4px;
+  margin-right: 28px;
+}
+.common-panel-tab .time-range-tab-header--active {
+  font-weight: 700;
+  color: #63656e;
+}
+.common-panel-tab .time-range-tab-content {
+  display: none;
+  width: 0;
+  height: 0;
+}.common-date-list[data-v-ed496942] {
+  flex: 0 0 50%;
+}
+.common-date-list[data-v-ed496942]:last-child {
+  padding-left: 12px;
+}
+.common-date-list .list-item[data-v-ed496942] {
+  display: inline-flex;
+  align-items: center;
+  min-width: calc(33.33% - 8px);
+  height: 28px;
+  padding: 0 8px;
+  margin-right: 8px;
+  margin-bottom: 8px;
+  color: #313238;
+  cursor: pointer;
+  background: #f5f7fa;
+  border-radius: 2px;
+}
+.common-date-list .list-item.is-selected[data-v-ed496942] {
+  color: #3a84ff;
+  background: #e1ecff;
+}
+.common-date-list .list-item.is-disabled[data-v-ed496942] {
+  color: #c4c6cc;
+  cursor: not-allowed;
+  background: #f5f7fa;
+}
+.common-date-list .list-item[data-v-ed496942]:not(.is-disabled):hover {
+  color: #3a84ff;
+  background: #e1ecff;
+}
+.common-wrapper[data-v-ed496942] {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 139px;
+  max-height: 139px;
+  overflow: auto;
+}
+.common-wrapper .empty-content[data-v-ed496942] {
+  height: 100px;
+  max-height: 100px;
+}
+.common-wrapper .empty-tips[data-v-ed496942] {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}.common-submit {
+  flex: 0 0 64px;
+  width: 64px;
+  margin-left: 8px;
+}
+.common-favorite {
+  display: flex;
+  flex: 0 0 32px;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  margin-left: 8px;
+  cursor: pointer;
+  background: #f5f7fa;
+  border-radius: 2px;
+}
+.common-favorite:hover svg path {
+  fill: #3a84ff;
+}/* stylelint-disable declaration-no-important */
+.date-panel {
+  display: flex;
+  flex-direction: column;
+  width: 220px;
+  user-select: none;
+  background: #fff;
+  border: 1px solid #dcdee5;
+  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1019607843);
+}
+.date-panel-title {
+  display: flex;
+  flex: 0 0 40px;
+  align-items: center;
+  height: 40px;
+  padding: 0 12px;
+  color: #63656e;
+  border-bottom: 1px solid #dcdee5;
+}
+.date-panel-title .title-check {
+  margin-left: auto;
+}
+.date-panel-title .title-check .time-range-checkbox {
+  pointer-events: none;
+}
+.date-panel-main {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  padding: 8px 0 12px;
+}
+.date-panel-main .date-header {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 24px;
+}
+.date-panel-main .date-header-center {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  font-size: 14px;
+  font-weight: 700;
+}
+.date-panel-main .date-header-center .date-split {
+  width: 5px;
+  height: 2px;
+  margin: 0 10px;
+  background-color: #63656e;
+}
+.date-panel-main .date-header-right, .date-panel-main .date-header-left {
+  display: flex;
+  align-items: center;
+  height: 100%;
+  padding: 0 6px;
+  font-size: 16px;
+}
+.date-panel-main .date-header-right .hand-icon, .date-panel-main .date-header-left .hand-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 16px;
+  font-weight: bold;
+  color: #979ba5;
+}
+.date-panel-main .date-header-right .hand-icon svg, .date-panel-main .date-header-left .hand-icon svg {
+  width: 20px !important;
+  height: 20px !important;
+  font-weight: bold;
+}
+.date-panel-main .date-header-right .hand-icon:hover, .date-panel-main .date-header-left .hand-icon:hover {
+  color: #3a84ff;
+  cursor: pointer;
+}
+.date-panel-main .date-header-right .hand-icon:hover svg, .date-panel-main .date-header-left .hand-icon:hover svg {
+  fill: #3a84ff;
+}
+.date-panel-main .date-header-right {
+  margin-left: auto;
+}
+.date-panel-main .date-content {
+  display: flex;
+  flex-direction: column;
+}
+.date-panel-main .date-content .date-grid {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  padding: 0 12px;
+  margin: 0;
+}
+.date-panel-main .date-content .date-grid-item {
+  display: flex;
+  flex: 0 0 14.285%;
+  align-items: center;
+  justify-content: center;
+  width: 14.285%;
+  min-width: 28px;
+  height: 24px;
+}
+.date-panel-main .date-content .date-grid-item:not(.not-click):hover {
+  cursor: pointer;
+  background-color: #f0f1f5;
+}
+.date-panel-main .date-content .date-grid-item.is-today {
+  color: #3a84ff;
+  border: 1px solid #a3c5fd;
+  border-radius: 2px;
+}
+.date-panel-main .date-content .date-grid-item.is-last-month {
+  color: #c4c6cc;
+  background-color: #f0f1f5;
+}
+.date-panel-main .date-content .date-grid-item.is-next-month {
+  color: #c4c6cc;
+}
+.date-panel-main .date-content .date-grid-item.is-disabled {
+  color: #c4c6cc !important;
+  cursor: not-allowed !important;
+  background-color: #f5f7fa !important;
+}
+.date-panel-main .date-content .date-grid-item.is-selected {
+  color: #fff !important;
+  background-color: #3a84ff !important;
+  border-radius: 2px;
+}/* stylelint-disable declaration-no-important */
+.date-wrapper {
+  display: flex;
+  flex-direction: column;
+}
+.date-wrapper .date-input {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  min-height: 56px;
+}
+.date-wrapper .date-input .date-picker {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  min-width: 376px;
+  height: 32px;
+  background: #fff;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+}
+.date-wrapper .date-input .date-picker-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 6px;
+  margin-left: 8px;
+}
+.date-wrapper .date-input .date-picker-start, .date-wrapper .date-input .date-picker-end {
+  flex: 1 1 160px;
+  min-width: 160px;
+  height: 24px;
+  padding: 0 4px;
+  font-size: 12px;
+  color: #63656e;
+  border: none;
+  border-radius: 2px;
+}
+.date-wrapper .date-input .date-picker-start:focus, .date-wrapper .date-input .date-picker-end:focus {
+  outline: none;
+  background: #e1ecff;
+  border: none;
+  box-shadow: none;
+}
+.date-wrapper .date-input .date-picker-split {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 8px;
+  color: #979ba5;
+}
+.date-wrapper .date-input .date-picker-clear {
+  visibility: hidden !important;
+  flex: 0 0 32px;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  font-size: 14px;
+  color: #c4c6cc;
+}
+.date-wrapper .date-input .date-picker-clear:hover {
+  color: #63656e;
+  cursor: pointer;
+}
+.date-wrapper .date-input .date-picker:hover .date-picker-clear {
+  visibility: visible !important;
+}
+.date-wrapper .show-format {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  min-width: 100%;
+  margin: -4px 0 8px;
+  color: #979ba5;
+}
+.date-wrapper .show-format .format-button {
+  margin-left: 0;
+}
+.date-format-wrapper {
+  display: flex;
+  flex-direction: column;
+  width: 500px;
+  background: #fff;
+  border: 1px solid #dcdee5;
+  border-radius: 2px;
+  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1019607843);
+}
+.date-format-wrapper .content-title {
+  margin-bottom: 12px;
+  font-weight: bold;
+  line-height: 20px;
+}
+.date-format-wrapper .content-table {
+  display: flex;
+  flex-direction: column;
+  padding: 6px 0;
+  border-collapse: collapse;
+  background-color: #fff;
+  border-top: 0;
+  border-left: 0;
+}
+.date-format-wrapper .content-table th,
+.date-format-wrapper .content-table td {
+  height: 32px;
+  padding: 0 10px;
+  line-height: 32px;
+  color: #63656e;
+  text-align: left;
+  border-right: 0;
+  border-bottom: 0;
+}
+.date-format-wrapper .content-table thead,
+.date-format-wrapper .content-table tr {
+  display: flex;
+  align-items: center;
+  width: 100%;
+}
+.date-format-wrapper .content-table thead th,
+.date-format-wrapper .content-table tr th {
+  flex: 1;
+  background-color: #fafbfd;
+}
+.date-format-wrapper .content-table tbody {
+  display: block;
+  width: 100%;
+  max-height: 300px;
+  overflow: auto;
+}
+.date-format-wrapper .content-table tbody td {
+  display: flex;
+  flex: 1;
+  align-items: center;
+}
+.date-format-wrapper.enable-format-click tr {
+  cursor: pointer;
+}
+.date-format-wrapper.enable-format-click tr:hover {
+  background: #f0f5ff;
+}
+.date-format-wrapper.enable-format-click tr:hover td {
+  color: #3a84ff;
+}.date-title[data-v-03d5d182] {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 20px;
+  font-size: 12px;
+  font-weight: 700;
+  line-height: 20px;
+  color: #313238;
+}
+.date-title .date-title-item[data-v-03d5d182] {
+  display: flex;
+  flex: 1;
+  align-items: center;
+}
+.date-title .date-title-item[data-v-03d5d182]:last-child {
+  padding-left: 28px;
+}
+.date-title .date-title-item .delete-all[data-v-03d5d182] {
+  margin-left: 8px;
+  font-size: 12px;
+}
+.date-title .date-title-item .delete-all[data-v-03d5d182]:hover {
+  color: #3a84ff;
+  cursor: pointer;
+}.natural-picker {
+  display: flex;
+  align-items: center;
+  min-height: 56px;
+}
+.natural-picker .natural-date {
+  width: 256px;
+}
+.natural-picker .natural-unit {
+  width: 140px;
+  margin-left: 8px;
+}
+.natural-picker.is-invalid .time-range-input {
+  border-color: #ea3636;
+}
+.natural-custom-option {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  min-width: 250px;
+  height: 100%;
+  padding: 0 12px;
+  margin: 0 -12px;
+}
+.natural-custom-option .time-range-input {
+  background-color: white;
+}.baseline-picker {
+  display: flex;
+  align-items: center;
+  min-height: 56px;
+  margin-right: -1px;
+}
+.baseline-picker-select {
+  width: 208px;
+}
+.baseline-picker-select .time-range-input {
+  margin-right: -4px;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.baseline-custom-option {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  padding: 0 12px;
+  margin: 0 -12px;
+}
+.baseline-custom-option .time-range-input {
+  background-color: white;
+}
+.baseline-custom-option .specific-date {
+  position: relative;
+  display: flex;
+  align-items: center;
+  width: 174px;
+  height: 26px;
+  background: #fff;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+}
+.baseline-custom-option .specific-date-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 6px;
+  margin-left: 8px;
+}
+.baseline-custom-option .specific-date-input {
+  width: 140px;
+  height: 20px;
+  padding: 0 4px;
+  font-size: 12px;
+  color: #63656e;
+  border: none;
+  border-radius: 2px;
+}
+.baseline-custom-option .specific-date-input:focus {
+  outline: none;
+  background: #e1ecff;
+  border: none;
+  box-shadow: none;
+}
+.baseline-custom-option .specific-date-panel {
+  position: fixed;
+  top: 166px;
+  left: 188px;
+  z-index: 1000;
+  border-radius: 2px;
+}.recent-picker {
+  display: flex;
+  align-items: center;
+  min-height: 56px;
+}
+.recent-picker .recent-input {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.recent-picker .recent-input.is-focused {
+  z-index: 2;
+}
+.recent-picker .recent-unit {
+  min-width: 64px;
+}
+.recent-picker .recent-unit .time-range-input {
+  margin-left: -1px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.recent-picker .recent-unit .time-range-input--text {
+  border-radius: 0;
+}
+.recent-picker.is-invalid .recent-input {
+  border-color: #ea3636;
+}
+.recent-picker.is-invalid .time-range-input {
+  border-color: #ea3636;
+}.panel-wrapper {
+  width: 618px;
+  padding: 12px 16px 0;
+  background: #fff;
+  border: 1px solid #dcdee5;
+  border-radius: 2px;
+  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1019607843);
+}
+.panel-wrapper .date-list-wrapper {
+  display: flex;
+  height: 160px;
+  max-height: 160px;
+  padding: 0;
+  padding-bottom: 4px;
+  margin: 8px -10px 0 0;
+  overflow: auto;
+}
+.panel-wrapper .date-pick-tab {
+  padding-top: 12px;
+  border-top: 1px solid #eaebf0;
+}
+.panel-wrapper .date-pick-tab .time-range-tab-header-item {
+  /* stylelint-disable-next-line declaration-no-important */
+  margin-right: 20px !important;
+}
+.panel-wrapper .time-zone-panel {
+  display: flex;
+  align-items: center;
+  height: 45px;
+  padding: 0 16px;
+  margin: 0 -16px;
+  color: #313238;
+  background: #fafbfd;
+  border-top: 1px solid #dcdee5;
+}
+.panel-wrapper .time-zone-panel .time-zone {
+  display: flex;
+  align-items: center;
+  margin: 0 8px;
+}
+.panel-wrapper .time-zone-panel .time-zone-area {
+  display: flex;
+  align-items: center;
+  margin-left: 8px;
+  color: #979ba5;
+}
+.panel-wrapper .time-zone-panel .time-zone-tag {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 79px;
+  height: 20px;
+  color: #63656e;
+  border: 1px solid #dcdee5;
+  border-radius: 2px;
+}
+.panel-wrapper .time-zone-panel .time-zone-btn {
+  margin-left: auto;
+}
+.panel-wrapper .time-zone-picker {
+  margin: 8px 0;
+}.__bk_date_picker__ {
+  box-sizing: border-box;
+  display: inline-flex;
+  align-items: center;
+  height: 32px;
+  padding: 0 4px;
+  font-size: 12px;
+  color: #63656e;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
+  /* stylelint-disable-next-line no-descending-specificity */
+}
+.__bk_date_picker__ div::-webkit-scrollbar,
+.__bk_date_picker__ ul::-webkit-scrollbar,
+.__bk_date_picker__ section::-webkit-scrollbar,
+.__bk_date_picker__ tbody::-webkit-scrollbar,
+.__bk_date_picker__ article::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+.__bk_date_picker__ div::-webkit-scrollbar-thumb,
+.__bk_date_picker__ ul::-webkit-scrollbar-thumb,
+.__bk_date_picker__ section::-webkit-scrollbar-thumb,
+.__bk_date_picker__ tbody::-webkit-scrollbar-thumb,
+.__bk_date_picker__ article::-webkit-scrollbar-thumb {
+  background: #ddd;
+  border-radius: 20px;
+  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
+}
+.__bk_date_picker__ .date-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  font-size: 20px;
+  font-weight: bold;
+  color: #989ca7;
+  background: #f5f7fa;
+  border-radius: 2px;
+}
+.__bk_date_picker__ .date-icon-left, .__bk_date_picker__ .date-icon-right {
+  display: inline-flex;
+}
+.__bk_date_picker__ .date-icon-left svg, .__bk_date_picker__ .date-icon-right svg {
+  /* stylelint-disable-next-line declaration-no-important */
+  width: 20px !important;
+  /* stylelint-disable-next-line declaration-no-important */
+  height: 20px !important;
+}
+.__bk_date_picker__ .date-icon:hover {
+  cursor: pointer;
+  background-color: #f0f1f5;
+}
+.__bk_date_picker__.is-simplicity {
+  border-color: transparent;
+}
+.__bk_date_picker__.is-simplicity .date-icon {
+  background-color: transparent;
+}
+.__bk_date_picker__.is-simplicity .date-icon:hover {
+  cursor: pointer;
+  background-color: #f0f1f5;
+}
+.__bk_date_picker__.is-disabled {
+  color: #c4c6cc;
+  cursor: not-allowed;
+  /* stylelint-disable-next-line no-descending-specificity */
+}
+.__bk_date_picker__.is-disabled .date-icon {
+  color: #c4c6cc;
+  pointer-events: none;
+}
+.__bk_date_picker__.is-disabled .date-content {
+  pointer-events: none;
+  cursor: not-allowed;
+}
+.__bk_date_picker__ .date-content {
+  display: flex;
+  align-items: center;
+  height: 24px;
+  padding: 0 6px;
+  margin: 0 4px;
+  user-select: none;
+  border-radius: 2px;
+}
+.__bk_date_picker__ .date-content-icon {
+  margin-right: 4px;
+}
+.__bk_date_picker__ .date-content-utc {
+  display: flex;
+  align-items: center;
+  margin-left: 4px;
+  font-weight: 700;
+  color: #ff9c01;
+}
+.__bk_date_picker__ .date-content:hover {
+  cursor: pointer;
+  background: #f5f7fa;
+}
+.__bk-date-picker-popover__ {
+  /* stylelint-disable-next-line declaration-no-important */
+  padding: 0 !important;
+  /* stylelint-disable-next-line declaration-no-important */
+  margin: 0 !important;
+  /* stylelint-disable-next-line declaration-no-important */
+  color: #63656e !important;
+}
+.__bk-date-picker-popover__ div::-webkit-scrollbar,
+.__bk-date-picker-popover__ ul::-webkit-scrollbar,
+.__bk-date-picker-popover__ section::-webkit-scrollbar,
+.__bk-date-picker-popover__ tbody::-webkit-scrollbar,
+.__bk-date-picker-popover__ article::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+.__bk-date-picker-popover__ div::-webkit-scrollbar-thumb,
+.__bk-date-picker-popover__ ul::-webkit-scrollbar-thumb,
+.__bk-date-picker-popover__ section::-webkit-scrollbar-thumb,
+.__bk-date-picker-popover__ tbody::-webkit-scrollbar-thumb,
+.__bk-date-picker-popover__ article::-webkit-scrollbar-thumb {
+  background: #ddd;
+  border-radius: 20px;
+  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
+}
+.__bk-date-picker-popover__.__bk-date-picker-baseline-popover__ {
+  /* stylelint-disable-next-line declaration-no-important */
+  overflow: inherit !important;
+}
+.__bk-date-picker-popover__.__bk-date-picker-baseline-popover__ .time-range-select-content {
+  transform: scale(1);
+}
+.__bk-date-picker-popover__.__date-picker-popover-specific__ {
+  position: absolute;
+}
+.__bk-date-picker-popover__ ul {
+  padding: 0;
+  margin: 0;
+}
+.__bk-date-picker-popover__ ul li {
+  list-style: none;
+}
+.__bk-date-picker-popover__ .time-range-select-search-wrapper .icon-search::before {
+  /* stylelint-disable-next-line declaration-no-important */
+  content: "" !important;
+}
+.__bk-date-picker-popover__ .time-range-pop-confirm {
+  /* stylelint-disable-next-line declaration-no-important */
+  margin: 20px 16px 16px !important;
+}
+.__date-tooltips__ {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  max-width: 156px;
+  line-height: 20px;
+}
+.__date-tooltips__ div::-webkit-scrollbar,
+.__date-tooltips__ ul::-webkit-scrollbar,
+.__date-tooltips__ section::-webkit-scrollbar,
+.__date-tooltips__ tbody::-webkit-scrollbar,
+.__date-tooltips__ article::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+.__date-tooltips__ div::-webkit-scrollbar-thumb,
+.__date-tooltips__ ul::-webkit-scrollbar-thumb,
+.__date-tooltips__ section::-webkit-scrollbar-thumb,
+.__date-tooltips__ tbody::-webkit-scrollbar-thumb,
+.__date-tooltips__ article::-webkit-scrollbar-thumb {
+  background: #ddd;
+  border-radius: 20px;
+  box-shadow: inset 0 0 6px rgba(204, 204, 204, 0.3);
+}
+.__date-tooltips__ .date-tooltips-timezone {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  margin-top: 4px;
+  color: #ff9c01;
+}
+.__date-tooltips__ .date-tooltips-diff {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 4px;
+  margin-top: 4px;
+  color: white;
+  background: rgba(255, 255, 255, 0.12);
+  border-radius: 2px;
+}