/* Base styles for light theme */
body {
  background-color: #f9fafb;
  color: #111827;
  transition: background-color 0.3s, color 0.3s;
}

.form-control {
  border: 1px solid #ced4da;
  border-radius: 8px;
  padding: 10px 15px;
  transition: all 0.3s ease;
}

.form-control:disabled {
  cursor: not-allowed;
  background-color: #e9ecef;
  opacity: 0.65;
}

.btn-primary {
  background-color: #0d6efd;
  border-color: #0d6efd;
  border-radius: 8px;
  padding: 10px 20px;
  font-weight: bold;
  transition: all 0.3s ease;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #0d6efd, #0b5ed7);
}

.btn-primary:disabled {
  cursor: not-allowed;
  background-color: #6c757d;
  border-color: #6c757d;
  background-image: none;
  box-shadow: none;
}

.social-link {
  text-decoration: none;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 5px;
  transition: transform 0.2s;
}

.social-link:hover {
  transform: translateY(-3px);
}

.facebook {
  color: #1877f2;
}

.twitter {
  color: #1da1f2;
}

.instagram {
  color: #e1306c;
}

.follow-us-section {
  background-color: #f9fafb;
}

/* Styles for dark theme, applied automatically */
@media (prefers-color-scheme: dark) {
  body {
    /* background-color: #121212;
    color: #e0e0e0; */
    background-color: #1a1a1a; /* grigio scuro-bluastro */
    color: #e5e5e5;
  }

  .form-control {
    background-color: #333;
    color: #e5e5e5;
    border: 1px solid #555;
  }

  .form-control::placeholder {
    color: #bbb;
  }

  .form-control:disabled {
    background-color: #444;
    color: #aaa;
    border: 1px solid #666;
    opacity: 0.8;
  }

  .btn-primary {
    background-color: #4caf50;
    border-color: #4caf50;
    background-image: linear-gradient(to bottom, #4caf50, #45a049);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }

  .btn-primary:disabled {
    background-color: #555;
    border-color: #555;
  }

  h1,
  p {
    color: #e5e5e5;
  }

  .follow-us-section {
    background-color: #1a1a1a;
  }
}