/**
 * API配置对话框样式
 * ===========================================
 * 为API绑定配置对话框提供样式支持
 */

/* 旋转动画 */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.api-config-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease;
}

.api-config-dialog.dialog-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.api-config-dialog .api-config-content {
    opacity: 0;
    transition: opacity 0.2s ease;
}

.api-config-dialog.dialog-visible .api-config-content {
    opacity: 1;
}

.api-config-content {
    background: var(--background-color, #ffffff);
    border: 1px solid var(--border-color, #ddd);
    border-radius: 8px;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    /* 改为内部滚动容器以便标题粘滞 */
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    color: var(--text-color, #333);
}

.api-config-content .dialog-header {
    padding: 20px 24px;
    border-bottom: 1px solid var(--border-color, #eee);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--header-background, #f8f9fa);
    /* 顶部标题固定 */
    position: sticky;
    top: 0;
    z-index: 2;
}

.api-config-content .dialog-header h2 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--text-color, #333);
}

.api-config-content .close-btn {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: var(--text-light, #666);
    padding: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: background-color 0.2s;
}

.api-config-content .close-btn:hover {
    background-color: var(--hover-background, #f0f0f0);
}

.api-config-content .dialog-body {
    padding: 24px;
    flex: 1;
    overflow: auto;
}

.api-config-content .form-section {
    margin-bottom: 20px;
}

.api-config-content .form-label {
    display: block;
    margin-bottom: 6px;
    font-weight: 500;
    color: var(--text-color, #333);
    font-size: 14px;
}

.api-config-content .form-input,
.api-config-content .form-select {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--border-color, #ddd);
    border-radius: 4px;
    font-size: 14px;
    background: var(--input-background, #ffffff);
    color: var(--text-color, #333);
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.api-config-content .form-input:focus,
.api-config-content .form-select:focus {
    outline: none;
    border-color: var(--primary-color, #007bff);
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.api-config-content .form-help {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: var(--text-light, #666);
    font-style: italic;
}

.api-config-content .binding-type-info {
    padding: 8px 12px;
    border-radius: 4px;
    background: var(--info-background, #f8f9fa);
    border: 1px solid var(--border-color, #ddd);
}

.api-config-content .binding-type {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}

.api-config-content .binding-type.condition {
    background: #e3f2fd;
    color: #1976d2;
}

.api-config-content .binding-type.action {
    background: #f3e5f5;
    color: #7b1fa2;
}

.api-config-content .parameters-container {
    border: 1px solid var(--border-color, #ddd);
    border-radius: 4px;
    padding: 12px;
    background: var(--input-background, #ffffff);
}

.api-config-content .parameter-row {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
    align-items: center;
}

.api-config-content .parameter-row:last-child {
    margin-bottom: 0;
}

.api-config-content .param-key,
.api-config-content .param-value {
    flex: 1;
    padding: 6px 8px;
    border: 1px solid var(--border-color, #ddd);
    border-radius: 4px;
    font-size: 13px;
    background: var(--input-background, #ffffff);
}

.api-config-content .remove-param-btn {
    width: 30px;
    height: 30px;
    border: 1px solid #dc3545;
    background: #dc3545;
    color: white;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s;
}

.api-config-content .remove-param-btn:hover {
    background: #c82333;
}


.api-config-content .dialog-footer {
    padding: 16px 24px;
    border-top: 1px solid var(--border-color, #eee);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    background: var(--footer-background, #f8f9fa);
}

.api-config-content .btn {
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.2s, transform 0.1s;
    min-width: 80px;
}

.api-config-content .btn:active {
    transform: translateY(1px);
}

.api-config-content .btn-primary {
    background: var(--primary-color, #007bff);
    color: white;
}

.api-config-content .btn-primary:hover {
    background: #0056b3;
}

.api-config-content .btn-secondary {
    background: var(--secondary-color, #6c757d);
    color: white;
}

.api-config-content .btn-secondary:hover {
    background: #545b62;
}

.api-config-content .btn-danger {
    background: #dc3545;
    color: white;
}

.api-config-content .btn-danger:hover {
    background: #c82333;
}

.api-config-content .btn-test-api {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: transparent;
    background-color: transparent;
    color: var(--primary-color, #007bff);
    font-weight: 600;
    letter-spacing: 0.5px;
    border: none;
    box-shadow: none;
    transition: color 0.15s ease;
}

.api-config-content .btn-test-api:hover {
    background: transparent;
    background-color: transparent;
    color: #0056b3;
    text-decoration: underline;
}

.api-config-content .btn-test-api:active {
    background: transparent;
    background-color: transparent;
    color: #0056b3;
}

.api-config-content .btn-test-api:focus,
.api-config-content .btn-test-api:focus-visible {
    background: transparent;
    background-color: transparent;
    color: var(--primary-color, #007bff);
    text-decoration: underline;
    outline: none;
    box-shadow: none;
}

.api-config-content .btn-test-icon {
    font-size: 14px;
    line-height: 1;
}

.api-config-content .btn-test-label {
    font-size: 14px;
}

.api-config-content .btn-text-link {
    background: transparent;
    color: var(--secondary-color, #6c757d);
    min-width: auto;
    padding: 0;
    font-size: 13px;
}

.api-config-content .btn-text-link:hover {
    background: transparent;
    text-decoration: underline;
}

.api-config-content .api-test-section {
    border-top: 1px solid var(--border-color, #eee);
    padding-top: 16px;
}

.api-config-content .api-test-controls {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.api-config-content .api-test-result {
    margin-top: 12px;
    padding: 12px;
    border-radius: 4px;
    background: var(--info-background, #f8f9fa);
    border: 1px solid var(--border-color, #e0e0e0);
}

.api-config-content .api-test-result .test-result {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    color: var(--text-color, #333);
}

.api-config-content .api-test-result .test-result-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.api-config-content .api-test-result .test-result strong {
    font-weight: 600;
}

.api-config-content .api-test-result .test-result.success {
    border-left: 3px solid #28a745;
    color: #155724;
}

.api-config-content .api-test-result .test-result.error {
    border-left: 3px solid #dc3545;
    color: #721c24;
}

.api-config-content .api-test-result .test-result.pending {
    border-left: 3px solid #ffc107;
    color: #8a6d3b;
}

.api-config-content .api-test-result .test-result.info {
    border-left: 3px solid var(--primary-color, #007bff);
}

.api-config-content .api-test-result .test-result.empty {
    border-left: 3px solid var(--border-color, #ddd);
    color: var(--text-light, #666);
}

.api-config-content .api-test-result .test-result-meta {
    font-size: 12px;
    color: var(--text-light, #666);
}

.api-config-content .api-test-result .test-result-detail {
    font-size: 12px;
    color: var(--text-light, #666);
    white-space: pre-wrap;
    word-break: break-word;
}

.api-config-content .api-test-log-container {
    margin-top: 12px;
    border: 1px solid var(--border-color, #ddd);
    border-radius: 4px;
    background: var(--input-background, #ffffff);
    max-height: 220px;
    overflow-y: auto;
}

.api-config-content .api-test-log {
    padding: 10px 12px;
    font-family: 'Fira Code', 'Courier New', monospace;
    font-size: 12px;
    line-height: 1.4;
}

.api-config-content .api-test-log .log-entry {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
    align-items: baseline;
}

.api-config-content .api-test-log .log-entry:last-child {
    margin-bottom: 0;
}

.api-config-content .api-test-log .log-timestamp {
    color: var(--text-light, #888);
    flex-shrink: 0;
}

.api-config-content .api-test-log .log-message {
    color: var(--text-color, #333);
    white-space: pre-wrap;
    word-break: break-word;
}

.api-config-content .api-test-log .log-entry.log-success .log-message {
    color: #1b5e20;
}

.api-config-content .api-test-log .log-entry.log-error .log-message {
    color: #b00020;
}

.api-config-content .api-test-log .log-entry.log-warning .log-message {
    color: #8a6d3b;
}

.api-config-content .api-test-log .log-entry.log-debug .log-message {
    color: #2b6cb0;
}

.api-config-content .api-test-log .log-entry.log-info .log-message {
    color: var(--text-color, #333);
}

.api-config-content .api-test-log .log-empty {
    color: var(--text-light, #888);
    font-style: italic;
}

/* 深色主题支持 */
[data-theme="dark"] .api-config-content {
    --background-color: #2d3748;
    --border-color: #4a5568;
    --text-color: #e2e8f0;
    --text-light: #a0aec0;
    --header-background: #1a202c;
    --footer-background: #1a202c;
    --input-background: #4a5568;
    --info-background: #2d3748;
    --section-background: #1a202c;
    --primary-color: #3182ce;
    --secondary-color: #718096;
    --hover-background: #4a5568;
}

[data-theme="dark"] .api-config-content .btn-test-api {
    background: transparent;
    background-color: transparent;
    color: var(--primary-color, #3182ce);
    box-shadow: none;
    border: none;
}

[data-theme="dark"] .api-config-content .btn-test-api:hover {
    background: transparent;
    background-color: transparent;
    color: #63b3ed;
    text-decoration: underline;
}

[data-theme="dark"] .api-config-content .btn-test-api:active {
    background: transparent;
    background-color: transparent;
    color: #4299e1;
    text-decoration: underline;
}

[data-theme="dark"] .api-config-content .btn-text-link {
    color: #a0aec0;
}

[data-theme="dark"] .api-config-content .api-test-result {
    background: #1a202c;
    border-color: #4a5568;
}

[data-theme="dark"] .api-config-content .api-test-result .test-result {
    color: #e2e8f0;
}

[data-theme="dark"] .api-config-content .api-test-result .test-result.empty {
    color: #a0aec0;
}

[data-theme="dark"] .api-config-content .api-test-result .test-result-meta,
[data-theme="dark"] .api-config-content .api-test-result .test-result-detail {
    color: #a0aec0;
}

[data-theme="dark"] .api-config-content .api-test-log-container {
    background: #1a202c;
    border-color: #4a5568;
}

[data-theme="dark"] .api-config-content .api-test-log .log-message {
    color: #e2e8f0;
}

[data-theme="dark"] .api-config-content .api-test-log .log-timestamp {
    color: #a0aec0;
}

[data-theme="dark"] .api-config-content .api-test-log .log-entry.log-success .log-message {
    color: #9ae6b4;
}

[data-theme="dark"] .api-config-content .api-test-log .log-entry.log-error .log-message {
    color: #feb2b2;
}

[data-theme="dark"] .api-config-content .api-test-log .log-entry.log-warning .log-message {
    color: #fbd38d;
}

[data-theme="dark"] .api-config-content .api-test-log .log-entry.log-debug .log-message {
    color: #90cdf4;
}

[data-theme="dark"] .api-config-content .api-test-log .log-empty {
    color: #718096;
}


/* API类型选择器优化样式 */
.api-config-content #api-condition-id,
.api-config-content #api-action-type {
    font-family: var(--app-font-family);
    line-height: 1.4;
}

.api-config-content #api-condition-id option,
.api-config-content #api-action-type option {
    padding: 10px 12px;
    background: var(--input-background, #ffffff);
    color: var(--text-color, #333);
    line-height: 1.5;
}

.api-config-content #api-condition-id option:hover,
.api-config-content #api-action-type option:hover {
    background: var(--hover-background, #f5f5f5);
}

/* 亮色主题下的选择器选项样式 */
[data-theme="light"] .api-config-content #api-condition-id option,
[data-theme="light"] .api-config-content #api-action-type option {
    background: #ffffff;
    color: #333333;
}

[data-theme="light"] .api-config-content #api-condition-id option:hover,
[data-theme="light"] .api-config-content #api-action-type option:hover {
    background: #f8f9fa;
}

/* 暗色主题下的选择器选项样式 */
[data-theme="dark"] .api-config-content #api-condition-id option,
[data-theme="dark"] .api-config-content #api-action-type option {
    background: #4a5568;
    color: #e2e8f0;
}

[data-theme="dark"] .api-config-content #api-condition-id option:hover,
[data-theme="dark"] .api-config-content #api-action-type option:hover {
    background: #2d3748;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .api-config-content {
        width: 95%;
        margin: 10px;
    }
    
    .api-config-content .dialog-header,
    .api-config-content .dialog-body,
    .api-config-content .dialog-footer {
        padding: 16px;
    }
    
    .api-config-content .parameter-row {
        flex-direction: column;
        align-items: stretch;
    }
    
    .api-config-content .remove-param-btn {
        align-self: flex-end;
        margin-top: 4px;
    }
    
    .api-config-content .dialog-footer {
        flex-direction: column;
    }
    
    .api-config-content .btn {
        width: 100%;
    }
}

/* 智能参数输入字段样式 */
.api-config-content .smart-parameter-field {
    margin-bottom: 16px;
    padding: 12px;
    border: 1px solid var(--border-color, #e0e0e0);
    border-radius: 6px;
    background: var(--input-background, #ffffff);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.api-config-content .smart-parameter-field:hover {
    border-color: var(--primary-color, #007bff);
}

.api-config-content .smart-parameter-field:focus-within {
    border-color: var(--primary-color, #007bff);
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.1);
}

.api-config-content .parameter-field-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.api-config-content .parameter-label {
    font-weight: 500;
    font-size: 14px;
    color: var(--text-color, #333);
    margin: 0;
}

.api-config-content .parameter-label.required {
    color: var(--danger-color, #dc3545);
}

.api-config-content .parameter-label.required::after {
    content: " *";
    color: var(--danger-color, #dc3545);
}

.api-config-content .parameter-type {
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 3px;
    background: var(--secondary-color, #6c757d);
    color: white;
    font-weight: 500;
    text-transform: uppercase;
}

.api-config-content .parameter-input-container {
    margin-bottom: 6px;
}

.api-config-content .parameter-description {
    font-size: 12px;
    color: var(--text-light, #666);
    line-height: 1.4;
    margin-top: 4px;
    font-style: italic;
}

.api-config-content .no-parameters-info {
    text-align: center;
    padding: 20px;
    color: var(--text-light, #666);
    font-style: italic;
    border: 1px dashed var(--border-color, #ddd);
    border-radius: 6px;
    background: var(--section-background, #f8f9fa);
}

/* 参数类型特定样式 */
.api-config-content .parameter-type.string {
    background: #17a2b8;
}

.api-config-content .parameter-type.number,
.api-config-content .parameter-type.integer {
    background: #28a745;
}

.api-config-content .parameter-type.boolean {
    background: #ffc107;
    color: #212529;
}

/* 深色主题下的智能参数字段 */
[data-theme="dark"] .api-config-content .smart-parameter-field {
    background: #1a202c;
    border-color: #4a5568;
}

[data-theme="dark"] .api-config-content .no-parameters-info {
    background: #1a202c;
    border-color: #4a5568;
    color: #a0aec0;
}

[data-theme="dark"] .api-config-content .parameter-description {
    color: #a0aec0;
}

/* 表单控件在智能参数字段中的样式 */
.api-config-content .smart-parameter-field .form-input,
.api-config-content .smart-parameter-field .form-select {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--border-color, #ddd);
    border-radius: 4px;
    font-size: 14px;
    background: var(--input-background, #ffffff);
    color: var(--text-color, #333);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.api-config-content .smart-parameter-field .form-input:focus,
.api-config-content .smart-parameter-field .form-select:focus {
    outline: none;
    border-color: var(--primary-color, #007bff);
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.1);
}

/* 响应式设计增强 */
@media (max-width: 768px) {
    .api-config-content .parameter-field-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
}

/* 参数验证错误状态样式 */
.api-config-content .smart-parameter-field.error {
    border-color: var(--danger-color, #dc3545);
    background: rgba(220, 53, 69, 0.05);
}

.api-config-content .smart-parameter-field.error .parameter-label {
    color: var(--danger-color, #dc3545);
}

.api-config-content .smart-parameter-field.error .form-input,
.api-config-content .smart-parameter-field.error .form-select {
    border-color: var(--danger-color, #dc3545);
}

.api-config-content .smart-parameter-field.error .form-input:focus,
.api-config-content .smart-parameter-field.error .form-select:focus {
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.1);
}

/* 深色主题下的错误状态 */
[data-theme="dark"] .api-config-content .smart-parameter-field.error {
    background: rgba(220, 53, 69, 0.1);
    border-color: #dc3545;
}

/* 飞机选择器样式 */
.api-config-content .aircraft-selector {
    max-width: none;
    border: 2px solid var(--primary-color-light, rgba(0, 123, 255, 0.2));
    background: var(--aircraft-selector-background, #f8f9ff);
}

/* 单位信息样式 */
.api-config-content .unit-info {
    font-size: 13px;
    font-family: 'Monaco', 'Menlo', 'Courier New', monospace;
}

.api-config-content .unit-name {
    font-weight: 600;
    color: var(--primary-color, #007bff);
}

.api-config-content .unit-status {
    font-style: italic;
    transition: color 0.2s ease;
}

.api-config-content .aircraft-selector-mode-toggle {
    margin-left: 8px;
}

.api-config-content .aircraft-selector-mode-toggle input[type="checkbox"] {
    margin: 0 4px 0 0;
    transform: scale(0.9);
}

.api-config-content .aircraft-source-select {
    font-size: 14px;
    height: 38px;
}

.api-config-content .aircraft-list-container {
    background: var(--aircraft-list-background, #ffffff);
    border: 1px solid var(--border-color-light, #e6e6e6);
    border-radius: 4px;
    max-height: 200px;
    overflow-y: auto;
    transition: all 0.2s ease;
}

.api-config-content .aircraft-list-container:hover {
    border-color: var(--primary-color-light, rgba(0, 123, 255, 0.3));
}

.api-config-content .aircraft-list-controls {
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-color, #ddd);
    background: var(--control-background, #f8f9fa);
    border-radius: 3px;
    padding: 6px 8px;
}

.api-config-content .select-all-aircraft {
    margin-right: 6px;
    transform: scale(0.9);
}

.api-config-content .aircraft-item {
    padding: 6px 8px;
    margin-bottom: 2px;
    border-radius: 3px;
    transition: background-color 0.2s;
}

.api-config-content .aircraft-item:hover {
    background-color: var(--hover-background, rgba(0, 123, 255, 0.05));
}

.api-config-content .aircraft-item label {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 13px;
    margin: 0;
    padding: 0;
}

.api-config-content .aircraft-checkbox {
    margin-right: 8px;
    transform: scale(0.9);
    cursor: pointer;
}

.api-config-content .aircraft-info {
    flex: 1;
    display: flex;
    align-items: center;
}

.api-config-content .aircraft-info strong {
    color: var(--text-color-primary, #333);
    font-weight: 500;
}

.api-config-content .aircraft-info span {
    color: var(--text-color-secondary, #666);
}

.api-config-content .aircraft-status {
    font-size: 11px;
    color: var(--text-color-muted, #999) !important;
    background: var(--status-background, rgba(108, 117, 125, 0.1));
    padding: 1px 4px;
    border-radius: 2px;
    margin-left: 8px !important;
}

.api-config-content .aircraft-manual-mode .form-help {
    font-size: 12px;
    color: var(--text-color-secondary, #666);
    margin-top: 4px;
    display: block;
}

.api-config-content .aircraft-manual-input {
    width: 100%;
    font-family: 'Monaco', 'Menlo', 'Courier New', monospace;
    font-size: 13px;
}

/* 加载状态样式 */
.api-config-content .loading-message {
    text-align: center;
    color: var(--text-color-secondary, #666);
    padding: 20px;
    font-style: italic;
}

/* 切换到手动输入按钮样式 */
.api-config-content .switch-to-manual-btn {
    background: var(--secondary-color, #6c757d);
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    transition: background-color 0.2s;
    display: block;
    margin: 8px auto 0;
}

.api-config-content .switch-to-manual-btn:hover {
    background: var(--secondary-color-hover, #545b62);
}

[data-theme="dark"] .api-config-content .switch-to-manual-btn {
    background: var(--secondary-color-dark, #495057);
}

[data-theme="dark"] .api-config-content .switch-to-manual-btn:hover {
    background: var(--secondary-color-dark-hover, #343a40);
}

/* 空状态样式 */
.api-config-content .aircraft-list-container:empty::after {
    content: "请先选择基地或舰船";
    display: block;
    text-align: center;
    color: var(--text-color-muted, #999);
    padding: 20px;
    font-style: italic;
}

/* 深色主题下的飞机选择器样式 */
[data-theme="dark"] .api-config-content .aircraft-selector {
    background: var(--aircraft-selector-background-dark, #2a2d3a);
    border-color: var(--primary-color-dark, rgba(13, 110, 253, 0.3));
}

[data-theme="dark"] .api-config-content .unit-info {
    background: var(--info-background-dark, #1a2332);
    border-color: var(--info-border-dark, #3c4043);
    color: var(--info-color-dark, #8ab4f8);
}

[data-theme="dark"] .api-config-content .unit-name {
    color: var(--primary-color-dark, #0d6efd);
}

[data-theme="dark"] .api-config-content .aircraft-list-container {
    background: var(--aircraft-list-background-dark, #1e2125);
    border-color: var(--border-color-dark, #495057);
}

[data-theme="dark"] .api-config-content .aircraft-list-controls {
    background: var(--control-background-dark, #343a40);
    border-color: var(--border-color-dark, #495057);
}

[data-theme="dark"] .api-config-content .aircraft-item:hover {
    background-color: var(--hover-background-dark, rgba(13, 110, 253, 0.1));
}

[data-theme="dark"] .api-config-content .aircraft-info strong {
    color: var(--text-color-primary-dark, #f8f9fa);
}

[data-theme="dark"] .api-config-content .aircraft-info span {
    color: var(--text-color-secondary-dark, #adb5bd);
}

[data-theme="dark"] .api-config-content .aircraft-status {
    background: var(--status-background-dark, rgba(173, 181, 189, 0.2));
    color: var(--text-color-muted-dark, #6c757d) !important;
}

/* 飞机选择操作按钮样式 */
.api-config-content .aircraft-selection-actions {
    border-top: 1px solid var(--border-color, #ddd);
    padding-top: 8px;
}

.api-config-content .aircraft-selection-actions .btn {
    font-size: 13px;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.api-config-content .aircraft-selection-actions .btn-secondary {
    background: var(--primary-color, #007bff);
    color: white;
    border-color: var(--primary-color, #007bff);
}

.api-config-content .aircraft-selection-actions .btn-secondary:hover {
    background: var(--primary-color-hover, #0056b3);
    border-color: var(--primary-color-hover, #0056b3);
}

.api-config-content .aircraft-selection-actions .btn-outline-secondary {
    background: transparent;
    color: var(--secondary-color, #6c757d);
    border-color: var(--secondary-color, #6c757d);
}

.api-config-content .aircraft-selection-actions .btn-outline-secondary:hover {
    background: var(--secondary-color, #6c757d);
    color: white;
}

/* 飞机选择摘要样式 */
.api-config-content .aircraft-selection-summary {
    border-radius: 4px;
    transition: all 0.2s ease;
}

.api-config-content .aircraft-selection-summary button {
    transition: all 0.2s ease;
    cursor: pointer;
}

.api-config-content .aircraft-selection-summary button:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.api-config-content .aircraft-summary-list {
    max-height: 100px;
    overflow-y: auto;
    font-family: 'Monaco', 'Menlo', 'Courier New', monospace;
}

/* 深色主题下的选择摘要样式 */
[data-theme="dark"] .api-config-content .aircraft-selection-summary {
    background: var(--success-background-dark, #1e4620);
    border-color: var(--success-border-dark, #2d5930);
}

[data-theme="dark"] .api-config-content .aircraft-selection-actions {
    border-color: var(--border-color-dark, #495057);
}

[data-theme="dark"] .api-config-content .aircraft-selection-actions .btn-secondary {
    background: var(--primary-color-dark, #0d6efd);
    border-color: var(--primary-color-dark, #0d6efd);
}

[data-theme="dark"] .api-config-content .aircraft-selection-actions .btn-outline-secondary {
    color: var(--secondary-color-dark, #adb5bd);
    border-color: var(--secondary-color-dark, #495057);
}

/* 响应式设计 */
@media (max-width: 768px) {
    .api-config-content .aircraft-selector {
        padding: 8px;
    }
    
    .api-config-content .aircraft-list-container {
        max-height: 150px;
    }
    
    .api-config-content .aircraft-item label {
        font-size: 12px;
    }
    
    .api-config-content .aircraft-selector-mode-toggle label {
        font-size: 11px;
    }
    
    .api-config-content .aircraft-selection-actions .btn {
        font-size: 12px;
        padding: 4px 8px;
    }
    
    .api-config-content .aircraft-selection-summary {
        font-size: 12px;
    }
}