How to Add Outlines on the Frontend in Bricks for Troubleshooting

.brx-body * {
	outline-style: dashed;
	/* Default outline - Few options to try out */
	/* Dark: rgba(0,0,0,0.40) */
	/* Yellow: rgba(255,250,0,0.80) */
	/* Blue: rgba(0,135,255,0.50) */
	outline-color: rgba(0,135,255,0.50);
	outline-width: 1px;
	/* The offset values prevent the outlines from overlapping with eachother. Set to 0px for maximum accuracy */
	outline-offset: 0;
}

.brx-body *::before {
	outline-style: dashed;
	/* Default green for :before rgba(0,255,178,0.40) */
	outline-color: rgba(0,255,178,0.40);
	outline-width: 2px;
	/* The offset values prevent the outlines from overlapping with eachother. Set to 0px for maximum accuracy */
	outline-offset: 2px;
}

.brx-body *::after {
	outline-style: dashed;
	/* Default red for :after rgba(255,0,0,0.50) */
	outline-color: rgba(255,0,0,0.40);
	outline-width: 2px;    
	/* The offset values prevent the outlines from overlapping with eachother. Set to 0px for maximum accuracy */
	outline-offset: 4px;
}

#wpadminbar *::before,
#wpadminbar *,
#wpadminbar *::after {
    outline-style: none;
}




Type: CSS

Custom PHP Condition:
<?php 
! bricks_is_builder() && ! is_admin();