/* 主题覆盖层：Tabler 之上做品牌红定制 + 自定义组件 */
:root {
  --tblr-primary: #d81e06;
  --tblr-primary-rgb: 216, 30, 6;
  --tblr-primary-dark: #b81a05;
  --tblr-body-bg: #f5f7f9;
}

/* 品牌红主按钮 */
.btn-primary {
  --tblr-btn-bg: #d81e06;
  --tblr-btn-bg-hover: #b81a05;
  --tblr-btn-bg-active: #a81804;
  --tblr-btn-color: #fff;
  --tblr-btn-color-hover: #fff;
  --tblr-btn-border-color: #d81e06;
  --tblr-btn-border-color-hover: #b81a05;
  background: #d81e06;
  border-color: #d81e06;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active:not(.disabled):not([disabled]) {
  background: #b81a05 !important;
  border-color: #b81a05 !important;
  color: #fff !important;
}
.btn-primary:disabled { background: #f0a49b !important; border-color: #f0a49b !important; }
.bg-red { background: #d81e06 !important; }
.progress-bar.bg-red { background: #d81e06 !important; }
.page-header .page-title b, .text-red { color: #d81e06 !important; }
.navbar-brand { font-weight: 700; }
.navbar .nav-link.active, .navbar .nav-link:hover { color: #d81e06 !important; }

/* 首页统计 */
.hero-stats { text-align: center; }
.hero-stats b { display: block; font-size: 24px; color: #d81e06; line-height: 1.2; }
.hero-stats span { font-size: 13px; color: #6b7280; }

/* 工具卡片 */
.tool-card { height: 100%; transition: box-shadow .15s, border-color .15s, transform .15s; }
.tool-card:hover { transform: translateY(-2px); border-color: #356ffe; box-shadow: 0 4px 14px rgba(53, 111, 254, .12); }
.tool-card .card-title { font-size: 15px; }

/* 统一图标块：全站一致的品牌红渐变 + 白色图标 */
.tool-icon-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: linear-gradient(135deg, #e8452f 0%, #d81e06 60%, #b81a05 100%);
  color: #fff;
  font-size: 24px;
  box-shadow: 0 3px 8px rgba(216, 30, 6, .25);
  flex-shrink: 0;
}
.tool-card:hover .tool-icon-chip { transform: scale(1.06); transition: transform .15s; }
.tool-desc { font-size: 12.5px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tool-meta { min-height: 22px; }
.min-width-0 { min-width: 0; }

/* 管理后台：依赖指引数据格单列排版 */
.datagrid { display: grid !important; grid-template-columns: 1fr !important; gap: .75rem !important; }
.datagrid-item { width: 100%; }
.datagrid-title { font-weight: 600; margin-bottom: 2px; }
.datagrid-content code { background: #f1f3f5; padding: 1px 5px; border-radius: 4px; font-size: 12px; }

/* 管理后台左侧导航 */
.admin-sidebar-footer { margin-top: auto; border-top: 1px solid rgba(98, 105, 118, .16); padding: .75rem 1rem; }
.navbar-vertical .navbar-brand { padding-top: .5rem; padding-bottom: .5rem; font-size: 15px; }
.navbar-vertical .nav-label { padding: 1rem 1rem .25rem; font-size: 11px; text-transform: none; letter-spacing: 1px; color: rgba(82, 82, 99, .6); }
.navbar-vertical .nav-link.active { background: rgba(216, 30, 6, .12); color: #d81e06 !important; border-radius: 6px; }
.navbar-vertical .nav-link:hover { color: #d81e06; }
.navbar-vertical .navbar-brand .badge { font-size: 10px; vertical-align: middle; }
.card-sm .card-body { padding: .9rem; }

/* 上传区 */
.dropzone { border: 2px dashed #c2c2c2; border-radius: 8px; padding: 40px 20px; text-align: center; cursor: pointer; transition: .15s; background: #fafbfc; }
.dropzone:hover, .dropzone.dragover { border-color: #356ffe; background: #f2f7ff; }
.dz-icon { width: 52px; height: 52px; margin-bottom: 8px; }
.dz-title { font-size: 15.5px; margin-bottom: 4px; color: #1f2329; }
.dz-title b { color: #356ffe; }
.dz-sub { font-size: 13px; color: #6b7280; margin-bottom: 0; }

/* 文件列表 */
.file-list { list-style: none; padding: 0; margin-top: 14px; }
.file-list li { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid #e6e6e6; border-radius: 6px; margin-top: 8px; font-size: 14px; background: #fafafa; }
.file-list .fname { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 55%; flex: 1; }
.file-list .fsize { color: #6b7280; font-size: 12px; flex-shrink: 0; }
.file-list .fremove { color: #6b7280; cursor: pointer; border: 0; background: none; font-size: 18px; line-height: 1; padding: 0 2px; }
.file-list .fremove:hover { color: #d81e06; }

/* 进度与结果 */
.progress-wrap .progress { height: 10px; border-radius: 5px; }
.progress-text { font-size: 13px; }
.result-title { font-weight: 700; }
.result-wrap .avatar { width: 56px; height: 56px; }

/* 验证码 */
.captcha-img { height: 38px; border-radius: 4px; border: 1px solid #e6e6e6; cursor: pointer; margin-left: -1px; }

/* 工具页容器 */
@media (min-width: 992px) {
  .page-body .container-xl[style*="900px"] { max-width: 900px !important; }
}

/* 后台：明确内容层级与窄屏适配 */
.navbar-vertical { background: #17212f !important; }
.navbar-vertical .navbar-brand { min-height: 72px; border-bottom: 1px solid rgba(255,255,255,.1); }
.navbar-vertical .nav-label { color: #9baec4; }
.navbar-vertical .nav-link { border-radius: 8px; margin: 2px 10px; padding: 10px 12px; }
.navbar-vertical .nav-link.active { background: rgba(255,255,255,.14); color: #fff !important; }
.navbar-vertical .nav-link:hover { background: rgba(255,255,255,.08); color: #fff !important; }
.page-wrapper .card { border-radius: 12px; box-shadow: 0 2px 12px rgba(20,31,48,.04); }
.page-wrapper .card-title { letter-spacing: .01em; }
.page-wrapper .table td { vertical-align: middle; }
.page-wrapper .table-responsive { overflow-x: auto; }
@media (max-width: 991px) {
  .navbar-vertical { width: 100%; min-height: auto; }
  .navbar-vertical .navbar-nav { flex-direction: row; flex-wrap: wrap; gap: 4px; }
  .navbar-vertical .nav-label, .admin-sidebar-footer { display: none; }
  .navbar-vertical .nav-link { margin: 2px; padding: 8px; }
  .page-wrapper .container-xl { padding-left: 16px; padding-right: 16px; }
}