/* ============================================================
   Megabyte PCS - origin override stylesheet
   Loaded AFTER the S3-hosted css. #leftnav-prefixed selectors
   raise specificity so nothing in style.css can override them.
   ============================================================ */

/* ---------- Left category menu: soft charcoal + orange accent ---------- */
#leftnav { width: 180px; }

#leftnav .glossymenu {
  margin: 6px 0 0;
  padding: 0;
  border-radius: 4px;
  overflow: hidden;
  border-top: 3px solid #F37022;          /* orange brand accent bar */
  box-shadow: 0 1px 3px rgba(0,0,0,.18);
}

#leftnav .glossymenu a.menuitem,
#leftnav .glossymenu a.menuitem:visited,
#leftnav .glossymenu .menuitem:active {
  background: #333 !important;            /* soft charcoal (matches top nav, not harsh) */
  background-image: none !important;
  font: bold 13px Arial, Helvetica, sans-serif;
  color: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #454545 !important;
  padding: 10px 12px !important;
  text-decoration: none !important;
  transition: background .15s ease;
}
#leftnav .glossymenu a.menuitem:hover {
  background: #F37022 !important;          /* brand orange highlight */
  background-image: none !important;
  color: #fff !important;
}

#leftnav .glossymenu div.submenu { background: #fff !important; }
#leftnav .glossymenu div.submenu ul li,
#leftnav ul.categoryitems li {
  background: #fafafa !important;
  border-bottom: 1px solid #ececec !important;
  color: #333 !important;
  font: 12px Arial, Helvetica, sans-serif !important;
  font-weight: normal !important;
}
#leftnav .glossymenu div.submenu ul li a,
#leftnav ul.categoryitems li a { color: #444 !important; }
#leftnav .glossymenu div.submenu ul li a:hover,
#leftnav .glossymenu div.submenu ul li a:active,
#leftnav ul.categoryitems li a:hover {
  background: #fdece1 !important;
  border-left: 3px solid #F37022 !important;
  border-right: 0 !important;
  color: #F37022 !important;
}

/* ---------- Category product list: stop rows overlapping ----------
   Each row's description/price are position:absolute and don't add height,
   so short rows collapsed and long descriptions overlapped the next item.
   Give every row a min-height that contains the absolute boxes. */
.plist {
  border-bottom: 1px solid #eaeaea;
  margin-bottom: 6px;
  padding-bottom: 6px;
}
.plist > div {
  min-height: 200px !important;
}
.plist h3 { margin: 4px 0; }