/* colours */
/*

The Web Content Accessibility Guidelines (WCAG) specify a minimal contrast ratio of 4.5:1 against adjacent colour(s) for text in general. An exception is made for large-scale text: It is considered easier to read and can therefore be set in a lower contrast ratio of at least 3:1.

Large-scale text is defined as:

Either bold text of at least 14 points (or 18.5 pixels).
Or regular text of at least 18 points (or 24 pixels).
For more information see WCAG definition of "large scale (text)".

*/
/* for background colours */
.wp-admin .acf-block-component ul.acf-radio-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding-left: 0;
  margin-left: 0;
}
.wp-admin .acf-block-component ul.acf-radio-list li {
  margin-right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.wp-admin .acf-block-component ul.acf-radio-list li label {
  width: 28px;
  height: 28px;
  position: relative;
  margin: 6px 12px 6px 0;
  color: white;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio] {
  position: absolute;
  top: 0;
  left: 0;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  /*
  &[value="background"],
  &[value="white"],
  &[value="grey-light"],
  &[value="grey-medium"] {

       &:checked {

            &::before {
                 color: black;
            }
       }
  }        
  */
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio]:hover {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio]:focus {
  -webkit-box-shadow: 0 0 0 2px white, 0 0 0 4px #757575;
          box-shadow: 0 0 0 2px white, 0 0 0 4px #757575;
  border: 1px solid transparent;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio]:checked::before {
  content: "\f15e";
  font-family: dashicons;
  width: 20px;
  height: 20px;
  background-color: transparent;
  font-size: 20px;
  margin: 1px;
  color: white;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio][value=black] {
  background-color: #000;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio][value=red1] {
  background-color: #D93A4D;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio][value=red2] {
  background-color: #D73E23;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio][value=red3] {
  background-color: #D8222A;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio][value=yellow] {
  background-color: #CD840E;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio][value=green] {
  background-color: #147c41;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio][value=blue] {
  background-color: #3969a9;
}
.wp-admin .acf-block-component ul.acf-radio-list li label input[type=radio][value=dark-blue] {
  background-color: #1e1d44;
}

/* removes the previews for the inserter */
.block-editor-inserter__preview-container {
  display: none;
}