@import url(https://fonts.googleapis.com/icon?family=DM+Sans:400,500,700&display=swap||Material+Icons);
@import url(../vendors/bootstrap/dist/css/bootstrap.min.css);
@import url(font-awesome.min.css);
@import url(dripicons.css);
@import url(cryptofont.min.css);
@import url(themify-icons.css);
@import url(animate.css);
@import url(flag-icon.min.css);
@import url(twemoji.min.css);
@import url(material-design-iconic-font.min.css);
@import url(remixicon.css);
@import url(material-icons.css);
@import url(line-awesome.min.css);
@import url(bootstrap-icons.css);
@import url(flaticon.css);
@import url(prism.css);
@import url(../vendors/simplebar/dist/simplebar.min.css);
@import url(../vendors/owl.carousel/dist/assets/owl.carousel.min.css);
@import url(../vendors/owl.carousel/dist/assets/owl.theme.default.min.css);
/* Gilroy Font */
@font-face {
    font-family: 'gilroy-bold';
    src: url('../fonts/gilroy/Gilroy-Bold.ttf');
    font-display: swap;
}

@font-face {
    font-family: 'gilroy-semibold';
    src: url('../fonts/gilroy/Gilroy-Semibold.ttf');
    font-display: swap;
}

@font-face {
    font-family: 'gilroy-medium';
    src: url('../fonts/gilroy/Gilroy-Medium.ttf');
    font-display: swap;
}

@font-face {
    font-family: 'gilroy-Regular';
    src: url('../fonts/gilroy/Gilroy-Regular.ttf');
    font-display: swap;
}

@font-face {
    font-family: 'gilroy-light';
    src: url('../fonts/gilroy/Gilroy-Light.ttf');
    font-display: swap;
}


/* Root Variables */
:root {
    --primaryColor: #1F71ED;
    --secondaryColor: #000000A6;
    --borderColor: #0000001A;
    --inputBorder: #0000001A;
    --blackColor: #000000;
    --whiteColor: #FFFFFF;
    --dropdownBg: #FFFFFF;
    --dropdownBorder: #FFFFFF;
    --contentWrapper: #F5F5F6;
    --sidebarItem: #000000A6;
    --sidebarItemHoverBg: #1F71ED0F;
    --HoverText: #1F71ED;
    --ItemActive: #1F71ED0F;
    --switchColor: #0000000F;
    --boxShadow: 5px 5px 51px 0px #0000001A;
    --themeSwitcherBg: #0000000A;
    --searchBar: #0000000A;
    --widgetBg: #FFFFFF;
    --checkbox: #00000033;
    --siderBarDropdownItems: #595A5C;
    --siderBarDropdownItemsDots: #E6E6E6;
    --searchIcon: #000000A6;
    --brandColor: #ED1E3A;
    --serviceCircle: #FFF4F0;
    --searchPlaceholderText: #00000040;
    --inputPColor: #00000066;
}

html[theme='darkmode'] {
    --secondaryColor: #FFFFFFA6;
    --blackColor: #FFFFFF;
    --inputBorder: #ffffff38;
    --whiteColor: #121518;
    --dropdownBg: #1E1E1E;
    --dropdownBorder: #303539;
    --contentWrapper: #161A1D;
    --sidebarItem: #FFFFFFBF;
    --sidebarItemHover: #1F71ED;
    --HoverText: #FFFFFF;
    --ItemActive: #1F71ED;
    --switchColor: #FFFFFF0F;
    --boxShadow: 5px 5px 51px 0px #0000001A;
    --themeSwitcherBg: #282A2D;
    --searchBar: #FFFFFF0A;
    --widgetBg: #282A2D;
    --checkbox: #FFFFFF33;
    --siderBarDropdownItems: #FFFFFF80;
    --siderBarDropdownItemsDots: #ACACAC66;
    --searchIcon: #FFFFFF80;
    --brandColor: #FFFFFF;
    --serviceCircle: #3B3B3B;
    --searchPlaceholderText: #FFFFFF80;
    --inputPColor: #FFFFFF80;

}

/* Root Variables */

/* Gilroy Font */
body {
    overflow: hidden;
}

main {
    display: flex;
    position: relative;
    overflow: hidden;
}

.text-black {
    color: var(--blackColor);
}

.w-max {
    width: max-content !important;
}

.w-max-1000px {
    width: 1000px;
}

.w-max-1145px {
    width: 1145px;
}

.table-responsive {
    padding-bottom: 15px;
}



.table-responsive::-webkit-scrollbar {
    height: 5px;
}

/* Track */
.table-responsive::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
.table-responsive::-webkit-scrollbar-thumb {
    background: #88888891;
}

/* Handle on hover */
.table-responsive::-webkit-scrollbar-thumb:hover {
    background: #555555a6;
}

.breadcrumbs {
    margin-top: 10px;
}

.breadcrumbs ul {
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
    list-style-type: none;
    gap: 10px;
}

.breadcrumbs ul li a {
    text-decoration: none;
    color: var(--secondaryColor);
    font-family: 'gilroy-medium';
    font-size: 14px;
}

.breadcrumbs ul li a svg {
    width: 17px;
    height: 17px;
}

.breadcrumbs ul li a.active {
    color: var(--blackColor);
}

.btn-primary {
    font-size: 14px;
    padding: 10px 20px;
    font-family: 'gilroy-regular';
    border-radius: 12px;
    text-transform: capitalize;
    background-color: var(--primaryColor);
}

.btn-primary:focus {
    box-shadow: none;
}

.btn-outline-primary {
    border-color: var(--primaryColor);
    font-size: 14px;
    padding: 10px 20px;
    font-family: 'gilroy-medium';
    border-radius: 12px;
    color: var(--primaryColor);
    text-transform: capitalize;
}

.badge-warning {
    width: 68px;
    height: 24px;
    padding: 8px, 11px, 8px, 11px;
    border-radius: 6px;
    border: 1px solid #FF000026;
    gap: 10px;
    color: #FF4141;
    font-family: 'gilroy-light';
}

.badge-success {
    width: 68px;
    height: 24px;
    padding: 8px, 11px, 8px, 11px;
    border-radius: 6px;
    border: 1px solid #00C04D40;
    gap: 10px;
    color: #00D770;
    font-family: 'gilroy-light';
}

.cursor {
    cursor: pointer;
}

.brand-logo svg path {
    stroke: var(--brandColor);
    fill: var(--brandColor);
}

.offcanvas {
    background-color: var(--whiteColor);
}

.close-offcanvus {
    background-color: transparent;
    padding: 0;
    border: none;
}

.close-offcanvus i {
    color: var(--blackColor);
}

.siderbar {
    box-shadow: var(--boxShadow);
    border-right: 1.5px solid var(--borderColor);
    width: 280px;
    padding: 25px 25px 15px 25px;
    height: 100vh;
    overflow-y: scroll;
    transition: .4s all;
    background-color: var(--whiteColor);
}

.siderbar.show ul li a span {
    display: block;
}

@media(min-width:991px) {
    .siderbar.hide {
        position: absolute;
        left: -100%;
        transition: .4s all;
    }
}

.siderbar::-webkit-scrollbar {
    display: none;
}

.sidebar-menu-items {
    list-style-type: none;
    padding: 20px 0 0 0;
    margin: 0;
}

.sidebar-menu-items li a.nav-items {
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 42px;
    /* justify-content: center; */
    font-family: 'gilroy-semibold';
    color: var(--sidebarItem);
    transition: .4s all;
    padding: 10px 15px;
    border-radius: 8px;
    text-transform: capitalize;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 400;
}

.sidebar-menu-items li a svg path {
    stroke: var(--sidebarItem);
}

.sidebar-menu-items li i {
    color: var(--sidebarItem);
    transition: .4s all;
}

.sidebar-menu-items li span:nth-child(3) {
    margin-left: auto;
}

.sidebar-menu-items li a.nav-items svg {
    transition: .4s all;
}

.sidebar-menu-items li a.nav-items:hover {
    background-color: var(--ItemActive);
    color: var(--HoverText);
}

.sidebar-menu-items li a.nav-items:hover i {
    color: var(--HoverText);
}

.sidebar-menu-items li a.nav-items:hover svg path {
    stroke: var(--HoverText);
}


.sidebar-menu-items li a.active {
    background-color: var(--ItemActive);
    color: var(--HoverText);
}

.sidebar-menu-items li a.active i {
    color: var(--HoverText);
}

.sidebar-menu-items li a.active svg path {
    stroke: var(--HoverText);
}

.has-dropdown {
    padding-left: 50px;
    list-style-type: none;
    display: none;
}

.has-dropdown li {
    position: relative;
    display: flex;
    align-items: center;
}

.has-dropdown li::after {
    content: "\f111";
    font-family: var(--fa-style-family, "Font Awesome 6 Free");
    font-weight: var(--fa-style, 900);
    font-size: 7px;
    position: absolute;
    left: -18px;
    color: var(--siderBarDropdownItemsDots);
}

.has-dropdown li a {
  text-decoration: none;
  color: var(--siderBarDropdownItems);
  text-transform: capitalize;
  padding: 5px;
  font-family: 'gilroy-semibold';
  font-size: 14px;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.has-dropdown li a.nested-dropdown-toggle {
  padding-inline-end: 15px;
}

/* .siderbar. .has-dropdown {
    position: absolute;
    left: 5.2%;
    padding: 15px;
    padding-left: 35px;
} */


.content-wrapper {
    width: calc(100% - 280px);
    background-color: var(--contentWrapper);
}

.content-wrapper.active {
    width: 100%;
}

.main-content {
    padding: 30px;
    overflow-y: scroll;
    height: 100vh;
}

.main-content .sub-heading {
    font-family: 'gilroy-semibold';
    margin-bottom: 0;
    color: var(--blackColor);
    text-transform: capitalize;
}

.widget-wrapper {
    margin-top: 30px;
    margin-bottom: 60px;
}

.widget-wrapper-one {
    margin-bottom: 60px;
}

/* .widget-wrapper .row .row {
    height: 100%;
} */

.widget-wrapper .row .col-lg-3,
.col-lg-6 {
    display: flex;
}

.widget-content {
    background-color: var(--widgetBg);
    padding: 15px;
    border-radius: 16px;
    margin-bottom: 22px;
    align-content: stretch;
    height: max-content;
    width: 100%;
}

.widget-content h5 {
    font-family: 'gilroy-semibold';
    font-size: 18px;
    color: var(--blackColor);
    text-transform: capitalize;
}

.header {
    background-color: var(--whiteColor);
    border-bottom: 1px solid var(--borderColor);
    padding: 8px 35px;
    display: flex;
    align-items: center;
}

.header-toggle {
    cursor: pointer;
}

.header-toggle svg path {
    stroke: var(--blackColor);
}

.search-form {
    width: 40%;
}

.header-search-box {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: 20px;
    background-color: var(--searchBar);
    border-radius: 36px;
    padding: 0px 12px;
    width: 100%;
}

.header-search-box svg path {
    stroke: var(--searchIcon);
}

.header-search-box input {
    background-color: transparent;
    border: none;
    width: 100%;
    padding: 8px 10px;
    font-family: 'gilroy-medium';
    font-size: 14px;
    color: var(--blackColor);
}

.header-search-box input:focus {
    outline: 0;
}

.header-search-box input::placeholder {
    color: var(--searchPlaceholderText);
}

.header-search-box button {
    background-color: transparent;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header-sideItem ul {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 20px;
    list-style-type: none;
}

.theme-switcher {
    width: 50px;
    height: 25px;
    background-color: var(--themeSwitcherBg);
    border-radius: 21.6px;
    position: relative;
    cursor: pointer;
    transition: .4s all;
}

.theme-switcher::after {
    content: "";
    background-color: #FFFFFF;
    height: 20px;
    width: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-52%);
    border-radius: 50%;
    background-position: center;
    background-size: 70%;
    background-repeat: no-repeat;
    transition: .4s all;
}

.light-theme::after {
    right: 5%;
    background-image: url('../images/icons/light-theme.svg');
}

.dark-theme::after {
    right: 52%;
    background-image: url('../images/icons/dark-theme.svg');
}

.custom-dropdown {
    display: flex;
    align-items: stretch;
    gap: 10px;
    cursor: pointer;
    position: relative;
}

.custom-dropdown a {
    font-family: 'gilroy-semibold';
    color: var(--secondaryColor);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

.custom-dropdown i {
    color: var(--secondaryColor);
}

.custom-dropdown:hover ul {
    transform: translateY(23%);
    opacity: 1;
    z-index: 1;
}

.custom-dropdown ul {
    background-color: var(--whiteColor);
    list-style: none;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 170px;
    transition: .4s all;
    box-shadow: var(--boxShadow);
    padding: 10px;
    border-radius: 8px;
    transform: translateY(45%);
    opacity: 0;
    z-index: -10;
}

.custom-dropdown ul li {
    display: flex;
    align-items: center;
    height: 100%;
}

.custom-dropdown ul::before {
    content: "";
    position: absolute;
    top: -30px;
    left: 0;
    width: 100%;
    height: 40px;
    background-color: transparent;
    z-index: -1;
}

.custom-dropdown ul li {
    width: 100%;
}

.custom-dropdown ul li a {
    display: block;
    width: 100%;
    padding: 8px 20px;
    text-decoration: none;
    color: var(--secondaryColor);
    font-family: 'gilroy-semibold';
    transition: .4s all;
    border-radius: 8px;
}

.custom-dropdown ul li a:hover {
    background-color: var(--ItemActive);
    color: var(--HoverText);
}

.profile-dropdown {
    display: flex;
    align-items: center;
    gap: 10px;
}

.profile-dropdown i {
    color: var(--secondaryColor);
}

.profile-dropdown img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
}

.profile-dropdown h6 {
    margin-bottom: 0;
    line-height: 22px;
    color: var(--blackColor);
    font-family: 'gilroy-semibold';
}

.profile-dropdown span {
    font-size: 14px;
    line-height: 22px;
    display: block;
    color: var(--secondaryColor);
}

.service-cards {
    border: 1px solid #00000012;
}

.service-cards h3 {
    color: var(--blackColor);
    font-family: 'gilroy-bold';
    font-size: 24px;
}

.service-cards svg circle {
    fill: var(--serviceCircle);
}

.service-cards span {
    font-family: 'Gilroy-medium';
    font-size: 14px;
}

.service-cards span.text-green {
    color: #00C04D;
}

.service-cards span.text-red {
    color: #ED1E3A;
}

.donut-chart select {
    padding: 3px;
    padding-right: 30px;
    width: max-content;
    font-size: small;
    border: none;
    font-family: 'gilroy-medium';
    background-color: transparent;
    color: var(--secondaryColor);
}

.donut-chart select option {
    color: #000;
}

.donut-chart select:focus {
    box-shadow: none;
}

.custom-table {
    width: 100%;
    margin-top: 40px;
}

.custom-table thead tr th {
    color: var(--blackColor);
    border-top: 1px solid var(--borderColor);
    border-bottom: 1px solid var(--borderColor);
    padding: 15px 5px;
    font-size: 14px;
}

.custom-table tbody tr td {
    padding: 20px 5px;
    color: var(--secondaryColor);
    font-family: 'gilroy-medium';
    border-bottom: 1px solid var(--borderColor);
}

.custom-table tbody tr:last-child td {
    border: none;
    padding-bottom: 0;
}

.custom-table tr input[type='checkbox'] {
    font-size: 21px;
    border: 1px solid var(--checkbox);
    margin: 0;
}

html[theme='darkmode'] .custom-table tr input[type='checkbox'] {
    background-color: transparent;
}

.custom-table tr input[type='checkbox']:focus {
    box-shadow: none;
}

.custom-table tr input[type='checkbox']:checked {
    border: 1px solid var(--checkbox);
}

.custom-table tbody tr td:nth-child(2) {
    width: 240px;
}

.custom-table tbody tr td p {
    margin-bottom: 0px;
    font-size: 14px;
}

.table-info-item {
    font-size: 14px;
}

.custom-table tbody tr td .table-info .table-info-item span {
    font-family: 'gilroy-semibold';
}

.custom-table tbody tr td .table-info .table-info-item span:nth-child(1) {
    color: var(--blackColor);
}

.custom-table tbody tr td .table-info .table-info-item span:nth-child(2) {
    color: var(--secondaryColor);
    font-family: 'gilroy-medium';
}

.custom-table tbody tr td .total-stock {
    display: flex;
    gap: 10px;
}

.custom-table tbody tr td .total-stock .total-stock-item {
    color: var(--secondaryColor);
    font-family: 'gilroy-medium';
    font-size: 14px;
    margin-bottom: 10px;
}

.custom-table tbody tr td .total-stock .total-stock-item .text-grey {
    color: #AEAEAE;
}

.custom-table tbody tr td .total-stock .total-stock-item .text-orange {
    color: #FFA800;
}

.custom-table tbody tr td .total-stock .total-stock-item .text-pink {
    color: #FD6CB0;
}

.custom-table tbody tr td .total-stock .total-stock-item .text-yellow {
    background-color: #E7AD04;
    background-image: linear-gradient(180deg, #E7AD04 0%, #F0CB2B 59.79%, #FCF463 100%);
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
}

.custom-table tbody tr td .form-switch .form-check-input {
    font-size: 17px;
    background-color: var(--switchColor);
    background-image: url("../images/icons/switch-cirlce.svg");
    border: none;
}

.custom-table tbody tr td .form-switch .form-check-input:checked {
    background-color: #1F71ED1F;
    background-image: url("../images/icons/switch-circle-active.svg");
}

.dropstart .btn {
    padding: 0px;
    background-color: transparent;
    border: none;
}

.dropstart .btn:focus {
    box-shadow: none;
}

.dropstart ul {
    box-shadow: 5px 5px 51px 0px var(--borderColor);
    border: none;
    border-radius: 8px;
    background-color: var(--dropdownBg);
    width: max-content;
}

.dropstart ul li a {
    border-bottom: 1px solid var(--dropdownBorder) !important;
    text-decoration: none;
    color: #949494;
    padding: 9px 16px;
    display: block;
    width: 100%;
    font-family: 'gilroy-medium';
}

.dropstart ul li:last-child a {
    border-bottom: none !important;
}

.dropstart ul li a.text-red {
    color: #ED1E3A;
}

.dropstart .dropdown-toggle svg path {
    fill: var(--blackColor);
}

.dropstart .dropdown-toggle::before {
    display: none;
}

table.dataTable.no-footer {
    border-bottom: none !important;
}

.product-filter {
    border: 1px solid var(--checkbox);
    display: flex;
    align-items: center;
    border-radius: 36px;
    overflow: hidden;
    padding-left: 15px;
    font-size: 14px;
    font-family: 'gilroy-semibold';
    padding: 4px 13px;
}

.product-filter span {
    display: block;
    /* opacity: .6; */
    white-space: nowrap;
    color: var(--blackColor) !important;
    background-color: transparent !important;
    font-family: 'gilroy-medium';
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border: none;
    font-family: var(--fa-style-family, "Font Awesome 6 Free");
    font-weight: var(--fa-style, 900);
}

.select2-container--default .select2-selection--single .select2-selection__arrow b::before {
    content: "\f107";
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: -7px;
}

.product-filter .select2-container--default .select2-selection--single {
    border: none;
}

.product-filter select {
    border: none;
    /* width: max-content; */
    font-size: 14px;
    background-color: transparent;
    color: var(--blackColor);
}

.product-filter select:focus {
    box-shadow: none;
}

.data-not-yet p {
    font-family: 'gilroy-medium';
    font-size: 14px;
}

.form-group label span {
    color: red;
}

.form-input .form-group {
    margin-top: 20px;
    width: 100%;
}

.form-group .error-txt {
    font-size: 12px;
    color: red;
    margin-top: 5px;
    font-family: 'gilroy-medium';
    display: none;
}

.form-group.error input {
    border-color: red !important;
}

.form-group.error textarea {
    border-color: red !important;
}

.form-group.error tags {
    border-color: red !important;
}

.form-group.error .select2-selection {
    border-color: red !important;
}

.form-group.error .error-txt {
    display: block;
}

.form-group.error .file-preview-box {
    border-color: red;
}

.form-input label {
    text-transform: capitalize;
    color: var(--secondaryColor);
    font-family: 'gilroy-semibold';
    margin-bottom: 10px;
    font-size: 14px;
}

.form-input label span {
    font-family: 'gilroy-medium';
}

.form-input input {
    width: 100%;
    padding: 10px 14px 10px 14px;
    border: 1px solid var(--inputBorder);
    font-size: 14px;
    border-radius: 12px;
    font-family: 'gilroy-regular';
    background-color: transparent;
    font-size: 14px;
    color: var(--blackColor);
}

.form-input textarea {
    width: 100%;
    padding: 14px 20px 14px 20px;
    border: 1px solid var(--inputBorder);
    font-size: 14px;
    border-radius: 12px;
    font-family: 'gilroy-regular';
    background-color: transparent;
    font-size: 14px;
    color: var(--blackColor);
}

.form-input textarea:focus {
    outline: 0;
}

.form-input .form-group .tagify {
    display: block;
    width: 100%;
    padding: 4px 15px 4px 7px;
    border: 1px solid var(--inputBorder);
    font-size: 14px;
    border-radius: 12px;
    font-family: 'gilroy-regular';
    background-color: transparent;
    font-size: 14px;
}

.form-input .form-group .tagify__input {
    color: var(--blackColor);
}

.form-input .form-group .tagify__input::before {
    color: var(--searchPlaceholderText);
}

.form-input .form-group p {
    color: var(--inputPColor);
    font-size: 12px;
    margin-top: 5px;
    margin-bottom: 0;
    font-family: 'gilroy-semibold';
}

.form-input input::placeholder {
    color: var(--searchPlaceholderText);
    text-transform: capitalize;
    font-family: 'gilroy-semibold';

}

input[name="tags"]::placeholder {
    color: var(--searchPlaceholderText);
}

.form-input input:focus {
    outline: 0;
}

.form-input select {
    width: 100%;
    padding: 14px 20px 14px 20px;
    border: 1px solid var(--inputBorder);
    font-size: 14px;
    border-radius: 12px;
    background-color: transparent;
}

/* 
.form-input .form-group .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--searchPlaceholderText);
} */

.form-input .form-group .select2-container {
    width: 100% !important;
}

.form-input .form-group .select2-container--default .select2-selection--single {
    border: 1px solid var(--inputBorder);
    font-size: 14px;
    border-radius: 12px;
    background-color: transparent;
    padding: 8px 15px 8px 7px;
    min-height: max-content;
    height: max-content;
    display: flex;
    align-items: center;
}

.form-input .form-group .select2-container--default .select2-selection--single .select2-selection__arrow {
    top: revert;
}

.form-input .form-group .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--primaryColor) !important;
}

.form-input select:focus {
    box-shadow: none;
    border: 1px solid var(--inputBorder);
}

.form-input .ql-editor {
    height: 200px;
}

.form-input .ql-toolbar.ql-snow {
    background-color: #F2F2F2;
    border-color: var(--inputBorder);
}

.form-input .ql-container.ql-snow {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    border-color: var(--inputBorder);
}

.form-input .ql-editor p {
    color: var(--blackColor);
    font-size: 14px;
    font-family: 'gilroy-regular';
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

.num-arrows-none[type=number]::-webkit-inner-spin-button,
.num-arrows-none[type=number]::-webkit-outer-spin-button {
    appearance: none;
}

/* 
input::-webkit-datetime-edit-day-field,
input::-webkit-datetime-edit-month-field,
input::-webkit-datetime-edit-year-field {
    color: var(--searchPlaceholderText);
} */

html[theme='darkmode'] input::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

.form-input input[type='radio'] {
    width: 1em;
    padding: revert;
}

.custom-upload-file-wrapper {
    display: flex;
    height: 180px;
    justify-content: center;
    align-items: center;
}

.custom-upload-file-wrapper2 {
    display: flex;
    height: 140px;
    justify-content: center;
    align-items: center;
}

.custom-upload-file-wrapper2 span {
    color: var(--primaryColor) !important;
}

.file-preview-box {
    border: 1px solid var(--inputBorder);
    border-radius: 12px;
}

.file-preview-box span {
    color: var(--primaryColor) !important;
}


.form-input .form-switch .form-check-input {
    font-size: 17px !important;
    background-color: var(--switchColor);
    background-image: url("../images/icons/switch-cirlce.svg");
    border: none;
    padding: revert;
}

.form-input .form-switch .form-check-input:checked {
    background-color: #1F71ED1F;
    background-image: url("../images/icons/switch-circle-active.svg");
}

.form-input .form-switch .form-check-input:focus {
    box-shadow: none;
}

.order-summary {
    margin-top: 20px;
}

.order-summary-item {
    padding: 20px 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 14px;
    border-bottom: 1px solid var(--inputBorder);
    font-family: 'gilroy-medium';
    color: var(--secondaryColor);
}

.order-summary-item:last-child {
    border-bottom: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 0;
}

.order-summary-item:last-child .total-order {
    color: var(--secondaryColor);
    font-family: 'gilroy-semibold';
}

.order-summary-item:last-child .total-price {
    font-family: 'gilroy-semibold';
    color: var(--blackColor);
}

.order-summary-item .summary-image img {
    width: 50px;
}

.order-summary-item .order-summary-netamount {
    font-family: 'gilroy-semibold';
    color: var(--blackColor);
}

.order-summary-item .text-grey {
    color: #AEAEAE;
}

.order-summary-item .text-orange {
    color: #FFA800;
}

.order-summary-item .text-pink {
    color: #FD6CB0;
}

.order-summary-item .text-yellow {
    background-color: #E7AD04;
    background-image: linear-gradient(180deg, #E7AD04 0%, #F0CB2B 59.79%, #FCF463 100%);
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
}

.summary-order-detail {
    margin-top: 20px;
}

.summary-order-detail ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.summary-order-detail ul li i {
    font-size: 9px;
}

.summary-order-detail ul li i.warning {
    color: #FF9900;
}

.summary-order-detail ul li i.success {
    color: #00C04D;
}

.summary-order-detail ul li {
    padding: 10px 0px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--inputBorder);
    text-transform: capitalize;
    color: var(--secondaryColor);
    font-family: 'gilroy-semibold';
    font-size: 14px;
}

.summary-order-detail ul li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.summary-order-detail ul li span:nth-child(2) {
    color: var(--blackColor);
}

.summary-order-detail ul li:nth-child(1) span:nth-child(2) {
    display: flex;
    align-items: center;
    gap: 8px;
}

.summary-order-detail ul li span {
    width: max-content;
    display: block;
}

table.dataTable>tbody>tr.child ul.dtr-details {
    display: flex;
    align-items: baseline;
    gap: 40px;
}

table.dataTable>tbody>tr.child ul.dtr-details>li:last-child {
    flex-direction: column;
    display: flex;
}

table.dataTable>tbody>tr.child ul.dtr-details>li {
    border-bottom: none !important;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: end;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control {
    font-family: var(--fa-style-family, "Font Awesome 6 Free");
    font-weight: var(--fa-style, 900);
    width: 100%;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before,
table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before {
    content: "\2b" !important;
    margin-right: 10px !important;
    box-sizing: border-box;
    content: "";
    border: none;
    background-color: #f77b0b26;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

table.dataTable.dtr-inline.collapsed>tbody>tr.dtr-expanded>td.dtr-control:before,
table.dataTable.dtr-inline.collapsed>tbody>tr.dtr-expanded>th.dtr-control:before {
    content: "\f068" !important;
    border: none !important;
}

div.dt-container.dt-empty-footer tbody>tr:last-child>* {
    border-bottom: none;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control {
    padding-top: 15px;
    padding-bottom: 15px;
}

.select2-dropdown {
    box-shadow: 5px 5px 51px 0px var(--borderColor);
    border: none;
    border-radius: 8px !important;
    background-color: #FFF;
    min-width: 160px;
    /* width: max-content !important; */
    overflow: hidden;
}

.select2-dropdown li {
    text-decoration: none;
    color: #949494;
    padding: 9px 16px;
    display: block;
    width: 100%;
    font-family: 'gilroy-medium';
    font-size: 14px;
}

input:focus-visible {
    outline: none !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border-color: var(--borderColor);
    border-radius: 8px !important;
}

table.dataTable {
    width: 100% !important;
}

.form-input .select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 4px !important;
    right: 10px;
}

.form-input .select2-dropdown {
    width: 100% !important;
}


#add-products-navs {
    display: flex;
    flex-direction: column;
    align-items: start;
    border-bottom: none;
}

#add-products-navs .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link {
    border: none;
    width: 100%;
    text-align: start;
    font-weight: 400;
    font-family: 'gilroy-medium';
    color: var(--secondaryColor);
}

#add-products-navs .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    background-color: var(--ItemActive);
    color: var(--HoverText);
    font-weight: 400;
    font-family: 'gilroy-medium';
}

.language-tabs {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.language-tabs div {
    flex: auto;
}

.language-tabs label {
    padding: 12px 10px;
    width: 100%;
    cursor: pointer;
    text-align: center;
    font-size: 12px;
    position: relative;
    display: flex;
    color: var(--blackColor);
    align-items: center;
    gap: 5px;
    justify-content: center;
}

.language-tabs label::after {
    content: "";
    background-color: var(--inputBorder);
    height: 2px;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
}

.language-tabs input:checked+label::after {
    content: "";
    background-color: var(--primaryColor);
    height: 2px;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
}

.product-sidebar {
    width: 268px;
    min-width: 268px;
    min-height: calc(100vh - 180px);
}

.product-content {
    width: calc(100% - 268px);
    padding: 0 20px;
}

.product-sidebar .nav-tabs .nav-link {
    border-radius: 10px !important;
    font-size: 14px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--blackColor);
}

.product-category-tree {
    border: 1px solid var(--inputBorder);
    height: max-content;
    border-radius: 12px;
    padding: 20px;
}

.product-category-tree #treeview_container {
    padding: 20px 0;
}

.hummingbird-base {
    padding: 0;
}

.hummingbird-base .form-check-input {
    vertical-align: unset;
}

.hummingbird-base .form-check-input .fa-add:before,
.fa-plus:before {
    content: "\f067";
    font-weight: 100;
}

.hummingbird-base .form-check-input .fa-minus:before,
.fa-subtract:before {
    content: "\f068";
    font-weight: 100;
}

.hummingbird-treeview,
.hummingbird-treeview * {
    font-size: 15px;
}

.hummingbird-treeview .fa {
    margin-right: 5px;
    color: var(--blackColor);
}

.hummingbird-treeview input[type=checkbox] {
    margin-right: 5px;
}


.sign-in {
    height: 100vh;
    display: flex;
}

.sign-in .sign-in-left::-webkit-scrollbar,
.sign-in .sign-in-right::-webkit-scrollbar {
    width: 0;
}

.sign-in .sign-in-left {
    position: relative;
    padding: 50px;
    overflow: auto;
    width: 50%;
    height: 100%;
    text-align: center;
    background-image: url('../images/sign-in-left-bg.png');
    background-size: cover;
    background-position: bottom;
}

.sign-in .sign-in-left .gg-logo {
    margin-bottom: 20px;
}

.sign-in .sign-in-left p {
    max-width: 450px;
    margin: auto;
    font-size: 18px;
    color: #000;
    font-family: "gilroy-medium";
}

.sign-in .sign-in-left .sign-in-left-mobile {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    max-width: 52%;
    max-height: 80%;
    z-index: -1;
}

.sign-in .sign-in-right {
    position: relative;
    padding: 50px;
    overflow: auto;
    width: 50%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sign-in .sign-in-right .sign-in-right-box {
    width: 100%;
    max-width: 500px;
}

.sign-in .sign-in-right .sign-in-right-box .title {
    text-align: center;
    font-size: 32px;
    font-family: "Gilroy-Semibold";
}

.sign-in .sign-in-right .sign-in-right-box .desc {
    text-align: center;
    font-size: 14px;
    color: #00000080;
    font-family: "Gilroy-Semibold";
    margin-bottom: 30px;
}

.sign-in .sign-in-right .sign-in-right-box input {
    background-color: #00000008;
    border: 0;
    font-size: 14px;
    padding: 12px 14px 12px 14px;
    padding-inline-start: 50px;
}

.sign-in .sign-in-right .sign-in-right-box .form-group {
    position: relative;
}

.sign-in .sign-in-right .sign-in-right-box .form-group .form-group-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 15px;
    display: inline-block;
    line-height: 0;
}

.sign-in .sign-in-right .sign-in-right-box .form-group .form-group-icon-right img,
.sign-in .sign-in-right .sign-in-right-box .form-group .form-group-icon img {
    width: 20px;
}

.sign-in .sign-in-right .sign-in-right-box .form-group .form-group-icon-right {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 15px;
    display: inline-block;
    line-height: 0;
}

.sign-in .sign-in-right .sign-in-right-box .logo-desc {
    text-align: center;
}

.sign-in .sign-in-right .sign-in-right-box .logo-desc .gg-logo {
    margin-bottom: 20px;
}

.sign-in .sign-in-right .sign-in-right-box .logo-desc p {
    max-width: 450px;
    margin: auto;
    font-size: 18px;
    color: #000;
    font-family: "gilroy-medium";
    margin-bottom: 50px;
}

.sign-in .sign-in-right .sign-in-right-box .forget-password {
    text-decoration: none;
    color: #1F71ED;
    display: block;
    text-align: center;
    margin: 15px 0;
    font-size: 14px;
    font-family: "gilroy-medium";
}

.sign-in .sign-in-right .sign-in-right-box a {
    color: #1F71ED;
}

.sign-in .sign-in-right .sign-in-right-box .btn-primary {
    font-family: "gilroy-regular";
}

.sign-in .sign-in-right .sign-in-right-box .have-an-account {
    text-align: center;
    margin-top: 25px;
    font-size: 14px;
    color: #8B8D97;
    font-family: "gilroy-medium";
}

@media screen and (max-width: 992px) {
    .sign-in .sign-in-left {
        display: none;
    }

    .sign-in .sign-in-right {
        width: 100%;
        padding: 30px;
        align-items: flex-start;
    }

    .sign-in .sign-in-right .sign-in-right-box .title {
        font-size: 26px;
    }

    .sign-in .sign-in-right .sign-in-right-box .desc {
        font-size: 14px;
    }

    .sign-in .sign-in-right .sign-in-right-box .logo-desc p {
        font-size: 14px;
    }
}

.hummingbird-treeview label {
    background-color: transparent !important;
    color: var(--blackColor) !important;
}

.notification-bar {
    position: relative;
    cursor: pointer;
}

.notification-bar:hover .notification-box {
    z-index: 100;
    opacity: 1;
    visibility: visible;
}

.notification-box {
    position: absolute;
    top: 40px;
    right: 0;
    z-index: -1;
    width: max-content;
    min-width: 400px;
    box-shadow: 0 0 50px 0 rgba(82, 63, 105, 0.15);
    border: 1px solid var(--inputBorder);
    background-color: var(--widgetBg);
    visibility: hidden;
    opacity: 0;
    transition: .4s all;

}

#notification-tab {
    background-color: var(--widgetBg);
    margin: 0 !important;
    gap: 0;
}

