/**
 * This file contains unified styles for inputs, text areas, multiple selects
 * and buttons that are shared across the system. It does not contain general
 * label and fieldset definitions that differ in the different areas of Symphony.
 *
 * @since Symphony 2.3
 */


/*--------------------------------------------------------------------------
	Inputs, text areas, selects
--------------------------------------------------------------------------*/

input,
textarea,
select[multiple],
.field-value-readonly {
	box-sizing: border-box;
	width: 100%;
	margin-top: 0.2rem;
	padding: 0.2rem 0.3rem;
	font-family: inherit;
	font-size: 109.09%;
	border: 0.1rem solid rgba(0, 0, 0, 0.25);
}

input,
select[multiple] {
	background-color: white;
}

input {
	height: 2.2rem;
}

input[type=file] {
	height: auto;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}

input:active,
input:focus,
textarea:active,
textarea:focus,
select[multiple]:active,
select[multiple]:focus {
	border-color: rgba(0, 0, 0, 0.4);
	outline: none;
}

select {
	display: block;
	box-sizing: border-box;
	width: 100%;
	margin-top: 0.2rem;
}

select[multiple] {
	width: 100%;
	height: 10rem;
	padding: 0;
	font-size: 1.1rem;
}

select[size] {
	height: auto;
	max-height: 10rem;
}

textarea {
	resize: vertical;
}

input[size] {
	width: auto;
}

input[type='radio'],
input[type='checkbox'] {
	display: inline;
	width: auto;
	height: auto;
	margin-top: 0;
	margin-right: 0.5rem;
	padding: inherit;
	font-size: inherit;
	border: none;
	box-shadow: none;
}

button,
input,
select,
optgroup {
	font-family: 'Lucida Grande', Leelawadee, Tahoma, Verdana, sans-serif;
}

button[disabled] {
	opacity: 0.5;
}

optgroup {
	font-weight: bold;
	font-style: normal;
}

a,
select,
textarea,
option,
fieldset {
	outline: 0;
}

input[type='reset'],
input[type='button'],
input[type='submit'] {
	width: auto;
	font-size: inherit;
}

button::-moz-focus-inner,
input[type='reset']::-moz-focus-inner,
input[type='button']::-moz-focus-inner,
input[type='submit']::-moz-focus-inner,
select::-moz-focus-inner,
input[type='file'] > input[type='button']::-moz-focus-inner {
	border: none;
}

.field-value-readonly {
	display: block;
	min-height: 2.2rem;
	padding-left: 0;
	border: none;
	opacity: 0.5;
}

/* Errors */

.invalid input
.invalid select[multiple],
.invalid textarea {
	border-color: #c31;
}

.invalid input:active,
.invalid input:focus,
.invalid textarea:active,
.invalid textarea:focus {
	border-color: #9d270d;
	box-shadow: 0 0 0.6rem rgba(0, 0, 0, 0.3);
}

/*--------------------------------------------------------------------------
	Buttons
--------------------------------------------------------------------------*/

