:root {
    --theme-primary-color: #42119E;
    --theme-primary-hover-color: #340c7f;
    --theme-secondary-color: #e06a8b;
    --theme-secondary-hover-color: #cc5275;
    --theme-background-color: #f8f6f2;
}


body:is(.function-login, .function-register, .function-register_success, .function-remind, .function-remind_success, .function-changepwd, .function-changepwd_success) {
    position: absolute;
    height: 100%;
    width: 100%;
    background: #fffffff2 url(./images/bk-login.png) no-repeat 50% 0;
    background-size: cover;
}

body:is(.function-login, .function-remind, .function-remind_success, .function-changepwd, .function-changepwd_success)>form {
    height: 100%;
}

body:is(.function-login, .function-register, .function-register_success, .function-remind, .function-remind_success, .function-changepwd, .function-changepwd_success) .bs-top {
    float: left;
    margin-left: 0px;
    box-shadow: 0 1px 42px #979a9c;
    padding-bottom: 20px;
    min-height: 100%;
    margin-top: 0 !important;
}

@media (max-width: 767px) {
    body:is(.function-login, .function-register, .function-register_success, .function-remind, .function-remind_success, .function-changepwd, .function-changepwd_success) .bs-top {
        width: 100%;
    }
}

@media (min-width: 768px) {
    body:is(.function-login, .function-register, .function-register_success, .function-remind, .function-remind_success, .function-changepwd, .function-changepwd_success) .bs-top {
        width: 40%;
    }
}

body:is(.function-login, .function-register, .function-register_success, .function-remind, .function-remind_success, .function-changepwd, .function-changepwd_success) .bs-top {
    padding-top: 120px !important;
    color: white;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: 10px;
    background-color: var(--theme-primary-color);
    background-image: url(./../../brand/full-logo.png);
}

body.function-login [data-brick='loginheader'],
body:is(.function-register, .function-register_success) [data-brick='regheader'],
body:is(.function-remind, .function-remind_success) [data-brick='remindheader'],
body:is(.function-changepwd, .function-changepwd_success) [data-brick='changeheader'] {
    font-size: 30px;
    color: var(--theme-secondary-color);
    font-weight: bolder;
    text-align: center;
    /* text-shadow: -1px -1px 1px #d6e7fb; */
}

body:is(.function-login, .function-register, .function-remind, .function-remind_success, .function-changepwd, .function-changepwd_success) .bs-top .btn-default {
    margin-top: 20px;
}

.sidebar {
    background-color: var(--theme-primary-color);
    border: 0px;
}

.navbar-brand {
    height: unset;
    width: 100%;
    text-align: center;
}

.navbar-brand img {
    max-height: 50px;
    display: inline;
}

.sidebar #mCSB_1_container {
    height: 100%;
}

.sidebar [data-container="hdr"] {
    background: none;
}

.sidebar .sidebar-menu {
    padding: 10px 20px 0px 20px;
    /* border-top: 1px solid #ddd; */
}

.sidebar .sidebar-menu li~li {
    margin-top: 5px;
}

.sidebar .sidebar-menu li a {
    border-radius: 5px;
    white-space: nowrap;
    display: flex;
    align-items: center;
    /* color: white; */
}

.sidebar .sidebar-menu li a>.title {
    flex: 1;
}

.sidebar .sidebar-menu li:not(.active) a {
    color: white;
}

.sidebar .sidebar-menu li:not(.active) a:hover {
    color: var(--theme-primary-color);
}

.sidebar .sidebar-menu li.active a {
    background-color: var(--theme-secondary-color) !important;
}

.sidebar .sidebar-menu li:has(> a[href="x_orders_products_shop_dashboard.php"]):before,
.sidebar .sidebar-menu li:has(> a[href="settings_menu_dashboard.php?menuItemId=9"]):before {
    content: "";
    display: block;
    border-top: 1px solid #ddd;
    margin-top: 10px;
    padding-top: 10px;
    margin-left: -20px;
    margin-right: -20px;
}

.sidebar .sidebar-menu li a img {
    width: 24px;
}

.sidebar .sidebar-container {
    padding: 10px 20px 0 20px;
}

[data-brick="searchpanel"] {
    border-radius: 7px !important;
}

[data-brick="searchpanel"]>.panel-heading {
    background: none;
    border: none;
}

