/* ============================================================
   Gitea 自定义主题: sakura (樱夜)
   基于 Gitea v1.26.4 官方 theme-gitea-dark.css 的变量体系改色
   半透明面板 + 樱花壁纸 + 飘落花瓣特效
   ============================================================ */

gitea-theme-meta-info {
  --theme-display-name: "Sakura 樱夜";
  --theme-color-scheme: "dark";
}

:root {
  --is-dark-theme: true;

  /* 主色: 樱花粉 (dark-N 变浅 / light-N 变深, 与官方暗色主题同向) */
  --color-primary: #f472b6;
  --color-primary-contrast: #2a1320;
  --color-primary-dark-1: #f683bf;
  --color-primary-dark-2: #f794c8;
  --color-primary-dark-3: #f9a5d1;
  --color-primary-dark-4: #fab6da;
  --color-primary-dark-5: #fbc7e3;
  --color-primary-dark-6: #fdd8ec;
  --color-primary-dark-7: #fee9f5;
  --color-primary-light-1: #e75fa6;
  --color-primary-light-2: #d9559a;
  --color-primary-light-3: #c74b8c;
  --color-primary-light-4: #b0417e;
  --color-primary-light-5: #8f3567;
  --color-primary-light-6: #5e2344;
  --color-primary-light-7: #3a162b;
  --color-primary-alpha-10: #f472b619;
  --color-primary-alpha-20: #f472b633;
  --color-primary-alpha-30: #f472b64b;
  --color-primary-alpha-40: #f472b666;
  --color-primary-alpha-50: #f472b680;
  --color-primary-alpha-60: #f472b699;
  --color-primary-alpha-70: #f472b6b3;
  --color-primary-alpha-80: #f472b6cc;
  --color-primary-alpha-90: #f472b6e1;
  --color-primary-hover: var(--color-primary-light-1);
  --color-primary-active: var(--color-primary-light-2);

  /* 辅助色: 夜紫 */
  --color-secondary: #4a4260;
  --color-secondary-dark-1: #524a70;
  --color-secondary-dark-2: #5a5278;
  --color-secondary-dark-3: #665c86;
  --color-secondary-dark-4: #736895;
  --color-secondary-dark-5: #8075a3;
  --color-secondary-dark-6: #8d82b1;
  --color-secondary-dark-7: #9a8fbf;
  --color-secondary-dark-8: #a79ccd;
  --color-secondary-dark-9: #b4a9db;
  --color-secondary-dark-10: #c1b6e9;
  --color-secondary-dark-11: #cec3f7;
  --color-secondary-dark-12: #dbd0ff;
  --color-secondary-dark-13: #e4dbff;
  --color-secondary-light-1: #403852;
  --color-secondary-light-2: #362f45;
  --color-secondary-light-3: #282234;
  --color-secondary-light-4: #1f1a29;
  --color-secondary-alpha-10: #4a426019;
  --color-secondary-alpha-20: #4a426033;
  --color-secondary-alpha-30: #4a42604b;
  --color-secondary-alpha-40: #4a426066;
  --color-secondary-alpha-50: #4a426080;
  --color-secondary-alpha-60: #4a426099;
  --color-secondary-alpha-70: #4a4260b3;
  --color-secondary-alpha-80: #4a4260cc;
  --color-secondary-alpha-90: #4a4260e1;
  --color-secondary-button: var(--color-secondary-dark-4);
  --color-secondary-hover: var(--color-secondary-dark-3);
  --color-secondary-active: var(--color-secondary-dark-2);

  /* 控制台 */
  --color-console-fg: #f6f1fb;
  --color-console-fg-subtle: #cbc2dd;
  --color-console-bg: #150e24;
  --color-console-border: #322a48;
  --color-console-hover-bg: #251b3a;
  --color-console-active-bg: #2f2447;
  --color-console-menu-bg: #221935;
  --color-console-menu-border: #3f3560;
  --color-console-link: #b9abdd;

  /* 命名色 */
  --color-red: #e2636a;
  --color-orange: #e8833c;
  --color-yellow: #e0b43c;
  --color-olive: #a3b457;
  --color-green: #7fc48a;
  --color-teal: #3fbdb4;
  --color-blue: #6a9fe0;
  --color-violet: #a184f0;
  --color-purple: #c77ae0;
  --color-pink: #f472b6;
  --color-brown: #b98d6e;
  --color-black: #211a30;
  --color-red-light: #ea7d84;
  --color-orange-light: #f09a5e;
  --color-yellow-light: #eac45a;
  --color-olive-light: #b6c46e;
  --color-green-light: #94d29e;
  --color-teal-light: #5ccdc5;
  --color-blue-light: #86b4e8;
  --color-violet-light: #b29cf4;
  --color-purple-light: #d28fe8;
  --color-pink-light: #f68ac2;
  --color-brown-light: #c69f83;
  --color-black-light: #443a58;
  --color-red-dark-1: #d44f56;
  --color-orange-dark-1: #d67228;
  --color-yellow-dark-1: #c99f28;
  --color-olive-dark-1: #92a346;
  --color-green-dark-1: #6bb076;
  --color-teal-dark-1: #33a89f;
  --color-blue-dark-1: #5a8dd2;
  --color-violet-dark-1: #9271e2;
  --color-purple-dark-1: #b968d4;
  --color-pink-dark-1: #ec60a9;
  --color-brown-dark-1: #aa7f60;
  --color-black-dark-1: #2c2440;
  --color-red-dark-2: #c23f46;
  --color-orange-dark-2: #c26216;
  --color-yellow-dark-2: #b48a16;
  --color-olive-dark-2: #81903a;
  --color-green-dark-2: #5c9c67;
  --color-teal-dark-2: #29958c;
  --color-blue-dark-2: #4b7ac2;
  --color-violet-dark-2: #8260d2;
  --color-purple-dark-2: #a957c2;
  --color-pink-dark-2: #e04f9c;
  --color-brown-dark-2: #996f52;
  --color-black-dark-2: #282039;

  /* ANSI (Actions 控制台) */
  --color-ansi-black: #211a30;
  --color-ansi-red: #e2636a;
  --color-ansi-green: #7fc48a;
  --color-ansi-yellow: #e0b43c;
  --color-ansi-blue: #6a9fe0;
  --color-ansi-magenta: #f472b6;
  --color-ansi-cyan: #3fbdb4;
  --color-ansi-white: var(--color-console-fg-subtle);
  --color-ansi-bright-black: #443a58;
  --color-ansi-bright-red: #ea7d84;
  --color-ansi-bright-green: #94d29e;
  --color-ansi-bright-yellow: #eac45a;
  --color-ansi-bright-blue: #86b4e8;
  --color-ansi-bright-magenta: #f68ac2;
  --color-ansi-bright-cyan: #5ccdc5;
  --color-ansi-bright-white: var(--color-console-fg);

  /* 其他 */
  --color-grey: #3d3552;
  --color-grey-light: #a79abd;
  --color-gold: #d4a94f;
  --color-white: #ffffff;
  --color-diff-added-fg: #7fc48a;
  --color-diff-added-linenum-bg: #27422e;
  --color-diff-added-row-bg: #1e3026;
  --color-diff-added-row-border: #2d4736;
  --color-diff-added-word-bg: #35603e;
  --color-diff-moved-row-bg: #7a6a44;
  --color-diff-moved-row-border: #b8a86a;
  --color-diff-removed-fg: #e2636a;
  --color-diff-removed-linenum-bg: #46222a;
  --color-diff-removed-row-bg: #301c22;
  --color-diff-removed-row-border: #633a42;
  --color-diff-removed-word-bg: #6d3239;
  --color-diff-inactive: #241c38;
  --color-error-border: #763246;
  --color-error-bg: #322032;
  --color-error-bg-active: #492434;
  --color-error-bg-hover: #3c2130;
  --color-error-text: #ff8090;
  --color-success-border: #225a3c;
  --color-success-bg: #17322a;
  --color-success-text: #55d68a;
  --color-warning-border: #5f4a1a;
  --color-warning-bg: #35291a;
  --color-warning-text: #e8b23c;
  --color-info-border: #3d3a7e;
  --color-info-bg: #221f3a;
  --color-info-text: #9d8cf5;
  --color-priority-border: #6a3290;
  --color-priority-bg: #2c1a44;
  --color-priority-text: #c79bf5;
  --color-red-badge: #e2547a;
  --color-red-badge-bg: #e2547a1a;
  --color-red-badge-hover-bg: #e2547a4d;
  --color-green-badge: #35c46a;
  --color-green-badge-bg: #35c46a1a;
  --color-green-badge-hover-bg: #35c46a4d;
  --color-yellow-badge: #f0c33c;
  --color-yellow-badge-bg: #f0c33c1a;
  --color-yellow-badge-hover-bg: #f0c33c4d;
  --color-orange-badge: #f58a4a;
  --color-orange-badge-bg: #f58a4a1a;
  --color-orange-badge-hover-bg: #f58a4a4d;
  --color-git: #f05133;
  --color-logo: #f472b6;

  /* 面: 半透明, 透出（已模糊的）壁纸 */
  --color-body: rgba(18, 12, 30, 0.30);
  --color-box-header: rgba(32, 21, 50, 0.58);
  --color-box-body: rgba(24, 16, 40, 0.50);
  --color-box-body-highlight: rgba(40, 27, 62, 0.60);
  --color-text-dark: #fdf9ff;
  --color-text: #efe9f8;
  --color-text-light: #d5cbe8;
  --color-text-light-1: #beb2d6;
  --color-text-light-2: #a79ac2;
  --color-text-light-3: #8e81ab;
  --color-footer: var(--color-nav-bg);
  --color-timeline: #3d2f57;
  --color-input-text: var(--color-text-dark);
  --color-input-background: rgba(16, 10, 28, 0.62);
  --color-input-toggle-background: rgba(52, 37, 78, 0.75);
  --color-input-border: var(--color-secondary-dark-1);
  --color-light: #ffffff10;
  --color-light-border: #ffffff1c;
  --color-hover: #f472b61a;
  --color-hover-opaque: #291d40;
  --color-active: #f472b62c;
  --color-menu: rgba(26, 17, 44, 0.82);
  --color-card: rgba(26, 17, 44, 0.54);
  --color-markup-table-row: #ffffff0c;
  --color-markup-code-block: #ffffff0d;
  --color-markup-code-inline: #ffffff17;
  --color-button: rgba(32, 21, 50, 0.55);
  --color-code-bg: rgba(15, 10, 26, 0.72);
  --color-shadow: #05030a70;
  --color-shadow-opaque: #05030a;
  --color-secondary-bg: rgba(48, 33, 72, 0.65);
  --color-expand-button: rgba(58, 41, 86, 0.70);
  --color-placeholder-text: var(--color-text-light-3);
  --color-editor-line-highlight: var(--color-secondary-alpha-40);
  --color-editor-selection: var(--color-primary-alpha-50);
  --color-project-column-bg: var(--color-secondary-light-2);
  --color-caret: var(--color-text);
  --color-reaction-bg: #ffffff10;
  --color-reaction-hover-bg: var(--color-primary-light-4);
  --color-reaction-active-bg: var(--color-primary-light-5);
  --color-tooltip-text: #fdf9ff;
  --color-tooltip-bg: #0c0718e6;
  --color-nav-bg: rgba(14, 9, 24, 0.72);
  --color-nav-hover-bg: var(--color-secondary-light-1);
  --color-nav-text: var(--color-text);
  --color-secondary-nav-bg: rgba(20, 13, 34, 0.58);
  --color-label-text: var(--color-text);
  --color-label-bg: #f472b62b;
  --color-label-hover-bg: #f472b64d;
  --color-label-active-bg: #f472b680;
  --color-accent: var(--color-primary-light-1);
  --color-small-accent: var(--color-primary-light-5);
  --color-highlight-fg: #a67c2e;
  --color-highlight-bg: #40301f;
  --color-overlay-backdrop: #08040fcc;
  --color-danger: var(--color-red);
  --color-transparency-grid-light: #2a2438;
  --color-transparency-grid-dark: #1a1428;
  --color-workflow-edge-hover: #8b7fb0;
  --color-syntax-keyword: #ff8fb8;
  --color-syntax-bool: #4fd2df;
  --color-syntax-control: #f0b055;
  --color-syntax-name: #e0c355;
  --color-syntax-type: #f5a8cd;
  --color-syntax-number: #7cc0ec;
  --color-syntax-operator: #ff8fb8;
  --color-syntax-regexp: #c4a8f0;
  --color-syntax-string: #a8d16a;
  --color-syntax-comment: #9a8fb8;
  --color-syntax-invalid: #ff9696;
  --color-syntax-link: var(--color-primary);
  --color-syntax-tag: #ff8fb8;
  --color-syntax-attribute: #d4a2ff;
  --color-syntax-property: #7cbaff;
  --color-syntax-variable: #f0a84a;
  --color-syntax-string-special: #f0b055;
  --color-syntax-escape: #e0c355;
  --color-syntax-entity: #d4a2ff;
  --color-syntax-preproc: #66cf8f;
  --color-syntax-preproc-file: #7cc0ec;
  --color-syntax-decorator: #66cf8f;
  --color-syntax-namespace: #ded4ee;
  --color-syntax-name-pseudo: #d4a2ff;
  --color-syntax-comment-special: #c4a8f0;
  --color-syntax-text: #ded4ee;
  --color-syntax-text-alt: #c3b9d6;
  --color-syntax-punctuation: #d6cee6;
  --color-syntax-whitespace: #948ab0;
  --color-syntax-diff-fg: #ffffff;
  --color-syntax-deleted-bg: #643a44;
  --color-syntax-inserted-bg: #3d5742;
  --color-syntax-emph: #e8b25a;
  --color-syntax-strong: #f0a84a;
  --color-syntax-heading: #f0b055;
  --color-syntax-subheading: #a8d16a;
  --color-syntax-output: #9a8fb8;
  --color-syntax-prompt: #f0a84a;
  --color-syntax-traceback: #ff9696;
  --color-syntax-matching-bracket-bg: #3fbdb454;
  --color-syntax-nonmatching-bracket-bg: #e2636a54;
  accent-color: var(--color-accent);
  color-scheme: dark;

  /* 主题自有变量 */
  --sakura-radius: 10px;
  --fonts-proportional: "LXGW WenKai Screen", "LXGW WenKai", "霞鹜文楷", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", -apple-system, "Segoe UI", sans-serif !important;
  --fonts-monospace: "Sarasa Mono SC", "JetBrains Mono", "Cascadia Code", "SF Mono", Consolas, "Liberation Mono", monospace !important;
}

