@scope(.instui-radio){&{align-items:center;gap:var(--instui-component-radio-input-gap);color:var(--instui-component-radio-input-label-base-color);font-family:var(--instui-component-radio-input-font-family);font-size:var(--instui-component-radio-input-font-size-md);font-weight:var(--instui-component-radio-input-font-weight);line-height:var(--instui-component-radio-input-line-height-md);display:inline-flex}&:not(.-variant-toggle):not(.-toggle) input[type=radio]{-webkit-appearance:none;appearance:none;width:var(--instui-component-radio-input-control-size-md);height:var(--instui-component-radio-input-control-size-md);margin-block:var(--instui-component-radio-input-control-vertical-margin);border:var(--instui-component-radio-input-border-width) solid var(--instui-component-radio-input-border-color);background:var(--instui-component-radio-input-background-color);cursor:pointer;border-radius:50%;flex:none;place-content:center;transition:border-color .15s,background-color .15s;display:inline-grid}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:before{content:"";width:calc(var(--instui-component-radio-input-control-size-md) - 2 * var(--instui-component-radio-input-checked-inset-md));height:calc(var(--instui-component-radio-input-control-size-md) - 2 * var(--instui-component-radio-input-checked-inset-md));background:var(--instui-component-radio-input-border-selected-color);border-radius:50%;transition:transform .1s;transform:scale(0)}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:hover{border-color:var(--instui-component-radio-input-border-hover-color);background:var(--instui-component-radio-input-background-hover-color)}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:checked{border-color:var(--instui-component-radio-input-border-selected-color)}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:checked:before{transform:scale(1)}&:not(.-variant-toggle):not(.-toggle) input[type=radio]:disabled{border-color:var(--instui-component-radio-input-border-disabled-color);background:var(--instui-component-radio-input-background-disabled-color);cursor:not-allowed}&:not(.-variant-toggle):not(.-toggle):has(input:disabled){color:var(--instui-component-radio-input-label-disabled-color)}&:not(.-variant-toggle):not(.-toggle):hover{color:var(--instui-component-radio-input-label-hover-color)}&:not(.-variant-toggle):not(.-toggle).-size-sm{font-size:var(--instui-component-radio-input-font-size-sm);line-height:var(--instui-component-radio-input-line-height-sm)}&:not(.-variant-toggle):not(.-toggle).-size-sm input[type=radio]{width:var(--instui-component-radio-input-control-size-sm);height:var(--instui-component-radio-input-control-size-sm)}&:not(.-variant-toggle):not(.-toggle).-size-sm input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm));height:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm))}&:not(.-variant-toggle):not(.-toggle).-size-lg{font-size:var(--instui-component-radio-input-font-size-lg);line-height:var(--instui-component-radio-input-line-height-lg)}&:not(.-variant-toggle):not(.-toggle).-size-lg input[type=radio]{width:var(--instui-component-radio-input-control-size-lg);height:var(--instui-component-radio-input-control-size-lg)}&:not(.-variant-toggle):not(.-toggle).-size-lg input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg));height:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg))}&:not(.-variant-toggle):not(.-toggle).-readonly{color:var(--instui-component-radio-input-label-readonly-color)}&:not(.-variant-toggle):not(.-toggle).-readonly input[type=radio]{border-color:var(--instui-component-radio-input-border-readonly-color);background:var(--instui-component-radio-input-background-readonly-color)}&.-variant-toggle{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-success);height:var(--instui-component-radio-input-toggle-medium-height);border-radius:var(--instui-component-radio-input-toggle-border-radius);color:var(--instui-component-radio-input-label-base-color);font-size:var(--instui-component-radio-input-toggle-medium-font-size);text-transform:uppercase;white-space:nowrap;cursor:pointer;background:0 0;justify-content:center;gap:0;padding-inline:.875rem;line-height:1;transition:background-color .15s,color .15s;position:relative}&.-variant-toggle input[type=radio]{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}&.-variant-toggle.-context-off{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-off)}&.-variant-toggle.-context-success{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-success)}&.-variant-toggle.-context-danger{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-danger)}&.-variant-toggle.-context-warning{--pantoken-rt-fill:var(--instui-component-radio-input-toggle-background-warning)}&.-variant-toggle:has(input:checked){background:var(--pantoken-rt-fill);color:var(--instui-component-radio-input-toggle-handle-text);box-shadow:var(--instui-elevation-depth1)}&.-variant-toggle:has(input:focus-visible){text-decoration:underline}&.-variant-toggle:has(input:focus-visible):before{content:"";border:var(--instui-focus-outline-width) var(--instui-focus-outline-style) var(--instui-focus-outline-color);border-radius:calc(var(--instui-component-radio-input-toggle-border-radius) + .0625rem);pointer-events:none;position:absolute;inset:-.25rem}&.-variant-toggle:has(input:disabled){opacity:.5;cursor:not-allowed}&.-variant-toggle.-size-sm{height:var(--instui-component-radio-input-toggle-small-height);font-size:var(--instui-component-radio-input-toggle-small-font-size);padding-inline:.5rem}&.-variant-toggle.-size-lg{height:var(--instui-component-radio-input-toggle-large-height);font-size:var(--instui-component-radio-input-toggle-large-font-size);padding-inline:1rem}&:not(.-variant-toggle):not(.-toggle).-size-small{font-size:var(--instui-component-radio-input-font-size-sm);line-height:var(--instui-component-radio-input-line-height-sm)}&:not(.-variant-toggle):not(.-toggle).-size-small input[type=radio]{width:var(--instui-component-radio-input-control-size-sm);height:var(--instui-component-radio-input-control-size-sm)}&:not(.-variant-toggle):not(.-toggle).-size-small input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm));height:calc(var(--instui-component-radio-input-control-size-sm) - 2 * var(--instui-component-radio-input-checked-inset-sm))}&:not(.-variant-toggle):not(.-toggle).-size-large{font-size:var(--instui-component-radio-input-font-size-lg);line-height:var(--instui-component-radio-input-line-height-lg)}&:not(.-variant-toggle):not(.-toggle).-size-large input[type=radio]{width:var(--instui-component-radio-input-control-size-lg);height:var(--instui-component-radio-input-control-size-lg)}&:not(.-variant-toggle):not(.-toggle).-size-large input[type=radio]:before{width:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg));height:calc(var(--instui-component-radio-input-control-size-lg) - 2 * var(--instui-component-radio-input-checked-inset-lg))}&.-variant-toggle.-size-small{height:var(--instui-component-radio-input-toggle-small-height);font-size:var(--instui-component-radio-input-toggle-small-font-size);padding-inline:.5rem}&.-variant-toggle.-size-large{height:var(--instui-component-radio-input-toggle-large-height);font-size:var(--instui-component-radio-input-toggle-large-font-size);padding-inline:1rem}}