/* 小头盔 common.css 域拆分（2026-10-21 整理批二）：原 2684 行单文件按域拆 8 文件，
   _header.blade 按原物理顺序全量引入——层叠语义 100% 等价（行区间连续切分），
   改某域样式不再碰其他域文件。本文件域：框架与表单域：Bootstrap 覆盖/单列表单骨架/清空钮）*/

/* ↓ 文件级公共头（iconfont 字体与基础工具，原 common.css 头部——随框架域走） */
/* ============================================
   小头盔 xiaotoukui - 公共组件 · 清爽海洋风
   桅杆式导航（单一玻璃面 + 滚动收缩）/ Footer
   ============================================ */

@font-face {
    font-family:'iconfont';
    src:url('../fonts/iconfont.woff2?t=1631608872177') format('woff2'),
    url('../fonts/iconfont.woff?t=1631608872177') format('woff'),
    url('../fonts/iconfont.ttf?t=1631608872177') format('truetype');
}
.ali-icon {
    font-family:"iconfont" !important;
    font-style:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

/* 旧 .fl/.fr/.page-wrapper 工具类已删除（views 零引用） */

/* ===== Bootstrap 覆盖 ===== */

/* 按钮 */
.btn {
    border-radius:var(--hc-radius-sm);
    font-weight:500;
    padding:8px 16px;
    transition:var(--hc-transition);
    border:1px solid transparent;
}

.btn-primary {
    background:var(--hc-grad);
    border-color:transparent;
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.18), var(--hc-shadow-primary);
}

.btn-primary:hover {
    background:var(--hc-grad-hover);
    border-color:transparent;
    transform:translateY(-1px);
    box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 8px 20px -4px rgba(124, 58, 237, 0.45);
}

.btn-primary:active { transform:translateY(0); }

/* btn-outline-secondary / btn-success / btn-warning / .card 覆盖已删除：views 零引用（2026-09-02 全局审查验证） */

/* 表单 */
.form-control {
    border-radius:var(--hc-radius-sm);
    border-color:var(--hc-border);
    padding:10px 14px;
    transition:var(--hc-transition);
}

.form-control:focus {
    border-color:var(--hc-primary-light);
    box-shadow:0 0 0 3px rgba(124, 58, 237, 0.12);
}

/* 旧 .badge 覆盖已删（views 只用 hc-*-badge 自定义徽章，bootstrap .badge 零引用） */

/* 消息红点基础形（动作钮/旧位复用） */
.hc-msg-badge {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:16px;
    height:16px;
    padding:0 4px;
    background:var(--hc-accent);
    color:var(--hc-on-brand);
    border-radius:9px;
    font-size:10px;
    font-weight:600;
    line-height:1;
    margin-left:4px;
}

/* ===== 单列表单页骨架（工单/评价/订单查询/登录等 hc-form-*） ===== */
/* 2026-09-20 全站主体宽度统一 1140（与首页 container 同宽；原 720/760 窄容器）。
   挂件 iframe 内不受影响：.hc-widget-body .hc-form-wrap 覆写 max-width:none。
   width:100% 必须带：body 已是纵向 flex（页脚贴底），flex 子项 margin:auto+width:auto
   会 shrink-to-fit 按内容收缩（.container 免疫正因其自带 width:100%）。 */
.hc-form-wrap { width:100%; max-width:1140px; margin:40px auto; padding:0 16px; }
.hc-form-wrap--narrow { max-width:440px; }
.hc-form-card { background:var(--hc-surface); border-radius:16px; box-shadow:0 8px 30px rgba(124,58,237,.08); border:1px solid var(--hc-primary-100); overflow:hidden; }
.hc-form-head { background:linear-gradient(135deg,var(--hc-primary) 0%,var(--hc-primary-dark) 100%); color:var(--hc-on-brand); padding:28px 28px 24px; }
.hc-form-head h1 { font-size:22px; font-weight:700; margin:0; display:flex; align-items:center; gap:10px; }
.hc-form-head p { margin:8px 0 0; font-size:13px; opacity:.88; line-height:1.6; }

/* 用户中心统一页头（2026-09-22 四页标题统一）：渐变图标方块 + 标题 + 描述。
   四落点 myOrders/profile_box/myCoupons/account，partial _page_head.blade.php */
