/*
 * Sayyarati V84.53 — Font Awesome integration helpers.
 * --------------------------------------------------------------------------
 * Font Awesome itself is loaded locally from:
 *   /vendor/fontawesome/css/all.min.css
 *
 * Usage examples:
 *   <i class="fa-solid fa-car" aria-hidden="true"></i>
 *   <i class="fa-regular fa-bell" aria-hidden="true"></i>
 *   <i class="fa-brands fa-whatsapp" aria-hidden="true"></i>
 *
 * Keep icon names in the EJS/HTML template. Use the helpers below only for
 * alignment and sizing; do not edit the vendor CSS directly.
 */

/* A predictable inline icon that follows the surrounding text color. */
.fa-sy-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.25em;
  min-width:1.25em;
  height:1.25em;
  color:currentColor;
  line-height:1;
  vertical-align:-.125em;
}

/* Icon + label layout suitable for Arabic RTL and English LTR text. */
.fa-sy-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55em;
}

/* Circular/square icon holder used in buttons and compact cards. */
.fa-sy-box{
  display:inline-grid;
  place-items:center;
  width:2.5rem;
  height:2.5rem;
  flex:0 0 2.5rem;
  border-radius:.8rem;
  color:currentColor;
  background:color-mix(in srgb,currentColor 9%,transparent);
}

/* Prevent Font Awesome icons from inheriting SVG-specific rules. */
.fa-solid,
.fa-regular,
.fa-brands,
.fas,
.far,
.fab{
  flex-shrink:0;
}

/* Respect users who prefer reduced motion when animation utilities are used. */
@media (prefers-reduced-motion:reduce){
  .fa-beat,
  .fa-bounce,
  .fa-fade,
  .fa-flip,
  .fa-shake,
  .fa-spin,
  .fa-spin-pulse{
    animation:none!important;
  }
}
