/* JPOS Marketplace publisher portal — minimal vanilla styling. */

* { box-sizing: border-box; }
html, body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  background: #0d1117;
  color: #e6edf3;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
a { color: #79c0ff; text-decoration: none; }
a:hover { text-decoration: underline; }

.shell {
  max-width: 880px;
  margin: 0 auto;
  padding: 32px 24px 64px;
}

header.topbar {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid #21262d;
  padding-bottom: 16px;
  margin-bottom: 32px;
}
header.topbar h1 { font-size: 22px; margin: 0; letter-spacing: -0.01em; }
header.topbar .me { font-size: 13px; color: #8b949e; }
header.topbar .me a { margin-left: 12px; }

h2 { font-size: 18px; margin: 24px 0 12px; }
h3 { font-size: 15px; margin: 16px 0 8px; color: #c9d1d9; }
p, label, input, button, textarea, select {
  font-size: 14px; line-height: 1.5;
}

.card {
  background: #161b22;
  border: 1px solid #30363d;
  border-radius: 6px;
  padding: 20px;
  margin-bottom: 16px;
}

.card.hero {
  background: linear-gradient(135deg, #1f6feb22, #16113322);
  border-color: #30363d;
}

button, .btn {
  display: inline-block;
  background: #238636;
  color: #fff;
  border: 1px solid #2ea043;
  padding: 8px 16px;
  border-radius: 6px;
  font-weight: 500;
  cursor: pointer;
  font-size: 14px;
}
button:hover, .btn:hover { background: #2ea043; }
button.secondary, .btn.secondary {
  background: #21262d;
  border-color: #30363d;
  color: #c9d1d9;
}
button.secondary:hover, .btn.secondary:hover { background: #30363d; }
button.danger { background: #6f1d2c; border-color: #8b2939; }
button.danger:hover { background: #8b2939; }
button:disabled { opacity: 0.5; cursor: not-allowed; }

input[type=email], input[type=text], input[type=url], textarea, select {
  width: 100%;
  background: #0d1117;
  border: 1px solid #30363d;
  color: #e6edf3;
  padding: 8px 10px;
  border-radius: 6px;
  font-family: inherit;
}
textarea { min-height: 80px; resize: vertical; }
.field { margin-bottom: 12px; }
.field label { display: block; font-size: 12px; color: #8b949e; margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.04em; }

.flash {
  padding: 10px 14px;
  border-radius: 6px;
  margin-bottom: 16px;
  font-size: 13px;
  border: 1px solid;
}
.flash.ok    { background: #0d2818; border-color: #1a4f2a; color: #a8d8a8; }
.flash.err   { background: #2c0d0d; border-color: #5b1d1d; color: #ff8585; }
.flash.info  { background: #0d1f2d; border-color: #1f3d56; color: #79c0ff; }

ul.app-list { list-style: none; padding: 0; margin: 0; }
ul.app-list li {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; border-bottom: 1px solid #21262d;
}
ul.app-list li:last-child { border-bottom: none; }
ul.app-list .meta { font-size: 12px; color: #8b949e; margin-top: 2px; }

.kv { display: grid; grid-template-columns: 140px 1fr; gap: 8px 16px; font-size: 13px; }
.kv .k { color: #8b949e; text-transform: uppercase; letter-spacing: 0.04em; font-size: 11px; }
.kv code { background: #0d1117; padding: 2px 6px; border-radius: 4px; }

.dropzone {
  border: 2px dashed #30363d;
  border-radius: 8px;
  padding: 32px;
  text-align: center;
  color: #8b949e;
  cursor: pointer;
}
.dropzone.active { border-color: #2ea043; background: #0d2818; color: #a8d8a8; }

table.versions { width: 100%; border-collapse: collapse; font-size: 13px; }
table.versions th { text-align: left; color: #8b949e; font-weight: 500; padding: 8px; border-bottom: 1px solid #21262d; }
table.versions td { padding: 8px; border-bottom: 1px solid #21262d; }
table.versions tr.yanked td { color: #6e7681; text-decoration: line-through; }

.muted { color: #8b949e; }
.mono { font-family: 'SFMono-Regular', Menlo, Consolas, monospace; }
.row { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.row > * { flex: 0 0 auto; }
.spacer { flex: 1; }
.hidden { display: none !important; }