﻿/* 全局链接样式 */
a,
a:focus,
a:hover {
  color: #fff;
}

/* 自定义默认按钮 */
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
  color: #000000;
  text-shadow: none;
  background-color: #fff;
  border: .1rem solid #fff;
}

html,
body {
  height: 100%;
  background-image: url('../images/BG.png');
}

body {
  display: flex;
  color: #64E7F9FF;
  box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
}

.cover-container {
  max-width: 100%;
}

/* 页眉样式 */
.masthead {
  margin-bottom: 2rem;
}

.masthead-brand {
  margin-bottom: 0;
}

.nav-masthead .nav-link {
  padding: .25rem 0;
  font-weight: 700;
  color: rgba(255, 255, 255, .5);
  background-color: transparent;
  border-bottom: .25rem solid transparent;
}

.nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus {
  border-bottom-color: rgba(255, 255, 255, .25);
}

.nav-masthead .nav-link + .nav-link {
  margin-left: 1rem;
}

.nav-masthead .active {
  color: #fff;
  border-bottom-color: #fff;
}

@media (min-width: 48em) {
  .masthead-brand {
    float: left;
  }
  .nav-masthead {
    float: right;
  }
}

/* 移动端结构调整 */
header, main, footer {
  display: block;
}

@media screen and (max-width: 1838px) {
  header, footer {
    display: none;
  }
}

/* 封面区域样式 */
.cover {
  padding: 0 1.5rem;
}
.cover .btn-lg {
  padding: .75rem 1.25rem;
  font-weight: 700;
}

/* 页脚样式 */
.mastfoot {
  color: rgba(255, 255, 255, .5);
}

/* 自定义边框和容器样式 */
.box {
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;
}

/* 主题颜色变量 */
:root {
  --color-deep-blue: rgba(10, 68, 89, 0.613);
  --color-light-blue: rgba(10, 68, 89, 0.594);
  --color-btn-blue: rgba(10, 68, 89, 0.483);
}

/* 表格头部样式 */
.layui-table th {
  background-color: var(--color-deep-blue);
}

/* 表格偶数行样式 */
.layui-table[lay-even] tbody tr:nth-child(even) {
  background-color: var(--color-deep-blue);
}

/* 表格奇数行样式 */
.layui-table[lay-even] tbody tr:nth-child(odd) {
  background-color: var(--color-light-blue);
}

/* 表格底部和工具栏背景色 */
.layui-table-mend,
.layui-table-init,
.layui-table-page,
.layui-table-tool,
.layui-table-edit {
  background-color: #00000032;
}

/* 斜边框样式 */
.angled-border {
  position: relative;
  border: 2px solid #4ba2ff;
  padding: 10px;
  width: 200px;
  height: 200px;
  background: #297efb;
}

.angled-border:before,
.angled-border:after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  background: inherit;
}

.angled-border:before {
  top: -1px;
  left: -1px;
  clip-path: polygon(0 0, 100% 0, 0 100%);
}

.angled-border:after {
  bottom: -1px;
  left: -1px;
  clip-path: polygon(0 0, 0 100%, 100% 0);
}

/* 自定义滚动条 */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-thumb {
  background: #47b0bec3;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #02ffea82;
}

::-webkit-scrollbar-corner {
  background:#64E7F9FF;
}

/* 自定义列宽布局 */
.custom-col-6 {
  flex: 0 0 auto;
  width: 13%;
}

.custom-col-18 {
  margin-left: 1%;
  flex: 0 0 auto;
  width: 86%;
}

.layui-form{
  margin-bottom: 1em;
}

/* 输入框样式 */
.layui-input,
.layui-select,
.layui-textarea {
  background-color: #000000;
  color: var(--lay-color-text-2);
  border: .1rem solid #000000;
}


.btn-sm {
    background-color: #000000;        /* 纯黑色填充 */
    border: 1px solid #64E7F9FF;     /* 边框颜色 #64E7F9FF */
    color: #64E7F9FF;                /* 文字颜色与边框呼应 */
    
    /* SM 尺寸专属内边距和字体 */
    padding: 6px 8px;               /* 上下6px，左右16px → 小巧精致 */
    font-size: 0.75rem;              /* 小号字体 */
    font-weight: 600;
    margin-left: 10px;              /* 按钮间距 */
    border-radius: 5px;              /* 圆润小胶囊 */
    cursor: pointer;
    transition: all 0.2s ease;
    letter-spacing: 0.3px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    white-space: nowrap;              /* 防止文字折行 */
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
/* 鼠标悬浮效果：轻微放大+光晕+文字变亮 */
.btn-sm:hover {
    transform: scale(1.04);           /* 悬浮轻微放大 */
    background-color: #000000;        /* 保持纯黑填充不变 */
    border-color: #8ef3ff;            /* 边框提亮 */
    color: #ffffff;                   /* 文字变白 */
    box-shadow: 0 0 10px rgba(100,231,249,0.6), 0 4px 10px rgba(0,0,0,0.4);
}
/* 点击效果：轻微缩小+内阴影+边框高亮爆发 */
.btn-sm:active {
    transform: scale(0.96);            /* 点击缩小 */
    background-color: #080808;         /* 几乎纯黑，微微体现按压 */
    border-color: #c0fbff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5), inset 0 1px 1px rgba(0,0,0,0.3), 0 0 8px #64E7F9FF;
    transition: all 0.05s linear;
}
/* 聚焦时保持可访问性 */
.btn-sm:focus-visible {
    outline: 2px solid #64E7F9FF;
    outline-offset: 2px;
}


/* 终极覆盖方案 - 针对所有可能产生绿色的场景 */
.layui-form-radio.checked span,
.layui-form-radioed span,
.layui-form-radio span:hover,
.layui-form-radio.checked .layui-form-radio-text,
.layui-radioed .layui-form-radio-text,
.layui-form-radio:hover .layui-form-radio-text {
    color: #64E7F9FF !important;
}

/* 同时确保圆点正常 */
.layui-form-radio.checked i,
.layui-form-radio i:hover {
    color: #64E7F9FF !important;
}


/* 选中状态（核心） */
.layui-form-radioed,
.layui-form-radioed > i,
.layui-form-radioed > * {
    color: #64E7F9 !important;
    border-color: #64E7F9 !important;
}

/* hover 状态 */
.layui-form-radio:hover *,
.layui-form-radio:hover i {
    color: #64E7F9 !important;
}

/* 未选中圆点 hover（外圈） */
.layui-form-radio:hover i {
    border-color: #64E7F9 !important;
}

/* 强制小圆点颜色（选中时内部点） */
.layui-form-radioed i:after {
    background-color: #64E7F9 !important;
}