// Black (http://www.colorhexa.com/000000)
$black: #000;
// White (http://www.colorhexa.com/ffffff)
$white: #fff;
// Green (http://www.colorhexa.com/008000)
$green: #008000;
// Red (http://www.colorhexa.com/ff0000)
$red: #f00;
// Orange (http://www.colorhexa.com/ffa500)
$orange: #ffa500;
// Gray (http://www.colorhexa.com/aaaaaa)
$gray: #aaa;

// Very light gray (http://www.colorhexa.com/ededed)
$gray-very-light: #ededed;
// Very light gray 2 (http://www.colorhexa.com/e0e0e0)
$gray-very-light-2: rgba($black, .125);
// Very light gray (mostly white) (http://www.colorhexa.com/f9f9f9)
$gray-very-light-white: #f9f9f9;

// Dark gray (http://www.colorhexa.com/777777)
$gray-dark: #777;
// Very dark gray (http://www.colorhexa.com/333333)
$gray-very-dark: #333;

// Dark red (http://www.colorhexa.com/aa0000)
$dark-red: #a00;

.wpayme-pay-form {
	// Fieldset
	fieldset {
		border: 0;
	}

	// Legend
	legend {
		border-bottom: 1px solid $gray-very-light;

		font-weight: 700;

		margin: 10px 0 15px;
		padding: 0 0 10px;

		width: 100%;
	}

	// Input
	.wpayme-pay-amount-input[type="text"] {
		width: auto;
	}
}

// Required indicator
.wpayme-pay-required-indicator {
	color: $dark-red;
}

// Rows
.wpayme-pay-form-row {
	margin: 0 0 15px;

	input,
	textarea,
	select {
		border-radius: 0;

		outline: none;

		width: 100%;
	}
}

.wpayme-pay-form-row-wide {
	clear: both;

	margin: 0 0 15px;
}

.wpayme-pay-form-row-first,
.wpayme-pay-form-row-last {
	width: 48.5%;
}

.wpayme-pay-form-row-first {
	float: left;
}

.wpayme-pay-form-row-last {
	float: right;
}

// Error
.wpayme-pay-error {
	background: $gray-very-light-white;

	border-left: 4px solid $dark-red;

	box-shadow: 0 1px 1px $gray-very-light-2;

	clear: both;

	margin: 15px 0;

	padding: 1em 1em 1em 2em;

	position: relative;
}

// Payment method list
.wpayme-pay-payment-method-list {
	list-style: none;

	margin-left: 0;
	padding-left: 0;
}

// Payment method fields
.wpayme-pay-payment-method-list input + label + .wpayme-pay-payment-method-fields {
	display: none;
}

.wpayme-pay-payment-method-list input:checked + label + .wpayme-pay-payment-method-fields {
	display: block;	
}
