/* Behaviour styles that React/Radix handled at runtime in the original build. */

/* Mobile drawer menu */
#mobile-menu-overlay { transition: opacity .3s ease; }
#mobile-menu-overlay[data-state="closed"] { opacity: 0; pointer-events: none; visibility: hidden; transition: opacity .3s ease, visibility 0s .3s; }
#mobile-menu { transition: transform .5s cubic-bezier(.32,.72,0,1); outline: none; }
#mobile-menu[data-state="closed"] { transform: translateY(100%); visibility: hidden; transition: transform .5s cubic-bezier(.32,.72,0,1), visibility 0s .5s; }
#mobile-menu[data-state="open"] { transform: translateY(0); }
@media (min-width: 768px) { #mobile-menu, #mobile-menu-overlay { display: none; } }

/* Hidden tab panels */
[role="tabpanel"][hidden] { display: none !important; }

/* Toasts */
#toast-viewport { pointer-events: none; }
.samwf-toast { animation: samwf-toast-in .3s ease-out; }
.samwf-toast-out { animation: samwf-toast-out .2s ease-in forwards; }
@keyframes samwf-toast-in { from { transform: translateY(100%); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes samwf-toast-out { to { transform: translateX(100%); opacity: 0; } }
@media (max-width: 639px) { @keyframes samwf-toast-in { from { transform: translateY(-100%); opacity: 0; } to { transform: none; opacity: 1; } } }
