/* odysen/form/Common.css */

/*========================= common css =========================*/

/* 'dijitTextBox' refers to 'dijit(TextBox|DateTextBox|CurrencyTextBox|...)' */

.odysen .dijitTextBoxError .dijitValidationContainer {
	background-color: #d46363;
	background-image: url('/stylesheets/odysen4.0/dijit/themes/odysen/form/images/error.png');
	background-position: top center;
	border: solid #d46464 0px;
	border-left-width: 1px;
	width: 9px;
}
.odysen .dijitTextBoxError .dijitValidationIcon {
	width: 0px;
	background-color: transparent !important; /* so the INPUT doesn't obscure the border in rtl+a11y */
}

/* .dijitInputField .dijitPlaceHolder is explicitly listed below because
   dijitPlaceHolder is absolutely positioned, so padding set on dijitInputField
   won't affect it */
.odysen .dijitTextBox .dijitInputContainer,
.odysen .dijitTextArea,
.odysen .dijitInputField .dijitPlaceHolder {
	padding: 2px;
}

.odysen .dijitTextBox,
.odysen .dijitTextBox .dijitButtonNode {
	/* color for (outer) border on *TextBox widgets, and border between input and buttons on ComboBox and Spinner */
	border-color: #b5bcc7;
	-webkit-transition-property:background-color, border;
 	-webkit-transition-duration:.35s;
}
.odysen .dijitTextBox {
	background-color: #f7fcff;
}

/* hover */
.odysen .dijitTextBoxHover,
.odysen .dijitTextBoxHover .dijitButtonNode {
	border-color: #769dc0;
 	-webkit-transition-duration:.25s;
}
.odysen .dijitTextBoxHover {
	background-color: #e9f4fe;
	background-image: url('/stylesheets/odysen4.0/dijit/themes/odysen/form/images/textBox_back.png');
	background-repeat: repeat-x;
}

/* error state */
.odysen .dijitTextBoxError,
.odysen .dijitTextBoxError .dijitButtonNode {
	border-color: #d46464;
}
.odysen .dijitTextBoxError,
.odysen .dijitTextBoxError .dijitInputContainer {
	background-color: #fdf7f7;
}

/* focused state */
.odysen .dijitTextBoxFocused,
.odysen .dijitTextBoxFocused .dijitButtonNode {
	border-color:#769dc0;
 	-webkit-transition-duration:.1s;
}
.odysen .dijitTextBoxFocused {
	background-color: #fff;
	background-image: url('/stylesheets/odysen4.0/dijit/themes/odysen/form/images/textBox_back.png');
	background-repeat: repeat-x;
}
.odysen .dijitTextBoxFocused .dijitInputContainer {
	background: #fff;
}

.odysen .dijitTextBoxErrorFocused,
.odysen .dijitTextBoxErrorFocused .dijitButtonNode {
	border-color: #ce4f4f;
}

/* disabled state */
.odysen .dijitTextBoxDisabled,
.odysen .dijitTextBoxDisabled .dijitButtonNode {
	border-color: #d3d3d3;
}
.odysen .dijitTextBoxDisabled {
	background-color: #efefef;
	background-image: none;
	color: #818181;
}

/*========================= for special widgets =========================*/

/* ComboBox */

.odysen .dijitComboBox .dijitArrowButtonInner {
	background-image: url("/stylesheets/odysen4.0/dijit/themes/odysen/form/images/commonFormArrows.png");
	background-position:-35px 53%;
	background-repeat: no-repeat;
	margin: 0px;
	width:16px;
	height:100%;
	border: 1px solid #fff;
}

.odysen .dijitTextBox .dijitInputField {
	padding-top: 1px; /* 1px and not 2px due to 1px padding on the INPUT */
	padding-bottom: 1px;
}
.odysen .dijitTextBox .dijitInputInner {
	/* left padding helps line up input text with menu text */
	padding: 1px 2px 1px 0; /* match 1px vertical border on button */
}
.odysen .dijitTextBox .dijitValidationContainer {
	padding: 0 0 2px 0; /* match 1px border height in button */
}

.odysen .dijitComboBox .dijitButtonNode {
	background-color: #ebeef4;
	background-image: url("/stylesheets/odysen4.0/dijit/themes/odysen/form/images/formHighlight.png");
	background-repeat:repeat-x;
}

/* hover state */
.odysen .dijitComboBoxHover .dijitButtonNode {
	background-color:#abd6ff;
}
.odysen .dijitComboBoxHover .dijitArrowButtonInner {
	background-position:-70px 53%;
}

/* focused state */
.odysen .dijitComboBoxFocused .dijitButtonNode {
	background-color:#7dbefa;
	background-position:0px -177px;
	padding: 1px;
}	
.odysen .dijitComboBoxFocused .dijitArrowButtonInner {
	background-position:-70px 53%;
	border: 0px none;
}

/* disabled state */
.odysen div.dijitComboBoxDisabled .dijitArrowButtonInner {
	/* specific selector set to override background-position setting from Button.js
	 * (.odysen .dijitComboBoxDisabled .dijitArrowButtonInner) */
	background-position:0px 50%;
	background-color:#f1f1f1;
}

/*========================= hacks for browsers =========================*/
/* it seems the input[type="hidden"] has a height (16px) too... this may cause the widget's height calcuate error */
.dj_ff3 .odysen .dijitInputField input[type="hidden"] {
	display: none;
	height: 0;
	width: 0;
}

/* ie6 doesn't support transparent background img */
.dj_ie6 .odysen .dijitTextBox,
.dj_ie6 .odysen .dijitComboBox .dijitButtonNode {
	background-image: none;
}


/* In quirks mode strangely all browsers do border-box sizing for input nodes.
 * Drop the 1px white border around ComboBox arrow to fix misalignment of icon, and to jump on focus.
 * Note also that these rules are copying what is done on focus.
 */
.dj_quirks .odysen .dijitComboBox .dijitArrowButtonInner {
	border: 0px;
}
.dj_quirks .odysen .dijitComboBox .dijitArrowButtonContainer {
	padding: 1px;
}