@charset "utf-8";
/* ==========================================================================
   创业宝盒 · 全站主题（火热暖调）
   设计语言：暖中性底 + 单一强调色「朱红 / 火橘」，不引入第二套色系
   作用域：body —— 同时服务 CMS 前台所有页面与会员中心等模块
   加载顺序：common.css / frontend.css 之后，pc-home.css 之前
   ========================================================================== */

/* ---------- 1. 设计令牌 ---------- */
body {
    /* 画布与承载面：暖白，带极轻的米调，避免冷灰把红色衬脏 */
    --cyb-canvas: #fbf8f5;
    --cyb-bg: #ffffff;
    --cyb-bg-soft: #fbf8f6;
    --cyb-bg-mute: #f3ede9;
    --cyb-surface: #ffffff;
    --cyb-surface-2: #fdfbfa;

    /* 描边：暖灰，比冷灰更贴合暖色主调 */
    --cyb-line: #efe7e2;
    --cyb-line-2: #e3d7d0;

    /* 文字层级：暖炭黑，同一色温由深到浅 */
    --cyb-ink: #1e1512;
    --cyb-text: #2b201c;
    --cyb-text-2: #57473f;
    --cyb-muted: #7c6b62;
    --cyb-muted-2: #a5948b;

    /* 深底（页脚等） */
    --cyb-dark: #1f1411;
    --cyb-dark-2: #2a1c17;

    /* 唯一强调色：朱红偏橘 —— 火热、向上，与玫红系明确区分 */
    --cyb-brand: #e0391b;
    --cyb-brand-hover: #c12b10;
    --cyb-brand-deep: #a8230b;
    --cyb-brand-warm: #f4703e;
    --cyb-brand-bg: #fff4f0;
    --cyb-brand-line: #f9d5c7;
    --cyb-glow: rgba(224, 57, 27, .18);

    /* 火焰渐变：只用于按钮、徽标等小面积高光处 */
    --cyb-fire: linear-gradient(135deg, #f4703e 0%, #e0391b 55%, #c12b10 100%);

    /* 投影：偏暖的中性投影 */
    --cyb-shadow-xs: 0 1px 2px rgba(74, 38, 20, .05);
    --cyb-shadow-sm: 0 1px 2px rgba(74, 38, 20, .04), 0 2px 8px rgba(74, 38, 20, .05);
    --cyb-shadow: 0 4px 16px rgba(74, 38, 20, .08);
    --cyb-shadow-lg: 0 12px 32px rgba(74, 38, 20, .12);
    --cyb-shadow-fire: 0 6px 18px rgba(224, 57, 27, .26);

    /* 圆角：四档递减，整体比上一版再收 1~2px。
       大面（面板 760~1140px 宽、卡片）比小控件减得更多——同样的圆角落在大面积上
       观感会更圆，所以面板 8 → 6、卡片 6 → 5，小控件同步减一档。 */
    --cyb-r-xs: 2px;
    --cyb-r-sm: 4px;
    --cyb-r: 4px;
    --cyb-r-lg: 5px;
    --cyb-r-xl: 6px;
    /* 词条 / 角标 / 搜索框等小控件的形状圆角。
       原来是 999px 的完整药丸，29px 高的控件上圆角半径等于 14px，
       比它包着的字还抢眼；收到 4px 后与其它小控件同一档，整站更利落。 */
    --cyb-r-pill: 4px;

    --cyb-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
        "PingFang SC", "HarmonyOS Sans SC", "Hiragino Sans GB", "Microsoft YaHei",
        "Noto Sans SC", Arial, sans-serif;
    --cyb-font-num: "DIN Alternate", "Bahnschrift", "Helvetica Neue", Arial, var(--cyb-font);

    --cyb-ease: cubic-bezier(.2, .6, .3, 1);
    --cyb-ease-out: cubic-bezier(.16, 1, .3, 1);
}

/* ---------- 2. 全站基底 ---------- */
body {
    font-family: var(--cyb-font);
    color: var(--cyb-text-2);
    background-color: var(--cyb-canvas);
    /* 顶部一层极淡的火光，给整站定调；不做彩色渐变，白卡片依旧干净 */
    background-image: radial-gradient(1100px 460px at 50% -170px, rgba(224, 57, 27, .075), rgba(224, 57, 27, 0) 72%);
    background-repeat: no-repeat;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body ::selection {
    background: rgba(224, 57, 27, .16);
    color: var(--cyb-ink);
}

/* 键盘可达性：仅键盘聚焦时出现焦点环 */
body a:focus-visible,
body button:focus-visible,
body input:focus-visible,
body select:focus-visible,
body textarea:focus-visible,
body .btn:focus-visible {
    outline: 2px solid var(--cyb-brand);
    outline-offset: 2px;
    border-radius: var(--cyb-r-xs);
}

/* 滚动条：暖灰细条，与整体色调一致（Webkit） */
body ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

body ::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 3px;
    background-clip: content-box;
    background-color: #d9cbc3;
}

body ::-webkit-scrollbar-thumb:hover {
    background-color: #c4b2a8;
}

body ::-webkit-scrollbar-track {
    background: transparent;
}

/* ---------- 3. 通用强调色（按类名覆盖，CMS 与会员中心共用） ---------- */
body .btn-primary {
    border-color: var(--cyb-brand);
    background-color: var(--cyb-brand);
    color: #fff;
}

body .btn-primary:hover,
body .btn-primary:focus,
body .btn-primary:active,
body .btn-primary.active,
body .open > .dropdown-toggle.btn-primary {
    border-color: var(--cyb-brand-hover);
    background-color: var(--cyb-brand-hover);
    color: #fff;
}

body .btn-outline-primary {
    border-color: var(--cyb-brand);
    background-color: transparent;
    color: var(--cyb-brand);
}

body .btn-outline-primary:hover,
body .btn-outline-primary:focus {
    border-color: var(--cyb-brand);
    background-color: var(--cyb-brand);
    color: #fff;
}

body .btn-light {
    color: var(--cyb-brand);
}

body .btn-light:hover,
body .btn-light:focus {
    border-color: var(--cyb-brand);
    background-color: var(--cyb-brand);
    color: #fff;
}

body .label-primary {
    border-color: var(--cyb-brand);
    background-color: var(--cyb-brand);
}

/* 「立即购买」等主行动按钮统一到品牌红，避免出现第二种红 */
body .btn-danger {
    border-color: var(--cyb-brand);
    background-color: var(--cyb-brand);
    color: #fff;
}

body .btn-danger:hover,
body .btn-danger:focus,
body .btn-danger:active,
body .btn-danger.active,
body .open > .dropdown-toggle.btn-danger {
    border-color: var(--cyb-brand-hover);
    background-color: var(--cyb-brand-hover);
    color: #fff;
}

body .text-primary,
body .text-primary:hover,
body .text-info,
body .text-info:hover,
body a.primary-link,
body a.primary-link:hover {
    color: var(--cyb-brand) !important;
}

body .badge {
    background-color: var(--cyb-brand);
}

body .pagination > .active > a,
body .pagination > .active > span,
body .pagination > .active > a:hover,
body .pagination > .active > span:hover {
    border-color: var(--cyb-brand);
    background-color: var(--cyb-brand);
    color: #fff;
}

body .form-control:focus {
    border-color: var(--cyb-brand);
    box-shadow: 0 0 0 3px var(--cyb-brand-bg);
}

/* 会员中心等页面：顶部白色导航条的悬停与选中改为强调色 */
.navbar-white .navbar-nav > li > a:hover,
.navbar-white .navbar-nav > li > a:focus,
.navbar-white .navbar-nav > .active > a,
.navbar-white .navbar-nav > .active > a:hover,
.navbar-white .navbar-nav > .active > a:focus {
    color: var(--cyb-brand);
}

.navbar-white .navbar-brand:hover,
.navbar-white .navbar-brand:focus {
    color: var(--cyb-brand);
}

/* 会员中心等页面的页脚：换成与 CMS 一致的暖深底，全站收尾统一 */
body .footer {
    background: var(--cyb-dark);
    color: var(--cyb-muted-2);
}

body .footer .copyright {
    background: var(--cyb-dark-2);
    color: var(--cyb-muted-2);
}

body .footer .copyright a {
    color: var(--cyb-muted-2);
}

body .footer .copyright a:hover,
body .footer .copyright a:focus {
    color: #fff;
}

/* ---------- 4. CMS 前台元素收敛 ----------
   common.css 里散落着 32 处第二套色（亮蓝 #007bff）与一批冷灰，
   不逐条压掉，非首页的栏目页 / 详情页仍会是蓝调。 */

body.skin-white a {
    color: var(--cyb-text-2);
}

body.skin-white a:hover,
body.skin-white a:focus {
    color: var(--cyb-brand);
}

/* 上面这条收敛链接色的规则特异性与 `body .btn-primary` 相同、位置又更靠后，
   会把按钮里的 <a> 一并染成深棕 —— 红底压深棕字根本读不清。
   这里用更高特异性把有色按钮的文字提回白色。 */
body a.btn-primary,
body a.btn-danger,
body a.btn-success,
body a.btn-info,
body a.btn-warning,
body.skin-white a.btn-primary,
body.skin-white a.btn-danger,
body.skin-white a.btn-success,
body.skin-white a.btn-info,
body.skin-white a.btn-warning {
    color: #fff;
}

body a.btn-primary:hover,
body a.btn-primary:focus,
body a.btn-danger:hover,
body a.btn-danger:focus,
body a.btn-success:hover,
body a.btn-success:focus,
body a.btn-info:hover,
body a.btn-info:focus,
body a.btn-warning:hover,
body a.btn-warning:focus,
body.skin-white a.btn-primary:hover,
body.skin-white a.btn-primary:focus,
body.skin-white a.btn-danger:hover,
body.skin-white a.btn-danger:focus,
body.skin-white a.btn-success:hover,
body.skin-white a.btn-success:focus,
body.skin-white a.btn-info:hover,
body.skin-white a.btn-info:focus,
body.skin-white a.btn-warning:hover,
body.skin-white a.btn-warning:focus {
    color: #fff;
}

/* 描边按钮相反：底色是白的，字必须留在品牌色上 */
body a.btn-outline-primary,
body a.btn-outline-primary:hover,
body a.btn-outline-primary:focus,
body.skin-white a.btn-outline-primary,
body.skin-white a.btn-outline-primary:hover,
body.skin-white a.btn-outline-primary:focus {
    color: var(--cyb-brand);
}

body a.btn-outline-primary:hover,
body a.btn-outline-primary:focus,
body.skin-white a.btn-outline-primary:hover,
body.skin-white a.btn-outline-primary:focus {
    color: #fff;
}

/* 次要按钮：Bootstrap 的 .btn-warning 是 #f39c12 黄橙，与朱红并排会出现第二套暖色。
   收敛成「浅底 + 品牌红字 + 淡红描边」，与主按钮形成主次而不是撞色 */
body .btn-warning {
    border-color: var(--cyb-brand-line);
    background-color: var(--cyb-brand-bg);
    color: var(--cyb-brand);
}

body .btn-warning:hover,
body .btn-warning:focus,
body .btn-warning:active,
body .btn-warning.active,
body .open > .dropdown-toggle.btn-warning {
    border-color: var(--cyb-brand);
    background-color: var(--cyb-brand);
    color: #fff;
}

/* 会员中心 / 登录注册等页面（无 skin-white）：
   基础 frontend.css 沿用 Bootstrap 的默认蓝链接，这里统一换成暖中性 + 品牌红悬停 */
body a {
    color: var(--cyb-text-2);
}

body a:hover,
body a:focus {
    color: var(--cyb-brand);
}

/* 深底区域内的链接必须保持浅色，否则会看不清 */
body .footer a,
body footer a,
body .panel-dark a,
body .banner a {
    color: inherit;
}

body .footer a:hover,
body footer a:hover {
    color: #fff;
}

body.skin-white h1,
body.skin-white h2,
body.skin-white h3,
body.skin-white h4,
body.skin-white h5 {
    color: var(--cyb-ink);
}

/* 标签：基础样式为亮蓝底亮蓝字，换成暖中性，仅悬停透出强调色 */
body.skin-white .tag,
body.skin-white a.tag,
body.skin-white .tags .tag {
    border: 1px solid var(--cyb-line);
    border-radius: var(--cyb-r-xs);
    background: var(--cyb-surface-2);
    color: var(--cyb-muted);
    font-weight: 400;
    transition: border-color .2s var(--cyb-ease), background-color .2s var(--cyb-ease),
        color .2s var(--cyb-ease);
}

body.skin-white .tag[href]:hover,
body.skin-white .tag[href]:focus,
body.skin-white a.tag:hover {
    border-color: var(--cyb-brand-line);
    background: var(--cyb-brand-bg);
    color: var(--cyb-brand);
    text-decoration: none;
}

/* 顶部导航 */
body.skin-white .navbar-white .navbar-nav > li > a:hover,
body.skin-white .navbar-white .navbar-nav > li > a:focus,
body.skin-white .navbar-white .navbar-nav > .active > a,
body.skin-white .navbar-white .navbar-nav > .active > a:hover,
body.skin-white .navbar-white .navbar-nav > .active > a:focus {
    color: var(--cyb-brand);
}

body.skin-white .navbar-nav ul.dropdown-menu > li.active > a,
body.skin-white .navbar-nav ul.dropdown-menu > li > a:hover,
body.skin-white .navbar-nav ul.dropdown-menu > li > a:focus {
    background: var(--cyb-brand-bg);
    color: var(--cyb-brand);
}

body.skin-white .navbar .form-search input[type=search]:focus {
    border-color: var(--cyb-brand);
    box-shadow: 0 0 0 3px var(--cyb-brand-bg);
}

body.skin-white .navbar-white {
    border-color: var(--cyb-line);
}

/* 页脚 */
body.skin-white footer {
    background: var(--cyb-dark);
    color: var(--cyb-muted-2);
}

body.skin-white footer a:hover,
body.skin-white footer a:focus {
    color: #fff;
}

/* 浮动按钮 */
body.skin-white #floatbtn > a:hover,
body.skin-white #floatbtn .floatbtn-item:hover,
body.skin-white #floatbtn > a.hover:hover,
body.skin-white #floatbtn .floatbtn-item.hover:hover {
    border-color: var(--cyb-brand);
    background: var(--cyb-brand);
}

