.dark {
    --white: #0a0a0a;
    --black: #FFFFFF;
    --grey: #9ca3af;
    --griss: #2a2a2a;
    --nar: #FF9900;
    --op_nar: rgba(255, 153, 0, 0.3);
    --op_nar2: rgba(255, 153, 0, 0.8);
    --op_gris: rgba(255, 255, 255, 0.1);
    --op_griss: rgba(232, 232, 232, 0.4);
    --op_red: rgba(255, 0, 0, 0.4);

    --green2: #51ff6e;
    --green: #2dfc4f;

    --red: #ff6161;

    color: white;
}

.dark .nar {
    color: var(--nar);
}


.dark .white {
    color: white;
}


.dark #staticbackground,
.dark #all_load {
    background-color: #0a0a0a;
    background-image: url(../img/background_dark.jpg);
}

.dark #all_load .loader .texto {
    color: var(--black);
}

.dark header {
    border-bottom: 1px solid #9ca3af;
    box-shadow: 0px 15px 10px -5px rgba(156, 163, 175, 0.05);
}

.dark footer {
    border-top: 1px solid #9ca3af;
    box-shadow: 0px -15px 10px -5px rgba(156, 163, 175, 0.05);
}

.dark #menu a,
.dark #menu span {
    color: var(--black);
}

.dark header nav #primer li li:hover a,
.dark header nav #primer li li:hover span,
.dark header nav #primer li li.select a,
.dark header nav #primer li li.select span,
.dark header nav #primer li.select li a,
.dark header nav #primer li.select li span {
    color: var(--black);
}



.dark .logodark {
    display: inline;
}

.dark .logolight {
    display: none;
}

.dark .checkradesp .item {
    border: 1px solid #9ca3af;
    transition: all 0.5s;
    box-shadow: 15px 15px 10px -5px rgba(156, 163, 175, 0.05);
}

.dark .checkradesp .item:hover {
    border-color: var(--nar);
}

.dark input[type="text"],
.dark input[type="password"],
.dark textarea,
.dark input[type="email"],
.dark input[type="tel"],
.dark input[type="number"],
.dark input[type="date"],
.dark input[type="search"] {
    border: 1px solid var(--griss);
    color: var(--black);
    background-color: #0a0a0a;
}

.dark input[type="text"]:focus,
.dark input[type="password"]:focus,
.dark textarea:focus,
.dark input[type="email"]:focus,
.dark input[type="tel"]:focus,
.dark input[type="number"]:focus,
.dark input[type="date"]:focus,
.dark input[type="search"]:focus {
    border: 1px solid var(--nar);
}

.dark input:autofill,
.dark input:-webkit-autofill,
.dark input:-webkit-autofill:hover,
.dark input:-webkit-autofill:focus,
.dark input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px var(--griss) inset;
    -webkit-text-fill-color: var(--black);
    border: 1px solid var(--griss);
}

.dark .checkradesp .item.checked {
    color: var(--black);
}

.dark select {
    color: white;
    background-color: #0a0a0a;
}

.dark input[readonly] {
    background-color: transparent;
}

.dark .group:has(> input:disabled)>.prepend,
.dark .group:has(> input:disabled)>input,
.dark .group:has(> input:disabled)>input::placeholder,
.dark .group:has(> input:disabled)>.append {
    opacity: 0;
}

.dark select option {
    color: white;
    background-color: var(--griss);
}

.dark .select2-container--default .select2-selection--multiple {
    background-color: #0a0a0a;
    border: 1px solid var(--griss);
    color: var(--black);
}


.dark .select2-container--default .select2-selection--single {
    background-color: #0a0a0a;
    border: 1px solid var(--griss);
    color: var(--black);
}

.dark .select2-dropdown {
    background-color: var(--white);
    border: 1px solid var(--griss);
    color: var(--black);
}

/*
.dark h1,
.dark h2,
.dark h3,
.dark h4,
.dark h5,
.dark h6 {
    color: var(--black);
}
*/
.dark .btn,
.dark input[type="submit"].btn {
    color: var(--black);
}

.dark .btnesp button.active {
    color: var(--black);
}

.dark .sweet-alert {
    background-color: var(--griss);
}

.dark .sweet-alert .sa-icon.sa-success::before,
.dark .sweet-alert .sa-icon.sa-success::after,
.dark .sweet-alert .sa-icon.sa-success .sa-fix {
    background-color: var(--griss);
}

.dark .sweet-alert .sa-icon.sa-success .sa-placeholder {
    border-color: white;
}

.dark .sweet-alert h2,
.dark .sweet-alert p {
    color: white;
}

/* TABALAS */
.dark .dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dark .dataTables_wrapper .dataTables_paginate .paginate_button.active {
    color: white;
}

.dark .colortable tbody tr td.icons a,
.dark .colortable tbody tr td.icons button,
.dark .colortable tbody tr td .icons a,
.dark .colortable tbody tr td .icons button {
    color: white;
}

.dark .colortable tbody tr td.icons a:hover,
.dark .colortable tbody tr td.icons button:hover,
.dark .colortable tbody tr td .icons a:hover,
.dark .colortable tbody tr td .icons button:hover {
    color: var(--nar);
}

.dark #items .item,
.dark #portfolio .product .contenido .asset_item,
.dark #portfolio_ver .wgrafic .itemasset,
.dark #portfolio_ver #notifica .itemnoti {
    background-color: var(--griss);
    border: 1px solid #9ca3af;
    box-shadow: 15px 15px 10px -5px rgba(156, 163, 175, 0.05);
}

/* MODAL */

.dark .modal {
    background: #19191a;
    box-shadow: none;
    border-radius: 0;
}

.dark .blocker {
    background-color: rgba(0, 0, 0, 0.4);
}

.dark .checktb tbody tr.active {
    color: white;
}

.dark #graficas .white {
    color: white;
}

.dark .group .prepend,
.dark .group .append {
    background-color: #0a0a0a;
    border: 1px solid var(--griss);
}

/* TABS */
.dark .tab,
.dark .tab2 {
    background: var(--griss);
}

.dark .tab:hover,
.dark .tab.active,
.dark .tab2:hover,
.dark .tab2.active {
    background: var(--nar);
    color: white;
}

.dark input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
}

.dark .irs--round .irs-min,
.dark .irs--round .irs-max {
    color: white;
}

.dark #overview #items .item .status {
    color: black;
}

.dark #overview #items .item.stclose .status {
    color: white;
}

.dark #underlyings .item .title,
.dark #underlyings .item .remove button {
    color: white;
}

.dark #underlyings .item .remove button:hover {
    color: var(--red);
}

.dark #underlyings .item input,
.dark #underlyings .item .group .prepend,
.dark #underlyings .item .group .append {
    border-color: var(--grey);
}

.dark #underlyings .item {
    box-shadow: 15px 15px 10px -5px rgba(156, 163, 175, 0.05);
    border-color: #9ca3af;
    background-color: var(--griss);
}