/* PSG-4484: minimum touch target size.
   WCAG 2.2 SC 2.5.8 Target Size (Minimum), axe rule `target-size`.

   Native checkbox and radio controls render at roughly 13x13px, which is
   below the 24x24px minimum. The rule is applied here, globally, rather
   than per view so the fix also covers controls that are not currently
   reported but render the same default-sized inputs.

   Consolidated here instead of duplicating into:
     - Content/terms-of-use.css        (#termsCheckBox, #policyCheckBox)
     - Mvc/Views/RedeemAccessCode/Confirm.cshtml
   following the single-source-of-truth pattern used by
   Content/accessibility-focus.css. */


/* ---------------------------------------------------------------------------
   1. Checkbox and radio controls
   --------------------------------------------------------------------------- */
input[type="checkbox"],
input[type="radio"] {
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
    vertical-align: middle;
}

/* The taller control shifts the baseline of the label that follows it, so the
   label is re-aligned rather than left sitting against the top of the box. */
input[type="checkbox"] + label,
input[type="radio"] + label {
    vertical-align: middle;
}


/* ---------------------------------------------------------------------------
   2. Spacing between adjacent targets

   SC 2.5.8 is also satisfied when targets are at least 24px apart. The terms
   checkboxes sit in separate list rows, so the rows are given enough room for
   the enlarged control to avoid the targets overlapping.
   --------------------------------------------------------------------------- */
.termsWrap ul.no-bullets li {
    padding-top: 4px;
    padding-bottom: 4px;
}
