/**
 * Spring Physics Animations — PharmAssist
 *
 * Replaces flat ease/linear transitions with a CSS linear() spring easing
 * that gives widgets a "settle into place" premium feel.
 *
 * Spring parameters: stiffness ≈ 300, damping ≈ 30 (slight overshoot, fast settle)
 */

/* ─────────────────────────────────────────────
   Spring easing — registered as a custom prop
   so it can be referenced anywhere
   ───────────────────────────────────────────── */
:root {
    /* Spring easing: overshoots ~2% then settles cleanly */
    --ease-spring: linear(
        0, 0.009, 0.035 2.1%, 0.141, 0.281 6.7%,
        0.723 12.9%, 0.938 16.7%, 1.017, 1.077, 1.121,
        1.149 24.3%, 1.159, 1.163, 1.161,
        1.154 29.9%, 1.129 32.8%, 1.051 39.6%,
        1.017 43.1%, 0.991 45.7%, 0.977, 0.975 51%,
        0.997 55%, 1.003 58%, 1.004 61.3%, 1 66.3%,
        0.999 69.7%, 1
    );

    /* Gentle spring — no overshoot, just a smooth settling curve */
    --ease-spring-gentle: linear(
        0, 0.006, 0.025 2.8%, 0.101 6.1%, 0.539 18.9%,
        0.721 25.3%, 0.849 31.5%, 0.937 38.1%, 0.968 41.8%,
        1.003 51.4%, 1.006 56.3%, 1
    );

    /* Bounce spring — snappier, for small interactive elements */
    --ease-spring-bounce: linear(
        0, 0.004, 0.016, 0.035, 0.063, 0.098, 0.141,
        0.25 8.3%, 0.538 16.7%, 0.654, 0.738, 0.775 25%,
        0.816, 0.853, 0.888 33.3%, 0.913, 0.933, 0.948,
        0.961, 0.97, 0.977 45.8%, 0.994 50%, 1.003 54.2%,
        1.006 58.3%, 1.002 62.5%, 1
    );

    /* Override the flat transition variables with spring variants */
    --transition-fast:   0.35s var(--ease-spring);
    --transition-normal: 0.5s  var(--ease-spring-gentle);
    --transition-spring: 0.4s  var(--ease-spring);
    --transition-bounce: 0.3s  var(--ease-spring-bounce);
}

/* ─────────────────────────────────────────────
   Global spring overrides
   ───────────────────────────────────────────── */

/* Buttons: spring rise on hover, spring back on release */
.btn,
.btn-save,
.btn-reset,
.back-btn,
.logout-btn,
.print-btn,
.icon-btn,
.dark-mode-btn,
.card-button,
.quick-link {
    transition:
        transform      var(--transition-bounce),
        box-shadow     var(--transition-spring),
        background     var(--transition-fast),
        border-color   var(--transition-fast),
        color          var(--transition-fast),
        opacity        var(--transition-fast);
    will-change: transform;
}

/* Cards: spring settle on hover */
.card,
.tool-card,
.settings-card,
.info-card,
.theme-card {
    transition:
        transform      var(--transition-spring),
        box-shadow     var(--transition-spring),
        border-color   var(--transition-fast),
        background     var(--transition-fast);
    will-change: transform;
}

/* Sidebar items: spring translate-x on hover */
.sidebar-item {
    transition:
        transform      var(--transition-bounce),
        background     var(--transition-fast),
        color          var(--transition-fast),
        padding-left   var(--transition-spring);
}

.sidebar-item:hover {
    transform: translateX(3px);
}

/* Form inputs: spring border glow */
.form-input,
.form-select,
.form-textarea {
    transition:
        border-color   var(--transition-fast),
        box-shadow     var(--transition-spring),
        background     var(--transition-fast);
}

/* Modal: spring pop-in */
.modal-content {
    transition:
        transform      var(--transition-spring),
        opacity        var(--transition-fast);
}

/* Widget tabs: spring underline */
.widget-tab {
    transition:
        background     var(--transition-fast),
        color          var(--transition-fast),
        transform      var(--transition-bounce),
        box-shadow     var(--transition-spring);
}

.widget-tab:hover {
    transform: translateY(-1px);
}

.widget-tab.active {
    transform: translateY(0);
}

/* Sidebar collapse: spring width */
.sidebar {
    transition:
        width          var(--transition-spring),
        min-width      var(--transition-spring);
}

/* Body theme switch: spring background change */
body {
    transition:
        background     var(--transition-normal),
        color          var(--transition-normal);
}

/* ─────────────────────────────────────────────
   Reduced-motion override — respect user pref
   ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    :root {
        --ease-spring:        ease;
        --ease-spring-gentle: ease;
        --ease-spring-bounce: ease;
        --transition-fast:    0.15s ease;
        --transition-normal:  0.2s  ease;
        --transition-spring:  0.15s ease;
        --transition-bounce:  0.15s ease;
    }

    .sidebar-item:hover {
        transform: none;
    }
}