/**
 * Endfield Theme - 终末地工业机能风
 * acg-faka Cartoon 主题适配版
 */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap");

:root {
    --ef-bg-deep: #0a0c0e;
    --ef-bg-panel: rgba(18, 22, 26, 0.82);
    --ef-bg-solid: #15191d;
    --ef-border: rgba(255,255,255,0.08);
    --ef-border-strong: rgba(255,255,255,0.18);
    --ef-text-primary: #e6e8ea;
    --ef-text-secondary: #8a8f95;
    --ef-text-muted: #5a5f65;
    --ef-warn: #f0c92b;
    --ef-warn-dim: #b89a1e;
    --ef-accent-cyan: #4fd1c5;
    --ef-accent-magenta: #d44d8e;
    --ef-font-sans: "Inter",-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
    --ef-font-mono: "JetBrains Mono","Courier New",monospace;
}

/* ===== BODY 深色主题 ===== */
html, body {
    font-family: var(--ef-font-sans) !important;
    color: var(--ef-text-primary) !important;
}
body {
    background: var(--ef-bg-deep) !important;
    background-image:
        linear-gradient(rgba(10,12,14,0.92),rgba(10,12,14,0.92)),
        repeating-linear-gradient(0deg,transparent 0,transparent 39px,rgba(240,201,43,0.025) 39px,rgba(240,201,43,0.025) 40px),
        repeating-linear-gradient(90deg,transparent 0,transparent 39px,rgba(240,201,43,0.025) 39px,rgba(240,201,43,0.025) 40px) !important;
    background-attachment: fixed !important;
    background-size: auto, 40px 40px, 40px 40px !important;
    letter-spacing: 0.01em;
}

