.article {
          max-width: 1000px;
          margin: 0 auto;
          padding: 20px;
          background: #fff;
          box-shadow: 0 2px 10px rgba(0,0,0,0.1);
          border-radius: 8px;
        }
        
        h2 {
          text-align: center;
          color: #333;
          margin-bottom: 30px;
          font-size: 24px;
        }
        
        .line {
          margin: 15px 0;
          display: flex;
          align-items: center;
        }
        
        .line label {
          width: 100px;
          text-align: right;
          padding-right: 15px;
          color: #666;
        }
        
        .line input, .line select {
          padding: 8px 12px;
          border: 1px solid #ddd;
          border-radius: 4px;
          width: 200px;
          font-size: 14px;
        }
        
        .line input:focus, .line select:focus {
          border-color: #4a90e2;
          outline: none;
          box-shadow: 0 0 5px rgba(74,144,226,0.3);
        }
        
        .line .title {
          margin-top: 30px;
          margin-bottom: 15px;
          color: #333;
          font-weight: bold;
        }
        
        table {
          width: 100%;
          border-collapse: collapse;
          margin: 20px 0;
        }
        
        td {
          border: 1px solid #ddd;
          padding: 8px;
          text-align: center;
          font-size: 14px;
        }
        
        td.active {
          background: #ffd700;
          cursor: pointer;
        }
        
        #result table {
          background: #f9f9f9;
        }
        
        #result td:first-child {
          background: #f0f0f0;
          font-weight: bold;
        }
        
        ul {
          list-style: none;
          padding: 0;
        }
        
        ul li {
          margin: 10px 0;
          color: #666;
        }
        
        .note {
          color: #999;
          font-size: 12px;
          margin-top: 20px;
          text-align: center;
        }
        
        .input-group {
          display: flex;
          align-items: center;
          gap: 15px;
          margin: 15px 0;
        }
        
        .input-group .input-item {
          display: flex;
          align-items: center;
        }
        
        .input-group label {
          white-space: nowrap;
          margin-right: 5px;
          color: #666;
        }
        
        .input-group input {
          width: 60px;
          padding: 8px;
          border: 1px solid #ddd;
          border-radius: 4px;
        }
/* 分隔符样式 */
        .birth-datetime-group {
          display: flex;
          align-items: center;
          gap: 8px;
        }

        .birth-datetime-group label {
          white-space: nowrap;
          margin-right: 4px;
        }

        .birth-datetime-group .datetime-picker {
          min-width: 130px;
        }

        .datetime-separator {
          color: #ccc;
          font-weight: 300;
          user-select: none;
        }
 /* 时间选择器选中状态 */
        #birth_date::-webkit-datetime-edit-day-field,
        #birth_date::-webkit-datetime-edit-month-field,
        #birth_date::-webkit-datetime-edit-year-field,
        #birth_time::-webkit-datetime-edit-hour-field,
        #birth_time::-webkit-datetime-edit-minute-field {
            background-color: #BA8117 !important;
            color: #fff !important;
            border-radius: 3px;
            padding: 2px 4px;
        }

        #birth_date::-webkit-datetime-edit-day-field:focus,
        #birth_date::-webkit-datetime-edit-month-field:focus,
        #birth_date::-webkit-datetime-edit-year-field:focus,
        #birth_time::-webkit-datetime-edit-hour-field:focus,
        #birth_time::-webkit-datetime-edit-minute-field:focus {
            background-color: #916512 !important;
            outline: none;
        }
 /* 修改主容器宽度 */
    .article {
      max-width: 1200px;  /* 增加容器宽度 */
    }
    
    /* 修改表格样式 */
    .main-table {
      width: 100%;
      table-layout: fixed;  /* 固定表格布局 */
    }
    
    .main-table td {
      min-width: 150px;    /* 增加单元格最小宽度 */
      padding: 15px 10px;  /* 增加内边距 */
    }
    
    /* 修改信息显示样式 */
    #result {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    
    #result ul {
      display: flex;
      flex-wrap: wrap;
      gap: 15px;
      padding: 15px;
      margin-top: 20px;
      background: #f8f9fa;
      border-radius: 4px;
    }
    
    #result ul li {
      flex: 1 1 auto;
      min-width: 200px;
      margin: 5px 0;
      padding: 0;
      white-space: nowrap;
    }
.button-group {
    display: flex;
    gap: 20px;
    justify-content: center;
    margin: 20px 0;
}

.print-button, .pdf-button {
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s;
}

.print-button {
    background-color: #28a745;
    color: white;
}

.print-button:hover {
    background-color: #218838;
}

.pdf-button {
    background-color: #4a90e2;
    color: white;
}

.pdf-button:hover {
    background-color: #357abd;
}

@media print {
    body * {
        visibility: hidden;
    }
    .article, .article * {
        visibility: visible;
    }
    .article {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
    }
    .button-group {
        display: none;
    }
}

/* 时间选择器样式 */
#birth_date, #birth_time {
    padding: 10px 14px !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    background: #fff !important;
}

#birth_date:focus, #birth_time:focus {
    border-color: #916512 !important;
    outline: none;
    box-shadow: 0 0 5px rgba(145,101,18,0.3) !important;
}

#birth_time {
    width: 100px;
}

/* 加载动画 */
@keyframes spin {
    to { transform: rotate(360deg); }
}
