/* =========================================================
   BUTTONS
========================================================= */

.scq-button {

  min-height: 42px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 7px;

  padding:
    0 16px;

  border:
    1px solid transparent;

  border-radius:
    var(--radius-sm);

  cursor: pointer;

  font-size: 13px;

  font-weight: 700;

  transition:
    background var(--transition-fast),
    border-color var(--transition-fast),
    color var(--transition-fast),
    transform var(--transition-fast),
    box-shadow var(--transition-fast);

}


.scq-button:hover {

  transform:
    translateY(-1px);

}


.scq-button-primary {

  color:
    var(--primary-text);

  background:
    var(--primary);

  box-shadow:
    0 5px 15px
    var(--glow-primary);

}


.scq-button-primary:hover {

  background:
    var(--primary-hover);

}


.scq-button-secondary {

  color:
    var(--text);

  background:
    var(--surface-raised);

  border-color:
    var(--border);

}


.scq-button-secondary:hover {

  border-color:
    var(--border-strong);

}


.scq-button-gold {

  color:
    #111827;

  background:
    var(--accent);

}


.scq-button-ghost {

  color:
    var(--text-secondary);

  background:
    transparent;

}


.scq-button-ghost:hover {

  background:
    var(--surface-soft);

}