body {
    font-family: 'Arial', sans-serif;
    background-color: #f4f4f4;
    color: #333;
    line-height: 1.6;
    padding: 20px;
}

h2 {
    color: #333;
}

a {
  text-decoration: none;
}

form {
    background: #fff;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

input[type="text"], input[type="password"] {
    width: 100%;
    padding: 10px;
    margin: 10px 0;
    border-radius: 5px;
    border: 1px solid #ddd;
}

input[type="submit"] {
    display: block;
    width: 100%;
    padding: 10px;
    background-color: #5cb85c;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

input[type="submit"]:hover {
    background-color: #4cae4c;
}

#loadingMessage {
    /*color: #0066cc;*/
    margin: 20px 0;
}

/* 通用按钮样式 */
button, .button {
    padding: 10px 15px;
    margin-right: 10px;
    background-color: #007bff; /* 蓝色背景 */
    color: white; /* 白色文字 */
    border: none; /* 无边框 */
    border-radius: 5px; /* 边角圆滑 */
    cursor: pointer; /* 鼠标悬停时为手形光标 */
}

button:hover {
    background-color: #0056b3;
}

#result {
    background: #fff;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* 针对具有 .loading 类的按钮的样式 */
.loading-button {
    opacity: 0.5;
    cursor: default;
    pointer-events: none;
}

.loading-button:before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 0.5em;
    color: red;
    border: 1px solid red;
    border-radius: 50%;
    vertical-align: -10%;
    clip-path: polygon(0% 0%, 100% 0%, 100% 30%, 0% 30%);
    animation: rotate 1s linear infinite;
}

@keyframes rotate {
    from {
        transform: rotatez(0deg);
    }

    to {
        transform: rotatez(360deg);
    }
}

/* 翻页 */
.pagination {
    text-align: center;
}

/* 使用 CSS 来控制退出登录链接的位置 */
.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header a {
    margin-left: 10px; /* 调整超链接之间的距离 */
}

.label {
    padding-top: .3em;
    border-radius: 2px;
    font-weight: 300;
}

/* 应用于整个表格 */
table {
    border: 1px solid #ddd;
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;  /* 移除表格间的空隙 */
    width: 100%;                /* 表格宽度占页面宽度的80% */
}

/* 应用于表头 */
th {
    background-color: #f2f2f2;  /* 表头背景色 */
    color: black;              /* 表头文字颜色 */
    text-align: center;        /* 表头文字居中 */
    padding: 8px;              /* 内边距 */
}

/* 应用于表格的单元格 */
td {
    border: 1px solid #ddd;    /* 单元格边框 */
    padding: 8px;              /* 内边距 */
    text-align: center;        /* 文字居中 */
}

/* 悬停效果 */
tr:hover {background-color: #ddd;}

/* PAY */
.container {
    max-width: 500px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 10px;
    background-color: #f9f9f9;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    text-align: left;
}

.container h1 {
    color: #4CAF50; /* 成功为绿色，您可以根据实际情况调整 */
    margin-bottom: 20px;
    text-align: center;
}

.container h3 {
    color: #333;
    margin-bottom: 15px;
	text-align: center;
}

.container p {
    color: #666;
    line-height: 1.6;
    margin-left: 120px;
}

/* 如果验证失败 */
.container h1.fail {
    color: #F44336; /* 验证失败为红色 */
}

.ePay label {
  padding: 5px 10px;
  cursor: pointer;
  border: #CCCCCC solid 1px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  display: inline-block; /* 将label设置为内联块级元素 */
}

.ePay .checked {
  border: #33cabb solid 1px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #33cabb;
  background: #F1FCFA;
}

.ePay input[type="radio"] {
  display: none;
}

.reorder {
    display: flex;
    justify-content: space-between; /* 保证左右布局 */
    padding: 20px; /* 在容器内部添加一些填充 */
    gap: 20px; /* 在两个面板之间添加一些间距 */
}

.left-panel,
.right-panel {
    flex: 1; /* 使左右两个面板平等地占据可用空间 */
    background-color: white; /* 设置背景颜色为白色 */
    padding: 20px; /* 在面板内部添加填充，为内容提供空间 */
    border: 1px solid #ccc; /* 添加边框使面板更加明显 */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* 可选：添加一些阴影以提升视觉效果 */
    border-radius: 5px; /* 可选：添加圆角边框 */
}

textarea {
    width: 100%; /* 使文本域宽度充满其父容器 */
    background-color: #fff; /* 确保文本域的背景颜色为白色 */
    border: 1px solid #ccc; /* 添加边框使文本域更加明显 */
    height: 650px; /* 设置一个固定的高度 */
    padding: 10px; /* 在文本域内部添加一些填充 */
    box-sizing: border-box; /* 确保宽度和高度的计算包含了padding和border */
    margin-bottom: 10px; /* 在元素之间添加一些外边距 */
}

.line-count {
    color: #333; /* 设置文字颜色 */
    margin-top: 10px; /* 在元素上方添加一些外边距 */
}