@charset "UTF-8";
/*!
 * Theme: 4pay (SLM) — 4Pay · tema CLARO
 * Primario negro #0F0F0F (wordmark "PAY") · gradiente de marca cian #00F6FC → púrpura
 * #8460F6 → magenta #FC00F6 → rojo #FC003C (isotipo "4")
 * Package: DashLite v3.2.3
 * Tipografía: pila de sistema (la marca no define tipografía propia)
 * Author: SLM
**/
body.nk-body {
  background: #FAFAFA;
  color: #0F0F0F;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif;
}

.nk-app-root, .nk-main, .nk-wrap, .nk-content {
  background: transparent;
}

a {
  color: #0F0F0F;
}

a:hover {
  color: #262626;
}

.text-primary {
  color: #0F0F0F !important;
}

.bg-primary {
  background-color: #0F0F0F !important;
  color: #ffffff !important;
}

.text-muted, .text-soft {
  color: #525252 !important;
}

.card {
  background: #ffffff;
  border-radius: 16px;
}

.card-bordered {
  border-color: #E5E5E5;
}

.nk-header.is-light {
  background: #ffffff;
  border-bottom-color: #E5E5E5;
}

.dropdown-menu, .modal-content, .popover {
  border-radius: 12px;
}

.btn {
  border-radius: 12px;
}

.btn-primary,
.btn-primary:focus,
.show > .btn-primary.dropdown-toggle {
  background: #0F0F0F !important;
  border-color: #0F0F0F !important;
  color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
  background: #262626 !important;
  border-color: #262626 !important;
  color: #ffffff !important;
}

.btn-primary:disabled, .btn-primary.disabled {
  opacity: 0.5;
}

.btn-outline-primary {
  color: #0F0F0F !important;
  border-color: #0F0F0F !important;
  background: transparent !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active {
  background: #0F0F0F !important;
  border-color: #0F0F0F !important;
  color: #ffffff !important;
}

.btn-accent {
  background: #FC00F6 !important;
  border-color: #FC00F6 !important;
  color: #0F0F0F !important;
  border-radius: 12px;
}

.btn-accent:hover {
  background: #C800C4 !important;
  border-color: #C800C4 !important;
}

.badge-primary {
  background: #FC00F6 !important;
  color: #0F0F0F !important;
}

.badge-outline-primary {
  color: #0F0F0F !important;
  border-color: #FC00F6 !important;
}

.progress-bar,
.dot-primary,
.noUi-connect,
.nav-tabs .nav-link:after,
.card-tools-nav li a:before {
  background: linear-gradient(120deg, #00F6FC 0%, #8460F6 40%, #FC00F6 68%, #FC003C 100%) !important;
}

.badge-success, .dot-success {
  background: #00C7D6 !important;
  color: #0F0F0F !important;
}

.text-success {
  color: rgb(0%, 55.7214586769%, 59.9215686275%) !important;
}

.alert-success {
  background: rgba(0, 246, 252, 0.14);
  border-color: #00C7D6;
  color: rgb(0%, 37.1233278358%, 39.9215686275%);
}

.nk-menu-item.active > .nk-menu-link,
.nk-menu-item.current-menu > .nk-menu-link,
.nav-tabs .nav-link.active {
  color: #0F0F0F !important;
}

.nk-menu-icon {
  color: #525252;
}

.form-control,
.form-select,
.custom-select {
  background: #F8FAFC;
  border-color: #CBD5E1;
  border-radius: 12px;
  color: #0F0F0F;
}

.form-control::placeholder {
  color: #A3A3A3;
}

.form-control:focus,
.form-select:focus {
  background: #ffffff;
  border-color: #0F0F0F;
  box-shadow: 0 0 0 3px rgba(132, 96, 246, 0.22);
  color: #0F0F0F;
}

.form-control[readonly], .form-control:disabled {
  background: rgb(94.4549019608%, 96.0392156863%, 97.6235294118%);
  color: #525252;
}

.input-group-text {
  background: #F8FAFC;
  border-color: #CBD5E1;
  color: #525252;
}

.custom-control-input:checked ~ .custom-control-label::before {
  background: #0F0F0F !important;
  border-color: #0F0F0F !important;
}

.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 3px rgba(132, 96, 246, 0.22);
}

.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  background: #ffffff !important;
}

.link-primary, .btn-link {
  color: #0F0F0F !important;
}

.link-primary:hover, .btn-link:hover {
  color: #262626 !important;
}

.user-avatar, [class^=user-avatar]:not([class*=-group]) {
  background: #0F0F0F;
  color: #ffffff;
}