/*
# Group button structure

	Group button - OFF/UP

		.mat-button-toggle-group 	( with this .mat-button-toggle-group-appearance-standard )

			.mat-button-toggle	( with this .mat-button-toggle-appearance-standard ) - stroke
				.mat-button-toggle-button

					.mat-button-toggle-label-content


	Group button - ON

		.mat-button-toggle-group 	( with this .mat-button-toggle-group-appearance-standard )

			.mat-button-toggle	( with this .mat-button-toggle-appearance-standard.mat-button-toggle-checked ) <-- difference here - stroke
				.mat-button-toggle-button

					.mat-button-toggle-label-content
*/

/* 
# Group button */

	/* 
	## OFF */

		.mat-button-toggle-group {
			border-width: 0;
			border-radius: 0;
		}

			
			.mat-button-toggle-group.mat-button-toggle-group-appearance-standard mat-button-toggle.mat-button-toggle {
				border-style: solid;
				border-width: 1px;
				border-color: var(--sft-transparent-black-0020);

				border-right-color: transparent;
			}

			.mat-button-toggle-group.mat-button-toggle-group-appearance-standard mat-button-toggle:last-child {
				border-right-color: var(--sft-transparent-black-0020);
				
				border-top-right-radius: .25rem;
				border-bottom-right-radius: .25rem;
			}

			mat-button-toggle:first-child {
				border-top-left-radius: .25rem;
				border-bottom-left-radius: .25rem;
			}

	/* 
	## ON */
		.mat-button-toggle-group.mat-button-toggle-group-appearance-standard mat-button-toggle.mat-button-toggle-checked {
			border-style: solid;
			border-width: 1px;
			border-color: var(--sft-transparent-black-0040);

			background-color: var(--sft-transparent-black-0005);
		}

		.mat-button-toggle-group.mat-button-toggle-group-appearance-standard mat-button-toggle.mat-button-toggle-checked + .mat-button-toggle,
		.mat-button-toggle-group.mat-button-toggle-group-appearance-standard mat-button-toggle.mat-button-toggle-checked + .mat-button-toggle-checked {
			border-left-color: transparent;
		}


/* 
# Standalone button */

	/* 
	## OFF */
		mat-button-toggle.mat-button-toggle.mat-button-toggle-standalone {
			border-style: solid;
			border-width: 1px;
			border-color: var(--sft-transparent-black-0020);
		}

	/* 
	## ON */
	/* Note: If needed, this class could also be added for further specificity: .mat-button-toggle-appearance-standard */
		mat-button-toggle.mat-button-toggle.mat-button-toggle-checked.mat-button-toggle-standalone {
			border-style: solid;
			border-width: 1px;
			border-color: var(--sft-transparent-black-0040);

			background-color: var(--sft-transparent-black-0005);
		}