/* ValentSoft · marca de agua corporativa común a todas las aplicaciones.
   Fuente única: Codigos/ValentSoftBrand. No editar las copias de cada app: ejecutar sync_brand.py.
   Uso: incluir este CSS y el fragmento de valentsoft-watermark.html antes de </body>.
   Personalización por app (opcional), en el CSS propio:
     :root { --vs-watermark-bottom: 80px; }   elevarla sobre una barra inferior
     <div class="vs-watermark vs-watermark--dark">  variante para interfaces oscuras */

:root {
  --vs-ink: #0f1b2d;
  --vs-ink-soft: #3a4a62;
  --vs-gold: #e8b04b;
  --vs-gold-light: #f7d58a;
  --vs-mist: #e9eef6;
}

/* Posición: las apps pueden definir --vs-watermark-bottom/-right/-z en su propio CSS
   (en :root o body). Aquí solo hay valores de reserva, para que este archivo, que se carga
   después, no pise esos ajustes. */

.vs-watermark {
  position: fixed;
  z-index: var(--vs-watermark-z, 1035);
  right: calc(var(--vs-watermark-right, 14px) + env(safe-area-inset-right, 0px));
  bottom: calc(var(--vs-watermark-bottom, 14px) + env(safe-area-inset-bottom, 0px));
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  padding: 0.42em 0.8em 0.42em 0.5em;
  border: 1px solid rgba(15, 27, 45, 0.12);
  border-radius: 999px;
  color: var(--vs-ink);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 4px 16px rgba(15, 27, 45, 0.12);
  font: 500 11px/1 Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
  letter-spacing: 0.01em;
  white-space: nowrap;
  opacity: 0.82;
  /* Es una marca de agua: nunca intercepta clics ni selección. */
  pointer-events: none;
  user-select: none;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.vs-watermark__mark {
  width: 1.45em;
  height: 1.45em;
  flex: 0 0 auto;
  color: var(--vs-gold);
}

.vs-watermark__by { color: var(--vs-ink-soft); }
.vs-watermark__name { color: var(--vs-ink); font-weight: 800; letter-spacing: -0.01em; }
.vs-watermark__name span { font-weight: 500; }

.vs-watermark--dark {
  border-color: rgba(255, 255, 255, 0.14);
  color: #fff;
  background: rgba(15, 27, 45, 0.82);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}
.vs-watermark--dark .vs-watermark__by { color: #b9c4d6; }
.vs-watermark--dark .vs-watermark__name { color: #fff; }

@media (max-width: 480px) {
  .vs-watermark { font-size: 10px; opacity: 0.74; }
}

@media print {
  .vs-watermark { opacity: 1; box-shadow: none; background: #fff; color: var(--vs-ink); }
}

@media (prefers-reduced-transparency: reduce) {
  .vs-watermark { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .vs-watermark--dark { background: var(--vs-ink); }
}
