@import "../../../css/_mixins.scss";
@import "../../../css/_trx_addons.vars.scss";

@media #{$media_md} {
	/* Switcher Tabs */
	.sc_switcher_tabs_controls {
		margin-bottom: 1.5em;
	}
	.sc_switcher_tab {
		padding: 1.5em;

		& + & {
			margin-left: 1.5em;
		}
	}
}

@media #{$media_sm} {
	/* Swither */
	.sc_switcher_controls_section1 {
		margin-right: 1em;
	}
	.sc_switcher_controls_section2 {
		margin-left: 1em;
	}
	.sc_switcher_controls_toggle {
		width: 4.6em;
	}
	.sc_switcher_controls_toggle:not(.sc_switcher_controls_toggle_on) .sc_switcher_controls_toggle_button {
		@include translateX(2em);
	}
	
	/* Switcher Tabs */
	.sc_switcher_tabs_controls {
		flex-wrap: wrap;
		margin-left: -2px;
		margin-right: -2px;
	}
	.sc_switcher_tab {
		width: calc( 50% - 4px );
		flex-grow: 1;

		&,
		& + & {
			margin: 2px;
		}
	}
}

@media #{$media_xs} {	
	/* Switcher Tabs */
	.sc_switcher_tabs_controls {
		display: block;
		margin: 0 0 10px;
	}
	.sc_switcher_tab {
		width: 100%;
		& {
			margin: 0;
		}
		& + & {
			margin: 10px 0 0 0;
		}
	}
}