html.dark-theme body{
  
    color: #fcfcfc;
    background-color: #181818;

}

html.dark-theme ::placeholder {
    color: #fff !important;
    opacity: 0.4 !important;
}


/* Sidebar */

html.dark-theme .sidebar-wrapper,
html.dark-theme .sidebar-wrapper .sidebar-header
 {

    background-color: #181818;
    
}


html.dark-theme .sidebar-wrapper, 
html.dark-theme .sidebar-wrapper .sidebar-header {

    border-right: 1px solid rgb(255 255 255 / 12%);

}

html.dark-theme .sidebar-wrapper,
html.dark-theme .sidebar-wrapper .sidebar-header {
    border-bottom: 1px solid rgb(255 255 255 / 12%);
}


html.dark-theme .sidebar-wrapper .sidebar-header .logo-text,
html.dark-theme .sidebar-wrapper .sidebar-header .toggle-icon {
    color: #fcfcfc;
}


html.dark-theme .sidebar-wrapper .metismenu a {
    color: rgb(255 255 255 / 50%);
}

html.dark-theme .sidebar-wrapper .metismenu .mm-active>a, html.dark-theme .sidebar-wrapper .metismenu a:active, html.dark-theme .sidebar-wrapper .metismenu a:focus, html.dark-theme .sidebar-wrapper .metismenu a:hover {
    color: #ffffff;
    text-decoration: none;
    background-color: rgb(255 255 255 / 12%);
}


html.dark-theme .sidebar-wrapper .sidebar-header img {
    filter: invert(1) grayscale(100%) brightness(200%);
}

html.dark-theme .sidebar-wrapper .simplebar-scrollbar:before {
	background: rgba(255, 255, 255, .4)
}


html.dark-theme .apexcharts-pie-label, html.dark-theme .apexcharts-datalabels, html.dark-theme .apexcharts-datalabel, html.dark-theme .apexcharts-datalabel-label, html.dark-theme .apexcharts-datalabel-value {
    fill: #fff;
}

html.dark-theme .apexcharts-text tspan {
    fill: rgb(255 255 255 / 66%);
}

/* Header */


html.dark-theme .top-header {
  
    color: #fcfcfc;
    background-color: #181818;
    border-bottom: 1px solid rgb(255 255 255 / 12%);

}

html.dark-theme .top-header .navbar .top-navbar-right .nav-link {

    color: #fcfcfc;

}

html.dark-theme .top-header .navbar .searchbar .search-icon,
html.dark-theme .top-header .mobile-menu-button {

    color: #fcfcfc;

}

html.dark-theme .top-header .navbar .searchbar .form-control {

    color: #fcfcfc;
    background-color: #212121;
    border: 1px solid rgb(255 255 255 / 12%);

}


html.dark-theme .options {
    color: #fcfcfc;
}

/* ecommerce */

html.dark-theme .shop-container .card {
    border: 1px solid rgb(255 255 255 / 12%);
}

html.dark-theme .product-grid .card.product-card {
    background-color: #212121;
}


html.dark-theme .product-categories ul a {
    color: #fcfcfc;
}

html.dark-theme .product-wishlist {
    background-color: rgb(255 255 255 / 12%);
    color: #fcfcfc;
}

html.dark-theme .product-compare, html.dark-theme .product-catergory {
    color: #fcfcfc;
}

html.dark-theme .steps-light .step-item.active.current {
    color: #ffffff;
}

html.dark-theme .payment-img img,
html.dark-theme .payment-mode img{
    filter: invert(1) grayscale(100%) brightness(200%);
}

@media (min-width: 992px) {

	html.dark-theme .product-grid .card.product-card:hover {
		background-color: #1a1919;
	}
}



/* Components */

html.dark-theme .btn-dark {
    color: #fff;
    background-color: #181818;
    border-color: #181818;
}

html.dark-theme .btn-outline-dark {
    color: #b1b6bb;
    border-color: #7f868d;
}

