/* ==================================================================
   MERCUX :: RETIRO DEL VERDE GENERICO   (v1 - 2026-08-03)
   ------------------------------------------------------------------
   Capa 100% visual. Reemplaza el verde heredado del tema y el verde
   lima cableado en atributos style por la paleta de marca.
   No cambia clases, ids, rutas, nombres de campos ni logica: solo
   pinta. Se carga DESPUES de mercux-brand.css para poder ganarle a
   la regla .btn-success verde que trae esa hoja.
   Se conserva el verde SOLO como senal de estado (badges, alertas y
   textos de exito) en un tono tenue, y el verde de WhatsApp #25D366
   por ser color de marca de un tercero.
   ================================================================== */
:root{
  --mx-ok:#0F6B48;
  --mx-ok-bg:#E6F7EF;
  --mx-ok-line:#BFE9D6;
  --mx-verde-grad:linear-gradient(135deg,#8B18E8 0%,#5B2BEF 45%,#2563EB 72%,#22D3EE 100%);
}

/* ---------- 1. Botones solidos ----------------------------------- */
.btn-success,
.btn-success:hover,
.btn-success:focus,
.btn-success.focus,
.btn-success:active,
.btn-success.active,
.btn-success:not(:disabled):not(.disabled):active,
.show > .btn-success.dropdown-toggle{
  background-image:var(--mx-verde-grad)!important;
  background-color:#6D28F5!important;
  border-color:transparent!important;
  color:#fff!important;
  box-shadow:0 6px 16px rgba(109,40,245,.28)!important;
}
.btn-success:hover{filter:brightness(1.08)}

/* ---------- 2. Botones de contorno ------------------------------- */
.btn-outline-success{
  color:#6D28F5!important;
  border-color:#6D28F5!important;
  background-color:transparent!important;
  background-image:none!important;
}
.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active{
  background-image:linear-gradient(135deg,#8B18E8,#2563EB)!important;
  color:#fff!important;
  border-color:transparent!important;
}

/* ---------- 3. Fondos utilitarios -------------------------------- */
.bg-success,
span.bg-success,
div.bg-success,
td.bg-success,
th.bg-success,
tr.bg-success,
.bg-gradient-success{
  background-image:linear-gradient(135deg,#8B18E8,#2563EB)!important;
  background-color:#6D28F5!important;
  color:#fff!important;
}
.progress-bar.bg-success{
  background-image:linear-gradient(135deg,#8B18E8,#22D3EE)!important;
  background-color:#6D28F5!important;
}

/* ---------- 4. Senales de estado (aqui SI se conserva verde) -----
   Van despues del bloque 3 a proposito: un badge o una fila de
   tabla en verde comunica estado y se deja en tono tenue. */
.badge-success,
.badge.badge-success,
.badge.bg-success,
span.badge.bg-success{
  background-image:none!important;
  background-color:var(--mx-ok-bg)!important;
  color:var(--mx-ok)!important;
  border:1px solid var(--mx-ok-line)!important;
}
.text-success{color:var(--mx-ok)!important}
.border-success{border-color:var(--mx-ok-line)!important}
.table-success,
.table-success > td,
.table-success > th,
tr.table-success > *{
  --bs-table-bg:var(--mx-ok-bg);
  background-color:var(--mx-ok-bg)!important;
  color:var(--mx-ok)!important;
}
.alert-success{
  background-color:var(--mx-ok-bg)!important;
  border:none!important;
  color:var(--mx-ok)!important;
}

/* ---------- 5. Verde lima cableado en el atributo style -----------
   #91DF4B y #77A649 venian del tema viejo de tienda escritos en el
   HTML. Un !important en hoja externa gana a un style en linea que
   no lo lleva, asi que se corrige sin editar las vistas.
   El bloque de texto va primero y el de fondo despues, porque la
   cadena "background-color: #91df4b" tambien contiene "color: ..."
   y el fondo debe tener la ultima palabra. */
[style*="color:#91df4b" i],
[style*="color: #91df4b" i],
[style*="color:#77a649" i],
[style*="color: #77a649" i]{
  color:#5B2BEF!important;
}
[style*="background-color:#91df4b" i],
[style*="background-color: #91df4b" i],
[style*="background:#91df4b" i],
[style*="background: #91df4b" i],
[style*="background-color:#77a649" i],
[style*="background-color: #77a649" i],
[style*="background:#77a649" i],
[style*="background: #77a649" i]{
  background-image:var(--mx-verde-grad)!important;
  background-color:#6D28F5!important;
  border-color:transparent!important;
  color:#fff!important;
}

/* ---------- 6. Verde bootstrap cableado (#28A745) -----------------
   Se usa en indicadores (PAGADA, ahorro conseguido): tono tenue. */
[style*="color:#28a745" i],
[style*="color: #28a745" i]{
  color:var(--mx-ok)!important;
}
[style*="background:#28a745" i],
[style*="background: #28a745" i],
[style*="background-color:#28a745" i],
[style*="background-color: #28a745" i]{
  background-image:none!important;
  background-color:var(--mx-ok-bg)!important;
  color:var(--mx-ok)!important;
  border:1px solid var(--mx-ok-line)!important;
}

/* ---------- 7. Excepcion WhatsApp (marca de un tercero) -----------
   Va al final para que el bloque 1 no le pise el verde propio. */
[style*="#25d366" i]{
  background-image:none!important;
  background-color:#25D366!important;
  border-color:#25D366!important;
  color:#fff!important;
}