#notification-tab li {
    flex: 1;
}

#notification-tab li button {
    width: 100%;
    color: var(--blackColor);
    background-color: transparent;
    border-bottom: 2px solid var(--inputBorder);
    border-radius: 0;
    font-size: 14px;
}

#notification-tab li .nav-link.active {
    background-color: transparent;
    border-color: var(--brandColor);
}

#notification-tabContent {
    background-color: var(--widgetBg);
}

#notification-tabContent li {
    background-color: transparent;
    border-bottom-color: var(--inputBorder);
    font-size: 14px;
}

#notification-tabContent ul {
    flex-direction: column;
    gap: 0;
    height: 400px;
    overflow-y: auto;
}

#notification-tabContent ul li p {
    color: var(--secondaryColor);
}

.notification-viewAll a {
    color: var(--secondaryColor);
    text-align: center;
    text-decoration: none;
    display: block;
    width: 100%;
    font-size: 14px;
    padding-top: 5px;
    padding-bottom: 10px;
}

.product-desc-tb {
    align-items: center;
}

.ck.ck-editor__main>.ck-editor__editable {
    height: 180px;
}

.ck.ck-editor__editable_inline {
    color: #000;
}

.ck.ck-editor__editable_inline p {
    color: #000;
}

.attributes-sizes {
    display: flex;
    align-items: center;
    gap: 5px;
}

