/*
 * Central MDI icon helper
 * Icons are decorative unless the surrounding control supplies an accessible name.
 */

.app-icon {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  color: inherit;
  font-style: normal;
  line-height: 1;
  vertical-align: -0.125em;
}

.app-icon::before {
  display: block;
  font-size: inherit;
  line-height: 1;
}

.app-icon--menu {
  font-size: clamp(1.65rem, 2.2vw, 2rem);
}

.app-icon--service {
  position: relative;
  z-index: 2;
  margin-block-end: 0.9rem;
  color: var(--signal-strong);
  font-size: clamp(1.75rem, 2vw, 2.1rem);
}

.ledger-item:nth-child(1) .app-icon--service {
  color: #ffffff;
}

.app-icon--feature,
.app-icon--card {
  position: relative;
  z-index: 2;
  margin-block-end: 0.85rem;
}

.app-icon--feature {
  color: #ffffff;
  font-size: clamp(2rem, 2.3vw, 2.35rem);
}

.app-icon--card {
  color: var(--signal-strong);
  font-size: clamp(1.6rem, 1.8vw, 1.85rem);
}

.app-icon--step {
  margin-block-end: 0.65rem;
  color: var(--signal-strong);
  font-size: 1.45rem;
}

.app-icon--button {
  font-size: 1.2rem;
}

.app-icon--contact {
  font-size: 1.22rem;
}

.app-icon--social {
  font-size: 0.95rem;
}

html[dir="rtl"] .app-icon--button {
  transform: none;
}

@media (max-width: 47.99rem) {
  .app-icon--menu {
    font-size: 1.55rem;
  }

  .app-icon--service {
    font-size: 1.8rem;
  }

  .app-icon--feature {
    font-size: 2rem;
  }
}
