/**
 * Shadcn UI 风格全局样式
 * 覆盖 Element Plus 默认样式，实现现代简约设计
 */

/* ==================== CSS 变量 ==================== */
:root {
  /* 背景色 */
  --background: 0 0% 100%;
  --foreground: 222.2 84% 4.9%;
  --card: 0 0% 100%;
  --card-foreground: 222.2 84% 4.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 222.2 84% 4.9%;

  /* 主色调 */
  --primary: 222.2 47.4% 11.2%;
  --primary-foreground: 210 40% 98%;

  /* 次要色 */
  --secondary: 210 40% 96.1%;
  --secondary-foreground: 222.2 47.4% 11.2%;

  /* 柔和色 */
  --muted: 210 40% 96.1%;
  --muted-foreground: 215.4 16.3% 46.9%;

  /* 强调色 */
  --accent: 210 40% 96.1%;
  --accent-foreground: 222.2 47.4% 11.2%;

  /* 危险色 */
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 40% 98%;

  /* 边框和输入框 */
  --border: 214.3 31.8% 91.4%;
  --input: 214.3 31.8% 91.4%;
  --ring: 222.2 84% 4.9%;

  /* 圆角 */
  --radius: 0.5rem;

  /* 阴影 */
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
}

/* ==================== 基础样式 ==================== */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ==================== 按钮样式 ==================== */
/* 默认按钮 */
.el-button {
  --el-button-border-color: hsl(var(--border));
  --el-button-bg-color: hsl(var(--background));
  --el-button-text-color: hsl(var(--foreground));
  --el-button-hover-border-color: hsl(var(--border));
  --el-button-hover-bg-color: hsl(var(--accent));
  --el-button-hover-text-color: hsl(var(--accent-foreground));
  border-radius: calc(var(--radius) - 2px);
  font-weight: 500;
  transition: all 0.2s ease;
  box-shadow: var(--shadow-sm);
}

.el-button:focus {
  outline: none;
  box-shadow: 0 0 0 2px hsl(var(--background)), 0 0 0 4px hsl(var(--ring));
}

/* 主要按钮 */
.el-button--primary {
  --el-button-bg-color: hsl(var(--primary));
  --el-button-border-color: hsl(var(--primary));
  --el-button-text-color: hsl(var(--primary-foreground));
  --el-button-hover-bg-color: hsl(222.2 47.4% 20%);
  --el-button-hover-border-color: hsl(222.2 47.4% 20%);
  --el-button-hover-text-color: hsl(var(--primary-foreground));
  --el-button-active-bg-color: hsl(222.2 47.4% 15%);
  --el-button-active-border-color: hsl(222.2 47.4% 15%);
}

/* 成功按钮 */
.el-button--success {
  --el-button-bg-color: hsl(142.1 76.2% 36.3%);
  --el-button-border-color: hsl(142.1 76.2% 36.3%);
  --el-button-text-color: #fff;
  --el-button-hover-bg-color: hsl(142.1 76.2% 42%);
  --el-button-hover-border-color: hsl(142.1 76.2% 42%);
  --el-button-hover-text-color: #fff;
}

/* 警告按钮 */
.el-button--warning {
  --el-button-bg-color: hsl(47.9 95.8% 53.1%);
  --el-button-border-color: hsl(47.9 95.8% 53.1%);
  --el-button-text-color: hsl(var(--primary));
  --el-button-hover-bg-color: hsl(47.9 95.8% 60%);
  --el-button-hover-border-color: hsl(47.9 95.8% 60%);
  --el-button-hover-text-color: hsl(var(--primary));
}

/* 危险按钮 */
.el-button--danger {
  --el-button-bg-color: hsl(var(--destructive));
  --el-button-border-color: hsl(var(--destructive));
  --el-button-text-color: hsl(var(--destructive-foreground));
  --el-button-hover-bg-color: hsl(0 84.2% 65%);
  --el-button-hover-border-color: hsl(0 84.2% 65%);
  --el-button-hover-text-color: hsl(var(--destructive-foreground));
}

/* 信息按钮 */
.el-button--info {
  --el-button-bg-color: hsl(var(--secondary));
  --el-button-border-color: hsl(var(--border));
  --el-button-text-color: hsl(var(--secondary-foreground));
  --el-button-hover-bg-color: hsl(var(--muted));
  --el-button-hover-border-color: hsl(var(--border));
  --el-button-hover-text-color: hsl(var(--secondary-foreground));
}

