/* ==========================================================================
   橘子窝 · 后台主题覆盖（在 tabler.min.css 之后加载）
   仅改令牌与少量自定义组件，不动 Tabler 组件结构。
   前台是新版「纸面 + 朱砂橘」，后台沿用同一套配色，两处不再打架。
   ========================================================================== */

:root{
  /* Tabler 主色 → 朱砂橘 */
  --tblr-primary:#D6431C;
  --tblr-primary-rgb:214,67,28;
  --tblr-primary-darken:#B33614;
  --tblr-link-color:#A3300F;
  --tblr-link-hover-color:#7E2409;
  /* 纸面与墨色 */
  --tblr-body-bg:#FBFBF8;
  --tblr-body-color:#111110;
  --tblr-body-color-rgb:17,17,16;
  --tblr-secondary-color:rgba(17,17,16,.62);
  --tblr-border-color:#E3E1DA;
  --tblr-border-color-translucent:rgba(17,17,16,.09);
  --tblr-bg-surface:#ffffff;
  --tblr-card-bg:#ffffff;
  /* 圆角与字体：跟前台同一套（近直角、系统字） */
  --tblr-border-radius:3px;
  --tblr-border-radius-sm:2px;
  --tblr-border-radius-lg:4px;
  --tblr-card-border-radius:4px;
  --tblr-font-sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color-scheme:light;
}

/* 侧栏：浅色纸面 + 细线，不用深色大底 */
.navbar-vertical{background:#fff;border-right:1px solid var(--tblr-border-color)}
.navbar-vertical .navbar-brand{color:var(--tblr-body-color);font-weight:750;letter-spacing:-.02em}
.navbar-vertical .navbar-brand .brand-dot{width:9px;height:9px;background:var(--tblr-primary);border-radius:1px;display:inline-block;margin-right:8px}
.navbar-vertical .nav-link{min-height:42px;display:flex;align-items:center;gap:10px;border-radius:3px;
  color:rgba(17,17,16,.72);font-weight:600;font-size:14.5px}
.navbar-vertical .nav-link:hover{background:rgba(17,17,16,.04);color:var(--tblr-body-color)}
.navbar-vertical .nav-link.active{background:rgba(214,67,28,.10);color:var(--tblr-primary-darken)}
.navbar-vertical .nav-link .i{width:18px;height:18px;flex:none}
.navbar-vertical .nav-link.active .i{color:var(--tblr-primary)}

.page-header{margin-bottom:16px}
.page-title{font-weight:750;letter-spacing:-.018em;font-size:22px}

/* 统计块：白底 + 彩色大数字（不用实心彩块） */
.stat-tile{background:#fff;border:1px solid var(--tblr-border-color);border-radius:var(--tblr-card-border-radius);padding:16px 18px;height:100%}
.stat-tile .k{font-size:12.5px;color:rgba(17,17,16,.6);font-weight:600}
.stat-tile .v{font-size:30px;font-weight:800;letter-spacing:-.03em;margin-top:2px;font-variant-numeric:tabular-nums}
.stat-tile .v.acc{color:var(--tblr-primary)}

.table thead th{font-size:12.5px;text-transform:none;letter-spacing:.02em;color:rgba(17,17,16,.6);font-weight:650}
.table td,.table th{padding:11px 12px;vertical-align:middle}
.table .row-actions{white-space:nowrap;text-align:right}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-variant-numeric:tabular-nums}
.muted{color:rgba(17,17,16,.55)}
.small-90{font-size:13px}

/* 触控目标：手机上 ≥44px */
@media (max-width:640px){
  .table td .btn,.table td .btn-icon{min-height:38px}
  .page-body{padding:12px}
}

/* 编辑器 */
.editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px}
@media (max-width:992px){.editor-grid{grid-template-columns:1fr}}
.jz-editor{min-height:420px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13.5px;line-height:1.7}
.tag-picker{display:flex;flex-wrap:wrap;gap:6px}
.tag-picker label{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--tblr-border-color);
  border-radius:999px;padding:5px 11px;font-size:13px;cursor:pointer;min-height:34px;background:#fff}
.tag-picker input{accent-color:var(--tblr-primary)}
.tag-picker label:has(input:checked){border-color:var(--tblr-primary);background:rgba(214,67,28,.08);color:var(--tblr-primary-darken)}

/* 图片上传 */
.drop{border:1px dashed var(--tblr-border-color);border-radius:4px;padding:14px;text-align:center;
  color:rgba(17,17,16,.6);font-size:13px;cursor:pointer;transition:border-color .14s cubic-bezier(.23,1,.32,1)}
