:root{ --vs-red:#dc2626; --vs-red-dark:#b91c1c }
*{ font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial }
.bg-vs{ background-color:var(--vs-red) } 
.bg-vs-dark{ background-color:var(--vs-red-dark) }
.text-vs{ color:var(--vs-red) }
.card{ background:#0f172a; border:1px solid #334155 }
.soft{ background:#111827; border:1px solid #374151 }
dialog::backdrop{ background:rgba(0,0,0,.55) }
.pill{ padding:.2rem .6rem; border-radius:999px; font-size:.75rem; font-weight:600 }
.row:hover{ background-color:rgba(55,65,81,.35) }

/* Legibilidad extra en modales */
#dlg-plan .card, #dlg-pago .card, #dlg-ws .card, #dlg-comp .card{
  background:#0b1220; border-color:#374151;
}
#dlg-plan h3, #dlg-pago h3, #dlg-ws h3, #dlg-comp h3,
#dlg-plan label, #dlg-pago label{
  color:#f3f4f6 !important;
}
#dlg-plan input, #dlg-plan select, #dlg-plan textarea,
#dlg-pago input, #dlg-pago select, #dlg-pago textarea{
  color:#f9fafb !important; background:#111827; border-color:#64748b;
}
#dlg-plan input[readonly], #dlg-pago input[readonly]{ background:#0f172a; color:#e5e7eb !important; }
#dlg-plan ::placeholder, #dlg-pago ::placeholder{ color:#cbd5e1; opacity:1; }

.vs-notification.success { border-left-color: #10b981; }
.vs-notification.warning { border-left-color: #f59e0b; }
.vs-notification.error { border-left-color: #ef4444; }

@keyframes slideInRight {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

/* Mejoras menores */
.btn{transition:background-color .15s ease, border-color .15s ease, transform .05s ease;}
.btn:active{transform:translateY(1px);}
.soft:focus{outline:2px solid rgba(220,38,38,.30); outline-offset:2px;}
dialog{border:none;}

table th, table td {
  padding-left: .5rem !important;
  padding-right: .5rem !important;
  font-size: .9rem;
}

table td:last-child button {
  padding: .35rem .6rem !important;
  font-size: .85rem;
}