/* 文字按钮 */
.el-button--text {
  box-shadow: none;
  --el-button-text-color: hsl(var(--primary));
  --el-button-hover-text-color: hsl(222.2 47.4% 30%);
  --el-button-hover-bg-color: hsl(var(--accent));
}

/* 链接按钮 */
.el-button.is-link {
  box-shadow: none;
}

/* 朴素按钮 */
.el-button.is-plain {
  box-shadow: none;
}

/* 禁用按钮 */
.el-button.is-disabled,
.el-button.is-disabled:hover {
  opacity: 0.5;
  cursor: not-allowed;
}

/* 小按钮 */
.el-button--small {
  border-radius: calc(var(--radius) - 4px);
  font-size: 12px;
  padding: 5px 11px;
}

/* 大按钮 */
.el-button--large {
  border-radius: var(--radius);
  font-size: 16px;
  padding: 12px 20px;
}

/* ==================== 表格样式 ==================== */
.el-table {
  --el-table-border-color: hsl(var(--border));
  --el-table-header-bg-color: hsl(var(--muted));
  --el-table-header-text-color: hsl(var(--foreground));
  --el-table-row-hover-bg-color: hsl(var(--accent));
  --el-table-bg-color: hsl(var(--background));
  --el-table-text-color: hsl(var(--foreground));
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  border: 1px solid hsl(var(--border));
}

.el-table th.el-table__cell {
  background-color: hsl(var(--muted));
  font-weight: 600;
  color: hsl(var(--foreground));
  border-bottom: 1px solid hsl(var(--border));
}

.el-table td.el-table__cell {
  border-bottom: 1px solid hsl(var(--border));
}

.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
  background-color: hsl(var(--muted) / 0.5);
}

.el-table__empty-block {
  background-color: hsl(var(--background));
}

.el-table__body tr:hover > td.el-table__cell {
  background-color: hsl(var(--accent)) !important;
}

/* 表格内边框样式 */
.el-table--border th.el-table__cell,
.el-table--border td.el-table__cell {
  border-right: 1px solid hsl(var(--border));
}

/* ==================== 输入框样式 ==================== */
.el-input__wrapper {
  border-radius: calc(var(--radius) - 2px);
  box-shadow: none !important;
  border: 1px solid hsl(var(--input));
  background-color: hsl(var(--background));
  transition: all 0.2s ease;
}

.el-input__wrapper:hover {
  border-color: hsl(var(--ring));
}

.el-input__wrapper.is-focus {
  border-color: hsl(var(--ring));
  box-shadow: 0 0 0 2px hsl(var(--ring) / 0.2) !important;
}

.el-input__inner {
  color: hsl(var(--foreground));
}

.el-input__inner::placeholder {
  color: hsl(var(--muted-foreground));
}

/* 禁用输入框 */
.el-input.is-disabled .el-input__wrapper {
  background-color: hsl(var(--muted));
  opacity: 0.5;
}

/* 文本域 */
.el-textarea__inner {
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid hsl(var(--input));
  box-shadow: none !important;
  transition: all 0.2s ease;
}

.el-textarea__inner:hover {
  border-color: hsl(var(--ring));
}

.el-textarea__inner:focus {
  border-color: hsl(var(--ring));
  box-shadow: 0 0 0 2px hsl(var(--ring) / 0.2) !important;
}

/* ==================== 选择器样式 ==================== */
.el-select .el-input__wrapper {
  border-radius: calc(var(--radius) - 2px);
}

.el-select-dropdown {
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
  box-shadow: var(--shadow-lg);
  background-color: hsl(var(--popover));
}

.el-select-dropdown__item {
  color: hsl(var(--popover-foreground));
  border-radius: calc(var(--radius) - 4px);
  margin: 2px 4px;
  padding: 8px 12px;
}

.el-select-dropdown__item:hover {
  background-color: hsl(var(--accent));
}

.el-select-dropdown__item.selected {
  background-color: hsl(var(--accent));
  font-weight: 600;
}

.el-select-dropdown__item.is-disabled {
  color: hsl(var(--muted-foreground));
  opacity: 0.5;
}

