/* Reset Browser default for Select component */

select {
  appearance: none; /* Removes native arrow in Safari */
  -webkit-appearance: none; /* Safari-specific reset */
  -moz-appearance: none; /* Firefox */

  cursor: pointer;
  background-color: white;
  background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
}

select:focus {
  outline: none;
  border-color: #007aff;
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.2);
}

/* Adjustments general */
.tnp-subscription {
  width: 100%;
}
.tnp-field input,
.tnp-field select {
  width: 100%;
}
.tnp-privacy-field {
  align-self: left;
}

.tnp-privacy-field {
  line-height: 1.1;
}

.tnp-privacy-field label {
  display: flex;
  align-items: flex-start; /* Aligns checkbox to the top of the text line; use 'center' if you prefer vertical centering */
  gap: 8px; /* Adds a small, controlled space between checkbox and text; adjust as needed */
  line-height: inherit; /* Ensures consistent line height */
}

.tnp-privacy-field label input[type='checkbox'] {
  border-width: 0px;
  padding-inline: 0 !important;
  margin: 0;
  flex-shrink: 0;
  width: auto;
}

.felusch-footer-waitlist .tnp-field input,
.felusch-footer-waitlist .tnp-lists select {
  font-family: var(--wp--preset--font-family--nunito, sans-serif);
}

/* Reactivate Button */

.tnp-reactivate .tnp-submit {
  background-color: var(--wp--preset--color--foreground, #333333);
  font-family: var(--wp--preset--font-family--nunito);
  font-size: var(--wp--preset--font-size--body-normal);
  color: var(--wp--preset--color--foreground-foreground, white);
  border-radius: 8px;
  padding: var(--wp--preset--spacing--xs-12, 12px) var(--wp--preset--spacing--xs-24, 24px);
}

/* Waitlist footer */

.felusch-footer-waitlist .tnp-field-firstname,
.felusch-footer-waitlist .tnp-field-surname,
.felusch-footer-waitlist .tnp-field-email,
.felusch-footer-waitlist .tnp-privacy-field,
.felusch-footer-waitlist .tnp-lists {
  margin-bottom: 8px;
}

.felusch-footer-waitlist .tnp-field input,
.felusch-footer-waitlist .tnp-lists select {
  padding: 4px 8px;
  border-radius: 4px;
  border-width: 0px;
}

.felusch-footer-waitlist .tnp-field label {
  font-size: small;
}

.felusch-footer-waitlist .tnp-field-button input {
  padding: 8px 16px;
  width: max-content !important;
  border-width: 0px;
  border-radius: 8px;
  background-color: var(--wp--preset--color--primary, #0f6dbf);
  color: var(--wp--preset--color--primary-foreground, white);
  margin-top: 1rem;
}

.tnp-subscription input.tnp-submit:hover,
.tnp-subscription-minimal input.tnp-submit:hover,
.tnp-submit:hover {
  opacity: 0.8;
  cursor: pointer;
}

/* Waitlist regular */

.felusch-waitlist .tnp-field-firstname,
.felusch-waitlist .tnp-field-surname,
.felusch-waitlist .tnp-field-email,
.felusch-waitlist .tnp-privacy-field,
.felusch-waitlist .tnp-lists {
  display: flex;
  gap: auto;
  justify-content: left;
  margin-bottom: var(--wp--preset--spacing--sm-16, 1rem);
}

.felusch-waitlist .tnp-field-firstname label,
.felusch-waitlist .tnp-field-surname label,
.felusch-waitlist .tnp-field-email label,
.felusch-waitlist .tnp-lists label {
  min-width: 7rem;
  font-weight: 600;
  margin-right: 8px;
  font-size: var(--wp--preset--font-size--body-normal, 18px);
}

.felusch-waitlist .tnp-field input,
.felusch-waitlist .tnp-lists select {
  padding: 4px;
  border-radius: 4px;
  border-width: 0px;
  font-size: var(--wp--preset--font-size--body-normal, 18px);
  font-family: var(--wp--preset--font-family--nunito, sans-serif);
  padding: var(--wp--preset--spacing--xxs-6, 6px) var(--wp--preset--spacing--sm-24, 24px);
}

.felusch-waitlist .tnp-field-button input {
  margin-top: var(--wp--preset--spacing--sm-24, 24px);
  margin-bottom: 0;
  background-color: var(--wp--preset--color--foreground, #333333);
  border-radius: 8px;
  font-weight: 600;
  padding: var(--wp--preset--spacing--xs-12, 12px) var(--wp--preset--spacing--xs-24, 24px);
  color: var(--wp--preset--color--primary-foreground, white);
  width: max-content !important;
}

.felusch-waitlist .tnp-privacy-field a,
.felusch-waitlist .tnp-privacy-field a:visited {
  color: var(--wp--preset--color--foreground, #333333);
}

.felusch-waitlist .tnp-privacy-field input {
  transform: scale(1.25);
  -webkit-transform: scale(1.25); /* Safari */
  transform-origin: center;
}

@media (max-width: 640px) {
  .felusch-waitlist .tnp-field-firstname,
  .felusch-waitlist .tnp-field-surname,
  .felusch-waitlist .tnp-field-email,
  .felusch-waitlist .tnp-privacy-field,
  .felusch-waitlist .tnp-lists {
    flex-direction: column;
    gap: 8px;
  }
}