/* Neutral button system + icon spacing (admin + public) */

:root {
  --btn-neutral-bg: #ffffff;
  --btn-neutral-bg-hover: #f4f6f8;
  --btn-neutral-bg-active: #eceff3;
  --btn-neutral-border: rgba(11, 18, 32, 0.22);
  --btn-neutral-text: #1f2937;
  --btn-neutral-shadow: 0 1px 2px rgba(11, 18, 32, 0.06);
}

.btn {
  border-radius: 0.65rem;
  font-weight: 600;
  gap: 0.4rem;
}

.btn .btn-ico {
  font-size: 0.95em;
  line-height: 1;
  display: inline-block;
  margin-right: 0.35rem;
}

.btn .btn-ico.btn-ico-trailing {
  margin-right: 0;
  margin-left: 0.35rem;
}

.btn:disabled,
.btn.disabled {
  opacity: 0.58 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

.btn-primary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info,
.btn-secondary,
.btn-outline-primary,
.btn-outline-success,
.btn-outline-danger,
.btn-outline-warning,
.btn-outline-info,
.btn-outline-secondary {
  background: var(--btn-neutral-bg) !important;
  color: var(--btn-neutral-text) !important;
  border-color: var(--btn-neutral-border) !important;
  box-shadow: var(--btn-neutral-shadow) !important;
}

.btn-primary:hover,
.btn-success:hover,
.btn-danger:hover,
.btn-warning:hover,
.btn-info:hover,
.btn-secondary:hover,
.btn-outline-primary:hover,
.btn-outline-success:hover,
.btn-outline-danger:hover,
.btn-outline-warning:hover,
.btn-outline-info:hover,
.btn-outline-secondary:hover {
  background: var(--btn-neutral-bg-hover) !important;
  color: #111827 !important;
  border-color: rgba(11, 18, 32, 0.28) !important;
}

.btn-primary:active,
.btn-success:active,
.btn-danger:active,
.btn-warning:active,
.btn-info:active,
.btn-secondary:active,
.btn-outline-primary:active,
.btn-outline-success:active,
.btn-outline-danger:active,
.btn-outline-warning:active,
.btn-outline-info:active,
.btn-outline-secondary:active {
  background: var(--btn-neutral-bg-active) !important;
  border-color: rgba(11, 18, 32, 0.32) !important;
  color: #0f172a !important;
}

.btn-primary:focus-visible,
.btn-success:focus-visible,
.btn-danger:focus-visible,
.btn-warning:focus-visible,
.btn-info:focus-visible,
.btn-secondary:focus-visible,
.btn-outline-primary:focus-visible,
.btn-outline-success:focus-visible,
.btn-outline-danger:focus-visible,
.btn-outline-warning:focus-visible,
.btn-outline-info:focus-visible,
.btn-outline-secondary:focus-visible {
  box-shadow: 0 0 0 0.2rem rgba(31, 41, 55, 0.2) !important;
}