:root {
  --logo-size-card: 48px;
  --logo-size-detail: 80px;
}

.logo-mark,
.logo-mark--card,
.logo-mark--detail {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: #031024 !important;
  object-fit: contain !important;
  object-position: center !important;
  overflow: hidden !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

.logo-mark--card {
  width: var(--logo-size-card) !important;
  height: var(--logo-size-card) !important;
  max-width: var(--logo-size-card) !important;
  max-height: var(--logo-size-card) !important;
  min-width: var(--logo-size-card) !important;
  min-height: var(--logo-size-card) !important;
  padding: 6px !important;
  border-radius: 12px !important;
}

.logo-mark--detail {
  width: var(--logo-size-detail) !important;
  height: var(--logo-size-detail) !important;
  max-width: var(--logo-size-detail) !important;
  max-height: var(--logo-size-detail) !important;
  min-width: var(--logo-size-detail) !important;
  min-height: var(--logo-size-detail) !important;
  padding: 8px !important;
  border-radius: 18px !important;
}

img.logo-mark {
  display: block !important;
}

.school-identity-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  width: 100% !important;
}

.school-identity-row--detail {
  gap: 16px !important;
  margin-bottom: 4px !important;
}

.school-identity-name {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  margin: 0 !important;
  overflow-wrap: anywhere !important;
}

.autocomplete button {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  height: auto !important;
  min-height: 56px !important;
  text-align: left !important;
}

.autocomplete button .school-identity-name {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.card .school-identity-row {
  align-items: flex-start !important;
}

.card .school-identity-row .logo-mark--card {
  margin-top: 2px !important;
}

.card img.logo-mark,
.profile img.logo-mark,
.autocomplete img.logo-mark {
  max-width: 100% !important;
}

a.school-identity-row--linked {
  text-decoration: none !important;
  color: inherit !important;
}

a.school-identity-row--linked:hover .school-identity-name {
  text-decoration: underline !important;
}

.card-meta {
  min-height: 1.25em !important;
  margin: 0 !important;
}