

/* Basic Settings, Fieldsets, Form-Rows
------------------------------------------------------------------------------------------------------ */

form {
    margin: 0; padding: 0;
}

fieldset {
    margin: 0; padding: 0;
}
fieldset > div:last-child {
    border-bottom: none !important;
    -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; border-bottom-right-radius: 5px;
}

.form-row {
    padding: 8px 15px;
    line-height: 18px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #e0e0e0;
}

.form-row:before,
.form-row:after {
    content: " ";
    display: table;
}

.form-row:after {
    clear: both;
}

.form-row:first-child {
    border-top: none;
    -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; border-top-left-radius: 5px;
    -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-top-right-radius: 5px;
}
.inline-related .form-row {
    padding: 5px 11px;
}
.form-row.last,
.form-row:last-child {
    border-bottom: none !important;
}

.inline-related .module h4 + .form-row {
    padding: 5px 9px;
}
.inline-related .module.collapse-open .form-row {
    margin: -1px 1px 1px;
    border: 1px solid #d4d4d4;
    background: #eee;
}
.inline-related .module.collapse-open h4 + .form-row {
    border-top-color: #fff;
}
.inline-related .module.collapse-open .form-row:last-child {
    border-bottom: 1px solid #d4d4d4 !important;
}

.hidden {
    display: none;
}


/* Labels & Other Typographic Elements in Forms
------------------------------------------------------------------------------------------------------ */

label {
    margin: 5px 0 -5px;
    width: 150px;
    color: #444; font-size: 11px; line-height: 14px;
    cursor: pointer;
}
.required label, label.required,
.form-row .required label, .form-row label.required {
    font-weight: bold;
}
fieldset.collapse-open label {
    width: 120px;
}


/*  Aligned Fieldsets ................................................... */

.aligned label {
    display: block; float: left;
    padding: 0 10px 6px 0;
    width: 120px;
}
.aligned .vCheckboxLabel {
    display: inline; float: none; clear: both;
    margin: 0 0 0 10px; padding: 0;
}

form .aligned p, form .aligned ul {
    margin-left: 0; padding-left: 0;
}
form .aligned table p {
    margin-left: 0; padding-left: 0;
}
form .aligned .help {
    margin: 2px 0 0 131px; padding: 0;
}
form .aligned input + label + .help {
    margin: 0 0 0 154px; padding: 0;
}
td .help {
    margin-bottom: 3px; padding: 0;
}
fieldset .fieldBox {
    float: left;
    margin-right: 45px;
    white-space: nowrap;
}


/* Filebrowser - Upload ................................................... */

.form-row label + input[type=file] + p.help {
    margin: 5px 0 0 130px; padding: 0;
}
.form-row label + p {
    position: relative; float: none; left: 0;
    margin: 6px 0; padding: 0;
}
.form-row label + p + label {
    display: none;
}
.form-row label + p + label + p {
    position: relative; float: none; left: 131px;
}
.form-row label + p.help {
    margin: 7px 0 5px;
}
.checkbox-row p.help {
    margin-left: 0; padding-left: 0;
}



/* Form Fields
------------------------------------------------------------------------------------------------------ */

input, textarea, select, button {
    margin: 0;
    vertical-align: middle;
    color: #666; font-family: Arial, sans-serif; font-size: 12px; font-weight: bold;
    border: 1px solid #bbb;
    border-color: #ccc #ddd #ddd #ccc;
    -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
    outline: none;
}
input:focus, textarea:focus, select:focus {
    border-color: #999 #bbb #bbb #999;
}

textarea[readonly],
input[readonly] {
    background: #ddd;
    color: #888;
}

/*  Text inputs ................................................... */

input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="number"] {
    padding: 5px 3px 4px;
    height: 14px;
}

/*  URL .................................................... */

#content p.url {
    display: inline-block;
    line-height: 2.4em;
    margin: 0 0 10px;
}


/*  File ................................................... */

input[type=file] {
    height: auto;
    border: none;
}
.inline-tabular input[type=file] {
    position: relative; top: 2px;
    margin-bottom: -2px;
}


/*  Date & Time ................................................... */

.vDateField, .vTimeField {
    margin-left: 0;
}
p.datetime input.vTimeField {
    margin-left: 13px;
}


/*  Textarea ................................................... */

textarea {
    vertical-align: top;
    padding: 3px;
}
fieldset.monospace textarea {
    font-family: "Bitstream Vera Sans Mono",Monaco,"Courier New",Courier,monospace;
}