html.dark-theme .btn-white {
    color: #ffffff;
    background-color: #212121;
    border-color: rgb(255 255 255 / 12%);
}

html.dark-theme .btn-light {
    color: #fff;
    background-color: rgb(255 255 255 / 12%);
    border-color: rgb(255 255 255 / 12%);
}


html.dark-theme .ff_fileupload_wrap .ff_fileupload_dropzone, html.dark-theme .imageuploadify {

    border: 2px dashed rgb(255 255 255 / 74%);
    background-color: #212121;

}

html.dark-theme .picker__input {
    background-color: #181818 !important;
}

html.dark-theme .picker__holder {
    background: #181818;
    border: 1px solid rgb(255 255 255 / 12%);
}


html.dark-theme  .picker__button--today, html.dark-theme  .picker__button--clear, html.dark-theme  .picker__button--close {

    border: 1px solid rgb(255 255 255 / 12%);
    background: #181818;

}


html.dark-theme .select2-container--bootstrap4 .select2-selection {
	background-color: #181818;
	border: 1px solid rgb(255 255 255 / .35)
}
html.dark-theme .select2-dropdown {
	background-color: #181818;
	border: 1px solid rgb(255 255 255 / 38%)
}
html.dark-theme .select2-search--dropdown .select2-search__field {
	border: 1px solid rgb(255 255 255 / 34%);
	background-color: #181818;
	color: #e3dfdf
}
html.dark-theme .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
	color: #dee1e5;
	border: 1px solid rgb(255 255 255 / 55%);
	background: #171717
}
html.dark-theme .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered .select2-search__field {
	background: 0 0;
	color: #e6e1e1
}
html.dark-theme .select2-container--bootstrap4 .select2-dropdown .select2-results__option[aria-selected=true] {
	background-color: #181818;
}






html.dark-theme .modal-content {

    background-color: #212121;

}

html.dark-theme .modal-header {

    border-bottom: 1px solid rgb(255 255 255 / 12%);

}

html.dark-theme .modal-footer {

    border-top: 1px solid rgb(255 255 255 / 12%);

}

html.dark-theme .nav-tabs .nav-item.show .nav-link, html.dark-theme .nav-tabs .nav-link.active {
    background-color: #181818;
}

html.dark-theme .nav-tabs {

    border-bottom: 1px solid rgb(255 255 255 / 12%);

}

html.dark-theme .nav-primary.nav-tabs .nav-link.active {

    border-color: #008cff #008cff rgb(255 255 255 / 24%);

}

html.dark-theme .nav-tabs .nav-link {
    color: #ffffff;
}


html.dark-theme .nav-danger.nav-tabs .nav-link.active {
    border-color: #f41127 #f41127 rgb(255 255 255 / 24%);
}

html.dark-theme .nav-success.nav-tabs .nav-link.active {
    border-color: #17a00e #17a00e rgb(255 255 255 / 24%);
}

html.dark-theme .nav-warning.nav-tabs .nav-link.active {
    border-color: #ffc107 #ffc107 rgb(255 255 255 / 24%);
}


html.dark-theme .nav-pills .nav-link {

    color: #ffffff;

}

html.dark-theme .page-link {

    color: #ffffff;
    background-color: #212121;
    border: 1px solid rgb(255 255 255 / 12%);

}

html.dark-theme  .page-item.disabled .page-link {

    color: #ffffff;
    background-color: #181f2e;
    border-color: rgb(255 255 255 / 12%);

}


html.dark-theme  .productlist .product-box {

    border: 1px solid rgb(255 255 255 / 12%);
    background-color: #181818;

}


html.dark-theme .form-control, html.dark-theme .form-select {

    color: #fcfcfc;
    background-color: #181818;
    border: 1px solid rgb(255 255 255 / 12%);

}


html.dark-theme .form-control:disabled, html.dark-theme .form-control[readonly] {

    background-color: #383838;

}


html.dark-theme  .form-select:disabled {

    background-color: #383838;

}


