/* Command palette（搜索）：顶吸、无遮罩、输入紧凑 */

.search-palette-dialog {
  --palette-surface-radius: 16px;
  /* 顶栏总高（tokens）+ 与主内容区一致的顶缝；额外缝补偿 MDUI top-app-bar 内层高度，避免面板与顶栏重叠 */
  --palette-stack-below-topbar: var(--post-page-stack-pad-top, 0.5rem);
  --palette-topbar-extra-gap: 0.75rem;
  --palette-overlay-top-pad: calc(
    var(--app-top-bar-offset) + var(--palette-stack-below-topbar) + var(--palette-topbar-extra-gap)
  );
}

/*
 * MDUI mdui-dialog 的 :host 为 flex 且默认 flex-direction: row，故 justify-content 管横向、align-items 管竖向。
 * 顶距由宿主 padding-top 承担；横向居中用 justify-content: center（勿用 align-self:center，那是竖向居中）。
 */
#search-palette.search-palette-dialog {
  padding: var(--palette-overlay-top-pad) max(1rem, env(safe-area-inset-right, 0px)) 1rem
    max(1rem, env(safe-area-inset-left, 0px));
  box-sizing: border-box;
  justify-content: center;
  align-items: flex-start;
}

/* 全屏层不挡指针：背景可点可滚；仅面板可交互 */
#search-palette {
  pointer-events: none;
}

.search-palette-dialog::part(overlay) {
  pointer-events: none;
  align-items: flex-start;
  justify-content: center;
  /* 布局顶距在 #search-palette 上处理；overlay 仅全屏透明铺底 */
  padding: 0;
  box-sizing: border-box;
  background-color: transparent;
}

.search-palette-dialog::part(panel) {
  pointer-events: auto;
  padding: 0;
  margin: 0;
  align-self: flex-start;
  border-radius: var(--palette-surface-radius);
  overflow: hidden;
  width: min(600px, 100%);
  max-width: 600px;
  max-height: min(
    72vh,
    calc(
      100vh - var(--palette-overlay-top-pad) - max(1rem, env(safe-area-inset-bottom, 0px)) - 1.25rem
    )
  );
  background-color: rgb(var(--mdui-color-surface-container-high));
  /* 多层柔影：边缘向外渐隐的过渡虚化 */
  box-shadow:
    0 0 0 1px color-mix(in srgb, rgb(var(--mdui-color-outline-variant)) 42%, transparent),
    0 1px 3px rgba(0, 0, 0, 0.04),
    0 4px 14px rgba(0, 0, 0, 0.055),
    0 12px 32px rgba(0, 0, 0, 0.07),
    0 28px 56px rgba(0, 0, 0, 0.075);
  display: flex;
  flex-direction: column;
}

.mdui-theme-dark .search-palette-dialog::part(panel) {
  box-shadow:
    0 0 0 1px color-mix(in srgb, rgb(var(--mdui-color-outline)) 35%, transparent),
    0 1px 3px rgba(0, 0, 0, 0.35),
    0 4px 14px rgba(0, 0, 0, 0.28),
    0 12px 32px rgba(0, 0, 0, 0.22),
    0 28px 56px rgba(0, 0, 0, 0.2);
}

.search-palette-dialog::part(body) {
  padding: 0;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.palette-container {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  max-height: inherit;
}

/* 单行搜索：四角与面板圆角一致 */
.palette-input {
  flex: 0 0 auto;
  border-radius: var(--palette-surface-radius);
  overflow: hidden;
  border-bottom: 1px solid color-mix(in srgb, rgb(var(--mdui-color-outline-variant)) 65%, transparent);
  font-size: var(--mdui-typescale-body-medium-size, 0.875rem);
  /* 与面板圆角对齐，避免内部仍是直角 */
  --shape-corner: var(--palette-surface-radius);
  --shape-corner-extra-small: var(--palette-surface-radius);
}

.palette-input::part(container) {
  border: none;
  border-radius: var(--palette-surface-radius);
  background: transparent;
  padding: 0.4375rem 0.875rem;
  min-height: 0;
}

.palette-results {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 0.5rem 0.75rem 0.75rem;
}

.palette-results[hidden],
.palette-empty-state[hidden] {
  display: none !important;
}

.palette-results mdui-list-item {
  border-radius: 8px;
  margin-bottom: 4px;
  --palette-item-row-bg: var(--app-hover-on-surface);
  /* 关掉 ripple 的 hover/focus 半透明层，否则会在 host 背景上再叠一层（看起来像双重高亮） */
  --mdui-state-layer-hover: 0;
  --mdui-state-layer-focus: 0;
}

/* 唯一背景高亮：键盘 .palette-row--sel 与 :hover 共用（脚本里 mouseenter 会同步 sel，与键盘一致） */
.palette-results mdui-list-item:hover,
.palette-results mdui-list-item.palette-row--sel {
  background-color: var(--palette-item-row-bg) !important;
}

/* 禁止 MDUI :host([hover]) 把副文/图标提亮，与未悬停时同一套颜色，避免「底色 + 字色」双重变化 */
.palette-results mdui-list-item:hover::part(description),
.palette-results mdui-list-item.palette-row--sel::part(description) {
  color: rgb(var(--mdui-color-on-surface-variant)) !important;
}

.palette-results mdui-list-item:hover::part(icon),
.palette-results mdui-list-item.palette-row--sel::part(icon) {
  color: rgb(var(--mdui-color-on-surface-variant)) !important;
}

.palette-empty-state {
  flex: 1 1 auto;
  min-height: 5rem;
  padding: 1.25rem 1rem 1.5rem;
  text-align: center;
  color: rgb(var(--mdui-color-on-surface-variant));
  opacity: 0.85;
}

.palette-empty-state__icon {
  font-size: 2.25rem;
  opacity: 0.35;
  display: block;
  margin: 0 auto 0.375rem;
}

.palette-empty-state__text {
  margin: 0;
  font-size: var(--mdui-typescale-body-medium-size, 0.875rem);
  line-height: var(--mdui-typescale-body-medium-line-height, 1.25rem);
}

/* 摘要内关键词高亮（与旧 dock 一致） */
.site-search-mark {
  background-color: color-mix(in srgb, rgb(var(--mdui-color-primary)) 22%, transparent);
  color: inherit;
  padding: 0 0.125rem;
  border-radius: 2px;
}
