﻿/* ==== 蜂鸟 UI 复刻 · 布局层 (flit2-layout.css) ==== */

/* ---------- 图标栏模式（默认开启：88px 图标轨，蜂鸟同款） ---------- */
html.flit2-rail [data-slot="sidebar-wrapper"]{--sidebar-width:5.5rem!important}
html.flit2-rail [data-slot="sidebar-gap"]{width:5.5rem!important}
html.flit2-rail [data-slot="sidebar-container"]{width:5.5rem!important}
html.flit2-rail [data-slot="sidebar-inner"]{width:5.5rem!important}

html.flit2-rail [data-slot="sidebar-content"]{padding:8px 0 64px!important}
html.flit2-rail [data-slot="sidebar-group"]{padding:0 8px 2px!important}
html.flit2-rail [data-slot="sidebar-group-content"]>div{
  font-size:8px!important;letter-spacing:.1em!important;
  justify-content:center;padding:10px 0 4px!important;color:#a8b3c6!important;
}
html.flit2-rail [data-slot="sidebar-group-content"]>div::after{display:none}

html.flit2-rail [data-slot="sidebar-content"] [data-slot="sidebar-menu-button"]{
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  height:56px!important;
  width:100%!important;
  padding:6px 2px!important;
  font-size:10px!important;
  line-height:1.12!important;
  text-align:center!important;
  white-space:normal!important;
  border-radius:13px!important;
  border:1px solid transparent!important;
  background:transparent!important;
}
html.flit2-rail [data-slot="sidebar-content"] [data-slot="sidebar-menu-button"]>span{
  max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;
  white-space:nowrap!important;font-size:10px!important;font-weight:500!important;letter-spacing:-.01em;
}
html.flit2-rail [data-slot="sidebar-content"] [data-slot="sidebar-menu-button"] svg{
  width:20px!important;height:20px!important;stroke-width:1.8;
}
html.flit2-rail [data-slot="sidebar-content"] [data-slot="sidebar-menu-button"]:hover{
  background:var(--signal-wash)!important;color:var(--hero)!important;
}
html.flit2-rail [data-slot="sidebar-content"] [data-slot="sidebar-menu-button"][data-active="true"]{
  background:var(--signal)!important;color:#fff!important;border-color:var(--signal)!important;
  box-shadow:0 10px 22px -12px rgba(33,85,255,.95);
}
html.flit2-rail [data-slot="sidebar-content"] [data-slot="sidebar-menu-button"][data-active="true"] span{color:#fff!important}

/* 品牌区在图标栏里向右溢出，跟蜂鸟一致 */
html.flit2-rail [data-slot="sidebar-header"]{overflow:visible!important}
html.flit2-rail [data-slot="sidebar-header"] [data-slot="sidebar-menu-button"]{
  min-width:250px!important;position:relative!important;z-index:8;
  padding-left:16px!important;
}

/* 展开/收起轨道的按钮 */
.flit2-rail-toggle{
  position:fixed;z-index:40;
  left:calc(var(--flit2-inset) + 24px);bottom:16px;
  width:32px;height:32px;display:flex;align-items:center;justify-content:center;
  border-radius:10px;border:1px solid var(--line);background:var(--paper);color:var(--mute);
  box-shadow:0 8px 18px -14px rgba(12,18,34,.6);cursor:pointer;
  transition:all .15s ease;
}
.flit2-rail-toggle:hover{color:var(--signal);border-color:#c3d1ff;background:var(--signal-wash)}
.flit2-rail-toggle svg{width:15px;height:15px}
html:not(.flit2-rail) .flit2-rail-toggle{left:calc(var(--flit2-inset) + 184px)}

/* ---------- 内容区节奏 ---------- */
main>div[class*="flex-1"]{min-height:0}
main .space-y-6>*+*{margin-top:20px}

/* 顶部状态条（系统运行中 / 自动刷新）压扁成蜂鸟风格细条 */
main .text-xs{letter-spacing:.01em}

/* 卡片头部 */
[data-slot="card-header"]{padding:16px 20px 10px!important}
[data-slot="card-title"]{font-size:14.5px!important;font-weight:600!important;letter-spacing:-.005em}
[data-slot="card-description"]{font-size:12px!important;color:var(--mute)!important}
[data-slot="card-content"]{padding:0 20px 16px!important}

/* 统计卡：蜂鸟式紧凑数字 */
[data-slot="card"] .text-3xl,[data-slot="card"] .text-2xl{letter-spacing:-.02em}

/* 空状态 */
.text-center.text-muted-foreground,.text-muted-foreground.text-center{
  color:#9aa6b8!important;font-size:12.5px;
}

/* 底部批量操作条 */
.flit2-bulkbar{
  position:sticky;bottom:0;z-index:15;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:12px 16px;margin:0 -4px -4px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(8px);
  border-top:1px solid var(--line);
}

/* 设备卡片网格间距 */
.grid.gap-4{gap:16px!important}

/* 圆角图标按钮（蜂鸟工具条） */
.flit2-iconbtn{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:10px;border:1px solid var(--line);
  background:var(--paper);color:var(--mute);transition:all .15s ease;
}
.flit2-iconbtn:hover{color:var(--signal);border-color:#c3d1ff;background:var(--signal-wash);box-shadow:0 6px 14px -10px rgba(33,85,255,.8)}

/* APK / 模板 等密集表单：标签统一 */
main label{font-size:12.5px;font-weight:500;color:var(--mute)}
main .text-\[15px\]{letter-spacing:-.01em}

/* 让长页面滚动条不挤压卡片 */
main [class*="overflow-auto"]{scrollbar-gutter:stable}

/* ---------- 顶栏与品牌区对齐（蜂鸟：品牌溢出到顶栏左侧） ---------- */
main>header{padding-left:172px!important}
main>header [data-slot="sidebar-trigger"]{display:none!important}
main>header [data-slot="separator-root"]{display:none!important}

.flit2-meta{display:flex;align-items:center;gap:8px;margin-right:6px}
.flit2-meta .fa-role{
  display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:6px;
  background:#eef2f9;color:#33405a;font-size:11.5px;font-weight:600;
}
.flit2-meta .fa-ver{
  display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:6px;
  background:var(--signal-wash);color:var(--signal);
  font-family:var(--font-mono);font-size:10.5px;font-weight:600;letter-spacing:.02em;
}
.flit2-meta .fa-full{
  display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:7px;
  border:1px solid var(--line);background:#fff;color:#33405a;font-size:11.5px;cursor:pointer;
}
.flit2-meta .fa-full:hover{border-color:#c3d1ff;color:var(--signal);background:var(--signal-wash)}

/* ---------- 侧栏底部状态：图标栏模式下压缩 ---------- */
html.flit2-rail [data-slot="sidebar-footer"]{padding:6px 8px 8px!important;border-top:1px solid var(--line)}
html.flit2-rail [data-slot="sidebar-footer"] .flex,
html.flit2-rail [data-slot="sidebar-footer"]>div{
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  font-size:8px!important;
  line-height:1.1!important;
  text-align:center;
  width:100%;
  writing-mode:horizontal-tb!important;
}
html.flit2-rail [data-slot="sidebar-footer"] *{font-size:8.5px!important;white-space:normal!important;word-break:break-all}
html.flit2-rail [data-slot="sidebar-footer"] svg{width:12px!important;height:12px!important}

/* ---------- 顶栏不换行 ---------- */
main>header{flex-wrap:nowrap!important;overflow:hidden}
main>header #breadcrumb{min-width:0;flex-shrink:1;overflow:hidden}
main>header #breadcrumb [data-slot="breadcrumb-list"]{flex-wrap:nowrap!important}
main>header #breadcrumb [data-slot="breadcrumb-page"]{
  display:block;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.flit2-meta{white-space:nowrap;flex-shrink:0}

/* ---------- 深色主题遗留的提示框 ---------- */
[class*="bg-yellow-950"],[class*="bg-amber-950"]{
  background-color:#fffaf0!important;border-color:#f2dfb4!important;
}
[class*="border-yellow-900"],[class*="border-amber-900"]{border-color:#f2dfb4!important}
.text-yellow-300,.text-yellow-400,.text-yellow-500,.text-amber-400,.text-amber-500{color:#a86400!important}
.text-green-400,.text-emerald-400{color:#0b8f63!important}
.text-red-400,.text-rose-400{color:#c43c46!important}
.text-blue-400,.text-sky-400,.text-indigo-400{color:#2155ff!important}
[class*="bg-red-950"],[class*="bg-rose-950"]{background-color:#fdf3f4!important;border-color:#f2ccd0!important}
[class*="bg-green-950"],[class*="bg-emerald-950"]{background-color:#eff8f4!important;border-color:#c9e7da!important}
[class*="bg-blue-950"],[class*="bg-indigo-950"]{background-color:#f1f5ff!important;border-color:#d3ddff!important}
[class*="bg-gray-900"],[class*="bg-slate-900"],[class*="bg-zinc-900"]{background-color:#f5f7fb!important;border-color:var(--line)!important}

/* ---------- 图标栏底部：只保留折叠手柄 ---------- */
html.flit2-rail [data-slot="sidebar-footer"]{display:none!important}
.flit2-rail-toggle{left:calc(var(--flit2-inset) + 26px)!important;bottom:14px!important;width:36px!important;height:34px!important}
html:not(.flit2-rail) .flit2-rail-toggle{left:calc(var(--flit2-inset) + 184px)!important}

/* ---------- 顶栏响应式 ---------- */
main>header>div[class*="flex-1"]{min-width:0;overflow:hidden}
.flit2-clock{white-space:nowrap}
@media (max-width:1560px){
  main>header{padding-left:158px!important;gap:6px!important}
  main>header input{width:96px!important}
  main>header .flit2-clock{display:none!important}
  main>header button[class*="rounded-md"],main>header button[class~="rounded-md"]{padding-left:6px!important;padding-right:6px!important}
}
@media (max-width:1360px){
  main>header{padding-left:150px!important}
  main>header #breadcrumb{display:none!important}
  .flit2-meta .fa-full{display:none}
}
@media (max-width:1200px){
  .flit2-meta .fa-ver{display:none}
}