html.dark-theme .bootstrap-tagsinput {
    color: #fcfcfc;
    background-color: #181818;
    border: 1px solid rgb(255 255 255 / 12%);

}


html.dark-theme .input-group-text {

    color: #ffffff;
    background-color: #313c53;
    border: 1px solid rgb(255 255 255 / 12%);

}




html.dark-theme .chip {

    color: #ffffff;
    background-color: #141b29;

}

html.dark-theme .card {
  
    background-color: #212121;

}

html.dark-theme .card-header,
html.dark-theme .card-footer {

    background-color: #212121;
    border-bottom: 1px solid rgb(255 255 255 / 12%);

}

html.dark-theme .bg-dark{
  
    background-color: #101821!important;
}


html.dark-theme .text-secondary {

    color: #8c949c!important;
    
}

html.dark-theme .border {

    border: 1px solid rgb(255 255 255 / 12%) !important;

}


html.dark-theme .border-start {
    
    border-left: 1px solid rgb(255 255 255 / 12%) !important;
} 

html.dark-theme .border-end {

    border-right: 1px solid rgb(255 255 255 / 12%) !important;

}

html.dark-theme .border-top {

    border-top: 1px solid rgb(255 255 255 / 12%) !important;

}

html.dark-theme .border-bottom {

    border-bottom: 1px solid rgb(255 255 255 / 12%) !important;

}


html.dark-theme .text-option {
    color: #fcfcfc!important;
}

html.dark-theme .offcanvas {
    background-color: #181818;
    
}

html.dark-theme .btn-close {
  
    filter: invert(1) grayscale(100%) brightness(200%);

}

html.dark-theme .w_percent {

    color: #ffffff;

}


html.dark-theme .bg-light {

    background-color: rgb(248 249 250 / 12%)!important;

} 


html.dark-theme .list-group-item {

    color: #fcfcfc;
    background-color: rgb(32 42 64 / 0%);
    border: 1px solid rgb(255 255 255 / 12%);

}


html.dark-theme .sidebar-submenu-wrapper .list-group-item {
    border: 1px solid rgb(255 255 255 / 0%);
}


html.dark-theme .list-group-flush>.list-group-item {

    border-width: 0 0 1px;
    
}

html.dark-theme .new-customer-list .customer-list-item:hover {

	background-color: #1b2436;

}


html.dark-theme .best-product-item {

	background-color: #212121;

}
html.dark-theme .best-product-item:hover,
html.dark-theme .sellers-list-item:hover {

	background-color: #1b2436;

}

html.dark-theme .theme-icons,
html.dark-theme .product-box {
    background-color: #212121;
    color: #f1f4f6;
}

html.dark-theme .accordion-button {
    color: #ffffff;
    background-color: #212121;
}

html.dark-theme .accordion-item {
    background-color: #1b2436;
    border: 1px solid rgb(255 255 255 / 12%);
}


html.dark-theme .accordion-button:focus {

    border-color: #ffffff;
    box-shadow: 0 0 0 0.25rem rgb(255 255 255 / 25%);

}

html.dark-theme .accordion-button:not(.collapsed) {

    color: #ffffff;
    background-color: #161d2c;

}

html.dark-theme .dropdown-menu {

    color: #fcfcfc;
    background-color: #212121;
    border: 1px solid rgb(255 255 255 / 12%);

}


html.dark-theme .dropdown-large .msg-header .msg-header-title {
    color: #fcfcfc;
}

html.dark-theme .dropdown-large .msg-footer {
    color: #fcfcfc;
    border-top: 1px solid rgb(255 255 255 / 12%);
}

html.dark-theme .dropdown-large .msg-header .msg-header-clear {
    color: #fcfcfc;
}

html.dark-theme .dropdown-large .msg-header,
html.dark-theme .dropdown-large .dropdown-menu .dropdown-item {
    border-bottom: 1px solid rgb(255 255 255 / 12%);
}


html.dark-theme  .dropdown-item {
    color: #fcfcfc;
}

