/* Shared presentation tokens for the authenticated console only. */
html.fengshang-shell-pending,
html.fengshang-shell-ready {
  --fsc-font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Helvetica Neue", Helvetica, "Microsoft YaHei UI", "Microsoft YaHei", Arial, sans-serif;
  --fsc-text-primary: rgba(0, 0, 0, .9);
  --fsc-text-secondary: rgba(0, 0, 0, .6);
  --fsc-text-tertiary: rgba(0, 0, 0, .4);
  --fsc-border-color: #e9ecf1;
  --fsc-surface: #fff;
  --fsc-page-bg: #f2f4f8;
  --fsc-motion-fast: 150ms;
  --fsc-motion-standard: 240ms;
  --fsc-motion-easing: cubic-bezier(.2, 0, 0, 1);
  --fsc-dialog-shadow: 0 8px 32px rgba(0, 0, 0, .16);
}
html.fengshang-shell-ready .fsc-spa-page-content,
html.fengshang-shell-ready [id^="fengshang-"][id$="-app"],
html.fengshang-shell-ready .fcts-page,
html.fengshang-shell-ready .fcr-pay-dialog,
html.fengshang-shell-ready .fcr-dialog,
html.fengshang-shell-ready .fcs-dialog-scope .modal {
  --td-font-family: var(--fsc-font-family);
  --td-text-color-primary: var(--fsc-text-primary);
  --td-text-color-secondary: var(--fsc-text-secondary);
  --td-bg-color-container: var(--fsc-surface);
  --td-component-border: var(--fsc-border-color);
  --td-radius-default: 0px;
  --td-anim-duration-base: 240ms;
  --td-anim-duration-moderate: 240ms;
  --td-anim-time-fn-easing: var(--fsc-motion-easing);
  font-family: var(--fsc-font-family) !important;
  -webkit-font-smoothing: antialiased;
}
html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog,
html.fengshang-shell-ready .fcr-pay-dialog .t-dialog,
html.fengshang-shell-ready .fcs-dialog-scope .modal-content,
html.fengshang-shell-ready .fcr-dialog {
  border-color: var(--fsc-border-color);
  border-radius: 0 !important;
  background: var(--fsc-surface);
  box-shadow: var(--fsc-dialog-shadow) !important;
}
html.fengshang-shell-ready .fcs-dialog-scope .modal.fade .modal-dialog {
  transform: translateY(-8px);
  transition: transform var(--fsc-motion-standard) var(--fsc-motion-easing);
}
html.fengshang-shell-ready .fcs-dialog-scope .modal.show .modal-dialog { transform: none; }
html.fengshang-shell-ready .fcr-dialog[open] { animation: fsc-dialog-reveal 240ms var(--fsc-motion-easing); }
html.fengshang-shell-ready .fcr-dialog::backdrop { background: rgba(0, 0, 0, .38); animation: fsc-dialog-mask 160ms ease; }
html.fengshang-shell-ready .modal-backdrop { background: #000; transition: opacity 160ms ease; }
html.fengshang-shell-ready .modal-backdrop.show { opacity: .38; }
@supports (transition-behavior: allow-discrete) {
  html.fengshang-shell-ready .fcr-dialog {
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 240ms var(--fsc-motion-easing), transform 240ms var(--fsc-motion-easing), display 240ms allow-discrete, overlay 240ms allow-discrete;
  }
  html.fengshang-shell-ready .fcr-dialog[open] { opacity: 1; transform: none; animation: none; }
  html.fengshang-shell-ready .fcr-dialog:not([open]) { pointer-events: none; }
  html.fengshang-shell-ready .fcr-dialog::backdrop { opacity: 0; animation: none; transition: opacity 160ms ease, display 240ms allow-discrete, overlay 240ms allow-discrete; }
  html.fengshang-shell-ready .fcr-dialog[open]::backdrop { opacity: 1; }
  @starting-style {
    html.fengshang-shell-ready .fcr-dialog[open] { opacity: 0; transform: translateY(-8px); }
    html.fengshang-shell-ready .fcr-dialog[open]::backdrop { opacity: 0; }
  }
}
@keyframes fsc-dialog-reveal { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes fsc-dialog-mask { from { opacity: 0; } to { opacity: 1; } }
/* Keep the library's paused/running Vue transition lifecycle; only replace
   its large scale(.01) entrance with the console's small vertical fade. */
html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog-zoom__vue-enter-active .t-dialog {
  animation-name: fsc-td-dialog-enter !important;
  animation-duration: 240ms !important;
  animation-timing-function: var(--fsc-motion-easing) !important;
}
html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog-zoom__vue-leave-active .t-dialog {
  animation-name: fsc-td-dialog-leave !important;
  animation-duration: 240ms !important;
  animation-timing-function: var(--fsc-motion-easing) !important;
}
html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog-zoom__vue-enter-active .t-dialog__mask,
html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog-zoom__vue-leave-active .t-dialog__mask {
  animation-duration: 160ms !important;
  animation-timing-function: ease !important;
}
@keyframes fsc-td-dialog-enter { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes fsc-td-dialog-leave { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(-8px); } }
@keyframes fsc-td-dialog-fade-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes fsc-td-dialog-fade-leave { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog-zoom__vue-enter-active .t-dialog {
    animation-name: fsc-td-dialog-fade-enter !important;
    animation-duration: 100ms !important;
  }
  html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog-zoom__vue-leave-active .t-dialog {
    animation-name: fsc-td-dialog-fade-leave !important;
    animation-duration: 100ms !important;
  }
  html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog-zoom__vue-enter-active .t-dialog__mask,
  html.fengshang-shell-ready [id^="fengshang-"][id$="-app"] .t-dialog-zoom__vue-leave-active .t-dialog__mask {
    animation-duration: 100ms !important;
  }

  html.fengshang-shell-ready { --fsc-motion-fast: 80ms; --fsc-motion-standard: 100ms; }
  /* The legacy theme uses !important to zero every transition. Keep short,
     local feedback without re-enabling large layout or transform animations. */
  html.fengshang-shell-ready #fengshang-client-shell .fsc-popover-enter-active,
  html.fengshang-shell-ready #fengshang-client-shell .fsc-popover-leave-active,
  html.fengshang-shell-ready #fengshang-client-shell .fsc-search-panel-enter-active,
  html.fengshang-shell-ready #fengshang-client-shell .fsc-search-panel-leave-active,
  html.fengshang-shell-ready #fengshang-client-shell .fsc-loading-enter-active,
  html.fengshang-shell-ready #fengshang-client-shell .fsc-loading-leave-active,
  html.fengshang-shell-ready #fengshang-client-shell .fsc-backdrop-enter-active,
  html.fengshang-shell-ready #fengshang-client-shell .fsc-backdrop-leave-active,
  html.fengshang-shell-ready .fsc-spa-page-content { transition-property: opacity !important; transition-duration: 100ms !important; }
  html.fengshang-shell-ready #fengshang-client-shell .fsc-tool-link,
  html.fengshang-shell-ready #fengshang-client-shell .fsc-icon-button,
  html.fengshang-shell-ready #fengshang-client-shell .t-menu__item { transition-property: color, background-color !important; transition-duration: 80ms !important; }
  html.fengshang-shell-ready .fsc-spa-page-content :is(button, a, input, select, textarea) { transition-property: color, background-color, border-color !important; transition-duration: 80ms !important; }
  html.fengshang-shell-ready .fcs-dialog-scope .modal.fade .modal-dialog { transform: none; transition: none; }
  html.fengshang-shell-ready .fcr-dialog[open] { animation: fsc-dialog-mask 100ms ease !important; }
  html.fengshang-shell-ready .fcr-dialog::backdrop { animation: fsc-dialog-mask 100ms ease !important; }
  @supports (transition-behavior: allow-discrete) {
    html.fengshang-shell-ready .fcr-dialog,
    html.fengshang-shell-ready .fcr-dialog[open] { transform: none; animation: none !important; transition: opacity 100ms ease, display 100ms allow-discrete, overlay 100ms allow-discrete !important; }
    html.fengshang-shell-ready .fcr-dialog::backdrop { animation: none !important; transition: opacity 100ms ease, display 100ms allow-discrete, overlay 100ms allow-discrete !important; }
    @starting-style { html.fengshang-shell-ready .fcr-dialog[open] { transform: none; opacity: 0; } }
  }
}

/* One status graphic for boot and route loading. The indicator slot keeps
   TDesign Loading's lifecycle without swapping its shape at Vue mount. */
html.fengshang-shell-ready #fengshang-client-shell .fsc-navigation-loading .t-loading { font-size: 64px; }
html.fengshang-shell-ready #fengshang-client-shell .fsc-page-spinner {
  display: inline-block;
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  background: url("../images/console-page-loading.svg") center / 64px 64px no-repeat;
  animation: fsc-page-loading-spin 1s linear infinite;
}
html.fengshang-shell-ready #fengshang-client-shell .fsc-loading-description {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
html.fengshang-shell-ready #fengshang-client-shell .fsc-loading-enter-active,
html.fengshang-shell-ready #fengshang-client-shell .fsc-loading-leave-active { transition: opacity 80ms ease !important; }
/* Local loading keeps each component's size and inherited color, including
   white indicators on primary buttons. Use a clean arc instead of a gradient. */
html.fengshang-shell-ready :is(#fengshang-client-shell, .fsc-spa-page-content) .t-loading__gradient {
  animation: fsc-local-loading-spin 600ms linear infinite;
}
html.fengshang-shell-ready :is(#fengshang-client-shell, .fsc-spa-page-content) .t-loading__gradient-conic {
  background: conic-gradient(from 0deg, currentColor 0deg 270deg, transparent 270deg 360deg) !important;
}
@keyframes fsc-page-loading-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes fsc-local-loading-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes fsc-loading-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
@media (prefers-reduced-motion: reduce) {
  /* Override only loading, rather than the legacy blanket .01ms animation.
     An opacity pulse communicates waiting without spatial movement. */
  html.fengshang-shell-ready #fengshang-client-shell .fsc-page-spinner,
  html.fengshang-shell-ready :is(#fengshang-client-shell, .fsc-spa-page-content) .t-loading__gradient {
    transform: none !important;
    animation: fsc-loading-pulse 1200ms ease-in-out infinite !important;
  }
}