.dns-input-row { display: flex; gap: 10px; margin-bottom: 16px; }
.dns-input-row .input { flex: 1; }

/* 记录类型筛选 */
.dns-type-filter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 20px; }
.dns-filter-label { font-size: 14px; font-weight: 600; color: var(--text-muted); }
.dns-type-tag {
  display: inline-block; padding: 4px 12px; border-radius: 14px;
  font-size: 13px; font-weight: 600; cursor: pointer; user-select: none;
  background: var(--bg); border: 1px solid var(--border); color: var(--text-muted);
  transition: all 0.2s;
}
.dns-type-tag:hover { border-color: #0066ff; color: #0066ff; }
.dns-type-tag.active { background: #0066ff; border-color: #0066ff; color: #fff; }
.dns-type-tag-A.active { background: #0066ff; border-color: #0066ff; }
.dns-type-tag-AAAA.active { background: #9b59b6; border-color: #9b59b6; }
.dns-type-tag-CNAME.active { background: #e67e22; border-color: #e67e22; }
.dns-type-tag-MX.active { background: #27ae60; border-color: #27ae60; }
.dns-type-tag-NS.active { background: #2980b9; border-color: #2980b9; }
.dns-type-tag-TXT.active { background: #e74c3c; border-color: #e74c3c; }
.dns-type-tag-SOA.active { background: #7f8c8d; border-color: #7f8c8d; }

/* 结果区域 */
.dns-result { margin-top: 16px; }
.dns-meta {
  display: flex; flex-wrap: wrap; gap: 16px; padding: 12px 16px;
  background: var(--bg); border-radius: var(--radius); border: 1px solid var(--border);
  margin-bottom: 20px; font-size: 14px; color: var(--text-muted);
  min-width: 0;
}
.dns-meta-item { min-width: 0; overflow-wrap: break-word; word-break: break-all; }
.dns-meta strong { color: var(--text); }

/* 记录分组 */
.dns-record-group {
  margin-bottom: 16px; border: 1px solid var(--border); border-radius: var(--radius);
  overflow: hidden;
}
.dns-record-header {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 16px; background: var(--bg);
  border-bottom: 1px solid var(--border);
}
.dns-record-type {
  display: inline-block; padding: 2px 10px; border-radius: 4px;
  font-size: 12px; font-weight: 700; color: #fff; letter-spacing: 0.5px;
}
.dns-record-name { font-size: 14px; font-weight: 600; color: var(--text); }
.dns-record-count { font-size: 12px; color: var(--text-muted); margin-left: auto; }

/* 记录表格 */
.dns-record-table {
  width: 100%; border-collapse: collapse; font-size: 14px;
  table-layout: fixed;
}
.dns-record-table thead { background: var(--bg); }
.dns-record-table th {
  padding: 8px 16px; text-align: left; font-weight: 600;
  color: var(--text-muted); font-size: 12px; text-transform: uppercase;
  letter-spacing: 0.5px; border-bottom: 1px solid var(--border);
}
.dns-record-table th:nth-child(1) { width: 100px; }
.dns-record-table th:nth-child(2) { width: auto; }
.dns-record-table.mx-table th:nth-child(1) { width: 80px; }
.dns-record-table.mx-table th:nth-child(2) { width: 80px; }
.dns-record-table.mx-table th:nth-child(3) { width: auto; }
.dns-record-table td {
  padding: 10px 16px; border-bottom: 1px solid var(--border);
  overflow: hidden;
}
.dns-record-table tbody tr:last-child td { border-bottom: none; }
.dns-record-table tbody tr:hover { background: rgba(0, 102, 255, 0.03); }
.dns-ttl {
  font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
  font-size: 13px; color: var(--text-muted); white-space: nowrap;
}
.dns-mx-priority {
  font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
  font-size: 13px; color: #27ae60; font-weight: 600; white-space: nowrap;
}
.dns-value {
  font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
  font-size: 13px; color: var(--text); word-break: break-all; overflow-wrap: break-word;
}

/* 无记录提示 */
.dns-no-records {
  padding: 40px 16px; text-align: center; color: var(--text-muted);
  font-size: 14px; background: var(--bg); border-radius: var(--radius);
  border: 1px solid var(--border);
}

/* 错误提示 */
.dns-error {
  margin-top: 16px; padding: 14px 16px; background: #fff3f3;
  border: 1px solid #ffcccc; border-radius: var(--radius);
  color: #cc3333; font-size: 14px;
}

/* 响应式 */
@media (max-width: 768px) {
  .dns-meta { flex-direction: column; gap: 8px; }
  .dns-record-table th:nth-child(1),
  .dns-record-table td:nth-child(1) { min-width: 80px; }
}
@media (max-width: 480px) {
  .dns-input-row { flex-wrap: wrap; }
  .dns-type-filter { gap: 6px; }
  .dns-type-tag { padding: 3px 8px; font-size: 12px; }
}
