:root {
  --ww-form-border: var(--color-base-300, #c1cbd9);
  --ww-form-border-hover: var(--color-base-400, #9fa9bb);
  --ww-form-border-focus: var(--color-primary-500, #2a5f9b);
  --ww-form-ring-focus: rgba(42, 95, 155, 0.2);
  --ww-form-background: #ffffff;
}

html.dark :root {
  --ww-form-border: var(--color-base-600, #5b6679);
  --ww-form-border-hover: var(--color-base-500, #7b8599);
  --ww-form-border-focus: var(--color-primary-400, #4f7fb3);
  --ww-form-ring-focus: rgba(79, 127, 179, 0.35);
  --ww-form-background: var(--color-base-900, #161f2c);
}

body input[type="text"],
body input[type="email"],
body input[type="number"],
body input[type="password"],
body input[type="url"],
body input[type="tel"],
body input[type="search"],
body input[type="date"],
body input[type="time"],
body textarea,
body select,
body .unfold .django-ckeditor-widget {
  border: 1px solid var(--ww-form-border);
  border-radius: var(--border-radius, 0.65rem);
  background-color: var(--ww-form-background);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

body input[type="text"]:hover,
body input[type="email"]:hover,
body input[type="number"]:hover,
body input[type="password"]:hover,
body input[type="url"]:hover,
body input[type="tel"]:hover,
body input[type="search"]:hover,
body input[type="date"]:hover,
body input[type="time"]:hover,
body textarea:hover,
body select:hover,
body .unfold .django-ckeditor-widget:hover {
  border-color: var(--ww-form-border-hover);
}

body input[type="text"]:focus,
body input[type="email"]:focus,
body input[type="number"]:focus,
body input[type="password"]:focus,
body input[type="url"]:focus,
body input[type="tel"]:focus,
body input[type="search"]:focus,
body input[type="date"]:focus,
body input[type="time"]:focus,
body textarea:focus,
body select:focus,
body .unfold .django-ckeditor-widget:focus {
  border-color: var(--ww-form-border-focus);
  box-shadow: 0 0 0 3px var(--ww-form-ring-focus);
  outline: none;
}

body textarea,
body select {
  min-height: 2.75rem;
}

body .select2-container--default .select2-selection--single,
body .select2-container--default .select2-selection--multiple {
  border: 1px solid var(--ww-form-border);
  border-radius: var(--border-radius, 0.65rem);
  background-color: var(--ww-form-background);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

body .select2-container--default .select2-selection--single:focus,
body .select2-container--default .select2-selection--single:focus-within,
body .select2-container--default .select2-selection--multiple:focus,
body .select2-container--default .select2-selection--multiple:focus-within {
  border-color: var(--ww-form-border-focus);
  box-shadow: 0 0 0 3px var(--ww-form-ring-focus);
}

body .select2-container--default .select2-selection--single .select2-selection__rendered,
body .select2-container--default .select2-selection--multiple .select2-selection__rendered {
  line-height: 2.5rem;
}

body .select2-search--dropdown .select2-search__field,
body .select2-search--inline .select2-search__field {
  border: 1px solid var(--ww-form-border);
}

body .select2-container--default.select2-container--open .select2-selection--single,
body .select2-container--default.select2-container--open .select2-selection--multiple {
  border-color: var(--ww-form-border-focus);
  box-shadow: 0 0 0 3px var(--ww-form-ring-focus);
}

body .vTextField,
body .vURLField,
body .vIntegerField,
body .vLargeTextField,
body .vFileField,
body .vDateField,
body .vTimeField,
body .vForeignKeyRawIdAdminField {
  padding: 0.6rem 1rem;
}

body select[multiple],
body .select2-selection--multiple {
  min-height: 3rem;
}