lyraxis-notification 1.0.0 → 1.0.2

package/style.css

@@ -1,915 +1,16 @@
-:root {
-  --lyn-bg: rgb(255, 255, 255);
-  --lyn-surface: #fff;
-  --lyn-overlay: rgba(0, 0, 0, .45);
-  --lyn-border: #e5e7eb;
-  --lyn-text: #000;
-  --lyn-text-muted: #666;
-  --lyn-brand: #b0be1f;
-  --lyn-brand-hover: rgba(49, 122, 156, .1);
-  --lyn-error-bg: rgba(255, 7, 7, .9);
-  --lyn-toast-icon-bg: #f3f4f6;
-}
-
-body.lynDark {
-  --lyn-bg: #1e1e1e;
-  --lyn-surface: #242424;
-  --lyn-overlay: rgba(0, 0, 0, .75);
-  --lyn-border: #333;
-  --lyn-text: #fff;
-  --lyn-text-muted: #aaa;
-  --lyn-brand: #d0e505;
-  --lyn-brand-hover: rgba(75, 163, 203, .15);
-  --lyn-error-bg: rgba(200, 0, 0, .9);
-  --lyn-toast-icon-bg: #333;
-}
-
-body.no-scroll {
-  overflow: hidden !important;
-}
-
-.line {
-  width: calc(100% - 60px);
-  height: 2px;
-  margin: 15px 0;
-  background: linear-gradient(
-    to right,
-    #d0e505,
-    transparent
-  );
-}
-
-.message-log,
-.message-error {
-  position: fixed !important;
-  bottom: 20px !important;
-  left: 50% !important;
-  transform: translateX(-50%) !important;
-
-  font-size: 15px !important;
-  border-radius: 20px !important;
-  text-align: center !important;
-
-  overflow: hidden !important;
-  white-space: nowrap !important;
-
-  min-width: 0 !important;
-
-  transition:
-    max-width .5s,
-    min-width .5s,
-    padding .5s,
-    opacity .5s !important;
-
-  z-index: 10000000 !important;
-  opacity: 0 !important;
-}
-
-.message-log {
-  color: var(--lyn-text) !important;
-  background: var(--lyn-surface) !important;
-  box-shadow:
-    0 4px 12px rgba(0, 0, 0, .15) !important;
-}
-
-.message-error {
-  color: #fff !important;
-  background: var(--lyn-error-bg) !important;
-  box-shadow:
-    0 4px 12px rgba(255, 7, 7, .2) !important;
-}
-
-.message-log.show,
-.message-error.show {
-  max-width: 400px !important;
-  min-width: 200px !important;
-  padding: 15px 25px !important;
-  opacity: 1 !important;
-}
-
-.message-log.hide,
-.message-error.hide {
-  max-width: 0 !important;
-  min-width: 0 !important;
-  padding: 0 !important;
-  opacity: 0 !important;
-}
-
-.message-sistem-overlay {
-  position: fixed !important;
-  inset: 0 !important;
-
-  width: 100vw !important;
-  height: 100vh !important;
-
-  background: var(--lyn-overlay) !important;
-
-  z-index: 10000000 !important;
-
-  display: flex !important;
-  align-items: center !important;
-  justify-content: center !important;
-
-  backdrop-filter: blur(6px) !important;
-
-  animation:
-    lyPopOverlay .2s ease-out !important;
-}
-
-@keyframes lyPopOverlay {
-  from {
-    backdrop-filter: blur(0);
-  }
-
-  to {
-    backdrop-filter: blur(6px);
-  }
-}
-
-.message-sistem-boxinfo {
-  box-sizing: border-box !important;
-
-  width: 90% !important;
-  max-width: 500px !important;
-  max-height: 75vh !important;
-
-  background: var(--lyn-bg) !important;
-
-  border-radius: 25px !important;
-
-  display: flex !important;
-  flex-direction: column !important;
-
-  z-index: 10000001 !important;
-
-  box-shadow:
-    0 10px 25px rgba(0, 0, 0, .2) !important;
-
-  animation:
-    lyPop .5s cubic-bezier(
+:root{--lyn-bg:rgb(255, 255, 255);--lyn-surface:#fff;--lyn-overlay:rgba(0, 0, 0, .45);--lyn-border:#e5e7eb;--lyn-text:#000;--lyn-text-muted:#666;--lyn-brand:#b0be1f;--lyn-brand-hover:rgba(49, 122, 156, .1);--lyn-error-bg:rgba(255, 7, 7, .9);--lyn-toast-icon-bg:#f3f4f6}body.lynDark{--lyn-bg:#1e1e1e;--lyn-surface:#242424;--lyn-overlay:rgba(0, 0, 0, .75);--lyn-border:#333;--lyn-text:#fff;--lyn-text-muted:#aaa;--lyn-brand:#d0e505;--lyn-brand-hover:rgba(75, 163, 203, .15);--lyn-error-bg:rgba(200, 0, 0, .9);--lyn-toast-icon-bg:#333}body.no-scroll{overflow:hidden!important}.line{width:calc(100% - 60px);height:2px;margin:15px 0;background:linear-gradient(to right,#d0e505,transparent)}.message-error,.message-log{position:fixed!important;bottom:20px!important;left:50%!important;transform:translateX(-50%)!important;font-size:15px!important;border-radius:20px!important;text-align:center!important;overflow:hidden!important;white-space:nowrap!important;min-width:0!important;transition:max-width .5s,min-width .5s,padding .5s,opacity .5s!important;z-index:10000000!important;opacity:0!important}.message-log{color:var(--lyn-text)!important;background:var(--lyn-surface)!important;box-shadow:0 4px 12px rgba(0,0,0,.15)!important}.message-error{color:#fff!important;background:var(--lyn-error-bg)!important;box-shadow:0 4px 12px rgba(255,7,7,.2)!important}.message-error.show,.message-log.show{max-width:400px!important;min-width:200px!important;padding:15px 25px!important;opacity:1!important}.message-error.hide,.message-log.hide{max-width:0!important;min-width:0!important;padding:0!important;opacity:0!important}.message-sistem-overlay{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;background:var(--lyn-overlay)!important;z-index:10000000!important;display:flex!important;align-items:center!important;justify-content:center!important;backdrop-filter:blur(6px)!important;animation:lyPopOverlay .2s ease-out!important}@keyframes lyPopOverlay{from{backdrop-filter:blur(0)}to{backdrop-filter:blur(6px)}}.message-sistem-boxinfo{box-sizing:border-box!important;width:90%!important;max-width:500px!important;max-height:75vh!important;background:var(--lyn-bg)!important;border-radius:25px!important;display:flex!important;flex-direction:column!important;z-index:10000001!important;box-shadow:0 10px 25px rgba(0,0,0,.2)!important;animation:lyPop .5s cubic-bezier(.34,1.56,.64,1)!important;padding:25px!important}@keyframes lyPop{from{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.message-sistem-header{display:flex!important;justify-content:space-between!important;align-items:flex-start!important;gap:15px!important;border-radius:15px 15px 0 0!important}.message-sistem-header-text{min-width:0!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;text-align:left!important;flex:1!important}.message-sistem-subtitle{margin:0 0 3px 0!important;color:var(--lyn-text-muted)!important;font-size:.85em!important;font-weight:300!important;letter-spacing:1px!important;line-height:1.3!important}.message-sistem-title{margin:0!important;color:var(--lyn-text)!important;font-size:1.8em!important;font-weight:400!important;line-height:1.25!important}.icon-message-sistem-custom-button{width:1.5em!important;height:1.5em!important;vertical-align:middle!important;fill:currentColor!important}.message-sistem-content{display:flex!important;flex-direction:column!important;overflow-y:auto!important}.message-sistem-content img{max-width:100%!important}.message-sistem-message{font-size:1em!important;margin:0!important;color:var(--lyn-text)!important;opacity:.85!important;text-align:left!important;line-height:1.5!important}.message-sistem-input{width:100%!important;padding:10px!important;outline:0!important;border:1.5px solid var(--lyn-brand)!important;border-radius:6px!important;box-sizing:border-box!important;font-size:1em!important;margin-top:10px!important;background:var(--lyn-surface)!important;color:var(--lyn-text)!important}.container-button{text-align:right!important;display:flex!important;justify-content:flex-end!important;gap:10px!important;margin-top:10px!important}.message-sistem-boxinfo button{all:unset!important;box-sizing:border-box!important;font-family:inherit!important;cursor:pointer!important}.message-sistem-boxinfo .message-sistem-custom-button{background:0 0!important;border:none!important;padding:0 5px!important;color:var(--lyn-text-muted)!important}.message-sistem-boxinfo .message-sistem-custom-button:hover{background:0 0!important;color:var(--lyn-text)!important}.message-sistem-boxinfo .container-button>button{font-size:1em!important;border:none!important;background:0 0!important;color:var(--lyn-brand)!important;border-radius:5px!important;padding:8px 15px!important;font-weight:600!important;transition:background .2s,color .2s!important}.message-sistem-boxinfo .container-button>button:hover{color:var(--lyn-brand)!important;background:var(--lyn-brand-hover)!important}.lyraxis-toast-container{position:fixed!important;top:20px!important;right:20px!important;z-index:10000002!important;width:350px!important;height:170px!important;pointer-events:none!important}.lyraxis-toast{pointer-events:auto!important;position:absolute!important;top:0!important;left:0!important;width:100%!important;border-radius:16px!important;padding:16px!important;box-sizing:border-box!important;display:flex!important;gap:12px!important;align-items:flex-start!important;box-shadow:0 10px 25px rgba(0,0,0,.15)!important;transition:transform .4s cubic-bezier(
       .34,
       1.56,
       .64,
       1
-    ) !important;
-
-  padding: 25px !important;
-}
-
-@keyframes lyPop {
-  from {
-    transform: scale(.9);
-    opacity: 0;
-  }
-
-  to {
-    transform: scale(1);
-    opacity: 1;
-  }
-}
-
-.message-sistem-header {
-  display: flex !important;
-  justify-content: space-between !important;
-  align-items: flex-start !important;
-
-  gap: 15px !important;
-
-  border-radius: 15px 15px 0 0 !important;
-}
-
-.message-sistem-header-text {
-  min-width: 0 !important;
-
-  display: flex !important;
-  flex-direction: column !important;
-  align-items: flex-start !important;
-
-  text-align: left !important;
-
-  flex: 1 !important;
-}
-
-.message-sistem-subtitle {
-  margin: 0 0 3px 0 !important;
-
-  color: var(--lyn-text-muted) !important;
-
-  font-size: .85em !important;
-  font-weight: 300 !important;
-  letter-spacing: 1px !important;
-
-  line-height: 1.3 !important;
-}
-
-.message-sistem-title {
-  margin: 0 !important;
-
-  color: var(--lyn-text) !important;
-
-  font-size: 1.80em !important;
-  font-weight: 400 !important;
-
-  line-height: 1.25 !important;
-}
-
-.icon-message-sistem-custom-button {
-  width: 1.5em !important;
-  height: 1.5em !important;
-
-  vertical-align: middle !important;
-
-  fill: currentColor !important;
-}
-
-.message-sistem-content {
-  display: flex !important;
-  flex-direction: column !important;
-
-  overflow-y: auto !important;
-}
-
-.message-sistem-content img {
-  max-width: 100% !important;
-}
-
-.message-sistem-message {
-  font-size: 1em !important;
-
-  margin: 0 !important;
-
-  color: var(--lyn-text) !important;
-
-  opacity: .85 !important;
-
-  text-align: left !important;
-
-  line-height: 1.5 !important;
-}
-
-.message-sistem-input {
-  width: 100% !important;
-
-  padding: 10px !important;
-
-  outline: none !important;
-
-  border:
-    1.5px solid var(--lyn-brand) !important;
-
-  border-radius: 6px !important;
-
-  box-sizing: border-box !important;
-
-  font-size: 1em !important;
-
-  margin-top: 10px !important;
-
-  background: var(--lyn-surface) !important;
-  color: var(--lyn-text) !important;
-}
-
-.container-button {
-  text-align: right !important;
-
-  display: flex !important;
-  justify-content: flex-end !important;
-
-  gap: 10px !important;
-
-  margin-top: 10px !important;
-}
-
-.message-sistem-boxinfo button {
-  all: unset !important;
-
-  box-sizing: border-box !important;
-
-  font-family: inherit !important;
-
-  cursor: pointer !important;
-}
-
-.message-sistem-boxinfo
-.message-sistem-custom-button {
-  background: transparent !important;
-
-  border: none !important;
-
-  padding: 0 5px !important;
-
-  color: var(--lyn-text-muted) !important;
-}
-
-.message-sistem-boxinfo
-.message-sistem-custom-button:hover {
-  background: transparent !important;
-
-  color: var(--lyn-text) !important;
-}
-
-.message-sistem-boxinfo
-.container-button > button {
-  font-size: 1em !important;
-
-  border: none !important;
-
-  background: transparent !important;
-
-  color: var(--lyn-brand) !important;
-
-  border-radius: 5px !important;
-
-  padding: 8px 15px !important;
-
-  font-weight: 600 !important;
-
-  transition:
-    background .2s,
-    color .2s !important;
-}
-
-.message-sistem-boxinfo
-.container-button > button:hover {
-  color: var(--lyn-brand) !important;
-
-  background:
-    var(--lyn-brand-hover) !important;
-}
-
-.lyraxis-toast-container {
-  position: fixed !important;
-
-  top: 20px !important;
-  right: 20px !important;
-
-  z-index: 10000002 !important;
-
-  width: 350px !important;
-  height: 170px !important;
-
-  pointer-events: none !important;
-}
-
-.lyraxis-toast {
-  pointer-events: auto !important;
-
-  position: absolute !important;
-
-  top: 0 !important;
-  left: 0 !important;
-
-  width: 100% !important;
-
-  border-radius: 16px !important;
-
-  padding: 16px !important;
-
-  box-sizing: border-box !important;
-
-  display: flex !important;
-
-  gap: 12px !important;
-
-  align-items: flex-start !important;
-
-  box-shadow:
-    0 10px 25px rgba(0, 0, 0, .15) !important;
-
-  transition:
-    transform .4s cubic-bezier(
-      .34,
-      1.56,
-      .64,
-      1
-    ),
-    opacity .3s ease !important;
-
-  font-family:
-    system-ui,
-    -apple-system,
-    BlinkMacSystemFont,
-    "Segoe UI",
-    Roboto,
-    sans-serif !important;
-
-  opacity: 0 !important;
-
-  transform:
-    translateY(-20px)
-    scale(.9) !important;
-}
-
-.lyraxis-toast[data-index="0"] {
-  opacity: 1 !important;
-
-  transform:
-    translateY(0)
-    scale(1) !important;
-
-  z-index: 10 !important;
-}
-
-.lyraxis-toast[data-index="1"] {
-  opacity: .85 !important;
-
-  transform:
-    translateY(-8px)
-    scale(.94) !important;
-
-  z-index: 9 !important;
-}
-
-.lyraxis-toast[data-index="2"] {
-  opacity: .6 !important;
-
-  transform:
-    translateY(-16px)
-    scale(.88) !important;
-
-  z-index: 8 !important;
-}
-
-.lyraxis-toast[data-index="3"] {
-  opacity: .3 !important;
-
-  transform:
-    translateY(-24px)
-    scale(.82) !important;
-
-  z-index: 7 !important;
-}
-
-.lyraxis-toast.hide {
-  opacity: 0 !important;
-
-  transform:
-    translateY(20px)
-    scale(.9) !important;
-}
-
-.lyraxis-toast-default {
-  background: var(--lyn-surface) !important;
-  color: var(--lyn-text) !important;
-
-  border:
-    1px solid var(--lyn-border) !important;
-}
-
-.lyraxis-toast-success {
-  background: #10b981 !important;
-  color: #fff !important;
-}
-
-.lyraxis-toast-error {
-  background: #ef4444 !important;
-  color: #fff !important;
-}
-
-.lyraxis-toast-icon {
-  width: 32px !important;
-  height: 32px !important;
-
-  border-radius: 10px !important;
-
-  display: flex !important;
-
-  align-items: center !important;
-  justify-content: center !important;
-
-  flex-shrink: 0 !important;
-}
-
-.lyraxis-toast-default
-.lyraxis-toast-icon {
-  background:
-    var(--lyn-toast-icon-bg) !important;
-
-  color: var(--lyn-brand) !important;
-}
-
-.lyraxis-toast-success
-.lyraxis-toast-icon,
-.lyraxis-toast-error
-.lyraxis-toast-icon {
-  background:
-    rgba(255, 255, 255, .2) !important;
-
-  color: #fff !important;
-}
-
-.lyraxis-toast-icon svg {
-  width: 18px !important;
-  height: 18px !important;
-
-  fill: currentColor !important;
-}
-
-.lyraxis-toast-body {
-  flex-grow: 1 !important;
-
-  display: flex !important;
-  flex-direction: column !important;
-
-  gap: 2px !important;
-
-  padding-right: 18px !important;
-}
-
-.lyraxis-toast-title {
-  font-size: .95em !important;
-
-  font-weight: 700 !important;
-
-  line-height: 1.3 !important;
-}
-
-.lyraxis-toast-message {
-  font-size: .85em !important;
-
-  line-height: 1.4 !important;
-
-  margin: 0 !important;
-
-  opacity: .9 !important;
-
-  word-break: break-word !important;
-}
-
-.lyraxis-toast-close {
-  position: absolute !important;
-
-  top: 14px !important;
-  right: 14px !important;
-
-  background: transparent !important;
-
-  border: none !important;
-
-  cursor: pointer !important;
-
-  padding: 2px !important;
-
-  display: flex !important;
-
-  align-items: center !important;
-  justify-content: center !important;
-
-  color: inherit !important;
-
-  opacity: .6 !important;
-}
-
-.lyraxis-toast-close:hover {
-  opacity: 1 !important;
-}
-
-.lyraxis-toast-close svg {
-  width: 14px !important;
-  height: 14px !important;
-
-  fill: currentColor !important;
-}
-
-.lyraxis-dynamic-container {
-  position: fixed !important;
-
-  bottom: 20px !important;
-  left: 50% !important;
-
-  transform:
-    translateX(-50%) !important;
-
-  width: 100% !important;
-  height: 70px !important;
-
-  display: flex !important;
-
-  justify-content: center !important;
-  align-items: flex-end !important;
-
-  pointer-events: none !important;
-
-  z-index: 10000001 !important;
-}
-
-.lyraxis-dynamic {
-  --dynamic-color: #9ca3af;
-
-  width: 52px;
-  height: 52px;
-
-  max-width:
-    calc(100vw - 32px);
-
-  border-radius: 30px;
-
-  background:
-    var(--lyn-surface);
-
-  color:
-    var(--lyn-text);
-
-  box-shadow:
-    0 5px 20px
-    rgba(0, 0, 0, .16);
-
-  border:
-    1px solid
-    rgba(0, 0, 0, .04);
-
-  display: flex;
-
-  align-items: center;
-
-  overflow: hidden;
-
-  opacity: 0;
-
-  transform:
-    translateY(80px);
-
-  transition:
-    width .55s cubic-bezier(
+    ),opacity .3s ease!important;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif!important;opacity:0!important;transform:translateY(-20px) scale(.9)!important}.lyraxis-toast[data-index="0"]{opacity:1!important;transform:translateY(0) scale(1)!important;z-index:10!important}.lyraxis-toast[data-index="1"]{opacity:.85!important;transform:translateY(-8px) scale(.94)!important;z-index:9!important}.lyraxis-toast[data-index="2"]{opacity:.6!important;transform:translateY(-16px) scale(.88)!important;z-index:8!important}.lyraxis-toast[data-index="3"]{opacity:.3!important;transform:translateY(-24px) scale(.82)!important;z-index:7!important}.lyraxis-toast.hide{opacity:0!important;transform:translateY(20px) scale(.9)!important}.lyraxis-toast-default{background:var(--lyn-surface)!important;color:var(--lyn-text)!important;border:1px solid var(--lyn-border)!important}.lyraxis-toast-success{background:#10b981!important;color:#fff!important}.lyraxis-toast-error{background:#ef4444!important;color:#fff!important}.lyraxis-toast-icon{width:32px!important;height:32px!important;border-radius:10px!important;display:flex!important;align-items:center!important;justify-content:center!important;flex-shrink:0!important}.lyraxis-toast-default .lyraxis-toast-icon{background:var(--lyn-toast-icon-bg)!important;color:var(--lyn-brand)!important}.lyraxis-toast-error .lyraxis-toast-icon,.lyraxis-toast-success .lyraxis-toast-icon{background:rgba(255,255,255,.2)!important;color:#fff!important}.lyraxis-toast-icon svg{width:18px!important;height:18px!important;fill:currentColor!important}.lyraxis-toast-body{flex-grow:1!important;display:flex!important;flex-direction:column!important;gap:2px!important;padding-right:18px!important}.lyraxis-toast-title{font-size:.95em!important;font-weight:700!important;line-height:1.3!important}.lyraxis-toast-message{font-size:.85em!important;line-height:1.4!important;margin:0!important;opacity:.9!important;word-break:break-word!important}.lyraxis-toast-close{position:absolute!important;top:14px!important;right:14px!important;background:0 0!important;border:none!important;cursor:pointer!important;padding:2px!important;display:flex!important;align-items:center!important;justify-content:center!important;color:inherit!important;opacity:.6!important}.lyraxis-toast-close:hover{opacity:1!important}.lyraxis-toast-close svg{width:14px!important;height:14px!important;fill:currentColor!important}.lyraxis-dynamic-container{position:fixed!important;bottom:20px!important;left:50%!important;transform:translateX(-50%)!important;width:100%!important;height:70px!important;display:flex!important;justify-content:center!important;align-items:flex-end!important;pointer-events:none!important;z-index:10000001!important}.lyraxis-dynamic{--dynamic-color:#9ca3af;width:52px;height:52px;max-width:calc(100vw - 32px);border-radius:30px;background:var(--lyn-surface);color:var(--lyn-text);box-shadow:0 5px 20px rgba(0,0,0,.16);border:1px solid rgba(0,0,0,.04);display:flex;align-items:center;overflow:hidden;opacity:0;transform:translateY(80px);transition:width .55s cubic-bezier(
       .34,
       1.25,
       .64,
       1
-    ),
-    height .35s ease,
-    transform 1s cubic-bezier(
+    ),height .35s ease,transform 1s cubic-bezier(
       .22,
       1,
       .36,
       1
-    ),
-    opacity .35s ease;
-
-  pointer-events: none;
-
-  box-sizing: border-box;
-
-  will-change:
-    width,
-    transform;
-}
-
-.lyraxis-dynamic.enter-ball {
-  opacity: 1;
-
-  transform:
-    translateY(0);
-}
-
-.lyraxis-dynamic.open {
-  width: var(--dynamic-width, 280px);
-  height: 52px;
-}
-
-.lyraxis-dynamic.close {
-  width: 52px;
-  height: 52px;
-
-  transform:
-    translateY(0);
-}
-
-.lyraxis-dynamic.leave {
-  opacity: 0;
-
-  transform:
-    translateY(80px);
-}
-
-.lyraxis-dynamic-icon {
-  width: 34px;
-  height: 34px;
-
-  min-width: 34px;
-
-  margin-left: 9px;
-
-  border-radius: 50%;
-
-  background:
-    var(--dynamic-color);
-
-  color: #fff;
-
-  display: flex;
-
-  align-items: center;
-  justify-content: center;
-
-  overflow: hidden;
-}
-
-.lyraxis-dynamic-icon svg {
-  width: 19px;
-  height: 19px;
-
-  fill: currentColor;
-
-  display: block;
-}
-
-.lyraxis-dynamic-content {
-  min-width: 0;
-
-  margin-left: 9px;
-  margin-right: 15px;
-
-  white-space: nowrap;
-
-  overflow: hidden;
-
-  opacity: 1;
-}
-
-.lyraxis-dynamic-message {
-  overflow: hidden;
-
-  text-overflow: ellipsis;
-
-  font-size: 14px;
-
-  font-weight: 600;
-
-  line-height: 18px;
-
-  white-space: nowrap;
-}
-
-.lyraxis-dynamic-status {
-  overflow: hidden;
-
-  text-overflow: ellipsis;
-
-  font-size: 11px;
-
-  line-height: 14px;
-
-  color:
-    var(--lyn-text-muted);
-
-  white-space: nowrap;
-}
-
-.lyraxis-dynamic.success {
-  --dynamic-color: #22c55e;
-}
-
-.lyraxis-dynamic.warning {
-  --dynamic-color: #eab308;
-}
-
-.lyraxis-dynamic.failed {
-  --dynamic-color: #ef4444;
-}
-
-.lyraxis-dynamic.active {
-  --dynamic-color: #3b82f6;
-}
-
-.lyraxis-dynamic.waiting {
-  --dynamic-color: #9ca3af;
-}
-
-.lyraxis-dynamic.default {
-  --dynamic-color: var(--lyn-brand);
-}
-
-.lyraxis-dynamic.notification
-.lyraxis-dynamic-icon {
-  animation:
-    lyDynamicNotification
-    .80s ease-in-out 3;
-}
-
-.lyraxis-dynamic.music
-.lyraxis-dynamic-icon svg {
-  animation:
-    lyDynamicMusic
-    1s linear infinite;
-}
-
-.lyraxis-dynamic.wait
-.lyraxis-dynamic-icon svg,
-.lyraxis-dynamic.waiting
-.lyraxis-dynamic-icon svg {
-  animation:
-    lyDynamicWait
-    1.2s linear infinite;
-}
-
-.lyraxis-dynamic.failed
-.lyraxis-dynamic-icon {
-  animation:
-    lyDynamicError
-    .12s ease-in-out 5;
-}
-
-.lyraxis-dynamic.warning
-.lyraxis-dynamic-icon {
-  animation:
-    lyDynamicWarning
-    .45s ease-in-out 3;
-}
-
-.lyraxis-dynamic.success
-.lyraxis-dynamic-icon {
-  animation:
-    lyDynamicSuccess
-    .5s ease-out;
-}
-
-.lyraxis-dynamic.custom-animation {
-  animation:
-    var(--dynamic-custom-animation);
-}
-
-@keyframes lyDynamicNotification {
-  0%,
-  100% {
-    transform: rotate(0);
-  }
-
-  25% {
-    transform: rotate(12deg);
-  }
-
-  50% {
-    transform: rotate(-12deg);
-  }
-
-  75% {
-    transform: rotate(8deg);
-  }
-}
-
-@keyframes lyDynamicMusic {
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-@keyframes lyDynamicWait {
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-@keyframes lyDynamicError {
-  0%,
-  100% {
-    transform: translateX(0);
-  }
-
-  25% {
-    transform: translateX(-3px);
-  }
-
-  50% {
-    transform: translateX(3px);
-  }
-
-  75% {
-    transform: translateX(-2px);
-  }
-}
-
-@keyframes lyDynamicWarning {
-  0%,
-  100% {
-    transform: scale(1);
-  }
-
-  50% {
-    transform: scale(1.12);
-  }
-}
-
-@keyframes lyDynamicSuccess {
-  0% {
-    transform: scale(.7);
-  }
-
-  70% {
-    transform: scale(1.15);
-  }
-
-  100% {
-    transform: scale(1);
-  }
-}
-
-@media (max-width: 480px) {
-  .lyraxis-dynamic-container {
-    bottom: 20px !important;
-  }
-
-  .lyraxis-dynamic {
-    max-width:
-      calc(100vw - 20px);
-  }
-}
+    ),opacity .35s ease;pointer-events:none;box-sizing:border-box;will-change:width,transform}.lyraxis-dynamic.enter-ball{opacity:1;transform:translateY(0)}.lyraxis-dynamic.open{width:var(--dynamic-width,280px);height:52px}.lyraxis-dynamic.close{width:52px;height:52px;transform:translateY(0)}.lyraxis-dynamic.leave{opacity:0;transform:translateY(80px)}.lyraxis-dynamic-icon{width:34px;height:34px;min-width:34px;margin-left:9px;border-radius:50%;background:var(--dynamic-color);color:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.lyraxis-dynamic-icon svg{width:19px;height:19px;fill:currentColor;display:block}.lyraxis-dynamic-content{min-width:0;margin-left:9px;margin-right:15px;white-space:nowrap;overflow:hidden;opacity:1}.lyraxis-dynamic-message{overflow:hidden;text-overflow:ellipsis;font-size:14px;font-weight:600;line-height:18px;white-space:nowrap}.lyraxis-dynamic-status{overflow:hidden;text-overflow:ellipsis;font-size:11px;line-height:14px;color:var(--lyn-text-muted);white-space:nowrap}.lyraxis-dynamic.success{--dynamic-color:#22c55e}.lyraxis-dynamic.warning{--dynamic-color:#eab308}.lyraxis-dynamic.failed{--dynamic-color:#ef4444}.lyraxis-dynamic.active{--dynamic-color:#3b82f6}.lyraxis-dynamic.waiting{--dynamic-color:#9ca3af}.lyraxis-dynamic.default{--dynamic-color:var(--lyn-brand)}.lyraxis-dynamic.custom{--dynamic-color:var(--lyn-brand)}.lyraxis-dynamic.notification .lyraxis-dynamic-icon{animation:lyDynamicNotification .8s ease-in-out 3}.lyraxis-dynamic.music .lyraxis-dynamic-icon svg{animation:lyDynamicMusic 1s linear infinite}.lyraxis-dynamic.wait .lyraxis-dynamic-icon svg,.lyraxis-dynamic.waiting .lyraxis-dynamic-icon svg{animation:lyDynamicWait 1.2s linear infinite}.lyraxis-dynamic.failed .lyraxis-dynamic-icon{animation:lyDynamicError .12s ease-in-out 5}.lyraxis-dynamic.warning .lyraxis-dynamic-icon{animation:lyDynamicWarning .45s ease-in-out 3}.lyraxis-dynamic.success .lyraxis-dynamic-icon{animation:lyDynamicSuccess .5s ease-out}.lyraxis-dynamic.custom-animation{animation:var(--dynamic-custom-animation)}@keyframes lyDynamicNotification{0%,100%{transform:rotate(0)}25%{transform:rotate(12deg)}50%{transform:rotate(-12deg)}75%{transform:rotate(8deg)}}@keyframes lyDynamicMusic{to{transform:rotate(360deg)}}@keyframes lyDynamicWait{to{transform:rotate(360deg)}}@keyframes lyDynamicError{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}50%{transform:translateX(3px)}75%{transform:translateX(-2px)}}@keyframes lyDynamicWarning{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}@keyframes lyDynamicSuccess{0%{transform:scale(.7)}70%{transform:scale(1.15)}100%{transform:scale(1)}}@media (max-width:480px){.lyraxis-dynamic-container{bottom:20px!important}.lyraxis-dynamic{max-width:calc(100vw - 20px)}}