/* =====================================================
   FLY — Animations & micro-interactions partagées
   Ne redéfinit aucune couleur : s'appuie sur la charte
   graphique existante (bleu #0284C7, cartes arrondies,
   badges de statut, dégradé sidebar).
   ===================================================== */

:root {
    --fly-ease: cubic-bezier(.4, 0, .2, 1);
}

@keyframes flyFadeInUp {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes flyFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes flyScaleIn {
    from { opacity: 0; transform: scale(.94); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes flyPulseSoft {
    0%, 100% { box-shadow: 0 0 0 0 rgba(2, 132, 199, .25); }
    50%      { box-shadow: 0 0 0 6px rgba(2, 132, 199, 0); }
}

/* Apparition douce pour les pages sans carte dédiée (ex: accueil) */
.hero-fade {
    animation: flyFadeInUp .5s var(--fly-ease) both;
}

/* Cartes : entrée douce (le relief au survol déjà défini par page est conservé) */
.job-card,
.formation-card,
.stat-card,
.card-box,
.admin-card,
.login-card,
.apply-card,
.subscribe-card,
.form-card,
.profile-card,
.job-header-card,
.formation-header-card {
    animation: flyFadeInUp .45s var(--fly-ease) both;
}

/* Cascade dans les grilles de cartes (offres, formations, prestataires, stats) */
.row.g-3 > *:nth-child(2) > *, .row.g-4 > *:nth-child(2) > * { animation-delay: .05s; }
.row.g-3 > *:nth-child(3) > *, .row.g-4 > *:nth-child(3) > * { animation-delay: .10s; }
.row.g-3 > *:nth-child(4) > *, .row.g-4 > *:nth-child(4) > * { animation-delay: .15s; }
.row.g-3 > *:nth-child(5) > *, .row.g-4 > *:nth-child(5) > * { animation-delay: .20s; }
.row.g-3 > *:nth-child(6) > *, .row.g-4 > *:nth-child(6) > * { animation-delay: .25s; }
.row.g-3 > *:nth-child(n+7) > *, .row.g-4 > *:nth-child(n+7) > * { animation-delay: .30s; }

/* Lignes de tableau (utilisateurs, candidatures, inscrits) */
.table tbody tr {
    animation: flyFadeIn .35s var(--fly-ease) both;
}

/* Alertes */
.alert {
    animation: flyFadeInUp .35s var(--fly-ease) both;
}

/* Logo : petite entrée (le hover existant est conservé) */
.logo-box img {
    animation: flyScaleIn .5s var(--fly-ease) both;
}

/* Avatars : léger zoom au survol */
.avatar,
.avatar-placeholder {
    transition: transform .2s var(--fly-ease);
}
.avatar:hover,
.avatar-placeholder:hover {
    transform: scale(1.08);
}

/* Sidebar : indicateur qui glisse au survol / lien actif */
.sidebar-menu a {
    position: relative;
    overflow: hidden;
}
.sidebar-menu a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 3px;
    height: 0;
    background: #fff;
    border-radius: 3px;
    transform: translateY(-50%);
    transition: height .2s var(--fly-ease);
}
.sidebar-menu a:hover::before,
.sidebar-menu a.active-link::before {
    height: 55%;
}

/* Boutons & liens : transitions douces + micro-retour tactile */
.btn, a {
    transition: background-color .2s var(--fly-ease), color .2s var(--fly-ease),
                transform .15s var(--fly-ease), box-shadow .2s var(--fly-ease),
                border-color .2s var(--fly-ease);
}
.btn:hover {
    transform: translateY(-1px);
}
.btn:active {
    transform: scale(.97);
}

/* Champs de formulaire : focus plus visible */
.form-control:focus {
    border-color: #0284C7;
    box-shadow: 0 0 0 4px rgba(2, 132, 199, .12);
}

/* Badges "en attente" : légère pulsation pour attirer l'oeil */
.badge-status.pending,
.badge-warning {
    animation: flyPulseSoft 2.4s ease-in-out infinite;
}

/* Respect des préférences d'accessibilité (mouvement réduit) */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}
