/* ============================================================
   feifeigo.css — 全站主题层 (浅色 · 蓝青渐变, 对标 resip.net)
   覆写 Tabler 的 CSS 变量与组件, 一次性重塑整个后台 + 认证页。
   加载顺序: 在 tabler.min.css 之后, 故可安全覆盖。
   ============================================================ */

:root {
    /* 品牌色 */
    --ff-blue: #2563eb;
    --ff-blue-600: #1d4ed8;
    --ff-cyan: #06b6d4;
    --ff-sky: #38bdf8;
    --ff-grad: linear-gradient(135deg, #2563eb 0%, #0ea5e9 55%, #06b6d4 100%);
    --ff-grad-soft: linear-gradient(135deg, rgba(37,99,235,.10), rgba(6,182,212,.10));
    --ff-ink: #0f172a;
    --ff-muted: #64748b;
    --ff-line: #e6ebf3;
    --ff-bg: #f6f9fc;
    --ff-radius: 16px;
    --ff-shadow: 0 1px 2px rgba(16,24,40,.04), 0 8px 24px rgba(16,24,40,.06);
    --ff-shadow-lg: 0 12px 40px rgba(37,99,235,.14);

    /* --- 覆写 Tabler 主色 --- */
    --tblr-primary: #2563eb;
    --tblr-primary-rgb: 37, 99, 235;
    --tblr-primary-fg: #ffffff;
    --tblr-link-color: #2563eb;
    --tblr-link-hover-color: #1d4ed8;
    --tblr-border-radius: 12px;
    --tblr-border-radius-lg: 16px;
    --tblr-font-sans-serif: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
        "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- 基础排版 ---------- */
body {
    font-family: var(--tblr-font-sans-serif);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* 后台浅色底 + 柔和光晕 (仅浅色模式) */
html[data-bs-theme="light"] body,
body:not([data-bs-theme="dark"]) {
    background-color: var(--ff-bg);
    background-image:
        radial-gradient(1200px 600px at 100% -10%, rgba(6,182,212,.10), transparent 60%),
        radial-gradient(1000px 500px at -10% 0%, rgba(37,99,235,.10), transparent 55%);
    background-attachment: fixed;
}

/* ---------- 顶部导航 / 仪表盘 hero 渐变带 ---------- */
.navbar-overlap::before,
header.navbar[data-bs-theme="dark"] {
    background: var(--ff-grad) !important;
}
.navbar.navbar-overlap {
    background: var(--ff-grad) !important;
    box-shadow: 0 8px 30px rgba(37,99,235,.25);
}
/* 页面顶部标题区文字 */
.page-header .page-title,
.page-header .page-pretitle,
.home-title,
.home-subtitle { color: #fff; }

/* ---------- 卡片 ---------- */
.card {
    border: 1px solid var(--ff-line);
    border-radius: var(--ff-radius);
    box-shadow: var(--ff-shadow);
    transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover { box-shadow: var(--ff-shadow-lg); }
.card .card-header { border-top-left-radius: var(--ff-radius); border-top-right-radius: var(--ff-radius); }

/* ---------- 按钮 ---------- */
.btn {
    border-radius: 10px;
    font-weight: 600;
    letter-spacing: .1px;
}
.btn-primary {
    background: var(--ff-grad);
    border: none;
    box-shadow: 0 6px 16px rgba(37,99,235,.28);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background: linear-gradient(135deg, #1d4ed8 0%, #0284c7 55%, #0891b2 100%);
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(37,99,235,.34);
}
.btn-outline-primary {
    border-color: rgba(37,99,235,.35);
    color: var(--ff-blue);
}
.btn-outline-primary:hover { background: var(--ff-grad-soft); color: var(--ff-blue-600); border-color: var(--ff-blue); }
.btn-success { background: linear-gradient(135deg,#16a34a,#22c55e); border: none; }

/* ---------- 徽章 / 标签 ---------- */
.badge.bg-primary { background: var(--ff-grad) !important; }
.badge { border-radius: 8px; font-weight: 600; }

/* ---------- 表单 ---------- */
.form-control, .form-select {
    border-radius: 10px;
    border-color: var(--ff-line);
    padding: .55rem .8rem;
}
.form-control:focus, .form-select:focus {
    border-color: var(--ff-sky);
    box-shadow: 0 0 0 3px rgba(56,189,248,.25);
}

/* ---------- 表格 ---------- */
.table thead th {
    text-transform: uppercase;
    font-size: .72rem;
    letter-spacing: .04em;
    color: var(--ff-muted);
}
.table > :not(caption) > * > * { padding: .8rem 1rem; }

/* ---------- 侧栏/列表项 hover ---------- */
.list-group-item { border-color: var(--ff-line); }
.nav-link { font-weight: 500; }

/* ---------- 链接 ---------- */
a { text-decoration: none; }

/* ---------- 滚动条 (浅色) ---------- */
html[data-bs-theme="light"] ::-webkit-scrollbar { width: 10px; height: 10px; }
html[data-bs-theme="light"] ::-webkit-scrollbar-thumb {
    background: #c7d2e1; border-radius: 8px; border: 2px solid var(--ff-bg);
}
html[data-bs-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #a9b7cc; }

/* ============================================================
   通用工具类 (供落地页 / 认证页 / 价格卡复用)
   ============================================================ */
.ff-grad-text {
    background: var(--ff-grad);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
}
.ff-grad-bg { background: var(--ff-grad); }
.ff-glass {
    background: rgba(255,255,255,.72);
    backdrop-filter: saturate(160%) blur(14px);
    -webkit-backdrop-filter: saturate(160%) blur(14px);
    border: 1px solid rgba(255,255,255,.6);
}
.ff-chip {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .35rem .8rem; border-radius: 999px;
    background: var(--ff-grad-soft); color: var(--ff-blue-600);
    font-weight: 600; font-size: .82rem;
    border: 1px solid rgba(37,99,235,.16);
}

/* ============================================================
   用户商店 · 现代价格卡 (作用于 /user/product 的 .card)
   ============================================================ */
.ff-price-card {
    position: relative;
    border-radius: 18px;
    display: flex; flex-direction: column;
    overflow: hidden;
    height: 100%;
    padding: 26px 22px;
    background: #fff;
    border: 1px solid rgba(37,99,235,.12);
    box-shadow: var(--ff-shadow);
    transition: transform .18s ease, box-shadow .18s ease;
}
.ff-price-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--ff-shadow-lg);
}
.ff-price-card.ff-featured {
    border: 2px solid transparent;
    background:
        linear-gradient(#fff,#fff) padding-box,
        var(--ff-grad) border-box;
    box-shadow: var(--ff-shadow-lg);
}
.ff-price-card.ff-featured:hover { transform: translateY(-8px); }
.ff-price-name { font-size: 1.05rem; font-weight: 700; color: var(--ff-ink); margin-bottom: 10px; }
.ff-price-line { margin: 4px 0 6px; }
.ff-price-card .btn { margin-top: auto; }
.ff-price-card .ff-price-badge {
    position: absolute; top: 14px; right: -34px;
    transform: rotate(45deg);
    background: var(--ff-grad); color: #fff;
    font-size: .72rem; font-weight: 700; letter-spacing: .5px;
    padding: 4px 40px; box-shadow: 0 4px 10px rgba(37,99,235,.3);
}
.ff-price-amount { font-size: 2.4rem; font-weight: 800; line-height: 1; color: var(--ff-ink); }
.ff-price-cy { font-size: 1.1rem; font-weight: 700; vertical-align: top; margin-right: 2px; color: var(--ff-muted); }
.ff-price-unit { color: var(--ff-muted); font-size: .9rem; }
.ff-feat { list-style: none; padding: 0; margin: 1rem 0; }
.ff-feat li { display: flex; align-items: center; gap: .55rem; padding: .35rem 0; color: #334155; font-size: .93rem; }
.ff-feat li i { color: #16a34a; }

/* ============ AUTH (login / register) split-screen ============ */
.ff-auth-body { min-height: 100vh; margin: 0; }
.ff-auth {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
}
.ff-auth-brand {
    position: relative;
    display: flex; align-items: center; justify-content: center;
    padding: 48px;
    color: #fff;
    background: var(--ff-grad);
    overflow: hidden;
}
.ff-auth-brand::after {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(1000px 500px at 10% 0%, rgba(255,255,255,.18), transparent 60%),
        radial-gradient(700px 500px at 100% 100%, rgba(255,255,255,.12), transparent 55%);
    pointer-events: none;
}
.ff-auth-brand-inner { position: relative; z-index: 1; max-width: 420px; }
.ff-auth-brand-inner img { height: 64px; margin-bottom: 22px; filter: drop-shadow(0 6px 18px rgba(0,0,0,.25)); }
.ff-auth-brand-inner h1 { font-size: 2.1rem; font-weight: 800; margin: 0 0 12px; letter-spacing: .5px; }
.ff-auth-brand-inner .ff-auth-tag { font-size: 1.05rem; opacity: .92; line-height: 1.7; margin-bottom: 28px; }
.ff-auth-points { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.ff-auth-points li { display: flex; align-items: center; gap: 12px; font-size: 1rem; opacity: .96; }
.ff-auth-points li i { font-size: 1.3rem; }
.ff-auth-chip {
    display: inline-flex; align-items: center; gap: 8px;
    margin-top: 30px; padding: 8px 16px;
    background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.25);
    border-radius: 999px; font-size: .9rem; backdrop-filter: blur(6px);
}
.ff-auth-form {
    display: flex; align-items: center; justify-content: center;
    padding: 40px 24px;
    background: linear-gradient(180deg,#f6f9ff 0%, #eef4ff 100%);
}
.ff-auth-form .card {
    width: 100%; max-width: 420px;
    border: 1px solid rgba(37,99,235,.10);
    box-shadow: var(--ff-shadow-lg);
    border-radius: var(--ff-radius);
}
.ff-auth-mini-logo { display: none; }
@media (max-width: 900px) {
    .ff-auth { grid-template-columns: 1fr; }
    .ff-auth-brand { display: none; }
    .ff-auth-mini-logo { display: block; }
}