html.dark-theme .top-header .navbar .dropdown-large .dropdown-menu::after,
html.dark-theme .top-header .navbar .dropdown-user-setting .dropdown-menu::after {

    background: #212121;
    border-top: 1px solid #2f3b55;
    border-left: 1px solid #2f3b55;

}

html.dark-theme .top-header .navbar .dropdown-searchbar .form-control {
    color: #fcfcfc;
    background-color: #212121;
}


html.dark-theme .top-header .navbar .dropdown-item .setting-icon {

    background-color: #2b3650;

}

html.dark-theme .top-header .navbar .dropdown-large .dropdown-item:hover,
html.dark-theme .top-header .navbar .dropdown-user-setting .dropdown-item:hover {
    color: #fcfcfc;
	background-color: rgb(255 255 255 / 12%)
}

html.dark-theme .top-header .navbar .dropdown-menu .notification-box {

    background-color: #2b3650;

}

html.dark-theme .top-header .navbar .dropdown-menu .apps:hover {

    background-color: #283349;
    transition: all 0.2;

}

html.dark-theme .top-header .navbar .dropdown-menu .apps .apps-name {
    color: #fcfcfc;
}


html.dark-theme .progress {

    background-color: rgb(255 255 255 / 12%);
    
}


html.dark-theme .table {

    --bs-table-bg: transparent;
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: #ffffff;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
    --bs-table-active-color: #ffffff;
    --bs-table-active-bg: rgb(255 255 255 / 10%);
    --bs-table-hover-color: #ffffff;
    --bs-table-hover-bg: rgb(255 255 255 / 8%);
    width: 100%;
    margin-bottom: 1rem;
    color: #fcfcfc;
    vertical-align: top;
    border-color: rgb(255 255 255 / 12%);
    
}

html.dark-theme .table-light {

    --bs-table-bg: rgb(255 255 255 / 12%);
    --bs-table-striped-bg: #ecedee;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #dfe0e1;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #e5e6e7;
    --bs-table-hover-color: #000;
    color: #fff;
    border-color: #dfe0e1;

}



html.dark-theme .breadcrumb {
	background-color: rgb(32 42 64 / 0%);
}
html.dark-theme .breadcrumb-item.active {
	color: #8b969f
}
html.dark-theme .breadcrumb-title {
	border-right: 1.5px solid rgb(255 255 255 / 18%)
}

html.dark-theme .bg-body {
	background-color: #212121!important
}


html.dark-theme .footer {
    color: #fcfcfc;
    background-color: #181818;
    border-top: 1px solid rgb(255 255 255 / 12%);
}



/* Responsive */

@media screen and (max-width:1199px)  {

    html.dark-theme .top-header .navbar .full-search-bar {
        background-color: rgb(26 34 50 / 0%);
    }

}


/* ============================================================
   Auditoría WS-C — overrides para modo oscuro
   Pase estático: cubre patrones comunes hallados via grep en
   templates. El 20% restante requiere verificación visual.
   ============================================================ */

/* === L1 — Chrome base (refuerzos) === */

/* bg-white: no cubierto en el bloque base */
html.dark-theme .bg-white {
    background-color: #212121 !important;
    color: #fcfcfc;
}

/* text-dark: fuerza texto claro en modo oscuro */
html.dark-theme .text-dark {
    color: #fcfcfc !important;
}

/* bg-light: el bloque base usa 12% opacidad (casi transparente).
   Usamos un gris visible en su lugar. */
html.dark-theme .bg-light {
    background-color: #2a2a2a !important;
}

/* text-bg-light (Bootstrap 5.2+ combo badge) */
html.dark-theme .text-bg-light {
    background-color: #3a3a3a !important;
    color: #fcfcfc !important;
}