/* ---------- 壁纸（模糊层 + 暗化遮罩层） ---------- */
/* 变量由 templates/custom/footer.tmpl 按用户所选壁纸动态注入 */
html {
  background-color: #0e0918;
}

body {
  background-color: transparent;
  background-image: none;
}

/* 壁纸层：整体高斯模糊 + 轻微提饱和，边缘外扩避免模糊露边 */
body::before {
  content: "";
  position: fixed;
  inset: -28px;
  z-index: -2;
  background-image: var(--sakura-bg-img, url("../img/bg/sakura-night.svg"));
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  filter: blur(var(--sakura-bg-blur, 12px)) saturate(1.08);
  transform: scale(1.02);
  transition: filter 0.35s ease;
  pointer-events: none;
}

/* 遮罩层：均匀暗化 + 四周暗角，集中视线于中部内容 */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(130% 100% at 50% 0%, rgba(6, 4, 12, 0) 34%, rgba(6, 4, 12, 0.52) 100%),
    rgba(8, 5, 16, var(--sakura-bg-dim, 0));
}

/* ---------- 圆角、玻璃质感与轻量毛玻璃 ---------- */
.ui.segment,
.ui.card,
.ui.cards > .card,
.ui.message,
.ui.attached.segment,
.ui.tabular.menu,
.ui.attached.header {
  border-radius: var(--sakura-radius);
}

