/* Identidad de D.V Bombas: azul petroleo con terracota.
   Los colores salen del logo: la tipografia es #141E24 y el molino
   #98604E. La hojita verde del eslogan es un detalle de un pixel, no da
   para acento.
   Esta hoja pisa SOLO los acentos. La estructura, los tamanos y los
   colores con significado (rojo = perdida, verde = ganancia) quedan
   como estaban, para que nada se vuelva ilegible.

   ANTES ERA VERDE LIMA SOBRE NEGRO (#4FD000). Eso era del lubricentro
   de Esteban y salia de SU logo. Con el logo de DV Bombas puesto, el
   lima quedaba de otro negocio y el fondo negro del  .side-logo  le
   ponia un cuadrado negro atras a un logo que es sobre blanco. */

:root {
  --marca:        #A75F45;   /* el terracota del molino, un poco mas limpio */
  --marca-fuerte: #92513A;   /* el de los fondos con texto blanco encima */
  --marca-oscuro: #7E452F;   /* para texto y botones sobre claro */
  --marca-tinte:  #A75F4514;
  --marca-borde:  #A75F4538;
  --marca-tipo:   #141E24;   /* el azul casi negro de las letras del logo */
  --brand:        #A75F45;   /* lo usa base.css para el foco y el menu */
}

/* En oscuro el terracota se aclara: el de arriba sobre fondo negro
   queda barroso y pierde contraste con el texto. */
:root[data-theme="dark"] {
  --marca-oscuro: #D18A6C;
  --marca-tinte:  #A75F4518;
  --marca-borde:  #A75F4544;
  --marca-tipo:   #AFC2CE;
}

/* ------------------------------------------------- botones principales */
.bp {
  background: linear-gradient(135deg, #B06848, #8A4B34) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 600;
}
.bp:hover { filter: brightness(1.12); }
:root[data-theme="dark"] .bp {
  background: linear-gradient(135deg, #BE7050, #94523A) !important;
  color: #fff !important;
}

/* --------------------------------------------------------- navegacion */
.ni.on {
  box-shadow: inset 3px 0 0 var(--marca);
  background: var(--marca-tinte);
}
.ni.on .ic { filter: saturate(1.2); }
.side-head { border-bottom: 1px solid var(--marca-borde); }
/* El logo de DV Bombas viene sobre blanco. Antes aca habia un  #000  y
   le dibujaba un recuadro negro alrededor. */
.side-logo img {
  background: #fff; padding: 3px; border-radius: 4px;
  box-shadow: 0 0 0 1px var(--marca-borde);
}

/* ------------------------------------------------------------ pestanas */
.tab.on {
  box-shadow: inset 0 2px 0 var(--marca);
  border-color: var(--border);
}

/* ------------------------------------------------------------- chips */
.chip.on {
  background: var(--marca-fuerte);
  border-color: var(--marca-fuerte);
  color: #fff;
}
:root[data-theme="dark"] .chip.on { color: #fff; }

/* ------------------------------------------------- medios de pago */
.pago-b.on {
  background: var(--marca-fuerte);
  border-color: var(--marca-fuerte);
  color: #fff;
}
:root[data-theme="dark"] .pago-b.on { color: #fff; }

/* ------------------------------------------------------------- login */
.login-caja { border-top: 3px solid var(--marca); }
.login-user:hover { border-color: var(--marca-borde); }
.login-user .av { background: var(--marca-tipo); color: #fff; }

/* ------------------------------------------- detalles que dan identidad */
.seccion-tit { border-left: 3px solid var(--marca); padding-left: 9px; }
.kpi { border-top: 2px solid transparent; }
.kpi:first-child { border-top-color: var(--marca); }
.plan-item { border-left-color: var(--marca); }
.plan-cab.hoy { box-shadow: inset 0 -2px 0 var(--marca); }
.qr-abierto {
  background: var(--marca-tinte); border-color: var(--marca-borde);
  color: var(--marca-oscuro);
}
.nota-interna {
  background: var(--marca-tinte);
  border-color: var(--marca-borde);
}
::selection { background: var(--marca); color: #fff; }

/* La barra de los informes, dia por dia */
.barra-dia { background: var(--marca) !important; }

/* El acento naranja del programa original queda para los avisos,
   asi "atencion" y "marca" no se confunden. */

/* ------------------------------- la pagina que ve el cliente en el QR */
.telefono { border-color: var(--marca-tipo); }
.cl-taller { border-bottom: 2px solid var(--marca-borde); margin-bottom: 14px; }
.cl-taller .nom { letter-spacing: .02em; }
.cl-chapa { border-color: var(--marca-borde); }
.cl-chapa .pat { color: var(--marca-oscuro); }
.cl-visita li:before { color: var(--marca-fuerte); }
.cl-prox {
  background: var(--marca-tinte) !important;
  border-color: var(--marca-borde) !important;
}
.cl-prox b { color: var(--marca-oscuro) !important; }
.qr-img img { box-shadow: 0 0 0 2px var(--marca-borde); }
.qr-pat { color: var(--marca-oscuro); }