/* tn_menu_builder.css
** inspired from wp-admin > navmenu.css
** TODO : change / adapt everything
*/

#content {
  padding: 0 !important;
}

#menu-builder {
  display: table;
  margin: 15px 0;
}

#menu-management {
  position: relative;
  display: table-row;
}
#menu_edit_left {
  min-width: 200px;
  display: table-cell;
  padding-right: 20px;
  vertical-align: top;
}

#menu_edit_main {
  display: table-cell;
  min-width: 530px;
  vertical-align: top;
}

#menu_edit_main fieldset {
  background: transparent !important;
  margin: 0;
  padding: 0;
}

.menu {
  padding-top:1em;
}

#menu-to-edit {
  padding: 0;
  margin: 0;
  list-style: none outside none;
}

.menu-item-transport {
  padding: 0;
  margin: 0 0 0 -30px;
  list-style: none outside none;
}

.menu ul {
  width: 100%;
}
.menu ul.sub-menu {
}
.menu li {
  margin-bottom: 7px;
  position:relative;
}
.menu-item-bar {
  clear:both;
  line-height:1.5em;
  position:relative;
  margin: 0;
}
.menu-item-handle {
  background: #EEE; /* old browsers */
  background: -moz-linear-gradient(center top , #FFF 0%, #DDD 51%, #BBB 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFF), color-stop(51%,#DDD), color-stop(100%,#BBB));
  color: #444;
  position: relative;
  padding-left: 10px;
  height: auto;
  width: 350px;
  font-weight:bold;
  overflow: hidden;
  border: 1px solid #DDD;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  word-wrap: break-word;
}
.menu-item-edit-active .menu-item-handle {
  -moz-border-radius: 6px 6px 0 0;
  -webkit-border-radius: 6px 6px 0 0;
  border-radius: 6px 6px 0 0;
}

.menu-item-handle {
  cursor: move;
}
.menu .deleting .menu-item-handle {
  background-color: #E00023;
  background-image: none;
}

.menu-item-handle .item-title {
  padding: 7px 0;
  display:block;
  margin-right:13em;
}

.sortable-placeholder {
  background-color: #F5F5F5;
  border-color: #BBBBBB;
  border-style: dashed;
  border-width: 1px;
  margin-bottom: 0;
}


li.menu-item.ui-sortable-helper dl {
  margin-top: 0;
}
li.menu-item.ui-sortable-helper .menu-item-transport dl {
  margin-top: 13px;
}
.menu .sortable-placeholder {
  height: 35px;
  width: 410px;
  margin-top: 13px;
}

/* menus level */

/* WARNING: The factor of 30px is hardcoded into the nav-menus javascript. */
.menu-item-depth-0 { margin-left: 0px; }
.menu-item-depth-1 { margin-left: 30px; }
.menu-item-depth-2 { margin-left: 60px; }
.menu-item-depth-3 { margin-left: 90px; }
.menu-item-depth-4 { margin-left: 120px; }
.menu-item-depth-5 { margin-left: 150px; }
.menu-item-depth-6 { margin-left: 180px; }
.menu-item-depth-7 { margin-left: 210px; }
.menu-item-depth-8 { margin-left: 240px; }
.menu-item-depth-9 { margin-left: 270px; }
.menu-item-depth-10 { margin-left: 300px; }
.menu-item-depth-11 { margin-left: 330px; }

.menu-item-depth-0 .menu-item-transport { margin-left: 0px; }
.menu-item-depth-1 .menu-item-transport { margin-left: -30px; }
.menu-item-depth-2 .menu-item-transport { margin-left: -60px; }
.menu-item-depth-3 .menu-item-transport { margin-left: -90px; }
.menu-item-depth-4 .menu-item-transport { margin-left: -120px; }
.menu-item-depth-5 .menu-item-transport { margin-left: -150px; }
.menu-item-depth-6 .menu-item-transport { margin-left: -180px; }
.menu-item-depth-7 .menu-item-transport { margin-left: -210px; }
.menu-item-depth-8 .menu-item-transport { margin-left: -240px; }
.menu-item-depth-9 .menu-item-transport { margin-left: -270px; }
.menu-item-depth-10 .menu-item-transport { margin-left: -300px; }
.menu-item-depth-11 .menu-item-transport { margin-left: -330px; }

body.menu-max-depth-0 { min-width: 950px !important; }
body.menu-max-depth-1 { min-width: 980px !important; }
body.menu-max-depth-2 { min-width: 1010px !important; }
body.menu-max-depth-3 { min-width: 1040px !important; }
body.menu-max-depth-4 { min-width: 1070px !important; }
body.menu-max-depth-5 { min-width: 1100px !important; }
body.menu-max-depth-6 { min-width: 1130px !important; }
body.menu-max-depth-7 { min-width: 1160px !important; }
body.menu-max-depth-8 { min-width: 1190px !important; }
body.menu-max-depth-9 { min-width: 1220px !important; }
body.menu-max-depth-10 { min-width: 1250px !important; }
body.menu-max-depth-11 { min-width: 1280px !important; }


/* Menu item controls */
.item-type { text-transform: uppercase; font-size: 11px; color: #999999; padding-right: 10px; }
.item-controls { font-size: 11px; position: absolute; right: 20px; top: -1px; }
.item-controls a { text-decoration: none; }
.item-controls a:hover { cursor: pointer; text-decoration: none !important; }
.item-controls .item-order { padding-right: 10px;}
.item-controls .item-order a {
  font-weight:bold;
}

.item-controls .menu-item-delete:hover { color: #ff0000; }

.item-edit {
  background: url("../images/menu-bits.png") no-repeat scroll 0 0;
  position: absolute;
  right: -20px;
  top: 0;
  display: block;
  width: 23px;
  height: 33px;
  overflow: hidden;
  text-indent:-999em;
  border-bottom: 1px solid #eee;
  -moz-border-radius-bottomleft: 3px;
  -webkit-border-bottom-left-radius: 3px;
  border-bottom-left-radius: 3px;
}

.menu-item-edit-active .item-edit {
  background: url("../images/menu-bits.png") no-repeat scroll 0 -33px;
}

/* Menu editing */
.menu-instructions-inactive {
  display: none;
}
.menu-item-settings {
  background: #F9F9F9;
  display:block;
  width: 360px;
  padding: 10px 0;
  border: solid #E6E6E6;
  border-width: 0 1px 1px 1px;
  -moz-border-radius: 0 0 6px 6px;
  -webkit-border-bottom-right-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;
  border-radius: 0 0 6px 6px;
}
.menu-item-edit-active .menu-item-settings {
  display:block;
}

.menu-item-edit-inactive .menu-item-settings {
  display:none;
}

.menu-item-settings .fieldWrapper {
  padding: 2px 10px;
  border-bottom: none;
}

/* postboxes on left column */

.postbox {
  border: 1px solid #E6E6E6;
  background: #E6E6E6;/* old browsers */
  background: -moz-linear-gradient(left, #E6E6E6 0%, #F3F3F3 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,#E6E6E6), color-stop(100%,#F3F3F3));
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  margin-bottom: 10px;
  padding-bottom: 1px;
}

.postbox h3 {
  color: black;
  padding-left: 5px;
}

.postbox .inside {
  background-color: white;
  padding: 5px 0;
  border-radius: 0 0 6px 6px;
  -moz-border-radius: 0 0 6px 6px;
  -webkit-border-radius: 0 0 6px 6px;
}

.postbox .inside .fieldWrapper {
  margin: 0 !important;
  padding: 3px 7px  !important;
  border-bottom: none !important;
}

.postbox .inside .fieldWrapperWithError .small { color: #ddd}
.menu-item-settings .fieldWrapperWithError .small { display: block; color: #ddd}

.postbox .inside label {
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  width: auto !important;
  font-size: 12px !important;
}

.postbox .inside input[type=text],
.postbox .inside textarea {
  width: 170px !important;
}

.postbox .inside input[type=submit] {
  float: none;
  margin: 0 !important;
}

.postbox .postboxcontrol {
  text-align: right;
  margin-top: 5px !important;
  padding: 0 7px;
}

.postbox .hint {
  top: 35px;
  right: -230px !important;
}

/* some buttons */

.menu-item-actions {
  margin-top: 7px;
  padding-left: 10px;
}

.item-delete,
.item-cancel {
  font-size: 11px;
  padding: 2px 0;
  line-height: 15px;
  color: #0093E0 !important;
  font-weight: bold;
}

.item-delete {
  margin-right: 20px;
}

.item-cancel:hover,
.item-delete:hover {
  color: #E00023 !important;
}

#menu-to-delete,
#item-model,
#content-item-model-form {
  display: none;
}

/* XXX TODO (JMG) improve */
.content-target {
  padding: 2px  7px;
}