.aip-checkbox {
    display: flex;
    align-items: start;
    gap: var(--_gap);
    width: fit-content;
}

.aip-checkbox:has(.aip-checkbox__label:not(:empty)) {
    padding-top: calc(8 / 16 * 1rem);
    padding-bottom: calc(8 / 16 * 1rem);
}

.aip-checkbox[data-size="sm"] {
    --_gap: calc(4 / 16 * 1rem);
    --_checkbox-size: calc(24 / 16 * 1rem);
    --_checkbox-border-width: calc(2 / 16 * 1rem);
    --_checkbox-scale: 1;
    --_label-padding-top: calc(1 / 16 * 1rem);
    --_label-font-size: calc(16 / 16 * 1rem);
}

.aip-checkbox[data-size="md"] {
    --_gap: calc(4 / 16 * 1rem);
    --_checkbox-size: calc(32 / 16 * 1rem);
    --_checkbox-border-width: calc(2 / 16 * 1rem);
    --_checkbox-scale: calc(20 / 14);
    --_label-padding-top: calc(4 / 16 * 1rem);
    --_label-font-size: calc(16 / 16 * 1rem);
}

.aip-checkbox[data-size="lg"] {
    --_gap: calc(8 / 16 * 1rem);
    --_checkbox-size: calc(44 / 16 * 1rem);
    --_checkbox-border-width: calc(3 / 16 * 1rem);
    --_checkbox-scale: calc(27 / 14);
    --_label-padding-top: calc(10 / 16 * 1rem);
    --_label-font-size: calc(17 / 16 * 1rem);
}

.aip-checkbox__checkbox {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: var(--_checkbox-size);
    height: var(--_checkbox-size);
    border-radius: 12.5%;
}

@media (hover: hover) {
    .aip-checkbox__checkbox:has(
        :not(:focus, :disabled, [aria-disabled="true"]):hover
    ) {
        background-color: var(--color-opacity-gray200);
    }
}

.aip-checkbox__input {
    --_base-color: var(--color-white);
    --_accent-color: var(--color-primary600);
    --_accent-hover-color: var(--color-primary700);
    --_border-color: var(--color-opacity-gray400);
    --_border-hover-color: var(--color-opacity-gray500);
    --_check-color: var(--color-white);

    margin: 0;
    appearance: none;
    width: 75%;
    height: 75%;
    border-radius: calc(2 / 18 * 100%);
    background-color: var(--_base-color);
    background-clip: padding-box;
    border: var(--_checkbox-border-width) solid var(--_border-color);
}

.aip-checkbox__input:focus {
    outline: calc(3 / 16 * 1rem) solid var(--color-focus);
}

@media (hover: hover) {
    .aip-checkbox__input:not(:disabled, [aria-disabled="true"]):hover {
        border-color: var(--color-opacity-gray500);
    }
}

.aip-checkbox__input:is(:checked, :indeterminate) {
    border-color: var(--_accent-color);
    background-color: var(--_accent-color);
}

@media (hover: hover) {
    .aip-checkbox__input:is(:checked, :indeterminate):not(
        :disabled,
        [aria-disabled="true"]
    ):hover {
        border-color: var(--_accent-hover-color);
        background-color: var(--_accent-hover-color);
    }
}

.aip-checkbox__input::before {
    display: none;
    width: calc(14 / 16 * 1rem);
    height: calc(14 / 16 * 1rem);
    background-color: var(--_check-color);
    transform-origin: left top;
    transform: scale(var(--_checkbox-scale, 1));
    content: "";
}

.aip-checkbox__input:checked::before {
    display: block;
    clip-path: path(
        "M5.6,11.2L12.65,4.15L11.25,2.75L5.6,8.4L2.75,5.55L1.35,6.95L5.6,11.2Z"
    );
}

.aip-checkbox__input:indeterminate::before {
    display: block;
    clip-path: path("M2,6h10v2H2Z");
}

.aip-checkbox__input[aria-invalid="true"] {
    --_accent-color: var(--color-alert);
    --_accent-hover-color: var(--color-red700);
    --_border-color: var(--color-alert);
    --_border-hover-color: var(--color-red700);
}

.aip-checkbox__input:is(:disabled, [aria-disabled="true"]) {
    --_base-color: var(--color-solid-gray50);
    --_accent-color: var(--color-solid-gray200);
    --_accent-hover-color: var(--color-solid-gray200);
    --_border-color: var(--color-solid-gray300);
    --_border-hover-color: var(--color-solid-gray300);
    --_check-color: var(--color-solid-gray50);
}

.aip-checkbox__label {
    padding-top: var(--_label-padding-top);
    font-weight: normal;
    font-size: var(--_label-font-size);
    line-height: 1.3;
    font-family: var(--font-family-sans);
    letter-spacing: 0;
    color: var(--color-solid-gray800);
}

.aip-checkbox-group {
    display: flex;
    flex-direction: column;
    gap: calc(2 / 16 * 1rem);
}

.aip-checkbox-group__required[data-required="true"] {
    color: var(--color-alert);
    font-size: calc(13 / 16 * 1rem);
    font-weight: 500;
    margin-left: calc(6 / 16 * 1rem);
}

.aip-checkbox-group__legend {
    color: var(--color-opacity-gray600);
    font-size: 0.875rem;
    line-height: 1.2em;
}

.aip-checkbox-group__options {
    display: flex;
    flex-direction: column;
}

.aip-checkbox-group__options[data-direction="row"] {
    flex-direction: row;
    flex-wrap: wrap;
    gap: calc(8 / 16 * 1rem) calc(16 / 16 * 1rem);
}

