:root {
  --xh-control-radius: 10px;
  --xh-control-height: 42px;
  --xh-sider-width: 280px;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden !important;
}

/* 开屏动画已经覆盖应用启动阶段，不再额外显示 Vue 的四点加载动画。 */
.first-loading-wrap {
  display: none !important;
}

/* 统一 Naive UI 及项目自定义输入控件的轮廓，避免同一弹窗中出现圆角不一致。 */
body .n-input,
body .n-input .n-input-wrapper,
body .n-input .n-input__border,
body .n-input .n-input__state-border,
body .n-input-number,
body .n-base-selection,
body .n-base-selection .n-base-selection-label,
body .n-base-selection .n-base-selection__border,
body .n-base-selection .n-base-selection__state-border,
body .n-date-picker,
body .n-time-picker,
body .admin-date-input,
body .login-captcha-input,
body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
body textarea,
body select {
  border-radius: var(--xh-control-radius) !important;
  box-sizing: border-box;
}

body .n-input:not(.n-input--textarea),
body .n-input:not(.n-input--textarea) .n-input-wrapper,
body .n-input-number,
body .n-base-selection,
body .n-base-selection .n-base-selection-label,
body .n-date-picker,
body .n-time-picker,
body .admin-date-input,
body select {
  min-height: var(--xh-control-height);
}

body .n-input--textarea,
body .n-input--textarea .n-input-wrapper,
body textarea {
  border-radius: var(--xh-control-radius) !important;
}

/* 登录页保留大尺寸输入框，但形状与全站保持一致。 */
body .view-account-form .n-input,
body .view-account-form .n-input .n-input-wrapper,
body .login-captcha-input,
body .login-captcha-image {
  --n-border-radius: var(--xh-control-radius) !important;
  border-radius: var(--xh-control-radius) !important;
}

body .view-account-form .n-form-item-blank,
body .view-account-form .login-captcha-row {
  width: 100%;
  min-width: 0;
}

/* Naive UI 自带独立占位层；原生 placeholder 必须透明，否则会叠成两层文字。 */
body .n-input .n-input__input-el::placeholder,
body .n-input .n-input__textarea-el::placeholder {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  opacity: 0 !important;
  text-shadow: none !important;
}

/* 上面的通用规则会被主题中带 #app 的 !important 规则压过；提高优先级彻底隐藏原生占位字。
   Naive UI 已使用 .n-input__placeholder 显示一份，占位字不能再由 input 自己重复绘制。 */
html[data-ui-theme] body #app .n-input .n-input__input-el::placeholder,
html[data-ui-theme] body #app .n-input .n-input__textarea-el::placeholder {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  opacity: 0 !important;
  text-shadow: none !important;
}

html[data-ui-theme] body #app :where(
  .n-input__input-el,
  .n-input__textarea-el,
  .n-input__placeholder,
  .n-base-selection-input,
  .n-base-selection-input__content,
  .n-base-selection-placeholder
) {
  text-shadow: none !important;
  -webkit-text-stroke: 0 transparent !important;
  filter: none !important;
}

body :where(.n-input__input-el,.n-input__textarea-el,.n-base-selection-input,.n-base-selection-input__content) {
  text-shadow: none !important;
  -webkit-text-stroke: 0 transparent !important;
  filter: none !important;
}

/* 固定标签栏只占内容区域宽度，避免把整个页面横向顶偏。 */
body .tabs-view.tabs-view-fix {
  left: var(--xh-sider-width) !important;
  right: 0 !important;
  width: calc(100vw - var(--xh-sider-width)) !important;
  max-width: calc(100vw - var(--xh-sider-width)) !important;
  box-sizing: border-box !important;
}

body .tabs-card-scroll {
  scroll-behavior: auto !important;
  overscroll-behavior-x: contain;
}

/* 系统页取消高耗费的实时玻璃模糊，登录页视觉效果保持不变。 */
html[data-ui-theme] body:not(:has(.view-account)) :where(
  .n-layout-sider,
  .n-form.n-form--inline,
  .n-card,
  .n-modal,
  .n-drawer,
  .layout-header
) {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-ui-theme] body:not(:has(.view-account)) #app::after {
  display: none !important;
}

@media (max-width: 600px) {
  :root {
    --xh-control-height: 40px;
  }
}