/* ========================================================= Global CSS =========================================================*/
:root {
    --dark-blue: #042DA9;
    --strong-blue: #0F5ECC;
    --moderate-blue: #466FC7;
    --soft-blue: #6FA5E8;
    --dark-cyan: #0798AE;
    --strong-cyan: #07C0C6;
    --soft-cyan: #93E4D1;
    --pure-orange: #F44300;
    --vivid-orange: #F66E09;
    --vivid-orange02: #FFAD02;
    --white: #ffffff;
    --black: #000000;
    --light-gray: #D3D3D3;
    --gray-ef: #F0EFEF;
    --gray-16: #161616;
    --gray-25: #252424;
    --dark-gray-2D: #2F2D2D;
    --bs-body-font-size: 1rem;
    --bs-font: "robotoregular";
    --bs-font-bold: "robotobold";
    --bs-gradient: linear-gradient(to right, #042DA9, #0F5ECC, #466FC7, #0798AE, #07C0C6, #F66E09, #FFAD02);
    --input-bg: #3B3939;
    --bs-body-font-family: var(--bs-font);
    --bs-body-font-weight: 400;
    --bs-body-color: #605C5C;
    --bs-body-line-height: 1.5;
    --bs-body-dark-bg: #000;
    --bs-secondary-bg: #2B2B2B;
    --bs-border-width: 1px;
    --bs-border-color: #707070;
    --bs-border-color-a7: #B7B7B7;
    --bs-link-color: #466FC7;
    --bs-border-radius: 8px;
    --bg-dark-toggle: #3B3939;
    --dark-toggle: #747473;
    --font-12: 0.75em;
    --font-15: 0.93em;
    --font-13: 0.812em;
    --width-30: 30%;

}

.dark-mode .form-control:focus {
    box-shadow: 0 0 0 0.1rem rgb(206 213 223 / 25%);
}

/* ========================================================= Login Page CSS =========================================================*/
.dark-mode {
    background-color: var(--bs-body-dark-bg);
    color: var(--white);
    transition: all 0.5s ease;
}

.dark-mode .card {
    background-color: var(--bs-secondary-bg);
}

.dark-mode .btn {
    background-color: var(--bg-dark-toggle);
    color: var(--white);
    border:0;
}

.dark-mode .btn.active {
    background-color: var(--dark-gray-2D);
    color: var(--white);

}

.dark-mode .login_button {
    color: var(--white);
    font-size: var(--font-12);
    font-family: var(--bs-font-bold);
    background-color: var(--moderate-blue);
    border-radius: var(--bs-border-radius);
    border: 0;
    width: var(--width-30);
}

.dark-mode .inputCss {
    border: 0;
    border-radius: var(--bs-border-radius);
    font-size: var(--font-15);
    background-color: var(--input-bg);
    color: var(--bs-border-color-a7);
}

.dark-mode .btnToggle {
    border: 0;
}

.dark-mode .the_asset_portal {
    fill: #fff;
}

.dark-mode .logoCSS2 {
    display: block;
}

.dark-mode .logoCSS1 {
    display: none !important;
}

.dark-mode input[type="submit"] {
    background-color: var(--input-bg);
}

/* ========================================================= Layout CSS =========================================================*/
.dark-mode .sidebar-nav>li>a:hover {
    color: var(--white);
}

.dark-mode .sidebar-nav>li.active>a {
    text-decoration: none;
    color: var(--white);
    background: var(--black);
    border-radius: 8px 0 0 8px;
}

.dark-mode #content-wrapper {
    position: relative;
    top: 0;
    background-color: var(--black);
    height: 100vh;
}

.dark-mode #navbar-wrapper .navbar {
    border-width: 0 0 0 0;
    background-color: var(--gray-16);
    font-size: 39px;
    margin-bottom: 0;
    border-radius: 0;
}

.dark-mode #sidebar-wrapper {
    background-color: var(--gray-16);
}

.dark-mode .burger_toggle_i {
    color: var(--white);
    font-weight: 400;
}


