/* Important layered declarations override the public UI's component radius rules. */
@layer public-radius {
  *,
  *::before,
  *::after {
    border-radius: 6px !important;
  }

  /* Native checkboxes ignore border radius until their browser appearance is removed. */
  .client-legal-consent > input[type="checkbox"] {
    appearance: none !important;
    border: 1px solid #737583 !important;
    background-color: #191a21 !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 12px 12px !important;
  }
  .client-legal-consent > input[type="checkbox"]:checked {
    background-color: #bc1688 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2 6 2.5 2.5L10 3' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  }
  .client-legal-consent > input[type="checkbox"]::after {
    content: none !important;
  }
}
