.ct-radio-option { display: flex; flex-wrap: wrap; margin: 0; // simple type label { display: flex; align-items: center; user-select: none; &:hover input { &:not(:checked) { border-color: #C3CACF; } } } input[type="radio"] { flex: 0 0 16px; width: 16px; height: 16px; margin: 0 8px 0 0; border: 2px solid #d5dbde; background: transparent; box-shadow: none; transition: none; appearance: none; &:checked { border-color: $accent_color; background: $accent_color; &:before { content: ''; width: 6px; height: 6px; margin: 3px; background: #fff !important; } } } &:not([data-inline]):not([data-columns]) { label { &:not(:last-child) { margin-bottom: 10px; } } } &[data-inline] { display: flex; flex-wrap: wrap; label { &:not(:last-child) { margin-right: 15px; } } } // columns &[data-columns] { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: -10px; label { width: 47%; margin-top: 15px; } } &[data-radio-text="small"] li { font-size: 12px; } // alignment &[data-type="alignment"] li { font-family: dashicons; font-size: 16px; &:first-child:before { content: "\f138"; } &:nth-child(2):before { content: "\f134"; } &:last-child:before { content: "\f138"; transform: rotate(180deg); } } }