.modal-body .sidebar {
    display: none;
}

.navbar {
    border: 0px;
    background: none;
    box-shadow: none;
    min-height: unset;
}

[data-brick="loggedas"] button {
    background: none;
    color: #b1a6b4;
    box-shadow: none;
    border-color: #b1a6b4 !important;
    border-style: dashed;
    border-radius: 4px;
    border-width: 1px;
}

[data-brick="loggedas"] button:active,
[data-brick="loggedas"] button:hover,
[data-brick="loggedas"] button:focus {
    background: var(--theme-primary-hover-color) !important;
    border-color: var(--theme-primary-hover-color) !important;
    color: white !important;
    border-style: solid;
}



body>.bs-wrapper {
    display: flex;
    flex-direction: column;
    padding: 15px 0px;
}

body>.bs-wrapper>.bs-fixedsidebarmain {
    flex-grow: 1;
    display: block;
}


@media (max-width: 767px) {
    body>.bs-wrapper {
        height: calc(100vh - 80px);
    }
}

@media (min-width: 768px) {
    .sidebar {
        width: 250px;
    }

    body>.bs-wrapper {
        height: 100vh;
    }

    .modal-body .bs-wrapper {
        margin-left: 0px;
        margin-right: 0px;
    }

    :not([data-hidden])+.bs-wrapper>.bs-fixedheader {
        /* margin-top: 10px; */
        /* width: calc(100% - 450px); */
        width: 100%;
        position: relative;
        background: none;
    }

    [data-brick="search"]>.input-group {
        display: inline-table;
        vertical-align: middle;
    }

    [data-brick="search"]>.input-group>.form-control {
        width: 100%;
    }

    [data-brick="search"]>.input-group>span {
        width: auto;
    }
}

@media (min-width: 768px) and (max-width: 1219px) {
    :not([data-hidden])+body>.bs-wrapper {
        margin-left: 250px;
    }
}

@media (min-width: 1220px) {
    :not([data-hidden])+body>.bs-wrapper {
        margin-left: 350px;
        margin-right: 100px;
    }
}

.bs-fixedsidebarmain {
    width: 100%;
    margin-top: 0 !important;
}

.bs-sidebar-screenbound {
    max-width: unset;
    width: 100%;
}

body:is(.function-add, .function-edit, .function-view)>.bs-wrapper>.bs-fixedsidebarmain>.bs-minwidth {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-bottom: 20px;
}

@media (max-width: 767px) {

    body:is(.function-add, .function-edit, .function-view)>.bs-wrapper>.bs-fixedsidebarmain>.bs-minwidth>div>[data-container='header'],
    body:is(.function-add, .function-edit, .function-view)>.bs-wrapper>.bs-fixedsidebarmain>.bs-minwidth>[data-container='fields']>div>.container,
    body:is(.function-add, .function-edit, .function-view)>.bs-wrapper>.bs-fixedsidebarmain>.bs-minwidth>[data-container='fields']>div>.container>div[class^='col-'],
    body:is(.function-add, .function-edit, .function-view)>.bs-wrapper>.bs-fixedsidebarmain>.bs-minwidth>[data-container='fields']>div>.bs-2column>.bs-details,
    body:is(.function-add, .function-edit, .function-view)>.bs-wrapper>.bs-fixedsidebarmain>.bs-minwidth>[data-container="bottombuttons"] {
        padding: 0px;
    }
}

body:is(.function-add, .function-edit, .function-view)>.bs-wrapper>.bs-fixedsidebarmain>.bs-minwidth>[data-container='fields'] {
    flex-grow: 1;
}

body:is(.function-add, .function-edit, .function-view)>.bs-wrapper>.bs-fixedsidebarmain>.bs-minwidth>[data-container="bottombuttons"] button.btn-primary {
    font-size: 25px;
}

@media (max-width: 767px) {
    .bs-flexgrid tbody .bs-gridrow {
        position: relative;
        background: none !important;
    }

    .bs-flexgrid tbody .bs-gridrow:not(:has(td[data-field="delete_button"]:last-child)):has(.bs-gridicons) {
        padding-bottom: 50px;
    }

    .bs-flexgrid tbody .bs-gridicons {
        position: absolute;
        bottom: 13px;
        margin: 0px;
    }

    .bs-flexgrid tbody .bs-gridcell {
        text-align: right;
    }

    .bs-flexgrid tbody .bs-gridcell:before {
        float: left;
        padding-left: 8px;
    }

    .bs-flexgrid tbody .bs-gridcell>span {
        display: inline-block;
    }

    .bs-flexgrid tbody .bs-gridcell:not(:last-child),
    .bs-flexgrid tbody .bs-gridrow:not(:has(td[data-field="delete_button"]:last-child)):has(.bs-gridicons)>.bs-gridcell:last-child {
        border-bottom: 1px solid #ddd;
    }
}