/* ===== Canvas 背景层 ===== */
#ecosystem-canvas {
    position: fixed; top: 0; left: 0;
    width: 100vw; height: 100vh;
    z-index: 0; pointer-events: none;
    opacity: 0.6;
}
.glass-overlay {
    position: fixed; top: 0; left: 0;
    width: 100vw; height: 100vh;
    z-index: 1; pointer-events: none;
    background: radial-gradient(ellipse at 50% 40%, transparent 35%, rgba(0,0,0,0.55) 100%);
}
body[data-ef-theme="2"] .glass-overlay {
    background:
        radial-gradient(ellipse at 50% 40%, transparent 35%, rgba(0,0,0,0.55) 100%),
        repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(240,201,43,0.03) 2px,rgba(240,201,43,0.03) 4px);
}
.endfield-cmyk {
    position: fixed; top: 0; left: 0;
    width: 100vw; height: 3px;
    z-index: 9999; pointer-events: none;
    background: linear-gradient(90deg,
        var(--ef-accent-cyan) 0%, var(--ef-accent-cyan) 25%,
        var(--ef-accent-magenta) 25%, var(--ef-accent-magenta) 50%,
        var(--ef-warn) 50%, var(--ef-warn) 75%,
        #1a1a1a 75%, #1a1a1a 100%);
    opacity: 0.85;
}

/* ===== 全局文本 ===== */
a { color: var(--ef-text-primary); transition: color 0.2s; }
a:hover { color: var(--ef-warn); }
.text-muted, .text-secondary { color: var(--ef-text-muted) !important; }
.text-dark, .text-body { color: var(--ef-text-primary) !important; }
.text-success { color: #6ed098 !important; }
.text-danger { color: #e85a5a !important; }

/* ===== 所有内容放在 canvas 之上 ===== */
#pjax-container, .container, .content, main, header, nav, footer,
.bg-content, .fly-header, .layui-container, .navbar, .navbar-acg {
    position: relative; z-index: 10;
}

/* ===== 导航栏 - 深色玻璃 ===== */
.navbar-acg {
    background: rgba(15, 18, 22, 0.92) !important;
    border-bottom: 1px solid var(--ef-border-strong) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 2px 0 0 rgba(240,201,43,0.15) !important;
    z-index: 100 !important;
}
.navbar-acg .navbar-brand { color: var(--ef-text-primary) !important; font-weight: 600; }
.navbar-acg .nav-link {
    color: var(--ef-text-secondary) !important;
    border-left: 2px solid transparent;
    transition: all 0.2s;
    font-weight: 500 !important;
}
.navbar-acg .nav-link:hover { color: var(--ef-text-primary) !important; background: rgba(240,201,43,0.05); border-left-color: var(--ef-warn); }
.navbar-acg .nav-link.active { color: var(--ef-warn) !important; background: rgba(240,201,43,0.08); border-left-color: var(--ef-warn); font-weight: 600 !important; }
.navbar-acg .input-group-text { background: rgba(20,24,28,0.7) !important; border: 1px solid var(--ef-border) !important; color: var(--ef-warn) !important; }
.navbar-acg .form-control {
    background: rgba(20,24,28,0.7) !important; border: 1px solid var(--ef-border) !important;
    color: var(--ef-text-primary) !important;
}
.navbar-acg .form-control:focus {
    border-color: var(--ef-warn) !important;
    box-shadow: 0 0 0 1px var(--ef-warn), 0 0 8px rgba(240,201,43,0.15) !important;
}

/* 用户按钮 */
.navbar-acg .btn-outline-secondary { border: 1px solid var(--ef-border-strong) !important; color: var(--ef-text-secondary) !important; background: rgba(20,24,28,0.6) !important; }
.navbar-acg .btn-outline-secondary:hover { border-color: var(--ef-warn) !important; color: var(--ef-warn) !important; }
.navbar-acg .btn-primary { background: var(--ef-warn) !important; border-color: var(--ef-warn) !important; color: #0a0c0e !important; font-weight: 600; }
.navbar-acg .btn-primary:hover { background: #ffd83a !important; box-shadow: 0 0 16px rgba(240,201,43,0.4); }
.navbar-acg .dropdown-menu { background: var(--ef-bg-solid) !important; border: 1px solid var(--ef-border-strong) !important; }
.navbar-acg .dropdown-item { color: var(--ef-text-secondary) !important; }
.navbar-acg .dropdown-item:hover { color: var(--ef-warn) !important; background: rgba(240,201,43,0.08) !important; }
.navbar-acg .dropdown-divider { border-color: var(--ef-border) !important; }

/* ===== 用户面板 (Common header) ===== */
.bg-content { background: transparent !important; }
.fly-header {
    background: rgba(15, 18, 22, 0.85) !important;
    border-bottom: 1px solid var(--ef-border-strong) !important;
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 0 0 rgba(240,201,43,0.15) !important;
}
.fly-header a { color: var(--ef-text-secondary) !important; }
.fly-header a:hover { color: var(--ef-warn) !important; }
.fly-logo .user-logo-title { color: var(--ef-text-primary) !important; }
.layui-nav .layui-nav-item a { color: var(--ef-text-secondary) !important; }
.layui-nav .layui-nav-item a:hover { color: var(--ef-warn) !important; }
.layui-nav-child { background: var(--ef-bg-solid) !important; border: 1px solid var(--ef-border-strong) !important; }
.layui-nav-child dd a { color: var(--ef-text-secondary) !important; }
.layui-nav-child dd a:hover { background: rgba(240,201,43,0.08) !important; color: var(--ef-warn) !important; }
.net-loading .loading-view { background: rgba(10,12,14,0.85) !important; }

/* ===== 面板 (Panel) - 直角 outline 风格 (公告/购买/详情/订单查询) ===== */
.panel {
    background: rgba(10, 12, 14, 0.94) !important;
    border: 1px solid rgba(240, 201, 43, 0.35) !important;
    border-left: 3px solid var(--ef-warn) !important;
    border-radius: 0 !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45), 1px 0 0 rgba(240, 201, 43, 0.08) !important;
    margin-bottom: 20px;
    overflow: hidden;
}

.panel-header {
    background: rgba(240, 201, 43, 0.08) !important;
    border-bottom: 1px solid rgba(240, 201, 43, 0.2) !important;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.panel-header .icon {
    color: var(--ef-warn) !important;
    font-size: 15px;
    opacity: 1 !important;
}

.panel-title {
    font-family: var(--ef-font-mono) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--ef-warn) !important;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin: 0 !important;
}

.panel-body {
    padding: 20px;
    color: #e8e5dc !important;
    font-size: 14px;
    line-height: 1.7;
}

.panel-body a { color: var(--ef-warn); }

/* ===== 商品卡片 (acg-card) - 直角 outline ===== */
.acg-card {
    background: rgba(14, 17, 21, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 0 !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.35);
    transition: all 0.25s ease;
    overflow: hidden;
    cursor: pointer;
}

.acg-card:hover {
    border-color: var(--ef-warn) !important;
    box-shadow: 0 6px 22px rgba(240, 201, 43, 0.18), 0 0 0 1px var(--ef-warn);
    transform: translateY(-2px);
}

.acg-card .acg-thumb {
    border-radius: 0 !important;
    opacity: 0.85 !important;
    transition: opacity 0.25s ease;
}

.acg-card:hover .acg-thumb {
    opacity: 1 !important;
}

.acg-card > .p-3 { color: #e8e5dc; }
.acg-card > .p-3 .stat-row { color: var(--ef-text-secondary); }

.acg-card.soldout {
    opacity: 0.5 !important;
    border-color: rgba(255, 255, 255, 0.04) !important;
}

/* ===== 通用卡片 / Block / 表格卡片 ===== */
.card, .block, .layui-card {
    background: rgba(14, 17, 21, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.35);
    border-radius: 0 !important;
}

.card-header, .card-footer, .layui-card-header {
    background: rgba(240, 201, 43, 0.06) !important;
    border-color: rgba(240, 201, 43, 0.15) !important;
}

.card-title, .card-header h3 {
    color: var(--ef-warn) !important;
    font-family: var(--ef-font-mono) !important;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* ===== 分类 Chip - 直角 outline ===== */
.chip {
    background: rgba(20, 24, 28, 0.7) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: var(--ef-text-secondary) !important;
    border-radius: 0 !important;
    font-family: var(--ef-font-mono);
    font-size: 11px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 6px 14px;
    transition: all 0.2s ease;
}

.chip:hover {
    border-color: var(--ef-warn) !important;
    color: var(--ef-warn) !important;
    background: rgba(240, 201, 43, 0.06) !important;
}

.chip.is-primary {
    background: rgba(240, 201, 43, 0.12) !important;
    border-color: var(--ef-warn) !important;
    color: var(--ef-warn) !important;
    font-weight: 600;
}

/* ===== 徽章 Badge - 直角 ===== */
.badge-soft {
    border-radius: 0 !important;
    font-family: var(--ef-font-mono);
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 10px;
    font-weight: 600;
}

.badge-soft-primary {
    background: rgba(240, 201, 43, 0.12) !important;
    border: 1px solid rgba(240, 201, 43, 0.35) !important;
    color: var(--ef-warn) !important;
}

.badge-soft-success {
    background: rgba(110, 208, 152, 0.1) !important;
    border: 1px solid rgba(110, 208, 152, 0.35) !important;
    color: #6ed098 !important;
}

.badge-soft-danger {
    background: rgba(232, 90, 90, 0.1) !important;
    border: 1px solid rgba(232, 90, 90, 0.35) !important;
    color: #e85a5a !important;
}

.badge-soft-warning {
    background: rgba(240, 201, 43, 0.12) !important;
    border: 1px solid rgba(240, 201, 43, 0.35) !important;
    color: var(--ef-warn) !important;
}

.badge-soft-info {
    background: rgba(79, 209, 197, 0.1) !important;
    border: 1px solid rgba(79, 209, 197, 0.35) !important;
    color: var(--ef-accent-cyan) !important;
}

.badge-soft-muted {
    background: rgba(100, 105, 110, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: var(--ef-text-muted) !important;
}

/* ===== SKU 选择标签 - 直角 outline ===== */
.sku {
    background: rgba(20, 24, 28, 0.7) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: var(--ef-text-secondary) !important;
    border-radius: 0 !important;
    font-family: var(--ef-font-mono);
    font-size: 11px;
    letter-spacing: 0.05em;
    padding: 7px 14px;
    transition: all 0.2s ease;
}

.sku:hover {
    border-color: var(--ef-warn) !important;
    color: var(--ef-warn) !important;
}

.sku.is-primary {
    background: rgba(240, 201, 43, 0.12) !important;
    border-color: var(--ef-warn) !important;
    color: var(--ef-warn) !important;
    font-weight: 600;
}

.sku .badge-money {
    color: var(--ef-warn-dim);
    margin-left: 6px;
    font-family: var(--ef-font-mono);
}

/* ===== 商品封面容器 ===== */
.acg-cover {
    border-radius: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(14, 17, 21, 0.6) !important;
    overflow: hidden;
}

.acg-cover img.item-cover {
    border-radius: 0 !important;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ===== 全局直角覆盖 ===== */
.br-12, .br-8, .br-6, .br-4,
[class*="br-"], .rounded, .rounded-1, .rounded-2, .rounded-3, .rounded-4,
.rounded-pill, .rounded-circle:not(.ef-nav-btn) {
    border-radius: 0 !important;
}

/* ===== 导航图标 ===== */
.nav-icon {
    color: var(--ef-text-secondary);
    font-size: 14px;
}

/* ===== 商品列表 ===== */
.item-list { color: #e8e5dc; }
.item-message {
    color: var(--ef-text-secondary);
    font-family: var(--ef-font-mono);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* ===== 购买数量组件 ===== */
.qty-group .form-control {
    background: rgba(20, 24, 28, 0.85) !important;
    color: #e8e5dc !important;
    font-family: var(--ef-font-mono);
    font-weight: 600;
}

.qty-group button {
    background: rgba(20, 24, 28, 0.85) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: var(--ef-warn) !important;
    font-family: var(--ef-font-mono);
    font-weight: 700;
}

/* ===== 表单标签 ===== */
.form-label {
    color: var(--ef-text-secondary) !important;
    font-family: var(--ef-font-mono) !important;
    font-size: 11px !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

/* ===== 商品详情描述区 ===== */
.item-detail .panel-body {
    color: #d0cdc5 !important;
    font-size: 14px;
    line-height: 1.8;
}

.item-detail .panel-body img {
    border-radius: 0 !important;
    max-width: 100%;
}

/* ===== 价格显示 ===== */
.price {
    color: var(--ef-warn) !important;
    font-family: var(--ef-font-mono);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.abacus { color: #e8e5dc; }

/* ===== 表格 ===== */
.table { color: var(--ef-text-primary) !important; }
.table thead { background: rgba(240,201,43,0.06) !important; }
.table thead th {
    color: var(--ef-warn) !important;
    font-family: var(--ef-font-mono) !important;
    text-transform: uppercase; letter-spacing: 0.08em;
    font-size: 11px; border-bottom: 1px solid var(--ef-border-strong) !important;
}
.table tbody td { border-color: var(--ef-border) !important; }
.table-hover tbody tr:hover { background: rgba(240,201,43,0.04) !important; }
.table-striped tbody tr:nth-of-type(odd) { background: rgba(240,201,43,0.02); }

/* ===== 按钮 ===== */
.btn-primary:not(.navbar-acg .btn-primary), .btn-success, .btn-info {
    background: var(--ef-warn) !important;
    border-color: var(--ef-warn) !important;
    color: #0a0c0e !important;
    font-weight: 600; letter-spacing: 0.05em;
}
.btn-primary:hover, .btn-success:hover, .btn-info:hover {
    background: #ffd83a !important;
    box-shadow: 0 0 16px rgba(240,201,43,0.4);
    transform: translateY(-1px);
}
.btn-outline-primary, .btn-outline-secondary {
    border: 1px solid var(--ef-border-strong) !important;
    color: var(--ef-text-secondary) !important;
    background: rgba(20,24,28,0.6) !important;
}
.btn-outline-primary:hover, .btn-outline-secondary:hover {
    border-color: var(--ef-warn) !important;
    color: var(--ef-warn) !important;
    background: rgba(240,201,43,0.08) !important;
}

/* ===== 表单 ===== */
.form-control, .form-select, .input-group-text {
    background: rgba(20,24,28,0.7) !important;
    border: 1px solid var(--ef-border) !important;
    color: var(--ef-text-primary) !important;
}
.form-control:focus, .form-select:focus {
    border-color: var(--ef-warn) !important;
    box-shadow: 0 0 0 1px var(--ef-warn), 0 0 8px rgba(240,201,43,0.15) !important;
    background: rgba(20,24,28,0.9) !important;
}
.form-control::placeholder { color: var(--ef-text-muted) !important; }

/* ===== 页脚 ===== */
footer {
    background: rgba(15, 18, 22, 0.85) !important;
    border-top: 1px solid var(--ef-border-strong) !important;
    color: var(--ef-text-secondary) !important;
    text-align: center;
    padding: 20px;
}

/* ===== 分页 ===== */
.pagination .page-link {
    background: var(--ef-bg-panel) !important;
    border-color: var(--ef-border) !important;
    color: var(--ef-text-secondary) !important;
}
.pagination .page-link:hover { border-color: var(--ef-warn) !important; color: var(--ef-warn) !important; }
.pagination .active .page-link { background: var(--ef-warn) !important; border-color: var(--ef-warn) !important; color: #0a0c0e !important; }

/* ===== 价格标签 ===== */
.text-primary { color: var(--ef-warn) !important; }
.badge { font-family: var(--ef-font-mono); }
.badge.bg-primary, .badge-primary { background: var(--ef-warn) !important; color: #0a0c0e !important; }

/* ===== 模态框 / 弹窗 ===== */
.modal-content { background: var(--ef-bg-solid) !important; border: 1px solid var(--ef-border-strong) !important; color: var(--ef-text-primary) !important; }
.modal-header, .modal-footer { border-color: var(--ef-border) !important; }
.modal-backdrop { opacity: 0.85 !important; }
.layui-layer { background: var(--ef-bg-solid) !important; border: 1px solid var(--ef-warn) !important; }
.layui-layer-title { background: rgba(240,201,43,0.08) !important; color: var(--ef-warn) !important; border-bottom: 1px solid var(--ef-border) !important; font-family: var(--ef-font-mono) !important; text-transform: uppercase; letter-spacing: 0.1em; }
.layui-layer-shade { opacity: 0.8 !important; }

/* ===== 告警框 ===== */
.alert {
    background: var(--ef-bg-panel) !important;
    border: 1px solid var(--ef-border) !important;
    border-left: 3px solid var(--ef-warn) !important;
    color: var(--ef-text-primary) !important;
}

/* ===== 滚动条 ===== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: rgba(20,24,28,0.5); }
::-webkit-scrollbar-thumb { background: rgba(240,201,43,0.35); }
::-webkit-scrollbar-thumb:hover { background: var(--ef-warn); }

/* ===== 主题切换器 (右下角胶囊) ===== */
.ef-theme-switcher {
    position: fixed; right: 20px; bottom: 20px;
    z-index: 100;
    background: rgba(15,18,22,0.85);
    border: 1px solid var(--ef-border-strong);
    backdrop-filter: blur(10px);
    padding: 10px 14px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.4);
    user-select: none;
    display: flex; flex-direction: column; gap: 8px;
}
.ef-switcher-label {
    font-family: var(--ef-font-mono);
    font-size: 10px; color: var(--ef-text-secondary);
    letter-spacing: 0.15em; text-transform: uppercase; text-align: center;
}
body[data-ef-theme="2"] .ef-switcher-label { color: var(--ef-warn); }
.ef-switcher-btns { display: flex; gap: 8px; }
.ef-nav-btn {
    background: transparent;
    border: 1px solid var(--ef-border-strong);
    color: var(--ef-text-secondary);
    width: 30px; height: 30px;
    border-radius: 50%;
    cursor: pointer;
    font-family: var(--ef-font-mono);
    font-size: 11px; font-weight: 600;
    display: flex; align-items: center; justify-content: center;
    padding: 0; line-height: 1;
    transition: all 0.3s ease;
}
.ef-nav-btn:hover { border-color: rgba(255,255,255,0.5); color: #fff; }
body[data-ef-theme="0"] .ef-nav-btn.active { border-color: #00ffcc; background: #00ffcc; color: #050505; box-shadow: 0 0 10px #00ffcc; }
body[data-ef-theme="1"] .ef-nav-btn.active { border-color: #cc66ff; background: #cc66ff; color: #050505; box-shadow: 0 0 10px #cc66ff; }
body[data-ef-theme="2"] .ef-nav-btn.active, .ef-nav-btn.active { border-color: var(--ef-warn); background: var(--ef-warn); color: #0a0c0e; box-shadow: 0 0 10px var(--ef-warn); }
body[data-ef-theme="3"] .ef-nav-btn.active { border-color: #0099ff; background: #0099ff; color: #050505; box-shadow: 0 0 10px #0099ff; }

/* ===== 响应式 ===== */
@media (max-width: 768px) {
    .ef-theme-switcher { right: 12px; bottom: 12px; padding: 8px 10px; }
    .ef-nav-btn { width: 26px; height: 26px; font-size: 10px; }
    .ef-switcher-label { font-size: 9px; }
    html body { margin-top: 50px; }
}
