- Renamed 'modal' class to 'settings-modal' to avoid conflict with components.css
- components.css has .modal { display: flex } which was overriding display: none
- Added !important to ensure settings-modal styles take precedence
- Updated all modal references in HTML and JavaScript
- Converted all dialog elements to regular divs
- Using CSS class 'open' instead of native dialog open attribute
- Added openModal() and closeModal() functions
- Simplified modal CSS and JavaScript
- Modals now fully controlled via class toggle
- Added immediate modal close on script load
- Force close all modals on DOMContentLoaded
- Remove open attribute from all modals during initialization
- Added HTMX afterRequest handler to prevent multiple modals from staying open
- Fixed script syntax issue
- Added closeAllModals() function to close all open modals before opening a new one
- Added event.stopPropagation() to modal trigger buttons
- Added click-outside-to-close behavior for modals
- Added Escape key handler to close modals
- Prevented click events inside modal-content from bubbling up
- Changed apps-dropdown right position from 60px to 0 in app.css
- Wrapped apps button and dropdown in a container with position:relative
- Moved dropdown to be a sibling of the button inside the container
- Removed duplicate dropdown from header-right section
