/*********************************************************************************************\
*       COPYRIGHT © 2018 ENVISION INFORMATION TECHNOLOGIES, LLC.    ALL RIGHTS RESERVED       *
*       DISTRIBUTION, UNAUTHORIZED USE AND MODIFICATION IS STRICTLY PROHIBITED                *
*       ENVISION IT, MADISON, WI    http://www.envisionitllc.com   info@envisionitllc.com     *
\*********************************************************************************************/

.eitform_label
{
  display:inline-block;
  width:350px;
  text-align:right;
  vertical-align:top;
  padding:8px 10px 0 0;
  margin:0;
}

.eitform_field
{
  margin:5px 0;
  padding:0;
}

.eitform_checkbox_field
{
  margin-left:210px;
}

.eitform_field INPUT.eitform_required_missing, .eitform_field SELECT.eitform_required_missing
{
  border-color: red !important;
}

.eitform_field input[type=text], .eitform_field input[type=tel], .eitform_field input[type=email],
.eitform_field input[type=number], .eitform_field select, .eitform_field textarea
{
  box-sizing:border-box;
  width:400px;
  max-width:100%;
  border:1px solid #ccc;
  border-radius:3px;
  padding-left:4px;
}

.eitform_field input[type=text]:focus, .eitform_field input[type=tel]:focus,
.eitform_field input[type=email]:focus, .eitform_field input[type=number]:focus,
.eitform_field select:focus, .eitform_field textarea:focus
{
  outline:0;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
}

/* Checkbox rows: label text beside the box, wrapping as one block */
.eitform_checkbox_row
{
  display:flex;
  align-items:center;
}

.eitform_checkbox_row .eitform_label
{
  padding-top:0;
}

.eitform_checkbox_row .eitform_checkbox_text
{
  padding-left:12px;
}

/* Centered, bold group headings (Company Type, Medium, Days Attending, etc.) */
.eitform_section_heading
{
  display:inline-block;
  font-weight:bold;
  margin:0;
  padding:8px 10px 0 0;
  text-align:center;
  vertical-align:top;
  width:55%;
}

.eitform_dialog
{
  display:none;
}

.eitform_table
{
  width:100%;
  border:1px solid #000;
  border-radius:5px;
  border-spacing:0;
  margin:5px 0;
  overflow:hidden;
}

.eitform_table thead tr
{
  background-color:#555;
  color:#fff;
}

.eitform_table thead th
{
  border-bottom: 1px solid #000;
  font-weight:bold;
  margin:0;
  padding:4px 0 4px 4px;
  text-align:left;
}

.eitform_table td:first-child
{
  padding-left:5px;
}

.eitform_removeItem
{
  display:none;
}

.eitform_table_new_row_template
{
  display:none;
}

.eitform_table_button
{
  width:20px !important;
  height:20px;
}

.eitDisplayRemainingContainer
{
  background-color: white;
  border: 1px solid #ccc;
  border-top: none;
  border-radius: 0 0 5px 5px;
  font-size: 10px;
  font-style: italic;
  text-align:center;
  color:#000;
  margin-top: 2px;
  box-shadow: 0 2px 4px rgba(82, 168, 236, 0.4);
}

h3
{
  margin-top:0;
}
/* After this, coach specific styles */

input[type=checkbox]
{
  transform: scale(1.5);
}

#show_ring_terms_scroll
{
  height:200px;
  overflow-y:scroll;
  border:1px solid #aaa;
  border-radius:3px;
  padding:5px;
}

/*
  Narrow / mobile layout.  Secondary pages lock the viewport to width=870 (see
  templates/Main_2025/template_header.php), so on a phone this is the width that
  applies -- the 900px breakpoint is what catches it.  Labels stack above their
  field, fields go fluid, and checkboxes lead their row so they are easy to tap.
*/
@media (max-width: 900px)
{
  .eitform_field
  {
    margin:0 0 14px;
  }

  .eitform_field > label
  {
    display:block;
  }

  .eitform_field > label:not(.eitform_checkbox_row) > .eitform_label
  {
    display:block;
    font-weight:600;
    padding:0 0 4px;
    text-align:left;
    width:auto;
  }

  .eitform_field input[type=text], .eitform_field input[type=tel], .eitform_field input[type=email],
  .eitform_field input[type=number], .eitform_field select, .eitform_field textarea
  {
    font-size:16px; /* keeps mobile browsers from zooming in on focus */
    min-height:38px;
    padding:0 8px;
    width:100%;
  }

  .eitform_field textarea
  {
    padding:8px;
  }

  .eitform_field > label.eitform_checkbox_row
  {
    display:flex;
  }

  .eitform_checkbox_row
  {
    align-items:flex-start;
    gap:14px;
    margin:0 0 14px;
    padding:2px 0;
  }

  /* Checkbox first, then its text -- regardless of source order */
  .eitform_checkbox_row input[type=checkbox]
  {
    flex:0 0 auto;
    margin:2px 0 0;
    order:-1;
  }

  .eitform_checkbox_row .eitform_label,
  .eitform_checkbox_row .eitform_checkbox_text
  {
    padding:0;
    text-align:left;
    width:auto;
  }

  .eitform_section_heading
  {
    padding:12px 0 4px;
    text-align:left;
    width:100%;
  }

  #eitform_registration_form button
  {
    font-size:16px;
    padding:12px 20px;
    width:100%;
  }

  /* Tables scroll rather than forcing the page wider than the viewport */
  .eitform_table
  {
    display:block;
    overflow-x:auto;
  }
}