/*  Select ................................................... */

select {
    padding: 4px 3px 4px 0;
    height: 25px;
}
select[multiple] {
    padding-left: 1px;
    height: 160px;
}
option {
    padding-right: 30px;
    border-bottom: 1px dotted #ddd;
}
option:last-child {
    border-bottom: none;
}


/*  Checkbox, Radio ................................................... */

input[type=checkbox], input[type=radio] {
    position: relative;
    margin: 0 0 0 130px;
    vertical-align: top;
}
input[type=checkbox] {
    top: 2px;
}
table input[type=checkbox], table input[type=radio] {
    margin-left: 0;
}
.inline-group.inline-tabular input[type=checkbox], .inline-group.inline-tabular input[type=radio] {
    margin: 4px 0 -4px;
}
.form-row label + input + p.help input[type=checkbox] {
    position: relative; top: -2px; margin: 0 3px 0 0;
}


/*  Radiolists & Checkboxlists ................................................... */

#content .form-row div.radiolist,
#content .form-row ul.radiolist {
    position: relative;
    display: inline-flex;
    float: none;
    margin: 4px 0 5px;
    padding: 0;
    line-height: 14px;
    font-weight: normal;
}
.result-list-container td li {
    float: left;
    white-space: nowrap;
    padding-right: 10px;
    font-weight: normal;
}
.form-row .radiolist label {
    float: none;
    display: inline;
    padding-right: 15px;
    font-weight: normal;
}
.form-row input.radiolist {
    position: relative;
    margin: 0 2px 0 0;
    vertical-align: top;
}
.inline-group ul.inline li {
    display: inline-block; float: none;
}


/*  Autocomplete Fields ................................................... */

.vAutocompleteSearchField,
.vM2MAutocompleteSearchField {
    background: #eaf5f8;
}

input.vAutocompleteRawIdAdminField,
input.vM2MAutocompleteRawIdAdminField {
    /*margin: 0 !important; padding: 0;
    width: 0 !important; height: 0;
    border: none;
    outline: none;
    background: transparent;*/
}


/*  Changelist Form Fields ................................................... */

.change-list form table input[type=text],
.change-list form table input[type=password],
.change-list form table input[type=file],
.change-list form table select,
.change-list form table textarea {
    position: relative;
    top: -5px;
    margin-bottom: -9px;
    vertical-align: top;
}

.change-list form table input[type=radio],
.change-list form table input[type=checkbox] {
    position: relative; top: 1px;
}
.change-list form table thead input[type=radio],
.change-list form table thead input[type=checkbox] {
    top: 0;
}



/* Form Fields Widths & Heights
------------------------------------------------------------------------------------------------------ */

input[type=text], input[type=password],
input.vDateField, input.vTimeField,
.change-list form table .vAutocompleteSearchField,
.change-list form table .vM2MAutocompleteSearchField,
.inline-tabular .vAutocompleteSearchField,
.inline-tabular .vM2MAutocompleteSearchField {
    width: 100px;
}
select {
    min-width: 108px;
}

input.vTextField, input.vURLField, input.vFileBrowseField, textarea,
.vLargeTextField, .vXMLLargeTextField,
.change-form .vAutocompleteSearchField,
.change-form .vM2MAutocompleteSearchField {
    width: 692px;
}

input.vForeignKeyRawIdAdminField, input.vIntegerField, input.vPositiveSmallIntegerField,
input.vManyToManyRawIdAdminField,
.inline-tabular input[type=text], .inline-tabular textarea {
    width: 100px;
}

.inline-tabular input.vTextField,
.inline-tabular input.vURLField,
.inline-tabular textarea.vLargeTextField,
.inline-tabular input.vFileBrowseField {
    width: 230px;
}
.inline-tabular textarea.vLargeTextField {
    height: 100px;
}
.inline-tabular .form-cell>select,
.change-list form table select {
    max-width: 230px;
}



/* Autocomplete Results
------------------------------------------------------------------------------------------------------ */

