/* ==================== 输入框和按钮同行布局 ==================== */

.input-with-button {
    display: flex;
    gap: 12px;
    align-items: center;
    /* 改为居中对齐，防止按钮被拉伸 */
}

.input-with-button input {
    flex: 1;
    min-width: 0;
    /* 防止flex子项溢出 */
    margin-bottom: 0 !important;
    /* 移除下边距 */
    padding: 12px 16px !important;
    /* 与搜索框一致 */
}

.input-with-button .btn,
.input-with-button button {
    flex-shrink: 0 !important;
    /* 按钮不缩小 */
    white-space: nowrap !important;
    /* 按钮文字不换行 */
    padding: 12px 24px !important;
    /* 与搜索按钮一致 */
    font-size: 1rem !important;
    /* 与输入框字体大小一致 */
    height: auto !important;
    /* 自动高度 */
    line-height: normal !important;
    /* 使用默认行高，与搜索按钮一致 */
    align-self: stretch !important;
    /* 让按钮与输入框等高 */
    min-height: 46px;
    /* 最小高度，与搜索按钮一致 */
}

/* 响应式:小屏幕下改为垂直布局 */
@media (max-width: 768px) {
    .input-with-button {
        flex-direction: column;
    }

    .input-with-button button {
        width: 100%;
    }
}