/* =========================================================
   theme-light-orange.css — 油价站 · 百望風 浅橙色玻璃态皮肤
   参考：https://web.baiwang.com/
   加载顺序：必须放在 style.css / tech.css 之后引入，以覆盖之。
   设计：浅暖橙底 + 半透明玻璃卡片 + 橙系强调色。
   ========================================================= */

/* ---------- 1. 变量重映射（覆盖 tech.css 的 :root，使其变浅橙） ---------- */
:root {
    --bg-primary: #fdf3ec;          /* 暖白底 */
    --bg-secondary: #fbe6d6;        /* 浅橙底 */
    --bg-card: rgba(255, 255, 255, 0.74);
    --border-glow: rgba(255, 138, 61, 0.30);
    --accent-cyan: #ff8a3d;         /* 主强调：浅橙 */
    --accent-gold: #f4791f;         /* 次强调：深橙（保证浅底可读） */
    --accent-pink: #ff6b4a;         /* 点缀：珊瑚橙 */
    --text-primary: #2b2018;        /* 暖深棕（主文字） */
    --text-secondary: #7a6a5c;      /* 次文字 */
    --text-muted: #b09a86;          /* 弱文字 */
    --up-color: #ef4444;            /* 涨：红（中国习惯） */
    --down-color: #16a34a;          /* 跌：绿 */
    --glass-blur: 14px;
    --card-radius: 18px;
}

