.ntsh-checklist { width: 100%; margin: 30px 0px; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 10px; .ntsh-checklist-row { width: 100%; display: flex; justify-content: flex-start; align-items: center; gap: 10px; .ntsh-checklist-row-status { width: 20px; height: 20px; margin: 0px 10px; border-radius: 100%; background: #00000024; flex-shrink: 0; &.GREEN { background: #1db100; } &.RED { background: #b10000; } &.YELLOW { background: #b1a100; } &.GRAY { background: #d5c7ba; } } .ntsh-checklist-row-text { flex-grow: 1; } .ntsh-checklist-row-buttons { display: flex; flex-direction: column; gap: 3px; .ntsh-checklist-row-button { align-self: stretch; display: none; padding: 5px 10px; border: 2px solid #000; font-weight: 500; transition-duration: 0.2s; cursor: pointer; font-size: 12px; text-align: center; &:hover { background: #d7ccc1; } } } } }