/*
 * App styles shared by every page.
 * Theme styles come from static/vuexy/ (Vuexy); put our own overrides here, not in the theme files.
 */

/* Icon helpers that Tabler's old webfont had and Vuexy's iconify icons dropped */
.icon-spin {
  animation: icon-spin 2s linear infinite;
}

.icon-pulse {
  animation: icon-pulse 1.5s ease-in-out infinite;
}

@keyframes icon-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes icon-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

.icon-2x { block-size: 32px !important; font-size: 32px !important; inline-size: 32px !important; }
.icon-3x { block-size: 48px !important; font-size: 48px !important; inline-size: 48px !important; }
.icon-4x { block-size: 64px !important; font-size: 64px !important; inline-size: 64px !important; }

/* Brand logo in the navbar */
.app-brand-link img {
  max-height: 40px;
  object-fit: contain;
}

/* Navbar search: centre the icon and size it like the other 22px navbar icons */
.layout-navbar .navbar-search-wrapper .search-toggler,
.layout-navbar .navbar-search-wrapper .aa-Autocomplete,
.layout-navbar-full.layout-horizontal .layout-navbar .search-toggler .aa-DetachedSearchButton {
  display: flex;
  align-items: center;
  justify-content: center;
}
.layout-navbar .search-toggler .aa-DetachedSearchButtonIcon {
  color: var(--bs-heading-color);
}
.layout-navbar .search-toggler .aa-DetachedSearchButtonIcon::before {
  block-size: 22px;
  inline-size: 22px;
  margin-block-end: 0;
}