/* Home Assistant 官方深色主题颜色方案 */
/* 基于 https://www.home-assistant.io/stylesheets/screen.css */

:root {
  /* Home Assistant 官方颜色变量 */
  --ha-primary-color: #1abcf2;
  --ha-primary-color-rgb: 26, 188, 242;
  --ha-accent-color: #03a9f4;
  --ha-link-color: #007fa8;
  --ha-success-color: #43a047;
  --ha-warning-color: #f57c00;
  --ha-error-color: #e53935;
  --ha-info-color: #0288d1;

  /* 深色主题背景颜色 */
  --ha-dark-background: #0d1117;
  --ha-dark-surface: #161b22;
  --ha-dark-surface-variant: #21262d;
  --ha-dark-elevated-surface: #30363d;
  --ha-dark-card: #1c2128;

  /* 深色主题文字颜色 */
  --ha-dark-text-primary: #f0f6fc;
  --ha-dark-text-secondary: #8b949e;
  --ha-dark-text-tertiary: #6e7681;
  --ha-dark-text-disabled: #484f58;

  /* 深色主题边框颜色 */
  --ha-dark-border: #30363d;
  --ha-dark-border-light: #21262d;
  --ha-dark-border-heavy: #484f58;
}

/* 深色模式样式 */
.dark {
  /* 背景色 */
  --rp-c-bg: var(--ha-dark-background) !important;
  --rp-c-bg-alt: var(--ha-dark-surface) !important;
  --rp-c-bg-code: var(--ha-dark-surface-variant) !important;
  --rp-c-bg-code-inline: var(--ha-dark-surface-variant) !important;
  --rp-c-bg-elv: var(--ha-dark-elevated-surface) !important;
  --rp-c-bg-card: var(--ha-dark-card) !important;
  --rp-c-bg-brand: var(--ha-primary-color) !important;

  /* 文字颜色 */
  --rp-c-text-1: var(--ha-dark-text-primary) !important;
  --rp-c-text-2: var(--ha-dark-text-secondary) !important;
  --rp-c-text-3: var(--ha-dark-text-tertiary) !important;
  --rp-c-text-4: var(--ha-dark-text-disabled) !important;
  --rp-c-text-code: var(--ha-dark-text-primary) !important;
  --rp-c-text-brand: var(--ha-dark-text-primary) !important;

  /* 边框颜色 */
  --rp-c-border: var(--ha-dark-border) !important;
  --rp-c-border-light: var(--ha-dark-border-light) !important;
  --rp-c-border-heavy: var(--ha-dark-border-heavy) !important;
  --rp-c-divider: var(--ha-dark-border) !important;

  /* 主题色 */
  --rp-c-brand: var(--ha-primary-color) !important;
  --rp-c-brand-1: var(--ha-primary-color) !important;
  --rp-c-brand-2: #0d8fb3 !important;
  --rp-c-brand-3: #0a5f7a !important;

  /* 链接颜色 */
  --rp-c-link: var(--ha-link-color) !important;
  --rp-c-link-hover: var(--ha-primary-color) !important;

  /* 代码高亮 */
  --rp-c-code-bg: var(--ha-dark-surface-variant) !important;
  --rp-c-code-border: var(--ha-dark-border) !important;

  /* 侧边栏 */
  --rp-c-sidebar-bg: var(--ha-dark-surface) !important;
  --rp-c-sidebar-border: var(--ha-dark-border) !important;

  /* 导航栏 */
  --rp-c-nav-bg: var(--ha-dark-surface) !important;
  --rp-c-nav-border: var(--ha-dark-border) !important;

  /* 搜索框 */
  --rp-c-search-bg: var(--ha-dark-surface-variant) !important;
  --rp-c-search-border: var(--ha-dark-border) !important;
  --rp-c-search-text: var(--ha-dark-text-primary) !important;

  /* 滚动条 */
  --rp-c-scrollbar: var(--ha-dark-border-heavy) !important;
  --rp-c-scrollbar-thumb: var(--ha-dark-border) !important;
}

