/* 全局禁止浏览器自动缩小文字 */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* 黑金金融主题全局变量（色彩标准化） */
:root{
    /* 背景体系 */
    --bg-page:#08080d;        /* 页面最底层纯黑 */
    --bg-card:#12121a;        /* 内容卡片底色 */
    --bg-block:#191928;       /* 筛选/介绍区块底色 */
    --border-color:#242436;   /* 统一边框深灰黑 */

    /* 黄金色系（高端哑光金，不刺眼） */
    --gold-main:#d4af37;
    --gold-light:#e9c970;
    --gold-dark:#a8862c;

    /* 文字层级色 */
    --text-high:#ffffff;      /* 一级正文纯白（介绍、表格、筛选） */
    --text-mid:#d1d1e3;       /* 二级浅灰（次要内容） */
    --text-low:#9494b0;       /* 三级深灰（页脚、备注、空提示） */

    /* 业务状态色（金融区分品种） */
    --stock-blue:#42b0ff;
    --future-orange:#ff9328;
    --crypto-teal:#20d0ad;
    --stop-red:#ff4444;       /* 加深闭市红色，深色背景更亮眼美观 */
    --trade-green:#4bd862;
}

/* 全局重置 */
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:"Microsoft YaHei",sans-serif;
}
body{
    background: var(--bg-page);
    padding:1vw 0;
}

/* 全局A链接标准化（解决链接颜色混乱） */
a{
    color: var(--gold-dark);
    text-decoration: none;
    transition: color 0.24s ease;
}
a:hover{
    color: var(--gold-light);
}
/* 返回首页链接单独弱化 */
.top-bar .back-home {
    color: var(--text-mid);
    font-size: clamp(14px,1.1vw,16px);
}
.top-bar .back-home:hover{
    color: var(--gold-light);
}
/* 分页按钮链接 */
.lbdata li a{
    color: var(--text-mid);
    font-size: clamp(14px,1vw,15px);
}
.lbdata li a:hover {
    color: var(--gold-light);
    border-color:var(--gold-main);
}
/* 分页激活页码修复：黑底金字，区分度高 */
.lbdata li.active a {
    background: linear-gradient(135deg,var(--gold-dark),var(--gold-main));
    color:#000 !important;
    font-weight:600;
    border-color: var(--gold-main);
}
/* 页脚链接 */
.footer a{
    color:var(--gold-dark);
}
.footer a:hover{
    color:var(--gold-light);
}

/* 段落基础统一标准字号，最小16px保底 */
p{
    margin:0;
    padding:0;
    text-indent:30px;
    line-height:1.85;
    margin-bottom:14px;
    font-size: clamp(16px,1.2vw,18px);
    color:var(--text-high);
}

/* 外层主容器 */
.container{
    max-width:1400px;
    margin:0 auto;
    background:var(--bg-card);
    box-shadow:0 0 32px rgba(212, 175, 55, 0.06);
    border:1px solid var(--border-color);
    border-radius:14px;
    overflow:hidden;
}

/* 筛选框、介绍模块统一样式 */
.filter-box,.about,.foot-tip{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    margin-bottom:26px;
    padding:20px;
    background:var(--bg-block);
    border-radius:10px;
    align-items:flex-start;
    border:1px solid var(--border-color);
}
.foot-tip{
    margin-top:22px;
    display:none;
}

/* 筛选项字号、配色 */
.filter-item{
    display:flex;
    align-items:center;
    gap:9px;
    min-width:120px;
}
.filter-item label{
    font-weight:500;
    color:var(--gold-light);
    white-space:nowrap;
    font-size: clamp(16px,1.2vw,18px);
}
/* 下拉框、日期输入框样式统一，最小14px */
select,input[type="date"]{
    padding:9px 14px;
    border:1px solid var(--border-color);
    border-radius:6px;
    outline:none;
    font-size: clamp(14px,1vw,16px);
    min-width:140px;
    flex:1;
    background:#0f0f19;
    color:var(--text-high);
    transition:border-color 0.3s;
}
/* 解决深色模式日历图标黑色看不见 */
input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1); /* 图标反白，变成白色可见 */
    cursor: pointer;
    transform: scale(1.2); /* 放大一点更好点击 */
    padding: 2px;
}
select:focus,input[type="date"]:focus{
    border-color:var(--gold-main);
    box-shadow:0 0 0 2px rgba(212, 175, 55, 0.14);
}
select option{
    background:var(--bg-card);
    color:var(--text-high);
}

