:root {
  --tac-swp-primary: var(--primary, #15d4ff);
  --tac-swp-primary-hover: var(--primary-dark, #009ec2);
  --tac-swp-border: var(--gray-300, #e0e0e0);
  --tac-swp-border-hover: var(--gray-500, #9e9e9e);
}

.tac-swp-wrapper {
  display: flex;
  flex-direction: column;
  gap: 15px;
  align-items: start;
}

.tac-swp-wrapper #api-key-form {
  display: flex;
  flex-direction: column;
  gap: 15px;
  align-items: start;
  width: 100%;
}

.tac-swp-wrapper button[type="submit"], .tac-swp-wrapper a#request-pin-link {
    line-height: 1.3;
}

.tac-swp-wrapper button[type="submit"] {
  display: flex;
  padding: 10px 20px;
  background: var(--tac-swp-primary);
  color: black;
}

.tac-swp-wrapper button[type="submit"]:hover {
  background: var(--tac-swp-primary-hover);
  color: white;
}

.tac-swp-wrapper a#request-pin-link {
  display: flex;
  padding: 10px 20px;
  color: black;
  border: 1px solid var(--tac-swp-border);
}

.tac-swp-wrapper a#request-pin-link:hover {
  border: 1px solid var(--tac-swp-border-hover);
}


.tac-swp-wrapper label[for="pin_input"] {
  margin: 0;
}

.tac-swp-wrapper div:empty {
  display: none;
}

.tac-swp-wrapper .pin-error {
  margin: 0;
}

.tac-swp-wrapper .api-key-field-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}