/* text-muted */
html.dark-theme .text-muted {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* hr */
html.dark-theme hr {
    border-color: rgba(255, 255, 255, 0.12);
}

/* code / pre */
html.dark-theme code,
html.dark-theme pre {
    background-color: #2a2a2a;
    color: #fcfcfc;
}

/* label */
html.dark-theme label {
    color: #fcfcfc;
}


/* === L2 — Formularios y perfil === */

/* form-control focus: el bloque base cubre el estado normal;
   reforzamos el foco */
html.dark-theme .form-control:focus,
html.dark-theme .form-select:focus {
    background-color: #181818;
    color: #fcfcfc;
    border-color: rgba(255, 255, 255, 0.35);
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.08);
}

html.dark-theme .form-check-input {
    background-color: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.25);
}

/* password_change_form y password_change_done: container inline style */
html.dark-theme [style*="background:#fff"],
html.dark-theme [style*="background: #fff"],
html.dark-theme [style*="background-color:#fff"],
html.dark-theme [style*="background-color: #fff"] {
    background-color: #212121 !important;
    color: #fcfcfc !important;
}

/* mi_perfil: avatar placeholder bg-light circle */
html.dark-theme .rounded-circle.bg-light {
    background-color: #2a2a2a !important;
}


/* === L3 — Dashboard (inicio.html) — clases definidas en <style> inline === */

/* .dash-wrap, .kpi, .cta tienen background:#fff hardcoded en <style> del template.
   Ganamos especificidad con html.dark-theme. */
html.dark-theme .dash-wrap {
    background-color: #181818 !important;
}

html.dark-theme .kpi {
    background: #212121 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .kpi h6 {
    color: rgba(255, 255, 255, 0.7) !important;
}

html.dark-theme .kpi .val {
    color: #fcfcfc !important;
}

html.dark-theme .kpi small {
    color: rgba(255, 255, 255, 0.55) !important;
}

html.dark-theme .cta {
    background: #212121 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4) !important;
}

/* ref-card / referral-card: amarillo suave en claro, oscurecido en dark */
html.dark-theme .ref-card,
html.dark-theme .referral-card {
    background: #2a2510 !important;
    border-color: rgba(201, 162, 39, 0.4) !important;
}


/* === L4 — Depositar (depositar.html) === */

html.dark-theme .bank-box {
    background: #2a2510 !important;
    border-color: rgba(201, 162, 39, 0.4) !important;
}

/* container con style="background: #fff" cubierto por el selector inline de L2 */


/* === L5 — Referidos (referidos.html) — fuerza color oscuro via !important === */

/* La hoja del template usa `.referidos-page * { color: #212529 !important }`.
   Ganamos especificidad añadiendo html.dark-theme. */
html.dark-theme .referidos-page,
html.dark-theme .referidos-page * {
    color: #fcfcfc !important;
}

html.dark-theme .referidos-page .table thead th {
    background: #2a2a2a !important;
}


/* === L6 — Alerts === */

html.dark-theme .alert {
    background-color: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.12);
    color: #fcfcfc;
}

/* Sabores específicos: ajustar para que los colores semánticos sigan legibles */
html.dark-theme .alert-info {
    background-color: rgba(13, 110, 253, 0.15);
    border-color: rgba(13, 110, 253, 0.3);
    color: #9ec5fe;
}

html.dark-theme .alert-warning {
    background-color: rgba(255, 193, 7, 0.12);
    border-color: rgba(255, 193, 7, 0.3);
    color: #ffe083;
}

html.dark-theme .alert-danger {
    background-color: rgba(220, 53, 69, 0.15);
    border-color: rgba(220, 53, 69, 0.3);
    color: #f1aeb5;
}

html.dark-theme .alert-success {
    background-color: rgba(25, 135, 84, 0.15);
    border-color: rgba(25, 135, 84, 0.3);
    color: #75b798;
}

html.dark-theme .alert-light {
    background-color: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.12);
    color: #fcfcfc;
}


/* === L7 — DataTables === */

html.dark-theme .dataTables_wrapper .dataTables_length,
html.dark-theme .dataTables_wrapper .dataTables_filter,
html.dark-theme .dataTables_wrapper .dataTables_info,
html.dark-theme .dataTables_wrapper .dataTables_processing {
    color: #fcfcfc;
}

