/* 整体居中 */
body {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 70vh;
    margin: 0;
    padding: 0 10px; /* 在手机页面两边留有 10px 的边距 */
    box-sizing: border-box; /* 让 padding 不会影响元素的宽度 */
}

/* 包裹输入框和按钮的容器 */
.container {
    text-align: center;
}

/* 输入框样式 */
input[type="text"] {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-bottom: 10px; /* 在查询框下方留出一定的空间 */
    width: 100%; /* 输入框宽度自适应父容器 */
   /* max-width: 400px; /* 设置输入框最大宽度为 400px */
    box-sizing: border-box; /* 让 padding 不会影响元素的宽度 */
}

/* 查询按钮样式 */
button[type="submit"] {
    /*padding: 10px 30px;*/
    width: 100%;
    line-height: 25px;
    background-color: #007bff;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

button[type="submit"]:hover {
    background-color: #0056b3;
}

/* 查询次数文字样式 */
.query-info {
    margin-bottom: 20px; /* 在查询框下方留出更大的空间 */
}

/* 媒体查询，当屏幕宽度小于等于 768px 时应用以下样式 */
@media screen and (max-width: 768px) {
    /* 重新设置输入框和按钮的样式 */
    input[type="text"] {
        max-width: none; /* 取消输入框的最大宽度限制 */
    }

    /* 重新设置查询按钮样式 */
    button[type="submit"] {
        width: 100%; /* 按钮宽度占据父容器的宽度 */
    }
}

        .container {
            display: flex;
            flex-direction: column;
        }
        .result {
            margin-top: 10px;
            border: 1px solid #ccc;
            padding: 10px;
        }
        .btn {
            margin-top: 10px;
            padding: 5px 10px;
            border: none;
            background-color: #007bff;
            color: #fff;
            text-decoration: none; 
            cursor: pointer;
        }
        .btn:hover {
            background-color: #0056b3;
        }
        #copyCommandBtn {
            margin-top: 10px;
        }
        
             /* 样式表中添加底部版权信息的样式 */
        .footer {
            background-color: #ffffff; /* 白色背景 */
            height: 70px; /* 高度为20px */
            text-align: center; /* 文字居中 */
            line-height: 20px; /* 行高等于高度，使文字垂直居中 */
            position: fixed; /* 固定在页面底部 */
            bottom: 0; /* 距离页面底部0px */
            left: 0; /* 距离页面左侧0px */
            width: 100%; /* 宽度100% */
            color: #000000; /* 文字颜色为黑色 */
            text-decoration:none;  
        } 
           /* 控制 h4 标签的上下间距 */
        h4 {
            margin-top: 20px; /* 上间距为20px */
            margin-bottom: 20px; /* 下间距为20px */
        }