/* ============================================================
   Sakura Converter — Apple Vision Pro / iOS / Glassmorphism 主题
   主色 #ff8fbe  辅助 #ffb6d9  文字 #444444
   渐变按钮 linear-gradient(135deg, #ff8fbe, #ffb6d9)
   毛玻璃输入框 高56 圆角16 聚焦发光
   ============================================================ */

/* ----- 字体渲染 + 全局字体 ----- */
body {
  font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  color: #444444;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

html, body, #app {
  font-size: 14px;
}

/* ----- 链接 ----- */
a { color: #ff8fbe; }
a:hover, a:focus { color: #ff7ab0; }

/* ===== 按钮：iOS 圆角 + 樱花渐变 + 悬浮上移 ===== */
.el-button {
  border-radius: 16px;
  font-weight: 600;
  letter-spacing: 0.5px;
  transition: transform .3s ease, box-shadow .3s ease, background .3s ease, border-color .3s ease, opacity .3s ease;
}

/* 主按钮：樱花渐变 */
.el-button--primary {
  background: linear-gradient(135deg, #ff8fbe, #ffb6d9);
  border: none;
  color: #fff;
  box-shadow: 0 6px 18px rgba(255, 143, 190, 0.35);
}
.el-button--primary:hover,
.el-button--primary:focus {
  background: linear-gradient(135deg, #ff9fce, #ffc7e4);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(255, 143, 190, 0.25);
}
.el-button--primary:active {
  background: linear-gradient(135deg, #ff7ab0, #ffa9d1);
  transform: translateY(0);
}
.el-button--primary.is-disabled,
.el-button--primary.is-disabled:hover,
.el-button--primary.is-disabled:focus {
  background: linear-gradient(135deg, #ffd6e8, #ffe3f0);
  border: none;
  color: #fff;
  box-shadow: none;
  transform: none;
}
.el-button--primary.is-plain {
  color: #ff8fbe;
  background: #fff0f6;
  border-color: #ffc2dd;
}
.el-button--primary.is-plain:hover,
.el-button--primary.is-plain:focus {
  background: #ff8fbe;
  border-color: #ff8fbe;
  color: #fff;
}

/* 默认按钮：柔和玻璃感 */
.el-button--default {
  border-color: rgba(255, 182, 193, 0.5);
  background: rgba(255, 255, 255, 0.7);
  color: #d6608f;
}
.el-button--default:hover,
.el-button--default:focus {
  border-color: #ff8fbe;
  color: #ff8fbe;
  background: rgba(255, 245, 250, 0.95);
}

/* 樱花渐变小按钮（复制 / 更多选项） */
.btn-sakura,
.btn-sakura:hover,
.btn-sakura:focus,
.btn-sakura:active {
  background: linear-gradient(135deg, #ff8fbe, #ffb6d9) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(255, 143, 190, 0.35) !important;
}
.btn-sakura:hover {
  background: linear-gradient(135deg, #ff9fce, #ffc7e4) !important;
  transform: translateY(-2px);
}

/* 文字按钮（从 URL 解析） */
.el-button--text {
  color: #ff8fbe;
}
.el-button--text:hover,
.el-button--text:focus {
  color: #ff7ab0;
}

/* 危险按钮柔和化 */
.el-button--danger {
  background-color: #ff7b8a;
  border-color: #ff7b8a;
}
.el-button--danger:hover,
.el-button--danger:focus {
  background-color: #ff96a2;
  border-color: #ff96a2;
}

/* ----- 输入框：iOS 圆润 高56 细边 聚焦发光 ----- */
.el-input__inner,
.el-textarea__inner {
  border-radius: 16px;
  border: 1px solid rgba(255, 182, 193, 0.3);
  background: rgba(255, 255, 255, 0.7);
  transition: border-color .3s ease, box-shadow .3s ease, background .3s ease;
}
.el-input__inner {
  height: 56px;
  line-height: 56px;
}
.el-textarea__inner {
  padding: 16px 18px;
  line-height: 1.7;
}
.el-input__inner:focus,
.el-textarea__inner:focus {
  border-color: #ff8fbe;
  box-shadow: 0 0 0 4px rgba(255, 143, 190, 0.15);
  background: #fff;
}
.el-input__inner::placeholder,
.el-textarea__inner::placeholder {
  color: #d8a8c0;
}
.el-textarea .el-input__count {
  color: #d8a8c0;
  background: transparent;
}

/* 输入框尾部/头部按钮（复制等）统一圆角与高度 */
.el-input-group__append,
.el-input-group__prepend {
  border-radius: 0 16px 16px 0;
  border-color: rgba(255, 182, 193, 0.3);
  background: rgba(255, 245, 250, 0.9);
  overflow: hidden;
}
.el-input-group__prepend {
  border-radius: 16px 0 0 16px;
}
.el-input-group__append .el-button {
  border-radius: 0 14px 14px 0;
  margin: -10px -20px;
  height: 56px;
  padding: 0 22px;
}

/* ----- iOS 风格下拉 ----- */
.el-select .el-input__inner {
  box-shadow: 0 2px 10px rgba(255, 182, 193, 0.12);
}
.el-select .el-input.is-focus .el-input__inner {
  border-color: #ff8fbe;
}
.el-select-dropdown {
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(255, 143, 190, 0.18);
}
.el-select-dropdown__item.selected {
  color: #ff8fbe;
  font-weight: 600;
}
.el-select-dropdown__item.hover,
.el-select-dropdown__item:hover {
  background-color: #fff0f6;
}

/* ----- 复选框 ----- */
.el-checkbox__input.is-checked .el-checkbox__inner {
  background-color: #ff8fbe;
  border-color: #ff8fbe;
}
.el-checkbox__input.is-checked + .el-checkbox__label {
  color: #ff8fbe;
}
.el-checkbox__input.is-focus .el-checkbox__inner {
  border-color: #ff8fbe;
}
.el-checkbox__inner:hover {
  border-color: #ff8fbe;
}
.el-checkbox.is-bordered.is-checked {
  border-color: #ff8fbe;
}
.el-checkbox.is-bordered.is-checked .el-checkbox__label {
  color: #ff8fbe;
}

/* ----- 单选框 ----- */
.el-radio__input.is-checked .el-radio__inner {
  border-color: #ff8fbe;
  background: #ff8fbe;
}
.el-radio__input.is-checked + .el-radio__label {
  color: #ff8fbe;
}
.el-radio__inner:hover {
  border-color: #ff8fbe;
}

/* ----- 开关 ----- */
.el-switch.is-checked .el-switch__core {
  border-color: #ff8fbe;
  background-color: #ff8fbe;
}

/* ----- 折叠面板（高度渐变展开） ----- */
.el-collapse-item__header {
  color: #5a5a6e;
  transition: color .3s ease;
}
.el-collapse-item__header:hover {
  color: #ff8fbe;
}
.el-collapse-item__wrap {
  border-color: rgba(255, 182, 193, 0.25);
  transition: border-color .3s ease;
}
.el-collapse-item__arrow {
  color: #ff8fbe;
  transition: transform .3s ease;
}

/* ----- 滑块 ----- */
.el-slider__bar { background-color: #ff8fbe; }
.el-slider__button { border-color: #ff8fbe; }

/* ----- 标签页 ----- */
.el-tabs__active-bar { background-color: #ff8fbe; }
.el-tabs__item.is-active { color: #ff8fbe; }
.el-tabs__item:hover { color: #ff8fbe; }

/* ----- 分页 ----- */
.el-pager li.active { color: #ff8fbe; }
.el-pager li:hover { color: #ff8fbe; }

/* ----- 弹出框 / Popover ----- */
.el-popover {
  border-radius: 16px;
  border: 1px solid rgba(255, 182, 193, 0.4);
  box-shadow: 0 10px 30px rgba(255, 143, 190, 0.18);
}

/* ----- 消息提示 ----- */
.el-message--success { border-color: #c8e6c9; }
.el-message--error { border-color: #ffcdd2; }

/* ----- 对话框（iOS 圆角） ----- */
.el-dialog {
  border-radius: 24px;
  overflow: hidden;
}
.el-dialog__footer {
  padding: 10px 24px 24px;
}
.el-dialog__footer .el-button {
  min-width: 72px;
}

/* ----- 加载动画 ----- */
.el-loading-spinner .path { stroke: #ff8fbe; }

/* ----- 卡片（毛玻璃默认圆角） ----- */
.el-card {
  border-radius: 24px;
  border-color: rgba(255, 255, 255, 0.5);
}
.el-card.is-always-shadow,
.el-card.is-hover-shadow:focus,
.el-card.is-hover-shadow:hover {
  box-shadow: 0 8px 30px rgba(255, 182, 193, 0.15), 0 2px 6px rgba(0, 0, 0, 0.03);
}

/* ============================================================
   暗色模式覆盖（毛玻璃暗色）
   ============================================================ */
.dark-mode {
  color: #d8d0e8;
}
.dark-mode .el-card {
  background-color: rgba(30, 21, 48, 0.55);
  border-color: rgba(255, 182, 193, 0.18);
}
.dark-mode .el-card.is-always-shadow,
.dark-mode .el-card.is-hover-shadow:focus,
.dark-mode .el-card.is-hover-shadow:hover {
  box-shadow: 0 8px 30px rgba(255, 182, 193, 0.18), 0 2px 6px rgba(0, 0, 0, 0.2);
}
.dark-mode .el-input__inner,
.dark-mode .el-textarea__inner {
  background: rgba(42, 29, 58, 0.6);
  border-color: #3d2d52;
  color: #d8d0e8;
}
.dark-mode .el-input__inner:focus,
.dark-mode .el-textarea__inner:focus {
  border-color: #ff8fbe;
  box-shadow: 0 0 0 4px rgba(255, 143, 190, 0.18);
  background: rgba(42, 29, 58, 0.85);
}
.dark-mode .el-input-group__append,
.dark-mode .el-input-group__prepend {
  border-color: #3d2d52;
  background: rgba(42, 29, 58, 0.75);
}
.dark-mode .el-textarea .el-input__count {
  color: #907090;
}
.dark-mode .el-select .el-input__inner {
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.dark-mode .el-select-dropdown {
  background-color: #2a1d3a;
}
.dark-mode .el-select-dropdown__item {
  color: #c8c0d8;
}
.dark-mode .el-select-dropdown__item.hover,
.dark-mode .el-select-dropdown__item:hover {
  background-color: #3d2d52;
}
.dark-mode .el-select-dropdown__item.selected {
  color: #ff8fbe;
}
.dark-mode .el-checkbox__label,
.dark-mode .el-radio__label {
  color: #d0c8e0;
}
.dark-mode .el-collapse-item__header {
  color: #c8c0d8;
  background-color: transparent;
  border-color: #3d2d52;
}
.dark-mode .el-collapse-item__wrap {
  background-color: transparent;
  border-color: #3d2d52;
}
.dark-mode .el-collapse-item__content {
  color: #c0b8d0;
}
.dark-mode .el-popover {
  background-color: #2a1d3a;
  border-color: #3d2d52;
  color: #d0c8e0;
}
.dark-mode .el-dialog {
  background-color: #1e1530;
}
.dark-mode .el-button--default {
  background-color: rgba(42, 29, 58, 0.6);
  border-color: #3d2d52;
  color: #d0c8e0;
}
.dark-mode .el-button--default:hover,
.dark-mode .el-button--default:focus {
  background-color: rgba(61, 45, 82, 0.6);
  border-color: #ff8fbe;
  color: #ff8fbe;
}
.dark-mode .el-form-item__label {
  color: #b8b0c8;
}
.dark-mode .el-select .el-input .el-input__inner {
  background-color: rgba(42, 29, 58, 0.6);
  border-color: #3d2d52;
  color: #d8d0e8;
}

/* 尊重系统“减少动态效果”设置 */
@media (prefers-reduced-motion: reduce) {
  .el-button,
  .el-input__inner,
  .el-textarea__inner,
  .el-collapse-item__header,
  .el-collapse-item__arrow {
    transition: none;
  }
}