.tableberg-ai-table-settings { margin-top: 2rem; } .tableberg-ai-settings-content { display: flex; flex-direction: column; gap: 1.5rem; } .tableberg-api-key-field { display: flex; flex-direction: column; gap: 0.5rem; } .tableberg-api-key-field label { font-weight: 600; color: #1e1e1e; } .tableberg-api-key-input-wrapper { display: flex; gap: 0.5rem; align-items: center; } .tableberg-api-key-input { flex: 1; padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; font-family: monospace; font-size: 14px; } .tableberg-api-key-input:focus { outline: none; border-color: #007cba; box-shadow: 0 0 0 1px #007cba; } .tableberg-toggle-visibility { padding: 6px 12px; background: #f0f0f0; border: 1px solid #ddd; border-radius: 4px; cursor: pointer; font-size: 12px; transition: background 0.2s; } .tableberg-toggle-visibility:hover { background: #e0e0e0; } .tableberg-help-text { font-size: 13px; color: #757575; margin: 0; } .tableberg-help-text a { color: #007cba; text-decoration: none; } .tableberg-help-text a:hover { text-decoration: underline; } .tableberg-test-status { padding: 12px; border-radius: 4px; font-size: 14px; } .tableberg-test-status.success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; } .tableberg-test-status.error { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; } .tableberg-ai-settings-actions { display: flex; gap: 1rem; margin-top: 0.5rem; } .tableberg-button { padding: 8px 16px; border: none; border-radius: 4px; font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s; } .tableberg-button:disabled { opacity: 0.6; cursor: not-allowed; } .tableberg-button-primary { background: #007cba; color: white; } .tableberg-button-primary:hover:not(:disabled) { background: #005a87; } .tableberg-button-secondary { background: #f0f0f0; color: #1e1e1e; border: 1px solid #ddd; } .tableberg-button-secondary:hover:not(:disabled) { background: #e0e0e0; } .tableberg-pro-notice { text-align: center; padding: 3rem 2rem; background: #f8f9fa; border-radius: 8px; margin: 2rem auto; max-width: 600px; } .tableberg-pro-notice h3 { font-size: 1.5rem; margin-bottom: 1rem; color: #1e1e1e; } .tableberg-pro-notice p { font-size: 1rem; color: #757575; margin-bottom: 1.5rem; line-height: 1.6; } .tableberg-pro-notice .tableberg-button { display: inline-block; text-decoration: none; }