/* 玻璃边缘：细高光描边 + 顶部微渐变 + 柔和投影 */
.ui.segment,
.ui.card,
.ui.cards > .card,
.ui.message,
.ui.attached.header {
  border: 1px solid rgba(255, 255, 255, 0.06);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0) 42%);
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.16);
}

#navbar,
.ui.dropdown .menu,
.ui.popup {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.ui.dropdown .menu,
.ui.popup {
  border-radius: var(--sakura-radius);
}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: #ffffff08;
}
::-webkit-scrollbar-thumb {
  background: var(--color-primary-alpha-40);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-primary-alpha-60);
}

/* ---------- 飘落花瓣 (由 templates/custom/footer.tmpl 注入 DOM) ---------- */
.sakura-layer {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 100;
}

.sakura-petal {
  position: fixed;
  top: -6vh;
  border-radius: 100% 0 100% 0;
  background: linear-gradient(135deg, #ffdcee 0%, #f472b6 100%);
  opacity: 0.55;
  will-change: transform;
  animation-name: sakura-fall;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  pointer-events: none;
}

@keyframes sakura-fall {
  0% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
  20% {
    transform: translate3d(30px, 22vh, 0) rotate(72deg);
  }
  40% {
    transform: translate3d(-16px, 44vh, 0) rotate(144deg);
  }
  60% {
    transform: translate3d(26px, 66vh, 0) rotate(216deg);
  }
  80% {
    transform: translate3d(-12px, 88vh, 0) rotate(288deg);
  }
  100% {
    transform: translate3d(18px, 118vh, 0) rotate(360deg);
  }
}

/* ---------- 点击迸出 ---------- */
.sakura-burst {
  position: fixed;
  z-index: 101;
  pointer-events: none;
}

.sakura-burst span {
  position: absolute;
  width: 9px;
  height: 11px;
  border-radius: 100% 0 100% 0;
  background: linear-gradient(135deg, #ffe0ef 0%, #f472b6 100%);
  animation: sakura-burst 0.7s ease-out forwards;
  opacity: 0;
}

@keyframes sakura-burst {
  0% {
    transform: translate(0, 0) scale(0.5) rotate(0deg);
    opacity: 0.95;
  }
  100% {
    transform: translate(var(--dx, 20px), var(--dy, 20px)) scale(1) rotate(200deg);
    opacity: 0;
  }
}

/* ---------- 雪花 canvas 层 ---------- */
.snow-layer {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 100;
}

/* 雪花模式下的点击迸溅: 冰蓝圆点 */
.sakura-burst.snow span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: radial-gradient(circle, #f2faff 0%, #9fd0ff 100%);
}

/* ---------- 壁纸/特效浮窗切换器 ---------- */
#bg-switch-btn {
  position: fixed;
  right: 18px;
  bottom: 104px;
  z-index: 900;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--color-light-border);
  background: rgba(20, 13, 34, 0.78);
  color: var(--color-text);
  cursor: grab;
  touch-action: none;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px #00000059;
  transition: transform 0.15s ease, background 0.15s ease;
  user-select: none;
}

