/* container */
.hu_form1_group_head, .hu_form1_tabs_head, .hu_form1_table_head {
	text-align: left;
	vertical-align: baseline;
	padding: 1.2ex 0 1.2ex 0;
}
.hu_form1_head_top { font-weight: bold; }
td.hu_form1_head_top a.overlay { font-weight: bold; }

/* toplevel containers get this additional class */
.hu_form1_margin_top { margin-top: 2ex; }


/* groups */
.hu_form1_group {
	border: 0px solid olive;
	border-spacing: 0px 0px; /* hor vert */
	border-collapse: collapse; /* old ie! */
	empty-cells: show;         /* old ie! */
	width: 100%;
}
.hu_form1_float_group {
	display: flex;
	flex-wrap: wrap;
}
.hu_form1_group_items{
	margin: 0 5px;
	align-items: flex-start;
	white-space: nowrap;
	display: flex;
}
.hu_form1_float_group_c0_d0 { /* input labels */
	padding: 1.2ex 1em 1.2ex 0;
}
.hu_form1_float_group_c1_d0 { /* input fields */
	display: flex;
	align-items: first baseline;
}

/* note: height of layout table row is determined by max height
   of any cell in this row. Col1 contains input widget
   of unknown (and varying) height therefore do NOT provide
   padding in c1 and determine height by padding in c0, which
   contains label text only. */

/* to increase "density" of form change top and bottom padding
   in XX_group_XX and XX_text_XX styles from 1.2ex */

/* A DIV of class form1_box is wrapped around checkboxes and radios
   to give the containing TDs a minimum height. less than the usual
   1.2 1.2 but it will look better especially in table/itemlist layout */
.hu_form1_ybox {
	white-space: nowrap;
	margin: 1.1ex 0 0.6ex 0;
	vertical-align: baseline;
	display: inline-block;
	display: -moz-inline-stack;  /* very old FF */
	width: 1px;
	overflow: visible;
}

.hu_form1_box_radio {
	margin: 5px 0 1ex -2px;
}

/* top level form group name column (depth 0 column 0) */
.hu_form1_group_c0_d0 {
	/*white-space: nowrap; FIXME: issue w/ multiline text. does this has sideeffects? */
	vertical-align: baseline;
	padding: 1.2ex 1em 1.2ex 0;
	width: 23%;
}

/* top level form group input control column (depth 0 column 1) */
.hu_form1_group_c1_d0 {
	white-space: nowrap;
	vertical-align: baseline;
	padding: 0;
	width: 77%;
}

/* minmal width in case of centered design */
center .hu_form1_group, center .hu_form1_group_c0_d0, center .hu_form1_group_c1_d0 { width: auto; }


/* top level form group tools column ("depth0 column2") */
.hu_form1_group_c2_d0 {
	white-space: nowrap;
	vertical-align: baseline;
	padding: 1.2ex 0 0 1em;
	text-align: right;
}

/* nested form group name column ("depth1 column0") */
.hu_form1_group_c0_d1 {
	white-space: nowrap;
	vertical-align: baseline;
	padding: 1.2ex 1em 1.2ex 0;
	width: 23%;
}

/* nested form group input control column ("depth1 column1") */
.hu_form1_group_c1_d1 {
	white-space: nowrap;
	vertical-align: baseline;
	padding: 0;
	width: 77%;
}

/* nested form group tools column ("depth1 column2") */
.hu_form1_group_c2_d1 {
	white-space: nowrap;
	vertical-align: baseline;
	padding: 5px 0 0 0.8em;
	text-align: right;
}

/* for embedded containers w/o left label ("invisibly embedded") */
.hu_form1_group_cX {
	padding: 0;
	margin: 0;
	width: 0%;
}

/* filler column */
.hu_form1_group_fillx {
	width: 100%;
}

/* to override baseline alignment (for multi-select)
.hu_form1_topalign {}
*/

/* text */
/* cX = text spanning both columns */
/* _text_cX_dY styles are emitted for rows containing text instead of _group_cX_dY styles */

