@postenbring/hedwig-css/dist/radio-button.css.map

Styles for [Hedwig Design System](https://github.com/bring/hedwig-design-system).

{"version":3,"sourceRoot":null,"mappings":"AAAA,sVAiBE,mCAIA,8HAKA,+FAYA,iFAUA,8OAUA,6FAIA,qKAKA,4MAYA,iHAAA,2IAQA,gFAOA,oTAME,yGASA,+IAAA,qJAMA,0IAMF,kHAIE,uLAOF","sources":["home/runner/work/hedwig-design-system/hedwig-design-system/packages/css/src/form/radio-button/radio-button.css"],"sourcesContent":[".hds-radio-button {\n  --checkmark-width: 24px;\n  --checkmark-margin: 2px;\n\n  display: block;\n  padding: 0 0 0\n    calc(var(--checkmark-width) + (var(--checkmark-margin) * 2) + var(--hds-spacing-12));\n  border-radius: var(--hds-border-radius);\n  font: var(--hds-typography-body);\n  position: relative;\n  cursor: pointer;\n\n  /**\n   * To avoid unexpected behavior of focus when clicking the radio button text\n   */\n  user-select: none;\n\n  * {\n    cursor: pointer;\n  }\n\n  .hds-radio-button__title {\n    font-weight: var(--hds-font-weight-body-title);\n    padding-bottom: var(--hds-spacing-12);\n  }\n\n  label::after {\n    content: \"\";\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n  }\n\n  /**\n  * Hide the browser default RadioButton\n  */\n  input[type=\"radio\"] {\n    position: absolute;\n    opacity: 0;\n    height: 0;\n    width: 0;\n  }\n\n  /**\n  * Create a custom RadioButton\n  */\n  .hds-radio-button__checkmark {\n    margin: var(--checkmark-margin) 0;\n    position: absolute;\n    left: 0;\n    height: var(--checkmark-width);\n    width: var(--checkmark-width);\n    border: solid 2px var(--hds-colors-neutral-border-strong);\n    border-radius: 50%;\n  }\n\n  input[type=\"radio\"]:checked ~ .hds-radio-button__checkmark::after {\n    display: block;\n  }\n\n  input[type=\"radio\"]:checked ~ .hds-radio-button__checkmark {\n    background-color: var(--hds-colors-base-default);\n    border-color: var(--hds-colors-base-default);\n  }\n\n  .hds-radio-button__checkmark::after {\n    content: \"\";\n    position: absolute;\n    display: none;\n    top: 5px;\n    left: 5px;\n    width: 10px;\n    height: 10px;\n    border-radius: 50%;\n    background: var(--hds-colors-base-contrast-default);\n  }\n\n  fieldset[data-color] & .hds-radio-button__checkmark,\n  fieldset[data-color] & input[type=\"radio\"]:checked ~ .hds-radio-button__checkmark {\n    border-color: var(--hds-colors-border-strong);\n  }\n\n  /**\n   * Small variant\n   */\n  &.hds-radio-button--small {\n    font: var(--hds-typography-body-small);\n  }\n\n  /**\n  * Variant bounding-box\n  */\n  &.hds-radio-button--bounding-box {\n    background-color: var(--hds-colors-bg-tinted);\n    padding: var(--hds-spacing-16) var(--hds-spacing-32) var(--hds-spacing-16)\n      calc(var(--hds-spacing-16) + var(--checkmark-width) + var(--hds-spacing-16));\n    border: solid var(--hds-stroke-default) var(--hds-colors-bg-tinted);\n\n    .hds-radio-button__checkmark {\n      left: var(--hds-spacing-16);\n    }\n  }\n\n  /**\n  * State: Disabled\n  */\n  input[type=\"radio\"]:disabled {\n    ~ .hds-radio-button__checkmark,\n    ~ .hds-radio-button__checkmark::after {\n      border-color: var(--hds-colors-neutral-border-default);\n      cursor: default;\n    }\n\n    ~ .hds-radio-button__checkmark::after {\n      background: var(--hds-colors-border-strong);\n      cursor: default;\n    }\n  }\n\n  &.hds-radio-button:has(input:disabled) {\n    cursor: default;\n    color: var(--hds-colors-neutral-text-subtle);\n\n    &.hds-radio-button--bounding-box {\n      background-color: var(--hds-colors-neutral-base-default);\n      border-color: var(--hds-colors-bg-tinted);\n    }\n  }\n\n  /* Focus effect */\n  &:has(input[type=\"radio\"]:focus-visible) {\n    outline: 2px solid var(--hds-colors-border-strong);\n    outline-offset: 2px;\n  }\n}\n"],"names":[]}