/* ====== Общий стиль формы ====== */
#contact-form {
  max-width: 500px;
  margin: 2rem auto;
  padding: 1.5rem 2rem;
  border-radius: 12px;
  transition: background-color 0.3s, box-shadow 0.3s;
}

/* Светлая тема (по умолчанию) */
html[data-theme="light"] #contact-form,
html:not([data-theme]) #contact-form {
  background: #f8f9fa;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

html[data-theme="light"] #contact-form input,
html[data-theme="light"] #contact-form textarea {
  background-color: #fff;
  border: 1.5px solid #0077b6;
  color: #000;
}

/* Тёмная тема */
html[data-theme="dark"] #contact-form {
  background: #1e1e1e;
  box-shadow: 0 2px 8px rgba(0,0,0,0.5);
}

html[data-theme="dark"] #contact-form input,
html[data-theme="dark"] #contact-form textarea {
  background-color: #2b2b2b;
  border: 1.5px solid #0096c7;
  color: #fff;
}

/* Общие стили элементов */
#contact-form label {
  font-weight: 600;
  display: block;
  margin-top: 1rem;
}

#contact-form input,
#contact-form textarea {
  width: 100%;
  padding: 0.6rem;
  margin-top: 0.3rem;
  border-radius: 6px;
  font-size: 1rem;
  outline: none;
  transition: border-color 0.3s, box-shadow 0.3s, background-color 0.3s;
}

#contact-form input:focus,
#contact-form textarea:focus {
  border-color: #0096c7;
  box-shadow: 0 0 4px rgba(0,150,199,0.3);
}

/* Кнопка */
#contact-form button {
  margin-top: 1.5rem;
  background-color: #0077b6;
  color: white;
  border: none;
  padding: 0.7rem 1.5rem;
  border-radius: 6px;
  cursor: pointer;
  font-size: 1rem;
  transition: background-color 0.3s;
}

#contact-form button:hover {
  background-color: #0096c7;
}

/* Кнопка в тёмной теме */
html[data-theme="dark"] #contact-form button {
  background-color: #0096c7;
  color: #fff;
}

html[data-theme="dark"] #contact-form button:hover {
  background-color: #00b4ff;
}