From 121d79d8385a5b813fa5f7820da4b8d7b48e4d44 Mon Sep 17 00:00:00 2001
From: Russell Ballestrini <russell.ballestrini@gmail.com>
Date: Wed, 9 Jul 2025 16:00:25 -0400
Subject: [PATCH] fix: add !important to PicoCSS overrides to force proper
 modal sizing

---
 src/uncloseai-modal-pico.css | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/uncloseai-modal-pico.css b/src/uncloseai-modal-pico.css
index 972a53a..355ccba 100644
--- a/src/uncloseai-modal-pico.css
+++ b/src/uncloseai-modal-pico.css
@@ -1,21 +1,21 @@
 /* UncloseAI Modal - PicoCSS Override Styles */
 
 /* Override PicoCSS dialog styles with higher specificity */
-dialog#uncloseai-embedded-modal {
+dialog#uncloseai-embedded-modal[data-theme] {
   /* Override PicoCSS positioning that sets top:0, left:0, right:0, bottom:0 */
-  position: fixed;
-  top: 50%;
-  left: 50%;
-  right: auto;
-  bottom: auto;
-  transform: translate(-50%, -50%);
+  position: fixed !important;
+  top: 50% !important;
+  left: 50% !important;
+  right: auto !important;
+  bottom: auto !important;
+  transform: translate(-50%, -50%) !important;
   
   /* Override PicoCSS sizing that sets min-width:100%, min-height:100% */
-  width: 70vw;
-  max-width: 800px;
-  height: 90vh;
-  min-width: auto;
-  min-height: auto;
+  width: 70vw !important;
+  max-width: 800px !important;
+  height: 90vh !important;
+  min-width: auto !important;
+  min-height: auto !important;
   
   /* Override PicoCSS defaults */
   margin: 0;
@@ -35,7 +35,7 @@ dialog#uncloseai-embedded-modal {
 
 /* Mobile full-screen - override PicoCSS for small screens */
 @media (max-width: 480px) {
-  dialog#uncloseai-embedded-modal {
+  dialog#uncloseai-embedded-modal[data-theme] {
     top: 0;
     left: 0;
     right: 0;