.attributes-sizes span {
    background-color: rgba(42, 50, 66, 0.15);
    color: #000;
    border-radius: 6px;
    padding: 5px 7px;
    font-size: 0.75rem;
    display: block;
}

.nested-dropdown {
    display: none;
}

.bulk-import-row {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 10px;
}

.bulk-import {
    padding: 12px;
    background-color: #cce5ff;
    border-radius: 4px;
    border: 1px solid #b8daff;
}

.bulk-import h6 {
    color: #004085;
    font-weight: bold;
    font-size: 16px;
}

.bulk-import ol {
    margin: 0;
}

.bulk-import ol li {
    color: #004085;
    font-size: small;
    margin-bottom: 10px;
}

#job-responsibliy button {
    font-size: small;
    padding: 11px !important;
    background-color: rgb(230, 229, 229);
}

#job-responsibliy button:hover {
    background-color: rgba(230, 229, 229, 0.568);
}

#benefits-points button {
    font-size: small;
    padding: 11px !important;
    background-color: rgb(230, 229, 229);
}

#benefits-points button:hover {
    background-color: rgba(230, 229, 229, 0.568);
}

.append-btn {
    font-size: small;
    padding: 11px !important;
    background-color: rgb(230, 229, 229);
}

.append-btn:hover {
    background-color: rgba(230, 229, 229, 0.568);
}


