/* ------ Item database (itemdb.php) ------- */

#idb { text-align: left; }
#idb .dim { color: #8d7458; font-weight: normal; font-size: 11px; }

#idb .idb-bar { margin: 6px 0 6px 0; }
#idb .idb-q {
  width: 250px;
  padding: 5px 7px;
  border: 1px solid #8d7458;
  background: #f5ecdd;
  color: #2f2115;
  font-family: Sylfaen, Trebuchet MS, Verdana;
  font-size: 13px;
}
#idb select {
  padding: 4px;
  border: 1px solid #8d7458;
  background: #f5ecdd;
  color: #2f2115;
  font-family: Sylfaen, Trebuchet MS, Verdana;
  font-size: 12px;
}
#idb .idb-only { color: #6d5a44; white-space: nowrap; }
#idb .idb-only input { vertical-align: -2px; }

#idb .idb-count { margin: 4px 0 6px 0; color: #6d5a44; font-style: italic; }

#idb table.idb-list { width: 100%; border-collapse: collapse; }
#idb table.idb-list tr { cursor: pointer; }
#idb table.idb-list tr:hover td { background: #efe3cf; }
#idb table.idb-list td { padding: 3px 6px; border-bottom: 1px solid #dacdb6; vertical-align: middle; }
#idb table.idb-list td.ic { width: 34px; padding: 2px 4px; }
#idb table.idb-list td.nm { color: #2f2115; font-weight: bold; }
#idb table.idb-list td.gr { width: 24px; text-align: center; }
#idb table.idb-list td.bd { text-align: right; white-space: nowrap; }
#idb table.idb-list img, #idb .idb-list .noicon { width: 32px; height: 32px; border: 1px solid #3a2411; vertical-align: middle; }

#idb b[class^="gr-"] { color: #fff; padding: 0 4px; font-size: 11px; background: #6d5a44; }
#idb b.gr-D { background: #4f7a3a; }
#idb b.gr-C { background: #2f6a8c; }
#idb b.gr-B { background: #6b3f8c; }
#idb b.gr-A { background: #9a6b12; }
#idb b.gr-S { background: #8c1010; }

#idb .bd i {
  display: inline-block;
  margin-left: 3px;
  padding: 0 4px;
  font-style: normal;
  font-size: 10px;
  line-height: 15px;
  color: #fff;
}
#idb .bd i.b-d { background: #8c2b2b; }
#idb .bd i.b-s { background: #7a5a1c; }
#idb .bd i.b-b { background: #3f6b2b; }
#idb .bd i.b-m { background: #2f6a8c; }
#idb .bd i.b-c { background: #5b3d21; }
#idb .bd i.b-q { background: #6b3f8c; }

#idb .noicon { display: inline-block; background: #3a2411; }

/* popup */
#idb .idb-modal {
  display: none;
  position: fixed;
  z-index: 100;
  left: 0; top: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, .55);
}
#idb .idb-modal.open { display: block; }
#idb .idb-dialog {
  position: relative;
  width: 640px;
  max-width: 94%;
  max-height: 88%;
  margin: 4vh auto 0 auto;
  overflow-y: auto;
  padding: 14px 18px 16px 18px;
  border: 2px solid #3a2411;
  background: #efe3cf;
  color: #2f2115;
  text-align: left;
  box-shadow: 0 6px 30px rgba(0, 0, 0, .6);
}
#idb .idb-close, #idb .idb-close:link, #idb .idb-close:visited {
  position: absolute; right: 10px; top: 4px;
  color: #5b3d21; font-size: 26px; font-weight: bold; text-decoration: none;
}
#idb .idb-close:hover { color: #000; }

/* item card: same look as the character page tooltip */
#idb .idb-card { overflow: hidden; margin: 0 30px 6px 0; }
#idb .idb-cardicon { float: left; margin-right: 10px; }
#idb .idb-cardicon img, #idb .idb-cardicon .noicon { width: 32px; height: 32px; border: 1px solid #3a2411; }
#idb .idb-tip {
  overflow: hidden;
  padding: 8px 10px;
  border: 1px solid #8a7659;
  background: #17110a;
  color: #cfc0a8;
}
#idb .idb-tip b.tip-name { display: block; color: #f0dfbb; font-weight: bold; font-size: 14px; }
#idb .idb-tip span.tip-sub { display: block; margin-top: 1px; color: #8a7659; font-size: 11px; }
#idb .idb-tip table.tip-stats { width: 100%; margin-top: 7px; border-top: 1px solid #3a2e1e; border-collapse: collapse; }
#idb .idb-tip table.tip-stats th { padding: 2px 8px 2px 0; color: #8a7659; font-weight: normal; text-align: left; white-space: nowrap; }
#idb .idb-tip table.tip-stats td { padding: 2px 0; color: #e0d2b8; text-align: right; }
#idb .idb-tip p.tip-desc {
  margin: 7px 0 0 0; padding-top: 6px; border-top: 1px solid #3a2e1e;
  color: #a8977c; font-size: 11px; line-height: 15px;
}

#idb .idb-body h4 {
  margin: 14px 0 4px 0;
  padding-bottom: 3px;
  border-bottom: 1px solid #c0a98c;
  color: #442b17;
  font-size: 13px;
}
#idb table.idb-src { width: 100%; border-collapse: collapse; }
#idb table.idb-src th {
  padding: 3px 6px; color: #6d5a44; font-weight: normal; text-align: left;
  border-bottom: 1px solid #c0a98c;
}
#idb table.idb-src td { padding: 3px 6px; border-bottom: 1px solid #dacdb6; vertical-align: middle; }
#idb table.idb-src .num { text-align: right; white-space: nowrap; }
#idb table.idb-src img, #idb table.idb-src .noicon {
  width: 20px; height: 20px; margin-right: 5px; vertical-align: middle; border: 1px solid #3a2411;
}
#idb table.idb-src a { color: #5b3d21; text-decoration: none; font-weight: bold; }
#idb table.idb-src a:hover { color: #000; text-decoration: underline; }
#idb table.idb-src b.rb {
  display: inline-block; margin-right: 4px; padding: 0 3px;
  background: #8c1010; color: #fff; font-size: 9px; line-height: 13px; vertical-align: 1px;
}
#idb .idb-none { margin: 10px 0; color: #8c2b2b; font-weight: bold; }
#idb .idb-note { margin-top: 12px; color: #6d5a44; font-size: 11px; font-style: italic; }

/* sortable headers */
#idb table.idb-src th.sort { cursor: pointer; white-space: nowrap; -webkit-user-select: none; user-select: none; }
#idb table.idb-src th.sort:hover { color: #2f1d0c; text-decoration: underline; }
#idb table.idb-src th .arr { display: inline-block; width: 10px; margin-left: 3px; font-size: 9px; color: #b09a7c; }
#idb table.idb-src th.sort .arr:after { content: '\2195'; }
#idb table.idb-src th.asc  .arr:after { content: '\25B2'; color: #442b17; }
#idb table.idb-src th.desc .arr:after { content: '\25BC'; color: #442b17; }
#idb table.idb-src th.asc, #idb table.idb-src th.desc { color: #2f1d0c; font-weight: bold; }
