:root {
  --app-bg: #f0f6f4;
  --app-bg-accent: #e8f4f0;
  --app-surface: #ffffff;
  --app-border: #dce8e4;
  --app-text: #1e293b;
  --app-muted: #64748b;
  --app-primary: #0d9488;
  --app-primary-hover: #0f766e;
  --app-primary-soft: #ccfbf1;
  --app-shadow: 0 1px 2px rgba(15, 60, 55, 0.06), 0 8px 24px rgba(15, 60, 55, 0.05);
  --app-radius: 12px;
}

* {
  box-sizing: border-box;
}

body.app-body {
  min-height: 100vh;
  margin: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Segoe UI", system-ui, sans-serif;
  color: var(--app-text);
  background: linear-gradient(165deg, #f8fcfb 0%, var(--app-bg) 45%, #eef6f3 100%);
  background-attachment: fixed;
}

.app-navbar {
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--app-border) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

.navbar-brand {
  color: var(--app-primary) !important;
  font-weight: 600;
}

.navbar-brand i {
  color: var(--app-primary);
}

.app-body .card {
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius);
  box-shadow: var(--app-shadow);
}

.app-body .card-header {
  background: linear-gradient(to bottom, #fafdfc, #fff);
  border-bottom: 1px solid var(--app-border);
  font-weight: 600;
}

.app-body .table {
  --bs-table-hover-bg: var(--app-primary-soft);
}

.app-body .table thead th {
  background: var(--app-bg-accent);
  color: var(--app-muted);
  font-weight: 600;
  font-size: 0.8rem;
  text-transform: none;
  border-bottom: 1px solid var(--app-border);
}

.app-body .btn-primary {
  --bs-btn-bg: var(--app-primary);
  --bs-btn-border-color: var(--app-primary);
  --bs-btn-hover-bg: var(--app-primary-hover);
  --bs-btn-hover-border-color: var(--app-primary-hover);
  --bs-btn-active-bg: var(--app-primary-hover);
  --bs-btn-active-border-color: var(--app-primary-hover);
}

.app-body .btn-outline-primary {
  --bs-btn-color: var(--app-primary);
  --bs-btn-border-color: #99d5cf;
  --bs-btn-hover-bg: var(--app-primary-soft);
  --bs-btn-hover-border-color: var(--app-primary);
  --bs-btn-hover-color: var(--app-primary-hover);
}

.app-body .form-control,
.app-body .form-select {
  border-color: var(--app-border);
  border-radius: 8px;
}

.app-body .form-control:focus,
.app-body .form-select:focus {
  border-color: #5eead4;
  box-shadow: 0 0 0 0.2rem rgba(13, 148, 136, 0.15);
}

.app-body .alert-success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}

.app-body .alert-info {
  background: #f0fdfa;
  border-color: #99f6e4;
  color: #115e59;
}

.app-body .alert-danger {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}

.app-body .badge.text-bg-success {
  background-color: #10b981 !important;
}

.app-body .badge.text-bg-info {
  background-color: #14b8a6 !important;
}

.file-tree {
  max-height: 70vh;
  overflow: auto;
  font-size: 0.9rem;
  background: #fafdfc;
  border: 1px solid var(--app-border) !important;
}

.file-tree .folder-name {
  color: #0d9488;
  font-weight: 500;
}

.file-tree .file-name {
  color: var(--app-muted);
}

code {
  font-size: 0.85em;
  color: #0f766e;
  background: var(--app-primary-soft);
  padding: 0.1em 0.35em;
  border-radius: 4px;
}

a {
  color: var(--app-primary);
}

a:hover {
  color: var(--app-primary-hover);
}

/* ===== 移动端适配 ===== */

html {
  -webkit-text-size-adjust: 100%;
}

body.app-body {
  overflow-x: hidden;
}

.app-navbar .container-lg,
main.container-lg {
  padding-left: max(0.75rem, env(safe-area-inset-left));
  padding-right: max(0.75rem, env(safe-area-inset-right));
}

