/* Generic Form Styles */
.form-section {
  margin-top: 20px;
}
/* --- Toggle button --- */
.form-toggle-btn {
  /* Dark defaults */
  --btn-border: #374151;
  --btn-bg-hover: #111827;
  --btn-text: #f9fafb;
  --btn-text-hover: #ffffff;
  --icon-color: #d1d5db;
  --icon-hover: #ffffff;

  display: flex;
  align-items: center;
  gap: 0.5rem;
  border: 2px solid var(--btn-border);
  border-radius: 4px;
  padding: 0.75rem 1rem;
  background: transparent;
  color: var(--btn-text);
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: var(--font-size);
  font-family: var(--font-family);
}

/* --- LIGHT THEME OVERRIDES --- */
html.light .form-toggle-btn {
  --btn-border: #C9C1A8;
  --btn-bg-hover: #EAE5D6;
  --btn-text: #3E3A2F;
  --btn-text-hover: #000000;
  --icon-color: #5A4B1C;
  --icon-hover: #000000;
}

html.light .form-input,
html.light .form-textarea {
  --input-text: #3E3A2F;
  --placeholder: #8B8575;
}

html.light .cancel-btn {
  --cancel-border: #C9C1A8;
  --cancel-text: #6B7A2E;
  --cancel-hover-bg: #EAE5D6;
  --cancel-hover-text: #3E3A2F;
}

.form-toggle-btn:hover {
  background: var(--btn-bg-hover);
  border-color: var(--btn-border);
  color: var(--btn-text-hover);
}

.form-icon {
  flex-shrink: 0;
  color: var(--icon-color);
  transition: color 0.2s ease;
}

.form-toggle-btn:hover .form-icon {
  color: var(--icon-hover);
}

/* --- Inputs --- */
.form-input,
.form-textarea {
  --input-text: #d1d5db;
  --placeholder: #9ca3af;
  --focus-border: #6366f1;
  --focus-shadow: rgba(99, 102, 241, 0.1);

  width: 100%;
  padding: 0.75rem;
  border: 2px solid var(--border-color);
  background: transparent;
  color: var(--input-text);
  border-radius: 0.5rem;
  box-sizing: border-box;
  font-size: var(--font-size);
  font-family: var(--font-family);
  transition: border-color 0.2s ease;
}

.form-input:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--focus-border);
  box-shadow: 0 0 0 3px var(--focus-shadow);
}

.form-input::placeholder,
.form-textarea::placeholder {
  color: var(--placeholder);
}

.form-textarea {
  min-height: 200px;
  resize: vertical;
}

/* --- Buttons --- */
.submit-btn,
.cancel-btn {
  --cancel-border: #374151;
  --cancel-text: #9ca3af;
  --cancel-hover-bg: #1f2937;
  --cancel-hover-text: #d1d5db;

  padding: 0.75rem 1.5rem;
  border-radius: 0.5rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
  font-size: var(--font-size);
  font-family: var(--font-family);
}

.submit-btn {
  background: #6366f1;
  color: white;
}

.submit-btn:hover {
  background: #5855eb;
}

.cancel-btn {
  background: transparent;
  color: var(--cancel-text);
  border: 1px solid var(--cancel-border);
}

.cancel-btn:hover {
  background: var(--cancel-hover-bg);
  color: var(--cancel-hover-text);
}

/* Layout bits unchanged */
.form-container { margin-top: 1rem; }
.form-group { margin-bottom: 1rem; }
.form-actions { display: flex; gap: 0.75rem; margin-top: 1.5rem; justify-content: center; }
.hidden { display: none; }

@media (max-width: 640px) {
  .form-actions { flex-direction: column; }
  .submit-btn, .cancel-btn { width: 100%; }
}