/* ==========================================================================
   织星屿 (Star Weaving Island) Blog Theme Alignment for Cloudflare ImgBed
   ========================================================================== */

/* Google Fonts - Outfit & Inter */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700&display=swap');

:root {
  /* 品牌色 - 织星屿粉色调 (对齐 my-blog/style.css) */
  --primary-color: #FB7299 !important;
  --primary-color-accent: #ff8aa5 !important;
  --el-color-primary: #FB7299 !important;
  --el-color-primary-rgb: 251, 114, 153 !important;
  --el-color-primary-light-3: #ff8aa5 !important;
  --el-color-primary-light-5: #ffa3b8 !important;
  --el-color-primary-light-7: #ffccd7 !important;
  --el-color-primary-light-8: #ffe0e7 !important;
  --el-color-primary-light-9: #fff0f3 !important;
  --el-color-primary-dark-2: #e0557d !important;

  /* 背景 - 对应 my-blog 的粉红点阵双色渐变 */
  --bg-color: transparent !important;
  --body-bg: radial-gradient(rgba(255, 255, 255, 0.4) 1px, transparent 1px),
             linear-gradient(145deg, #ffe9f0 0%, #ffd9e5 100%) !important;

  /* 毛玻璃与卡片 */
  --glass-bg: rgba(255, 255, 255, 0.45) !important;
  --glass-border: rgba(255, 255, 255, 0.6) !important;
  --glass-shadow: 0 8px 32px 0 rgba(251, 114, 153, 0.12) !important;

  --upload-list-file-icon-color: #FB7299 !important;
  --el-icon--upload-color: #FB7299 !important;
  --upload-title-underline-bg: #FB7299 !important;
  --upload-action-copy-color: #FB7299 !important;
  --login-input-underline-color: #FB7299 !important;
  --login-input-label-focus-color: #FB7299 !important;
  --tabs-switcher-accent-color: #FB7299 !important;
  --tabs-switcher-current-color: #FB7299 !important;
  --tabs-switcher-current-border-color: #FB7299 !important;
}

html.dark, .dark {
  --primary-color: #FB7299 !important;
  --primary-color-accent: #ff8aa5 !important;
  --el-color-primary: #FB7299 !important;
  --el-color-primary-rgb: 251, 114, 153 !important;

  --bg-color: transparent !important;
  --body-bg: radial-gradient(rgba(251, 114, 153, 0.05) 1px, transparent 1px),
             linear-gradient(145deg, #121212 0%, #0a0a0a 100%) !important;

  --glass-bg: rgba(20, 20, 20, 0.55) !important;
  --glass-border: rgba(255, 255, 255, 0.12) !important;
  --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.4) !important;
}

/* 全局应用背景与字体 */
html, body {
  background: var(--body-bg) !important;
  background-size: 30px 30px, auto !important;
  background-attachment: fixed !important;
  min-height: 100vh !important;
  font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', Roboto, 'PingFang SC', 'Microsoft YaHei', sans-serif !important;
  color: var(--el-text-color-primary) !important;
}

/* 标题类艺术字体 */
h1, h2, h3, h4, h5, h6, .logo-title, .title {
  font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* 博客统一极窄粉色美化滚动条 */
* {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(251, 114, 153, 0.4) transparent !important;
}

::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
  display: block !important;
}

::-webkit-scrollbar-track {
  background: transparent !important;
}

::-webkit-scrollbar-thumb {
  background: rgba(251, 114, 153, 0.4) !important;
  border-radius: 10px !important;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(251, 114, 153, 0.75) !important;
}

/* 按钮与卡片粉色悬浮效果 */
.el-button--primary {
  background-color: #FB7299 !important;
  border-color: #FB7299 !important;
  box-shadow: 0 4px 12px rgba(251, 114, 153, 0.25) !important;
  transition: all 0.25s ease !important;
}

.el-button--primary:hover, .el-button--primary:focus {
  background-color: #ff8aa5 !important;
  border-color: #ff8aa5 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(251, 114, 153, 0.35) !important;
}

/* 毛玻璃质感升级 */
.el-card, .glass-card, .login-container, .dialog-box {
  backdrop-filter: blur(12px) saturate(1.4) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.4) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow) !important;
  border-radius: 16px !important;
}

/* 页脚声明样式 */
.page-footer, footer {
  font-size: 13px !important;
  color: var(--el-text-color-secondary) !important;
  padding: 16px 0 !important;
}
.page-footer a, footer a {
  color: #FB7299 !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}
.page-footer a:hover, footer a:hover {
  color: #ff8aa5 !important;
  text-decoration: underline !important;
}