/* ==================== 日期选择器样式 ==================== */
.el-date-editor .el-input__wrapper {
  border-radius: calc(var(--radius) - 2px);
}

.el-picker-panel {
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
  box-shadow: var(--shadow-lg);
  background-color: hsl(var(--popover));
}

.el-date-table td.available:hover,
.el-date-table td.current:not(.disabled) {
  border-radius: calc(var(--radius) - 4px);
}

.el-date-table td.today span {
  border-radius: calc(var(--radius) - 4px);
  border: 1px solid hsl(var(--primary));
  color: hsl(var(--primary));
}

.el-date-table td.current:not(.disabled) span {
  background-color: hsl(var(--primary));
  border-radius: calc(var(--radius) - 4px);
}

/* ==================== 卡片样式 ==================== */
.el-card {
  --el-card-border-color: hsl(var(--border));
  --el-card-bg-color: hsl(var(--card));
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  border: 1px solid hsl(var(--border));
}

.el-card__header {
  border-bottom: 1px solid hsl(var(--border));
  background-color: hsl(var(--muted) / 0.3);
  font-weight: 600;
}

.el-card__body {
  color: hsl(var(--card-foreground));
}

/* ==================== 对话框样式 ==================== */
.el-dialog {
  --el-dialog-bg-color: hsl(var(--background));
  --el-dialog-border-radius: var(--radius);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  border: 1px solid hsl(var(--border));
}

.el-dialog__header {
  border-bottom: 1px solid hsl(var(--border));
  padding: 16px 20px;
}

.el-dialog__title {
  font-weight: 600;
  color: hsl(var(--foreground));
}

.el-dialog__headerbtn {
  top: 16px;
  right: 16px;
}

.el-dialog__headerbtn:hover .el-dialog__close {
  color: hsl(var(--foreground));
}

.el-dialog__body {
  padding: 20px;
  color: hsl(var(--foreground));
}

.el-dialog__footer {
  border-top: 1px solid hsl(var(--border));
  padding: 16px 20px;
}

/* 对话框遮罩 */
.el-overlay {
  background-color: hsl(var(--foreground) / 0.5);
}

/* ==================== 表单样式 ==================== */
.el-form-item__label {
  color: hsl(var(--foreground));
  font-weight: 500;
}

.el-form-item__error {
  color: hsl(var(--destructive));
}

/* ==================== 标签样式 ==================== */
.el-tag {
  border-radius: calc(var(--radius) - 4px);
  font-weight: 500;
  border: none;
}

.el-tag--info {
  background-color: hsl(var(--secondary));
  color: hsl(var(--secondary-foreground));
}

.el-tag--success {
  background-color: hsl(142.1 76.2% 36.3% / 0.1);
  color: hsl(142.1 76.2% 36.3%);
}

.el-tag--warning {
  background-color: hsl(47.9 95.8% 53.1% / 0.1);
  color: hsl(32.1 94.6% 43.7%);
}

.el-tag--danger {
  background-color: hsl(var(--destructive) / 0.1);
  color: hsl(var(--destructive));
}

.el-tag--primary {
  background-color: hsl(var(--primary) / 0.1);
  color: hsl(var(--primary));
}
.el-radio-button.is-active .el-radio-button__original-radio:not(:disabled)+.el-radio-button__inner {
  background-color: hsl(var(--primary) / 0.1);
  border-color: hsl(var(--primary));
  color: hsl(var(--primary));
}

/* ==================== 分页样式 ==================== */
.el-pagination {
  --el-pagination-button-bg-color: hsl(var(--background));
  --el-pagination-button-color: hsl(var(--foreground));
  --el-pagination-hover-color: hsl(var(--primary));
}

.el-pagination button,
.el-pagination .el-pager li {
  border-radius: calc(var(--radius) - 4px);
  border: 1px solid hsl(var(--border));
  background-color: hsl(var(--background));
  margin: 0 2px;
}

.el-pagination button:hover,
.el-pagination .el-pager li:hover {
  background-color: hsl(var(--accent));
  border-color: hsl(var(--border));
}

.el-pagination .el-pager li.is-active {
  background-color: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
  border-color: hsl(var(--primary));
}

/* ==================== 消息提示样式 ==================== */
.el-message {
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
  box-shadow: var(--shadow-lg);
}

