.tbk-selection-card {
    color: var(--sd-ec-color-brand-tertiary-100);
    width: 100%;
    font-family: var(--sd-ec-font-font-family-regular), sans-serif;
}

.tbk-selection-card.hydrated {
    visibility: inherit;
}

.tbk-selection-card .selection-options.flex-row {
    display: flex;
    gap: var(--sd-spacing-base-medium);
}

.tbk-selection-card .selection-options.flex-column {
    display: flex;
    flex-direction: column;
    gap: var(--sd-spacing-base-small);
}

.tbk-selection-card .selection-card {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: var(--sd-spacing-base-medium);
    gap: var(--sd-spacing-base-medium);
    background: var(--sd-ec-color-neutral-000);
    border-radius: var(--sd-ec-border-radius-medium);
    cursor: pointer;
    position: relative;
    border: none !important;
    box-shadow: none !important;
    transition: none !important;
    overflow: visible;
}

.tbk-selection-card .selection-card:has(.content-container) {
    width: 100%;
    max-width: 17.5rem;
}

.tbk-selection-card .selection-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: var(--sd-ec-border-width-medium) solid var(--sd-ec-color-neutral-060);
    border-radius: var(--sd-ec-border-radius-medium);
    pointer-events: none;
    z-index: 1;
    transition: none;
}

.tbk-selection-card .selection-card::after {
    content: "";
    position: absolute;
    top: calc(-1 * var(--sd-spacing-base-x-small));
    left: calc(-1 * var(--sd-spacing-base-x-small));
    right: calc(-1 * var(--sd-spacing-base-x-small));
    bottom: calc(-1 * var(--sd-spacing-base-x-small));
    border-radius: calc(var(--sd-ec-border-radius-medium) + var(--sd-spacing-base-x-small));
    pointer-events: none;
    z-index: 0;
    opacity: 0;
    transition: none;
}

.tbk-selection-card .label-wrapper {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0;
    gap: var(--sd-spacing-base-small);
    width: 100%;
    position: relative;
    z-index: 2;
}

.tbk-selection-card .label-wrapper > label {
    margin: 0;
}