.dark-mode .searchTOP {
    color: var(--white);
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .searchTOP::placeholder {
    color: var(--white);
    font-size: 16px;
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .search_btn_top {
    padding: 0;
    background: transparent;
    border: 0;
    position: absolute;
    top: 7px;
    font-size: 16px;
    right: 15px;
    color: var(--white);
}

.dark-mode #profileButton {
    text-align: left;
    background-color: transparent;
}

.dark-mode .profile_title {
    font-size: var(--font-16);
    font-family: var(--bs-font-bold);
    color: var(--white);
}

.dark-mode .profile_subtitle {
    font-size: var(--font-14);
    font-family: var(--bs-font);
    color: var(--white);
}

.dark-mode .dropdown_arrow {
    margin-top: 4px;
    font-size: var(--font-18);
    color: var(--white);
}

.dark-mode .filter_title {
    font-size: var(--font-18);
    font-family: var(--bs-font-bold);
    color: var(--white);
}

.dark-mode .adv_search input {
    width: 225px;
    height: 40px;
    background-color: var(--gray-25);
    border: 1px solid var(--gray-25);
    border-radius: 8px;
    color: var(--white);
}

.dark-mode .adv_search input::placeholder {
    color: var(--white);
}

.dark-mode .adv_search .fa-search {
    left: auto;
    right: 15px;
    color: var(--white);
}

.dark-mode .custom_select_label {
    color: var(--white);
    font-family: var(--bs-font-bold);
    margin-top: 0.5em;
}

.dark-mode .custom-select {
    background-color: var(--gray-25);
    border: 1px solid var(--gray-25);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    position: relative;
    width: 80%;
    z-index: 1;
    border-radius: 8px;
    color: var(--white);
}

.dark-mode .custom-select select {
    color: var(--white);
}

.dark-mode .custom-select select::placeholder {
    color: var(--white);
}

.dark-mode .custom-select:before {
    color: var(--white);
    display: block;
    font-family: 'FontAwesome';
    font-size: 25px;
    height: 100%;
    line-height: 1.4em;
    padding: 0px 1.2em;
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
    width: 1em;
    z-index: -1;
}

.dark-mode .search_control {
    padding: 0.375rem 0.75rem;
    font-size: var(--font-16);
    font-family: var(--bs-font);
    font-weight: 400;
    line-height: 1;

    background-color: var(--gray-25);
    border: 1px solid var(--gray-25);
    background-clip: padding-box;

    width: 80%;
    border-radius: 8px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    color: var(--white);
}

.dark-mode .search_control::placeholder {
    color: var(--white);
}

.dark-mode .sidebar-nav>li a {
    display: block;
    text-decoration: none;
    color: var(--white);
    font-weight: 600;
    font-size: 16px;
    font-family: var(--bs-font-light);
}

.dark-mode #sidebar-wrapper::-webkit-scrollbar {
    width: 2px;

}

.dark-mode #sidebar-wrapper::-webkit-scrollbar-thumb {
    background-color: var(--bg-dark-toggle) !important;

}

.dark-mode .chat_btn {
    background-color: var(--black);
    color: var(--white);
}

.dark-mode .sidebar-nav>li>a img {
    filter: brightness(0) invert(1);
}

.dark-mode #accordionFilter .accordion-item {
    background-color: var(--gray-16);
    border: 0;
}

.dark-mode #accordionFilter .accordion-button {
    color: var(--white);
}


.dark-mode #accordionFilter .accordion-button::after {
    filter: brightness(0) invert(1);
}

.dark-mode #accordionFilter .accordion-button:not(.collapsed) {

    color: var(--white);
}

.dark-mode .sidebar-nav>li>a:hover img,
.dark-mode .sidebar-nav>li.active>a img {
    filter: brightness(0) invert(1);
}
.dark-mode #notificationButton{
    background-color:transparent;
    color: var(--white);
}
.dark-mode .dropdown-menu{
    background-color:var(--black);
    color: var(--white);
}
.dark-mode .profileText {
    color: var(--white);
}
.dark-mode .dropdown-menu:after{
    border-bottom: solid 10px var(--black);
}
.dark-mode  .dropdown-item:focus,.dark-mode   .dropdown-item:hover {
    color: var(--white);
    background-color: var(--bg-dark-toggle);
}
.dark-mode  .notification_title {
    color: var(--white);
}
.dark-mode  .white_corner{
    display: none;
}
.dark-mode  .dark_corner{
    display: block;
}
.dark-mode .search-options {
    background-color:var(--black);
    border:0;
}
.dark-mode .search-option {
    color: var(--white);
    
}
.dark-mode .search-option img{
    filter: brightness(0) invert(1);
}   
.dark-mode .search-option:hover {
    color: var(--white);
    background-color: var(--bg-dark-toggle);
}

/* ========================================================= Datatable CSS =========================================================*/
.dark-mode .welcome_title {

    color: var(--white);
}

.dark-mode .dataTables_info {
    color: var(--white);
}

.dark-mode .dataTables_length label {
    color: var(--white);
}

.dark-mode table.dataTable {
    background-color: var(--gray-16);
}

.dark-mode th,
.dark-mode td {
    color: var(--white);
}

.dark-mode table.dataTable td {
    color: var(--white);
    font-family: var(--bs-font-light);
}

.dark-mode .eyeAlign {
    color: var(--white);
}

.dark-mode #bidder_list .nav-item.show .nav-link:after,
.dark-mode #bidder_list .nav-link.active:after {
    border-bottom: 10px solid var(--black);
}

.dark-mode tbody,
.dark-mode td,
.dark-mode tfoot,
.dark-mode th,
.dark-mode thead,
tr {

    border-style: dashed;
    border-color: #888788;
}


