/* Tema dark-navy + accento giallo per Venduto CU */
:root {
  --ink: #070d1c;
  --panel: #0e1a3a;
  --card: #122244;       /* blu più chiaro dello sfondo, saturo */
  --cardAlt: #1a2e58;
  --line: #2a3f72;
  --muted: #6e7aa0;
  --soft: #a4adcb;
  --lime: #ffd02e;       /* token name conservato; valore = giallo carico, nota arancio attenuata */
  --lime-alt: #e6b327;
}

body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; }

table { border-collapse: collapse; }
canvas { max-height: 320px; }

/* Card stile */
.card {
  background: var(--card);
  border-radius: 1.5rem;
  border: 1px solid var(--line);
}
.card-lime {
  background: var(--lime);
  color: #1a1300;
  border-radius: 1.5rem;
}
.pill {
  border-radius: 9999px;
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}
.pill-lime { background: var(--lime); color: #1a1300; }
.pill-dark { background: var(--card); color: #fff; border: 1px solid var(--line); }
.pill-muted { background: transparent; border: 1px solid var(--line); color: var(--soft); }

/* Tabelle dark */
.dark-table { width: 100%; }
.dark-table thead { color: var(--muted); font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; }
.dark-table thead th { padding: 0.75rem 0.5rem; text-align: left; border-bottom: 1px solid var(--line); font-weight: 500; }
.dark-table tbody td { padding: 0.85rem 0.5rem; border-bottom: 1px solid #1a2c56; font-size: 0.875rem; }
.dark-table tbody tr:hover { background: rgba(255, 255, 255, 0.025); }
.dark-table tbody tr:last-child td { border-bottom: 0; }
.dark-table .right { text-align: right; }

/* Header sortable */
.dark-table.sortable thead th[data-sort] { cursor: pointer; user-select: none; transition: color 0.15s; }
.dark-table.sortable thead th[data-sort]:hover { color: var(--lime); }
.dark-table.sortable thead th[data-sort-active] { color: var(--lime); }
.sort-arrow { color: var(--lime); font-size: 0.7em; margin-left: 0.2em; }

/* Progress bar */
.progress {
  background: #2a3f72;
  border-radius: 9999px;
  overflow: hidden;
  height: 0.5rem;
}
.progress > div { height: 100%; border-radius: 9999px; transition: width 0.4s ease; }
.progress-lime > div { background: linear-gradient(90deg, #e6b327, #ffd02e); }
.progress-amber > div { background: #f59e0b; }
.progress-red > div   { background: #ef4444; }

/* Input dark */
.input-dark {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  padding: 0.5rem 0.75rem;
  color: #fff;
  width: 100%;
  font-size: 0.875rem;
}
.input-dark:focus {
  outline: none;
  border-color: var(--lime);
  box-shadow: 0 0 0 3px rgba(255, 208, 46, 0.2);
}
.input-dark::placeholder { color: var(--muted); }

/* Buttons */
.btn-lime {
  background: var(--lime);
  color: #1a1300;
  border-radius: 9999px;
  padding: 0.625rem 1.25rem;
  font-weight: 600;
  font-size: 0.875rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: filter 0.15s;
}
.btn-lime:hover { filter: brightness(1.05); }
.btn-lime:disabled { opacity: 0.45; cursor: not-allowed; }
.btn-dark {
  background: var(--card);
  color: #fff;
  border: 1px solid var(--line);
  border-radius: 9999px;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.btn-dark:hover { background: #1d2f5c; }

/* Scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #2a3f72; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #3b558e; }