.input-wrap { position: relative; }
.input-wrap input { padding-right: 92px; }
/* Botão de colar dentro do input */
.paste-btn {
  position: absolute;
  top: 50%;
  right: 7px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 36px;
  padding: 0 12px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: .8125rem;
  font-weight: 600;
  color: var(--navy);
  background: rgba(22, 36, 63, .06);
  border: none;
  border-radius: 9px;
  cursor: pointer;
  transition: background-color var(--transition), color var(--transition);
}

.paste-btn svg { width: 16px; height: 16px; }
.paste-btn:hover { background: rgba(238, 106, 51, .14); color: var(--orange-vivid); }
.paste-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(238, 106, 51, .30);
}
.paste-btn.copied { background: rgba(34, 197, 94, .15); color: #15803D; }

/* Toggle da logo */
.logo-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  background: #FFFDFB;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-md);
  cursor: pointer;
  user-select: none;
  transition: border-color var(--transition), box-shadow var(--transition);
}

.logo-toggle:hover { border-color: rgba(238, 106, 51, .4); }

.logo-toggle-text {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: .9rem;
  font-weight: 600;
  color: var(--navy);
}

.logo-toggle-text svg { width: 18px; height: 18px; color: var(--orange); }

/* checkbox real escondido; o .switch é o visual */
.logo-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }

.switch {
  position: relative;
  flex: none;
  width: 46px;
  height: 26px;
  border-radius: 999px;
  background: rgba(22, 36, 63, .18);
  transition: background-color var(--transition);
}

.switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #FFFFFF;
  box-shadow: 0 2px 5px rgba(22, 36, 63, .35);
  transition: transform var(--transition);
}

.logo-toggle input:checked ~ .switch { background: var(--grad-orange); }
.logo-toggle input:checked ~ .switch::after { transform: translateX(20px); }

.logo-toggle input:focus-visible ~ .switch {
  box-shadow: 0 0 0 3px rgba(238, 106, 51, .30);
}

/* Área do QR */
.qr-stage {
  position: relative;
  align-self: center;
  width: 244px;
  height: 244px;
  display: grid;
  place-items: center;
  padding: 18px;
  background: #FFFFFF;
  border-radius: var(--radius-lg);
  box-shadow: inset 0 0 0 1.5px rgba(22, 36, 63, .10);
}

#qr-target { display: none; line-height: 0; }
#qr-target canvas { border-radius: 8px; max-width: 100%; height: auto; }

.qr-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  color: #9AA6BB;
  text-align: center;
  font-size: .875rem;
}

.qr-empty svg { width: 46px; height: 46px; color: rgba(22, 36, 63, .25); }


@media (max-width: 400px) {
  .qr-stage { width: 210px; height: 210px; }
}