/*mode preview*/

.dark-preview {
    background: #0d0d0d !important;
}

.dark-preview div.btn-container i.fa-sun-o {
    color: #777;
}

.dark-preview div.btn-container i.fa-moon-o {
    color: #fff;
    text-shadow: 0px 0px 11px #fff;
}

.dark-preview .device-name {
    color: white;
}

.dark-preview .logo {
    filter: invert(90%);
}

.dark-preview .icon-battery {
    color: white;
}

.dark-preview .selected {
    background-color: #2b2b2b;
}

.dark-preview .device-section:hover {
    background-color: #2b2b2b;
}

.dark-preview .icon-settings {
    background-color: #5e5e5e;
    border-radius: 50%;
    color: white;
}

.dark-preview .personalize-content {
    background-color: #1b1b1b;
}

.dark-preview .shadow-card {
    background-color: #2b2b2b;
}

.dark-preview .card-section-title {
    color: #c0c0c0;
}

.dark-preview .stage-section {
    background-color: #1f1f1f;
    color: white;
}

.dark-preview .input-number-section {
    background-color: #000;
    color: rgba(255, 255, 255, 0.687);
    border: 1px solid #ced4da18;
}

.dark-preview .section-description {
    color: white;
}

.dark-preview .type-section {
    background-color: #1f1f1f
}

.dark-preview .type-section:hover {
    background-color: #444444
}

.dark-preview .type-section i {
    color: #c0c0c0;
}

.dark-preview .type-section path {
    fill: #c0c0c0;
}

.dark-preview  .active .type-section {
    background-color: #ffffff;
    color: #d30000;
}
.dark-preview .type-title {
    color: white;
}

.dark-preview .text-section {
    color: #505050;
}

.dark-preview .text-section-selected {
    color: white;
}

.dark-preview .modal-header {
    background-color: #555555;
    border-bottom: none;
}

.dark-preview .modal-title {
    color: #fdfdfd;
}

.dark-preview .modal .btn-close {
    color: #f9f9f9 !important;
}

.dark-preview .modal-content {
    background-color: #2b2b2b;
}

.dark-preview .modal-footer {}

.dark-preview .device-select-section {
    background-color: #555555;
}

.dark-preview .device-select-section span {
    color: white;
}

.dark-preview .btn-default {
    background-color: #555555 !important;
    color: #a2a2a2 !important;
}

.dark-preview .section-selected {
    background-color: #c1c1c1 !important;
    font-weight: bold;
}
.dark-preview .section-selected i{
    font-weight: bold;
    color: black !important;
}
.dark-preview .section-selected path{
    fill: #1f1f1f!important;
}

.dark-preview .setting-modal .menu-title {
    color: white;
}

.dark-preview .setting-modal .menu-version {
    color: #969696;
}

.dark-preview .divider {
    border: 1px solid rgb(75, 75, 75);
}

.dark-preview .form-select {
    background-color: #555555 !important;
    border-color: transparent !important;
    color: #afafaf;
}


p.by a {
    text-decoration: none;
    color: #000;
}

.dark-preview .input-switch .input+.switch::after {
    background-color: #efefef;
    /*nut cham tat*/
}

.dark-preview .input-switch .input:checked+.switch {
    background-color: #3bb1ff;
}

.dark-preview .input-switch .input:checked+.switch::before {
    width: calc(100%);
    background-color: #69879b;
}

.dark-preview .input-switch .input:checked+.switch::after {
    left: calc(100% - (20px));
    background-color: #3bb1ff;
}
.dark-preview input[type="range"]::-webkit-slider-thumb {
    background: #ffffff;
}

.dark-preview input[type="range"]::-moz-range-thumb {
    background: #ffffff;
}

.dark-preview input[type="range"]::-ms-thumb {
    background: #4c4c4c;
}

.dark-preview .device-section.selected {
    background-color: rgba(255, 255, 255, 0.1);
}

.dark-preview .general-setting-text{
    color: white;    
}
.dark-preview .general-setting-icon{
    color: white;
}

.dark-preview .device-name-setting{
    color:  #c0c0c0 !important;
}
.dark-preview   .text-empty-noti{
color:  #c0c0c0 !important;
}