/* ============================================
   一点点超市 · 前台黄色主题层（覆盖 h5.css）
   琥珀金商店：渐变主色 + 克制扫光
   仅作用于 H5 商城/代理前台，不触及后台
   ============================================ */

:root {
    --primary: #f2a900;        /* 琥珀黄：主按钮 / 选中态 */
    --primary-soft: #ffc928;   /* 主金黄：渐变浅端 */
    --primary-dark: #c98a00;   /* 琥珀深：悬停 / 渐变深端 */
    --primary-ink: #5b3d00;    /* 深金棕：黄底上的文字 / 链接 / 价格 */
    --primary-glow: #fff4b8;   /* 浅黄光：提示 / 选中背景 */
    --on-primary: #2f260f;     /* 墨色：黄色表面上的正文与图标 */
    --text: #333;
    --text-light: #999;
    --bg: #f6f7f8;
    --card: #fff;
    --radius: 10px;
}

/* 主表面渐变与扫光：头部 / 登录 / 客服头 / 代理 Tab
   注意：保留原 h5.css 的定位方式，只补充 overflow 以裁剪扫光，
   不覆盖 position，避免破坏 fixed 吸顶与悬浮定位。 */
.h5-header,
.hp-header,
.cs-panel .csp-head,
.agent-tabs,
.login-page {
    background: linear-gradient(135deg, var(--primary-soft) 0%, var(--primary) 55%, var(--primary-dark) 100%);
    color: var(--on-primary);
    overflow: hidden;
}

/* 头部缓慢扫光：低频，克制 */
.h5-header::after,
.hp-header::after,
.agent-tabs::after,
.login-page::after {
    content: "";
    position: absolute;
    top: 0;
    left: -60%;
    width: 45%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .55), transparent);
    transform: skewX(-18deg);
    pointer-events: none;
    animation: themeSheen 7s ease-in-out infinite;
}

.cs-panel .csp-head::after {
    content: "";
    position: absolute;
    top: 0;
    left: -60%;
    width: 45%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent);
    transform: skewX(-18deg);
    pointer-events: none;
    animation: themeSheen 9s ease-in-out infinite;
}

@keyframes themeSheen {
    0%   { left: -60%; }
    55%  { left: 120%; }
    100% { left: 120%; }
}

/* 黄色表面上的文字、按钮、图标统一改为墨色，保证对比度 */
.h5-header,
.h5-header .hh-title .t2,
.hp-header,
.hp-titles .hp-name-lo,
.cs-panel .csp-head,
.cs-panel .csp-head button,
.agent-tabs .at-tab,
.agent-tabs .at-tab.on,
.login-page {
    color: var(--on-primary);
}

.h5-header .hh-orders {
    background: rgba(47, 38, 15, .14);
    color: var(--on-primary);
}

.agent-tabs .at-tab { opacity: .72; }
.agent-tabs .at-tab.on { opacity: 1; border-bottom-color: var(--on-primary); }

/* 首页特色 / 引导图标 / 门店信息链接：深金棕 */
.hp-feature,
.hp-guide-card .ic,
.hp-info-row a {
    color: var(--primary-ink);
}

/* 店铺分类选中 */
.shop-cats .cat.on { color: var(--primary-ink); }
.shop-cats .cat.on::after { background: var(--primary); }

/* 商品价格 / 数量：深金棕，避免浅黄看不清 */
.goods-card .g-price,
.goods-card .g-num,
.cart-item .ci-price,
.detail-sheet .ds-price,
.stat-card .sc-value,
.order-card .oc-total,
.order-card .oc-status.refunded {
    color: var(--primary-ink);
}

/* 主要操作按钮：渐变 + 墨字 + hover 扫光 */
.btn-main,
.cart-bar .cb-btn,
.cs-panel .csp-input .csp-send,
.range-tabs button.on,
.agent-link-box button {
    background: linear-gradient(135deg, var(--primary-soft), var(--primary) 60%, var(--primary-dark));
    color: var(--on-primary);
    border: none;
    position: relative;
    overflow: hidden;
    transition: filter .2s ease, box-shadow .2s ease;
}

