/*
 * Utilitare. Layerul e ultimul în cascadă, deci bat orice componentă.
 * Ține lista scurtă intenționat — dacă trebuie mai mult de atât, e o componentă.
 */
/*
 * Layerul e declarat AICI, în interiorul fișierului, nu prin `@import … layer()`
 * în main.css. Motivul e practic: minificatorul de CSS din LiteSpeed Cache
 * rescrie @import-urile și pierde funcția layer(), ceea ce ar anula complet
 * ordinea de cascadă în producție. Un bloc @layer e un at-rule obișnuit și
 * supraviețuiește oricărei minificări sau combinări.
 */
@layer utilities {
  /*
   * Saltul buclei unui carusel: cât ține, nimic nu se animează.
   *
   * `carousel.js` mută derularea de pe o clonă pe cadrul real echivalent,
   * instantaneu, și odată cu ea marcajul `is-active`. Cadrele arată la fel,
   * deci saltul nu se vede — dar vecinul cadrului activ e desenat altfel
   * (micșorat la „Dantură Fixă”, estompat la cazurile clinice), iar acea
   * diferență are tranziție: fără regula asta, cardul din stânga se schimba
   * lin la o treime de secundă după salt, ca și cum poza s-ar fi schimbat
   * singură.
   *
   * Layerul e ultimul, deci regula bate tranzițiile componentelor fără
   * `!important`.
   */
  [data-carousel-jump],
  [data-carousel-jump] * {
    transition: none;
  }

  .visually-hidden:not(:focus):not(:active) {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .text-muted {
    color: var(--color-text-muted);
  }

  .text-center {
    text-align: center;
  }

  .mt-0 {
    margin-block-start: 0;
  }

  [hidden] {
    display: none !important;
  }
}