:root {
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  font-weight: 400;
  color-scheme: light dark;
  color: #ffffffde;
  background-color: #242424;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%
}

a {
  font-weight: 500;
  color: #646cff;
  text-decoration: inherit
}

a:hover {
  color: #535bf2
}

body {
  margin: 0;
  display: flex;
  place-items: center;
  min-width: 320px;
  min-height: 100vh
}

h1 {
  font-size: 3.2em;
  line-height: 1.1
}

button {
  border-radius: 8px;
  border: 1px solid transparent;
  padding: .6em 1.2em;
  font-size: 1em;
  font-weight: 500;
  font-family: inherit;
  background-color: #1a1a1a;
  cursor: pointer;
  transition: border-color .25s
}

button:hover {
  border-color: #646cff
}

button:focus,
button:focus-visible {
  outline: 4px auto -webkit-focus-ring-color
}

.card {
  padding: 2em
}

#app {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2rem;
  text-align: center
}

@media (prefers-color-scheme: light) {
  :root {
    color: #213547;
    background-color: #fff
  }

  a:hover {
    color: #747bff
  }

  button {
    background-color: #f9f9f9
  }
}

/* --- 老黄历样式修改部分 --- */

.calendar *[data-v-af7232b4] {
  margin: 0;
  padding: 0;
  box-sizing: border-box
}

.calendar[data-v-af7232b4] {
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  overflow: hidden;
  color: #222;
  /* 修改：宽度自适应，并限制最大宽度 */
  width: 100%;
  max-width: 1000px;
  border: 2px solid #F6D07B;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap; /* 允许折行 */
}

/* 移动端适配：屏幕小于768px时变为垂直布局 */
@media (max-width: 768px) {
  .calendar[data-v-af7232b4] {
    flex-direction: column;
  }
  .calendar>div.border-right[data-v-af7232b4] {
    border-right: none;
    border-bottom: 1px solid #F4C493;
  }
}

.calendar>div[data-v-af7232b4] {
  flex: 1;
  min-width: 250px; /* 保证子栏目最小宽度 */
  overflow: hidden;
}

.calendar div.lang[data-v-af7232b4] {
  position: absolute;
  right: 20px;
  top: 20px;
  border: 1px solid #646cff;
  border-radius: 6px
}

.calendar div.lang a[data-v-af7232b4] {
  padding: 5px;
  cursor: pointer
}

.calendar div.lang a.active[data-v-af7232b4] {
  background: #646cff;
  color: #fff
}

.calendar .center[data-v-af7232b4] {
  flex: 2; /* 中间栏占两倍空间 */
}

.calendar .border-bottom[data-v-af7232b4] {
  border-bottom: 1px solid #F4C493
}

.calendar .border-right[data-v-af7232b4] {
  border-right: 1px solid #F4C493
}

.calendar .bg[data-v-af7232b4] {
  background-color: #fcf8ef
}

.calendar .lunar[data-v-af7232b4] {
  height: 60px;
  line-height: 60px
}

.calendar .row[data-v-af7232b4] {
  height: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between
}

.calendar .row>div[data-v-af7232b4] {
  flex: 1
}

.calendar .col[data-v-af7232b4] {
  flex-direction: row
}

.calendar div.label[data-v-af7232b4] {
  font-size: 16px;
  font-weight: 700;
  color: #bc2f3f;
  width: 80px;
  text-align: left;
  flex: none;
  text-indent: 10px
}

.calendar .grid[data-v-af7232b4] {
  height: auto; /* 改为自动高度适配内容 */
  min-height: 182px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between
}

.calendar .grid .col2[data-v-af7232b4] {
  flex: 1;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between
}

.calendar .grid .col2>div[data-v-af7232b4] {
  flex: auto
}

.calendar .grid .col2>div.bar[data-v-af7232b4] {
  flex: none;
  width: 30px;
  margin-left: 20px
}

.calendar .grid .col2 div.label[data-v-af7232b4] {
  color: #000
}

.calendar .yj-container[data-v-af7232b4] {
  height: auto;
  min-height: 180px;
  overflow: hidden;
  padding-bottom: 10px;
}

.calendar .yj-container .yj[data-v-af7232b4] {
  margin: 20px auto;
  position: relative;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  border-radius: 50%;
  color: #fff
}

