/* components/buttons.css — Pulsanti dell'applicazione: pillole con ombra morbida. */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: var(--radius-pill);
  padding: 12px 24px;
  font-size: 13.5px;
  font-weight: 600;
  font-family: inherit;
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s, border-color .15s;
}

.btn--primary {
  background: var(--green);
  color: #fff;
  box-shadow: var(--shadow-sm);
}
.btn--primary:hover { background: var(--green-dark); }

/* Variante scura: azioni sul pannello pino (es. CTA su fondi scuri) */
.btn--dark {
  background: var(--dark);
  color: #eef6ea;
  box-shadow: var(--shadow-sm);
}
.btn--dark:hover { background: #155741; }

/* Variante accento menta */
.btn--accent {
  background: var(--lime);
  color: var(--lime-ink);
  box-shadow: var(--shadow-sm);
}
.btn--accent:hover { background: #a8dfbc; }

.btn--ghost {
  background: transparent;
  color: var(--green-dark);
  border-color: var(--green-border);
}
.btn--ghost:hover { background: var(--green-hover-bg); }

.btn--secondary {
  background: var(--surface);
  color: var(--ink-2);
  border-color: var(--border);
  box-shadow: var(--shadow-sm);
}
.btn--secondary:hover { border-color: #c8d4ce; }

/* Tasto spento: la sua azione ora non può riuscire (es. il «Salva» del mix
   B3 finché le quote non fanno 100). Grigio e senza ombra, così non si legge
   come un'azione disponibile; il motivo lo dice un avviso accanto, a cui il
   tasto rimanda con aria-describedby. Vale per tutte le varianti: l'hover non
   lo riaccende. */
.btn:disabled,
.btn:disabled:hover {
  background: var(--border);
  border-color: transparent;
  color: var(--muted);
  box-shadow: none;
  cursor: not-allowed;
}

.btn--block { width: 100%; display: flex; }
.btn--sm { padding: 8px 16px; font-size: 12.5px; }

.btn__icon { display: flex; align-items: center; }
.btn__icon svg { display: block; }

/* Azione distruttiva o irreversibile: il ritiro di una riga di anagrafica,
   che cambia il perimetro dei report futuri. Fondo tenue e non pieno: è
   un'azione da confermare, non l'azione principale della pagina. */
.btn--danger {
  background: var(--danger-bg);
  color: var(--danger-fg);
  border-color: #eec9b4;
}
.btn--danger:hover { background: #f4dccb; }