input[type=submit],
button,
.button,
.apply-button-left,
.apply-button-right,
.apply-label-left,
.apply-label-right {
	display: inline-block;
	min-height: 2rem;
	margin-left: 1rem;
	padding: 0 1rem;
	color: rgba(85, 85, 85, 0.95);
	line-height: 1.85;
	border: 0.1rem solid rgba(0, 0, 0, 0.25);
	border-radius: 0.4rem;
	background-image: linear-gradient(to bottom, #fbfbfa 0%, #e3e3df 100%);
}

input[type=submit]:hover,
input[type=submit]:active,
input[type=submit]:focus,
button:hover,
button:active,
button:focus,
.button:hover,
.button:active,
.button:focus {
	color: #3c3c3c;
	border-color: rgba(0, 0, 0, 0.35);
	background-image: linear-gradient(to bottom, #fbfbfa 0%, #e3e3df 50%);
	cursor: pointer;
}

input[type=submit].selected,
button.selected,
.button.selected {
	color: rgba(0, 0, 0, 0.7);
	border-color: rgba(0, 0, 0, 0.3);
	background: #e3e3df;
	box-shadow: inset 0 0 0.15rem rgba(0, 0, 0, 0.2);
	text-shadow: 0.1rem 0.1rem 0 rgba(255, 255, 255, 0.7);
	cursor: pointer;
}

textarea[disabled=disabled],
textarea[disabled=disabled]:hover,
textarea[disabled=disabled]:active,
textarea[disabled=disabled]:focus,
textarea[readonly=readonly],
textarea[readonly=readonly]:hover,
textarea[readonly=readonly]:active,
textarea[readonly=readonly]:focus,
input[type=submit][disabled=disabled]:hover,
input[type=submit][disabled=disabled]:active,
input[type=submit][disabled=disabled]:focus,
input[readonly=readonly],
input[readonly=readonly]:hover,
input[readonly=readonly]:active,
input[readonly=readonly]:focus,
button[disabled=disabled],
button[disabled=disabled]:hover,
button[disabled=disabled]:active,
button[disabled=disabled]:focus {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Create buttons */

button.create,
.button.create {
	color: #fff;
	border-color: #799747;
	background-image: linear-gradient(to bottom, #b3d47d 0%, #8b3 100%);
}

button.create:hover,
button.create:active,
button.create:focus,
.button.create:hover,
.button.create:active,
.button.create:focus {
	border-color: #6b863f;
	background-image: linear-gradient(to bottom, #b3d47d 0%, #8b3 50%);
}

/* Delete buttons */

button.delete:hover,
button.delete:active,
button.delete:focus,
.button.delete:hover,
.button.delete:active,
.button.delete:focus {
	color: rgba(255, 255, 255, 0.8);
	border-color: #870915;
	background-image: linear-gradient(to bottom, #e90a20 0%, #9e0b19 100%);
}

/* Installer */

.submit input {
	margin-top: 1.5rem;
}

/* "With selected…" menu */

.apply,
.apply.inactive:hover {
	display: block;
	float: right;
	height: 1.85em;
	min-height: 2rem;
	margin: 0;
	padding: 0;
	border: 0.1rem solid rgba(0, 0, 0, 0.25);
	border-radius: 0.4rem;
	background: #fbfbfa;
}

.apply.inactive {
	opacity: 0.5;
}

.apply div {
	float: left;
	overflow: hidden;
	text-align: left;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAwCAYAAADHEYBIAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAORJREFUeNpiYIAAHiDuBmJWEOf///9YMRNUcRUQOwJxJgMeAFLsBcRuUH4cEFvhUsyITRBkJS6TiQYgxb5AfAYJW+FTvBmId0H5i4D4GCEbiAo6RlyeoYoHRxUPacWMjIwMQMwKxBZADOYTMtkQiKWAWIuQM+SAWAbKVwNicfrnQRYglgdiYySxo0D8EpfJD4H4CZR/C5dCZADKexYwZ43mwVHF5OZBEC3DCAEETZYEYl4gFiXkDH4g5oPyhaFVxgDkQX5omQEDj4H4Cy6TPwLxJyj/LS6FMJNB4DnU/a/xOQMgwACLFl2Yo1jbdgAAAABJRU5ErkJggg==);
	background-repeat: no-repeat;
	background-position: right -1.4rem;
}

.apply:hover div {
	background-position: right 0.6rem;
}

.apply.inactive div {
	background: right -3.4rem;
}

.apply select {
	display: inline-block;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	appearance: none;
	width: 110% !important;
	min-width: 17rem;
	margin: 0.2rem 0 0 0;
	padding: 0 0 0 0.7rem;
	color: rgb(60, 60, 60);
	line-height: 1.5;
	border: none;
	border-radius: 0.5rem;
	-webkit-appearance: none;
	background: transparent;
	outline: none;
	cursor: pointer;
}

.apply.inactive select {
	cursor: default;
}

.apply select:hover {
	background-position: right -1.6rem;
}

.apply button,
.apply-button-right,
.apply-button-left,
.apply-label-right,
.apply-label-left {
	float: right;
	height: 1.85rem;
	margin: 0;
	line-height: 1.85;
	border: none;
	border-right: none;
	border-left: 0.1rem solid rgba(0, 0, 0, 0.15);
	border-radius: 0 0.4rem 0.4rem 0;
}

.apply-button-left,
.apply-label-left {
	float: left;
	border-right: 0.1rem solid rgba(0, 0, 0, 0.15);
	border-left: none;
	border-radius: 0.4rem 0 0 0.4rem;
}

.apply.inactive button,
.apply.inactive button:hover {
	color: rgba(60, 60, 60, 0.8);
	border-left: 0.1rem solid rgba(0, 0, 0, 0.15);
	box-shadow: none;
	cursor: default;
}

.apply:hover button {
	border-left: 0.1rem solid rgba(0, 0, 0, 0.25);
}

/* Single select "With selected…" */

.apply.single {
	border: none;
}

.apply.single select {
	display: none;
}

.apply.single button {
	height: auto;
	white-space: nowrap;
	border: 0.1rem solid rgba(0, 0, 0, 0.25);
	border-bottom-color: rgba(0, 0, 0, 0.3);
	border-radius: 0.4rem;
}

.apply.single button:before {
	display: none;
}

/* Inline buttons, aligned left */

fieldset input[type=submit],
fieldset button,
fieldset .button {
	margin-right: 1rem;
	margin-left: 0;
}
