.kui-body {background-color:#F6F8F9;}
:root {
    --kui-pro-side-width:60px;
}
:root[data-theme=dark] .kui-body {background-color:#1f1f1f;}

.kui-query-more .ant-row {gap:8px 0;}

/*OneKey*/
.kui-onekey {text-align:center;}
.kui-onekey > .tips {font-weight:bold;font-size:1.1rem;margin:20px 0 10px 0;}

/*Pro*/
.kui-pro {display:grid;grid-template-columns:var(--kui-pro-side-width) 200px calc(100vw - 200px - var(--kui-pro-side-width));}
.kui-pro.collapsed {grid-template-columns:var(--kui-pro-side-width) calc(100vw - var(--kui-pro-side-width));}
.kui-pro.collapsed > .kui-pro-menu {display:none;transition:all 0.3s;}
.kui-pro-side {background-color:#282C34;}
:root[data-theme=dark] .kui-pro-side {background-color:#141414;}
:root[data-theme=dark] .kui-pro .kui-logo {border-bottom:1px solid var(--kui-color-border);}
.kui-pro-side > .menu {
    display:flex;flex-direction:column;gap:5px;list-style:none;color:#fff;margin:0;padding:0;
    position:absolute;top:50px;left:0;bottom:0;width:var(--kui-pro-side-width);overflow-y:auto;overflow-x:hidden;scrollbar-width:none;
}
.kui-pro-side > .menu > li {text-align:center;margin:5px 6px;padding:5px;cursor:pointer;}
.kui-pro-side > .menu > li.active {border-radius:5px;transition:all 0.3s;}
.kui-pro-side > .menu > li .kui-icon {flex-direction:column;}
.kui-pro-side > .menu > li .icon-name {display:block;height:18px;overflow:hidden;}
.kui-pro-side > .kui-edit {margin:10px;padding:5px;}
.kui-pro-menu {background-color:var(--kui-bgcolor);}
.kui-pro-menu > .header {
    position:relative;text-align:center;height:54px;border-bottom:1px solid var(--kui-color-border);
    z-index:1000;margin-bottom:10px;background-color:var(--kui-bgcolor);
}
.kui-pro-menu > .header > h1 {font-size:20px;padding-top:5px;height:54px;overflow:hidden;}
.kui-pro-menu > .header > .name {
    position:absolute;left:60px;bottom:-10px;background-color:#fff;width:80px;
}
:root[data-theme=dark] .kui-pro-menu > .header > .name {background-color:#141414;}
.kui-pro-menu .ant-menu-vertical .ant-menu-item {padding-left:25px;}
.kui-pro-menu > .kui-scroll {top:64px;left:var(--kui-pro-side-width);}
.kui-pro-menu > .kui-plugin {height:calc(100vh - 64px);}

/*Console*/
.kui-console {height:300px;overflow-y:auto;background-color:#000;padding:5px;}
.kui-console .Info {color:#fff;}
.kui-console .Error {color:#a32540;}
.ant-modal-max .kui-console {height:100%;}

/*Scanner*/
.kui-scanner .ant-modal {position:absolute;top:30vh;}
.kui-scanner .ant-modal-header {border-bottom:none;}
.kui-scanner .ant-modal-close-x {width:40px;height:40px;line-height:40px;}
.kui-scanner .ant-modal-content,
.kui-scanner .ant-modal-body {position:absolute;top:0;left:0;right:0;bottom:0;padding:0;}
.kui-scanner video {width:100%;height:100%;}

/*Plugin*/
.kui-plugin-form .ant-table-wrapper {padding:0;}
.kui-plugin-form .ant-modal-body {padding-bottom:0;}
.kui-plugin-form .ant-modal-body .ant-tabs {height:100%;}
.kui-plugin-form .ant-drawer-body .ant-tabs {height:100%;}
.kui-plugin-form .ant-tabs-content {height:100%;}
.kui-plugin-form .ant-tabs-tabpane {position:relative;height:100%;min-height:360px;}
.kui-plugin-form .kui-code {position:absolute;top:0;left:0;right:0;bottom:10px;overflow:hidden;}
.kui-plugin-form .kui-code pre[class*=language-] {position:absolute;top:0;left:0;right:0;bottom:0;overflow:auto;}
.kui-plugin-form .ant-modal-max .kui-code {bottom:0;}
.ant-drawer-body .kui-plugin-form .kui-code {bottom:0;}

.kui-plugin-split {display:grid;grid-template-columns:98% 2%;height:100%;}
.kui-plugin-split.preview {grid-template-columns:58% 2% 40%;}
.kui-plugin-split .previewBar {display:flex;justify-content:center;padding:0 5px;}
.kui-plugin-split .previewBtn {display:flex;justify-content:center;align-items:center;background-color:var(--kui-color-border);}
.kui-plugin-split > div {max-height:460px;overflow-x:hidden;overflow-y:auto;}
.ant-modal-max .kui-plugin-split > div, 
.ant-modal-max .kui-code pre[class*=language-], 
.ant-drawer-body .kui-plugin-split > div,
.ant-drawer-body .kui-code pre[class*=language-] {max-height:unset;}

.kui-plugin-basic.kui-plugin-split.preview {grid-template-columns:38% 2% 60%;}

@media screen and (max-width:1024px) {
}
@media screen and (max-width:912px) {
}
@media screen and (max-width:768px) {
}
@media screen and (max-width:574px) {
    .kui-pro {grid-template-columns:60px 0 calc(100vw - 60px);}
    .kui-pro-menu > .header > .name {position:unset;}
}