/* 1979 Trade Portal — brand overrides on top of Tailwind CDN.
   Dark, elegant, trade/distributor aesthetic. */

:root {
  --c-bg: #0b0b0d;
  --c-surface: #141417;
  --c-surface-2: #1c1c20;
  --c-border: #2a2a30;
  --c-text: #f3f1ec;
  --c-text-dim: #a8a5a0;
  --c-accent: #c8a862; /* restrained brass/gold accent */
  --c-accent-dim: #8f7a49;
  --c-danger: #d9534f;
  --c-success: #4caf7d;
}

body {
  background-color: var(--c-bg);
  color: var(--c-text);
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
}

.font-display {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  letter-spacing: 0.02em;
}

.brand-mark {
  letter-spacing: 0.18em;
}

.card {
  background-color: var(--c-surface);
  border: 1px solid var(--c-border);
}

.card-2 {
  background-color: var(--c-surface-2);
  border: 1px solid var(--c-border);
}

.btn-accent {
  background-color: var(--c-accent);
  color: #14141a;
  transition: background-color 0.15s ease, transform 0.1s ease;
}
.btn-accent:hover {
  background-color: #d9bb7c;
}
.btn-accent:active {
  transform: translateY(1px);
}

.btn-outline {
  border: 1px solid var(--c-accent-dim);
  color: var(--c-accent);
}
.btn-outline:hover {
  background-color: rgba(200, 168, 98, 0.08);
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.15rem 0.6rem;
  border-radius: 999px;
  font-size: 0.7rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 600;
}
.badge-demo { background: rgba(200,168,98,0.15); color: var(--c-accent); border: 1px solid var(--c-accent-dim); }
.badge-success { background: rgba(76,175,125,0.15); color: var(--c-success); border: 1px solid rgba(76,175,125,0.4); }
.badge-warn { background: rgba(217,164,79,0.15); color: #e0b25a; border: 1px solid rgba(217,164,79,0.4); }
.badge-danger { background: rgba(217,83,79,0.15); color: var(--c-danger); border: 1px solid rgba(217,83,79,0.4); }
.badge-neutral { background: rgba(168,165,160,0.1); color: var(--c-text-dim); border: 1px solid var(--c-border); }

.input {
  background-color: var(--c-surface-2);
  border: 1px solid var(--c-border);
  color: var(--c-text);
}
.input:focus {
  outline: none;
  border-color: var(--c-accent-dim);
}

a.nav-link {
  color: var(--c-text-dim);
}
a.nav-link:hover, a.nav-link.active {
  color: var(--c-accent);
}

.divider {
  border-color: var(--c-border);
}

table.trade-table th {
  color: var(--c-text-dim);
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
}
table.trade-table td, table.trade-table th {
  padding: 0.65rem 0.9rem;
  border-bottom: 1px solid var(--c-border);
}