/* ---------- 2. 全局背景（浅暖橙 + 玻璃光晕） ---------- */
html, body {
    background-color: #fdf3ec !important;
    background-image:
        radial-gradient(circle at 50% -10%, rgba(255, 138, 61, 0.10) 0%, transparent 55%),
        linear-gradient(160deg, #fffaf6 0%, #fbe6d6 100%) !important;
    background-attachment: fixed;
    color: #2b2018 !important;
    font-family: "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased;
}
body::before {
    background:
        radial-gradient(circle at 18% 22%, rgba(255, 138, 61, 0.08) 0%, transparent 40%),
        radial-gradient(circle at 82% 78%, rgba(255, 154, 77, 0.06) 0%, transparent 40%) !important;
}

a { color: #2b2018 !important; text-decoration: none; transition: color .3s ease; }
a:hover { color: #ff7a29 !important; text-decoration: none; }

/* ---------- 3. 顶部导航（浅橙玻璃） ---------- */
.navbar {
    background: rgba(255, 255, 255, 0.72) !important;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-bottom: 1px solid rgba(255, 138, 61, 0.18) !important;
    box-shadow: 0 4px 24px rgba(180, 90, 30, 0.08) !important;
    padding: 0.8rem 0 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1050 !important;
}
.navbar-brand.logo img {
    max-height: 38px;
    height: auto;
    width: auto;
    display: block;
    filter: drop-shadow(0 2px 8px rgba(255, 138, 61, 0.25));
}
.nav-link {
    color: #5a4a3c !important;
    transition: all .3s ease;
    padding: 0.5rem 1rem !important;
    border-radius: 8px;
}
.nav-item.hover .nav-link,
.nav-item:hover .nav-link {
    color: #ff7a29 !important;
    font-weight: 600;
    background: rgba(255, 138, 61, 0.10) !important;
    border-bottom: 2px solid #ff8a3d !important;
}
.navbar .btn-link.text-white { color: #ff7a29 !important; }
.navbar-toggler { border-color: rgba(255, 138, 61, 0.4) !important; }
/* 搜索按钮（桌面端）：橙系实心 */
.navbar .btn-outline-light {
    background: linear-gradient(135deg, #ffa24d, #ff7a29) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 8px !important;
}
.navbar .btn-outline-light:hover {
    box-shadow: 0 0 16px rgba(255, 138, 61, 0.4);
    transform: translateY(-1px);
}
.navbar .form-control {
    background: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid rgba(255, 138, 61, 0.30) !important;
    color: #2b2018 !important;
    border-radius: 8px !important;
}
.navbar .form-control::placeholder { color: #b09a86 !important; }
.navbar .form-control:focus {
    border-color: #ff8a3d !important;
    box-shadow: 0 0 0 3px rgba(255, 138, 61, 0.18) !important;
}

/* ---------- 4. 行情滚动条 Ticker（浅橙玻璃） ---------- */
.ticker-bar {
    background: linear-gradient(90deg, rgba(255,138,61,0.12), rgba(255,178,77,0.10), rgba(255,138,61,0.12)) !important;
    border-bottom: 1px solid rgba(255, 138, 61, 0.20) !important;
    color: #2b2018 !important;
}
.ticker-bar span[style] { color: #ff7a29 !important; }   /* 覆盖内联 var(--accent-gold) */
.ticker-bar .text-danger { color: var(--up-color) !important; font-weight: 700; }
.ticker-bar .text-success { color: var(--down-color) !important; font-weight: 700; }

/* ---------- 5. 玻璃卡片：content-box / bg-f / area-list ---------- */
.content-box {
    background: var(--bg-card) !important;
    backdrop-filter: blur(var(--glass-blur)) !important;
    -webkit-backdrop-filter: blur(var(--glass-blur)) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    border-radius: var(--card-radius) !important;
    box-shadow: 0 8px 30px rgba(180, 90, 30, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
    margin-bottom: 20px !important;
    padding: 24px !important;
    animation: none !important;   /* 关闭 tech.css 的青色呼吸动画 */
    transition: all .3s ease !important;
    color: #2b2018 !important;
}
.content-box:hover {
    border-color: rgba(255, 138, 61, 0.45) !important;
    box-shadow: 0 12px 40px rgba(255, 138, 61, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
    transform: translateY(-2px);
}
.bg-f {
    background: var(--bg-card) !important;
    backdrop-filter: blur(var(--glass-blur)) !important;
    -webkit-backdrop-filter: blur(var(--glass-blur)) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    border-radius: var(--card-radius) !important;
    box-shadow: 0 8px 30px rgba(180, 90, 30, 0.08) !important;
    color: #2b2018 !important;
}
.shadow { box-shadow: 0 8px 30px rgba(180, 90, 30, 0.08) !important; }

/* ---------- 6. 标题 / 区块标题 ---------- */
.title, .content-box .title, .content-box h1.title {
    color: #2b2018 !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    padding: 10px 0;
    background: linear-gradient(90deg, #ff8a3d, #ff6b4a) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}
.section-title {
    background: rgba(255, 255, 255, 0.65) !important;
    border-left: 4px solid #ff8a3d !important;
    border-radius: 0 12px 12px 0 !important;
    padding: 14px 18px !important;
    margin-bottom: 1rem !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    color: #2b2018 !important;
    letter-spacing: .3px !important;
    backdrop-filter: blur(10px);
}
h4.section-title, h6.section-title {
    background: rgba(255, 255, 255, 0.65) !important;
    border-left: 4px solid #ff8a3d !important;
    border-radius: 0 12px 12px 0 !important;
    padding: 14px 18px !important;
    margin-bottom: 1rem !important;
    font-weight: 700 !important;
    color: #2b2018 !important;
}
.content-box h4 a, .section-title a { color: #ff7a29 !important; }

/* ---------- 7. 面包屑 ---------- */
.breadcrumb {
    background: rgba(255, 255, 255, 0.80) !important;
    border: 1px solid rgba(255, 138, 61, 0.14) !important;
    border-radius: 14px !important;
    padding: 15px 20px !important;
    margin-bottom: 20px !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 18px rgba(180, 90, 30, 0.06);
    color: #7a6a5c !important;
}
.breadcrumb a { color: #5a4a3c !important; padding: 0 8px; }
.breadcrumb a:hover { color: #ff7a29 !important; }

/* ---------- 8. 城市/品种列表（area-list） ---------- */
.area-list {
    position: relative;
    padding: 30px;
    border-radius: var(--card-radius) !important;
    background: var(--bg-card) !important;
    backdrop-filter: blur(var(--glass-blur));
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow: 0 8px 30px rgba(180, 90, 30, 0.08);
}
.area-list-prov {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 138, 61, 0.18) !important;
}
.area-list h3 {
    position: absolute;
    left: 0;
    font-size: 17px;
    font-weight: 600;
    margin: 0;
    padding: 0;
    width: 90px;
    color: #ff7a29 !important;
    letter-spacing: .5px;
}
.area-list-city, .area-list-area { position: relative; margin-left: 100px; font-size: 14px; line-height: 28px; }
.area-list-city a, .area-list-area a { color: #5a4a3c !important; margin-right: 10px; transition: all .3s ease; }
.area-list-city a:hover, .area-list-area a:hover { color: #ff7a29 !important; text-decoration: none; }

/* ---------- 9. 行情列表（list-container / list-group / list-unstyled） ---------- */
/* 覆盖 tech.css 深色 list-group-item（You May Also Like 等侧边栏列表） */
.list-group {
    background: transparent !important;
    border-radius: var(--card-radius) !important;
    overflow: hidden;
}
.list-group-item {
    background: rgba(255, 255, 255, 0.55) !important;
    border: 1px solid rgba(255, 138, 61, 0.12) !important;
    color: #2b2018 !important;
    padding: 12px 16px;
    transition: all .3s ease;
}
.list-group-item:not(:last-child) {
    border-bottom: 1px solid rgba(255, 138, 61, 0.10) !important;
}
.list-group-item:hover {
    background: rgba(255, 138, 61, 0.10) !important;
    border-color: rgba(255, 138, 61, 0.30) !important;
    color: #ff7a29 !important;
}
.list-group-item a { color: #2b2018 !important; }
.list-group-item a:hover { color: #ff7a29 !important; }

.list-container {
    border: 1px solid rgba(255, 138, 61, 0.18) !important;
    border-radius: var(--card-radius) !important;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.55) !important;
}
.list-header {
    display: flex;
    background: linear-gradient(90deg, rgba(255, 138, 61, 0.14), rgba(255, 178, 77, 0.08)) !important;
    font-weight: 600 !important;
    padding: 0.85rem 1rem !important;
    border-bottom: 1px solid rgba(255, 138, 61, 0.18) !important;
    color: #ff7a29 !important;
    font-size: 0.85rem !important;
    text-transform: uppercase;
    letter-spacing: .5px;
}
.list-item {
    display: flex;
    padding: 1rem 1rem !important;
    border-bottom: 1px solid rgba(255, 138, 61, 0.10) !important;
    transition: all .25s ease !important;
}
.list-item:hover { background: rgba(255, 138, 61, 0.07) !important; }
.list-item:last-child { border-bottom: none !important; }
.list-item .name { cursor: pointer; }
.list-item .name a { color: #2b2018 !important; font-weight: 500; display: block; width: 100%; }
.list-item .name a:hover { color: #ff7a29 !important; }
.danwei { font-size: 11px; color: var(--text-muted) !important; margin-left: 2px; }

.list-unstyled { list-style: none; padding: 0; margin: 0; }
.list-unstyled li {
    display: flex;
    align-items: flex-start;
    padding: 16px 0 !important;
    border-bottom: 1px solid rgba(255, 138, 61, 0.08) !important;
    transition: all .3s ease;
}
.list-unstyled li:last-child { border-bottom: none !important; }
.list-unstyled li:hover { border-bottom-color: rgba(255, 138, 61, 0.30) !important; }
.list-unstyled li .item-img-inner {
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(180, 90, 30, 0.10);
}
.list-unstyled li:hover .item-img-inner { box-shadow: 0 4px 20px rgba(255, 138, 61, 0.20); transform: scale(1.02); }
.list-unstyled li .item-title a { color: #2b2018 !important; transition: color .3s ease; }
.list-unstyled li .item-title a:hover { color: #ff7a29 !important; }
.list-unstyled li .item-excerpt, .list-unstyled li .item-excerpt p { color: #7a6a5c !important; }
.list-unstyled li .item-meta { color: #b09a86 !important; font-size: .8rem; }
.list-unstyled li .item-meta i { color: #ff8a3d !important; margin-right: 3px; }

/* ---------- 10. 涨跌色（中国习惯：红涨绿跌） ---------- */
.text-success { color: var(--down-color) !important; font-weight: 600; }
.text-danger { color: var(--up-color) !important; font-weight: 600; }

/* ---------- 11. 标签 / 按钮 ---------- */
.tags {
    display: inline-block;
    background: rgba(255, 138, 61, 0.08) !important;
    border: 1px solid rgba(255, 138, 61, 0.25) !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
    color: #2b2018 !important;
    font-size: .85rem;
    margin: 3px;
    transition: all .3s ease;
}
.tags a { color: #5a4a3c !important; }
.tags:hover { background: rgba(255, 138, 61, 0.16) !important; border-color: #ff8a3d !important; box-shadow: 0 0 10px rgba(255, 138, 61, 0.20); }
.tags a:hover { color: #ff7a29 !important; }

.btn-outline-secondary {
    border-color: rgba(255, 138, 61, 0.35) !important;
    color: #5a4a3c !important;
    background: transparent !important;
    border-radius: 20px !important;
    padding: 4px 12px !important;
    font-size: .8rem;
    transition: all .3s ease !important;
}
.btn-outline-secondary:hover {
    background: #ff8a3d !important;
    border-color: #ff8a3d !important;
    color: #fff !important;
    box-shadow: 0 0 12px rgba(255, 138, 61, 0.30);
}
.btn-primary {
    background: linear-gradient(135deg, #ffa24d, #ff7a29) !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 600;
    color: #fff !important;
    transition: all .3s ease !important;
}
.btn-primary:hover {
    background: linear-gradient(135deg, #ffb35e, #ff8a3d) !important;
    box-shadow: 0 0 20px rgba(255, 138, 61, 0.40);
    transform: translateY(-1px);
}

/* ---------- 12. 分页 ---------- */
.pagination { display: flex; list-style: none; padding: 0; flex-wrap: wrap; justify-content: center; gap: 6px; }
.pagesize, .current { display: inline-block; padding: 8px 14px; border-radius: 8px; font-size: .9rem; }
.pagesize { color: #5a4a3c !important; border: 1px solid rgba(255, 138, 61, 0.30) !important; background: rgba(255, 255, 255, 0.7) !important; transition: all .3s ease; }
.pagesize:hover { background: rgba(255, 138, 61, 0.12) !important; color: #ff7a29 !important; border-color: #ff8a3d !important; }
.current { background: linear-gradient(135deg, #ffa24d, #ff7a29) !important; color: #fff !important; border: 1px solid #ff8a3d !important; font-weight: 600; box-shadow: 0 0 12px rgba(255, 138, 61, 0.30); }
/* 兼容 .pages（style.css 旧分页） */
.pages a, .pages b, .pages span {
    color: #5a4a3c !important;
    background: rgba(255, 255, 255, 0.8) !important;
    border: 1px solid rgba(255, 138, 61, 0.30) !important;
    transition: all .3s ease;
}
.pages a:hover, .pages > b { color: #fff !important; background: linear-gradient(135deg, #ffa24d, #ff7a29) !important; border-color: #ff8a3d !important; }

/* ---------- 13. 表格（历史价格等） ---------- */
.content table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
    background: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid rgba(255, 138, 61, 0.25) !important;
    border-radius: 12px;
    overflow: hidden;
}
.content table caption {
    caption-side: top;
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff !important;
    background: linear-gradient(90deg, #ff8a3d, #ff6b4a) !important;
    border: none;
    padding: 12px;
    text-align: center;
    border-radius: 12px 12px 0 0;
}
.content table th, .content table td {
    border: 1px solid rgba(255, 138, 61, 0.18) !important;
    padding: 12px;
    text-align: center;
    color: #2b2018 !important;
}
.content table th { background: rgba(255, 138, 61, 0.12) !important; font-weight: 600; color: #ff7a29 !important; }
.content table tr:nth-child(even) { background: rgba(255, 255, 255, 0.45); }
.content table tr:hover { background: rgba(255, 138, 61, 0.08); }

/* ---------- 14. 工具框 / 内容框 ---------- */
.tool_show {
    padding: 20px;
    background: rgba(255, 138, 61, 0.06) !important;
    border: 1px solid rgba(255, 138, 61, 0.22) !important;
    border-radius: var(--card-radius);
    box-shadow: 0 2px 16px rgba(255, 138, 61, 0.10);
    color: #2b2018 !important;
}

/* ---------- 15. 广告位容器（覆盖旧科技风深色背景） ---------- */
.adsense-article,
.adsense-container {
    background: rgba(255, 255, 255, 0.55) !important;
    border: 1px solid rgba(255, 138, 61, 0.18) !important;
    border-radius: var(--card-radius) !important;
    color: #2b2018 !important;
    text-align: center;
}
.adsense-article {
    margin: 20px 0;
    padding: 20px;
}
.adsense-container {
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ---------- 16. 更新时间标签 gxsj ---------- */
.gxsj {
    font-size: 12px;
    color: #b09a86;
    background: rgba(255, 138, 61, 0.08);
    border: 1px solid rgba(255, 138, 61, 0.18);
    border-radius: 20px;
    padding: 2px 10px;
    display: inline-block;
}

/* ---------- 16. 侧边栏悬浮（rollbar） ---------- */
.rollbar .actions .contbar {
    background: var(--bg-card) !important;
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 138, 61, 0.30) !important;
    border-radius: 10px !important;
    width: 44px;
    height: 44px;
    transition: all .3s ease;
}
.rollbar .actions .contbar:hover { border-color: #ff8a3d !important; box-shadow: 0 0 15px rgba(255, 138, 61, 0.25); transform: scale(1.05); }
.rollbar .actions .contbar > a > i { color: #ff7a29 !important; font-size: 20px; }
.rollbar .actions .contbar.tel > a > i:hover { color: #ff7a29 !important; }
.rollbar .actions .contbar.wx > a > i:hover { color: #16a34a !important; }

/* ---------- 17. 模态框（移动端搜索） ---------- */
.modal-content {
    background: #fffaf6 !important;
    border: 1px solid rgba(255, 138, 61, 0.30) !important;
    border-radius: var(--card-radius) !important;
    box-shadow: 0 8px 40px rgba(180, 90, 30, 0.20) !important;
}
.modal-header { border-bottom: 1px solid rgba(255, 138, 61, 0.20) !important; }
.modal-body { color: #2b2018 !important; }
.modal .form-control { background: #fff !important; border: 1px solid rgba(255, 138, 61, 0.30) !important; color: #2b2018 !important; }
.modal .btn-primary { color: #fff !important; }
.btn-close { filter: none; }

/* ---------- 18. 页脚（浅橙玻璃，融入背景沉底） ---------- */
.footer {
    background: rgba(255, 255, 255, 0.55) !important;
    backdrop-filter: blur(12px);
    border-top: 1px solid rgba(255, 138, 61, 0.18) !important;
    color: #7a6a5c !important;
    margin-top: 40px;
    padding: 40px 20px 50px;
}
.footer a { color: #7a6a5c !important; transition: color .3s ease; }
.footer a:hover { color: #ff7a29 !important; }
.foot-links a, .foot-nav a { color: #7a6a5c !important; font-size: .9rem; }
.foot-links a:hover, .foot-nav a:hover { color: #ff7a29 !important; }

/* ---------- 19. 滚动条 ---------- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #fbe6d6; }
::-webkit-scrollbar-thumb { background: #ff8a3d; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #ff7a29; }

/* ---------- 20. 响应式 ---------- */
@media (max-width: 990px) {
    .navbar-nav { margin-left: 0; padding-top: 1rem; }
    .content-box { padding: 16px !important; }
    .list-unstyled li { flex-direction: column; padding: 12px 0 !important; }
    .list-unstyled li .list-image { width: 100%; margin-bottom: 10px; }
    .list-unstyled li .item-excerpt { display: none; }
    .list-unstyled li .item-meta .category { display: none; }
}
@media (max-width: 568px) {
    .area-list-city, .area-list-area { margin-left: 0; }
    .area-list h3 { position: static; width: auto; margin-bottom: 8px; }
    .content-box { padding: 14px !important; }
    .section-title { font-size: 1rem !important; padding: 10px 14px !important; }
}