.el-message--success {
  background-color: hsl(142.1 76.2% 36.3% / 0.1);
  border-color: hsl(142.1 76.2% 36.3% / 0.2);
}

.el-message--warning {
  background-color: hsl(47.9 95.8% 53.1% / 0.1);
  border-color: hsl(47.9 95.8% 53.1% / 0.2);
}

.el-message--error {
  background-color: hsl(var(--destructive) / 0.1);
  border-color: hsl(var(--destructive) / 0.2);
}

.el-message--info {
  background-color: hsl(var(--muted));
  border-color: hsl(var(--border));
}

/* ==================== 通知样式 ==================== */
.el-notification {
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
  box-shadow: var(--shadow-lg);
}

/* ==================== 抽屉样式 ==================== */
.el-drawer {
  --el-drawer-bg-color: hsl(var(--background));
  border-radius: var(--radius) 0 0 var(--radius);
}

.el-drawer__header {
  border-bottom: 1px solid hsl(var(--border));
  margin-bottom: 0;
  padding: 16px 20px;
}

.el-drawer__title {
  font-weight: 600;
  color: hsl(var(--foreground));
}

.el-drawer__body {
  padding: 20px;
}

/* ==================== 开关样式 ==================== */
.el-switch {
  --el-switch-off-color: hsl(var(--muted));
  --el-switch-on-color: hsl(var(--primary));
}

.el-switch__core {
  border-radius: 9999px;
}

/* ==================== 复选框样式 ==================== */
.el-checkbox__inner {
  border-radius: calc(var(--radius) - 6px);
  border: 1px solid hsl(var(--border));
}

.el-checkbox__input.is-checked .el-checkbox__inner {
  background-color: hsl(var(--primary));
  border-color: hsl(var(--primary));
}

/* ==================== 单选框样式 ==================== */
.el-radio__inner {
  border: 1px solid hsl(var(--border));
}

.el-radio__input.is-checked .el-radio__inner {
  background-color: hsl(var(--primary));
  border-color: hsl(var(--primary));
}

/* ==================== 进度条样式 ==================== */
.el-progress-bar__outer {
  background-color: hsl(var(--muted));
  border-radius: 9999px;
}

.el-progress-bar__inner {
  background-color: hsl(var(--primary));
  border-radius: 9999px;
}

/* ==================== 滑块样式 ==================== */
.el-slider__runway {
  background-color: hsl(var(--muted));
  border-radius: 9999px;
}

.el-slider__bar {
  background-color: hsl(var(--primary));
  border-radius: 9999px;
}

.el-slider__button {
  border: 2px solid hsl(var(--primary));
}

/* ==================== 折叠面板样式 ==================== */
.el-collapse {
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  overflow: hidden;
}

.el-collapse-item__header {
  background-color: hsl(var(--muted) / 0.3);
  border-bottom: 1px solid hsl(var(--border));
  font-weight: 500;
}

.el-collapse-item__content {
  padding: 16px 20px;
}

/* ==================== 选项卡样式 ==================== */
.el-tabs__item {
  color: hsl(var(--muted-foreground));
  font-weight: 500;
}

.el-tabs__item.is-active {
  color: hsl(var(--primary));
}

.el-tabs__active-bar {
  background-color: hsl(var(--primary));
  border-radius: 9999px;
}

.el-tabs--card > .el-tabs__header .el-tabs__item {
  border-radius: calc(var(--radius) - 4px) calc(var(--radius) - 4px) 0 0;
}

/* ==================== 面包屑样式 ==================== */
.el-breadcrumb__item .el-breadcrumb__inner {
  color: hsl(var(--muted-foreground));
}

.el-breadcrumb__item:last-child .el-breadcrumb__inner {
  color: hsl(var(--foreground));
  font-weight: 500;
}

/* ==================== 徽章样式 ==================== */
.el-badge__content {
  border-radius: 9999px;
  font-weight: 500;
}

/* ==================== 警告样式 ==================== */
.el-alert {
  border-radius: var(--radius);
  border: 1px solid;
}

.el-alert--success {
  background-color: hsl(142.1 76.2% 36.3% / 0.1);
  border-color: hsl(142.1 76.2% 36.3% / 0.2);
}