.drop:hover{border-color:var(--tblr-primary)}
.avatar-preview{width:72px;height:72px;border-radius:4px;border:1px solid var(--tblr-border-color);object-fit:cover;background:#F4F3EF}

/* 轻提示（替代 alert） */
.jz-toast-wrap{position:fixed;right:16px;bottom:16px;z-index:1080;display:flex;flex-direction:column;gap:8px}
.jz-toast{background:#111110;color:#fff;border-radius:4px;padding:11px 14px;font-size:14px;max-width:320px;
  box-shadow:0 8px 24px rgba(17,17,16,.18);opacity:0;transform:translateY(6px);
  transition:opacity .16s cubic-bezier(.23,1,.32,1),transform .16s cubic-bezier(.23,1,.32,1)}
.jz-toast.show{opacity:1;transform:none}
.jz-toast.err{background:#B33614}
.jz-toast.ok{background:#136D3F}

/* 空状态 */
.empty-state{padding:46px 16px;text-align:center;color:rgba(17,17,16,.55)}
.empty-state .big{font-size:15px;font-weight:650;color:rgba(17,17,16,.75);margin-bottom:4px}

@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms !important;animation-duration:.01ms !important}}

/* 图标尺寸：.i 必须给宽高，否则内联 SVG 在按钮/列表里会被撑成巨图（手机端尤其明显） */
.i{width:18px;height:18px;flex:none;vertical-align:-3px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.btn .i,.btn-icon .i{width:16px;height:16px;vertical-align:0}
.list-group-item .i{width:18px;height:18px;margin-right:8px;color:rgba(17,17,16,.45);vertical-align:-3px}
.badge .i{width:14px;height:14px}
.table .btn .i{width:15px;height:15px}
.drop .i{width:16px;height:16px}

/* 快捷操作：2 列并排小方块（原来是一行一项，手机上占好几屏） */
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.quick{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  min-height:72px;padding:10px 6px;border:1px solid var(--tblr-border-color);border-radius:4px;
  background:#fff;font-size:13.5px;font-weight:650;color:rgba(17,17,16,.78);text-align:center;
  transition:border-color .14s cubic-bezier(.23,1,.32,1),color .14s cubic-bezier(.23,1,.32,1);
}
.quick:hover{border-color:var(--tblr-primary);color:var(--tblr-primary-darken)}
.quick .i{width:20px;height:20px;color:rgba(17,17,16,.5);transition:color .14s cubic-bezier(.23,1,.32,1)}
.quick:hover .i{color:var(--tblr-primary)}
@media (min-width:992px){.quick-grid{grid-template-columns:1fr 1fr}}

/* ==========================================================================
   手机端侧边栏（<992px）：做成真正的左侧抽屉
   原来靠 Tabler 的 collapse，弹出来是全屏覆盖菜单，既不像侧栏也会遮住内容。
   这里用自己的 body.jz-nav-open 开关驱动，transform 是唯一动效属性（GPU 友好）。
   桌面端（≥992px）完全不受影响，仍是 Tabler 的固定侧栏。
   ========================================================================== */
.jz-menu-btn{
  display:none;width:38px;height:38px;padding:0;border:1px solid var(--tblr-border-color);background:#fff;
  border-radius:3px;align-items:center;justify-content:center;flex:none;cursor:pointer;
}
.jz-menu-bars,.jz-menu-bars::before,.jz-menu-bars::after{
  display:block;width:16px;height:1.5px;background:var(--tblr-body-color);content:"";position:relative;
  transition:transform .18s cubic-bezier(.23,1,.32,1),opacity .12s linear;
}
.jz-menu-bars::before{position:absolute;top:-5px}
.jz-menu-bars::after{position:absolute;top:5px}
body.jz-nav-open .jz-menu-bars{transform:rotate(45deg)}
body.jz-nav-open .jz-menu-bars::before{transform:translateY(5px) rotate(-90deg)}
body.jz-nav-open .jz-menu-bars::after{opacity:0}
.jz-scrim{position:fixed;inset:0;z-index:1044;background:rgba(17,17,16,.40);opacity:0;transition:opacity .16s cubic-bezier(.23,1,.32,1)}
body.jz-nav-open .jz-scrim{opacity:1}

@media (max-width:991.98px){
  .jz-menu-btn{display:inline-flex}
  /* 侧栏本体：固定在左边，默认整块推到屏幕外 */
  .navbar-vertical{
    position:fixed;top:0;bottom:0;left:0;width:276px;max-width:84vw;z-index:1045;
    display:flex;flex-direction:column;padding:0;overflow-y:auto;overscroll-behavior:contain;
    background:#fff;border-right:1px solid var(--tblr-border-color);
    transform:translateX(-100%);transition:transform .22s cubic-bezier(.23,1,.32,1),box-shadow .22s cubic-bezier(.23,1,.32,1);
    will-change:transform;
  }
  body.jz-nav-open .navbar-vertical{transform:translateX(0);box-shadow:20px 0 44px rgba(17,17,16,.16)}
  /* Tabler 手机端把 collapse 做成 fixed 全屏浮层，这里全部还原成普通流 */
  .navbar-vertical .container-fluid{display:flex;flex-direction:column;height:100%;padding:14px 12px}
  .navbar-vertical .navbar-collapse{
    position:static !important;width:auto !important;max-width:none !important;height:auto !important;
    display:flex !important;flex-direction:column;flex:1;transform:none !important;visibility:visible !important;
    background:transparent !important;box-shadow:none !important;padding:0 !important;margin:0 !important;
  }
  .navbar-vertical .navbar-toggler{display:none}
  /* Tabler 手机端把垂直导航的内容做成居中排（品牌/菜单/底部链接都往中间缩），
     侧栏必须左对齐 + 整行铺满，跟桌面端一致 */
  .navbar-vertical .navbar-nav,
  .navbar-vertical .navbar-collapse,
  .navbar-vertical .container-fluid{text-align:left;align-items:stretch;justify-content:flex-start}
  .navbar-vertical .navbar-nav{padding:0;width:100%}
  .navbar-vertical .nav-item{width:100%}
  .navbar-vertical .nav-link{width:100%;justify-content:flex-start;text-align:left;padding:10px 12px}
  .navbar-vertical .navbar-brand{width:100%;justify-content:flex-start;text-align:left;display:flex;align-items:center}
  .navbar-vertical .mt-auto{width:100%}
  .navbar-vertical .mt-auto .nav-link{justify-content:flex-start}
  .navbar-vertical .nav-link-title{text-align:left}
  .navbar-vertical .navbar-brand{font-size:16px;margin:2px 0 10px 6px}
  .navbar-vertical .nav-link{min-height:46px;font-size:15px}   /* 触控目标 ≥44px */
  .navbar-vertical .nav-link .i{width:20px;height:20px}
}
@media (prefers-reduced-motion:reduce){
  .navbar-vertical,.jz-scrim,.jz-menu-bars,.jz-menu-bars::before{transition:none !important}
}

/* 手机端表格：给最小宽度让它横向滚动，否则 4 列挤成竖排单字（卡片/文章列表全是这种） */
@media (max-width:991.98px){
  .table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .table{min-width:620px}
  .table th,.table td{white-space:nowrap}
  .table td .muted,.table td .small-90{white-space:normal}   /* 长标题允许换行，别撑爆 */
}

/* ==========================================================================
   侧栏填充：用户卡片 + 内容概览
   原来 brand 下面是 nav，nav 下面到「查看前台」之间是一大片空白（手机与桌面都空）
   ========================================================================== */
.jz-side-user{display:flex;align-items:center;gap:10px;margin:0 0 8px;padding:10px;border:1px solid var(--tblr-border-color);border-radius:4px}
.jz-side-user img,.jz-side-user .ph{
  width:34px;height:34px;flex:none;border-radius:3px;object-fit:cover;display:flex;align-items:center;
  justify-content:center;background:rgba(214,67,28,.10);color:var(--tblr-primary);font-weight:750;font-size:15px;
}
.jz-side-user .tx{min-width:0}
.jz-side-user .nm{font-size:14px;font-weight:700;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jz-side-user .un{font-size:12px;color:var(--tblr-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jz-side-cap{margin:16px 0 6px;font-size:11px;letter-spacing:.1em;color:var(--tblr-secondary)}
.jz-side-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.jz-side-stats a{
  display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 2px;text-decoration:none;
  border:1px solid var(--tblr-border-color);border-radius:4px;
  transition:border-color .14s cubic-bezier(.23,1,.32,1);
}
.jz-side-stats a:hover{border-color:var(--tblr-primary)}
.jz-side-stats .n{font-size:16px;font-weight:750;line-height:1;color:var(--tblr-body-color)}
.jz-side-stats .l{font-size:11.5px;color:var(--tblr-secondary)}
.jz-side-stats a.is-on{border-color:rgba(214,67,28,.45);background:rgba(214,67,28,.06)}
.jz-side-stats a.is-on .n{color:var(--tblr-primary)}
/* 底部两项与上方内容用细线分开，不再是悬空的两行 */
.navbar-vertical .mt-auto{border-top:1px solid var(--tblr-border-color);padding-top:8px;margin-top:16px}
.jz-side-recent{display:flex;flex-direction:column;gap:2px}
.jz-side-recent a{
  display:block;padding:7px 8px;border-radius:3px;font-size:13px;line-height:1.35;text-decoration:none;
  color:rgba(17,17,16,.78);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:background-color .14s cubic-bezier(.23,1,.32,1),color .14s cubic-bezier(.23,1,.32,1);
}
.jz-side-recent a:hover{background:rgba(17,17,16,.04);color:var(--tblr-body-color)}
.jz-side-recent .none{font-size:12.5px;color:var(--tblr-secondary);padding:6px 8px}