/* 触控目标不小于 44px */
@media (max-width: 767.98px) {
  .app-body .btn {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .app-body .btn-sm {
    min-height: 36px;
    padding: 0.4rem 0.75rem;
    font-size: 0.85rem;
  }

  .app-body .form-control,
  .app-body .form-select {
    font-size: 1rem; /* iOS 下 <16px 会自动放大页面 */
    min-height: 44px;
  }

  .app-navbar {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .app-navbar .navbar-brand {
    font-size: 1rem;
  }

  .app-body .card-body {
    padding: 1rem;
  }

  .app-body h1.h3,
  .app-body .h3 {
    font-size: 1.25rem;
  }

  .app-body .h4,
  .app-body h1.h4 {
    font-size: 1.1rem;
  }
}

/* 导航栏操作区换行，避免小屏挤出 */
.navbar-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

@media (max-width: 767.98px) {
  .navbar-actions {
    width: 100%;
    margin-top: 0.5rem;
  }

  .navbar-actions .btn {
    flex: 1 1 auto;
  }

  .navbar-actions form {
    flex: 1 1 auto;
  }

  .navbar-actions form .btn {
    width: 100%;
  }
}

/* 移动端卡片式列表：窄屏隐藏表头、每个单元格独立成行 */
@media (max-width: 767.98px) {
  .table-mobile thead {
    display: none;
  }

  .table-mobile,
  .table-mobile tbody,
  .table-mobile tr,
  .table-mobile td {
    display: block;
    width: 100%;
  }

  .table-mobile tr {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--app-border);
  }

  .table-mobile tr:last-child {
    border-bottom: 0;
  }

  .table-mobile td {
    border: 0 !important;
    padding: 0.2rem 0;
  }

  .table-mobile td::before {
    content: attr(data-label);
    display: block;
    font-size: 0.72rem;
    color: var(--app-muted);
    margin-bottom: 0.1rem;
  }

  .table-mobile td[data-label=""]::before,
  .table-mobile td:not([data-label])::before {
    display: none;
  }

  .table-mobile td.cell-actions {
    margin-top: 0.6rem;
  }

  .table-mobile td.cell-actions .btn-group {
    display: flex;
    width: 100%;
    gap: 0.4rem;
  }

  .table-mobile td.cell-actions .btn-group > .btn {
    flex: 1 1 auto;
    border-radius: 8px !important;
    margin: 0 !important;
  }
}

/* 目录树：小屏字号与缩进收紧 */
@media (max-width: 767.98px) {
  .file-tree {
    max-height: 60vh;
    font-size: 0.85rem;
    padding: 0.75rem !important;
  }

  .file-tree ul.ms-3 {
    margin-left: 0.75rem !important;
  }

  .file-tree .file-meta {
    display: block;
    margin-left: 1.25rem;
  }
}

/* 详情页长文本换行 */
.text-break-anywhere {
  word-break: break-all;
  overflow-wrap: anywhere;
}

.push-body {
  font-family: inherit;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.push-body .push-heading {
  font-size: 1rem;
  font-weight: 600;
  margin: 0.25rem 0 0.5rem;
}

.push-body .push-paragraph {
  margin: 0 0 0.5rem;
}

.push-body .push-quote {
  margin: 0 0 0.5rem;
  padding: 0.35rem 0.75rem;
  border-left: 3px solid #99d5cf;
  background: #f0fdfa;
  border-radius: 0 8px 8px 0;
  color: #0f766e;
  font-size: 0.9rem;
}

.push-body .push-quote div {
  word-break: break-all;
  overflow-wrap: anywhere;
}

.push-body .md-info {
  color: var(--app-primary);
  font-weight: 600;
}

.push-body .md-comment {
  color: var(--app-muted);
}

.push-body .md-warning {
  color: #d97706;
  font-weight: 600;
}

.push-body .md-danger {
  color: #dc2626;
  font-weight: 600;
}

.push-body .md-success {
  color: #16a34a;
  font-weight: 600;
}

@media (max-width: 767.98px) {
  .push-body {
    font-size: 0.9rem;
  }
}

.stack-actions > * {
  margin: 0;
}

@media (max-width: 575.98px) {
  .stack-actions {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }

  .stack-actions .btn,
  .stack-actions form,
  .stack-actions form .btn {
    width: 100%;
  }
}

@media (min-width: 768px) {
  .w-md-auto {
    width: auto !important;
  }
}

@media (min-width: 768px) {
  .h-md-5 {
    font-size: 1.25rem;
  }
}

.push-detail .share-link-box {
  padding: 0.6rem 0.75rem;
  border: 1px solid #cdeae6;
  border-radius: 10px;
  background: #f0fdfa;
}

.push-detail .share-link-box .share-link {
  color: #0f766e;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
}

.push-detail .share-link-box .share-link:hover {
  text-decoration: underline;
}