/* ===== Buttons (Flotix) ===== */
:root{
  --fx-primary-600: #2563EB;
  --fx-primary-700: #1D4ED8;
  --fx-primary-800: #1E40AF;
  --fx-ring: rgba(37, 99, 235, .35);
}

/* базовая кнопка */
.btn-primary,
.btn-outline{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;

  height: 44px;
  padding: 0 18px;

  border-radius: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .01em;

  transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .05s ease;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

/* primary */
.btn-primary{
  background: var(--fx-primary-600);
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .18);
}

.btn-primary:hover{
  background: var(--fx-primary-700);
  box-shadow: 0 12px 30px rgba(15, 23, 42, .22);
}

.btn-primary:active{
  transform: translateY(1px);
  background: var(--fx-primary-800);
}

/* outline (на тёмном и светлом фоне одинаково читается) */
.btn-outline{
  background: rgba(255,255,255,.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(6px);
}

.btn-outline:hover{
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.45);
}

.btn-outline:active{
  transform: translateY(1px);
  background: rgba(255,255,255,.18);
}

/* focus (важно для ИБ/корп-стандартов) */
.btn-primary:focus-visible,
.btn-outline:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px var(--fx-ring);
}

/* disabled */
.btn-primary[aria-disabled="true"],
.btn-outline[aria-disabled="true"],
.btn-primary:disabled,
.btn-outline:disabled{
  opacity: .55;
  cursor: not-allowed;
  transform: none;
}

/* адаптация для светлого фона (если btn-outline используется в белых секциях) */
.btn-outline.is-light{
  background: #fff;
  color: #0F172A;
  border: 1px solid #E2E8F0;
  backdrop-filter: none;
}

.btn-outline.is-light:hover{
  background: #F8FAFC;
  border-color: #CBD5E1;
}