#pnone_verify_dialog {
  font-family: var(--font-family);
  color: var(--color-text);
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
}

#pnone_verify_dialog .pv-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  flex: 0 0 auto;
}

#pnone_verify_dialog .pv-ico svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
}

.pv-steps {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0 auto var(--space-5) auto;
  max-width: 220px;
}

.pv-step {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: var(--radius-full);
  background: var(--color-bg-dark-gray);
  color: var(--color-text-muted);
  font-size: 18px;
  flex: 0 0 auto;
}

.pv-step svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
}

.pv-step.is-active {
  background: var(--color-primary);
  color: #fff;
}

.pv-step.is-done {
  background: var(--color-success);
  color: #fff;
}

.pv-steps__line {
  flex: 1 1 auto;
  height: 2px;
  border-radius: var(--radius-full);
  background: var(--color-bg-dark-gray);
  min-width: 12px;
}

.pv-steps__line.is-done {
  background: var(--color-success);
}

.pv-field {
  margin-bottom: var(--space-4);
}

.pv-label {
  display: block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  margin-bottom: var(--space-2);
}

#pnone_verify_dialog input.pv-input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  height: 52px;
  padding: 0 var(--space-4);
  border: 1px solid var(--color-border-dark);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  font-family: var(--font-family);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.02em;
  color: var(--color-text);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

#pnone_verify_dialog input.pv-input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.15);
}

#pnone_verify_dialog input.pv-input::placeholder {
  color: var(--color-text-muted);
  font-weight: var(--font-weight-normal);
  font-size: var(--font-size-lg);
}

.pv-hint {
  margin-top: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.pv-options {
  display: grid;
  gap: var(--space-2);
  margin-bottom: var(--space-5);
}

.pv-option {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  cursor: pointer;
  transition: border-color var(--transition-fast), background var(--transition-fast);
}

.pv-option:hover {
  border-color: var(--color-border-dark);
  background: var(--color-bg-light-gray);
}

.pv-option input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
}

.pv-option__mark {
  position: relative;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  border: 2px solid var(--color-border-dark);
  border-radius: var(--radius-full);
  background: #fff;
  flex: 0 0 auto;
  transition: border-color var(--transition-fast);
}

.pv-option__mark::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: var(--radius-full);
  background: var(--color-primary);
  transform: scale(0);
  transition: transform var(--transition-fast);
}

.pv-option__body {
  display: block;
  min-width: 0;
}

.pv-option__title {
  display: block;
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-tight);
}

.pv-option__desc {
  display: block;
  margin-top: var(--space-1);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.pv-option:has(input:checked) {
  border-color: var(--color-primary);
  background: rgba(229, 57, 53, 0.04);
}

.pv-option:has(input:checked) .pv-option__mark {
  border-color: var(--color-primary);
}

.pv-option:has(input:checked) .pv-option__mark::after {
  transform: scale(1);
}

.pv-option:has(input:focus-visible) .pv-option__mark {
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.2);
}

.pv-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--space-2);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border-light);
}

#pnone_verify_dialog .pv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-5);
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  background: var(--color-bg-dark-gray);
  color: var(--color-text);
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  line-height: 1.2;
  cursor: pointer;
  transition: background var(--transition-fast), border-color var(--transition-fast);
}

#pnone_verify_dialog .pv-btn:hover {
  background: var(--color-border);
}

#pnone_verify_dialog .pv-btn--primary {
  background: var(--color-primary);
  color: #fff;
}

#pnone_verify_dialog .pv-btn--primary:hover {
  background: var(--color-primary-dark);
}

#pnone_verify_dialog .pv-btn:disabled,
#pnone_verify_dialog .pv-btn:disabled:hover {
  background: var(--color-bg-dark-gray);
  color: var(--color-text-secondary);
  cursor: default;
}

#pnone_verify_dialog .pv-btn--ghost {
  background: transparent;
  border-color: var(--color-border-dark);
  color: var(--color-text-secondary);
}

#pnone_verify_dialog .pv-btn--ghost:hover {
  background: var(--color-bg-light-gray);
}

.pv-alert {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-4);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-normal);
}

.pv-alert .pv-ico {
  font-size: 20px;
  margin-top: 1px;
}

.pv-alert--error {
  background: #FDECEA;
  color: #8E1F1B;
}

.pv-alert--info {
  background: #E8F1FB;
  color: #114777;
}

