/* --------------------------------------------------------------

   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms

   Usage:
   * For text fields, use class .title or .text

-------------------------------------------------------------- */

label       { font-weight: bold; }
fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
legend      { font-weight: bold; font-size:1.2em; margin:0; }


/* Form fields
-------------------------------------------------------------- */

input.text, input.title,
input, textarea, select {
  margin:0.25em 0;
  border:1px solid #bbb;
}

input.text:focus, input.title:focus,
textarea:focus, select:focus {
  border:1px solid #666;
}

input.text,
input.title   { padding:5px; }
input.title   { font-size:1.5em; }
textarea      { height: 250px; padding:5px; }


fieldset#preferences input.input_string, fieldset#preferences textarea {
  border: 1px solid #BBB;
  padding: 5px;
  font-size: 1.5em;
  width: 98%;
}

fieldset#preferences textarea { height: 100px; }

.required { color:#f00; font-weight:bold; font-size:1.2em;}
.fullwidth { width:98% }

/* container that holds a field that's got a master label then labels under each sub field e.g. Name might have firstname, lastname */
.sub-field { margin:0; padding:0; margin:0 0 0.25em 0 }
.sub-field label, label.sub { font-weight:normal; color:#333; }
.sub-field input { margin-bottom:0 }


.date-range-filter {width:220px;}
  .date-range-filter input {width:70px;}

/* Multi-column form layout
-------------------------------------------------------------- */
div.split {
  background-color:#eee;
}
form div.left
{
  display:inline;
  float:left;
  width:48%;
}

form div.right
{
  display:inline;
  float:right;
  width:48%;
}
form p {
  clear:both;
}
form div.left.w70 {
  width:68%;
}
form div.right.w30 {
  width:28%;
}


/* Flashes and error messages
-------------------------------------------------------------- */

.flash {
  font-size:130%;font-weight:bold;
  padding: .4em 0 .4em 38px; margin-bottom: 1em;
  border:1px solid #c00;
  border-left:none;border-right:none;
}
.flash.error {
  background: #FDE4E4 url(<%= asset_path 'admin/icons/exclamation.png' %>) 10px center no-repeat;
  color:#c00; border-color:#c00;
}
.flash.notice {
  background: #E7F8D7 url(<%= asset_path 'admin/icons/tick.png' %>) 10px center no-repeat;
  color:#59A151; border-color: #59A151;
}

.withError {
  background-color:#FDE4E4;
  background-image:url(<%= asset_path 'admin/bg/red-stripes.png' %>);
}
.formError {
  color:#c00; font-weight:bold;
  display:block;
}


.member-list {
  list-style:none;margin:0;margin-bottom:1em;
}


.form-buttons {
  margin-top: 1em;
  clear: both;
  }
  .form-buttons a {
    text-transform: lowercase; }

.field {
  margin-bottom: 1em;
  clear: both;
  position: relative; }
  .field .formError {
    color: #fff;
    background: #f15700 url(<%= asset_path 'admin/icons/exclamation.png' %>) center left no-repeat;
    padding: 3px 7px;
    display: inline-block;
    margin-bottom: 1em;
    padding-left: 20px; }
  .field.fluid {
    clear: none;
    float: left;
    margin-right: 1em; }
  .field label {
    display: block; }
    .field label span.label {
      display: block; }

fieldset {
  margin-bottom: 1em;
  padding: 1em;
  border: solid 1px #ccc;
  background-color: #fff;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  }
  fieldset h1 {
    font-size: 1.75em; }
  fieldset table.index th:first-child {
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px; }
  fieldset table.index th:last-child {
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px; }