/* 查询按钮黄金渐变标准尺寸 */
.search-btn{
    padding:9px 26px;
    background:linear-gradient(135deg,var(--gold-dark),var(--gold-main));
    color:#000;
    border:none;
    border-radius:6px;
    cursor:pointer;
    font-size: clamp(16px,1.2vw,18px);
    font-weight:600;
    white-space:nowrap;
    transition:all 0.24s ease;
}
.search-btn:hover{
    background:linear-gradient(135deg,var(--gold-main),var(--gold-light));
    box-shadow:0 0 14px rgba(212, 175, 55, 0.32);
}

/* 表格容器横向滚动 */
.holiday-wrap {
    overflow-x:auto;
    width:100%;
}
.holiday-table{
    width:100%;
    border-collapse:collapse;
    margin-top:12px;
}
.holiday-table th,.holiday-table td{
    padding:13px 12px;
    text-align:center;
    border:1px solid var(--border-color);
    font-size: clamp(14px,1vw,16px);
    white-space:nowrap;
}
/* 表头黑金渐变，黄金文字 */
.holiday-table th{
    background:linear-gradient(135deg,#1d1d30,#141422);
    color:var(--gold-light);
    font-weight:500;
}
/* 表格隔行底色区分 */
.holiday-table tr{background:var(--bg-card);}
.holiday-table tr:nth-child(even){background:#10101b;}
.holiday-table tr:hover{background:#1c1c30;}
.holiday-table td{color:var(--text-mid);}

/* 品种类型文字色 */
.type-stock{color:var(--stock-blue);font-weight:500;}
.type-future{color:var(--future-orange);font-weight:500;}
.type-crypto{color:var(--crypto-teal);font-weight:500;}
/* 交易状态文字 - 闭市红色强化，最小16px */
.status-holiday{color:var(--stop-red) !important;font-weight:bold;font-size: clamp(16px,1.2vw,18px);}
.status-early {color:var(--stock-blue) !important;font-weight:bold;}
.status-normal{color:var(--trade-green) !important;font-weight:bold;}
/* 空数据提示，大号标准字 */
.empty-tip{
    text-align:center;
    padding:42px;
    color:var(--text-low);
    display:none;
    font-size: clamp(18px,1.5vw,20px);
}

/* about介绍区块 全部文字纯白 */
.about{
    line-height:1.92;
    text-align:justify;
    color:var(--text-high) !important;
    font-size: clamp(16px,1.2vw,18px);
}
/* about内所有纯文本、p标签强制纯白 */
.about > span,
.about > a:not(.back-home),
.about p {
    color: var(--text-high) !important;
}
/* 品牌链接高亮金色放大 */
.about a strong{
    color:var(--gold-light) !important;
    font-size: clamp(18px,1.4vw,20px);
    letter-spacing:0.5px;
}


/* 顶部标题栏 图标返回+标题占满剩余宽度 */
.top-bar {
    display: flex;
    align-items: center; /* 全部元素垂直居中，解决高低错位 */
    width: 100%;
    gap: 16px; /* 图标和标题之间留一点间距，不贴死 */
    margin-bottom: 22px;
    padding: 18px 22px;
    background: linear-gradient(90deg,#0a0a13,#131320);
    border-bottom: 1px solid var(--border-color);
}

/* 主页按钮 1:1还原截图样式 */
.back-home {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(48px, 12vw, 58px);
    height: clamp(28px, 12vw, 38px);
    font-size: clamp(17px, 3.4vw, 20px);
    font-weight: 500;
    color: #ffffff;
    border-radius: 16px;
    box-shadow: 0 0 20px rgba(233, 201, 112, 0.3);
    border: none;
    transition: all 0.22s ease;
}
/* 悬浮效果：轻微提亮光晕，不突兀变色、不放大 */
.back-home:hover {
    box-shadow: 0 0 26px rgba(233, 201, 112, 0.48);
}


/* 剩余全部宽度都给标题区域，标题自动居中 */
.title-wrap {
    flex: 1;
    text-align: center;
}
.top-bar .title {
    font-size: clamp(22px,2.4vw,30px);
    color: var(--gold-light);
    letter-spacing: 1px;
    font-weight: 500;
    margin: 0;
    line-height: 1.2;
}

/* 分页区域统一字号 */
.lbdata {
    text-align:center;
    margin:22px 0;
}
.lbdata ul {
    margin:0;
    padding:0;
    list-style:none;
    font-size:0;
    line-height:1;
}
.lbdata li {
    display:inline-block;
    margin:5px;
    vertical-align:middle;
}
.lbdata li a {
    display:inline-block;
    text-decoration:none;
    padding:7px 15px;
    border:1px solid var(--border-color);
    border-radius:4px;
    white-space:nowrap;
    background:#10101b;
    transition:0.24s;
}

/* 页脚小字，最小13px，不小于标准辅助文字 */
.footer {
    text-align:center;
    margin-top:24px;
    padding-top:22px;
    padding-bottom:36px;
    background:var(--bg-page);
}
.footer-note {
    font-size: clamp(13px,0.9vw,14px);
    color:var(--text-low);
    line-height:1.65;
    margin-bottom:12px;
}
.footer-copyright {
    font-size: clamp(13px,0.9vw,14px);
    color:var(--text-mid);
}

/* ========== 移动端媒体查询：进一步放大，强制标准可读尺寸 ========== */
@media (max-width:768px) {
    .filter-box {
        gap:14px;
    }
    .filter-item {
        width:100%;
        min-width:auto;
    }
    select,input[type="date"] {
        width:100%;
        min-width:auto;
    }
    .search-btn {
        width:100%;
        padding:12px;
    }

    p {
        text-indent:16px;
        /* 手机正文直接锁定17~19px，更大更好读 */
        font-size: clamp(17px,4vw,19px);
    }
    .filter-item label {
        font-size: clamp(17px,4vw,19px);
    }
    select,input[type="date"] {
        font-size: clamp(16px,3.6vw,18px);
    }
    .search-btn {
        font-size: clamp(17px,4vw,19px);
    }
    .lbdata li a {
        padding:5px 9px;
        font-size: clamp(15px,3.2vw,17px);
    }
    .holiday-wrap {
        overflow-x:auto;
    }
    /* 移动端表格卡片化 */
    .holiday-table thead {
        display:none;
    }
    .holiday-table tr {
        display:block;
        margin-bottom:14px;
        border:1px solid var(--border-color);
        border-radius:10px;
        background:var(--bg-card);
    }
    .holiday-table td {
        display:flex;
        text-align:left;
        border:none;
        border-bottom:1px solid #1f1f32;
        padding:11px 14px;
        white-space:normal;
        font-size: clamp(16px,3.6vw,18px);
    }
    .holiday-table td:last-child {
        border-bottom:none;
    }
    /* 移动端字段标签金色 */
    .holiday-table td::before {
        font-weight:bold;
        min-width:82px;
        color:var(--gold-light);
        font-size: clamp(16px,3.6vw,18px);
    }
    .holiday-table td:nth-child(1)::before { content:"品种名称："; }
    .holiday-table td:nth-child(2)::before { content:"所属地区："; }
    .holiday-table td:nth-child(3)::before { content:"交易所："; }
    .holiday-table td:nth-child(4)::before { content:"交易日期："; }
    .holiday-table td:nth-child(5)::before { content:"节日休市："; }
    .holiday-table td:nth-child(6)::before { content:"状态："; }

    .top-bar .title {
        font-size: clamp(24px,6vw,32px);
    }
    .empty-tip {
        font-size: clamp(19px,4.8vw,22px);
    }
    .about {
        font-size: clamp(17px,4vw,19px);
    }
    .about a strong {
        font-size: clamp(19px,4.5vw,22px);
    }
    .status-holiday {
        font-size: clamp(17px,4vw,19px);
    }
    .footer-note,.footer-copyright {
        font-size: clamp(14px,3vw,16px);
    }
}