/* ============================================================
   ganzaMAIL :: Windows 2000 x 420 weed theme
   ============================================================ */
* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: "MS Sans Serif", Tahoma, Geneva, sans-serif;
  font-size: 12px;
  color: #0a2a0a;
  background: #0a3d0a url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='130' height='130'><g transform='translate(65,120)' fill='%232a9a2a'><g transform='rotate(0)'><ellipse cx='0' cy='-50' rx='7' ry='50'/></g><g transform='rotate(27)'><ellipse cx='0' cy='-42' rx='6.5' ry='42'/></g><g transform='rotate(-27)'><ellipse cx='0' cy='-42' rx='6.5' ry='42'/></g><g transform='rotate(53)'><ellipse cx='0' cy='-31' rx='5.5' ry='31'/></g><g transform='rotate(-53)'><ellipse cx='0' cy='-31' rx='5.5' ry='31'/></g><g transform='rotate(78)'><ellipse cx='0' cy='-19' rx='4.5' ry='19'/></g><g transform='rotate(-78)'><ellipse cx='0' cy='-19' rx='4.5' ry='19'/></g><rect x='-1.5' y='-6' width='3' height='12'/></g></svg>") repeat;
  background-size: 90px 90px;
  background-blend-mode: soft-light;
  background-color: #1d5c1d;
}

