/*
Django CMS Form Hacks

Render temporary messages to warn users and admins about unsupported feature(s) of the Django CMS Form plugin.

Reference:

- [FP-1808](https://jira.tacc.utexas.edu/browse/FP-1808)

Styleguide Components.DjangoCMS.Forms.Hacks
*/
@custom-selector :--django-cms-logged-in   .cms-ready;
@custom-selector :--django-cms-edit-mode   [class*="cms-structure-mode-"];
/* IDEA: WP-280 use postcss mixin for message styles */
/* @tacc/core-styles/src/lib/_imports/components/c-message.css */

@custom-selector :--problem-field
  .field-wrapper.checkboxselectmultiple.required;

/* To inform user or admin about unsupported required multi-checkbox field */
/* HACK: This does not solve the problem; it just announces it */
:--problem-field > label::after {
  display: block;
  margin-top: 0.5em;

  /* To override styles inherited from `django-cms-forms.css` */
  font-weight: normal;

  padding: 15px 20px;
  border: var(--global-border--thick);
  font-size: var(--global-font-size--small);
}
/* To give error to admin */
html:--django-cms-edit-mode :--problem-field > label::after {
  content: 'A multi checkbox field that is required is not well implemented. Do not require this field or replace it with multiple required Yes/No radio fields.';

  color: var(--global-color-danger--dark);
  background-color: var(--global-color-danger--weak);
  border-color: var(--global-color-danger--normal);
}
/* To give warning to user */
html:not(:--django-cms-edit-mode) :--problem-field > label::after {
  content: 'This field is not well implemented. Select all boxes to bypass the error with this field.';

  color: var(--global-color-warning--dark);
  background-color: var(--global-color-warning--weak);
  border-color: var(--global-color-warning--normal);
}