/* Windows Marketplace inside Internet Explorer (js/marketplace-site.js),
   about 2005. Colors are read off the archived windowsmarketplace.com:
   the #3366cc bar, Arial 12px in #444433, links #003399,
   a lavender left column (#ececf6) beside a near-white page (#f9f9fc). The
   flag is drawn in CSS, not Microsoft's logo file. */

.ie-view:has(> .wm-site) {
  padding: 0;
}

.wm-site {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  background: #fff;
  color: #444433;
  font: 12px/1.35 Arial, sans-serif;
  -webkit-font-smoothing: auto;
}
.wm-site a { color: #003399; text-decoration: none; }
.wm-site a:hover { text-decoration: underline; }

/* ---------- top ---------- */

.wm-top { display: flex; align-items: center; gap: 140px; padding: 6px 12px 4px; }
.wm-site .wm-logo {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #333333;
  font: 17px "Franklin Gothic Medium", "Trebuchet MS", Arial, sans-serif;
  letter-spacing: -0.3px;
}
.wm-flag {
  width: 22px;
  height: 20px;
  transform: skewY(-6deg);
  background:
    linear-gradient(#f25022, #f25022) 0 0 / 10px 9px no-repeat,
    linear-gradient(#7fba00, #7fba00) 12px 0 / 10px 9px no-repeat,
    linear-gradient(#00a4ef, #00a4ef) 0 11px / 10px 9px no-repeat,
    linear-gradient(#ffb900, #ffb900) 12px 11px / 10px 9px no-repeat;
}
.wm-tagline { font-size: 11px; color: #444433; }

.wm-bar { display: flex; align-items: center; gap: 60px; background: #3366cc; padding: 4px 12px; }
.wm-search { display: flex; align-items: center; gap: 6px; }
.wm-search label { color: #fff; font-weight: bold; font-size: 13px; }
.wm-search input { width: 200px; font: 12px Arial, sans-serif; }
.wm-search button { font: 12px Arial, sans-serif; }

.wm-head { background: #3366cc; border-top: 1px solid #99ccff; padding: 6px 12px 8px; color: #fff; }
.wm-crumbs, .wm-site .wm-crumbs a { color: #fff; font-size: 12px; }
.wm-head h1 { margin: 4px 0 0; font: 600 16px Arial, sans-serif; color: #fff; }

/* ---------- body ---------- */

.wm-body { flex: 1; display: flex; align-items: stretch; }
.wm-left { width: 170px; flex: none; background: #ececf6; padding: 10px 12px 20px; }
.wm-site .wm-left-head { display: block; font: 20px "Trebuchet MS", Arial, sans-serif; color: #3366cc; margin-bottom: 4px; }
.wm-site .wm-left-link { display: block; padding: 1px 0; }
.wm-main { flex: 1; min-width: 0; background: #f9f9fc; padding: 10px 14px 20px; border-left: 4px solid #e9e9ef; }

.wm-banner {
  padding: 12px 16px;
  margin-bottom: 12px;
  color: #fff;
  font: 20px "Trebuchet MS", Arial, sans-serif;
  background: linear-gradient(#5a86c9, #3366aa 70%, #6f9a4a 70%, #86b35a);
}
.wm-banner-2 { padding-left: 120px; }
.wm-panel { border: 1px solid #d8d8e4; background: #fff; padding: 6px 12px; }
.wm-panel h2, .wm-found { font-size: 13px; font-weight: bold; color: #6f6f5c; margin: 4px 0; }
.wm-panel ol { margin: 4px 0; padding-left: 24px; }

.wm-row { display: flex; gap: 12px; align-items: flex-start; padding: 8px 4px; border-bottom: 1px solid #e9e9ef; }
.wm-row:nth-child(even) { background: #f6f6fc; }
.wm-row-info { flex: 1; }
.wm-site .wm-name { display: block; font-weight: bold; color: #3366cc; font-size: 13px; }
.wm-by { color: #444433; }
.wm-price { white-space: nowrap; font-weight: bold; text-align: right; }
.wm-license { font-weight: normal; font-size: 11px; color: #6f6f5c; }
.wm-owned { color: #1a7d3a; white-space: nowrap; }
.wm-stars { color: #ffb900; letter-spacing: 1px; font-size: 13px; }
.wm-thumb { width: 60px; height: 45px; flex: none; border: 1px solid #d8d8e4; background: #fff; }
.wm-thumb img, .wm-shot img { width: 100%; height: 100%; object-fit: contain; }
.wm-noimg::after {
  content: "No image available";
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #999999;
  font-size: 9px;
}

.wm-product { display: flex; gap: 16px; align-items: flex-start; border: 1px solid #e9e9ef; background: #f9f9fc; padding: 8px; }
.wm-product-text { flex: 1; min-width: 0; }
.wm-desc { margin: 10px 0; }
.wm-shot { width: 150px; height: 110px; flex: none; border: 1px solid #d8d8e4; background: #fff; }
.wm-prices { margin-top: 12px; border-collapse: collapse; min-width: 200px; }
.wm-prices th { text-align: left; color: #003399; padding: 2px 8px; border-bottom: 1px solid #d8d8e4; }
.wm-prices td { padding: 4px 8px; background: #f6f6fc; }
.wm-rating { margin-top: 6px; }
.wm-product .shop-says { margin-top: 6px; max-width: 420px; }
.wm-section { margin-top: 16px; padding: 3px 8px; background: #3366cc; color: #fff; font-weight: bold; font-size: 13px; }

.wm-footer { background: #3366cc; color: #fff; padding: 6px 12px; font-size: 11px; }