html.dark-theme .dataTables_wrapper .dataTables_length select,
html.dark-theme .dataTables_wrapper .dataTables_filter input {
    background-color: #181818;
    color: #fcfcfc;
    border-color: rgba(255, 255, 255, 0.18);
}

html.dark-theme .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #fcfcfc !important;
}

html.dark-theme .dataTables_wrapper .dataTables_paginate .paginate_button.current,
html.dark-theme .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.18);
    color: #fcfcfc !important;
}

html.dark-theme .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.12);
    color: #fcfcfc !important;
}


/* === L8 — Select2 (variante --default, no sólo bootstrap4) === */

/* El bloque base cubre .select2-container--bootstrap4.
   Añadimos cobertura para la variante --default también. */
html.dark-theme .select2-container--default .select2-selection--single,
html.dark-theme .select2-container--default .select2-selection--multiple {
    background-color: #181818;
    border-color: rgba(255, 255, 255, 0.25);
    color: #fcfcfc;
}

html.dark-theme .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fcfcfc;
}

html.dark-theme .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: rgba(255, 255, 255, 0.4);
}

html.dark-theme .select2-container--default .select2-results__option {
    color: #fcfcfc;
    background-color: #212121;
}

html.dark-theme .select2-container--default .select2-results__option--highlighted[aria-selected],
html.dark-theme .select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color: rgba(255, 255, 255, 0.12);
    color: #fcfcfc;
}

html.dark-theme .select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #2a2a2a;
}


/* === L9 — Ganacash ciclo (ganacash_ciclo.html) === */

/* Slot cards usan bg-white (ocupado) o bg-light (vacante) — ya cubiertos
   por los selectores de L1. Reforzamos el badge text-bg-light para
   "Vacante" que también aparece aquí (cubierto arriba). */


/* === L10 — Two-Factor auth container === */

/* two_factor/_base.html define su propio <style> con body bg y
   .twofactor-container background: white. Ganamos con html.dark-theme. */
html.dark-theme .twofactor-container {
    background: #212121 !important;
    color: #fcfcfc !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5) !important;
}


/* === L11 — Misceláneos observados en grep === */

/* admin/ganacash_vip_renovaciones: filas alternas con background:#f9f9f9 */
html.dark-theme [style*="background:#f9f9f9"],
html.dark-theme [style*="background: #f9f9f9"] {
    background-color: #2a2a2a !important;
}

/* badges inline con colores semánticos hardcoded — los colores verde/amarillo
   ya son legibles; el badge "#ddd" con texto "#555" no lo es */
html.dark-theme [style*="background:#ddd"],
html.dark-theme [style*="background: #ddd"] {
    background-color: #3a3a3a !important;
    color: #fcfcfc !important;
}

/* depositar.html / admin: toast fijo con background:#222 — ya oscuro, ok */

/* Tablas admin con clases .admin-table, .adminlist */
html.dark-theme .admin-table th,
html.dark-theme .admin-table td,
html.dark-theme .adminlist th,
html.dark-theme .adminlist td {
    border-color: rgba(255, 255, 255, 0.12);
    color: #fcfcfc;
}

html.dark-theme .admin-table tr:nth-child(even),
html.dark-theme .adminlist tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.04);
}

/* nav-tabs: refuerzo de color de texto en enlaces no-activos */
html.dark-theme .nav-tabs .nav-link:not(.active) {
    color: rgba(255, 255, 255, 0.6);
}

/* breadcrumb links */
html.dark-theme .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.75);
}

/* card border faint en modo oscuro */
html.dark-theme .card {
    border-color: rgba(255, 255, 255, 0.1);
}

/* Imagen QR: bg-white en modo oscuro podría generar parpadeo;
   el fondo blanco del QR es necesario para escaneo — se deja
   con fondo blanco explícito solo para imágenes QR */
html.dark-theme img.bg-white {
    background-color: #ffffff !important;
}