/* Database Management Module - Theme-Aware Styling */ /* Modal Styling with Theme Support */ #confirmTruncateModal .modal-content { background-color: var(--bg-primary); border-color: var(--border-color); border-radius: 8px; box-shadow: 0 10px 40px var(--card-shadow-hover); } #confirmTruncateModal .modal-header { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); border-bottom-color: var(--border-color); border-radius: 8px 8px 0 0; } #confirmTruncateModal .modal-header h5 { color: white; margin: 0; font-weight: 600; } #confirmTruncateModal .modal-body { color: var(--text-primary); padding: 20px; } #confirmTruncateModal .modal-body p { color: var(--text-primary); } #confirmTruncateModal .modal-body strong { font-weight: 600; } /* Table name display box */ #confirmTruncateModal .table-name-box { background-color: var(--bg-secondary); border: 2px solid #ef4444; border-radius: 6px; padding: 15px; margin: 15px 0; } #confirmTruncateModal .table-name-box strong { color: #ef4444; font-size: 1.1em; word-break: break-all; } /* Warning alert */ #confirmTruncateModal .warning-alert { background-color: rgba(239, 68, 68, 0.1); border: 1px solid #ef4444; border-radius: 6px; padding: 12px 15px; margin: 15px 0; color: var(--text-primary); } #confirmTruncateModal .warning-alert i { color: #ef4444; margin-right: 8px; } /* Input field styling */ #confirmTruncateModal #confirm-table-input { background-color: var(--input-bg); border: 1px solid var(--input-border); color: var(--text-primary); border-radius: 6px; padding: 10px 12px; font-size: 14px; transition: border-color 0.3s ease, box-shadow 0.3s ease; } #confirmTruncateModal #confirm-table-input:focus { background-color: var(--input-bg); border-color: #ef4444; color: var(--text-primary); box-shadow: 0 0 0 0.2rem rgba(239, 68, 68, 0.15); outline: none; } #confirmTruncateModal #confirm-table-input::placeholder { color: var(--text-secondary); opacity: 0.7; } /* Modal footer */ #confirmTruncateModal .modal-footer { background-color: var(--bg-secondary); border-top: 1px solid var(--border-color); border-radius: 0 0 8px 8px; padding: 15px 20px; } /* Cancel button */ #confirmTruncateModal .btn-secondary { background-color: var(--bg-tertiary); color: var(--text-primary); border-color: var(--border-color); transition: all 0.3s ease; } #confirmTruncateModal .btn-secondary:hover:not(:disabled) { background-color: var(--border-color); color: var(--text-primary); } /* Delete button */ #confirmTruncateModal .btn-danger { background-color: #ef4444; border-color: #dc2626; color: white; font-weight: 600; transition: all 0.3s ease; } #confirmTruncateModal .btn-danger:hover:not(:disabled) { background-color: #dc2626; border-color: #b91c1c; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3); } #confirmTruncateModal .btn-danger:disabled { background-color: #9ca3af; border-color: #6b7280; cursor: not-allowed; opacity: 0.6; } /* Modal backdrop */ .modal-backdrop.show { background-color: rgba(0, 0, 0, 0.5); } /* Help text styling */ #confirmTruncateModal .text-muted { color: var(--text-secondary) !important; font-size: 0.85em; } /* Label styling */ #confirmTruncateModal .modal-body > p:first-of-type { font-size: 0.95em; } /* Dark mode specific adjustments */ [data-theme="dark"] #confirmTruncateModal .modal-body strong { color: #ef4444; } [data-theme="dark"] #confirmTruncateModal .table-name-box strong { color: #ff6b6b; } [data-theme="dark"] #confirmTruncateModal .warning-alert { background-color: rgba(239, 68, 68, 0.2); } [data-theme="dark"] #confirmTruncateModal #confirm-table-input:focus { background-color: var(--input-bg); border-color: #ff6b6b; box-shadow: 0 0 0 0.2rem rgba(255, 107, 107, 0.15); }