#bg-switch-btn:hover {
  transform: scale(1.08);
  background: rgba(42, 26, 60, 0.88);
}

#bg-switch-btn.dragging {
  cursor: grabbing;
  transform: scale(1.06);
  transition: none;
  background: rgba(48, 30, 68, 0.92);
}

#bg-switch-btn.active {
  background: rgba(244, 114, 182, 0.22);
  border-color: var(--color-primary-alpha-60);
}

#bg-switch-btn svg {
  width: 22px;
  height: 22px;
}

#bg-switch-panel {
  position: fixed;
  right: 18px;
  bottom: 70px;
  z-index: 901;
  width: 272px;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid var(--color-light-border);
  background: rgba(16, 10, 28, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 8px 28px #00000073;
  display: none;
  color: var(--color-text);
}

#bg-switch-panel.open {
  display: block;
}

.bg-panel-title {
  font-size: 12px;
  opacity: 0.7;
  margin: 2px 2px 8px;
  letter-spacing: 0.05em;
}

.bg-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}

.bg-opt {
  border: 2px solid transparent;
  border-radius: 8px;
  overflow: hidden;
  padding: 0;
  background: none;
  cursor: pointer;
  position: relative;
  line-height: 0;
}

.bg-opt img {
  width: 100%;
  height: 64px;
  object-fit: cover;
  display: block;
}