/* 深色模式特定组件样式 */
.dark .rp-navbar {
  background-color: var(--ha-dark-surface) !important;
  border-bottom-color: var(--ha-dark-border) !important;
}

.dark .rp-sidebar {
  background-color: var(--ha-dark-surface) !important;
  border-right-color: var(--ha-dark-border) !important;
}

.dark .rp-content {
  background-color: var(--ha-dark-background) !important;
}

.dark .rp-card {
  background-color: var(--ha-dark-card) !important;
  border-color: var(--ha-dark-border) !important;
}

.dark .rp-code {
  background-color: var(--ha-dark-surface-variant) !important;
  border-color: var(--ha-dark-border) !important;
  color: var(--ha-dark-text-primary) !important;
}

.dark .rp-code-block {
  background-color: var(--ha-dark-surface-variant) !important;
  border-color: var(--ha-dark-border) !important;
}

.dark .rp-search-input {
  background-color: var(--ha-dark-surface-variant) !important;
  border-color: var(--ha-dark-border) !important;
  color: var(--ha-dark-text-primary) !important;
}

.dark .rp-search-input::placeholder {
  color: var(--ha-dark-text-tertiary) !important;
}

.dark .rp-pagination-link {
  background-color: var(--ha-dark-card) !important;
  border-color: var(--ha-dark-border) !important;
  color: var(--ha-dark-text-secondary) !important;
}

.dark .rp-pagination-link:hover {
  background-color: var(--ha-dark-elevated-surface) !important;
  color: var(--ha-dark-text-primary) !important;
}

.dark .rp-pagination-link.active {
  background-color: var(--ha-primary-color) !important;
  border-color: var(--ha-primary-color) !important;
  color: var(--ha-dark-text-primary) !important;
}

/* 深色模式按钮样式 */
.dark .rp-button {
  background-color: var(--ha-dark-surface-variant) !important;
  border-color: var(--ha-dark-border) !important;
  color: var(--ha-dark-text-primary) !important;
}

.dark .rp-button:hover {
  background-color: var(--ha-dark-elevated-surface) !important;
}

.dark .rp-button.primary {
  background-color: var(--ha-primary-color) !important;
  border-color: var(--ha-primary-color) !important;
  color: var(--ha-dark-text-primary) !important;
}

.dark .rp-button.primary:hover {
  background-color: #0d8fb3 !important;
}

/* 深色模式标签样式 */
.dark .rp-tag {
  background-color: var(--ha-dark-surface-variant) !important;
  border-color: var(--ha-dark-border) !important;
  color: var(--ha-dark-text-secondary) !important;
}

.dark .rp-tag.primary {
  background-color: var(--ha-primary-color) !important;
  border-color: var(--ha-primary-color) !important;
  color: var(--ha-dark-text-primary) !important;
}

/* 深色模式表格样式 */
.dark .rp-table {
  background-color: var(--ha-dark-card) !important;
  border-color: var(--ha-dark-border) !important;
}

.dark .rp-table th {
  background-color: var(--ha-dark-surface-variant) !important;
  border-color: var(--ha-dark-border) !important;
  color: var(--ha-dark-text-primary) !important;
}

.dark .rp-table td {
  border-color: var(--ha-dark-border) !important;
  color: var(--ha-dark-text-secondary) !important;
}

.dark .rp-table tr:hover {
  background-color: var(--ha-dark-elevated-surface) !important;
}

/* 深色模式选择器样式 */
.dark .rp-select {
  background-color: var(--ha-dark-surface-variant) !important;
  border-color: var(--ha-dark-border) !important;
  color: var(--ha-dark-text-primary) !important;
}

.dark .rp-select-option {
  background-color: var(--ha-dark-card) !important;
  color: var(--ha-dark-text-secondary) !important;
}

.dark .rp-select-option:hover {
  background-color: var(--ha-dark-elevated-surface) !important;
  color: var(--ha-dark-text-primary) !important;
}

/* 深色模式提示框样式 */
.dark .rp-alert {
  background-color: var(--ha-dark-card) !important;
  border-color: var(--ha-dark-border) !important;
}