.hc-page-head { display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.hc-page-head-icon {
    width:44px; height:44px; border-radius:13px; flex-shrink:0;
    background:linear-gradient(135deg,var(--hc-primary),var(--hc-pink));
    color:var(--hc-on-brand); display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 20px -6px rgba(124,58,237,.45);
}
.hc-page-head h1 { font-size:20px; font-weight:700; color:var(--hc-text); margin:0; }
.hc-page-head p { font-size:12.5px; color:var(--hc-text-muted); margin:3px 0 0; line-height:1.6; }
.hc-page-head p.hc-page-head-rich { display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; }
.hc-page-head p.hc-page-head-rich .hc-acct-id { display:inline-flex; align-items:center; gap:5px; }
.hc-page-head p.hc-page-head-rich svg { opacity:.55; }
.hc-form-body { padding:24px 28px 28px; }
.hc-form-field { margin-bottom:16px; }
.hc-form-label { display:block; font-size:12px; font-weight:600; color:var(--hc-text-secondary); margin-bottom:7px; }
.hc-form-label em { font-style:normal; color:var(--hc-text-muted); font-weight:400; margin-left:4px; }
.hc-form-input, .hc-form-textarea { width:100%; border:1px solid var(--hc-border); border-radius:10px; padding:12px 14px; font-size:14px; color:var(--hc-text); background:var(--hc-bg); transition:border-color .15s, box-shadow .15s, background .15s; box-sizing:border-box; }
.hc-form-input { height:46px; }
.hc-form-textarea { min-height:132px; resize:vertical; line-height:1.6; font-family:inherit; }
.hc-form-input:focus, .hc-form-textarea:focus { outline:none; border-color:var(--hc-primary); box-shadow:0 0 0 3px rgba(124,58,237,.12); background:var(--hc-surface); }
.hc-form-captcha { display:flex; gap:10px; }
.hc-form-captcha input { flex:1; }
.hc-form-captcha img { border-radius:9px; cursor:pointer; height:46px; }
.hc-form-btn { display:inline-flex; align-items:center; gap:8px; height:46px; padding:0 28px; border:none; border-radius:10px; background:linear-gradient(135deg,var(--hc-primary) 0%,var(--hc-primary-dark) 100%); color:var(--hc-on-brand); font-size:14px; font-weight:600; cursor:pointer; transition:transform .15s, box-shadow .15s; }
.hc-form-btn:hover { transform:translateY(-1px); box-shadow:0 6px 18px rgba(124,58,237,.3); }
.hc-form-tip { font-size:12px; color:var(--hc-text-muted); line-height:1.6; margin:14px 0 0; }

/* ===== 输入框清空钮（2026-10-02 三端清空交互：web 侧，hc-clearable.js 注入）===== */
.hc-clear-host {
    position:relative;
    display:flex;
    align-items:center;
    flex:1 1 auto;
    min-width:0;
}
.hc-clear-host .hc-clearable {
    /* 常驻预留 × 位：长文本不钻 × 底下、× 显隐零布局跳动 */
    padding-right:32px;
}
.hc-clear-x {
    position:absolute;
    right:8px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:20px;
    height:20px;
    padding:0;
    border:none;
    border-radius:50%;
    background:rgba(127,127,127,.22);
    color:var(--hc-text-muted);
    cursor:pointer;
    transition:background .15s, color .15s;
}
.hc-clear-x:hover {
    background:rgba(127,127,127,.4);
    color:var(--hc-text);
}
.hc-clear-x svg { width:10px; height:10px; display:block; }
.hc-clear-x[hidden] { display:none; }

/* 支付通道徽章（2026-10-02 对齐 banner/App 口径）：品牌图标 + 名称胶囊，
   跟随后台启用通道动态渲染（hc_payway_badges，与首页 banner 同缓存源） */
.hc-foot-pays {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
}

/* 图标精灵仓库：只借 symbol、容器零占位（与 buy.css 同法，自备不依赖他页样式） */
.hc-foot-pays .hc-pay-sprite {
    position:absolute;
    width:0;
    height:0;
    overflow:hidden;
}

.hc-foot-pay {
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-size:11.5px;
    font-weight:600;
    letter-spacing:0.3px;
    color:rgba(233, 213, 255, 0.92);
    padding:5px 12px 5px 6px;
    border-radius:999px;
    border:1px solid rgba(233, 213, 255, 0.22);
    background:rgba(255, 255, 255, 0.06);
    backdrop-filter:blur(6px);
    transition:transform 0.18s, border-color 0.18s, background 0.18s;
}

.hc-foot-pay svg {
    width:22px;
    height:22px;
    border-radius:6px;
    flex-shrink:0;
}

.hc-foot-pay-name {
    white-space:nowrap;
}

.hc-foot-pay:hover {
    transform:translateY(-2px);
    border-color:rgba(233, 213, 255, 0.42);
    background:rgba(255, 255, 255, 0.1);
}

/* 窄屏只留图标（与 banner 徽章小屏降级同策略） */
@media (max-width: 767.98px) {
    .hc-foot-pay-name { display:none; }
    .hc-foot-pay { padding:5px; }
}

.hc-foot-custom {
    margin-top:20px;
    font-size:12.5px;
    color:rgba(196, 181, 253, 0.8);
    line-height:1.75;
}
.hc-foot-custom a { color:rgba(216, 204, 247, 0.9); transition:color 0.18s; }
.hc-foot-custom a:hover { color:var(--hc-on-brand); }

/* 链接列（2026-10-21 v2 重设计，用户拍板「太难看」）：胶囊 chip 云——
   与品牌列支付胶囊/面包屑/规格 chip 同族的玻璃胶囊，替换旧竖排链接表
   （2.2px 大字距 CJK 小标题 + 悬停圆点横移=模板感重源）。标题收紧字距；
   chip 悬停上浮+亮框填充；渐变强调条小标题保留 */
.hc-foot-col h4 {
    display:flex;
    align-items:center;
    gap:8px;
    font-size:12px;
    font-weight:700;
    letter-spacing:1px;
    text-transform:uppercase;
    color:rgba(233, 213, 255, 0.72);
    margin:6px 0 14px;
}

.hc-foot-col h4::before {
    content:"";
    width:3px;
    height:13px;
    border-radius:2px;
    background:linear-gradient(180deg, var(--hc-primary-400), var(--hc-pink));
    box-shadow:0 0 10px rgba(167, 139, 250, 0.5);
}

.hc-foot-col ul {
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.hc-foot-col a {
    display:inline-flex;
    align-items:center;
    padding:6px 14px;
    font-size:13px;
    line-height:1.4;
    color:rgba(233, 213, 255, 0.85);
    text-decoration:none;
    border-radius:999px;
    border:1px solid rgba(233, 213, 255, 0.2);
    background:rgba(255, 255, 255, 0.05);
    -webkit-backdrop-filter:blur(6px);
    backdrop-filter:blur(6px);
    transition:color 0.18s, transform 0.18s, border-color 0.18s, background 0.18s;
}

.hc-foot-col a:hover {
    color:var(--hc-on-brand);
    background:rgba(255, 255, 255, 0.12);
    border-color:rgba(233, 213, 255, 0.42);
    transform:translateY(-2px);
    text-decoration:none;
}

/* 底条：版权 + 回到顶部 */
.hc-foot-bottom {
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:10px 20px;
    padding:18px 0 24px;
    font-size:12px;
    color:rgba(196, 181, 253, 0.62);
}

.hc-foot-bottom::before {
    content:"";
    position:absolute;
    top:0; left:0; right:0;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(196, 181, 253, 0.22) 18%, rgba(196, 181, 253, 0.22) 82%, transparent);
}

/* 回到顶部原页脚底条按钮已删（2026-09-19 迁右下浮动钮与客服竖排，见 .hc-backtop-fab） */

.hc-foot-powered a { color:rgba(233, 213, 255, 0.75); }
.hc-foot-powered a:hover { color:var(--hc-on-brand); }

@media (max-width:767.98px) {
    .hc-footer { margin-top:auto; padding-top:48px; }
    .hc-footer-grid {
        grid-template-columns:1fr 1fr;
        gap:28px 20px;
        padding:36px 0 28px;
    }
    .hc-foot-brand {
        grid-column:1 / -1;
        margin-bottom:2px;
    }
    .hc-foot-brand-row { margin-bottom:18px; }
    .hc-foot-col h4 { margin-bottom:13px; }
    .hc-foot-bottom { justify-content:space-between; }
}

@media (max-width:575.98px) {
    .hc-footer-grid { gap:24px 16px; padding:30px 0 24px; }
    .hc-foot-brand-row { gap:12px; margin-bottom:15px; }
    .hc-foot-mark { flex-basis:40px; height:40px; border-radius:11px; }
    .hc-foot-logo { font-size:19px; }
    .hc-foot-brand-sub { font-size:11.5px; }
    .hc-foot-pay { padding:5px 11px; font-size:11px; }
    .hc-foot-col a { font-size:12.5px; padding:5px 12px; }
    .hc-foot-bottom { padding:14px 0 20px; }
}