/* fundo tipo desktop win2k mas verde weed */
.desktop {
  min-height: 100vh;
  padding: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

/* ----- janela clássica ----- */
.window {
  background: #c3d9c3;
  border: 2px solid;
  border-color: #e8f5e8 #2d5a2d #2d5a2d #e8f5e8;
  box-shadow: 1px 1px 0 #0a2a0a, inset 1px 1px 0 #d8ecd8;
  width: 100%;
  max-width: 900px;
}
.window.narrow { max-width: 420px; }

.titlebar {
  background: linear-gradient(90deg, #0a8a0a 0%, #2db82d 50%, #88e888 100%);
  color: #fff;
  font-weight: bold;
  padding: 3px 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-shadow: 1px 1px 0 #043d04;
  letter-spacing: .5px;
}
.titlebar .tb-left { display: flex; align-items: center; gap: 6px; }
.titlebar .tb-icon { font-size: 14px; }
.titlebar .tb-btns { display: flex; gap: 2px; }
.tb-btn {
  width: 18px; height: 16px;
  background: #c3d9c3;
  border: 2px solid;
  border-color: #e8f5e8 #2d5a2d #2d5a2d #e8f5e8;
  color: #0a2a0a; font-weight: bold; font-size: 10px;
  line-height: 11px; text-align: center;
}

.win-body { padding: 14px; }

/* ----- menu bar ----- */
.menubar {
  background: #c3d9c3;
  border-bottom: 1px solid #2d5a2d;
  padding: 2px 4px;
  display: flex; gap: 2px;
}
.menubar a {
  padding: 2px 8px; color: #0a2a0a; text-decoration: none;
}
.menubar a:hover { background: #0a8a0a; color: #fff; }

/* ----- toolbar ----- */
.toolbar {
  background: #c3d9c3;
  border-bottom: 2px solid;
  border-color: #2d5a2d;
  box-shadow: inset 0 1px 0 #e8f5e8;
  padding: 5px 6px;
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
}

/* ----- botões 3D ----- */
.btn, button, input[type=submit] {
  font-family: inherit; font-size: 12px;
  background: #c3d9c3;
  border: 2px solid;
  border-color: #e8f5e8 #2d5a2d #2d5a2d #e8f5e8;
  padding: 4px 12px;
  cursor: pointer;
  color: #0a2a0a;
  text-decoration: none;
  display: inline-block;
}
.btn:active, button:active, input[type=submit]:active {
  border-color: #2d5a2d #e8f5e8 #e8f5e8 #2d5a2d;
}
.btn.green {
  background: linear-gradient(#3ec43e, #1a8a1a);
  color: #fff; font-weight: bold; text-shadow: 1px 1px 0 #043d04;
}

/* ----- inputs ----- */
input[type=text], input[type=password], input[type=email], textarea, select {
  font-family: "Courier New", monospace; font-size: 13px;
  background: #f0fff0;
  border: 2px solid;
  border-color: #2d5a2d #e8f5e8 #e8f5e8 #2d5a2d;
  padding: 4px;
  width: 100%;
  color: #0a3d0a;
}
textarea { resize: vertical; }
label { display:block; margin: 8px 0 2px; font-weight: bold; }

/* ----- tabela de emails ----- */
table.mail { width: 100%; border-collapse: collapse; background: #f0fff0; }
table.mail th {
  background: linear-gradient(#3ec43e, #1a8a1a);
  color: #fff; text-align: left; padding: 4px 8px;
  border: 1px solid #2d5a2d; text-shadow: 1px 1px 0 #043d04;
}
table.mail td { padding: 4px 8px; border-bottom: 1px solid #b5d5b5; }
table.mail tr:hover td { background: #d5f5d5; }
table.mail tr.unseen td { font-weight: bold; background: #e0ffe0; }
table.mail a { color: #0a5a0a; text-decoration: none; }
table.mail a:hover { text-decoration: underline; }

/* ----- status bar ----- */
.statusbar {
  background: #c3d9c3;
  border-top: 2px solid #e8f5e8;
  padding: 3px 8px;
  display: flex; justify-content: space-between;
  font-size: 11px;
}
.statusbar .panel {
  border: 1px solid;
  border-color: #2d5a2d #e8f5e8 #e8f5e8 #2d5a2d;
  padding: 1px 8px;
}

/* ----- caixas de mensagem ----- */
.msgbox { padding: 8px; margin-bottom: 10px; border: 2px solid; }
.msgbox.err { background: #ffe0e0; border-color: #c00; color: #800; }
.msgbox.ok  { background: #e0ffe0; border-color: #0a8a0a; color: #064d06; }

/* ----- logo / banner ----- */
.banner {
  text-align: center; padding: 10px;
}
.banner h1 {
  margin: 0; font-size: 30px;
  color: #1a8a1a;
  text-shadow: 2px 2px 0 #88e888, 3px 3px 0 #043d04;
  letter-spacing: 1px;
}
.banner .tag {
  font-size: 11px; color: #d6ffd6; margin-top: 2px;
  font-style: italic; text-shadow: 1px 1px 0 #043d04;
}
.banner h1 { display: flex; align-items: center; justify-content: center; gap: 12px; }
.banner h1 .joint { height: 40px; width: auto; filter: drop-shadow(0 0 5px #ff6a00); image-rendering: pixelated; }
.banner h1 .joint.flip { transform: scaleX(-1); }
.blink { animation: blink 1s steps(2,start) infinite; }
@keyframes blink { to { visibility: hidden; } }

.leaf-divider { text-align:center; font-size:16px; letter-spacing:4px; margin:6px 0; }

.email-view .meta {
  background: #e0ffe0; border: 1px solid #2d5a2d; padding: 8px; margin-bottom: 8px;
}
.email-view .meta b { display:inline-block; width: 70px; }
.email-view .content {
  background: #fff; border: 2px solid; border-color:#2d5a2d #e8f5e8 #e8f5e8 #2d5a2d;
  padding: 10px; white-space: pre-wrap; word-wrap: break-word;
  font-family: "Courier New", monospace; min-height: 200px;
}
iframe.htmlmail { width:100%; min-height:300px; border:2px solid; border-color:#2d5a2d #e8f5e8 #e8f5e8 #2d5a2d; background:#fff; }

a { color: #0a5a0a; }

.marquee {
  background: #043d04; color: #5eff5e; font-family: "Courier New", monospace;
  padding: 3px 0; overflow: hidden; white-space: nowrap; border: 1px solid #0a8a0a;
}
.marquee span { display: inline-block; padding-left: 100%; animation: scroll 18s linear infinite; }
@keyframes scroll { to { transform: translateX(-100%); } }

.userchip { color:#fff; font-size:11px; }
.tabs { display:flex; gap:4px; padding: 6px 6px 0; }
.tab { padding:4px 12px; background:#a8c8a8; border:2px solid; border-color:#e8f5e8 #2d5a2d #2d5a2d #e8f5e8; border-bottom:none; text-decoration:none; color:#0a2a0a; }
.tab.active { background:#c3d9c3; font-weight:bold; position:relative; top:1px; }