@media (min-width: 768px) {
    .bs-grid {
        width: 100% !important;
        /* padding: 20px; */
        /* border: 1px dashed #ddd; */
        /* border-radius: 7px; */
        /* background: var(--theme-background-color); */
    }
}

table {
    border: none !important;
}

table>thead>tr>th,
table>thead>tr>td {
    border: none !important;
}

table:has(> thead)>tbody>tr:first-child>th,
table:has(> thead)>tbody>tr:first-child>td,
table>tbody:not(:empty)~tfoot>tr>th,
table>tbody:not(:empty)~tfoot>tr>td {
    border-top: 1px !important;
}

table:not(:has(> thead))>tbody>tr:first-child>th,
table:not(:has(> thead))>tbody>tr:first-child>td {
    border-top: 0px !important;
}

table>tbody>tr>th,
table>tbody>tr>td,
table>tbody:not(:empty)~tfoot>tr>th,
table>tbody:not(:empty)~tfoot>tr>td {
    border-left: 0px !important;
    border-bottom: 0px !important;
    border-right: 0px !important;
    border-style: solid !important;
    border-color: #ddd !important;
    border-width: 1px;
}


table>tbody>tr>th,
table>tbody>tr>td {
    vertical-align: middle !important;
}

table>tbody:empty~tfoot>tr>th,
table>tbody:empty~tfoot>tr>td {
    border: 0px !important;
}

table tr {
    background: none !important;
}

td>span.bs-ctrlspan {
    display: inline-block;
}

div[role="form"] .form-group>label:has(+.help-block) {
    margin: 0px;
}

div[role="form"] .form-group>label+.help-block {
    margin-top: 0px;
    margin-bottom: 5px;
}

span.bs-ctrlspan:has(>input.miniColors) {
    position: relative;
}

span.bs-ctrlspan:has(>input.miniColors)>input {
    max-width: 115px;
    display: inline-block;
    padding-left: 35px;
}

span.bs-ctrlspan:has(>input.miniColors)>a {
    position: absolute;
    left: 6px;
    top: 6px;
    background: none;
    border-radius: 4px;
}

.table:last-child {
    margin-bottom: 0px;
}

[data-container="gridcontrols"] {
    display: block;
}

[data-container="gridcontrols"]> :first-child {
    padding-left: 0px;
}

[data-container="gridcontrols"]> :last-child {
    padding-right: 0px;
}

.bs-gridintab-container {
    padding: 0px !important;
}

.bs-details {
    width: 100% !important;
}

.bs-gridcell .form-control {
    display: unset;
}

.panel:is(.form-section, .details-grid) {
    border-style: dashed;
    border-color: #ddd;
    border-width: 1px;
}

.panel:is(.form-section, .details-grid)>.panel-heading {
    background: none;
    border: none;
    color: #333;
}

.panel:is(.form-section, .details-grid)>.panel-heading>.panel-title {
    font-size: 20px;
}

/* .panel.form-section > .panel-collapse.collapse {
    height: unset !important;
    display: block;
} */

.container {
    width: 100%;
}

.btn,
.alert {
    border-radius: 4px;
    box-shadow: none;
    background-image: none;
}

.alert.mini {
    padding: 7px;
}

.alert.mini:not(:last-child) {
    margin-bottom: 5px;
}

.alert.mini:last-child {
    margin-bottom: 0px;
}

.alert-primary {
    color: #084298;
    background-color: #cfe2ff;
    border-color: #b6d4fe;
}

.alert-secondary {
    color: #383d41;
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.alert-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}

.alert-default {
    background-color: #f5f5f5;
    border-color: #ddd;
}

.alert.alert-dismissible {
    position: relative !important;
}

.alert-dismissible .close {
    position: absolute;
    top: 0px;
    right: 5px;
}

