﻿/* 手机优先 */
html { font-size: 14px; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; background: #f5f5f5; }

.container { max-width: 90%; margin: 0 auto; padding: 10px; }
h5 { margin: 10px 0 15px; font-weight: 500; }

/* 输入区 */
.input-group { display: flex; }
.input-group .form-control { flex: 1 1 auto; padding: 8px 10px; border: 1px solid #ced4da; border-radius: 4px 0 0 4px; font-size: 1rem; }

.input-group .yzm { width: 250px; padding: 2px 10px 2px 10px; margin-left: 3px; margin-right: 3px; border: 1px solid #ced4da; border-radius: 4px 0 0 4px; font-size: 1rem; }
.input-group select { padding: 2px 10px 2px 10px; margin-right: 3px; border: 1px solid #ced4da; border-radius: 4px 0 0 4px; font-size: 1rem; }


.input-group .btn { padding: 8px 80px; border: 1px solid #007bff; background: #007bff; color: #fff; border-radius: 0 4px 4px 0; cursor: pointer; }
.input-group .btn:active { background: #0056b3; }

/* 结果表格 */
.table-responsive { margin-top: 15px; overflow-x: auto; -webkit-overflow-scrolling: touch; background: #fff; border-radius: 4px; box-shadow: 0 1px 3px rgba(0,0,0,.1); }
.table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.table th, .table td { padding: 8px 6px; border: 1px solid #dee2e6; white-space: nowrap; text-align: center; }
.table th { background: #f8f9fa; font-weight: 600; }

/* 空提示 */
.alert { padding: 10px 15px; border-radius: 4px; margin-top: 15px; }
.alert-warning { color: #856404; background: #fff3cd; border: 1px solid #ffeeba; }

/* 小屏优化 */
@media (max-width: 576px) {
    .table th, .table td { padding: 6px 4px; font-size: .8125rem; text-align: center; }
    .input-group .form-control { font-size: 16px; }
    /* 防止 iOS 自动放大 */
}


.table-header { background-color: #f8f9fa; font-weight: bold; text-align: center; }

.pair-label { width: 12%; text-align: right; padding-right: 10px; vertical-align: middle; font-weight: 600; background: #f8f9fa; }

.pair-value { width: 18%; text-align: left; padding-left: 10px; vertical-align: middle; }

.result-container { margin-top: 20px; }

.no-data-message { display: none; padding: 15px; background-color: #f8f9fa; border-radius: 4px; margin-top: 20px; color: #6c757d; }