/* ============================================================
   DESIGN TOKENS: TRANSITIONS
   ============================================================ */

:root {
    /* ========================================
       TIMING FUNCTIONS
       ======================================== */
    --ds-ease: cubic-bezier(0.4, 0, 0.2, 1);

    /* ========================================
       DURATIONS
       ======================================== */
    --ds-duration-fast: 150ms;
    --ds-duration-base: 250ms;

    /* ========================================
       COMMON TRANSITIONS
       ======================================== */
    --ds-transition-color: color var(--ds-duration-base) var(--ds-ease),
                           background-color var(--ds-duration-base) var(--ds-ease),
                           border-color var(--ds-duration-base) var(--ds-ease);
}