.dark-mode thead>tr {
    background-color: var(--black);

}

.dark-mode #bidder_list.nav-tabs {
    border-bottom: 1px solid #202021;
}

.dark-mode .dataTables_filter input {
    color: var(--white);

    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .dataTables_filter input::placeholder {
    color: var(--white);
}

.dark-mode .dataTables_filter .input-group-text {
    color: var(--white);
}

.dark-mode .page-link {

    background-color: var(--bg-dark-toggle);
    border: 0;
    color: var(--white);
}

.dark-mode div.dataTables_wrapper div.dataTables_length select {
    background-color: var(--bg-dark-toggle);
    color: var(--white);
    border: 0;
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>");
}

.dark-mode .dt-button {
    color: var(--white) !important;
}

.dark-mode #example.table.dataTable>tbody>tr {
    background-color: var(--bg-dark-toggle);
}



/* ========================================================= biddertaplist CSS =========================================================*/
.dark-mode #show_entries select {
    display: inline-block;
    width: auto;
    background-color: var(--bg-dark-toggle);
    color: var(--white);
    border: 0;
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>");
}

.dark-mode .dataTables_filter_tap input {

    color: var(--white);
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .dataTables_filter_tap input::placeholder {
    color: var(--white);
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .dataTables_filter_tap .input-group-text {
    color: var(--white);
}

.dark-mode .bidsheettap_title {
    color: var(--white);
}

.dark-mode .tap_title {
    color: var(--white);
}

.dark-mode .end_date_css {
    color: var(--white);
}

.dark-mode .veiwFont {
    color: var(--white);
}

.dark-mode .product_content {
    color: var(--white);
}

.dark-mode .product_title {
    color: var(--white);
}

.dark-mode .ref_content {
    color: var(--white);
}

.dark-mode .buy_at_price_btn {

    background-color: var(--btn-c8);
    color: var(--white);
}

.dark-mode .bid_now_btn {

    background-color: var(--strong-cyan);
    color: var(--white);
}

.dark-mode .card_css {

    border-color: var(--bs-secondary-bg);

}

.dark-mode .custom-select_filter {
    color: var(--white);
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);

}

.dark-mode .custom-select_filter:hover {
    border-color: var(--bg-dark-toggle);
}

.dark-mode .custom-select_filter::placeholder {
    color: var(--white);
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .custom-select_filter:before {
    color: var(--white);

}

.dark-mode .custom-select-brand {
    color: var(--white) !important;
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);

}

.dark-mode .custom-select-brand:hover {
    border-color: var(--bg-dark-toggle);
}

.dark-mode .custom-select-brand::placeholder {
    color: var(--white) !important;
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .custom-select-brand:before {
    color: var(--white);

}

.dark-mode .input_content {
    color: var(--white);
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .list.grid-view-filter .ref_content {
    color: var(--white);
}

.dark-mode .expiry_css {
    color: var(--white);
}

.dark-mode .custom-select_filter select {
    color: var(--white);
}

.dark-mode .custom-select-brand select {
    color: var(--white);
}

/* ========================================================= Tap  CSS =========================================================*/

.dark-mode .buttons-print span,
.dark-mode .buttons-copy span,
.dark-mode .buttons-csv span {
    color: var(--white);
    background-color: transparent;
}

.dark-mode .buttons-print,
.dark-mode .buttons-copy,
.dark-mode .buttons-csv {

    background-color: transparent !important;
}

.dark-mode .breadcrumb-item+.breadcrumb-item::before {
    color: var(--white);
}

.dark-mode .breadcrumb-item a {
    color: var(--white);
}

.dark-mode .breadcrumb-item.active {
    color: var(--white);
}

.dark-mode .tapid_title {
    color: var(--white);
}

.dark-mode .condition_status {
    color: var(--white);
}

.dark-mode .expiration_css {
    color: var(--white);
}

.dark-mode .manfufac_css {
    color: var(--white);
}

.dark-mode .manfufac_css_span {
    color: var(--white);
}

.dark-mode .ref_css {
    color: var(--white);
}

.dark-mode .tap_p {
    color: var(--white);
}

.dark-mode .current_price_title {
    color: var(--white);
}

.dark-mode .tap_detail_li {
    color: var(--white);
}

.dark-mode .offer_title {
    color: var(--white);
}

.dark-mode .bid_now {

    background-color: var(--strong-cyan) !important;

    color: var(--white) !important;
}

.dark-mode .buy_at_price {

    background-color: var(--btn-c8) !important;
    color: var(--white) !important;
}

.dark-mode .input_content_bidder {
    color: var(--white);
    border-color: var(--bg-dark-toggle);
    background-color: var(--bg-dark-toggle);
}

.dark-mode .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.dark-mode .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}