/* 正文与列表中的链接 */
body.skin-white .article-list .article-title a:hover,
body.skin-white .article-list .gallery-article .article-title span.highlight,
body.skin-white .article-metas .metas-title a:hover {
    color: var(--cyb-brand);
}

body.skin-white .article-text a {
    color: var(--cyb-brand);
    border-bottom-color: var(--cyb-brand-line);
}

body.skin-white .article-text a:hover {
    border-bottom-color: var(--cyb-brand);
}

/* 筛选 / 排序 / 多选页签 */
body.skin-white .tabs-wrapper .tabs-group .content > li:hover > a,
body.skin-white .tabs-wrapper .tabs-group .content > li.active > a,
body.skin-white .tabs-multiple .tabs-group .content > li.active > a {
    border-color: var(--cyb-brand-line);
    background: var(--cyb-brand-bg);
    color: var(--cyb-brand);
}

body.skin-white .category-order li > a.active,
body.skin-white .related-page ul li.active a {
    color: var(--cyb-brand);
}

/* 频道页标题前的装饰竖条 */
body.skin-white .channel-list .row .col-xs-12 h3 > a:before {
    background: var(--cyb-brand);
}

/* 评论区 */
body.skin-white #comment-container #commentlist dl dd cite a,
body.skin-white #comment-container #commentlist dl dd p em {
    color: var(--cyb-brand);
}

/* 评论 / 回复按钮 */
body.skin-white #comment-container .btn-primary {
    border-color: var(--cyb-brand);
    background: var(--cyb-brand);
}

/* 面板头部的小图标与右侧「更多」 */
body.skin-white .panel-default > .panel-heading .panel-title > i,
body.skin-white .panel-default > .panel-heading .panel-bar,
body.skin-white .panel-default > .panel-heading .more:hover {
    color: var(--cyb-brand);
}

/* 表单控件统一暖灰描边 */
body.skin-white .form-control {
    border-color: var(--cyb-line-2);
    border-radius: var(--cyb-r-sm);
    color: var(--cyb-text);
    box-shadow: none;
}

/* 空状态 / 弱化文字 */
body.skin-white .text-muted {
    color: var(--cyb-muted-2) !important;
}

body.skin-white .btn-default {
    border-color: var(--cyb-line-2);
    background: var(--cyb-surface);
    color: var(--cyb-text-2);
}

body.skin-white .btn-default:hover,
body.skin-white .btn-default:focus {
    border-color: var(--cyb-brand);
    background: var(--cyb-brand-bg);
    color: var(--cyb-brand);
}