.dark .rp-alert.info {
  background-color: rgba(2, 136, 209, 0.1) !important;
  border-color: var(--ha-info-color) !important;
  color: var(--ha-info-color) !important;
}

.dark .rp-alert.success {
  background-color: rgba(67, 160, 71, 0.1) !important;
  border-color: var(--ha-success-color) !important;
  color: var(--ha-success-color) !important;
}

.dark .rp-alert.warning {
  background-color: rgba(245, 124, 0, 0.1) !important;
  border-color: var(--ha-warning-color) !important;
  color: var(--ha-warning-color) !important;
}

.dark .rp-alert.error {
  background-color: rgba(229, 57, 53, 0.1) !important;
  border-color: var(--ha-error-color) !important;
  color: var(--ha-error-color) !important;
}

/* 深色模式图标样式 */
.dark .rp-icon {
  color: var(--ha-dark-text-secondary) !important;
}

.dark .rp-icon.primary {
  color: var(--ha-primary-color) !important;
}

/* 深色模式分割线 */
.dark .rp-divider {
  border-color: var(--ha-dark-border) !important;
}

/* 深色模式阴影效果 */
.dark .rp-shadow {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

.dark .rp-shadow-lg {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
}

/* 确保语法高亮在深色模式下清晰可读 */
.dark .code-block .token.string,
.dark .code-block .token.regex,
.dark .code-block .token.inserted {
  color: #9ccee6 !important;
}

.dark .code-block .token.function,
.dark .code-block .token.class-name {
  color: #ffd700 !important;
}

.dark .code-block .token.comment,
.dark .code-block .token.prolog,
.dark .code-block .token.doctype,
.dark .code-block .token.cdata {
  color: #6a9955 !important;
}

.dark .code-block .token.number,
.dark .code-block .token.boolean,
.dark .code-block .token.constant {
  color: #b5cea8 !important;
}

/* 滚动条样式优化 */
.dark ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.dark ::-webkit-scrollbar-track {
  background: var(--ha-dark-surface);
}

.dark ::-webkit-scrollbar-thumb {
  background: var(--ha-dark-border-heavy);
  border-radius: 4px;
}

.dark ::-webkit-scrollbar-thumb:hover {
  background: var(--ha-dark-text-tertiary);
}

/* 主页特色卡片深色模式优化 */
.dark .rp-hero {
  background: linear-gradient(135deg, var(--ha-dark-surface) 0%, var(--ha-dark-card) 100%) !important;
}

.dark .rp-feature-card {
  background-color: var(--ha-dark-card) !important;
  border: 1px solid var(--ha-dark-border) !important;
  transition: all 0.3s ease !important;
}

.dark .rp-feature-card:hover {
  background-color: var(--ha-dark-elevated-surface) !important;
  border-color: var(--ha-primary-color) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(26, 188, 242, 0.15) !important;
}

/* 导航菜单深色模式优化 */
.dark .rp-nav-link {
  color: var(--ha-dark-text-secondary) !important;
}

.dark .rp-nav-link:hover {
  color: var(--ha-primary-color) !important;
}

.dark .rp-nav-link.active {
  color: var(--ha-primary-color) !important;
}

/* 侧边栏目录深色模式优化 */
.dark .rp-toc-link {
  color: var(--ha-dark-text-secondary) !important;
}

.dark .rp-toc-link:hover {
  color: var(--ha-primary-color) !important;
}

.dark .rp-toc-link.active {
  color: var(--ha-primary-color) !important;
  background-color: var(--ha-dark-surface-variant) !important;
}

/* 移除 rspress-doc 最大宽度限制 - 自定义页面宽度 */
.rspress-doc {
  max-width: min(100%, 1390px) !important;
  margin: auto !important;
}

/* 响应式宽度调整 */
@media (max-width: 1400px) {
  .rspress-doc {
    padding: 0 20px;
  }
}

@media (max-width: 768px) {
  .rspress-doc {
    padding: 0 16px;
  }
}

@media (max-width: 480px) {
  .rspress-doc {
    padding: 0 12px;
  }
}