.bg-opt .bg-opt-name {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  font-size: 11px;
  line-height: 1.5;
  padding: 2px 6px;
  background: #000000a6;
  color: #fff;
  text-align: left;
}

.bg-opt.active {
  border-color: var(--color-primary);
}

.bg-seg {
  display: flex;
  border: 1px solid var(--color-light-border);
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 10px;
}

.bg-seg button {
  flex: 1;
  padding: 6px 0;
  background: none;
  border: none;
  color: var(--color-text);
  cursor: pointer;
  font-size: 13px;
}

.bg-seg button + button {
  border-left: 1px solid var(--color-light-border);
}

.bg-seg button.active {
  background: var(--color-primary-alpha-40);
  font-weight: 600;
}

.bg-chk {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  cursor: pointer;
}

.bg-panel-hint {
  font-size: 11px;
  opacity: 0.55;
  margin-top: 10px;
  text-align: center;
}

/* ---------- 登录/注册页横幅 (星见雅超宽图) ---------- */
#miyabi-banner {
  width: min(960px, 94%);
  margin: 0 auto 18px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 24px #00000066;
}

#miyabi-banner img {
  width: 100%;
  height: clamp(160px, 26vw, 280px);
  object-fit: cover;
  display: block;
}

@media (prefers-reduced-motion: reduce) {
  .sakura-layer,
  .sakura-burst,
  .snow-layer {
    display: none;
  }
  .sakura-petal {
    animation: none;
  }
}

/* 官方暗色主题尾部: 反转难以阅读的 emoji */
.emoji[aria-label="check mark"],
.emoji[aria-label="currency exchange"],
.emoji[aria-label="TOP arrow"],
.emoji[aria-label="END arrow"],
.emoji[aria-label="ON! arrow"],
.emoji[aria-label="SOON arrow"],
.emoji[aria-label="heavy dollar sign"],
.emoji[aria-label="copyright"],
.emoji[aria-label="registered"],
.emoji[aria-label="trade mark"],
.emoji[aria-label="multiply"],
.emoji[aria-label="plus"],
.emoji[aria-label="minus"],
.emoji[aria-label="divide"],
.emoji[aria-label="curly loop"],
.emoji[aria-label="double curly loop"],
.emoji[aria-label="wavy dash"],
.emoji[aria-label="paw prints"],
.emoji[aria-label="musical note"],
.emoji[aria-label="musical notes"] {
  filter: invert(100%) hue-rotate(180deg);
}