.hu_form1_text_cX_d0 {
	width: 40em;
	vertical-align: baseline;
	padding: 1.2ex 0 1.2ex 0;
}

.hu_form1_text_c0_d0 {
	vertical-align: baseline;
	padding: 1.2ex 1em 1.2ex 0;
}

.hu_form1_text_c1_d0 {
	width: 35em;
	vertical-align: baseline;
	padding: 0 0 0 0;
}

.hu_form1_text_c2_d0 {
	white-space: nowrap;
	vertical-align: baseline;
	padding: 1.2ex 0 0 1em;
	text-align: right;
}


.hu_form1_text_cX_d1 {
	width: 35em;
	vertical-align: baseline;
	padding: 1.2ex 0 1.2ex 0;
}

.hu_form1_text_c0_d1 {
	vertical-align: baseline;
	padding: 1.2ex 1em 1.2ex 0;
}

.hu_form1_text_c1_d1 {
	width: 30em;
	vertical-align: baseline;
	padding: 1.2ex 0 1.2ex 0;
}

.hu_form1_text_c2_d1 {
	white-space: nowrap;
	vertical-align: baseline;
	padding: 5px 0 0 0.8em;
	text-align: right;
}

/* filler style added to main column text style */
.hu_form1_text_fillx {
	width: 100%;

}

/* inputs */
.hu_form1_idrd  { /* will use system widget for dropdown */
	color: var(--input);
	background-color: var(--input-bg);
	border: none;
	border-bottom: 1px solid var(--gray-2);
	padding: 2px 3px;
	font-family: inherit;
	font-size: 100%;
}

.hu_form1_irad  { position: relative; }
.hu_form1_table_td .hu_form1_irad { bottom: -2px; }
.hu_form1_table_td .hu_form1_irad_ie { bottom: -1px; }

.hu_form1_istr {
	color: var(--input);
	background-color: var(--input-bg);
	margin-top: 0.42em; /* effective for textarea only */
	border-style: none none solid none;
	border-bottom: 1px solid var(--gray-2);
	padding: 2px 3px;
	vertical-align: baseline; /* changed from bottom*/
	font-size: 100%;
}

.hu_form1_istr:focus, .hu_form1_idrd:focus, .hu_itxt:focus, .hu_idrd:focus, .hu_form1_ro:focus {
	outline: none;
	border-bottom: 2px solid var(--secondary-1) !important;
	transition: border-width 0s, border-color 1.5s;
}

.hu_form1_istr:read-only { /* FIXME: consider to define general ready-only pseudo style *:read-only */
	color: var(--input-ro);
	background-color: inherit;
	border-color: var(--input-ro-b);
	border-bottom: 1px dotted var(--input-ro-b);
	margin-right: 2px;
}
.hu-textarea-grow {
	font-size: 70%; margin-left: -0.4rem; margin-bottom: 0.33rem; vertical-align: bottom; color: lightgray;
}
.hu_form1_istr_ie {
	position: relative;
	top: 1px;
}

.hu_form1_dtfmt {
	color: #b4b4b4;
}

.hu_form1_ibtn {
	color: var(--button);
	background-color: var(--button-bg);
	border: none;
	border-radius: 5px;
	padding: 0.2em 0.6em;
	font-weight: bold;
	font-size: 110%;
}

.hu_form1_ibtn:hover {
	color: var(--button-hov);
	border-color: var(--button-hov-b);
	background-color: var(--button-hov-bg);
	box-shadow: 2px 2px 8px 3px var(--gray-5);
	cursor: pointer;
}
.hu_form1_ibtn[disabled="disabled"], .hu_form1_ibtn[locked="locked"], .hu_form1_ibtn[disabled=""] {
	color: var(--button-dis);
	background-color: var(--button-dis-bg);
	border: 1px solid var(--button-dis);
}
.hu_form1_ibtn[disabled="disabled"]:hover, .hu_form1_ibtn[locked="locked"]:hover, .hu_form1_ibtn[disabled=""]:hover {
	background-color: var(--button-dis-bg);
}
.hu_form1_ibtn.fas { padding: 0.385em 0.4em; }
.hu_form1_txticon { vertical-align: middle; }
.hu_form1_link { }