.calendar .yj-container .yj[data-v-af7232b4]:before,
.calendar .yj-container .yj[data-v-af7232b4]:after {
  position: absolute;
  content: "";
  left: -2px;
  top: -2px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  z-index: -1
}

.calendar .yj-container .yj[data-v-af7232b4]:after {
  width: 44px;
  height: 44px;
  z-index: -2
}

.calendar .yj-container .yi[data-v-af7232b4] {
  background: #5CB85C
}

.calendar .yj-container .ji[data-v-af7232b4] {
  background: #D9534F
}

.calendar .yj-container .yi[data-v-af7232b4]:before,
.calendar .yj-container .ji[data-v-af7232b4]:before {
  background: #FFFFFF
}

.calendar .yj-container .yi[data-v-af7232b4]:after,
.calendar .yj-container .ji[data-v-af7232b4]:after {
  left: -4px;
  top: -4px
}

.calendar .yj-container .yi[data-v-af7232b4]:after {
  background: #5CB85C
}

.calendar .yj-container .ji[data-v-af7232b4]:after {
  background: #D9534F
}

.calendar .js[data-v-af7232b4] {
  height: auto;
  min-height: 165px;
  overflow: hidden;
  padding-bottom: 10px;
}

.calendar .js .label[data-v-af7232b4] {
  margin-top: 10px
}

.calendar .yj-container ul li[data-v-af7232b4],
.calendar .js ul li[data-v-af7232b4] {
  list-style: none;
  float: left;
  width: 25%; /* 默认4列 */
  height: 32px;
  line-height: 32px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 窄屏下宜忌列表改为2列 */
@media (max-width: 480px) {
  .calendar .yj-container ul li[data-v-af7232b4],
  .calendar .js ul li[data-v-af7232b4] {
    width: 50%;
  }
}

.calendar .today[data-v-af7232b4] {
  margin: 0 auto;
  width: 100%; /* 修改：自适应宽度 */
  max-width: 400px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  font-size: clamp(60px, 15vw, 120px); /* 字体大小随屏幕缩放 */
  font-weight: 700;
  color: #bc2f3f;
  line-height: 1.5;
  align-items: center
}

.calendar .today a[data-v-af7232b4] {
  width: 0;
  height: 0;
  border: 20px solid transparent; /* 缩小箭头 */
  font-size: 0;
  line-height: 0;
  cursor: pointer;
}

.calendar .today a.prev[data-v-af7232b4] {
  border-right-color: #bc2f3f
}

.calendar .today a.next[data-v-af7232b4] {
  border-left-color: #bc2f3f
}

.calendar .bar[data-v-af7232b4] {
  position: relative;
  width: 30px;
  height: 120px;
  color: #fff;
  text-align: center;
  background: #BC2F3F;
  display: flex;
  align-items: center;
  border-radius: 6px
}

.calendar .bar[data-v-af7232b4]:before,
.calendar .bar[data-v-af7232b4]:after {
  content: "";
  position: absolute;
  left: 50%;
  top: -6px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #BC2F3F;
  margin-left: -8px
}

.calendar .bar[data-v-af7232b4]:after {
  top: auto;
  bottom: -6px
}

.calendar .inputs[data-v-af7232b4] {
  position: relative;
  display: flex;
  padding: 20px;
  flex-wrap: wrap;
  justify-content: center;
}

.calendar .inputs div[data-v-af7232b4] {
  position: relative;
  flex: none; /* 防止输入框被拉伸变形 */
}

.calendar .inputs input[data-v-af7232b4],
.calendar .inputs select[data-v-af7232b4] {
  border: 1px solid #D7D9E0;
  box-sizing: border-box;
  padding: 7px;
  border-radius: 6px;
  line-height: 1;
  position: relative;
  background: #FFFFFF;
  width: 80px;
  margin: 5px; /* 增加间距 */
  text-align: center;
  font-size: 20px;
  outline: none
}

.calendar .inputs select[data-v-af7232b4] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none
}

div.source[data-v-c4b83598] {
  margin-top: 30px;
  color: #909399;
  font-size: 13px
}

div.source code[data-v-c4b83598] {
  background: #F0F2F5;
  padding: 3px;
  border-radius: 3px
}

div.source a[data-v-c4b83598] {
  color: #409eff;
  text-decoration: underline
}
