/*
 * Transparent icon surfaces for the patient and staff app.
 * Keep each existing layout/touch box; only the decorative tile disappears.
 * The explicit list avoids changing cards, inputs, selections and image tools.
 */
#app .entry-page__route-icon,
#app .patient-login__hero-icon,
#app .patient-register__hero-icon,
#app .staff-login__role-icon,
#app .patient-home__quick-icon,
#app .patient-home__status-icon,
#app .staff-home__hero-icon,
#app .staff-home__route-icon,
#app .nurse-workbench__entry-icon,
#app .profile__avatar-shell,
#app .profile__avatar-inner,
#app .profile__doctor-icon,
#app .profile__menu-icon,
#app .staff-profile__avatar,
#app .staff-profile__menu-icon,
#app .patient-records__identity-icon,
#app .care__assistant-icon,
#app .care__consultation-file-icon,
#app .services__stored-icon,
#app .nurse-appointments__material-icon,
#app .proto-back,
#app .soft-top-button,
#app .patient-home__bell,
#app .staff-home__logout {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

/* Percentage sizes follow each page's existing responsive rem-based slot. */
#app .entry-page__route-icon {
  --app-symbol-size: 73.077%; /* 38 in the existing 52 slot */
}

#app .patient-login__hero-icon,
#app .patient-register__hero-icon {
  --app-symbol-size: 75%; /* 42 in the existing 56 slot */
}

#app .staff-login__role-icon {
  --app-symbol-size: 74.074%; /* 40 in the existing 54 slot */
}

#app .patient-home__quick-icon {
  --app-symbol-size: 85.714%; /* Existing 48 in the 56 slot */
}

#app .patient-home__status-icon {
  --app-symbol-size: 82.759%; /* 24 in the existing 29 slot */
}

#app .staff-home__hero-icon {
  --app-symbol-size: 75.862%; /* 44 in the existing 58 slot */
}

#app .staff-home__route-icon,
#app .nurse-workbench__entry-icon,
#app .care__assistant-icon {
  --app-symbol-size: 75%; /* 36 in the existing 48 slot */
}

#app .profile__avatar-shell {
  padding: 0;
}

#app .profile__avatar-inner {
  --app-symbol-size: 75.676%; /* Approximately 56 in the 74 avatar slot */
}

#app .profile__doctor-icon {
  --app-symbol-size: 77.778%; /* 28 in the existing 36 slot */
}

#app .profile__menu-icon,
#app .services__stored-icon {
  --app-symbol-size: 75.862%; /* 22 in the existing 29 slot */
}

#app .staff-profile__menu-icon {
  --app-symbol-size: 71.429%; /* 30 in the existing 42 slot */
}

#app .patient-records__identity-icon {
  --app-symbol-size: 74.419%; /* 32 in the existing 43 slot */
}

#app .proto-back,
#app .soft-top-button,
#app .patient-home__bell,
#app .staff-home__logout {
  --app-symbol-size: 1.5rem;
}

/* Icon has inline dimensions from the shared Vue component. */
#app .entry-page__route-icon .ui-icon,
#app .patient-login__hero-icon .ui-icon,
#app .patient-register__hero-icon .ui-icon,
#app .staff-login__role-icon .ui-icon,
#app .patient-home__quick-icon .ui-icon,
#app .patient-home__status-icon .ui-icon,
#app .staff-home__hero-icon .ui-icon,
#app .staff-home__route-icon .ui-icon,
#app .nurse-workbench__entry-icon .ui-icon,
#app .profile__avatar-inner .ui-icon,
#app .profile__doctor-icon .ui-icon,
#app .profile__menu-icon .ui-icon,
#app .staff-profile__menu-icon .ui-icon,
#app .patient-records__identity-icon .ui-icon,
#app .care__assistant-icon .ui-icon,
#app .services__stored-icon .ui-icon,
#app .proto-back .ui-icon,
#app .soft-top-button .ui-icon,
#app .patient-home__bell .ui-icon,
#app .staff-home__logout .ui-icon {
  width: var(--app-symbol-size) !important;
  height: var(--app-symbol-size) !important;
  max-width: 90%;
  max-height: 90%;
}

/* Initials and file-type labels remain legible without a decorative tile. */
#app .staff-profile__avatar {
  font-size: 1.75rem;
}

#app .care__consultation-file-icon,
#app .nurse-appointments__material-icon {
  font-size: .6875rem;
}

/* Preserve a visible keyboard target after removing icon button surfaces. */
#app .proto-back:focus-visible,
#app .soft-top-button:focus-visible,
#app .patient-home__bell:focus-visible,
#app .staff-home__logout:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}