/* readonly elements, must be declared AFTER hu_form1_istr!!  */
.hu_form1_ro {
	color: var(--input-ro);
	border: 0px solid var(--ws_border_ro);
	background-color: var(--ws_bkgrnd_ro);
	padding: 2px 3px;
	font-size: 100%;
}
.hu_form1_rotxt { color: var(--input-ro); }
.hu_form1_rotxt table { color: var(--input-ro); }

/* data control style to modify read only fields */
.hu_form1_ro_mdfy {
	border: 1px solid var(--input-ro-mdfy-b);
	background-color: var(--input-ro-mdfy-bg);
	color: var(--input-ro);;
}
.hu_form1_rotxt_mdfy {
	background-color: var(--input-ro-mdfy-bg);
	color: var(--input-ro);
}

@media print {
	.hu_form1_ro { border: initial; background-color: initial; color: black; }
	.hu_form1_rotxt { color: black; }
	.hu_form1_rotxt table { color: black; }
	.hu_form1_ro_mdfy, .hu_form1_rotxt_mdfy { }
}

/* tabs */
.hu_form1_tabs { }
.hu_form1_tabs_inner { border: 1px solid gray; padding: 0.5ex 0 1px 0.6em; }

.hu_form1_tabs_tab {
	color: var(--tab);
	background-color: var(--tab-bg);
	border: 1px solid var(--tab);
	float: left;
	list-style: none;
	padding: 2px 0.6em 3px 0.6em;
	margin: 0 0.4em 0 0;
	position: relative;
	top: 1px;
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	/*-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;*/
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}
.hu_form1_tabs_tab:hover { background-color: var(--tab-hov-bg); cursor: pointer; }
.hu_form1_tabs_sel { background-color: white; border: 1px solid var(--tab-sel); border-bottom: 1px solid white; color: var(--tab-sel); }
.hu_form1_tabs_sel:hover { background-color: white; cursor: default; }

/* table */
.hu_form1_table {
	vertical-align: baseline;
	border-spacing: 0px;
}

.hu_form1_table_td { white-space: nowrap; vertical-align: baseline; padding: 2px 1.0em 2px 0; }
.hu_form1_table_td_noinput { color: var(--input-ro); white-space: nowrap; vertical-align: baseline; padding: 10px 1.0em 2px 0; }
.hu_form1_table_td_row0 { border-bottom: 1px solid var(--table-h-b); padding: 1.0ex 1.0em 0.6ex 2px; }
.hu_form1_table_td_col0 {
	vertical-align: baseline;
	padding: 2px 1.0em 2px 0;
}
.hu_form1_table_td_null { margin: 0; padding: 0; }
.hu_form1_trcol { background-color: var(--table-row2-bg); }

/* itemlist */
.hu_form1_table_td_arr { vertical-align: top; padding: 1.2ex 0.4em 0.8ex 0.4em; }

/* form */
.hu_form1_sdiv { /* DIV around submit button */
	margin-top: 2.5ex;
	margin-bottom: 1.5ex;
}

@media print { .hu_form1_sdiv { display: none; } }

.hu_form1_tdiv { /* div around tools */
	white-space: nowrap;
	margin-top: 0;
	margin-bottom: 0;
}

/* decorative border */
.hu_form1_border { border: 1px dashed var(--form-dev-b); }
.hu_form1_border_head { font-size: 85%; }
.hu_form1_border_main {}
.hu_form1_border_tools {}

/* moveable window */
.hu_form1_window {
        border: 1px solid #6b88ad;
        background-color: white;
        margin: 0;
	padding: 0;
	position: absolute;
	z-index: 0;
	visibility: hidden;
}
.hu_form1_window_head {
        background-color: var(--window-h-bg);
	color: white;
	padding: 2px 0.6ex 3px 0.6ex;
	font-weight: bold;
	cursor: default;
}
.hu_form1_window_main { padding: 0 0.6ex; }
.hu_form1_window_tools { padding: 0 0.6ex; }
.hu_form1_unselectable {
	-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
