/* ========================================
   USER FORM - Blue Theme
   Extends editor_form.css. All styles scoped
   under .editor-form.user-theme.
   ======================================== */

/* Header gradient - blue */
.editor-form.user-theme .editor-header {
  background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
}

[data-theme="dark"] .editor-form.user-theme .editor-header {
  background: linear-gradient(135deg, #1e3253 0%, #131f36 100%);
  border: 1px solid rgba(96, 165, 250, 0.3);
}

/* Section focus state - blue */
.editor-form.user-theme .editor-section:focus-within {
  border-color: var(--arp-blue-500);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

[data-theme="dark"] .editor-form.user-theme .editor-section:focus-within {
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

/* Section header icon color */
.editor-form.user-theme .editor-section-header .icon {
  color: var(--arp-blue-600);
}

[data-theme="dark"] .editor-form.user-theme .editor-section-header .icon {
  color: var(--arp-blue-400);
}

/* Danger Zone: keep chrome neutral; only the icon + toggle button signal danger */
.editor-form.user-theme .editor-section.is-danger-zone .editor-section-header .icon {
  color: var(--arp-status-danger-fg);
}

.editor-form.user-theme .editor-section.is-danger-zone .danger-zone-toggle {
  margin-left: auto;
}

/* Mobile: center header content to match the user show page's hero layout */
@media screen and (max-width: 768px) {
  .editor-form.user-theme .editor-header {
    text-align: center;
  }

  .editor-form.user-theme .editor-header-stats {
    justify-content: center;
  }

  .editor-form.user-theme .editor-header .buttons {
    justify-content: center;
  }
}