/* ============================================================
   CheckCheck 查查吧 品牌基础样式
   视觉方向：朱红「查」印章 + 墨色，审验/核查的产品气质
   ============================================================ */

:root {
  --ink-900: #0D131C;
  --ink-800: #131B27;
  --ink-700: #1C2635;
  --ink-500: #3A475C;
  --paper: #F7F5F0;
  --paper-dim: #EEEAE1;

  --seal: #D8443C;          /* 朱红（品牌主色） */
  --seal-deep: #B03229;
  --seal-tint: #FBECEA;

  --ok: #16856B;            /* 正常 */
  --ok-tint: #E4F4EF;
  --warn: #C97F16;          /* 临期 */
  --warn-tint: #FBF0DD;
  --bad: #D8443C;           /* 异常 */
  --bad-tint: #FBECEA;
  --muted: #7A8699;         /* 受限 */

  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas,
          "PingFang SC", "Microsoft YaHei", monospace;
  --sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
          "Noto Sans SC", -apple-system, sans-serif;

  /* 多巴胺三色板（方案C收敛：朱红 + 黄 + 蓝，全站统一色源） */
  --dp-red: #D8443C;          /* = --seal 朱红（品牌主色） */
  --dp-yellow: #FFD93D;       /* 黄 */
  --dp-blue: #4D96FF;         /* 蓝 */
  --dp-ink: #1F1B24;          /* 描边/硬阴影墨色 */
  --dp-white: #FFFDF7;        /* 米白卡底 */
}

html { -webkit-font-smoothing: antialiased; }

body {
  font-family: var(--sans);
  color: var(--ink-800);
  background: var(--paper);
}