.main-switch {
    padding: 30px 0px 10px 0px;
}

.text-simple {
    font-size: 13px;
    font-weight: 400;
}

.main-seller-panel {
    padding: 30px 0px 20px 0px;
}

.button-left {
    float: inline-end;
}

.verification-form {
    margin-top: 15px;
}

.seller-verification {
    margin-bottom: 10px;
}

.verfication-heading {
    font-family: 'gilroy-medium';
    font-size: 1rem;
    color: #000;
}

.col-from-label {
    font-family: 'gilroy-light';
}

.add-option-input {
    margin: 10px 6px 0px 6px;
}

.verification-main {
    background-color: var(--widgetBg);
    padding: 20px 25px;
    border-radius: 16px;
    margin-bottom: 22px;
    align-content: stretch;
    width: 100%;
}

.button-option {
    background-color: #0abb75;
    border: solid 1px #0abb75;
    color: #fff;
    padding: 0.6rem 1.2rem;
    font-size: 0.875rem;
    font-weight: inherit;
}

.button-option:hover {
    color: #fff;
    background-color: #218838;
    border-color: #1e7e34;
}

.font-text {
    font-family: 'gilroy-light';
}

.product-sale-main {
    background-color: var(--widgetBg);
    padding: 20px 25px;
    border-radius: 16px;
    margin-bottom: 22px;
    align-content: stretch;
    /* width: 100%;  */
}

