/* NITVIBES – Password Reset (Custom Flow) v1.0.0 */
/* Estética mock: inputs grandes, botón amarillo, tarjeta centrada */
:root{
  --nv-yellow:#f2b301;
  --nv-bg:#0f1216;
  --nv-fg:#fff;
  --nv-muted:rgba(255,255,255,.7);
  --nv-border:rgba(255,255,255,.12);
}

.nvpr-card{
  background: var(--nv-bg);
  color: var(--nv-fg);
  border: 1px solid var(--nv-border);
  border-radius: 16px;
  padding: 22px;
  max-width: min(520px, 92vw);
  margin: 24px auto;
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
}

.nvpr-title{ margin: 0 0 6px; font-size: 1.4rem; font-weight: 800; }
.nvpr-sub{ margin: 0 0 16px; color: var(--nv-muted); }

.nvpr-label{ display:block; margin: 12px 0 6px; font-weight: 600; }
.nvpr-input, .nvpr-select{
  width: 100%; padding: 14px 12px; border-radius: 12px;
  border: 1px solid var(--nv-border); background: #0b0e12; color: #fff; font-size: 1rem;
  outline: none;
}
.nvpr-input:focus, .nvpr-select:focus{ border-color: rgba(242,179,1,.6); box-shadow: 0 0 0 3px rgba(242,179,1,.18); }

/* Select con flecha custom (si se usa en el futuro) */
.nvpr-select{
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, #fff 50%),
    linear-gradient(135deg, #fff 50%, transparent 50%);
  background-position: calc(100% - 20px) calc(50% - 2px), calc(100% - 14px) calc(50% - 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

.nvpr-btn{
  display: inline-flex; align-items:center; justify-content:center;
  padding: 12px 16px; border-radius: 12px; border: 1px solid var(--nv-yellow);
  background: var(--nv-yellow); color: #111; font-weight: 800; cursor: pointer; text-decoration: none;
  min-width: 180px;
}
.nvpr-btn:hover{ filter: brightness(1.05); }

.nvpr-actions{ display:flex; gap:12px; align-items:center; margin-top: 12px; flex-wrap: wrap; }
.nvpr-link{ color: #fff; text-decoration: underline; }

/* Avisos */
.nvpr-notice{ margin: 12px auto; padding: 12px 14px; border-radius: 12px; max-width: min(520px, 92vw); }
.nvpr-info{ background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
.nvpr-success{ background: rgba(55, 160, 90, .18); border: 1px solid rgba(55,160,90,.45); }
.nvpr-error{ background: rgba(200, 60, 60, .18); border: 1px solid rgba(200,60,60,.45); }

/* Responsive */
@media (max-width: 600px){
  .nvpr-card{ padding: 18px; border-radius: 14px; }
  .nvpr-btn{ width: 100%; }
}