/* ---------- 品牌标识 ---------- */
.cc-logo {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  text-decoration: none !important;
}
.cc-logo .seal {
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  background: var(--seal);
  color: #fff;
  font-weight: 800;
  font-size: 1.05rem;
  border-radius: .45rem;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .28), 0 2px 6px rgba(216, 68, 60, .4);
  transform: rotate(-6deg);
  font-family: var(--sans);
  flex: 0 0 auto;
}
.cc-logo .seal.lg { width: 2.6rem; height: 2.6rem; font-size: 1.4rem; border-radius: .55rem; }
.cc-logo .word {
  font-weight: 800;
  letter-spacing: .02em;
  font-size: 1.12rem;
  color: var(--ink-900);
}
.cc-logo .word small {
  display: block;
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .34em;
  color: var(--muted);
  font-family: var(--mono);
  text-transform: uppercase;
}
.cc-logo.on-dark .word { color: #F4F1EA; }

/* ---------- 数据等宽 ---------- */
.cc-mono, .cc-num {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
}

/* ---------- 状态徽标 ---------- */
.cc-badge {
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  padding: .18rem .6rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.5;
}
.cc-badge::before {
  content: "";
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: currentColor;
}
.cc-badge.ok    { color: var(--ok);   background: var(--ok-tint); }
.cc-badge.warn  { color: var(--warn); background: var(--warn-tint); }
.cc-badge.bad   { color: var(--bad);  background: var(--bad-tint); }
.cc-badge.muted { color: var(--muted);background: #EDF0F4; }
.cc-badge.idle  { color: var(--ink-500); background: #EDF0F4; }

/* 临期/异常徽标呼吸点 */
.cc-badge.warn::before, .cc-badge.bad::before { animation: cc-pulse 1.6s ease-in-out infinite; }
@keyframes cc-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .35; transform: scale(.75); }
}

/* ---------- 剩余天数按方案分档：>15绿 / 7~15黄 / ≤7红 ---------- */
.cc-days.ok   { color: var(--ok); }
.cc-days.warn { color: var(--warn); font-weight: 700; }
.cc-days.bad  { color: var(--bad);  font-weight: 700; }

/* ---------- 按钮 ---------- */
.btn-seal {
  background: var(--seal);
  border-color: var(--seal);
  color: #fff;
  font-weight: 600;
}
.btn-seal:hover, .btn-seal:focus {
  background: var(--seal-deep);
  border-color: var(--seal-deep);
  color: #fff;
}
.btn-seal:disabled { opacity: .6; color: #fff; }
.btn-ink {
  background: var(--ink-800);
  border-color: var(--ink-800);
  color: #F4F1EA;
}
.btn-ink:hover { background: var(--ink-900); color: #fff; }

/* ---------- 卡片（全站统一"硬阴影描边卡"语言，方案C） ---------- */
.cc-card {
  background: var(--dp-white, #fff);
  border: 2px solid var(--dp-ink, #1F1B24);
  border-radius: .95rem;
  box-shadow: 5px 5px 0 var(--dp-ink, #1F1B24);
}

/* ---------- 表格 ---------- */
.cc-table thead th {
  font-size: .74rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 700;
  border-bottom: 2px solid var(--paper-dim) !important;
  white-space: nowrap;
}
.cc-table td { vertical-align: middle; }

/* ---------- 提示条 ---------- */
#cc-toast-root {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.cc-toast {
  min-width: 240px;
  max-width: 380px;
  padding: .7rem 1rem;
  border-radius: .5rem;
  color: #fff;
  font-size: .88rem;
  box-shadow: 0 8px 24px rgba(13, 19, 28, .22);
  animation: cc-slide-in .28s cubic-bezier(.2, .9, .3, 1.2);
}
.cc-toast.success { background: var(--ok); }
.cc-toast.error   { background: var(--bad); }
.cc-toast.info    { background: var(--ink-700); }
@keyframes cc-slide-in {
  from { opacity: 0; transform: translateX(30px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ---------- 首页专用 ---------- */
.cc-hero {
  background:
    radial-gradient(1100px 480px at 82% -10%, rgba(216, 68, 60, .17), transparent 60%),
    radial-gradient(900px 500px at 8% 110%, rgba(22, 133, 107, .12), transparent 55%),
    var(--ink-900);
  color: #F4F1EA;
  position: relative;
  overflow: hidden;
}
.cc-hero::after {
  /* 网格底纹：监控/扫描的秩序感 */
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(244, 241, 234, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244, 241, 234, .045) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(720px 420px at 50% 30%, #000 30%, transparent 78%);
  pointer-events: none;
}
.cc-hero h1 {
  font-weight: 800;
  letter-spacing: -.01em;
  line-height: 1.14;
}

/* 查询台（工具卡） */
.cc-tool {
  background: rgba(255, 255, 255, .97);
  color: var(--ink-800);
  border: 1px solid rgba(255, 255, 255, .5);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .38);
}
.cc-tool-tabs { display: flex; border-bottom: 2px solid var(--paper-dim); }
.cc-tool-tabs button {
  flex: 1;
  padding: .8rem .5rem;
  font-weight: 700;
  font-size: .92rem;
  color: var(--muted);
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  transition: color .15s;
}
.cc-tool-tabs button.active {
  color: var(--seal);
  border-bottom-color: var(--seal);
}
.cc-tool-tabs button:hover { color: var(--ink-800); }
.cc-input-mono {
  font-family: var(--mono);
  font-size: 1rem;
  letter-spacing: .01em;
}

/* 查询结果 */
.cc-result-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .58rem 0;
  border-bottom: 1px dashed var(--paper-dim);
  font-size: .89rem;
}
.cc-result-row:last-child { border-bottom: none; }
.cc-result-row .k { color: var(--muted); flex: 0 0 auto; }
.cc-result-row .v { font-family: var(--mono); text-align: right; word-break: break-all; }

/* 首页入场动画：一次编排的错峰浮现 */
.cc-rise { opacity: 0; animation: cc-rise .7s cubic-bezier(.2, .7, .3, 1) forwards; }
.cc-rise-1 { animation-delay: .05s; }
.cc-rise-2 { animation-delay: .16s; }
.cc-rise-3 { animation-delay: .28s; }
.cc-rise-4 { animation-delay: .42s; }
@keyframes cc-rise {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---------- AdminLTE 局部覆盖（侧栏/顶栏品牌化） ---------- */
.cc-auth .main-sidebar {
  background: linear-gradient(180deg, var(--ink-800), var(--ink-900)) !important;
}
.cc-auth .sidebar a.nav-link { color: #B9C2D0; }
.cc-auth .sidebar a.nav-link.active {
  background: var(--seal) !important;
  color: #fff !important;
  font-weight: 600;
}
.cc-auth .sidebar a.nav-link:hover { color: #F4F1EA; background: rgba(255, 255, 255, .06); }
.cc-auth .sidebar .nav-header { color: #6B7A93; }
.cc-auth .sidebar-divider { border-top-color: rgba(255, 255, 255, .08); }
body.cc-auth .main-sidebar .brand-link { border-bottom: 1px solid rgba(255, 255, 255, .08); overflow: visible !important; }
.cc-auth .content-wrapper { background: var(--paper); }

/* 管理员角标 */
.cc-admin-chip {
  background: var(--seal);
  color: #fff;
  font-size: .64rem;
  padding: .08rem .38rem;
  border-radius: .3rem;
  font-weight: 700;
  letter-spacing: .06em;
}

/* ---------- 提醒模式卡片（6 模式 V1.1） ---------- */
.cc-mode-card {
  cursor: pointer;
  border: 1.5px solid var(--paper-dim, #E7E2D8);
  border-radius: .7rem;
  padding: .85rem;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
.cc-mode-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(43, 41, 36, .09);
}
.cc-mode-card.sel {
  border-color: var(--seal);
  background: var(--seal-tint, #FBF1EF);
  box-shadow: 0 4px 12px rgba(196, 78, 70, .12);
}
.cc-mode-card.compact { padding: .55rem .7rem; }
/* 运维管家（付费卡）：满额置灰 */
.cc-mode-card.cc-mode-soldout {
  opacity: .55;
  cursor: not-allowed;
  filter: grayscale(.4);
}
.cc-mode-card.cc-mode-soldout:hover { transform: none; box-shadow: none; }
.cc-chip-sel {
  font-size: .64rem;
  background: var(--seal);
  color: #fff;
  padding: .1rem .48rem;
  border-radius: 999px;
  white-space: nowrap;
  font-weight: 700;
}

/* ---------- 宠物养成模式：像素小兽 ---------- */
.cc-pet {
  width: 26px;
  height: 26px;
  vertical-align: middle;
  display: inline-block;
  shape-rendering: crispEdges;
}
.cc-pet.energized { animation: cc-pet-bob 1.7s ease-in-out infinite; }
.cc-pet.yawn { animation: cc-pet-bob 3.2s ease-in-out infinite; }
.cc-pet.wilt { transform: rotate(4deg); opacity: .9; }
.cc-pet.faint { transform: rotate(90deg); opacity: .85; }
.cc-pet.sleep { opacity: .65; filter: grayscale(.35); }
@keyframes cc-pet-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
.cc-pet-wrap { display: inline-flex; align-items: center; gap: .3rem; }
.cc-pet-lv { font-size: .64rem; color: var(--muted); font-family: var(--mono); }

/* ---------- 响应式微调 ---------- */
@media (max-width: 768px) {
  .cc-hero h1 { font-size: 1.9rem !important; }
  .cc-table { font-size: .84rem; }
}