.btn-main::after,
.cart-bar .cb-btn::after,
.cs-panel .csp-input .csp-send::after {
    content: "";
    position: absolute;
    top: 0;
    left: -80%;
    width: 50%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .6), transparent);
    transform: skewX(-18deg);
    pointer-events: none;
}

.btn-main:hover::after,
.cart-bar .cb-btn:hover::after,
.cs-panel .csp-input .csp-send:hover::after {
    animation: themeSheen .9s ease;
}

.btn-main:hover,
.cart-bar .cb-btn:hover,
.cs-panel .csp-input .csp-send:hover {
    filter: brightness(1.03);
    box-shadow: 0 3px 10px rgba(242, 169, 0, .35);
}

.btn-main:active,
.cart-bar .cb-btn:active,
.cs-panel .csp-input .csp-send:active {
    filter: brightness(.97);
}

/* 圆形入口：购物车图标 / 客服浮窗 / 加购按钮
   只改背景与文字色，保留 h5.css 原有定位（.cs-float 为 fixed），
   不加 overflow，避免裁剪掉位于按钮外部的红色角标。 */
.cart-bar .cb-icon,
.cs-float,
.goods-card .g-buy {
    background: linear-gradient(135deg, var(--primary-soft), var(--primary) 60%, var(--primary-dark));
    color: var(--on-primary);
}

/* 底部导航选中：琥珀 */
.bottom-nav .bn-item.on { color: var(--primary); }

/* 时间线已到达节点 */
.timeline .tl-item.on .tl-dot { background: var(--primary); }

/* 表单聚焦：琥珀边框 */
.form-row input:focus,
.form-row textarea:focus { border-color: var(--primary); }

/* 次要按钮：保留中性灰，与主按钮形成层级 */
.btn-main.btn-sub,
.btn-sub {
    background: #6b6b6b;
    color: #fff;
}

/* 金额高亮（动态生成） */
.amount { color: var(--primary-ink); font-weight: 700; }

/* 退款 / 警示金额（动态生成）：保留语义但改深金棕 */
.amount-warn { color: var(--primary-ink); font-weight: 700; }

/* 浅黄提示卡（动态生成，原线下付款红底提示） */
.tip-card {
    background: var(--primary-glow);
    border: 1px solid #f7d98a;
    color: var(--primary-ink);
}

/* 品牌标签（动态生成） */
.tag-brand {
    background: var(--primary);
    color: var(--on-primary);
    padding: 2px 8px;
    border-radius: 4px;
}

/* 访客客服气泡：保留绿色语义，不纳入黄色品牌 */
.cs-msg-row.visitor .cm-bubble { background: #95ec69; }

/* 角标保留橙红警示语义 */
.cart-bar .cb-badge,
.cs-float .cf-badge { background: #ff5722; color: #fff; }

/* 订单状态色保留可区分语义，仅退款色对齐品牌深金棕 */
.order-card .oc-status.pending { color: #f57c00; }
.order-card .oc-status.delivering { color: #1976d2; }
.order-card .oc-status.completed { color: #2e7d32; }
.order-card .oc-status.cancelled { color: #999; }

/* 减少动画：关闭扫光与非必要过渡 */
@media (prefers-reduced-motion: reduce) {
    .h5-header::after,
    .hp-header::after,
    .agent-tabs::after,
    .login-page::after,
    .cs-panel .csp-head::after,
    .btn-main::after,
    .cart-bar .cb-btn::after,
    .cs-panel .csp-input .csp-send::after {
        display: none;
    }
    .btn-main:hover::after,
    .cart-bar .cb-btn:hover::after,
    .cs-panel .csp-input .csp-send:hover::after {
        animation: none;
    }
}