.tbk-selection-card .radio-icon {
    width: 1.5rem;
    height: 1.5rem;
    margin-right: var(--sd-spacing-base-small);
    flex-shrink: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.tbk-selection-card .selection-radio {
    position: absolute;
    opacity: 0;
    width: 0.063rem;
    height: 0.063rem;
    overflow: hidden;
    clip: rect(0.063rem 0.063rem 0.063rem 0.063rem);
}

.tbk-selection-card .radio-label {
    display: flex;
    align-items: center;
    width: 100%;
    gap: var(--sd-spacing-base-small);
    cursor: pointer;
}

.tbk-selection-card .label-text {
    color: var(--sd-ec-color-brand-tertiary-100);
    font-style: normal;
    font-weight: var(--sd-font-base-fontweight-medium);
    font-size: var(--sd-font-base-size-medium);
    line-height: 1.25rem;
    display: flex;
    align-items: center;
    font-feature-settings: 'liga' off;
    flex: 1;
}

.tbk-selection-card .content-container {
    padding: 0;
    width: 100%;
    font-weight: var(--sd-font-base-fontweight-regular);
    font-size: var(--sd-font-base-size-medium);
    line-height: 1.25rem;
    font-feature-settings: 'liga' off;
    color: var(--sd-ec-color-brand-tertiary-100);
    position: relative;
    z-index: 2;
}

.tbk-selection-card .selection-card:not(.checked):not(.disabled):not(:focus-within):not(.invalid) .radio-icon {
    filter: brightness(0) saturate(100%) invert(45%) sepia(0%) saturate(13%) hue-rotate(143deg) brightness(92%) contrast(92%);
}

.tbk-selection-card .selection-card.checked {
    background-color: var(--sd-ec-color-background-secondary-010);
}

.tbk-selection-card .selection-card.checked:hover {
    background-color: var(--sd-ec-color-state-secondary-008);
}

.tbk-selection-card .selection-card.checked::before {
    border-color: var(--sd-ec-color-brand-secondary-100);
}

.tbk-selection-card .selection-card:focus-within::before {
    border-color: var(--sd-ec-color-brand-secondary-100);
}

.tbk-selection-card .selection-card.checked:not(.disabled):not(:focus-within):not(.invalid) .radio-icon {
    filter: brightness(0) saturate(100%) invert(31%) sepia(88%) saturate(1284%) hue-rotate(189deg) brightness(90%) contrast(98%);
}

.tbk-selection-card .selection-card.checked:hover:not(.disabled):not(:focus-within):not(.invalid) .radio-icon {
    filter: brightness(0) saturate(100%) invert(22%) sepia(89%) saturate(1642%) hue-rotate(194deg) brightness(93%) contrast(101%);
}

.tbk-selection-card .selection-card:focus-within::after {
    opacity: 1;
    border: var(--sd-ec-border-width-medium) solid var(--sd-ec-color-brand-secondary-100);
    background-color: transparent;
}

.tbk-selection-card .selection-card:focus-within {
    outline: none;
    z-index: 1;
}

.tbk-selection-card .selection-card:focus-within:not(.checked):not(.disabled):not(.invalid) .radio-icon {
    filter: brightness(0) saturate(100%) invert(31%) sepia(88%) saturate(1284%) hue-rotate(189deg) brightness(90%) contrast(98%);
}

.tbk-selection-card .selection-card:focus-within.checked::before {
    background: transparent;
    z-index: 2;
}

.tbk-selection-card .selection-card:focus-within.checked:not(.disabled):not(.invalid) .radio-icon {
    filter: brightness(0) saturate(100%) invert(14%) sepia(75%) saturate(3619%) hue-rotate(195deg) brightness(89%) contrast(98%);
}

.tbk-selection-card .selection-card.invalid::before {
    border-color: var(--sd-color-base-red-090);
}

.tbk-selection-card .selection-card.invalid:hover::before {
    border-color: var(--sd-ec-color-service-error-120);
}

.tbk-selection-card .selection-card.invalid.checked:hover {
    background-color: var(--sd-ec-color-state-secondary-008);
}

.tbk-selection-card .selection-card.invalid:hover:not(.disabled):not(:focus-within) .radio-icon {
    filter: brightness(0) saturate(100%) invert(12%) sepia(83%) saturate(4530%) hue-rotate(338deg) brightness(93%) contrast(115%);
}

.tbk-selection-card .selection-card.invalid .radio-icon {
    filter: brightness(0) saturate(100%) invert(16%) sepia(89%) saturate(6375%) hue-rotate(344deg) brightness(87%) contrast(101%);
}

.tbk-selection-card .error-container {
    margin-top: var(--sd-spacing-base-small);
}

.tbk-selection-card .error-message {
    font-family: var(--sd-ec-font-font-family-regular);
    font-style: normal;
    font-weight: var(--sd-font-base-fontweight-regular);
    font-size: var(--sd-font-base-size-small);
    line-height: 1.125rem;
    letter-spacing: var(--sd-font-base-letterspacing-small);
    font-feature-settings: 'liga' off;
    color: var(--sd-color-base-red-090);
}

.tbk-selection-card .selection-card.disabled {
    background-color: var(--sd-ec-color-neutral-005);
    cursor: not-allowed;
    pointer-events: none;
}

.tbk-selection-card .selection-card.disabled::before {
    border-color: var(--sd-ec-color-neutral-050);
}

.tbk-selection-card .selection-card.disabled .label-text {
    color: var(--sd-ec-color-neutral-050);
}

.tbk-selection-card .selection-card.disabled .radio-icon {
    filter: brightness(0) saturate(100%) invert(57%) sepia(0%) saturate(0%) hue-rotate(152deg) brightness(89%) contrast(84%);
}

.tbk-selection-card .selection-card.disabled.checked {
    background-color: var(--sd-ec-color-neutral-005);
}

.tbk-selection-card .selection-card.disabled.checked::before {
    border-color: var(--sd-ec-color-neutral-050);
}

.tbk-selection-card .selection-card.disabled.checked .radio-icon {
    filter: brightness(0) saturate(100%) invert(57%) sepia(0%) saturate(0%) hue-rotate(152deg) brightness(89%) contrast(84%);
}

.tbk-selection-card .selection-card.disabled .content-container {
    color: var(--sd-ec-color-neutral-050);
}

.tbk-selection-card .selection-card:not(.checked):hover:not(.disabled):not(.invalid) .radio-label::after {
    content: none;
    position: absolute;
    top: 0.75rem;
    left: 0.75rem;
    transform: translate(-50%, -50%);
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    background-color: var(--sd-ec-color-neutral-060);
    z-index: 999;
    pointer-events: none;
}

.tbk-selection-card .selection-card:hover:not(.checked):not(.disabled):not(.invalid)::before {
    border-color: var(--sd-ec-color-neutral-080);
}

.tbk-selection-card .selection-card:hover:not(.checked):not(.disabled):not(:focus-within):not(.invalid) .radio-icon {
    filter: brightness(0) saturate(100%) invert(31%) sepia(88%) saturate(1284%) hue-rotate(189deg) brightness(90%) contrast(98%);
}

.tbk-selection-card .selection-card:hover:not(.checked):not(.disabled):not(.invalid) {
    z-index: 1;
}

/* firefox */
@supports (-moz-appearance:none) {
    .tbk-selection-card .selection-card:focus-within.checked::before {
        border-color: var(--sd-ec-color-state-secondary-120) !important;
    }

    .tbk-selection-card .selection-card:focus-within::after {
        border-color: var(--sd-ec-color-brand-secondary-100) !important;
        background-color: transparent !important;
    }
}