.el-alert--warning {
  background-color: hsl(47.9 95.8% 53.1% / 0.1);
  border-color: hsl(47.9 95.8% 53.1% / 0.2);
}

.el-alert--error {
  background-color: hsl(var(--destructive) / 0.1);
  border-color: hsl(var(--destructive) / 0.2);
}

.el-alert--info {
  background-color: hsl(var(--muted));
  border-color: hsl(var(--border));
}

/* ==================== 骨架屏样式 ==================== */
.el-skeleton__item {
  background: linear-gradient(
    90deg,
    hsl(var(--muted)) 25%,
    hsl(var(--muted) / 0.5) 50%,
    hsl(var(--muted)) 75%
  );
  border-radius: calc(var(--radius) - 4px);
}

/* ==================== 加载样式 ==================== */
.el-loading-mask {
  background-color: hsl(var(--background) / 0.8);
  border-radius: var(--radius);
}

.el-loading-spinner .circular {
  stroke: hsl(var(--primary));
}

/* ==================== 空状态样式 ==================== */
.el-empty__description {
  color: hsl(var(--muted-foreground));
}

/* ==================== 时间线样式 ==================== */
.el-timeline-item__node {
  background-color: hsl(var(--primary));
}

.el-timeline-item__tail {
  border-left: 2px solid hsl(var(--border));
}

/* ==================== 步骤条样式 ==================== */
.el-step__head.is-finish {
  color: hsl(var(--primary));
  border-color: hsl(var(--primary));
}

.el-step__head.is-process {
  color: hsl(var(--primary));
  border-color: hsl(var(--primary));
}

.el-step__icon.is-text {
  border-radius: 9999px;
}

/* ==================== 下拉菜单样式 ==================== */
.el-dropdown-menu {
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
  box-shadow: var(--shadow-lg);
  padding: 4px;
}

.el-dropdown-menu__item {
  border-radius: calc(var(--radius) - 4px);
  padding: 8px 12px;
}

.el-dropdown-menu__item:hover {
  background-color: hsl(var(--accent));
  color: hsl(var(--accent-foreground));
}

/* ==================== 弹出框样式 ==================== */
.el-popover.el-popper {
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
  box-shadow: var(--shadow-lg);
}

/* ==================== 工具提示样式 ==================== */
.el-tooltip__popper {
  border-radius: calc(var(--radius) - 4px);
}

.el-tooltip__popper.is-dark {
  background-color: hsl(var(--primary));
}

/* ==================== 上传样式 ==================== */
.el-upload-dragger {
  border-radius: var(--radius);
  border: 2px dashed hsl(var(--border));
  background-color: hsl(var(--muted) / 0.3);
  transition: all 0.2s ease;
}

.el-upload-dragger:hover {
  border-color: hsl(var(--primary));
  background-color: hsl(var(--primary) / 0.05);
}

/* ==================== 图片样式 ==================== */
.el-image {
  border-radius: var(--radius);
  overflow: hidden;
}

/* ==================== 头像样式 ==================== */
.el-avatar {
  border-radius: 9999px;
}

.el-avatar--square {
  border-radius: var(--radius);
}

/* ==================== 评分样式 ==================== */
.el-rate__icon {
  color: hsl(var(--muted));
}

.el-rate__icon.is-active {
  color: hsl(47.9 95.8% 53.1%);
}

/* ==================== 树形控件样式 ==================== */
.el-tree-node__content:hover {
  background-color: hsl(var(--accent));
}

.el-tree-node.is-current > .el-tree-node__content {
  background-color: hsl(var(--primary) / 0.1);
}

/* ==================== 描述列表样式 ==================== */
.el-descriptions {
  --el-descriptions-item-bordered-label-background: hsl(var(--muted));
}

.el-descriptions__label {
  font-weight: 500;
  color: hsl(var(--foreground));
}

.el-descriptions__content {
  color: hsl(var(--muted-foreground));
}

/* ==================== 结果页样式 ==================== */
.el-result__title {
  color: hsl(var(--foreground));
  font-weight: 600;
}

.el-result__subtitle {
  color: hsl(var(--muted-foreground));
}

/* ==================== 日历样式 ==================== */
.el-calendar {
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
}

.el-calendar-table td.is-today {
  color: hsl(var(--primary));
}