.ac_results ul {
    margin-top: -1px; padding: 0;
    width: 214px !important;
    border: 1px solid #999;
    border-color: #999 #bbb #bbb #999;
    -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
    background: #fff;
    -moz-box-shadow: 0 1px 5px #999; -webkit-box-shadow: 0 0 5px #999; box-shadow: 0 1px 5px #999;
    overflow: auto !important;
}
.ac_results ul li {
    padding: 3px 3px 2px;
    color: #888; font-weight: bold;
    border-bottom: 1px solid #e8e8e8;
    cursor: pointer;
}
.ac_results ul li:first-child {
    -moz-border-radius-topleft: 2px; -webkit-border-top-left-radius: 2px; border-top-left-radius: 2px;
    -moz-border-radius-topright: 2px; -webkit-border-top-right-radius: 2px; border-top-right-radius: 2px;
}
.ac_results ul li:last-child {
    border-bottom: none;
    -moz-border-radius-bottomleft: 2px; -webkit-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px;
    -moz-border-radius-bottomright: 2px; -webkit-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px;
}
.ac_results ul li:hover {
    color: #666;
    background: #eaf5f8;
}



/* Submit Row
------------------------------------------------------------------------------------------------------ */

.submit-row {
    margin: 20px 0 10px;
}
.change-form .submit-row {
    text-align: right;
}
.submit-row a {
    font-weight: bold;
}
.submit-row:first-child {
    margin-top: 3px;
}
.submit-row input + input {
    margin-left: 2px;
}


/*  Submit, Delete & Cancel Buttons ................................................... */

input[type=submit], input[type=button], button {
    margin-top: 0; margin-bottom: 0; padding: 4px 5px 5px;
    width: auto; height: 25px;
    color: #fff;
    border: none;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
    background: #acd7e5;
    cursor: pointer;
}
/*  Webkit browser hack: apply same horizontal padding as in moz browsers
    Moz Browsers have a default horizontal padding of 3px in input[type=submit] */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    input[type=submit], input[type=button], button {
        padding: 5px 8px 4px;
    }
}

.submit-row p.deletelink-box,
.submit-row p.cancellink-box {
    position: relative; float: left;
    margin-right: 8px;
}
.submit-row a.deletelink,
.submit-row a.cancellink {
    display: block;
    padding: 5px 7px 4px;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
}

input[type=submit].default, input[type=button].default, button.default {
    background: #309bbf;
}
.submit-row a.deletelink:link, .submit-row a.deletelink:visited {
    color: #fff;
    background: #bf3030;
}
.submit-row a.cancellink:link, .submit-row a.cancellink:visited {
    color: #666;
    background: #ddd;
}

input[type=submit]:hover, input[type=submit]:active,
input[type=submit].default:hover, input[type=submit].default:active,
input[type=button]:hover, input[type=button]:active,
button:hover, button:active,
.submit-row a.deletelink:hover, .submit-row a.deletelink:active,
.submit-row a.cancellink:hover, .submit-row a.cancellink:active {
    color: #fff;
    background: #444;
}



/* Changelist
------------------------------------------------------------------------------------------------------ */

#changelist .submit-row {
    text-align: left;
}

#changelist #toolbar form #searchbar {
    width: 144px;
}
#changelist-search input[type=submit] {
    margin-left: 6px;
    background: transparent url('../img/icons/icon-related_lookup.png') 50% 50% no-repeat;
}
#changelist-search input[type=submit]:hover {
    background: transparent url('../img/icons/icon-related_lookup-hover.png') 50% 50% no-repeat;
}



/* Errors & Form Fields in Errors
------------------------------------------------------------------------------------------------------ */

.errornote {
    margin-bottom: 5px; padding: 4px 5px 4px 10px;
    color: #f7f7f7; font-size: 11px; font-weight: bold;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
    background: #bf3030;
}

ul.errorlist {
    margin: -4px 0 4px;
    color: #bf3030; font-size: 11px; line-height: 16px; font-weight: bold;
}
ul.errorlist li {
    padding: 0 5px 0 130px;
}

.form-cell ul.errorlist {
    margin: 3px 0 -3px; padding-left: 0;
}
.form-cell ul.errorlist li {
    padding-left: 0;
}

td ul.errorlist {
    margin: -9px 0 6px;
}
td ul.errorlist li {
    padding-left: 0;
}

.error input, .error select, .errors input, .errors select, .errors textarea {
    border: 1px solid #bf3030;
}
.description {
    padding: 10px 0 9px 15px;
    border-bottom: 1px solid #d4d4d4;
    border-top: 1px solid #fff;
    color: #999; font-size: 11px;
}


/* Dynamic Form Templates
------------------------------------------------------------------------------------------------------ */

.empty-form {
    display: none;
}
.inline-tabular .inline-related.empty-form {
    display: none;
}
.add-row {
    height: 3em;
}
.add-row a {
    position: absolute;
    line-height: 3em;
    font-weight: bold;
    right: 0;
    padding: 0 1em;
}
