/* ==========================================================================
   Szakilap – letisztult, központi animációk
   ========================================================================== */

@keyframes sz-backdrop-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes sz-backdrop-out {
  from { opacity: 1; }
  to   { opacity: 0; }
}

@keyframes sz-modal-in {
  from {
    opacity: 0;
    transform: translateY(14px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes sz-modal-out {
  from {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(8px) scale(0.985);
  }
}

/* --- Oldalsó menü: nincs hover --- */
.sidebar .nav-link:hover,
.sidebar .nav-link:focus-visible {
  background: transparent;
  color: var(--sidebar-text);
  transform: none;
}
.sidebar .nav-link.active:hover,
.sidebar .nav-link.active:focus-visible {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent);
}

/* --- Gombok (interakció, nem konténer) --- */
.sz-motion-ready .btn {
  transition:
    background var(--duration-fast) var(--ease-in-out),
    border-color var(--duration-fast) var(--ease-in-out),
    color var(--duration-fast) var(--ease-in-out),
    box-shadow var(--duration-fast) var(--ease-in-out),
    transform var(--duration-fast) var(--ease-out),
    opacity var(--duration-fast) var(--ease-in-out);
}
.sz-motion-ready .btn:hover:not(:disabled) {
  transform: translateY(-1px);
}
.sz-motion-ready .btn:active:not(:disabled) {
  transform: translateY(0) scale(0.98);
  transition-duration: 80ms;
}

/* --- Táblázat sorok --- */
.sz-motion-ready .table tbody tr {
  transition: background-color var(--duration-fast) var(--ease-in-out);
}

/* --- Űrlapok --- */
.sz-motion-ready .form-control,
.sz-motion-ready .form-select,
.sz-motion-ready .form-textarea {
  transition:
    border-color var(--duration-base) var(--ease-in-out),
    box-shadow var(--duration-base) var(--ease-in-out),
    background-color var(--duration-base) var(--ease-in-out);
}
.sz-motion-ready .form-control:focus,
.sz-motion-ready .form-select:focus,
.sz-motion-ready .form-textarea:focus {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}

/* --- Modál --- */
.sz-motion-ready .modal-backdrop {
  animation: none;
  background: rgba(15, 23, 42, 0);
  transition: background var(--duration-base) var(--ease-out);
}
.sz-motion-ready .modal-backdrop.open {
  background: rgba(15, 23, 42, 0.55);
  animation: sz-backdrop-in var(--duration-base) var(--ease-out) forwards;
}
.sz-motion-ready .modal-backdrop.open.is-closing {
  animation: sz-backdrop-out var(--duration-fast) var(--ease-in-out) forwards;
}
.sz-motion-ready .modal-backdrop .modal {
  animation: none;
  opacity: 0;
  transform: translateY(14px) scale(0.98);
}
.sz-motion-ready .modal-backdrop.open .modal {
  animation: sz-modal-in calc(var(--duration-base) + 60ms) var(--ease-out) forwards;
}
.sz-motion-ready .modal-backdrop.open.is-closing .modal {
  animation: sz-modal-out var(--duration-fast) var(--ease-in-out) forwards;
}

/* --- Súgó buborék --- */
.sz-motion-ready .help-popover__panel {
  transform: translateY(4px) scale(0.98);
  transform-origin: top left;
  transition:
    opacity var(--duration-base) var(--ease-out),
    visibility var(--duration-base) var(--ease-out),
    transform var(--duration-base) var(--ease-out);
}
.sz-motion-ready .help-popover:hover .help-popover__panel,
.sz-motion-ready .help-popover:focus-within .help-popover__panel,
.sz-motion-ready .help-popover.is-open .help-popover__panel {
  transform: translateY(0) scale(1);
}

[data-loading="1"] {
  pointer-events: none;
  opacity: 0.65;
}

/* --- Felső sáv --- */
.sz-motion-ready .page-top-bar__back,
.sz-motion-ready .page-top-bar__actions .btn {
  transition:
    color var(--duration-fast) var(--ease-in-out),
    background var(--duration-fast) var(--ease-in-out);
}

/* --- Csökkentett mozgás --- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0.01ms;
    --duration-base: 0.01ms;
    --duration-slow: 0.01ms;
    --duration-enter: 0.01ms;
    --stagger-step: 0ms;
  }

  .sz-motion-ready .btn:hover:not(:disabled),
  .sz-motion-ready .btn:active:not(:disabled) {
    transform: none;
  }

  .sz-motion-ready .modal-backdrop.open,
  .sz-motion-ready .modal-backdrop.open .modal {
    animation: none !important;
    opacity: 1;
    transform: none;
  }

  .sz-motion-ready .help-popover__panel {
    transform: none;
  }
}
