﻿.ct {
    border-spacing: 0;
    width: 100%;
    margin-bottom: 20px;
    background-color: aliceblue;
    text-align: center;
    /* 全局圆角，按需修改数值 */
    border-radius: 8px;
    overflow: hidden;
}

    .ct .tr-month {
        border: none;
        text-align: center;
        padding: 3px;
        font-weight: normal;
        font-size: 0.5em;
    }

    .ct .tr-day td {
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .ct .caption {
        font-size: 2.5em;
        text-align: center;
        padding: 10px;
    }

.week,
.mon,
.tue,
.wed,
.thu,
.fri,
.sat,
.sun {
    width: 12.5%;
    padding-top: 3px;
    padding-bottom: 3px;
    border-top: solid 1px gray;
    border-bottom: solid 1px gray;
}

.sat,
.sun {
    color: red;
}

.ct .day {
    padding-top: 5px;
    padding-bottom: 5px;
}

.ct .solar, .solar a {
    text-decoration: none;
    text-align: center;
    color: black;
    font-size: 1.2em;
}

.ct .lunar, .lunar a {
    text-decoration: none;
    text-align: center;
    color: gray;
    font-size: 0.89rem;
}

.ct .solar-term, .solar-term a {
    color: green;
    font-size: 0.89rem;
}

.ct .holiday, .holiday a {
    color: red;
    font-size: 0.89rem;
}

.ct .rest {
    color: red;
    font-size: 0.89rem;
    padding-left: 2px;
}

.ct .work {
    color: blue;
    font-size: 0.8rem;
    padding-left: 2px;
}

.ct .cdown {
    text-align: center;
    color: gray;
    font-size: 0.85em;
}

.ct .gaokao-day {
    color: red;
    font-weight: bold;
}

.ct .active-day {
    border: solid 1px red;
    background-color: white;
}

.ct .empty-row {
    height: 10px;
}

/*#region WXCY 色块样式组 */
.color-cell-wrap {
    width: 100%;
    display: flex;
    justify-content: center;
}

.color-row {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 3px;
}

.td-white,
.td-green,
.td-black,
.td-red,
.td-yellow {
    width: 10px;
    height: 10px;
    /*border: 1px solid #333;*/
    flex: 0 0 10px;
}

.td-white {
    background-color: #ffffff;
}

.td-green {
    background-color: #28a745;
}

.td-black {
    background-color: #212121;
}

.td-red {
    background-color: #dc3545;
}

.td-yellow {
    background-color: #ffc107;
}
/*#endregion WXCY 色块样式组 */
.div-colorful {
    display: flex;
    justify-content: center; /* 水平居中 */
    gap: 2px; /* 替代 margin:0 1px，两个元素之间间隔2px */
    align-items: center;
    text-align: center;
    padding: 5px;
}

.div-white {
    /* 金：柔和象牙白，比#FFFFF0干净，保留暖调，不会发黄过重 */
    background-color: white;
    height: 10px;
    width: 30%;
    max-width: 80px;
}

.div-green {
    /* 木：国风深青绿，去掉bootstrap刺眼的亮绿，沉稳 */
    background-color: green;
    height: 10px;
    width: 30%;
    max-width: 80px;
}

.div-black {
    /* 水：炭黑，#1E1E1E保留，很好，小细条不发闷 */
    background-color: black;
    height: 10px;
    width: 30%;
    max-width: 80px;
}

.div-red {
    /* 火：暗红朱砂色，传统五行红，降低亮度，网页不刺眼 */
    background-color: red;
    height: 10px;
    width: 30%;
    max-width: 80px;
}

.div-yellow {
    /* 土：土黄/赭黄，替换亮黄，贴合五行土，不荧光 */
    background-color: yellow;
    height: 10px;
    width: 30%;
    max-width: 80px;
}

.active-cell {
    /* 当前选中单元格，边框+底色，和五行色块协调，不冲突 */
    border: solid 1px #AB2328;
    background-color: #FFF2D9;
}

.wxcy-square-white {
    display: inline-block; /* 关键！行内块，支持宽高，不换行 */
    width: 24px;
    height: 24px;
    border: 1px solid #333;
    flex: 0 0 10px;
    background-color: white;
}

.wxcy-square-black {
    display: inline-block; /* 关键！行内块，支持宽高，不换行 */
    width: 24px;
    height: 24px;
    border: 1px solid #333;
    flex: 0 0 10px;
    background-color: black;
}

.wxcy-square-red {
    display: inline-block; /* 关键！行内块，支持宽高，不换行 */
    width: 24px;
    height: 24px;
    border: 1px solid #333;
    flex: 0 0 10px;
    background-color: red;
}

.wxcy-square-yellow {
    display: inline-block; /* 关键！行内块，支持宽高，不换行 */
    width: 24px;
    height: 24px;
    border: 1px solid #333;
    flex: 0 0 10px;
    background-color: yellow;
}

.wxcy-square-green {
    display: inline-block; /* 关键！行内块，支持宽高，不换行 */
    width: 24px;
    height: 24px;
    border: 1px solid #333;
    flex: 0 0 10px;
    background-color: green;
}