.btn-soft-icon {
    background-color: rgba(247, 123, 11, 0.15);
    color: var(--primaryColor);
    padding: 0.416rem;
    width: calc(2.02rem + 2px);
    height: calc(2.02rem + 2px);
    border-radius: 50%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.weight-font {
    font-weight: 400;
    font-family: 'gilroy-semibold';
}

.alert-font {
    font-size: 14px;
}

.role-box {
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid var(--inputBorder);
    margin-top: 15px;
}

.role-box .role-box-header {
    background-color: #f2f3f8;
    padding: 8px 18px;
    font-size: 15px;
    font-weight: 600;
}

.role-box-row {
    padding: 25px 13px;
    gap: 15px 0;
    align-items: stretch;
}

.role-switch {
    border-radius: 6px;
    border: 1px solid var(--inputBorder);
    padding: 10px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.role-switch label {
    color: var(--blackColor);
    font-weight: 400 !important;
    margin-bottom: 10px !important;
}

.select-homepage label {
    cursor: pointer;
    border: 4px solid transparent;
    position: relative;
}

.select-homepage input[type="radio"]:checked~label {
    border-color: #1f71ed;
}

.select-homepage label::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #000;
    opacity: 0.3;
    z-index: 1;
    transition: .4s;
}

.select-homepage label:hover::after {
    background: transparent;
}

.select-homepage .selectpage-image {
    height: 350px;
    overflow: hidden;
}

.select-homepage img {
    width: 100%;
}


.select-homepage a {
    background-color: #ef486a;
    font-family: 'gilroy-regular' !important;
    border: none;
    font-size: small;
    border-radius: 0;
}

.selecthome-page-btn {
    margin-top: 30px;
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
    background-color: #f2f3f8;
    color: #8f97ab;
    padding: 20px;
}

.selecthome-page-btn h5 {
    color: #8f97ab;
    font-weight: 300;
}

.selecthome-page-btn p {
    font-size: small;
}

.add-home-slider h6 {
    color: #8f97ab;
    margin-bottom: 0;
    font-weight: 500;
    font-size: 13px;
}

.add-home-slider p {
    font-size: 13px;
    color: #8f97ab;
}

.home-slider-box {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px dashed var(--inputBorder);
    padding: 15px;
}

.home-slider-box input[type="file"] {
    max-width: 30%;
    min-height: max-content;
}

.todays-deals-pd input[type="color"] {
    width: 18%;
    height: auto;
    overflow: hidden;
    align-self: stretch;
    padding: 0;
    cursor: pointer;
}

.selectpage-image-layout {
    height: 190px !important;
}

.upload-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.language-img {
    width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.upload-file-card-row {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(5, 1fr);
}

.img-upload-files {
    width: 100%;
    /* min-height: 100%; */
    background-color: lightgrey;
}

.img-upload-files img {
    width: 200px;
    height: 180px;
    object-fit: cover;
}

.check-droup {
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    padding: 10px 15px;
}

.upload-file-card {
    border: 1px solid #f1f1f4;
    box-shadow: 0px 6px 14px rgba(35, 39, 52, 0.04);
    border-radius: 8px;
    background: var(--widgetBg);
    position: relative;
    /* flex: 4/; */
    padding: 10px;
}

.language-text-repo {
    font-size: 14px;
    padding: 5px 0px;
    font-weight: 400;
}

.file-space-text {
    font-size: 10px;
    color: #8392a5;
    margin-bottom: 0px;
}

.droupdown-icon-dot {
    fill: #fff;
    stroke: #fff;
}

.text-sm-large {
    font-size: 10px;
    color: #8392a5;
}

.variant-table {
    vertical-align:middle;
}

.variant-name {
    font-size: 16px;
    line-height: 20px;
}

/*File Manager*/
.fmapp-wrap {
    position: relative;
    height: calc(100vh - 65px);
  }
  .fmapp-wrap .fmapp-sidebar {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-flow: column;
    left: 0;
    width: 270px;
    margin-left: 0;
    top: 0;
    height: 100%;
    z-index: 1;
    border: none;
    background: #fff;
    border-right: 1px solid #eaeaea;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  .fmapp-wrap .fmapp-sidebar > div.nicescroll-bar {
    flex: 1 1 auto;
    overflow: auto;
  }
  .fmapp-wrap .fmapp-sidebar .menu-content-wrap {
    padding: 1.5rem;
  }
  .fmapp-wrap .fmapp-sidebar .menu-content-wrap .menu-gap {
    height: 25px;
  }
  .fmapp-wrap .fmapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item {
    margin-left: -1rem;
    margin-right: -1rem;
  }
  .fmapp-wrap .fmapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item > .nav-link {
    border-radius: .5rem;
    padding: .5rem 1rem;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .fmapp-wrap .fmapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item > .nav-link .nav-icon-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: .875rem;
    font-size: 1.5rem;
  }
  .fmapp-wrap .fmapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item > .nav-link .nav-icon-wrap .nav-link-text {
    display: inline-block;
  }
  .fmapp-wrap .fmapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item.active > .nav-link {
    background: rgba(0, 125, 136, 0.15);
    color: #007D88;
  }
  .fmapp-wrap .fmapp-sidebar .fmapp-storage {
    padding: 1.5rem;
  }
  .fmapp-wrap .fmapp-sidebar .fmapp-fixednav {
    height: 61px;
    border-top: 1px solid #eaeaea;
  }
  .fmapp-wrap .fmapp-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    padding-left: 270px;
    position: relative;
    height: 100%;
    left: 0;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-grow: 1;
    background: #fff;
    flex-flow: column;
    height: 100%;
    z-index: 10;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap header.fm-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    height: 65px;
    padding: 0 1.25rem;
    background: #fff;
    border-bottom: 1px solid #eaeaea;
    position: relative;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap header.fm-header .fmapp-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap header.fm-header .fmapp-title h1 {
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap header.fm-header .fmapp-title:after {
    top: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap header.fm-header .fm-options-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap header.fm-header .fm-options-wrap > a {
    margin-left: .25rem;
    display: inline-block;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap header.fm-header .fm-options-wrap > a:first-child {
    margin-left: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
    overflow: hidden;
    -ms-flex: 1;
    flex: 1;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar {
    padding: 1.25rem;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .nav-line {
    margin: 0 -1.25rem;
    border-bottom: 1px solid #eaeaea;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: .625rem;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star > .feather-icon > svg, .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star .svg-icon > svg {
    height: 16px;
    width: 16px;
    cursor: pointer;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star > .feather-icon > svg:hover, .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star .svg-icon > svg:hover {
    fill: #FFC400;
    stroke: #FFC400;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star.marked > .feather-icon > svg, .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star.marked .svg-icon > svg {
    fill: #FFC400;
    stroke: #FFC400;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star.marked > .feather-icon > svg:hover, .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .file-star.marked .svg-icon > svg:hover {
    fill: none;
    stroke: currentColor;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .media .media-body .file-name {
    color: #262a2e;
    font-weight: 500;
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .fmapp-info-trigger.media {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .fmapp-info-trigger.media .media-body .file-name {
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    transition: color 0.2s ease;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-list-view .fmapp-info-trigger.media:hover .media-body .file-name {
    color: #007D88;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: .25rem;
    margin-top: .4rem;
    margin-left: .625rem;
    opacity: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star > .feather-icon > svg, .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star .svg-icon > svg {
    cursor: pointer;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star > .feather-icon > svg:hover, .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star .svg-icon > svg:hover {
    fill: #FFC400;
    stroke: #FFC400;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star.marked > .feather-icon > svg, .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star.marked .svg-icon > svg {
    fill: #FFC400;
    stroke: #FFC400;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star.marked > .feather-icon > svg:hover, .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .file-star.marked .svg-icon > svg:hover {
    fill: none;
    stroke: currentColor;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card {
    cursor: pointer;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card .card-body {
    min-height: 150px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card .card-body i {
    font-size: 2.375rem;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card .card-footer {
    display: block;
    -webkit-transition: background 0.2s ease;
    -moz-transition: background 0.2s ease;
    transition: background 0.2s ease;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card .card-footer > .d-flex > div {
    min-width: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card .card-footer > .d-flex > div .file-name {
    color: #262a2e;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card .file-star.marked {
    opacity: 1;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card:hover .file-star {
    opacity: 1;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card:hover .card-footer {
    background: #ebf5f5;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-card:hover .card-footer .file-name {
    color: #007D88;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card {
    -webkit-transition: background 0.2s ease;
    -moz-transition: background 0.2s ease;
    transition: background 0.2s ease;
    cursor: pointer;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card .card-body .media {
    overflow: hidden;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card .card-body .media .avatar {
    flex-shrink: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card .card-body .media .media-body {
    min-width: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card .card-body .media .media-body .file-name {
    color: #262a2e;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card .file-star.marked {
    opacity: 1;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card:hover {
    background: #ebf5f5;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card:hover .file-star {
    opacity: 1;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card:hover .card-body .media .avatar {
    flex-shrink: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .fm-body .nicescroll-bar .file-card-view .card.file-compact-card:hover .card-body .media .media-body .file-name {
    color: #007D88;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info {
    position: absolute;
    top: 65px;
    right: -370px;
    width: 370px;
    margin-left: 0;
    bottom: 0;
    z-index: 100;
    border: none;
    background: #fff;
    border-left: 1px solid #eaeaea;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .nicescroll-bar {
    padding: 1.25rem;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .file-name {
    color: #262a2e;
    font-size: 1.25rem;
    font-weight: 500;
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-info {
    padding-left: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-info li {
    margin-bottom: .625rem;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-info li a {
    color: #262a2e;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-info li > span {
    display: inline-block;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-info li > span:first-child {
    min-width: 100px;
    margin-right: 1rem;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-info li > span:last-child {
    color: #262a2e;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-action {
    padding-left: 0;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-action li {
    margin-bottom: .625rem;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-action li a {
    color: #262a2e;
  }
  .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info .fm-action li:last-child {
    margin-bottom: .25rem;
  }
  .fmapp-wrap.fmapp-info-active .fmapp-detail-wrap .file-info {
    right: 0;
  }
  .fmapp-wrap.fmapp-sidebar-toggle .fmapp-sidebar {
    left: -270px;
  }
  .fmapp-wrap.fmapp-sidebar-toggle .fmapp-content {
    padding-left: 0;
  }
  
  .hk-wrapper[data-navbar-style="collapsed"] .fmapp-wrap {
    height: 100vh;
  }
  
  @media (max-width: 1199px) {
    .fmapp-wrap .fmapp-content .fmapp-detail-wrap .file-info {
      top: 0;
    }
  }
  @media (max-width: 767px) {
    .fmapp-wrap .fmapp-sidebar {
      left: -270px;
    }
    .fmapp-wrap .fmapp-content {
      margin-left: 0;
      padding-left: 0;
    }
    .fmapp-wrap.fmapp-sidebar-toggle .fmapp-sidebar {
      left: 0;
    }
    .fmapp-wrap.fmapp-sidebar-toggle .fmapp-content {
      left: 270px;
      padding-left: 270px;
      margin-left: -270px;
    }
    .fmapp-wrap .hk-sidebar-togglable {
      -webkit-transform: translateX(32px);
      -moz-transform: translateX(32px);
      -ms-transform: translateX(32px);
      -o-transform: translateX(32px);
      transform: translateX(32px);
    }
    .fmapp-wrap .hk-sidebar-togglable:after {
      content: "\ea6c";
    }
    .fmapp-wrap .hk-sidebar-togglable.active {
      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
      transform: translateX(0);
    }
    .fmapp-wrap .hk-sidebar-togglable.active:after {
      content: "\ea62";
    }
  }
  /*Gallery App*/
  .galleryapp-wrap {
    position: relative;
    height: calc(100vh - 65px);
  }
  .galleryapp-wrap .galleryapp-sidebar {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-flow: column;
    left: 0;
    width: 270px;
    margin-left: 0;
    top: 0;
    height: 100%;
    z-index: 1;
    border: none;
    background: #fff;
    border-right: 1px solid #eaeaea;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  .galleryapp-wrap .galleryapp-sidebar > div.nicescroll-bar {
    flex: 1 1 auto;
    overflow: auto;
  }
  .galleryapp-wrap .galleryapp-sidebar .menu-content-wrap {
    padding: 1.5rem;
  }
  .galleryapp-wrap .galleryapp-sidebar .menu-content-wrap .menu-gap {
    height: 25px;
  }
  .galleryapp-wrap .galleryapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item {
    margin-left: -1rem;
    margin-right: -1rem;
  }
  .galleryapp-wrap .galleryapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item > .nav-link {
    border-radius: .5rem;
    padding: .5rem 1rem;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .galleryapp-wrap .galleryapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item > .nav-link .nav-icon-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: .875rem;
    font-size: 1.5rem;
  }
  .galleryapp-wrap .galleryapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item > .nav-link .nav-icon-wrap .nav-link-text {
    display: inline-block;
  }
  .galleryapp-wrap .galleryapp-sidebar .menu-content-wrap .menu-group > .navbar-nav > .nav-item.active > .nav-link {
    background: rgba(0, 125, 136, 0.15);
    color: #007D88;
  }
  .galleryapp-wrap .galleryapp-sidebar .galleryapp-fixednav {
    height: 61px;
    border-top: 1px solid #eaeaea;
  }
  .galleryapp-wrap .galleryapp-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    padding-left: 270px;
    position: relative;
    height: 100%;
    left: 0;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-grow: 1;
    background: #fff;
    flex-flow: column;
    height: 100%;
    z-index: 10;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap header.gallery-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    height: 65px;
    padding: 0 1.25rem;
    background: #fff;
    border-bottom: 1px solid #eaeaea;
    position: relative;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap header.gallery-header .galleryapp-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap header.gallery-header .galleryapp-title h1 {
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 0;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap header.gallery-header .galleryapp-title:after {
    top: 0;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap header.gallery-header .gallery-options-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap header.gallery-header .gallery-options-wrap > a {
    margin-left: .25rem;
    display: inline-block;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap header.gallery-header .gallery-options-wrap > a:first-child {
    margin-left: 0;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
    overflow: hidden;
    -ms-flex: 1;
    flex: 1;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar {
    padding: 1.25rem;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a {
    position: relative;
    display: block;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .form-check {
    position: absolute;
    left: 14px;
    top: 17px;
    cursor: pointer;
    opacity: 0;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    right: 14px;
    top: 20px;
    opacity: 0;
    color: #6f6f6f;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star > .feather-icon > svg, .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star .svg-icon > svg {
    cursor: pointer;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star > .feather-icon > svg:hover, .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star .svg-icon > svg:hover {
    fill: #FFC400;
    stroke: #FFC400;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star.marked {
    opacity: 1;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star.marked > .feather-icon > svg, .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star.marked .svg-icon > svg {
    fill: #FFC400;
    stroke: #FFC400;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star.marked > .feather-icon > svg:hover, .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-star.marked .svg-icon > svg:hover {
    fill: none;
    stroke: currentColor;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a:hover .form-check {
    opacity: 1;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a:hover .gallery-star {
    opacity: 1;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-img {
    min-height: 230px;
    background-size: cover;
    background-position: center;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body .nicescroll-bar .hk-gallery a .gallery-img.gallery-video:after {
    content: "\efb6";
    font-family: remixicon;
    font-style: normal;
    position: absolute;
    right: 14px;
    bottom: 14px;
    font-size: 1.5rem;
    height: 35px;
    width: 35px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.45);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    color: #fff;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body.select-multiple .nicescroll-bar {
    padding: 1.25rem;
  }
  .galleryapp-wrap .galleryapp-content .galleryapp-detail-wrap .gallery-body.select-multiple .nicescroll-bar .hk-gallery a .form-check {
    opacity: 1;
  }
  .galleryapp-wrap.galleryapp-sidebar-toggle .galleryapp-sidebar {
    left: -270px;
  }
  .galleryapp-wrap.galleryapp-sidebar-toggle .galleryapp-content {
    padding-left: 0;
  }
  
  .lg-outer.galleryapp-info-active .lg-img-wrap {
    padding-right: 26.25rem !important;
    background: url("../img/loading.gif") no-repeat scroll transparent;
    background-position: center center;
    background-position: calc((100% - 300px) / 2) center;
  }
  .lg-outer.galleryapp-info-active .lg-video-cont {
    padding-right: 20rem !important;
    background: url("../img/loading.gif") no-repeat scroll transparent;
    background-position: center center;
    background-position: calc((100% - 300px) / 2) center;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html {
    height: 100%;
    overflow-y: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 420px;
    z-index: 99999;
    left: auto;
    color: inherit;
    padding: 0;
    text-align: left;
    background: #fff url("../img/loading.gif") no-repeat scroll center center;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html header.gallery-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    padding: 1.25rem;
    margin: 0 -1.25rem;
    height: 65px;
    border-bottom: 1px solid #eaeaea;
    position: relative;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html header.gallery-header .file-name {
    font-weight: 500;
    color: #262a2e;
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html header.gallery-header .file-type {
    font-size: 0.75rem;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html header.gallery-header .gallery-options-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html header.gallery-header .gallery-options-wrap > a {
    margin-left: .25rem;
    display: inline-block;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html header.gallery-header .gallery-options-wrap > a:first-child {
    margin-left: 0;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html .gallery-detail-body .file-info li {
    margin-bottom: .625rem;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html .gallery-detail-body .file-info li > span {
    display: inline-block;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html .gallery-detail-body .file-info li > span:first-child {
    min-width: 100px;
    margin-right: 1rem;
  }
  .lg-outer.galleryapp-info-active .lg-sub-html .gallery-detail-body .file-info li > span:last-child {
    color: #262a2e;
  }
  .lg-outer.galleryapp-info-active .galleryapp-info-active.fb_iframe_widget {
    background-image: none;
  }
  .lg-outer.galleryapp-info-active .galleryapp-info-active.fb_iframe_widget.fb_iframe_widget_loader {
    background: #fff url("../img/loading.gif") no-repeat scroll center center;
  }
  .lg-outer.galleryapp-info-active .lg-toolbar {
    right: 420px;
    width: auto;
  }
  .lg-outer.galleryapp-info-active .lg-actions .lg-next {
    right: 440px;
  }
  .lg-outer.galleryapp-info-active .lg-item {
    background-image: none;
  }
  .lg-outer.galleryapp-info-active .lg-item.lg-complete .lg-img-wrap {
    background-image: none;
  }
  .lg-outer.galleryapp-info-active .lg-item.lg-complete .lg-video-cont {
    background-image: none;
  }
  
  .hk-wrapper[data-navbar-style="collapsed"] .galleryapp-wrap {
    height: 100vh;
  }
  
  @media (max-width: 767px) {
    .galleryapp-wrap .galleryapp-sidebar {
      left: -270px;
    }
    .galleryapp-wrap .galleryapp-content {
      margin-left: 0;
      padding-left: 0;
    }
    .galleryapp-wrap.galleryapp-sidebar-toggle .galleryapp-sidebar {
      left: 0;
    }
    .galleryapp-wrap.galleryapp-sidebar-toggle .galleryapp-content {
      left: 270px;
      padding-left: 270px;
      margin-left: -270px;
    }
    .galleryapp-wrap .hk-sidebar-togglable {
      -webkit-transform: translateX(32px);
      -moz-transform: translateX(32px);
      -ms-transform: translateX(32px);
      -o-transform: translateX(32px);
      transform: translateX(32px);
    }
    .galleryapp-wrap .hk-sidebar-togglable:after {
      content: "\ea6c";
    }
    .galleryapp-wrap .hk-sidebar-togglable.active {
      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
      transform: translateX(0);
    }
    .galleryapp-wrap .hk-sidebar-togglable.active:after {
      content: "\ea62";
    }
  
    .lg-outer.galleryapp-info-active .lg-img-wrap {
      padding-right: 0 !important;
    }
    .lg-outer.galleryapp-info-active .lg-video-cont {
      padding-right: 0 !important;
    }
    .lg-outer.galleryapp-info-active .lg-sub-html {
      display: none;
    }
    .lg-outer.galleryapp-info-active .lg-toolbar {
      right: 0;
    }
    .lg-outer.galleryapp-info-active .lg-actions .lg-next {
      right: 20px;
    }
  }
  .dropzone {
    border: 1px dashed #d8d8d8;
    color: #262a2e;
    border-radius: 0.25rem;
  }
  .dropzone .dz-message {
    margin: 3em 0;
    font-weight: 500;
    color: #262a2e;
  }
  .dropzone .dz-preview .dz-details {
    color: #262a2e;
  }
  .dropzone .dz-preview .dz-filename span {
    background-color: transparent;
  }
  .dropzone .dz-preview .dz-image {
    border-radius: 0.25rem;
  }
  .dropzone .dz-preview.dz-file-preview .dz-image {
    border-radius: 0.25rem;
  }

  .dropify-wrapper {
    border: 1px dashed #d8d8d8;
    border-radius: 0.25rem;
    font-family: inherit;
    color: #262a2e;
    font-size: 1rem;
    padding: 1rem;
  }
  .dropify-wrapper .dropify-message p .main-text {
    display: block;
    color: #262a2e;
    font-weight: 500;
  }
  .dropify-wrapper .dropify-message p .sub-text {
    font-size: 0.875rem;
    display: block;
    color: #6f6f6f;
  }
  .dropify-wrapper .dropify-message span.file-icon {
    font-size: 2rem;
    color: #fff;
    height: 3rem;
    width: 3rem;
    display: block;
    margin: auto;
    color: #9e9e9e;
    position: relative;
  }
  .dropify-wrapper .dropify-message span.file-icon:before {
    content: "\F603";
    display: inline-block;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -0.125em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    top: 50%;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .dropify-wrapper .dropify-preview .dropify-infos {
    background: rgba(47, 52, 58, 0.85);
  }
  .dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p {
    font-weight: 500;
  }
  .dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-infos-message {
    margin-top: 0px;
    padding-top: 0px;
    opacity: 1;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #9e9e9e;
    font-size: 0.875rem;
  }
  .dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-infos-message:before {
    display: none;
  }
  .dropify-wrapper .dropify-clear {
    border: none;
    font-size: 0.75rem;
    padding: .125rem .375rem;
    font-weight: 500;
    letter-spacing: 0.5px;
    top: 8px;
    right: 8px;
  }
  .dropify-wrapper .dropify-clear:hover {
    border-radius: 1rem;
  }
  .dropify-wrapper:hover {
    background-image: none;
  }
  
  .dropify-square .dropify-wrapper,
  .dropify-circle .dropify-wrapper {
    height: 7.5rem;
    width: 7.5rem;
    overflow: visible;
  }
  .dropify-square .dropify-wrapper .dropify-message,
  .dropify-circle .dropify-wrapper .dropify-message {
    font-size: 0.875rem;
  }
  .dropify-square .dropify-wrapper .dropify-message span.file-icon,
  .dropify-circle .dropify-wrapper .dropify-message span.file-icon {
    font-size: 1.25rem;
    height: 1.25rem;
    width: 1.25rem;
  }
  .dropify-square .dropify-wrapper .dropify-message p,
  .dropify-circle .dropify-wrapper .dropify-message p {
    font-size: 0.875rem;
  }
  .dropify-square .dropify-wrapper .dropify-preview,
  .dropify-circle .dropify-wrapper .dropify-preview {
    border-radius: 50%;
    padding: 0;
  }
  .dropify-square .dropify-wrapper:hover .dropify-clear, .dropify-square .dropify-wrapper:hover .dropify-preview .dropify-infos,
  .dropify-circle .dropify-wrapper:hover .dropify-clear,
  .dropify-circle .dropify-wrapper:hover .dropify-preview .dropify-infos {
    opacity: 0;
  }
  
  .dropify-circle .dropify-wrapper {
    border-radius: 50%;
  }