/* ========================================================================
   Component: api_form
 ========================================================================== */
.api_form .api_required{ color: #f00; font: normal 18px/1 Tahoma, Arial, sans-serif; margin-left: 1px }
.api_form .api_error{ display: none; font-size: 12px; margin: 0 0 15px; text-align: center; background: #fef4f6; color: #f0506e; padding: 10px; }

.api_form input[type="text"],
.api_form input[type="password"],
.api_form textarea,
.api_form select{
	outline: none; width: 100%; max-width: 100%; padding: 4px 10px; font-family: inherit; font-size: inherit; border: 1px solid #D9D9D9; background: #FFF;
	-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .07); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .07); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .07);
}

.api_form input[type="radio"],
.api_form input[type="checkbox"]{ margin: 0; padding: 0; vertical-align: middle; cursor: pointer }
.api_form input[type="text"],
.api_form input[type="password"]{ height: 36px; line-height: 36px; }
.api_form textarea{ min-height: 60px; transition: none; overflow: hidden; display: block; resize: none; }

.api_form input[type]:focus,
.api_form textarea:focus{
	background: #FFF;
	color: rgba(0, 0, 0, .85);
	border-color: #666 #aaa #aaa;
	-webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, .1); -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, .1); box-shadow: inset 0 1px 5px rgba(0, 0, 0, .1);
}

.api_form input[type][readonly],
.api_form textarea[readonly],
.api_form select[readonly]{ background-color: #fafafa; color: #999; border: 1px solid #ddd; text-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }

.api_form .api_row{ position: relative }
.api_form .api_row_header{background: #fafbfc;padding: 15px;color: #222;border-top: 1px solid #e7e8ec;border-bottom: 1px solid #e7e8ec;white-space: nowrap;margin: 25px 0;font-size: 20px;font-style: oblique;}
.api_form .api_row + .api_row{ margin-top: 15px; }
.api_form .api_rows + .api_rows{ margin-top: 15px; }
.api_form .api_label{ font-weight: bold; margin-bottom: 5px }
.api_form .api_label_inline{ display: inline-block }
.api_form .api_label_block{ display: block }
.api_form .api_label_block + .api_label_block{ margin-top: 5px }
.api_form .api_controls{ position: relative }
.api_form .api_controls label{ cursor: pointer }
.api_form .api_controls .api_control + .api_control{ margin-top: 8px }
.api_form .api_field{ -webkit-transition: background-color .3s ease-out, box-shadow .2s ease, border-color .2s ease; -moz-transition: background-color .3s ease-out, box-shadow .2s ease, border-color .2s ease; -ms-transition: background-color .3s ease-out, box-shadow .2s ease, border-color .2s ease; -o-transition: background-color .3s ease-out, box-shadow .2s ease, border-color .2s ease; transition: background-color .3s ease-out, box-shadow .2s ease, border-color .2s ease; }
.api_form .api_field_error{ border: 1px solid #d95c5c !important; background: #fffafa !important;}
.api_form .api_buttons{ margin-top: 30px !important; }

/* form size */
.api_form_small{font-size: 14px}
.api_form_small input[type="text"],
.api_form_small input[type="password"]{ height: 32px; line-height: 32px; }
.api_form_small .api_row +.api_row{margin-top: 10px}

.api_form_horizontal{}
.api_form_horizontal .api_row{display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.api_form_horizontal .api_label{-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;}
.api_form_horizontal .api_controls{-ms-flex: 0 0 83.333333%;flex: 0 0 83.333333%;	max-width: 83.333333%;}

/* ========================================================================
   Component: api_checkbox
 ========================================================================== */
.api_checkbox{ position: relative; cursor: pointer; margin: 0; padding: 0 0 0 28px; min-height: 25px; }
.api_checkbox input{ cursor: pointer; position: absolute; top: -1px; left: -1px; opacity: 0 !important; outline: 0; z-index: 3; width: 25px; height: 25px; margin: 0 !important; padding: 0 !important; }
.api_checkbox:before{ content: ''; display: block; position: absolute; left: -1px; top: -1px; background: url("images/form/checkbox.png") no-repeat 0 0; width: 25px; height: 25px; }
.api_checkbox.api_active:before{ content: ''; display: block; position: absolute; left: -1px; top: -1px; background: url("images/form/checkbox.png") no-repeat 0 -25px; width: 25px; height: 25px; }
.api_checkbox.api_active{ color: #3b79d2 }

/* ========================================================================
   Component: api_radio
 ========================================================================== */
.api_radio{ position: relative; cursor: pointer; margin: 0; padding: 0 0 0 28px; min-height: 25px; }
.api_radio input{ cursor: pointer; position: absolute; top: -1px; left: -1px; opacity: 0 !important; outline: 0; z-index: 3; width: 25px; height: 25px; margin: 0 !important; padding: 0 !important; }
.api_radio:before{ content: ''; display: block; position: absolute; left: -1px; top: -1px; background: url("images/form/radio.png") no-repeat 0 0; width: 25px; height: 25px; }
.api_radio.api_active:before{ content: ''; display: block; position: absolute; left: -1px; top: -1px; background: url("images/form/radio.png") no-repeat 0 -25px; width: 25px; height: 25px; }
.api_radio.api_active{ color: #3b79d2 }

/* ========================================================================
   Component: api_spinner
 ========================================================================== */
.api_spinner{
	/*cursor: wait !important;*/
	/*position: absolute;*/
	/*left: 0;*/
	/*top:0;*/
	/*right: 0;*/
	/*bottom:0;*/
	/*z-index: 2000;*/
	/*background: url("/bitrix/css/api.core/images/button/busy.gif") no-repeat 50% 50% rgba(255,255,255,.5);*/
}