.pv-alert--warning {
  background: #FFF4E0;
  color: #7A4A00;
}

.pv-alert b {
  font-weight: var(--font-weight-bold);
}

.pv-call {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: var(--space-5) var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-light-gray);
}

.pv-call__title {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: var(--space-3);
}

a.pv-call__number {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.01em;
  color: var(--color-text);
  text-decoration: none;
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-md);
  background: var(--color-success);
  color: #fff;
}

a.pv-call__number .pv-ico {
  font-size: 22px;
}

.pv-call__status {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.pv-call__pulse {
  position: relative;
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full);
  background: var(--color-success);
  flex: 0 0 auto;
}

.pv-call__pulse::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--radius-full);
  background: var(--color-success);
  animation: pv-pulse 1.6s ease-out infinite;
}

@keyframes pv-pulse {
  0% { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(2.6); opacity: 0; }
}

.pv-qr-toggle {
  display: none;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-4);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border-dark);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  color: var(--color-text-secondary);
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  cursor: pointer;
}

.pv-qr-toggle:hover {
  background: var(--color-bg-light-gray);
}

.pv-qr-toggle .pv-ico {
  font-size: 18px;
}

.pv-qr {
  display: none;
  text-align: center;
  padding-top: var(--space-4);
}

.pv-qr img {
  height: 180px;
  max-width: 100%;
}

.pv-checklist {
  list-style: none;
  margin: var(--space-5) 0 0 0;
  padding: 0;
  display: grid;
  gap: var(--space-3);
}

.pv-checklist li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-normal);
}

.pv-checklist .pv-ico {
  font-size: 18px;
  color: var(--color-success);
  margin-top: 1px;
}

.pv-checklist b {
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

.pv-code {
  padding: var(--space-5) var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-light-gray);
  text-align: center;
}

.pv-code__title {
  font-weight: var(--font-weight-semibold);
  margin-bottom: var(--space-4);
}

.pv-otp {
  display: flex;
  justify-content: center;
  gap: var(--space-2);
  direction: ltr;
}

#pnone_verify_dialog input.pv-otp__box {
  width: 44px;
  height: 56px;
  padding: 0;
  box-sizing: border-box;
  border: 1px solid var(--color-border-dark);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  font-family: var(--font-family);
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  text-align: center;
  color: var(--color-text);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  -moz-appearance: textfield;
}

#pnone_verify_dialog input.pv-otp__box::-webkit-outer-spin-button,
#pnone_verify_dialog input.pv-otp__box::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#pnone_verify_dialog input.pv-otp__box:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(229, 57, 53, 0.15);
}

#pnone_verify_dialog input.pv-otp__box.is-filled {
  border-color: var(--color-text-secondary);
}

.pv-code__note {
  margin-top: var(--space-4);
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  line-height: var(--line-height-normal);
  text-align: left;
}

.pv-code__note div {
  display: inline;
}

.pv-done {
  text-align: center;
  padding: var(--space-6) var(--space-4) var(--space-2) var(--space-4);
}

.pv-done__ico {
  display: inline-flex;
  color: var(--color-success);
  font-size: 56px;
  line-height: 0;
}

.pv-done__ico svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
}

.pv-done__text {
  margin-top: var(--space-4);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
}

.pv-retry {
  margin-top: var(--space-4);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  text-align: center;
}

.pv-retry__error {
  font-size: var(--font-size-sm);
  color: var(--color-danger);
  margin-bottom: var(--space-3);
}

.pv-retry__error:empty {
  display: none;
}

@media (min-width: 768px) {
  a.pv-call__number {
    background: none;
    color: var(--color-text);
    font-size: var(--font-size-3xl);
    padding: var(--space-2) 0;
    pointer-events: none;
  }

  /* по-специфично от #pnone_verify_dialog .pv-ico, иначе иконата не се скрива */
  #pnone_verify_dialog a.pv-call__number .pv-ico {
    display: none;
  }

  .pv-qr-toggle {
    display: inline-flex;
  }
}

@media (max-width: 480px) {
  .pv-actions {
    flex-direction: column-reverse;
  }

  #pnone_verify_dialog .pv-btn {
    width: 100%;
  }

  #pnone_verify_dialog input.pv-otp__box {
    width: 100%;
    max-width: 48px;
    height: 52px;
    font-size: var(--font-size-xl);
  }
}