/* Shared layout/utilities used by dashboard and public pages. */

.u-link {
  color: var(--brand, #1558c0);
  text-decoration: none;
}

.u-link:hover {
  text-decoration: underline;
}

.u-inline-form {
  display: inline-flex;
  flex-shrink: 0;
}

.u-panel-tight {
  padding: 0;
  overflow: hidden;
}

.u-mt-1 {
  margin-top: 1px;
}

.u-mt-0 {
  margin-top: 0;
}

.u-mt-2 {
  margin-top: 4px;
}

.u-mt-4 {
  margin-top: 16px;
}

.u-mt-5 {
  margin-top: 20px;
}

.u-mt-6 {
  margin-top: 24px;
}

.u-mb-0 {
  margin-bottom: 0;
}

.u-align-right {
  margin-left: auto;
}

.u-text-strong {
  color: var(--text-strong, #1b2a3b);
}

.u-text-muted {
  color: var(--text-muted, #526273);
}

.u-text-soft {
  color: var(--text-soft, #6b7a8c);
}

.u-full-width {
  width: 100%;
}

.u-hidden {
  display: none !important;
}

.u-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.u-status-muted {
  opacity: .45;
}

.u-mobile-stack {
  display: flex;
  align-items: center;
  gap: 12px;
}

.u-button-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: flex-start;
}

@media (max-width: 768px) {
  .u-mobile-stack {
    align-items: stretch;
    flex-direction: column;
  }

  .u-mobile-stack > * {
    width: 100%;
  }

  .u-button-row {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
  }

  .u-button-row .btn {
    width: 100%;
  }
}