/**
 * WooCommerce Variation Swatches
 */

/**
 * Imports
 */
@import 'bourbon';
@import '../../../../assets/sass/utils/variables';
@import '../../../../assets/sass/utils/mixins';
@import '../../../../assets/sass/vendors/modular-scale';

.variations-table {
	margin: 0;

	th,
	td {
		display: block;
		padding: 0;
		background-color: transparent;
	}

	td.label {
		margin-bottom: 1em;
	}

	.swatch-wrapper {
		padding: ms(-2);
		border: 0;
		background-color: transparent;
		border: 1px solid rgba(#000,.1);
		float: left;
		display: inline-block;
		margin: 0 .327em 1em 0;

		img {
			opacity: .5;
		}

		.swatch-anchor {
			&:focus {
				outline: none;
			}
		}

		&.selected,
		&:hover {
			padding: ms(-2);
			background-color: #fff;

			img {
				opacity: 1;
			}
		}

		&.selected {
			border-width: 1px;
			border-color: rgba(#000,.1);
		}
	}
}

a#variations_clear {
	display: block;
	margin: 1em 0 ms(3);
}