/*
You'll notice this littered with !important declarations - this is due
to the inline-editing controls being injected into abitrary layouts and
this is the hackish attempt at trying to keep them consistant across
implementations, by not being overridden by the stylesheets for each
particular site's layout.
*/

/* TOOLBAR */

#editable-toolbar, .editable-highlight, .editable-link {top:0; left:0;
    z-index:300; position:absolute;}
#editable-toolbar {z-index:9000; display:none; padding-left:2px !important;}
#editable-loading {z-index:10000; display:none; position:absolute;}
#editable-toolbar {position:fixed;}
.editable-highlight {border:1px solid #ccc;}
.editable-link {display: block;}

#editable-toolbar, .editable-link {
    background:#fffcc3; float:left; cursor:pointer; padding:6px 8px;
    white-space:nowrap; border:1px solid #ccc; line-height:1em;}

#editable-toolbar a, .editable-link {text-decoration:none;
    color:#222 !important; font-size:11px !important;
    font-weight:normal; text-transform:uppercase;}

#editable-toolbar a {border-left:1px solid #bbb; padding:0 8px 0 12px;
    display:none;}
a#editable-toolbar-toggle {border-left:0px !important; text-decoration:none;
    display:inline !important; font-weight:bold !important;
    font-size:14px !important;}

/* FORM */

.editable-form {
    padding:20px; background:#fffcc3; border:1px solid #000;
    line-height:1em; border-radius:4px; min-width:350px;
    box-shadow: 0 0 80px #222;
    color:#000;

    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.editable-form .mce-tinymce {min-width: 770px;}
.editable-form table, .editable-form textarea, .editable-form input {
    width: 100%; margin: .5em 0; font-size: 14px;}
.mceToolbar table {width: auto !important; margin: 0 !important;}
.editable-form .booleanfield {width: auto;}
.editable-form input.datetimefield {width: 80px; margin-left: 8px;}
.editable-form select {width:auto;}
.editable-form input[type="file"] {width: 300px;}
.editable-form p {margin: .5em 0 !important; padding: 0 !important;
    line-height: 0 !important; border: 0 !important;}
.editable-form p:first-child {margin-top: 0px;}
.editable-form .helptext {font-size: 70%; color: #444; font-style: italic;}
.editable-form label {text-transform: capitalize !important;
    font-weight: bold !important; line-height: 1.1em !important;
    font-size: 15px !important; color: #000 !important; float:none;}
.editable-form .btn {width:auto; cursor:pointer; float:right;
    margin:15px 0 0 15px; padding:5px 15px; border-radius:3px;}
.editable-form textarea {line-height: normal; width: 500px;} /* GH #1382 */