/* ═══════════════════════════════════════════════════════════════
   HoK Vault — Micro-Interaction Animations
   Apple-Inspired Tactile Physics & Smooth Transitions
   Restrained Motion · No White Glow · Fast & Subtle
   ═══════════════════════════════════════════════════════════════ */

/* ───────────── PRESS ACTIVE PHYSICS ───────────── */

.glass-btn-primary:active,
.glass-btn-ghost:active,
.glass-btn-danger:active,
.glass-btn-icon:active,
.nav-pill:active,
.mobile-tab:active,
.scheme-btn:active {
  transform: scale(0.96) !important;
  transition: transform 0.1s cubic-bezier(0.4, 0, 0.2, 1);
}


/* ───────────── DROPDOWN SMOOTH OPEN & CLOSE ───────────── */

.dropdown .dropdown-content {
  opacity: 0;
  visibility: hidden;
  transform: scale(0.95) translateY(-6px);
  transform-origin: top right;
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              visibility 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
}

.dropdown:focus-within .dropdown-content,
.dropdown-open .dropdown-content,
.dropdown:focus .dropdown-content {
  opacity: 1;
  visibility: visible;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}


/* ───────────── STAT CARD HOVER INTERACTIONS ───────────── */

.glass-stat {
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              border-color 0.3s ease,
              box-shadow 0.3s ease;
}

.glass-stat:hover .stat-icon-wrap {
  transform: scale(1.08);
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.glass-stat .stat-icon-wrap {
  transition: transform 0.25s ease;
}


/* ───────────── ACTIVE NAV PILL ICON POP ───────────── */

.nav-pill.active i {
  animation: pillIconPop 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes pillIconPop {
  0% { transform: scale(0.7); }
  50% { transform: scale(1.2); }
  100% { transform: scale(1); }
}


/* ───────────── UPLOAD ZONE HOVER ICON LIFT ───────────── */

.upload-zone {
  transition: border-color 0.25s ease, background-color 0.25s ease;
}

.upload-zone:hover .upload-zone-content i {
  transform: translateY(-3px) scale(1.08);
  color: var(--accent);
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1),
              color 0.25s ease;
}


/* ───────────── LIQUID GLASS INPUT FOCUS ───────────── */

.glass-input:focus,
.glass-select:focus {
  transition: border-color 0.2s ease,
              box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1),
              background 0.2s ease;
}


/* ───────────── SMOOTH PAGE-LEVEL SCHEME TRANSITION ───────────── */

html {
  transition: background-color 0.4s ease;
}

html[data-scheme] * {
  transition-property: background-color, border-color, color, box-shadow, opacity;
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Preserve intentional transition overrides */
.skin-card,
.skin-card *,
.glass-btn-primary,
.glass-btn-ghost,
.glass-btn-danger,
.glass-btn-icon,
.nav-pill,
.mobile-tab,
.glass-stat,
input[type="range"],
.progress-fill,
.confetti-piece,
.particle,
.orb {
  transition-property: all;
}