.input-group-btn .btn:first-child {
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

.input-group-btn .btn:last-child {
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
}

.input-group-addon {
    border: none;
    background-color: #f1f0ef;
}

.input-group.date {
    max-width: 200px;
}

.btn {
    text-shadow: none;
}

.btn-primary {
    /* background: #4fc9da;
    border-color: #4fc9da; */

    background: var(--theme-primary-color);
    border-color: var(--theme-primary-color);
}

.btn-primary[disabled],
.btn-primary:hover,
.btn-primary:focus {
    /* background: #28B0C4 !important;
    border-color: #28B0C4 !important; */

    background: var(--theme-primary-hover-color) !important;
    border-color: var(--theme-primary-hover-color) !important;
}

.btn-theme {
    background: var(--theme-secondary-color);
    border-color: var(--theme-secondary-color);
    color: white !important;
}

.btn-theme[disabled],
.btn-theme:hover,
.btn-theme:focus {
    background: var(--theme-secondary-hover-color) !important;
    border-color: var(--theme-secondary-hover-color) !important;
}

.btn-success {
    background: #419641;
    border-color: #419641;
}

.btn-success:hover,
.btn-success:focus {
    background: #3c8b3c !important;
    border-color: #3c8b3c;
}

.btn-info {
    /* background: var(--theme-secondary-color);
    border-color: var(--theme-secondary-color); */

    background: #4fc9da;
    border-color: #4fc9da;
}

.btn-info:hover,
.btn-info:focus {
    /* background: var(--theme-secondary-hover-color) !important;
    border-color: var(--theme-secondary-hover-color); */

    background: #28B0C4 !important;
    border-color: #28B0C4 !important;
}

.btn-warning {
    background: #e8c342;
    border-color: #e8c342;
}

.btn-warning:hover,
.btn-warning:focus {
    background: #d1af37 !important;
    border-color: #d1af37;
}

.btn-danger {
    background: #c12e2a;
    border-color: #c12e2a;
}

.btn-danger:hover,
.btn-danger:focus {
    background: #ac2a25 !important;
    border-color: #ac2a25;
}

.btn-default {
    background: #f8f6f2;
    border-color: #f8f6f2;
}

.btn-default:hover,
.btn-default:focus {
    background: #edeae5 !important;
    border-color: #edeae5 !important;
}

.form-control {
    box-shadow: none;
    border: none;
    background-color: #f1f0ef;
}

.form-control:hover,
.form-control:focus {
    background-color: #dddbd7 !important;
}

/* .form-group .input-group-addon {
    border: 2px solid #f0f9ff;
    background-color: #fff;
} */

/* .panel:last-child {
    margin-bottom: 0px;
} */

.panel-default {
    border-style: dashed;
}

.panel-default>.panel-heading {
    background: none;
    border: none;
}

.panel-default>.panel-heading>.panel-title:not(.normal) {
    font-size: 20px;
}

.panel-default.form-tabs>.panel-heading>ul {
    border: none;
}

.panel-default.form-tabs>.panel-heading>ul>li>a {
    border: 1px dashed #ddd;
    border-radius: 5px;
}

.panel-default.form-tabs>.panel-heading>ul>li.active>a {
    background: var(--theme-primary-color);
    color: white;
}

.modal-header,
.modal-footer {
    border: none;
}

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
    margin-top: 0px;
}

h3>small {
    display: block;
}

.tabs-container,
ul.nav-pills a {
    border-style: dashed;
    border-color: #ddd;
    border-width: 1px;
    border-radius: 4px;
}

ul.nav-pills>li.active a,
ul.nav-pills>li.active a:focus {
    background-color: var(--theme-primary-color);

}

ul.nav-pills>li.active a:hover {
    background-color: var(--theme-primary-hover-color);
}

.tabs-container {
    padding: 15px;
}

.tabs-container .tab-content {
    margin-top: 15px;
}

.rnr-bs-dpreviewrow>.dpinline.dpinline.dpinline {
    background: var(--theme-background-color);
    padding: 20px;
}

.dpinline>div {
    background: none;
    border: none;
    padding: 0px;
}

.dpinline .tab-pane>div>.panel {
    border: 0px;
    margin: 0px;
}

.dpinline .tab-pane>div>.panel>.panel-heading {
    background: none;
    border: 0px;
}

.rnr-horizontal-lookup {
    max-width: unset !important;
}