@charset "UTF-8"; @font-face { font-family: "poppins"; src: url("/fonts/poppins/Poppins-Regular.ttf"); } .min-h1 { min-height: 100px; } .min-h2 { min-height: 200px; } .min-h3 { min-height: 300px; } .min-h4 { min-height: 400px; } .min-h5 { min-height: 500px; } .min-h6 { min-height: 600px; } .wp-100 { width: 100px; } .wp-200 { width: 200px; } .wp-300 { width: 300px; } .wp-400 { width: 400px; } .wp-500 { width: 500px; } .wp-600 { width: 600px; } .wp-700 { width: 700px; } .wp-800 { width: 800px; } .wp-900 { width: 900px; } .wp-1000 { width: 1000px; } .wp-100- { width: calc(100% - 100px); } .wp-200- { width: calc(100% - 200px); } .wp-300- { width: calc(100% - 300px); } .wp-400- { width: calc(100% - 400px); } .wp-500- { width: calc(100% - 500px); } .wp-600- { width: calc(100% - 600px); } .wp-700- { width: calc(100% - 700px); } .wp-800- { width: calc(100% - 800px); } .wp-900- { width: calc(100% - 900px); } .wp-1000- { width: calc(100% - 1000px); } .h-min-100 { min-height: 100px; } .h-min-200 { min-height: 200px; } .h-min-300 { min-height: 300px; } .h-min-400 { min-height: 400px; } .h-min-500 { min-height: 500px; } .h-min-600 { min-height: 600px; } .h-min-700 { min-height: 700px; } .h-min-800 { min-height: 800px; } .h-min-900 { min-height: 900px; } .h-min-1000 { min-height: 1000px; } .s-min-100 { min-width: 100px; } .s-min-200 { min-width: 200px; } .s-min-300 { min-width: 300px; } .s-min-400 { min-width: 400px; } .s-min-500 { min-width: 500px; } .s-min-600 { min-width: 600px; } .s-min-700 { min-width: 700px; } .s-min-800 { min-width: 800px; } .s-min-900 { min-width: 900px; } .s-min-1000 { min-width: 1000px; } .w-max-100 { max-width: 100px; } .w-max-200 { max-width: 200px; } .w-max-300 { max-width: 300px; } .w-max-400 { max-width: 400px; } .w-max-500 { max-width: 500px; } .w-max-600 { max-width: 600px; } .w-max-700 { max-width: 700px; } .w-max-800 { max-width: 800px; } .w-max-900 { max-width: 900px; } .w-max-1000 { max-width: 1000px; } .hp-100 { height: 100px; } .hp-200 { height: 200px; } .hp-300 { height: 300px; } .hp-400 { height: 400px; } .hp-500 { height: 500px; } .hp-600 { height: 600px; } .hp-700 { height: 700px; } .hp-800 { height: 800px; } .hp-900 { height: 900px; } .hp-1000 { height: 1000px; } .wh-10 { height: 10px; width: 10px; } .wh-20 { height: 20px; width: 20px; } .wh-30 { height: 30px; width: 30px; } .wh-40 { height: 40px; width: 40px; } .wh-50 { height: 50px; width: 50px; } .wh-60 { height: 60px; width: 60px; } .wh-70 { height: 70px; width: 70px; } .wh-80 { height: 80px; width: 80px; } .wh-90 { height: 90px; width: 90px; } .wh-100 { height: 100px; width: 100px; } .col-form-label.required::before { content: "*"; color: #f56c6c; font-size: 12px; font-weight: bold; margin-right: 5px; } .cursor-pointer { cursor: pointer; } .cursor-scroll { cursor: all-scroll; } .flex-1 { flex: 1; } .help-text { color: #B2B2B2; margin-top: 4px; font-size: 12px; } .font-size-12 { font-size: 12px; } .open-file-manager { cursor: pointer; } .file-manager-box .layui-layer-title { background-color: #293042; color: #fff; border-color: #404e72; } .file-manager-box .layui-layer-ico { background: url("/image/close.png") no-repeat; background-size: cover; background-position: center center; } .border-dashed { border-style: dashed !important; } .set-product-img { background-color: #f8f8f8; border: 1px dashed #e2e2e2; display: flex; cursor: pointer; align-items: center; justify-content: center; transition: all 0.2s ease; } .set-product-img:hover { background-color: #f1f1f1; } .main-content { display: flex; transition: margin-left 0.25s ease-in-out, left 0.25s ease-in-out, margin-right 0.25s ease-in-out, right 0.25s ease-in-out; width: 100%; height: calc(100vh - 60px); overflow: hidden; } @media screen and (max-width: 991px) { .main-content { margin-left: 260px; } } .main-content:not(.active) { margin-left: 0; } .main-content > #content { flex: 1; padding: 0 1rem 4rem; overflow-y: auto; } @media screen and (max-width: 991px) { .main-content > #content { padding: 0 1rem 1.5rem; } } .page-title-box { height: 64px; } .page-title-box .page-title { font-size: 1rem; margin: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: inherit; } .switch-plus { position: relative; width: 50px; height: 24px; margin-bottom: 1rem; } .switch-plus input { position: absolute; top: 0; z-index: 2; opacity: 0; cursor: pointer; height: 20px; width: 50px; left: 0; margin: 0; } .switch-plus input:checked { z-index: 1; } .switch-plus input:checked + label { opacity: 1; cursor: default; } .switch-plus input:checked + label:hover { opacity: 0.5; } .switch-plus input:checked ~ .toggle-outside .toggle-inside { left: 0.25rem; background-color: #fff; box-shadow: 0 3px 6px 0 rgba(140, 152, 164, 0.25); } .switch-plus input ~ input:checked ~ .toggle-outside { background-color: #fd560f; } .switch-plus input ~ input:checked ~ .toggle-outside .toggle-inside { left: 23px; background-color: #fff; } .switch-plus label { color: #fff; opacity: 0.33; transition: opacity 0.25s ease; cursor: pointer; font-size: 1.5rem; line-height: 3rem; display: inline-block; width: 50px; height: 100%; margin: 0; text-align: center; } .switch-plus label:last-of-type { margin-left: 50px; } .switch-plus .toggle-outside { height: 100%; border-radius: 2rem; padding: 2px; overflow: hidden; transition: 0.25s ease all; background-color: #e7eaf3; position: absolute; width: 46px; left: 0; } .switch-plus .toggle-inside { border-radius: 50%; position: absolute; transition: 0.25s ease all; height: 20px; width: 20px; } body.page-seller-product .share-link-pop .share-links-td { padding-top: 4px; padding-bottom: 4px; } body.page-seller-product .share-link-pop .share-links-code { width: 80px; height: 80px; overflow: hidden; } body.page-seller-product .share-link-pop .share-links-code img { max-width: 100%; } .filter-title { flex: 0 0 56px; margin-right: 10px; text-align: right; margin-bottom: 0; } .order-by-wrap i { line-height: 0.6; cursor: pointer; } .order-by-wrap i:hover { color: #000; } .order-by-wrap i:active { color: #fd560f; } .layui-layer-btn .layui-layer-btn0 { border: 1px solid #dedede; color: #333; background-color: #fff; } .layui-layer-btn .layui-layer-btn1 { background-color: #fd560f; border-color: #fd560f; color: #fff; } [v-cloak] { display: none; } .sidebar { background: #293042; direction: ltr; width: 190px; transition: all 0.2s ease-in-out; background: #fff; border-right: 1px solid #f1f1f1; } .sidebar .navbar-nav > li.nav-item { position: relative; } .sidebar .navbar-nav > li.nav-item a { padding: 0.6rem 1rem 0.6rem; color: #333; transition: all 0.1s ease-in-out; } .sidebar .navbar-nav > li.nav-item a i { margin-right: 7px; } .sidebar .navbar-nav > li.nav-item:hover { background-color: #f4f4f4; } .sidebar .navbar-nav > li.nav-item.active a { background-color: #eee; } .header-wrap { background-color: #fff; height: 54px; position: relative; display: flex; align-items: center; z-index: 9; box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.05); } .header-wrap .header-left { width: 190px; display: flex; align-items: center; justify-content: center; } .header-wrap .header-left .logo { max-width: 76%; max-height: 30px; } .header-wrap .header-right { display: flex; align-items: center; justify-content: space-between; flex: 1; } .header-wrap .header-right > .navbar { margin-bottom: 0; padding: 0; list-style: none; } .header-wrap .header-right > .navbar > li { padding: 0 1rem; } @media screen and (max-width: 991px) { .header-wrap .header-right > .navbar > li { padding: 0 0.3rem; } } .header-wrap .header-right > .navbar > li .dropdown:hover .nav-link { background-color: #eee; } .header-wrap .header-right > .navbar > li .dropdown:hover .dropdown-menu { display: block; } .header-wrap .header-right > .navbar > li .dropdown:hover .dropdown-menu.dropdown-menu-end { right: 0; left: auto; } .header-wrap .header-right > .navbar > li a.nav-link { color: #333; padding: 0 6px; height: 54px; display: flex; align-items: center; } .header-wrap .header-right > .navbar > li a.nav-link.show { background-color: #eee; } .header-wrap .header-right .navbar.navbar-left li a.nav-link { position: relative; } .header-wrap .header-right .navbar.navbar-left li a.nav-link:after { content: ""; position: absolute; left: 0; display: none; bottom: 0; width: 100%; height: 3px; background-color: #fd560f; } .header-wrap .header-right .navbar.navbar-left li.active, .header-wrap .header-right .navbar.navbar-left li:hover { font-weight: bold; } .header-wrap .header-right .navbar.navbar-left li.active a:after, .header-wrap .header-right .navbar.navbar-left li:hover a:after { display: block; } .header-wrap .header-right .navbar.navbar-right > li { padding: 0 0.5rem; } .header-wrap .header-right .navbar.navbar-right > li a.nav-link { padding: 0 10px; } .header-wrap .avatar { height: 36px; margin-bottom: -15px; margin-top: -15px; width: 36px; } hr.horizontal { background-color: transparent; height: 1px; margin: 1rem 0; color: inherit; border: 0; opacity: 0.25; } hr.horizontal.dark { background-image: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.4), transparent); } .nav-tabs.nav-bordered .nav-item { margin-left: 0.75rem; margin-right: 0.75rem; } .nav-tabs.nav-bordered .nav-item:first-child { margin-left: 0; } .nav-tabs.nav-bordered .nav-item:last-child { margin-right: 0; } .nav-tabs.nav-bordered .nav-item .nav-link { color: #6c757d; border: none; padding: 0 0.2rem 0.7rem; } .nav-tabs.nav-bordered .nav-item .nav-link.active { color: #1a1a1a; font-weight: bold; background-color: transparent; border-bottom: 2px solid #fd560f; } .card { box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 4px 0px; border: none; } .card .card-header { padding: 1rem 1rem 0.3rem; background-color: #fff; font-weight: bold; border-bottom: 0 solid rgba(0, 0, 0, 0.125); } .card .card-header:first-child { border-radius: 1rem 1rem 0 0; } .card .card-header .card-title { margin-bottom: 0; padding-left: 10px; border-left: 3px solid #fd560f; line-height: 1; } .card .card-body { padding: 1rem; } table.table thead th { background-color: #f9fbfd; font-size: 0.825rem; border-top-width: 0; border-bottom: none; white-space: nowrap; } table.table td { font-size: 0.8125rem; vertical-align: middle; } table.table.table-striped > tbody > tr:nth-of-type(odd) { background: transparent; } table.table.table-striped > tbody > tr:nth-of-type(2n) { background: #f9fbfd; } .form-group { margin-bottom: 1.375rem; } .btn { font-size: 0.8rem; } .btn-check { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none; } .btn-group-radio .btn-group label:first-of-type { border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } .btn-group-radio .btn-check:active + .btn-outline-primary, .btn-group-radio .btn-check:checked + .btn-outline-primary, .btn-group-radio .btn-outline-primary.active, .btn-group-radio .btn-outline-primary.dropdown-toggle.show, .btn-group-radio .btn-outline-primary:active { color: #fff; background-color: #0d6efd; border-color: #0d6efd; } .btn-group-radio.btn-group-radio-pay .btn-check:active + .btn, .btn-group-radio.btn-group-radio-pay .btn-check:checked + .btn, .btn-group-radio.btn-group-radio-pay .btn.active, .btn-group-radio.btn-group-radio-pay .btn.dropdown-toggle.show, .btn-group-radio.btn-group-radio-pay .btn:active { color: #fff; background-color: transparent; padding: 0.32rem 0.7rem; border: 2px solid #0d6efd; } .btn-group-radio.btn-group-radio-pay .btn-group-radios { display: flex; } .btn-group-radio.btn-group-radio-pay label.btn { height: 56px; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; } .btn-group-radio.btn-group-radio-pay label.btn:hover { border-color: #0d6efd; } .btn-group-radio.btn-group-radio-pay img { max-width: 140px; height: 42px; } .bd-callout { padding: 1.25rem; margin-top: 1.25rem; margin-bottom: 1.25rem; border: 1px solid #eee; border-left-width: 0.25rem; border-radius: 0.25rem; } .bd-callout.bd-callout-info { border-left-color: #5bc0de; } .bd-callout p { margin-bottom: 0; } @media (min-width: 1400px) { .col-xxl-20 { flex: 0 0 20%; max-width: 20%; } } .form-control:focus { box-shadow: none; } .form-max-w { max-width: 560px; } @font-face { font-family: "iconfont"; src: url("/fonts/iconfont/iconfont.woff") format("woff"), url("/fonts/iconfont/iconfont.ttf") format("truetype"); /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/ } .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0; -moz-osx-font-smoothing: grayscale; } .form-group .form-control.short { max-width: 300px; } .form-group .input-group.short { max-width: 300px; } .form-group .col-form-label { text-align: right; } .el-input__inner { border-radius: 0; } .el-button { border-radius: 0; } .el-tabs__header { margin-bottom: 25px; } .el-tabs__item { padding: 0 10px; } .el-input-group__append, .el-input-group__prepend { border-radius: 0; } .language-inputs .el-form-item__content { line-height: 1 !important; } .language-inputs .el-form-item__content:before, .language-inputs .el-form-item__content:after { display: none; } .language-inputs .el-form-item:before, .language-inputs .el-form-item:after { display: none; } .language-inputs .el-form-item .el-form-item__content .el-input-group__prepend { width: 80px; padding: 0 10px; } body.page-login { background-image: url("/image/login-bg.svg"); background-size: cover; background-position: 50%; } body.page-login .form-text.text-danger { font-size: 0.8rem; } body.page-login.seller-register .form-group, body.page-login.password-reset .form-group { margin-bottom: 1.5rem; } body.page-login.seller-register .form-group label, body.page-login.password-reset .form-group label { display: none; } body.page-login .card { box-shadow: 0 20px 27px 0 rgba(0, 0, 0, 0.05); border: none; border-radius: 0.85rem; overflow: hidden; align-items: center; flex-wrap: wrap; width: 480px; margin: 0 auto; } @media (max-width: 768px) { body.page-login .card { width: 100%; } } @media (min-width: 768px) { body.page-login .card .w-480 { width: 86%; margin: 2rem 0; } } body.page-login button[type=submit] { font-size: 1rem; background-image: linear-gradient(310deg, #fd560f, #fdb504); border: none; } body.page-login .btn:not(.btn-link) { padding: 0.7rem 1rem; transition: all 0.15s ease-in; box-shadow: 0 4px 7px -1px rgba(0, 0, 0, 0.11), 0 2px 4px -1px rgba(0, 0, 0, 0.07); } body.page-login .btn:not(.btn-link):hover { transform: scale(1.02); color: #fff; } body.page-product-form .product-item .position-absolute { display: none; } body.page-product-form .product-item:hover .position-absolute { display: block; } body.page-product-form .variant-value-img { width: 22px; height: 22px; border-radius: 2px; cursor: pointer; display: flex; align-items: center; justify-content: center; } body.page-product-form .selectable-variants div[id^=selectable-variant-] { border: 1px solid #eee; border-radius: 4px; margin-bottom: 10px; } body.page-product-form .selectable-variants .title { margin-bottom: 12px; display: flex; align-items: center; padding: 4px 10px; background: #f5f5f5; justify-content: space-between; } body.page-product-form .selectable-variants .title:hover .btn-link { display: block; } body.page-product-form .selectable-variants .title > div { display: flex; align-items: center; } body.page-product-form .selectable-variants .title b { border-right: 1px solid #f4f4f4; padding-right: 10px; } body.page-product-form .selectable-variants .title .btn-link { padding: 3px 12px; display: none; } body.page-product-form .selectable-variants .variants-wrap { padding: 0 10px; display: flex; flex-wrap: wrap; } body.page-product-form .selectable-variants .variants-wrap > div { border: 1px solid #eee; margin-right: 10px; display: flex; position: relative; margin-bottom: 10px; padding: 4px 6px; cursor: pointer; border-radius: 2px; align-items: center; } body.page-product-form .selectable-variants .variants-wrap > div:active { background-color: #f5f5f5; } body.page-product-form .selectable-variants .variants-wrap > div .value-img { line-height: 1; margin-right: 3px; } body.page-product-form .selectable-variants .variants-wrap > div .value-img a { width: 26px; display: flex; height: 26px; margin-right: 5px; } body.page-product-form .selectable-variants .variants-wrap > div:hover { border-color: #fd560f; } body.page-product-form .selectable-variants .variants-wrap > div:hover .btn-remove { display: block; } body.page-product-form .selectable-variants .variants-wrap > div .btn-remove { position: absolute; top: -9px; right: -7px; cursor: pointer; font-size: 17px; display: none; background: #fff; line-height: 1; } body.page-product-form .selectable-variants .variants-wrap > div .btn-remove:hover { color: #d80000; } body.page-product-form .selectable-variants .variants-wrap > div .tools { background: #fd560f; top: -24px; right: -31px; display: none; overflow: hidden; } body.page-product-form .selectable-variants .variants-wrap > div .tools .btn-link { min-width: 27px; text-align: center; float: left; padding: 0; border: none; display: inline-block; color: #fff; height: 30px; } body.page-product-form .selectable-variants .variants-wrap > div .tools .btn-link:hover { background: #be3a02; } body.page-product-form .selectable-variants .variants-wrap > div .tools .btn-link.rank { cursor: move; } body.page-product-form .selectable-variants .variants-wrap > div .name { text-align: center; min-width: 40px; } body.page-product-form .selectable-variants .variants-wrap > div .name + .btn-link { padding-left: 5px; } .autocomplete-suggestions { border: 1px solid rgb(126, 116, 116); background: #FFF; overflow: auto; } .autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; } .autocomplete-selected { background: #F0F0F0; } .autocomplete-suggestions strong { font-weight: normal; color: #3399FF; } .autocomplete-group { padding: 2px 5px; } .autocomplete-group strong { display: block; border-bottom: 1px solid #000; } body.page-categories .el-tree-node__content { height: 42px; border-bottom: 1px solid #f5f5f5; } .design-wrap { flex-wrap: wrap; } .design-wrap .menus-wrap > div { cursor: pointer; } .design-wrap .menus-wrap > div:not(.list-group-item-primary):hover { background-color: #f5f5f5; } .design-wrap .left .menus-wrap .link-selector-wrap { width: calc(100% - 20px); } .design-wrap .left .menus-wrap .link-selector-wrap .selector-type .title { border: none; padding: 8px 16px 8px 6px; background-color: transparent; } .design-wrap .right { width: calc(100% - 220px); } .design-wrap .right .menu-children-group .group-children .children-item { background-color: #f5f5f5; } .design-wrap .right .menu-children-group .group-children .children-item .link-selector-wrap { width: calc(100% - 34px); } .design-wrap .right .menu-children-group .group-children .children-item .link-selector-wrap .selector-type .title { border: none; background-color: transparent; }