.el-calendar-table td.is-selected {
  background-color: hsl(var(--primary) / 0.1);
}

/* ==================== 穿梭框样式 ==================== */
.el-transfer-panel {
  border-radius: var(--radius);
  border: 1px solid hsl(var(--border));
}

.el-transfer-panel__header {
  background-color: hsl(var(--muted) / 0.5);
  border-bottom: 1px solid hsl(var(--border));
}

/* ==================== 级联选择器样式 ==================== */
.el-cascader-menu {
  border-right: 1px solid hsl(var(--border));
}

.el-cascader-node:hover {
  background-color: hsl(var(--accent));
}

.el-cascader-node.is-active {
  background-color: hsl(var(--primary) / 0.1);
}

/* ==================== 虚拟列表样式 ==================== */
.el-select-v2__wrapper {
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid hsl(var(--input));
}

/* ==================== 统一过渡效果 ==================== */
.el-button,
.el-input__wrapper,
.el-select .el-input__wrapper,
.el-card,
.el-tag,
.el-pagination button,
.el-pagination .el-pager li {
  transition: all 0.2s ease;
}

/* ==================== 手机版本响应式布局 ==================== */
@media (max-width: 768px) {
  /* 栅格布局手机适配 - 一行只放一个 */
  .el-row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .el-row .el-col {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 12px;
  }

  .el-row .el-col:last-child {
    margin-bottom: 0;
  }

  /* 对话框手机适配 */
  .el-dialog {
    --el-dialog-width: 95% !important;
    width: 95% !important;
    margin: 15px auto !important;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
  }

  .el-dialog__header {
    padding: 12px 16px;
    flex-shrink: 0;
  }

  .el-dialog__title {
    font-size: 16px;
  }

  .el-dialog__headerbtn {
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
  }

  .el-dialog__body {
    padding: 16px;
    overflow-y: auto;
    flex: 1;
    max-height: calc(90vh - 120px);
  }

  .el-dialog__footer {
    padding: 12px 16px;
    flex-shrink: 0;
  }

  .el-dialog__footer .el-button {
    width: 100%;
    margin-left: 0 !important;
    margin-bottom: 8px;
  }

  .el-dialog__footer .el-button:last-child {
    margin-bottom: 0;
  }

  /* 表单手机适配 */
  .el-form {
    width: 100%;
  }

  .el-form--inline .el-form-item {
    display: block;
    width: 100%;
    margin-right: 0 !important;
    margin-bottom: 12px;
  }

  .el-form--inline .el-form-item__content {
    width: 100%;
  }

  .el-form-item {
    margin-bottom: 16px;
  }

  .el-form-item__label {
    font-size: 13px;
    padding-bottom: 4px;
  }

  .el-form-item__content {
    width: 100%;
  }

  .el-form-item__error {
    font-size: 11px;
  }

  /* 表单项内的输入框全宽 */
  .el-form-item .el-input,
  .el-form-item .el-select,
  .el-form-item .el-date-editor,
  .el-form-item .el-cascader,
  .el-form-item .el-autocomplete {
    width: 100% !important;
  }

  /* 行内表单的按钮组 */
  .el-form--inline .el-form-item:last-child {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .el-form--inline .el-form-item:last-child .el-button {
    flex: 1;
    min-width: calc(50% - 4px);
  }

  /* 输入框手机适配 */
  .el-input {
    width: 100%;
  }

  .el-input__wrapper {
    padding: 6px 11px;
  }

  .el-input__inner {
    font-size: 14px;
    height: 32px;
  }

  .el-input--small .el-input__inner {
    height: 28px;
    font-size: 13px;
  }

  .el-input--large .el-input__inner {
    height: 36px;
    font-size: 15px;
  }

  /* 文本域手机适配 */
  .el-textarea__inner {
    font-size: 14px;
    padding: 8px 11px;
  }

  /* 选择器手机适配 */
  .el-select {
    width: 100%;
  }

  .el-select__wrapper {
    min-height: 32px;
  }

  .el-select-dropdown {
    max-width: calc(100vw - 24px);
  }

  .el-select-dropdown__item {
    padding: 10px 12px;
    font-size: 14px;
  }

  /* 日期选择器手机适配 */
  .el-date-editor {
    width: 100% !important;
  }

  .el-date-editor .el-input__wrapper {
    width: 100%;
  }

  .el-date-editor--daterange,
  .el-date-editor--datetimerange {
    width: 100% !important;
  }

  .el-date-range-picker {
    width: calc(100vw - 24px) !important;
    max-width: 600px;
  }

  .el-date-range-picker__content {
    flex-direction: column;
  }

  .el-date-range-picker .el-picker-panel__body {
    min-width: auto;
  }

  .el-picker-panel {
    max-width: calc(100vw - 24px);
  }

  /* 级联选择器手机适配 */
  .el-cascader {
    width: 100%;
  }

  .el-cascader-panel {
    max-width: calc(100vw - 24px);
  }

  .el-cascader-menu {
    min-width: 120px;
  }

  /* 按钮手机适配 */
  .el-button {
    padding: 8px 15px;
    font-size: 13px;
  }

  .el-button--small {
    padding: 6px 11px;
    font-size: 12px;
  }

  .el-button--large {
    padding: 10px 19px;
    font-size: 14px;
  }

  .el-button.is-circle {
    padding: 8px;
  }

  .el-button-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .el-button-group .el-button {
    flex: 1;
    min-width: calc(50% - 4px);
  }

  /* 卡片手机适配 */
  .el-card {
    margin-bottom: 12px;
  }

  .el-card__header {
    padding: 12px 16px;
  }

  .el-card__body {
    padding: 16px;
  }

  /* 表格手机适配 */
  .el-table {
    font-size: 12px;
  }

  .el-table th.el-table__cell,
  .el-table td.el-table__cell {
    padding: 8px 6px;
  }

  .el-table .cell {
    padding: 0 4px;
    line-height: 1.4;
  }

  /* 分页手机适配 */
  .el-pagination {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
  }

  .el-pagination .el-pagination__sizes,
  .el-pagination .el-pagination__jump {
    display: none !important;
  }

  .el-pagination .el-pager li,
  .el-pagination button {
    min-width: 28px;
    height: 28px;
    line-height: 28px;
  }

  .el-pagination .el-pager li {
    font-size: 12px;
  }

  /* 标签手机适配 */
  .el-tag {
    font-size: 11px;
    padding: 0 6px;
    height: 22px;
    line-height: 22px;
  }

  .el-tag--small {
    font-size: 10px;
    padding: 0 5px;
    height: 18px;
    line-height: 18px;
  }

  /* 选项卡手机适配 */
  .el-tabs__header {
    margin-bottom: 12px;
  }

  .el-tabs__nav-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .el-tabs__nav {
    white-space: nowrap;
  }

  .el-tabs__item {
    padding: 0 12px;
    font-size: 13px;
    height: 36px;
    line-height: 36px;
  }

  /* 抽屉手机适配 */
  .el-drawer {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: var(--radius) var(--radius) 0 0 !important;
  }

  .el-drawer.rtl,
  .el-drawer.ltr {
    width: 85% !important;
    border-radius: 0 !important;
  }

  .el-drawer__header {
    padding: 12px 16px;
  }

  .el-drawer__body {
    padding: 16px;
  }

  /* 消息框手机适配 */
  .el-message-box {
    width: calc(100vw - 32px) !important;
    max-width: 400px;
  }

  .el-message-box__header {
    padding: 12px 16px;
  }

  .el-message-box__content {
    padding: 16px;
  }

  .el-message-box__btns {
    padding: 12px 16px;
    display: flex;
    flex-direction: column-reverse;
    gap: 8px;
  }

  .el-message-box__btns .el-button {
    width: 100%;
    margin-left: 0 !important;
  }

  /* 消息提示手机适配 */
  .el-message {
    min-width: auto;
    max-width: calc(100vw - 32px);
    padding: 10px 16px;
  }

  .el-message__content {
    font-size: 13px;
  }

  /* 通知手机适配 */
  .el-notification {
    width: calc(100vw - 32px) !important;
    max-width: 350px;
    right: 16px !important;
  }

  /* 上传手机适配 */
  .el-upload-dragger {
    padding: 24px 16px;
    width: 100%;
  }

  .el-upload-dragger .el-icon {
    font-size: 40px;
  }

  .el-upload-list {
    margin-top: 12px;
  }

  .el-upload-list__item {
    padding: 8px;
    font-size: 12px;
  }

  /* 弹出层手机适配 */
  .el-popover.el-popper {
    max-width: calc(100vw - 32px);
  }

  .el-popover__title {
    font-size: 14px;
  }

  /* 下拉菜单手机适配 */
  .el-dropdown-menu {
    max-width: calc(100vw - 32px);
  }

  .el-dropdown-menu__item {
    padding: 10px 16px;
    font-size: 14px;
  }

  /* 时间线手机适配 */
  .el-timeline-item__wrapper {
    padding-left: 20px;
  }

  .el-timeline-item__timestamp {
    font-size: 12px;
  }

  /* 步骤条手机适配 */
  .el-steps--horizontal {
    flex-wrap: wrap;
  }

  .el-step__title {
    font-size: 12px;
  }

  .el-step__description {
    font-size: 11px;
  }

  /* 折叠面板手机适配 */
  .el-collapse-item__header {
    padding: 12px 16px;
    font-size: 14px;
  }

  .el-collapse-item__content {
    padding: 12px 16px;
    font-size: 13px;
  }

  /* 描述列表手机适配 */
  .el-descriptions__body {
    display: block;
  }

  .el-descriptions-row {
    display: flex;
    flex-direction: column;
  }

  .el-descriptions__cell {
    padding: 8px 12px;
  }

  .el-descriptions__label {
    font-size: 12px;
    width: auto !important;
    min-width: 80px;
  }

  .el-descriptions__content {
    font-size: 13px;
  }

  /* 评分手机适配 */
  .el-rate__icon {
    font-size: 20px;
  }

  /* 开关手机适配 */
  .el-switch {
    height: 20px;
  }

  .el-switch__core {
    min-width: 36px;
    height: 20px;
  }

  /* 滑块手机适配 */
  .el-slider__runway {
    margin: 12px 0;
  }

  .el-slider__button-wrapper {
    width: 32px;
    height: 32px;
  }

  /* 日历手机适配 */
  .el-calendar__body {
    padding: 8px;
  }

  .el-calendar-day {
    height: 50px;
    font-size: 12px;
  }

  /* 空状态手机适配 */
  .el-empty__image {
    width: 100px;
  }

  .el-empty__description {
    font-size: 13px;
  }

  /* 骨架屏手机适配 */
  .el-skeleton__item {
    height: 16px;
  }

  .el-skeleton__paragraph {
    margin-top: 12px;
  }
}

/* ==================== 小屏手机适配 (480px以下) ==================== */
@media (max-width: 480px) {
  /* 对话框小屏适配 */
  .el-dialog {
    width: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
    max-height: 100vh;
  }

  .el-dialog__body {
    max-height: calc(100vh - 100px);
  }

  /* 表单小屏适配 */
  .el-form-item__label {
    font-size: 12px;
  }

  /* 输入框小屏适配 */
  .el-input__inner {
    font-size: 13px;
  }

  /* 按钮小屏适配 */
  .el-button {
    padding: 7px 12px;
    font-size: 12px;
  }

  .el-button--small {
    padding: 5px 9px;
    font-size: 11px;
  }

  /* 卡片小屏适配 */
  .el-card__header {
    padding: 10px 12px;
  }

  .el-card__body {
    padding: 12px;
  }

  /* 表格小屏适配 */
  .el-table {
    font-size: 11px;
  }

  .el-table th.el-table__cell,
  .el-table td.el-table__cell {
    padding: 6px 4px;
  }

  /* 分页小屏适配 */
  .el-pagination .el-pager li,
  .el-pagination button {
    min-width: 24px;
    height: 24px;
    line-height: 24px;
  }

  /* 选项卡小屏适配 */
  .el-tabs__item {
    padding: 0 10px;
    font-size: 12px;
    height: 32px;
    line-height: 32px;
  }

  /* 抽屉小屏适配 */
  .el-drawer.rtl,
  .el-drawer.ltr {
    width: 100% !important;
  }

  /* 消息框小屏适配 */
  .el-message-box {
    width: calc(100vw - 24px) !important;
  }

  /* 标签小屏适配 */
  .el-tag {
    font-size: 10px;
    padding: 0 5px;
    height: 20px;
    line-height: 20px;
  }
}
