npm - alert90s - Versions diffs - 1.0.11 → 1.0.13 - Mend

alert90s 1.0.11 → 1.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/README.md CHANGED Viewed

@@ -122,6 +122,73 @@ Alert90s.fire({
 });
 ```
+### 6. Loading Animations
+```javascript
+// Segmented Progress Bar (NEW)
+Alert90s.fire({
+  title: "LOADING ASSETS...",
+  loaderType: "segmented",
+  didOpen: () => Alert90s.showLoading(),
+});
+setTimeout(() => Alert90s.hideLoading(), 7000);
+// Other loaderTypes: 'hourglass', 'ascii', 'blinking', 'progress'
+Alert90s.fire({
+  title: "DOWNLOADING...",
+  loaderType: "hourglass",
+  didOpen: () => Alert90s.showLoading(),
+});
+```
+### 7. Theme Switcher
+Alert90s includes a built-in Neo-Brutalist theme toggle you can render anywhere:
+```javascript
+Alert90s.renderThemeToggle("#my-container", {
+  width: "120px",
+  onChange: (isDark) => {
+    console.log("Dark mode:", isDark);
+  },
+});
+```
+### 8. Input Types (Checkbox, Toggle, Select, Radio)
+Alert90s supports rich form inputs inside modals. The checkbox uses a **SVG Brutalist** design with animated checkmark draw-on and shake effect.
+```javascript
+// SVG Brutalist Checkbox
+Alert90s.fire({
+  title: "TERMS OF SERVICE",
+  input: "checkbox",
+  inputPlaceholder: "I ACCEPT THE TERMS",
+}).then((result) => {
+  if (result.isConfirmed) {
+    Alert90s.fire("Accepted: " + result.value, "", "success");
+  }
+});
+// Toggle Switch
+Alert90s.fire({
+  title: "DARK MODE",
+  input: "toggle",
+  inputPlaceholder: "Enable dark mode",
+});
+// Select Dropdown
+Alert90s.fire({
+  title: "CHOOSE WEAPON",
+  input: "select",
+  inputOptions: {
+    bfg: "BFG 9000",
+    plasma: "Plasma Rifle",
+    shotgun: "Super Shotgun",
+  },
+});
+```
 ## CSS-only Buttons
 Alert90s also ships with a standalone CSS button library. Just add the classes to your own `<button>` or `<a>` elements for an instant neo-brutalist feel!
@@ -174,34 +241,35 @@ If you'd like to collaborate or just say hi, visit my [Portfolio Website](https:
 ## Advanced Options
-| Option            | Type     | Default     | Description                                                                                               |
-| ----------------- | -------- | ----------- | --------------------------------------------------------------------------------------------------------- |
-| background        | String   | ''          | Custom background color for the modal.                                                                    |
-| color             | String   | ''          | Custom text color for the modal body.                                                                     |
-| titleColor        | String   | ''          | Custom title color.                                                                                       |
-| iconColor         | String   | ''          | Custom icon color (including SVG stroke).                                                                 |
-| title             | String   | ''          | The title of the alert. Supports HTML.                                                                    |
-| text/message      | String   | ''          | The message body of the alert.                                                                            |
-| html              | String   | ''          | A custom HTML description for the alert.                                                                  |
-| icon              | String   | ''          | Standard icons: `warning`, `error`, `info`, `success`, `question`                                         |
-| iconHtml          | String   | ''          | Custom HTML string for the icon.                                                                          |
-| footer            | String   | ''          | Custom HTML for the footer section.                                                                       |
-| imageUrl          | String   | ''          | URL for an image to display.                                                                              |
-| input             | String   | null        | Generate an input: `'text'`, `'password'`, `'textarea'`, `'select'`, `'radio'`, `'checkbox'`, `'toggle'`. |
-| inputPlaceholder  | String   | ''          | Placeholder text or label for `checkbox`/`toggle`.                                                        |
-| inputValue        | String   | ''          | Initial value or checked state (for boolean inputs).                                                      |
-| inputOptions      | Object   | {}          | Object mapping `{value: 'Label'}` for `select`/`radio`.                                                   |
-| inputAttributes   | Object   | {}          | Custom HTML attributes for the input element.                                                             |
-| dir               | String   | 'auto'      | Text direction. Set `rtl` for Arabic/Hebrew.                                                              |
-| position          | String   | 'center'    | `top`, `top-end`, `bottom-start`, etc.                                                                    |
-| timer             | Number   | null        | Auto close timer in milliseconds.                                                                         |
-| timerProgressBar  | Boolean  | false       | Display progress bar at the bottom.                                                                       |
-| toast             | Boolean  | false       | Display the alert as a non-blocking toast notification.                                                   |
-| loaderType        | String   | 'hourglass' | Type of loader: `hourglass`, `ascii`, `blinking`, `progress`.                                             |
-| draggable         | Boolean  | false       | Allow moving the modal dragging its header.                                                               |
-| showDenyButton    | Boolean  | false       | Show the third middle deny button.                                                                        |
-| preConfirm        | Function | null        | Async function executed before confirm executes.                                                          |
-| allowOutsideClick | Function | null        | Async function executed before confirm executes.                                                          |
+| Option            | Type     | Default     | Description                                                                                                        |
+| ----------------- | -------- | ----------- | ------------------------------------------------------------------------------------------------------------------ |
+| background        | String   | ''          | Custom background color for the modal.                                                                             |
+| color             | String   | ''          | Custom text color for the modal body.                                                                              |
+| titleColor        | String   | ''          | Custom title color.                                                                                                |
+| iconColor         | String   | ''          | Custom icon color (including SVG stroke).                                                                          |
+| title             | String   | ''          | The title of the alert. Supports HTML.                                                                             |
+| text/message      | String   | ''          | The message body of the alert.                                                                                     |
+| html              | String   | ''          | A custom HTML description for the alert.                                                                           |
+| icon              | String   | ''          | Standard icons: `warning`, `error`, `info`, `success`, `question`                                                  |
+| iconHtml          | String   | ''          | Custom HTML string for the icon.                                                                                   |
+| footer            | String   | ''          | Custom HTML for the footer section.                                                                                |
+| imageUrl          | String   | ''          | URL for an image to display.                                                                                       |
+| input             | String   | null        | Input type: `'text'`, `'password'`, `'textarea'`, `'select'`, `'radio'`, `'checkbox'` (SVG Brutalist), `'toggle'`. |
+| inputPlaceholder  | String   | ''          | Placeholder text or label for `checkbox`/`toggle`.                                                                 |
+| inputValue        | String   | ''          | Initial value or checked state (for boolean inputs).                                                               |
+| inputOptions      | Object   | {}          | Object mapping `{value: 'Label'}` for `select`/`radio`.                                                            |
+| inputAttributes   | Object   | {}          | Custom HTML attributes for the input element.                                                                      |
+| theme             | String   | 'light'     | Native dark mode support (`'light'`, `'dark'`, or `'auto'`).                                                       |
+| dir               | String   | 'auto'      | Text direction. Set `rtl` for Arabic/Hebrew.                                                                       |
+| position          | String   | 'center'    | `top`, `top-end`, `bottom-start`, etc.                                                                             |
+| timer             | Number   | null        | Auto close timer in milliseconds.                                                                                  |
+| timerProgressBar  | Boolean  | false       | Display progress bar at the bottom.                                                                                |
+| toast             | Boolean  | false       | Display the alert as a non-blocking toast notification.                                                            |
+| loaderType        | String   | 'hourglass' | Type of loader: `hourglass`, `ascii`, `blinking`, `progress`, `segmented`.                                         |
+| draggable         | Boolean  | false       | Allow moving the modal dragging its header.                                                                        |
+| showDenyButton    | Boolean  | false       | Show the third middle deny button.                                                                                 |
+| preConfirm        | Function | null        | Async function executed before confirm executes.                                                                   |
+| allowOutsideClick | Function | null        | Async function executed before confirm executes.                                                                   |
 ## Methods
@@ -210,11 +278,9 @@ If you'd like to collaborate or just say hi, visit my [Portfolio Website](https:
 - `Alert90s.showValidationMessage(message)` / `Alert90s.resetValidationMessage()`
 - `Alert90s.getTimerLeft()`
 - `Alert90s.getPopup()`
-- `Alert90s.initTooltips()`
-- `Alert90s.destroyTooltips()`
+- `Alert90s.initTooltips()` / `Alert90s.destroyTooltips()`
+- `Alert90s.renderThemeToggle(selector, options)`
 ## License
 MIT
-# alert90s

package/dist/alert90s.min.js CHANGED Viewed

	@@ -1 +1 @@
1	- !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e\|\|self).Alert90s=t()}(this,function(){"use strict";!function(e,t){void 0===t&&(t={});var o=t.insertAt;if("undefined"!=typeof document){var r=document.head\|\|document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===o&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}('.alert90s-overlay{animation:alert90s-fade-in .2s ease-out forwards;backdrop-filter:blur(4px);background-color:rgba(0,0,0,.6);box-sizing:border-box;display:flex;font-family:inherit;inset:0;padding:1rem;position:fixed;z-index:99999}.alert90s-overlay.alert90s-pos-center{align-items:center;justify-content:center}.alert90s-overlay.alert90s-pos-top{align-items:flex-start;justify-content:center}.alert90s-overlay.alert90s-pos-top-start{align-items:flex-start;justify-content:flex-start}.alert90s-overlay.alert90s-pos-top-end{align-items:flex-start;justify-content:flex-end}.alert90s-overlay.alert90s-pos-bottom{align-items:flex-end;justify-content:center}.alert90s-overlay.alert90s-pos-bottom-start{align-items:flex-end;justify-content:flex-start}.alert90s-overlay.alert90s-pos-bottom-end{align-items:flex-end;justify-content:flex-end}.alert90s-overlay.alert90s-pos-center-start{align-items:center;justify-content:flex-start}.alert90s-overlay.alert90s-pos-center-end{align-items:center;justify-content:flex-end}.alert90s-overlay *{box-sizing:border-box}.alert90s-box{align-items:center;animation:alert90s-pop-in .3s cubic-bezier(.175,.885,.32,1.275) forwards;background-color:#fff;border:4px solid #000;box-shadow:12px 12px 0 0 #000;display:flex;flex-direction:column;max-height:95vh;max-width:28rem;position:relative;text-align:center;width:100%}.alert90s-box[dir=rtl]{text-align:right}.alert90s-box.is-draggable{position:absolute}.alert90s-body{align-items:center;display:flex;flex-direction:column;overflow-y:auto;padding:3rem 2rem 2rem;scrollbar-width:none;width:100%}.alert90s-body::-webkit-scrollbar{display:none}.alert90s-header{align-items:center;background-color:#e2e8f0;border-bottom:4px solid #000;display:flex;height:2rem;justify-content:space-between;left:0;padding:0 .5rem;position:absolute;top:0;width:100%;z-index:10}.alert90s-header.draggable{cursor:grab}.alert90s-header.draggable:active{cursor:grabbing}.alert90s-header-left{display:flex;gap:.25rem}.alert90s-box[dir=rtl] .alert90s-header{flex-direction:row-reverse}.alert90s-header-dot{background-color:#fff;border:2px solid #000;height:.75rem;width:.75rem}.alert90s-header-right{align-items:center;display:flex;gap:.5rem;z-index:11}.alert90s-box[dir=rtl] .alert90s-header-right{flex-direction:row-reverse}.alert90s-header-title{font-size:10px;font-weight:700;letter-spacing:.1em;pointer-events:none;text-transform:uppercase}.alert90s-close-btn{align-items:center;background-color:#ef4444;border:2px solid #000;box-shadow:none;cursor:pointer;display:flex;height:1.25rem;justify-content:center;margin:0;padding:0;transition:transform .1s,background-color .1s;width:1.25rem}.alert90s-close-btn:hover{background-color:#f87171;transform:scale(1.1)}.alert90s-close-btn span{color:#000;font-size:14px;font-weight:700;line-height:1}.alert90s-image-container{align-items:center;background:#fff;border:4px solid #000;box-shadow:4px 4px 0 0 #000;display:flex;justify-content:center;margin-bottom:1rem;overflow:hidden;width:100%}.alert90s-image-container img{display:block;height:auto;max-width:100%}.alert90s-icon{align-items:center;border:4px solid #000;border-radius:9999px;box-shadow:4px 4px 0 0 #000;display:flex;flex-shrink:0;height:4rem;justify-content:center;margin-bottom:1rem;width:4rem}.alert90s-icon img,.alert90s-icon svg{height:2rem;width:2rem}.alert90s-icon-custom{font-size:2.25rem;font-weight:700;line-height:1}.alert90s-icon.warning{background-color:#facc15}.alert90s-icon.danger,.alert90s-icon.error{background-color:#ef4444;color:#fff}.alert90s-icon.info,.alert90s-icon.question{background-color:#60a5fa}.alert90s-icon.success{background-color:#4ade80}.alert90s-title{color:#1a1a1a;font-size:1.5rem;font-weight:900;letter-spacing:.1em;line-height:1.2;margin:0 0 .5rem;text-transform:uppercase}.alert90s-message{color:#475569;font-weight:700}.alert90s-html,.alert90s-message{font-size:.875rem;margin:0 0 1.5rem;max-width:100%}.alert90s-html{color:#1a1a1a;line-height:1.5}.alert90s-box[dir=rtl] .alert90s-html{text-align:right}.alert90s-html a{color:#2563eb;font-weight:700;text-decoration:underline;text-decoration-thickness:2px}.alert90s-html a:hover{background-color:#bfdbfe}.alert90s-html b,.alert90s-html strong{font-weight:900}.alert90s-input-container{margin-bottom:1.5rem;width:100%}.alert90s-input{background-color:#f8fafc;border:4px solid #000;box-shadow:inset 4px 4px 0 0 rgba(0,0,0,.05);font-family:inherit;font-size:1rem;font-weight:700;outline:none;padding:.75rem;transition:background-color .2s;width:100%}.alert90s-input:focus{background-color:#fff;border-color:#2563eb}textarea.alert90s-input{min-height:100px;resize:vertical}select.alert90s-select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#000 0),linear-gradient(135deg,#000 50%,transparent 0);background-position:calc(100% - 20px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px);background-repeat:no-repeat;background-size:5px 5px,5px 5px;cursor:pointer}.alert90s-radio-group{align-items:flex-start;display:flex;flex-direction:column;gap:.5rem;width:100%}.alert90s-radio-label{align-items:center;cursor:pointer;display:flex;font-size:1rem;font-weight:700;gap:.75rem}.alert90s-radio-label input[type=radio]{appearance:none;background-color:#f8fafc;border:4px solid #000;border-radius:50%;cursor:pointer;height:1.25rem;margin:0;position:relative;width:1.25rem}.alert90s-radio-label input[type=radio]:checked{background-color:#000;box-shadow:inset 0 0 0 4px #fff}.alert90s-checkbox-label{align-items:center;cursor:pointer;display:flex;font-size:1rem;font-weight:700;gap:.75rem}.alert90s-checkbox-label input[type=checkbox]{appearance:none;background-color:#f8fafc;border:4px solid #000;cursor:pointer;height:1.25rem;margin:0;position:relative;width:1.25rem}.alert90s-checkbox-label input[type=checkbox]:checked{background-color:#000}.alert90s-checkbox-label input[type=checkbox]:checked:after{color:#fff;content:"✔";font-size:.8rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.alert90s-toggle-label{align-items:center;cursor:pointer;display:flex;font-size:1rem;font-weight:700;gap:.75rem}.alert90s-toggle-label input[type=checkbox]{display:none}.alert90s-toggle-slider{background-color:#f87171;border:4px solid #000;box-shadow:inset 3px 3px 0 0 rgba(0,0,0,.1);height:1.5rem;position:relative;transition:background-color .2s;width:3rem}.alert90s-toggle-slider:before{background-color:#fff;border-right:4px solid #000;content:"";height:100%;left:0;position:absolute;top:0;transition:transform .2s;width:1rem}.alert90s-toggle-label input[type=checkbox]:checked+.alert90s-toggle-slider{background-color:#4ade80}.alert90s-toggle-label input[type=checkbox]:checked+.alert90s-toggle-slider:before{border-left:4px solid #000;transform:translateX(1.5rem)}.alert90s-validation-message{background-color:#fef2f2;border:4px solid #000;border-left:8px solid #ef4444;color:#ef4444;display:none;font-size:.875rem;font-weight:700;margin-bottom:1.5rem;padding:.75rem;text-align:left;width:100%}.alert90s-box[dir=rtl] .alert90s-validation-message{border-left-color:#000;border-left-width:4px;border-right-color:#ef4444;border-right-width:8px;text-align:right}.alert90s-actions{display:flex;flex-direction:column;gap:1rem;justify-content:center;width:100%}@media (min-width:640px){.alert90s-actions{flex-direction:row}}.alert90s-button{align-items:center;background-color:#fff;border:4px solid #000;box-shadow:4px 4px 0 0 #000;color:#000;cursor:pointer;display:flex;font-family:inherit;font-size:.875rem;font-weight:900;gap:.5rem;justify-content:center;letter-spacing:.1em;margin:0;padding:.75rem 1rem;text-transform:uppercase;transition:background-color .1s;width:100%}@media (min-width:640px){.alert90s-button{flex:1;min-width:100px;width:auto}}.alert90s-button:active{box-shadow:0 0 0 0 #000;transform:translate(4px,4px)}.alert90s-button:focus{outline:2px dashed #000;outline-offset:4px}.alert90s-button.cancel{background-color:#f87171}.alert90s-button.cancel:hover{background-color:#fca5a5}.alert90s-button.deny{background-color:#fb923c}.alert90s-button.deny:hover{background-color:#fdba74}.alert90s-button.confirm{background-color:#4ade80}.alert90s-button.confirm:hover{background-color:#86efac}.alert90s-footer{border-top:4px solid #000;color:#475569;font-size:.75rem;font-weight:700;margin-top:1.5rem;padding-top:1rem;width:100%}.alert90s-footer a{color:#2563eb;text-decoration:underline;text-decoration-thickness:2px}.alert90s-footer a:hover{background-color:#bfdbfe}.alert90s-progress-bar{animation:alert90s-progress linear forwards;background-color:#000;bottom:0;height:6px;left:0;position:absolute;width:100%}.alert90s-loader{display:flex;padding:1rem 0}.alert90s-loader,.alert90s-spinner{align-items:center;justify-content:center}.alert90s-spinner{display:inline-flex}.alert90s-spinner.hourglass{animation:alert90s-hourglass 2s ease-in-out infinite;font-size:2.5rem;line-height:1}.alert90s-spinner.ascii{font-family:monospace;font-size:2rem;font-weight:700}.alert90s-spinner.ascii:after{animation:alert90s-ascii .5s steps(4) infinite;content:"\|"}.alert90s-spinner.blinking{font-family:monospace;font-size:1.5rem;font-weight:700;letter-spacing:.1em}.alert90s-spinner.blinking .cursor{animation:alert90s-blink 1s step-end infinite}.alert90s-spinner.progress{background-color:#cbd5e1;border:2px solid #000;box-shadow:inset 2px 2px 0 0 #64748b,inset -2px -2px 0 0 #f8fafc;height:24px;overflow:hidden;padding:2px;position:relative;width:200px}.alert90s-spinner.progress:before{animation:alert90s-marquee 1.5s linear infinite;background-color:#1d4ed8;background-image:repeating-linear-gradient(90deg,#1d4ed8,#1d4ed8 10px,transparent 0,transparent 12px);content:"";height:calc(100% - 4px);left:0;position:absolute;top:2px;width:40%}@keyframes alert90s-hourglass{0%{transform:rotate(0)}25%{transform:rotate(180deg)}50%{transform:rotate(180deg)}75%{transform:rotate(1turn)}to{transform:rotate(1turn)}}@keyframes alert90s-ascii{0%{content:"\|"}25%{content:"/"}50%{content:"-"}75%{content:"\\\\"}to{content:"\|"}}@keyframes alert90s-blink{50%{opacity:0}}@keyframes alert90s-marquee{0%{transform:translateX(-100%)}to{transform:translateX(250px)}}@keyframes alert90s-progress{0%{width:100%}to{width:0}}@keyframes alert90s-fade-in{0%{opacity:0}to{opacity:1}}@keyframes alert90s-pop-in{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes alert90s-fade-out{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.95) translateY(10px)}}@keyframes alert90s-toast-slide-in{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.alert90s-toast-container{display:flex;gap:10px;padding:10px;pointer-events:none;position:fixed;z-index:10000}.alert90s-toast-top-start{flex-direction:column;left:0;top:0}.alert90s-toast-top{flex-direction:column;left:50%;top:0;transform:translateX(-50%)}.alert90s-toast-top-end{flex-direction:column;right:0;top:0}.alert90s-toast-center-start{flex-direction:column;left:0;top:50%;transform:translateY(-50%)}.alert90s-toast-center{flex-direction:column;left:50%;top:50%;transform:translate(-50%,-50%)}.alert90s-toast-center-end{flex-direction:column;right:0;top:50%;transform:translateY(-50%)}.alert90s-toast-bottom-start{bottom:0;flex-direction:column-reverse;left:0}.alert90s-toast-bottom{bottom:0;flex-direction:column-reverse;left:50%;transform:translateX(-50%)}.alert90s-toast-bottom-end{bottom:0;flex-direction:column-reverse;right:0}.alert90s-box.alert90s-toast{align-items:stretch;bottom:auto!important;box-shadow:6px 6px 0 0 #000;flex-direction:row;left:auto!important;margin:0;max-width:100%;min-width:250px;padding:0;pointer-events:auto;position:relative!important;right:auto!important;top:auto!important;transform:none!important;width:auto}.alert90s-toast .alert90s-header{display:none}.alert90s-toast .alert90s-body{align-items:center;flex-direction:row;gap:1rem;padding:1rem 1.5rem}.alert90s-toast .alert90s-icon{height:2.5rem;margin-bottom:0;width:2.5rem}.alert90s-toast .alert90s-icon img,.alert90s-toast .alert90s-icon svg{height:1.25rem;width:1.25rem}.alert90s-content-wrapper{align-items:center;display:flex;flex-direction:column;width:100%}.alert90s-toast .alert90s-content-wrapper{align-items:flex-start;text-align:left}.alert90s-box.alert90s-toast[dir=rtl] .alert90s-content-wrapper{align-items:flex-end;text-align:right}.alert90s-toast .alert90s-title{font-size:1rem;margin-bottom:.25rem}.alert90s-toast .alert90s-html,.alert90s-toast .alert90s-message{font-size:.875rem;margin-bottom:0}.alert90s-toast-close{align-items:center;background-color:#ef4444;border:2px solid #000;box-shadow:none;cursor:pointer;display:flex;height:1.5rem;justify-content:center;margin:0;margin-inline-start:auto;padding:0;transition:transform .1s,background-color .1s;width:1.5rem}.alert90s-toast-close span{color:#000;display:block;font-size:10px;font-weight:700;line-height:1}.alert90s-toast-close:hover{background-color:#f87171;transform:scale(1.1)}.btn90s{align-items:center;background-color:#fff;border:4px solid #000;box-shadow:4px 4px 0 0 #000;color:#000;cursor:pointer;display:inline-flex;font-family:inherit;font-size:1rem;font-weight:900;justify-content:center;letter-spacing:.05em;margin:.25rem;padding:.75rem 1.5rem;text-decoration:none;text-transform:uppercase;transition:transform .1s,box-shadow .1s,background-color .1s}.btn90s:active{box-shadow:0 0 0 0 #000;transform:translate(4px,4px)}.btn90s:focus-visible{outline:2px dashed #000;outline-offset:4px}.btn90s.primary{background-color:#00f0ff}.btn90s.primary:hover{background-color:#66f6ff}.btn90s.success{background-color:#4ade80}.btn90s.success:hover{background-color:#86efac}.btn90s.warning{background-color:#ffc900}.btn90s.warning:hover{background-color:#ffe066}.btn90s.danger{background-color:#ff90e8}.btn90s.danger:hover{background-color:#ffbaf0}.btn90s.dark{background-color:#000;border-color:#000;color:#fff}.btn90s.dark:hover{background-color:#333}.btn90s.sm{border-width:3px;box-shadow:3px 3px 0 0 #000;font-size:.875rem;padding:.5rem 1rem}.btn90s.sm:active{transform:translate(3px,3px)}.btn90s.lg{border-width:5px;box-shadow:6px 6px 0 0 #000;font-size:1.25rem;padding:1rem 2rem}.btn90s.lg:active{transform:translate(6px,6px)}.alert90s-tooltip{animation:tooltip-pop .15s cubic-bezier(.175,.885,.32,1.275) forwards;background-color:#fff;border:3px solid #000;box-shadow:4px 4px 0 0 #000;color:#000;display:none;font-family:inherit;font-size:.875rem;font-weight:700;max-width:300px;padding:.5rem 1rem;pointer-events:none;position:absolute;white-space:pre-wrap;z-index:100000}.alert90s-tooltip.show{display:block}.alert90s-tooltip.c-yellow{background-color:#fef08a}.alert90s-tooltip.c-cyan{background-color:#00f0ff}.alert90s-tooltip.c-pink{background-color:#ff90e8}.alert90s-tooltip.c-base{background-color:#fff}.alert90s-tooltip.c-dark{background-color:#000;color:#fff}.alert90s-tooltip:after{border-style:solid;content:"";height:0;position:absolute;width:0}.alert90s-tooltip.pos-top:after{border-color:#000 transparent transparent;border-width:8px 8px 0;bottom:-8px;left:50%;margin-left:-8px}.alert90s-tooltip.pos-bottom:after{border-color:transparent transparent #000;border-width:0 8px 8px;left:50%;margin-left:-8px;top:-8px}.alert90s-tooltip.pos-left:after{border-color:transparent transparent transparent #000;border-width:8px 0 8px 8px;margin-top:-8px;right:-8px;top:50%}.alert90s-tooltip.pos-right:after{border-color:transparent #000 transparent transparent;border-width:8px 8px 8px 0;left:-8px;margin-top:-8px;top:50%}@keyframes tooltip-pop{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}');class e{static getOptions(){return this.currentOptions\|\|{}}static getPopup(){return this.currentPopup\|\|null}static getTimerLeft(){if(!this.timerEnd)return;const e=this.timerEnd-Date.now();return e>0?e:0}static isLoading(){const e=this.getPopup();if(!e)return!1;const t=e.querySelector(".alert90s-actions"),o=e.querySelector(".alert90s-loader");return t&&"none"===t.style.display\|\|!!o}static showLoading(){const t=this.getPopup();if(t){const o=t.querySelector(".alert90s-actions");o&&(o.style.display="none");let r=t.querySelector(".alert90s-loader");if(!r){r=document.createElement("div"),r.className="alert90s-loader";const n=e.currentOptions&&e.currentOptions.loaderType\|\|"hourglass";r.innerHTML="ascii"===n?'<div class="alert90s-spinner ascii"></div>':"blinking"===n?'<div class="alert90s-spinner blinking">LOADING<span class="cursor">_</span></div>':"progress"===n?'<div class="alert90s-spinner progress"></div>':'<div class="alert90s-spinner hourglass">⏳</div>',o&&o.parentNode?o.parentNode.insertBefore(r,o):t.querySelector(".alert90s-body").appendChild(r)}}}static hideLoading(){const e=this.getPopup();if(e){const t=e.querySelector(".alert90s-actions");t&&(t.style.display="");const o=e.querySelector(".alert90s-loader");o&&o.remove()}}static showValidationMessage(e){const t=this.getPopup();if(t){let o=t.querySelector(".alert90s-validation-message");if(!o){o=document.createElement("div"),o.className="alert90s-validation-message";const e=t.querySelector(".alert90s-actions");e&&e.parentNode?e.parentNode.insertBefore(o,e):t.querySelector(".alert90s-body").appendChild(o)}o.innerHTML=e,o.style.display="block"}}static resetValidationMessage(){const e=this.getPopup();if(e){const t=e.querySelector(".alert90s-validation-message");t&&(t.style.display="none")}}static getToastContainer(e){const t=`alert90s-toast-container alert90s-toast-${e}`;let o=document.querySelector(`.${t.replace(/ /g,".")}`);return o\|\|(o=document.createElement("div"),o.className=t,document.body.appendChild(o)),o}static fire(e={}){return this.show(e)}static show(t={}){return new Promise(o=>{"string"==typeof t&&(t={title:t}),this.currentOptions=t;const r={title:void 0!==t.title?t.title:"",text:t.message\|\|t.text\|\|"",html:t.html\|\|"",icon:t.type\|\|t.icon\|\|"",iconHtml:t.iconHtml\|\|"",showConfirmButton:!1!==t.showConfirmButton,showCancelButton:t.showCancelButton\|\|!1,showDenyButton:t.showDenyButton\|\|!1,showCloseButton:void 0===t.showCloseButton\|\|t.showCloseButton,loaderType:t.loaderType\|\|"hourglass",confirmButtonText:t.confirmText\|\|t.confirmButtonText\|\|"OK",cancelButtonText:t.cancelText\|\|t.cancelButtonText\|\|"Cancel",denyButtonText:t.denyText\|\|t.denyButtonText\|\|"No",confirmButtonColor:t.confirmButtonColor\|\|"",cancelButtonColor:t.cancelButtonColor\|\|"",denyButtonColor:t.denyButtonColor\|\|"",background:t.background\|\|"",color:t.color\|\|"",titleColor:t.titleColor\|\|"",iconColor:t.iconColor\|\|"",confirmButtonAriaLabel:t.confirmButtonAriaLabel\|\|"",cancelButtonAriaLabel:t.cancelButtonAriaLabel\|\|"",denyButtonAriaLabel:t.denyButtonAriaLabel\|\|"",focusConfirm:!1!==t.focusConfirm,footer:t.footer\|\|"",imageUrl:t.imageUrl\|\|"",imageWidth:t.imageWidth\|\|null,imageHeight:t.imageHeight\|\|null,imageAlt:t.imageAlt\|\|"",input:t.input\|\|null,inputPlaceholder:t.inputPlaceholder\|\|"",inputValue:t.inputValue\|\|"",inputOptions:t.inputOptions\|\|{},inputAttributes:t.inputAttributes\|\|{},showLoaderOnConfirm:t.showLoaderOnConfirm\|\|!1,preConfirm:t.preConfirm\|\|null,toast:t.toast\|\|!1,draggable:t.draggable\|\|!1,position:t.position\|\|(t.toast?"top-end":"center"),allowOutsideClick:void 0===t.allowOutsideClick\|\|t.allowOutsideClick,dir:t.dir\|\|"auto",showClass:t.showClass\|\|{popup:"alert90s-pop-in"},hideClass:t.hideClass\|\|{popup:"alert90s-fade-out"},timer:t.timer\|\|null,timerProgressBar:t.timerProgressBar\|\|!1,didOpen:t.didOpen\|\|null,willClose:t.willClose\|\|null};let n=null;r.toast\|\|(n=document.createElement("div"),n.className=`alert90s-overlay alert90s-pos-${r.position}`,n.addEventListener("mousedown",e=>{if(e.target===n){("function"==typeof r.allowOutsideClick?r.allowOutsideClick():r.allowOutsideClick)&&h({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"backdrop"})}}));const a=document.createElement("div");a.className="alert90s-box",r.toast&&a.classList.add("alert90s-toast"),"rtl"===document.dir\|\|"rtl"===r.dir\|\|r.position.includes("start")?a.setAttribute("dir","auto"===r.dir?document.dir\|\|"ltr":r.dir):a.setAttribute("dir",r.dir),r.showClass.popup&&"alert90s-pop-in"!==r.showClass.popup&&(a.style.animation="none",a.className=`alert90s-box ${r.showClass.popup}`),r.background&&(a.style.backgroundColor=r.background),r.color&&(a.style.color=r.color),r.draggable&&a.classList.add("is-draggable"),r.toast\|\|(this.currentPopup=a);const i=document.createElement("div");i.className="alert90s-body";const s=document.createElement("div");s.className="alert90s-header",r.draggable&&s.classList.add("draggable");let l="";if(r.showCloseButton&&(l='\n <button class="alert90s-close-btn" id="alert90s-close" aria-label="Close">\n <span>✕</span>\n </button>\n '),s.innerHTML=`\n <div class="alert90s-header-left">\n <div class="alert90s-header-dot"></div>\n <div class="alert90s-header-dot"></div>\n <div class="alert90s-header-dot"></div>\n </div>\n <div class="alert90s-header-right">\n <span class="alert90s-header-title">SYS.REQ</span>\n ${l}\n </div>\n `,r.draggable){let e,t,o,r,n=!1;s.addEventListener("mousedown",i=>{if(i.target.closest("#alert90s-close"))return;n=!0,e=i.clientX,t=i.clientY;const s=a.getBoundingClientRect();a.style.transform="none",a.style.animation="none",o=s.left,r=s.top,a.style.left=o+"px",a.style.top=r+"px",a.style.margin="0",document.body.style.userSelect="none"}),document.addEventListener("mousemove",i=>{n&&(a.style.left=o+(i.clientX-e)+"px",a.style.top=r+(i.clientY-t)+"px")}),document.addEventListener("mouseup",()=>{n&&(n=!1,document.body.style.userSelect="")})}let c=null;if(r.timer&&r.timerProgressBar&&(c=document.createElement("div"),c.className="alert90s-progress-bar",c.style.animationDuration=`${r.timer}ms`,a.appendChild(c)),r.imageUrl){const e=document.createElement("div");e.className="alert90s-image-container";const t=document.createElement("img");t.src=r.imageUrl,r.imageAlt&&(t.alt=r.imageAlt);let o="";r.imageWidth&&(o+=`width: ${r.imageWidth}px; max-width: 100%; `),r.imageHeight&&(o+=`height: ${r.imageHeight}px; `),o&&e.setAttribute("style",o),e.appendChild(t),i.appendChild(e)}if(r.icon){const e=document.createElement("div"),t="error"===r.icon?"danger":r.icon;e.className=`alert90s-icon ${t}`;let o="";if(r.iconHtml?o=`<div class="alert90s-icon-custom">${r.iconHtml}</div>`:"warning"===r.icon?o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>':"danger"===r.icon\|\|"error"===r.icon?o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>':"info"===r.icon?o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg>':"success"===r.icon?o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg>':"question"===r.icon&&(o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>'),e.innerHTML=o,r.iconColor&&(e.style.color=r.iconColor,e.style.borderColor=r.iconColor,!r.iconHtml)){const t=e.querySelector("svg");t&&(t.style.stroke=r.iconColor)}o&&i.appendChild(e)}const d=document.createElement("div");if(d.className="alert90s-content-wrapper",r.title){const e=document.createElement("h2");e.className="alert90s-title",e.innerHTML=r.title,r.titleColor&&(e.style.color=r.titleColor),d.appendChild(e)}if(r.html){const e=document.createElement("div");e.className="alert90s-html",e.innerHTML=r.html,r.color&&(e.style.color=r.color),d.appendChild(e)}else if(r.text){const e=document.createElement("p");e.className="alert90s-message",e.textContent=r.text,r.color&&(e.style.color=r.color),d.appendChild(e)}if((r.title\|\|r.html\|\|r.text)&&i.appendChild(d),r.toast&&r.showCloseButton){const e=document.createElement("button");e.className="alert90s-toast-close",e.innerHTML="<span>✕</span>",e.onclick=()=>h({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"close"}),i.appendChild(e)}let p=null;if(r.input){const e=document.createElement("div");if(e.className="alert90s-input-container","select"===r.input){if(p=document.createElement("select"),p.className="alert90s-input alert90s-select",r.inputPlaceholder){const e=document.createElement("option");e.value="",e.textContent=r.inputPlaceholder,e.disabled=!0,e.selected=!0,p.appendChild(e)}for(const[e,t]of Object.entries(r.inputOptions)){const o=document.createElement("option");o.value=e,o.textContent=t,e===r.inputValue&&(o.selected=!0),p.appendChild(o)}e.appendChild(p)}else if("radio"===r.input){const t=document.createElement("div");t.className="alert90s-radio-group";for(const[e,o]of Object.entries(r.inputOptions)){const n=document.createElement("label");n.className="alert90s-radio-label";const a=document.createElement("input");a.type="radio",a.name="alert90s-radio",a.value=e,e===r.inputValue&&(a.checked=!0);const i=document.createElement("span");i.textContent=o,n.appendChild(a),n.appendChild(i),t.appendChild(n)}p=t,e.appendChild(t)}else if("checkbox"===r.input\|\|"toggle"===r.input){const t=document.createElement("label");if(t.className="toggle"===r.input?"alert90s-toggle-label":"alert90s-checkbox-label",p=document.createElement("input"),p.type="checkbox",p.checked=!!r.inputValue,"toggle"===r.input){const e=document.createElement("div");if(e.className="alert90s-toggle-slider",t.appendChild(p),t.appendChild(e),r.inputPlaceholder){const e=document.createElement("span");e.textContent=r.inputPlaceholder,t.appendChild(e)}}else{const e=document.createElement("span");e.textContent=r.inputPlaceholder\|\|"Check me",t.appendChild(p),t.appendChild(e)}e.appendChild(t)}else"textarea"===r.input?(p=document.createElement("textarea"),p.className="alert90s-input",r.inputPlaceholder&&(p.placeholder=r.inputPlaceholder),r.inputValue&&(p.value=r.inputValue),e.appendChild(p)):(p=document.createElement("input"),p.type=r.input,p.className="alert90s-input",r.inputPlaceholder&&(p.placeholder=r.inputPlaceholder),r.inputValue&&(p.value=r.inputValue),e.appendChild(p));if(r.inputAttributes&&p&&!["radio"].includes(r.input))for(const[e,t]of Object.entries(r.inputAttributes))p.setAttribute(e,t);i.appendChild(e)}const m=document.createElement("div");m.className="alert90s-actions";let u=null,f=null;const h=e=>{f&&clearTimeout(f),r.willClose&&r.willClose(),a.style.animation="none","alert90s-fade-out"===r.hideClass.popup?(a.style.animation="alert90s-fade-out 0.2s forwards",n&&(n.style.transition="opacity 0.2s",n.style.opacity="0")):a.className=`alert90s-box ${r.hideClass.popup}`,setTimeout(()=>{r.toast?a.parentNode&&a.parentNode.removeChild(a):n&&document.body.contains(n)&&document.body.removeChild(n),o(e)},200)},g=async()=>{let t=!0;if("radio"===r.input){const e=p.querySelector('input[type="radio"]:checked');t=e?e.value:null}else"checkbox"===r.input\|\|"toggle"===r.input?t=p.checked:p&&(t=p.value);if(r.preConfirm){e.resetValidationMessage(),r.showLoaderOnConfirm&&e.showLoading();try{const o=await Promise.resolve(r.preConfirm(t));if(!1===o)return void e.hideLoading();void 0!==o&&o!==t&&(t=o);const n=a.querySelector(".alert90s-validation-message");if(n&&"block"===n.style.display)return void e.hideLoading()}catch(t){return e.showValidationMessage(`Request failed: ${t}`),void e.hideLoading()}}h({isConfirmed:!0,isDenied:!1,isDismissed:!1,value:t})};if(r.showCancelButton){const e=document.createElement("button");e.className="alert90s-button cancel",e.innerHTML=r.cancelButtonText,r.cancelButtonAriaLabel&&e.setAttribute("aria-label",r.cancelButtonAriaLabel),r.cancelButtonColor&&(e.style.backgroundColor=r.cancelButtonColor),e.onclick=()=>h({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"cancel"}),m.appendChild(e)}if(r.showDenyButton){const e=document.createElement("button");e.className="alert90s-button deny",e.innerHTML=r.denyButtonText,r.denyButtonAriaLabel&&e.setAttribute("aria-label",r.denyButtonAriaLabel),r.denyButtonColor&&(e.style.backgroundColor=r.denyButtonColor),e.onclick=()=>h({isConfirmed:!1,isDenied:!0,isDismissed:!1}),m.appendChild(e)}if(r.showConfirmButton){const e=document.createElement("button");e.className="alert90s-button confirm",e.innerHTML=r.confirmButtonText,r.confirmButtonAriaLabel&&e.setAttribute("aria-label",r.confirmButtonAriaLabel),r.confirmButtonColor&&(e.style.backgroundColor=r.confirmButtonColor),e.onclick=g,m.appendChild(e),u=e}if((r.showCancelButton\|\|r.showDenyButton\|\|r.showConfirmButton)&&i.appendChild(m),r.footer){const e=document.createElement("div");e.className="alert90s-footer",e.innerHTML=r.footer,i.appendChild(e)}if(a.appendChild(s),a.appendChild(i),r.toast){const t=e.getToastContainer(r.position);a.style.animation="alert90s-toast-slide-in 0.3s ease-out",t.appendChild(a)}else n.appendChild(a);if(r.showCloseButton&&!r.toast){const e=s.querySelector("#alert90s-close");e&&(e.onclick=()=>h({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"close"}))}r.toast\|\|document.body.appendChild(n),r.focusConfirm&&u&&setTimeout(()=>{p?p.focus():u.focus()},50),r.didOpen&&setTimeout(()=>{r.didOpen()},0),r.timer&&(this.timerEnd=Date.now()+r.timer,f=setTimeout(()=>{h({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"timer"})},r.timer))})}static initTooltips(){this._tooltipsInitialized\|\|(this._tooltipsInitialized=!0,this._tooltipEl=document.createElement("div"),this._tooltipEl.className="alert90s-tooltip",document.body.appendChild(this._tooltipEl),document.addEventListener("mouseover",this._handleTooltipMouseOver.bind(this)),document.addEventListener("mouseout",this._handleTooltipMouseOut.bind(this)),document.addEventListener("focusin",this._handleTooltipMouseOver.bind(this)),document.addEventListener("focusout",this._handleTooltipMouseOut.bind(this)))}static _handleTooltipMouseOver(e){const t=e.target.closest("[data-alert90s-tooltip]");if(!t)return;const o=t.getAttribute("data-alert90s-tooltip");if(!o)return;const r=t.getAttribute("data-alert90s-position")\|\|"top",n=t.getAttribute("data-alert90s-color")\|\|"yellow";this._tooltipEl.innerHTML=o,this._tooltipEl.className=`alert90s-tooltip pos-${r} c-${n} show`;const a=t.getBoundingClientRect(),i=this._tooltipEl.getBoundingClientRect(),s=10;let l=0,c=0;switch(r){case"top":l=a.top-i.height-s,c=a.left+a.width/2-i.width/2;break;case"bottom":l=a.bottom+s,c=a.left+a.width/2-i.width/2;break;case"left":l=a.top+a.height/2-i.height/2,c=a.left-i.width-s;break;case"right":l=a.top+a.height/2-i.height/2,c=a.right+s}c<s&&(c=s),l<s&&(l=s),c+i.width>window.innerWidth-s&&(c=window.innerWidth-i.width-s),this._tooltipEl.style.top=`${l+window.scrollY}px`,this._tooltipEl.style.left=`${c+window.scrollX}px`}static _handleTooltipMouseOut(e){const t=e.target.closest("[data-alert90s-tooltip]");t&&setTimeout(()=>{this._tooltipEl.matches(":hover")\|\|t.matches(":hover")\|\|t.contains(document.activeElement)\|\|this._tooltipEl.classList.remove("show")},10)}}return"undefined"!=typeof window&&(window.Alert90s=e,document.addEventListener("DOMContentLoaded",()=>{e.initTooltips()})),e});
1	+ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t\|\|self).Alert90s=e()}(this,function(){"use strict";!function(t,e){void 0===e&&(e={});var o=e.insertAt;if("undefined"!=typeof document){var a=document.head\|\|document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===o&&a.firstChild?a.insertBefore(r,a.firstChild):a.appendChild(r),r.styleSheet?r.styleSheet.cssText=t:r.appendChild(document.createTextNode(t))}}('.alert90s-overlay{animation:alert90s-fade-in .2s ease-out forwards;backdrop-filter:blur(4px);background-color:rgba(0,0,0,.6);box-sizing:border-box;display:flex;font-family:inherit;inset:0;padding:1rem;position:fixed;z-index:99999}.alert90s-overlay.alert90s-pos-center{align-items:center;justify-content:center}.alert90s-overlay.alert90s-pos-top{align-items:flex-start;justify-content:center}.alert90s-overlay.alert90s-pos-top-start{align-items:flex-start;justify-content:flex-start}.alert90s-overlay.alert90s-pos-top-end{align-items:flex-start;justify-content:flex-end}.alert90s-overlay.alert90s-pos-bottom{align-items:flex-end;justify-content:center}.alert90s-overlay.alert90s-pos-bottom-start{align-items:flex-end;justify-content:flex-start}.alert90s-overlay.alert90s-pos-bottom-end{align-items:flex-end;justify-content:flex-end}.alert90s-overlay.alert90s-pos-center-start{align-items:center;justify-content:flex-start}.alert90s-overlay.alert90s-pos-center-end{align-items:center;justify-content:flex-end}.alert90s-overlay {box-sizing:border-box}.alert90s-box{align-items:center;animation:alert90s-pop-in .3s cubic-bezier(.175,.885,.32,1.275) forwards;background-color:#fff;border:4px solid #000;box-shadow:12px 12px 0 0 #000;display:flex;flex-direction:column;max-height:95vh;max-width:28rem;position:relative;text-align:center;width:100%}.alert90s-box[dir=rtl]{text-align:right}.alert90s-box.is-draggable{position:absolute}.alert90s-body{align-items:center;display:flex;flex-direction:column;overflow-y:auto;padding:3rem 2rem 2rem;scrollbar-width:none;width:100%}.alert90s-body::-webkit-scrollbar{display:none}.alert90s-header{align-items:center;background-color:#e2e8f0;border-bottom:4px solid #000;display:flex;height:2rem;justify-content:space-between;left:0;padding:0 .5rem;position:absolute;top:0;width:100%;z-index:10}.alert90s-header.draggable{cursor:grab}.alert90s-header.draggable:active{cursor:grabbing}.alert90s-header-left{display:flex;gap:.25rem}.alert90s-box[dir=rtl] .alert90s-header{flex-direction:row-reverse}.alert90s-header-dot{background-color:#fff;border:2px solid #000;height:.75rem;width:.75rem}.alert90s-header-right{align-items:center;display:flex;gap:.5rem;z-index:11}.alert90s-box[dir=rtl] .alert90s-header-right{flex-direction:row-reverse}.alert90s-header-title{font-size:10px;font-weight:700;letter-spacing:.1em;pointer-events:none;text-transform:uppercase}.alert90s-close-btn{align-items:center;background-color:#ef4444;border:2px solid #000;box-shadow:none;cursor:pointer;display:flex;height:1.25rem;justify-content:center;margin:0;padding:0;transition:transform .1s,background-color .1s;width:1.25rem}.alert90s-close-btn:hover{background-color:#f87171;transform:scale(1.1)}.alert90s-close-btn span{color:#000;font-size:14px;font-weight:700;line-height:1}.alert90s-image-container{align-items:center;background:#fff;border:4px solid #000;box-shadow:4px 4px 0 0 #000;display:flex;justify-content:center;margin-bottom:1rem;overflow:hidden;width:100%}.alert90s-image-container img{display:block;height:auto;max-width:100%}.alert90s-icon{align-items:center;border:4px solid #000;border-radius:9999px;box-shadow:4px 4px 0 0 #000;display:flex;flex-shrink:0;height:4rem;justify-content:center;margin-bottom:1rem;width:4rem}.alert90s-icon img,.alert90s-icon svg{height:2rem;width:2rem}.alert90s-icon-custom{font-size:2.25rem;font-weight:700;line-height:1}.alert90s-icon.warning{background-color:#facc15}.alert90s-icon.danger,.alert90s-icon.error{background-color:#ef4444;color:#fff}.alert90s-icon.info,.alert90s-icon.question{background-color:#60a5fa}.alert90s-icon.success{background-color:#4ade80}.alert90s-title{color:#1a1a1a;font-size:1.5rem;font-weight:900;letter-spacing:.1em;line-height:1.2;margin:0 0 .5rem;text-transform:uppercase}.alert90s-message{color:#475569;font-weight:700}.alert90s-html,.alert90s-message{font-size:.875rem;margin:0 0 1.5rem;max-width:100%}.alert90s-html{color:#1a1a1a;line-height:1.5}.alert90s-box[dir=rtl] .alert90s-html{text-align:right}.alert90s-html a{color:#2563eb;font-weight:700;text-decoration:underline;text-decoration-thickness:2px}.alert90s-html a:hover{background-color:#bfdbfe}.alert90s-html b,.alert90s-html strong{font-weight:900}.alert90s-input-container{margin-bottom:1.5rem;width:100%}.alert90s-input{background-color:#f8fafc;border:4px solid #000;box-shadow:inset 4px 4px 0 0 rgba(0,0,0,.05);font-family:inherit;font-size:1rem;font-weight:700;outline:none;padding:.75rem;transition:background-color .2s;width:100%}.alert90s-input:focus{background-color:#fff;border-color:#2563eb}textarea.alert90s-input{min-height:100px;resize:vertical}select.alert90s-select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#000 0),linear-gradient(135deg,#000 50%,transparent 0);background-position:calc(100% - 20px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px);background-repeat:no-repeat;background-size:5px 5px,5px 5px;cursor:pointer}.alert90s-radio-group{align-items:flex-start;display:flex;flex-direction:column;gap:.5rem;width:100%}.alert90s-radio-label{align-items:center;cursor:pointer;display:flex;font-size:1rem;font-weight:700;gap:.75rem}.alert90s-radio-label input[type=radio]{appearance:none;background-color:#f8fafc;border:4px solid #000;border-radius:50%;cursor:pointer;height:1.25rem;margin:0;position:relative;width:1.25rem}.alert90s-radio-label input[type=radio]:checked{background-color:#000;box-shadow:inset 0 0 0 4px #fff}.alert90s-checkbox-label{align-items:center;cursor:pointer;display:inline-flex;font-size:1rem;font-weight:700;gap:.75rem;position:relative;user-select:none}.alert90s-checkbox-label input[type=checkbox]{cursor:pointer;height:0;opacity:0;position:absolute;width:0}.alert90s-cb-svg{overflow:visible;transition:transform .1s ease}.alert90s-checkbox-label:hover .alert90s-cb-svg{transform:translate(-2px,-2px)}.alert90s-checkbox-label:active .alert90s-cb-svg{transform:translate(2px,2px)}.cb-box{transition:fill .1s ease}.alert90s-checkbox-label input[type=checkbox]:checked~.alert90s-cb-svg .cb-box{fill:#fff}.cb-check{stroke-dasharray:120;stroke-dashoffset:120;transition:stroke-dashoffset .15s ease-out}.alert90s-checkbox-label input[type=checkbox]:checked~.alert90s-cb-svg .cb-check{stroke-dashoffset:0}.alert90s-checkbox-label input[type=checkbox]:checked~.alert90s-cb-svg{animation:alert90s-cb-shake .3s cubic-bezier(.25,.46,.45,.94) forwards}@keyframes alert90s-cb-shake{0%{transform:scale(1) translate(0)}30%{transform:scale(1.15) translate(-2px,-2px) rotate(-4deg)}50%{transform:scale(.95) translate(2px,2px) rotate(3deg)}75%{transform:scale(1.05) translate(-1px,-1px) rotate(-1deg)}to{transform:scale(1) translate(0) rotate(0deg)}}.alert90s-cb-text{transition:color .2s}.alert90s-checkbox-label input[type=checkbox]:checked~.alert90s-cb-text{animation:alert90s-cb-bump .2s ease-out forwards;color:#ff6b35}@keyframes alert90s-cb-bump{0%{transform:translateX(0)}50%{transform:translateX(4px)}to{transform:translateX(0)}}.alert90s-toggle-label{align-items:center;cursor:pointer;display:flex;font-size:1rem;font-weight:700;gap:.75rem}.alert90s-toggle-label input[type=checkbox]{display:none}.alert90s-toggle-slider{background-color:#f87171;border:4px solid #000;box-shadow:inset 3px 3px 0 0 rgba(0,0,0,.1);height:1.5rem;position:relative;transition:background-color .2s;width:3rem}.alert90s-toggle-slider:before{background-color:#fff;border-right:4px solid #000;content:"";height:100%;left:0;position:absolute;top:0;transition:transform .2s;width:1rem}.alert90s-toggle-label input[type=checkbox]:checked+.alert90s-toggle-slider{background-color:#4ade80}.alert90s-toggle-label input[type=checkbox]:checked+.alert90s-toggle-slider:before{border-left:4px solid #000;transform:translateX(1.5rem)}.alert90s-validation-message{background-color:#fef2f2;border:4px solid #000;border-left:8px solid #ef4444;color:#ef4444;display:none;font-size:.875rem;font-weight:700;margin-bottom:1.5rem;padding:.75rem;text-align:left;width:100%}.alert90s-box[dir=rtl] .alert90s-validation-message{border-left-color:#000;border-left-width:4px;border-right-color:#ef4444;border-right-width:8px;text-align:right}.alert90s-actions{display:flex;flex-direction:column;gap:1rem;justify-content:center;width:100%}@media (min-width:640px){.alert90s-actions{flex-direction:row}}.alert90s-button{align-items:center;background-color:#fff;border:4px solid #000;box-shadow:4px 4px 0 0 #000;color:#000;cursor:pointer;display:flex;font-family:inherit;font-size:.875rem;font-weight:900;gap:.5rem;justify-content:center;letter-spacing:.1em;margin:0;padding:.75rem 1rem;text-transform:uppercase;transition:background-color .1s;width:100%}@media (min-width:640px){.alert90s-button{flex:1;min-width:100px;width:auto}}.alert90s-button:active{box-shadow:0 0 0 0 #000;transform:translate(4px,4px)}.alert90s-button:focus{outline:2px dashed #000;outline-offset:4px}.alert90s-button.cancel{background-color:#f87171}.alert90s-button.cancel:hover{background-color:#fca5a5}.alert90s-button.deny{background-color:#fb923c}.alert90s-button.deny:hover{background-color:#fdba74}.alert90s-button.confirm{background-color:#4ade80}.alert90s-button.confirm:hover{background-color:#86efac}.alert90s-footer{border-top:4px solid #000;color:#475569;font-size:.75rem;font-weight:700;margin-top:1.5rem;padding-top:1rem;width:100%}.alert90s-footer a{color:#2563eb;text-decoration:underline;text-decoration-thickness:2px}.alert90s-footer a:hover{background-color:#bfdbfe}.alert90s-progress-bar{animation:alert90s-progress linear forwards;background-color:#000;bottom:0;height:6px;left:0;position:absolute;width:100%}.alert90s-loader{display:flex;padding:1rem 0}.alert90s-loader,.alert90s-spinner{align-items:center;justify-content:center}.alert90s-spinner{display:inline-flex}.alert90s-spinner.hourglass{animation:alert90s-hourglass 2s ease-in-out infinite;font-size:2.5rem;line-height:1}.alert90s-spinner.ascii{font-family:monospace;font-size:2rem;font-weight:700}.alert90s-spinner.ascii:after{animation:alert90s-ascii .5s steps(4) infinite;content:"\|"}.alert90s-spinner.blinking{font-family:monospace;font-size:1.5rem;font-weight:700;letter-spacing:.1em}.alert90s-spinner.blinking .cursor{animation:alert90s-blink 1s step-end infinite}.alert90s-spinner.progress{background-color:#cbd5e1;border:2px solid #000;box-shadow:inset 2px 2px 0 0 #64748b,inset -2px -2px 0 0 #f8fafc;height:24px;overflow:hidden;padding:2px;position:relative;width:200px}.alert90s-spinner.progress:before{animation:alert90s-marquee 1.5s linear infinite;background-color:#1d4ed8;background-image:repeating-linear-gradient(90deg,#1d4ed8,#1d4ed8 10px,transparent 0,transparent 12px);content:"";height:calc(100% - 4px);left:0;position:absolute;top:2px;width:40%}.alert90s-spinner.segmented{display:flex;justify-content:center;width:100%}.alert90s-spinner.segmented svg{height:auto;max-width:100%}.a90s-seg-1{animation:a90s-op1 6s infinite}.a90s-seg-2{animation:a90s-op2 6s infinite}.a90s-seg-3{animation:a90s-op3 6s infinite}.a90s-seg-4{animation:a90s-op4 6s infinite}.a90s-seg-5{animation:a90s-op5 6s infinite}.a90s-seg-6{animation:a90s-op6 6s infinite}.a90s-seg-7{animation:a90s-op7 6s infinite}.a90s-seg-8{animation:a90s-op8 6s infinite}.a90s-seg-9{animation:a90s-op9 6s infinite}.a90s-seg-10{animation:a90s-op10 6s infinite}@keyframes a90s-op1{0%,9%{opacity:0}10%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op2{0%,17%{opacity:0}18%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op3{0%,25%{opacity:0}26%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op4{0%,33%{opacity:0}34%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op5{0%,41%{opacity:0}42%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op6{0%,49%{opacity:0}50%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op7{0%,57%{opacity:0}58%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op8{0%,65%{opacity:0}66%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op9{0%,73%{opacity:0}74%,92%{opacity:1}92.1%,to{opacity:0}}@keyframes a90s-op10{0%,81%{opacity:0}82%,92%{opacity:1}92.1%,to{opacity:0}}.a90s-fl-1{animation:a90s-fl1 6s infinite}.a90s-fl-2{animation:a90s-fl2 6s infinite}.a90s-fl-3{animation:a90s-fl3 6s infinite}.a90s-fl-4{animation:a90s-fl4 6s infinite}.a90s-fl-5{animation:a90s-fl5 6s infinite}.a90s-fl-6{animation:a90s-fl6 6s infinite}.a90s-fl-7{animation:a90s-fl7 6s infinite}.a90s-fl-8{animation:a90s-fl8 6s infinite}.a90s-fl-9{animation:a90s-fl9 6s infinite}.a90s-fl-10{animation:a90s-fl10 6s infinite}@keyframes a90s-fl1{0%,9%{fill:#ff6b35}10%,13%{fill:#fff}13.1%,to{fill:#ff6b35}}@keyframes a90s-fl2{0%,17%{fill:#ff6b35}18%,21%{fill:#fff}21.1%,to{fill:#ff6b35}}@keyframes a90s-fl3{0%,25%{fill:#ff6b35}26%,29%{fill:#fff}29.1%,to{fill:#ff6b35}}@keyframes a90s-fl4{0%,33%{fill:#ff6b35}34%,37%{fill:#fff}37.1%,to{fill:#ff6b35}}@keyframes a90s-fl5{0%,41%{fill:#ff6b35}42%,45%{fill:#fff}45.1%,to{fill:#ff6b35}}@keyframes a90s-fl6{0%,49%{fill:#ff6b35}50%,53%{fill:#fff}53.1%,to{fill:#ff6b35}}@keyframes a90s-fl7{0%,57%{fill:#ff6b35}58%,61%{fill:#fff}61.1%,to{fill:#ff6b35}}@keyframes a90s-fl8{0%,65%{fill:#ff6b35}66%,69%{fill:#fff}69.1%,to{fill:#ff6b35}}@keyframes a90s-fl9{0%,73%{fill:#ff6b35}74%,77%{fill:#fff}77.1%,to{fill:#ff6b35}}@keyframes a90s-fl10{0%,81%{fill:#ff6b35}82%,85%{fill:#fff}85.1%,to{fill:#ff6b35}}.a90s-txt-0{animation:a90s-t0 6s infinite}.a90s-txt-10{animation:a90s-t10 6s infinite;opacity:0}.a90s-txt-20{animation:a90s-t20 6s infinite;opacity:0}.a90s-txt-30{animation:a90s-t30 6s infinite;opacity:0}.a90s-txt-40{animation:a90s-t40 6s infinite;opacity:0}.a90s-txt-50{animation:a90s-t50 6s infinite;opacity:0}.a90s-txt-60{animation:a90s-t60 6s infinite;opacity:0}.a90s-txt-70{animation:a90s-t70 6s infinite;opacity:0}.a90s-txt-80{animation:a90s-t80 6s infinite;opacity:0}.a90s-txt-90{animation:a90s-t90 6s infinite;opacity:0}.a90s-txt-100{animation:a90s-t100 6s infinite;opacity:0}@keyframes a90s-t0{0%,9.9%{opacity:1}10%,91.9%{opacity:0}92%,to{opacity:1}}@keyframes a90s-t10{0%,9.9%{opacity:0}10%,17.9%{opacity:1}18%,to{opacity:0}}@keyframes a90s-t20{0%,17.9%{opacity:0}18%,25.9%{opacity:1}26%,to{opacity:0}}@keyframes a90s-t30{0%,25.9%{opacity:0}26%,33.9%{opacity:1}34%,to{opacity:0}}@keyframes a90s-t40{0%,33.9%{opacity:0}34%,41.9%{opacity:1}42%,to{opacity:0}}@keyframes a90s-t50{0%,41.9%{opacity:0}42%,49.9%{opacity:1}50%,to{opacity:0}}@keyframes a90s-t60{0%,49.9%{opacity:0}50%,57.9%{opacity:1}58%,to{opacity:0}}@keyframes a90s-t70{0%,57.9%{opacity:0}58%,65.9%{opacity:1}66%,to{opacity:0}}@keyframes a90s-t80{0%,65.9%{opacity:0}66%,73.9%{opacity:1}74%,to{opacity:0}}@keyframes a90s-t90{0%,73.9%{opacity:0}74%,81.9%{opacity:1}82%,to{opacity:0}}@keyframes a90s-t100{0%,81.9%{opacity:0}82%,91.9%{opacity:1}92%,to{opacity:0}}@keyframes alert90s-hourglass{0%{transform:rotate(0)}25%{transform:rotate(180deg)}50%{transform:rotate(180deg)}75%{transform:rotate(1turn)}to{transform:rotate(1turn)}}@keyframes alert90s-ascii{0%{content:"\|"}25%{content:"/"}50%{content:"-"}75%{content:"\\\\"}to{content:"\|"}}@keyframes alert90s-blink{50%{opacity:0}}@keyframes alert90s-marquee{0%{transform:translateX(-100%)}to{transform:translateX(250px)}}@keyframes alert90s-progress{0%{width:100%}to{width:0}}@keyframes alert90s-fade-in{0%{opacity:0}to{opacity:1}}@keyframes alert90s-pop-in{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes alert90s-fade-out{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.95) translateY(10px)}}@keyframes alert90s-toast-slide-in{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.alert90s-toast-container{display:flex;gap:10px;padding:10px;pointer-events:none;position:fixed;z-index:10000}.alert90s-toast-top-start{flex-direction:column;left:0;top:0}.alert90s-toast-top{flex-direction:column;left:50%;top:0;transform:translateX(-50%)}.alert90s-toast-top-end{flex-direction:column;right:0;top:0}.alert90s-toast-center-start{flex-direction:column;left:0;top:50%;transform:translateY(-50%)}.alert90s-toast-center{flex-direction:column;left:50%;top:50%;transform:translate(-50%,-50%)}.alert90s-toast-center-end{flex-direction:column;right:0;top:50%;transform:translateY(-50%)}.alert90s-toast-bottom-start{bottom:0;flex-direction:column-reverse;left:0}.alert90s-toast-bottom{bottom:0;flex-direction:column-reverse;left:50%;transform:translateX(-50%)}.alert90s-toast-bottom-end{bottom:0;flex-direction:column-reverse;right:0}.alert90s-box.alert90s-toast{align-items:stretch;bottom:auto!important;box-shadow:6px 6px 0 0 #000;flex-direction:row;left:auto!important;margin:0;max-width:100%;min-width:250px;padding:0;pointer-events:auto;position:relative!important;right:auto!important;top:auto!important;transform:none!important;width:auto}.alert90s-toast .alert90s-header{display:none}.alert90s-toast .alert90s-body{align-items:center;flex-direction:row;gap:1rem;padding:1rem 1.5rem}.alert90s-toast .alert90s-icon{height:2.5rem;margin-bottom:0;width:2.5rem}.alert90s-toast .alert90s-icon img,.alert90s-toast .alert90s-icon svg{height:1.25rem;width:1.25rem}.alert90s-content-wrapper{align-items:center;display:flex;flex-direction:column;width:100%}.alert90s-toast .alert90s-content-wrapper{align-items:flex-start;text-align:left}.alert90s-box.alert90s-toast[dir=rtl] .alert90s-content-wrapper{align-items:flex-end;text-align:right}.alert90s-toast .alert90s-title{font-size:1rem;margin-bottom:.25rem}.alert90s-toast .alert90s-html,.alert90s-toast .alert90s-message{font-size:.875rem;margin-bottom:0}.alert90s-toast-close{align-items:center;background-color:#ef4444;border:2px solid #000;box-shadow:none;cursor:pointer;display:flex;height:1.5rem;justify-content:center;margin:0;margin-inline-start:auto;padding:0;transition:transform .1s,background-color .1s;width:1.5rem}.alert90s-toast-close span{color:#000;display:block;font-size:10px;font-weight:700;line-height:1}.alert90s-toast-close:hover{background-color:#f87171;transform:scale(1.1)}.btn90s{align-items:center;background-color:#fff;border:4px solid #000;box-shadow:4px 4px 0 0 #000;color:#000;cursor:pointer;display:inline-flex;font-family:inherit;font-size:1rem;font-weight:900;justify-content:center;letter-spacing:.05em;margin:.25rem;padding:.75rem 1.5rem;text-decoration:none;text-transform:uppercase;transition:transform .1s,box-shadow .1s,background-color .1s}.btn90s:active{box-shadow:0 0 0 0 #000;transform:translate(4px,4px)}.btn90s:focus-visible{outline:2px dashed #000;outline-offset:4px}.btn90s.primary{background-color:#00f0ff}.btn90s.primary:hover{background-color:#66f6ff}.btn90s.success{background-color:#4ade80}.btn90s.success:hover{background-color:#86efac}.btn90s.warning{background-color:#ffc900}.btn90s.warning:hover{background-color:#ffe066}.btn90s.danger{background-color:#ff90e8}.btn90s.danger:hover{background-color:#ffbaf0}.btn90s.dark{background-color:#000;border-color:#000;color:#fff}.btn90s.dark:hover{background-color:#333}.btn90s.sm{border-width:3px;box-shadow:3px 3px 0 0 #000;font-size:.875rem;padding:.5rem 1rem}.btn90s.sm:active{transform:translate(3px,3px)}.btn90s.lg{border-width:5px;box-shadow:6px 6px 0 0 #000;font-size:1.25rem;padding:1rem 2rem}.btn90s.lg:active{transform:translate(6px,6px)}.alert90s-tooltip{animation:tooltip-pop .15s cubic-bezier(.175,.885,.32,1.275) forwards;background-color:#fff;border:3px solid #000;box-shadow:4px 4px 0 0 #000;color:#000;display:none;font-family:inherit;font-size:.875rem;font-weight:700;max-width:300px;padding:.5rem 1rem;pointer-events:none;position:absolute;white-space:pre-wrap;z-index:100000}.alert90s-tooltip.show{display:block}.alert90s-tooltip.c-yellow{background-color:#fef08a}.alert90s-tooltip.c-cyan{background-color:#00f0ff}.alert90s-tooltip.c-pink{background-color:#ff90e8}.alert90s-tooltip.c-base{background-color:#fff}.alert90s-tooltip.c-dark{background-color:#000;color:#fff}.alert90s-tooltip:after{border-style:solid;content:"";height:0;position:absolute;width:0}.alert90s-tooltip.pos-top:after{border-color:#000 transparent transparent;border-width:8px 8px 0;bottom:-8px;left:50%;margin-left:-8px}.alert90s-tooltip.pos-bottom:after{border-color:transparent transparent #000;border-width:0 8px 8px;left:50%;margin-left:-8px;top:-8px}.alert90s-tooltip.pos-left:after{border-color:transparent transparent transparent #000;border-width:8px 0 8px 8px;margin-top:-8px;right:-8px;top:50%}.alert90s-tooltip.pos-right:after{border-color:transparent #000 transparent transparent;border-width:8px 8px 8px 0;left:-8px;margin-top:-8px;top:50%}@keyframes tooltip-pop{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.alert90s-dark.alert90s-box{background-color:#2a2a35;color:#eaeaea}.alert90s-dark .alert90s-title{color:#fff;text-shadow:2px 2px 0 #000}.alert90s-dark .alert90s-html,.alert90s-dark .alert90s-message{color:#d4d4d4}.alert90s-dark .alert90s-html a{color:#60a5fa}.alert90s-dark .alert90s-input,.alert90s-dark select.alert90s-select{background-color:#1a1a24;border-color:#000;box-shadow:inset 4px 4px 0 0 rgba(0,0,0,.5);color:#fff}.alert90s-dark .alert90s-input:focus{border-color:#0ff}.alert90s-dark .alert90s-button{background-color:#ececec;color:#000}.alert90s-dark .alert90s-button.cancel{background-color:#f87171}.alert90s-dark .alert90s-button.deny{background-color:#fb923c}.alert90s-dark .alert90s-button.confirm{background-color:#4ade80}.alert90s-dark .alert90s-checkbox-label .cb-box{fill:#1a1a24;stroke:#555}.alert90s-dark .alert90s-checkbox-label input[type=checkbox]:checked~.alert90s-cb-svg .cb-box{fill:#2a2a35}.alert90s-dark .alert90s-checkbox-label .cb-shadow{fill:#555}.alert90s-dark .alert90s-cb-text{color:#eaeaea}.alert90s-dark .alert90s-radio-label input[type=radio]{background-color:#1a1a24}.alert90s-dark .alert90s-radio-label input[type=radio]:checked{background-color:#0ff;box-shadow:inset 0 0 0 4px #000}.alert90s-theme-checkbox{display:none}.alert90s-theme-wrapper{cursor:pointer;display:inline-block;position:relative;transform:rotate(-1deg);transition:transform .1s}.alert90s-theme-wrapper:active{transform:rotate(0deg) scale(.98)}.alert90s-theme-track-shadow{fill:#000}.alert90s-theme-track-base{fill:#facc15;stroke:#000;stroke-width:6;stroke-linejoin:miter;transition:fill .5s cubic-bezier(.8,0,.2,1)}.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-track-base{fill:#1e1e26}.alert90s-theme-thumb-group{transform:translateX(0);transition:transform .5s cubic-bezier(.68,-.55,.265,1.55)}.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-thumb-group{transform:translateX(190px)}.alert90s-theme-thumb-shadow{fill:#000}.alert90s-theme-thumb-body{fill:#fff;stroke:#000;stroke-width:6;stroke-linejoin:miter;transition:fill .3s}.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-thumb-body{fill:#eaeaea}.alert90s-theme-icon-sun{opacity:1;transition:opacity 0s .25s}.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-icon-sun{opacity:0}.alert90s-theme-icon-moon{filter:drop-shadow(0 0 10px #00FFFF) drop-shadow(0 0 20px #00FFFF);opacity:0;transition:opacity 0s .25s}.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-icon-moon{opacity:1}.alert90s-theme-text-label{font-family:Impact,Arial Black,sans-serif;font-size:38px;letter-spacing:2px;pointer-events:none;user-select:none}.alert90s-theme-text-day{fill:#000;opacity:1;transition:opacity .3s ease}.alert90s-theme-text-night{fill:#0ff;opacity:0;transition:opacity .3s ease}.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-text-day{opacity:0}.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-text-night{opacity:1}.alert90s-theme-deco-accent{fill:#ff90e8;transition:fill .4s}.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-deco-accent{fill:#4ade80}');class t{static getOptions(){return this.currentOptions\|\|{}}static getPopup(){return this.currentPopup\|\|null}static getTimerLeft(){if(!this.timerEnd)return;const t=this.timerEnd-Date.now();return t>0?t:0}static isLoading(){const t=this.getPopup();if(!t)return!1;const e=t.querySelector(".alert90s-actions"),o=t.querySelector(".alert90s-loader");return e&&"none"===e.style.display\|\|!!o}static showLoading(){const e=this.getPopup();if(e){const o=e.querySelector(".alert90s-actions");o&&(o.style.display="none");let a=e.querySelector(".alert90s-loader");if(!a){a=document.createElement("div"),a.className="alert90s-loader";const r=t.currentOptions&&t.currentOptions.loaderType\|\|"hourglass";if("ascii"===r)a.innerHTML='<div class="alert90s-spinner ascii"></div>';else if("blinking"===r)a.innerHTML='<div class="alert90s-spinner blinking">LOADING<span class="cursor">_</span></div>';else if("progress"===r)a.innerHTML='<div class="alert90s-spinner progress"></div>';else if("segmented"===r){const t=[];for(let e=1;e<=10;e++){const o=5+29(e-1);t.push(`<g class="a90s-seg-${e}"><rect class="a90s-fl-${e}" x="${o}" y="6" width="25" height="28" fill="#ff6b35"/><rect x="${o}" y="6" width="25" height="28" fill="url(#a90s-dither)"/><rect x="${o}" y="6" width="25" height="28" fill="none" stroke="#000" stroke-width="2"/></g>`)}const e=[];for(let t=0;t<=10;t++)e.push(`<text x="295" y="55" class="a90s-txt-${10t}" text-anchor="end" font-size="14" font-weight="bold" fill="#000">${10t}%</text>`);a.innerHTML=`<div class="alert90s-spinner segmented"><svg viewBox="0 0 300 60" width="300" height="60"><defs><pattern id="a90s-dither" width="4" height="4" patternUnits="userSpaceOnUse"><path d="M0,0 h2 v2 h-2 Z M2,2 h2 v2 h-2 Z" fill="#000" opacity="0.3"/></pattern></defs><rect x="0" y="0" width="300" height="40" fill="#fff" stroke="#000" stroke-width="3" rx="0"/>${t.join("")}${e.join("")}</svg></div>`}else a.innerHTML='<div class="alert90s-spinner hourglass">⏳</div>';o&&o.parentNode?o.parentNode.insertBefore(a,o):e.querySelector(".alert90s-body").appendChild(a)}}}static hideLoading(){const t=this.getPopup();if(t){const e=t.querySelector(".alert90s-actions");e&&(e.style.display="");const o=t.querySelector(".alert90s-loader");o&&o.remove()}}static showValidationMessage(t){const e=this.getPopup();if(e){let o=e.querySelector(".alert90s-validation-message");if(!o){o=document.createElement("div"),o.className="alert90s-validation-message";const t=e.querySelector(".alert90s-actions");t&&t.parentNode?t.parentNode.insertBefore(o,t):e.querySelector(".alert90s-body").appendChild(o)}o.innerHTML=t,o.style.display="block"}}static resetValidationMessage(){const t=this.getPopup();if(t){const e=t.querySelector(".alert90s-validation-message");e&&(e.style.display="none")}}static getToastContainer(t){const e=`alert90s-toast-container alert90s-toast-${t}`;let o=document.querySelector(`.${e.replace(/ /g,".")}`);return o\|\|(o=document.createElement("div"),o.className=e,document.body.appendChild(o)),o}static fire(t={}){return this.show(t)}static show(e={}){return new Promise(o=>{"string"==typeof e&&(e={title:e}),this.currentOptions=e;const a={title:void 0!==e.title?e.title:"",text:e.message\|\|e.text\|\|"",html:e.html\|\|"",icon:e.type\|\|e.icon\|\|"",iconHtml:e.iconHtml\|\|"",showConfirmButton:!1!==e.showConfirmButton,showCancelButton:e.showCancelButton\|\|!1,showDenyButton:e.showDenyButton\|\|!1,showCloseButton:void 0===e.showCloseButton\|\|e.showCloseButton,loaderType:e.loaderType\|\|"hourglass",confirmButtonText:e.confirmText\|\|e.confirmButtonText\|\|"OK",cancelButtonText:e.cancelText\|\|e.cancelButtonText\|\|"Cancel",denyButtonText:e.denyText\|\|e.denyButtonText\|\|"No",confirmButtonColor:e.confirmButtonColor\|\|"",cancelButtonColor:e.cancelButtonColor\|\|"",denyButtonColor:e.denyButtonColor\|\|"",background:e.background\|\|"",color:e.color\|\|"",titleColor:e.titleColor\|\|"",iconColor:e.iconColor\|\|"",confirmButtonAriaLabel:e.confirmButtonAriaLabel\|\|"",cancelButtonAriaLabel:e.cancelButtonAriaLabel\|\|"",denyButtonAriaLabel:e.denyButtonAriaLabel\|\|"",focusConfirm:!1!==e.focusConfirm,footer:e.footer\|\|"",imageUrl:e.imageUrl\|\|"",imageWidth:e.imageWidth\|\|null,imageHeight:e.imageHeight\|\|null,imageAlt:e.imageAlt\|\|"",input:e.input\|\|null,inputPlaceholder:e.inputPlaceholder\|\|"",inputValue:e.inputValue\|\|"",inputOptions:e.inputOptions\|\|{},inputAttributes:e.inputAttributes\|\|{},showLoaderOnConfirm:e.showLoaderOnConfirm\|\|!1,preConfirm:e.preConfirm\|\|null,toast:e.toast\|\|!1,draggable:e.draggable\|\|!1,position:e.position\|\|(e.toast?"top-end":"center"),allowOutsideClick:void 0===e.allowOutsideClick\|\|e.allowOutsideClick,dir:e.dir\|\|"auto",theme:e.theme\|\|"light",showClass:e.showClass\|\|{popup:"alert90s-pop-in"},hideClass:e.hideClass\|\|{popup:"alert90s-fade-out"},timer:e.timer\|\|null,timerProgressBar:e.timerProgressBar\|\|!1,didOpen:e.didOpen\|\|null,willClose:e.willClose\|\|null};let r=null;a.toast\|\|(r=document.createElement("div"),r.className=`alert90s-overlay alert90s-pos-${a.position}`,r.addEventListener("mousedown",t=>{if(t.target===r){("function"==typeof a.allowOutsideClick?a.allowOutsideClick():a.allowOutsideClick)&&b({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"backdrop"})}}));const i=document.createElement("div");i.className="alert90s-box",a.toast&&i.classList.add("alert90s-toast");let s=a.theme;"auto"===s&&(s=window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"),"dark"===s&&i.classList.add("alert90s-dark"),"rtl"===document.dir\|\|"rtl"===a.dir\|\|a.position.includes("start")?i.setAttribute("dir","auto"===a.dir?document.dir\|\|"ltr":a.dir):i.setAttribute("dir",a.dir),a.showClass.popup&&"alert90s-pop-in"!==a.showClass.popup&&(i.style.animation="none",i.className=`alert90s-box ${a.showClass.popup}`),a.background&&(i.style.backgroundColor=a.background),a.color&&(i.style.color=a.color),a.draggable&&i.classList.add("is-draggable"),a.toast\|\|(this.currentPopup=i);const n=document.createElement("div");n.className="alert90s-body";const l=document.createElement("div");l.className="alert90s-header",a.draggable&&l.classList.add("draggable");let c="";if(a.showCloseButton&&(c='\n <button class="alert90s-close-btn" id="alert90s-close" aria-label="Close">\n <span>✕</span>\n </button>\n '),l.innerHTML=`\n <div class="alert90s-header-left">\n <div class="alert90s-header-dot"></div>\n <div class="alert90s-header-dot"></div>\n <div class="alert90s-header-dot"></div>\n </div>\n <div class="alert90s-header-right">\n <span class="alert90s-header-title">SYS.REQ</span>\n ${c}\n </div>\n `,a.draggable){let t,e,o,a,r=!1;l.addEventListener("mousedown",s=>{if(s.target.closest("#alert90s-close"))return;r=!0,t=s.clientX,e=s.clientY;const n=i.getBoundingClientRect();i.style.transform="none",i.style.animation="none",o=n.left,a=n.top,i.style.left=o+"px",i.style.top=a+"px",i.style.margin="0",document.body.style.userSelect="none"}),document.addEventListener("mousemove",s=>{r&&(i.style.left=o+(s.clientX-t)+"px",i.style.top=a+(s.clientY-e)+"px")}),document.addEventListener("mouseup",()=>{r&&(r=!1,document.body.style.userSelect="")})}let d=null;if(a.timer&&a.timerProgressBar&&(d=document.createElement("div"),d.className="alert90s-progress-bar",d.style.animationDuration=`${a.timer}ms`,i.appendChild(d)),a.imageUrl){const t=document.createElement("div");t.className="alert90s-image-container";const e=document.createElement("img");e.src=a.imageUrl,a.imageAlt&&(e.alt=a.imageAlt);let o="";a.imageWidth&&(o+=`width: ${a.imageWidth}px; max-width: 100%; `),a.imageHeight&&(o+=`height: ${a.imageHeight}px; `),o&&t.setAttribute("style",o),t.appendChild(e),n.appendChild(t)}if(a.icon){const t=document.createElement("div"),e="error"===a.icon?"danger":a.icon;t.className=`alert90s-icon ${e}`;let o="";if(a.iconHtml?o=`<div class="alert90s-icon-custom">${a.iconHtml}</div>`:"warning"===a.icon?o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>':"danger"===a.icon\|\|"error"===a.icon?o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>':"info"===a.icon?o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg>':"success"===a.icon?o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg>':"question"===a.icon&&(o='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>'),t.innerHTML=o,a.iconColor&&(t.style.color=a.iconColor,t.style.borderColor=a.iconColor,!a.iconHtml)){const e=t.querySelector("svg");e&&(e.style.stroke=a.iconColor)}o&&n.appendChild(t)}const p=document.createElement("div");if(p.className="alert90s-content-wrapper",a.title){const t=document.createElement("h2");t.className="alert90s-title",t.innerHTML=a.title,a.titleColor&&(t.style.color=a.titleColor),p.appendChild(t)}if(a.html){const t=document.createElement("div");t.className="alert90s-html",t.innerHTML=a.html,a.color&&(t.style.color=a.color),p.appendChild(t)}else if(a.text){const t=document.createElement("p");t.className="alert90s-message",t.textContent=a.text,a.color&&(t.style.color=a.color),p.appendChild(t)}if((a.title\|\|a.html\|\|a.text)&&n.appendChild(p),a.toast&&a.showCloseButton){const t=document.createElement("button");t.className="alert90s-toast-close",t.innerHTML="<span>✕</span>",t.onclick=()=>b({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"close"}),n.appendChild(t)}let f=null;if(a.input){const t=document.createElement("div");if(t.className="alert90s-input-container","select"===a.input){if(f=document.createElement("select"),f.className="alert90s-input alert90s-select",a.inputPlaceholder){const t=document.createElement("option");t.value="",t.textContent=a.inputPlaceholder,t.disabled=!0,t.selected=!0,f.appendChild(t)}for(const[t,e]of Object.entries(a.inputOptions)){const o=document.createElement("option");o.value=t,o.textContent=e,t===a.inputValue&&(o.selected=!0),f.appendChild(o)}t.appendChild(f)}else if("radio"===a.input){const e=document.createElement("div");e.className="alert90s-radio-group";for(const[t,o]of Object.entries(a.inputOptions)){const r=document.createElement("label");r.className="alert90s-radio-label";const i=document.createElement("input");i.type="radio",i.name="alert90s-radio",i.value=t,t===a.inputValue&&(i.checked=!0);const s=document.createElement("span");s.textContent=o,r.appendChild(i),r.appendChild(s),e.appendChild(r)}f=e,t.appendChild(e)}else if("checkbox"===a.input\|\|"toggle"===a.input){const e=document.createElement("label");if(e.className="toggle"===a.input?"alert90s-toggle-label":"alert90s-checkbox-label",f=document.createElement("input"),f.type="checkbox",f.checked=!!a.inputValue,"toggle"===a.input){const t=document.createElement("div");if(t.className="alert90s-toggle-slider",e.appendChild(f),e.appendChild(t),a.inputPlaceholder){const t=document.createElement("span");t.textContent=a.inputPlaceholder,e.appendChild(t)}}else{const t="http://www.w3.org/2000/svg",o=document.createElementNS(t,"svg");o.setAttribute("class","alert90s-cb-svg"),o.setAttribute("viewBox","0 0 100 100"),o.setAttribute("width","36"),o.setAttribute("height","36");const r=document.createElementNS(t,"rect");r.setAttribute("class","cb-shadow"),r.setAttribute("x","12"),r.setAttribute("y","12"),r.setAttribute("width","80"),r.setAttribute("height","80"),r.setAttribute("fill","#000000");const i=document.createElementNS(t,"rect");i.setAttribute("class","cb-box"),i.setAttribute("x","4"),i.setAttribute("y","4"),i.setAttribute("width","80"),i.setAttribute("height","80"),i.setAttribute("fill","#e4e0d7"),i.setAttribute("stroke","#000000"),i.setAttribute("stroke-width","8");const s=document.createElementNS(t,"path");s.setAttribute("class","cb-check"),s.setAttribute("d","M 22 48 L 40 68 L 82 20"),s.setAttribute("fill","none"),s.setAttribute("stroke","#ff6b35"),s.setAttribute("stroke-width","14"),s.setAttribute("stroke-linecap","square"),s.setAttribute("stroke-linejoin","miter"),o.appendChild(r),o.appendChild(i),o.appendChild(s);const n=document.createElement("span");n.className="alert90s-cb-text",n.textContent=a.inputPlaceholder\|\|"Check me",e.appendChild(f),e.appendChild(o),e.appendChild(n)}t.appendChild(e)}else"textarea"===a.input?(f=document.createElement("textarea"),f.className="alert90s-input",a.inputPlaceholder&&(f.placeholder=a.inputPlaceholder),a.inputValue&&(f.value=a.inputValue),t.appendChild(f)):(f=document.createElement("input"),f.type=a.input,f.className="alert90s-input",a.inputPlaceholder&&(f.placeholder=a.inputPlaceholder),a.inputValue&&(f.value=a.inputValue),t.appendChild(f));if(a.inputAttributes&&f&&!["radio"].includes(a.input))for(const[t,e]of Object.entries(a.inputAttributes))f.setAttribute(t,e);n.appendChild(t)}const h=document.createElement("div");h.className="alert90s-actions";let m=null,u=null;const b=t=>{u&&clearTimeout(u),a.willClose&&a.willClose(),i.style.animation="none","alert90s-fade-out"===a.hideClass.popup?(i.style.animation="alert90s-fade-out 0.2s forwards",r&&(r.style.transition="opacity 0.2s",r.style.opacity="0")):i.className=`alert90s-box ${a.hideClass.popup}`,setTimeout(()=>{a.toast?i.parentNode&&i.parentNode.removeChild(i):r&&document.body.contains(r)&&document.body.removeChild(r),o(t)},200)},g=async()=>{let e=!0;if("radio"===a.input){const t=f.querySelector('input[type="radio"]:checked');e=t?t.value:null}else"checkbox"===a.input\|\|"toggle"===a.input?e=f.checked:f&&(e=f.value);if(a.preConfirm){t.resetValidationMessage(),a.showLoaderOnConfirm&&t.showLoading();try{const o=await Promise.resolve(a.preConfirm(e));if(!1===o)return void t.hideLoading();void 0!==o&&o!==e&&(e=o);const r=i.querySelector(".alert90s-validation-message");if(r&&"block"===r.style.display)return void t.hideLoading()}catch(e){return t.showValidationMessage(`Request failed: ${e}`),void t.hideLoading()}}b({isConfirmed:!0,isDenied:!1,isDismissed:!1,value:e})};if(a.showCancelButton){const t=document.createElement("button");t.className="alert90s-button cancel",t.innerHTML=a.cancelButtonText,a.cancelButtonAriaLabel&&t.setAttribute("aria-label",a.cancelButtonAriaLabel),a.cancelButtonColor&&(t.style.backgroundColor=a.cancelButtonColor),t.onclick=()=>b({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"cancel"}),h.appendChild(t)}if(a.showDenyButton){const t=document.createElement("button");t.className="alert90s-button deny",t.innerHTML=a.denyButtonText,a.denyButtonAriaLabel&&t.setAttribute("aria-label",a.denyButtonAriaLabel),a.denyButtonColor&&(t.style.backgroundColor=a.denyButtonColor),t.onclick=()=>b({isConfirmed:!1,isDenied:!0,isDismissed:!1}),h.appendChild(t)}if(a.showConfirmButton){const t=document.createElement("button");t.className="alert90s-button confirm",t.innerHTML=a.confirmButtonText,a.confirmButtonAriaLabel&&t.setAttribute("aria-label",a.confirmButtonAriaLabel),a.confirmButtonColor&&(t.style.backgroundColor=a.confirmButtonColor),t.onclick=g,h.appendChild(t),m=t}if((a.showCancelButton\|\|a.showDenyButton\|\|a.showConfirmButton)&&n.appendChild(h),a.footer){const t=document.createElement("div");t.className="alert90s-footer",t.innerHTML=a.footer,n.appendChild(t)}if(i.appendChild(l),i.appendChild(n),a.toast){const e=t.getToastContainer(a.position);i.style.animation="alert90s-toast-slide-in 0.3s ease-out",e.appendChild(i)}else r.appendChild(i);if(a.showCloseButton&&!a.toast){const t=l.querySelector("#alert90s-close");t&&(t.onclick=()=>b({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"close"}))}a.toast\|\|document.body.appendChild(r),a.focusConfirm&&m&&setTimeout(()=>{f?f.focus():m.focus()},50),a.didOpen&&setTimeout(()=>{a.didOpen()},0),a.timer&&(this.timerEnd=Date.now()+a.timer,u=setTimeout(()=>{b({isConfirmed:!1,isDenied:!1,isDismissed:!0,dismiss:"timer"})},a.timer))})}static initTooltips(){this._tooltipsInitialized\|\|(this._tooltipsInitialized=!0,this._tooltipEl=document.createElement("div"),this._tooltipEl.className="alert90s-tooltip",document.body.appendChild(this._tooltipEl),document.addEventListener("mouseover",this._handleTooltipMouseOver.bind(this)),document.addEventListener("mouseout",this._handleTooltipMouseOut.bind(this)),document.addEventListener("focusin",this._handleTooltipMouseOver.bind(this)),document.addEventListener("focusout",this._handleTooltipMouseOut.bind(this)))}static _handleTooltipMouseOver(t){const e=t.target.closest("[data-alert90s-tooltip]");if(!e)return;const o=e.getAttribute("data-alert90s-tooltip");if(!o)return;const a=e.getAttribute("data-alert90s-position")\|\|"top",r=e.getAttribute("data-alert90s-color")\|\|"yellow";this._tooltipEl.innerHTML=o,this._tooltipEl.className=`alert90s-tooltip pos-${a} c-${r} show`;const i=e.getBoundingClientRect(),s=this._tooltipEl.getBoundingClientRect(),n=10;let l=0,c=0;switch(a){case"top":l=i.top-s.height-n,c=i.left+i.width/2-s.width/2;break;case"bottom":l=i.bottom+n,c=i.left+i.width/2-s.width/2;break;case"left":l=i.top+i.height/2-s.height/2,c=i.left-s.width-n;break;case"right":l=i.top+i.height/2-s.height/2,c=i.right+n}c<n&&(c=n),l<n&&(l=n),c+s.width>window.innerWidth-n&&(c=window.innerWidth-s.width-n),this._tooltipEl.style.top=`${l+window.scrollY}px`,this._tooltipEl.style.left=`${c+window.scrollX}px`}static _handleTooltipMouseOut(t){const e=t.target.closest("[data-alert90s-tooltip]");e&&setTimeout(()=>{this._tooltipEl.matches(":hover")\|\|e.matches(":hover")\|\|e.contains(document.activeElement)\|\|this._tooltipEl.classList.remove("show")},10)}static renderThemeToggle(t,e={}){const o=document.querySelector(t);if(!o)return null;const a=`\n <label class="alert90s-theme-wrapper" aria-label="Neo Brutalist Theme Switcher" style="width: ${e.width\|\|"100%"}; height: auto; aspect-ratio: 5 / 2;">\n <input type="checkbox" class="alert90s-theme-checkbox" ${e.isDark\|\|!1?"checked":""} />\n \n <svg viewBox="0 0 300 120" style="width: 100%; height: 100%; overflow: visible;">\n \x3c!-- HARD OFFSET SHADOW --\x3e\n <rect class="alert90s-theme-track-shadow" x="18" y="18" width="280" height="100" />\n \x3c!-- MAIN TRACK --\x3e\n <rect class="alert90s-theme-track-base" x="10" y="10" width="280" height="100" />\n\n \x3c!-- DECORATIVE 90S UI ELEMENTS --\x3e\n <g class="alert90s-theme-deco-elements" stroke="#000" stroke-width="2">\n <circle cx="25" cy="25" r="4" fill="#FFF" />\n <line x1="23" y1="23" x2="27" y2="27" />\n <circle cx="275" cy="25" r="4" fill="#FFF" />\n <line x1="273" y1="27" x2="277" y2="23" />\n <circle cx="25" cy="95" r="4" fill="#FFF" />\n <line x1="23" y1="95" x2="27" y2="95" />\n <circle cx="275" cy="95" r="4" fill="#FFF" />\n <line x1="275" y1="93" x2="275" y2="97" />\n \n <line x1="120" y1="20" x2="120" y2="35" stroke-width="3" />\n <line x1="128" y1="20" x2="128" y2="35" stroke-width="5" />\n <line x1="138" y1="20" x2="138" y2="35" stroke-width="2" />\n <line x1="145" y1="20" x2="145" y2="35" stroke-width="6" />\n </g>\n\n \x3c!-- DAY / NIGHT TEXT --\x3e\n <text class="alert90s-theme-text-label alert90s-theme-text-night" x="40" y="75">NIGHT</text>\n <text class="alert90s-theme-text-label alert90s-theme-text-day" x="190" y="75">DAY</text>\n\n \x3c!-- NEON DECORATIVE STICKER --\x3e\n <rect class="alert90s-theme-deco-accent" x="120" y="85" width="60" height="15" stroke="#000" stroke-width="3" />\n <text x="125" y="96" font-size="10" font-weight="bold" fill="#000" font-family="sans-serif">SYS.UI</text>\n\n \x3c!-- SLIDING THUMB GROUP --\x3e\n <g class="alert90s-theme-thumb-group">\n \x3c!-- Thumb Shadow --\x3e\n <rect class="alert90s-theme-thumb-shadow" x="23" y="23" width="80" height="80" />\n \x3c!-- Thumb Body --\x3e\n <rect class="alert90s-theme-thumb-body" x="15" y="15" width="80" height="80" />\n \n \x3c!-- SUN ICON --\x3e\n <g class="alert90s-theme-icon-sun">\n <rect x="40" y="40" width="30" height="30" fill="#facc15" stroke="#000" stroke-width="4" />\n <rect x="48" y="48" width="14" height="14" fill="#ef4444" stroke="#000" stroke-width="2" />\n <rect x="50" y="20" width="10" height="10" fill="#ef4444" stroke="#000" stroke-width="4" />\n <rect x="50" y="80" width="10" height="10" fill="#ef4444" stroke="#000" stroke-width="4" />\n <rect x="20" y="50" width="10" height="10" fill="#ef4444" stroke="#000" stroke-width="4" />\n <rect x="80" y="50" width="10" height="10" fill="#ef4444" stroke="#000" stroke-width="4" />\n <rect x="25" y="25" width="10" height="10" fill="#facc15" stroke="#000" stroke-width="4" />\n <rect x="75" y="25" width="10" height="10" fill="#facc15" stroke="#000" stroke-width="4" />\n <rect x="25" y="75" width="10" height="10" fill="#facc15" stroke="#000" stroke-width="4" />\n <rect x="75" y="75" width="10" height="10" fill="#facc15" stroke="#000" stroke-width="4" />\n </g>\n\n \x3c!-- MOON ICON --\x3e\n <g class="alert90s-theme-icon-moon">\n <path fill="#000" transform="translate(3, 3)" d="M 60 30 v -5 h 10 v 5 h 5 v 10 h 5 v 30 h -5 v 10 h -5 v 5 h -10 v -5 h -5 v -5 h 5 v -5 h 5 v -20 h -5 v -5 h -5 v -10 h 5 v -5 Z" />\n <path fill="#00FFFF" stroke="#000" stroke-width="3" stroke-linejoin="miter" d="M 60 30 v -5 h 10 v 5 h 5 v 10 h 5 v 30 h -5 v 10 h -5 v 5 h -10 v -5 h -5 v -5 h 5 v -5 h 5 v -20 h -5 v -5 h -5 v -10 h 5 v -5 Z" />\n <rect x="70" y="40" width="5" height="5" fill="#FFFFFF" opacity="0.8" />\n <rect x="65" y="70" width="5" height="5" fill="#FFFFFF" opacity="0.8" />\n </g>\n </g>\n </svg>\n </label>\n `;o.innerHTML=a;return o.querySelector(".alert90s-theme-checkbox").addEventListener("change",t=>{"function"==typeof e.onChange&&e.onChange(t.target.checked)}),o}}return"undefined"!=typeof window&&(window.Alert90s=t,document.addEventListener("DOMContentLoaded",()=>{t.initTooltips()})),t});

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "alert90s",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "description": "Neo Brutalism 90s style JS alert library",
   "main": "dist/alert90s.min.js",
   "files": [

package/src/index.js CHANGED Viewed

@@ -38,6 +38,18 @@ class Alert90s {
           loader.innerHTML = '<div class="alert90s-spinner blinking">LOADING<span class="cursor">_</span></div>';
         } else if (type === 'progress') {
           loader.innerHTML = '<div class="alert90s-spinner progress"></div>';
+        } else if (type === 'segmented') {
+          // Build 10-segment SVG progress bar
+          const segs = [];
+          for (let i = 1; i <= 10; i++) {
+            const x = 5 + (i - 1) * 29;
+            segs.push(`<g class="a90s-seg-${i}"><rect class="a90s-fl-${i}" x="${x}" y="6" width="25" height="28" fill="#ff6b35"/><rect x="${x}" y="6" width="25" height="28" fill="url(#a90s-dither)"/><rect x="${x}" y="6" width="25" height="28" fill="none" stroke="#000" stroke-width="2"/></g>`);
+          }
+          const pctTexts = [];
+          for (let i = 0; i <= 10; i++) {
+            pctTexts.push(`<text x="295" y="55" class="a90s-txt-${i * 10}" text-anchor="end" font-size="14" font-weight="bold" fill="#000">${i * 10}%</text>`);
+          }
+          loader.innerHTML = `<div class="alert90s-spinner segmented"><svg viewBox="0 0 300 60" width="300" height="60"><defs><pattern id="a90s-dither" width="4" height="4" patternUnits="userSpaceOnUse"><path d="M0,0 h2 v2 h-2 Z M2,2 h2 v2 h-2 Z" fill="#000" opacity="0.3"/></pattern></defs><rect x="0" y="0" width="300" height="40" fill="#fff" stroke="#000" stroke-width="3" rx="0"/>${segs.join('')}${pctTexts.join('')}</svg></div>`;
         } else {
           loader.innerHTML = '<div class="alert90s-spinner hourglass">⏳</div>';
         }
@@ -168,6 +180,7 @@ class Alert90s {
         // Display options
         dir: options.dir || 'auto', // 'rtl', 'ltr', 'auto'
+        theme: options.theme || 'light', // 'light', 'dark', 'auto'
         // Animations
         showClass: options.showClass || { popup: 'alert90s-pop-in' },
@@ -204,6 +217,14 @@ class Alert90s {
       box.className = 'alert90s-box';
       if (config.toast) box.classList.add('alert90s-toast');
+      let resolvedTheme = config.theme;
+      if (resolvedTheme === 'auto') {
+        resolvedTheme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+      }
+      if (resolvedTheme === 'dark') {
+        box.classList.add('alert90s-dark');
+      }
       // RTL support
       if (document.dir === 'rtl' || config.dir === 'rtl' || config.position.includes('start')) {
         box.setAttribute('dir', config.dir === 'auto' ? (document.dir || 'ltr') : config.dir);
@@ -462,9 +483,36 @@ class Alert90s {
                 label.appendChild(span);
              }
           } else {
+             // SVG Brutalist Checkbox
+             const svgNS = 'http://www.w3.org/2000/svg';
+             const svg = document.createElementNS(svgNS, 'svg');
+             svg.setAttribute('class', 'alert90s-cb-svg');
+             svg.setAttribute('viewBox', '0 0 100 100');
+             svg.setAttribute('width', '36');
+             svg.setAttribute('height', '36');
+             const shadow = document.createElementNS(svgNS, 'rect');
+             shadow.setAttribute('class', 'cb-shadow');
+             shadow.setAttribute('x', '12'); shadow.setAttribute('y', '12');
+             shadow.setAttribute('width', '80'); shadow.setAttribute('height', '80');
+             shadow.setAttribute('fill', '#000000');
+             const box = document.createElementNS(svgNS, 'rect');
+             box.setAttribute('class', 'cb-box');
+             box.setAttribute('x', '4'); box.setAttribute('y', '4');
+             box.setAttribute('width', '80'); box.setAttribute('height', '80');
+             box.setAttribute('fill', '#e4e0d7'); box.setAttribute('stroke', '#000000');
+             box.setAttribute('stroke-width', '8');
+             const check = document.createElementNS(svgNS, 'path');
+             check.setAttribute('class', 'cb-check');
+             check.setAttribute('d', 'M 22 48 L 40 68 L 82 20');
+             check.setAttribute('fill', 'none'); check.setAttribute('stroke', '#ff6b35');
+             check.setAttribute('stroke-width', '14'); check.setAttribute('stroke-linecap', 'square');
+             check.setAttribute('stroke-linejoin', 'miter');
+             svg.appendChild(shadow); svg.appendChild(box); svg.appendChild(check);
              const span = document.createElement('span');
+             span.className = 'alert90s-cb-text';
              span.textContent = config.inputPlaceholder || 'Check me';
              label.appendChild(inputEl);
+             label.appendChild(svg);
              label.appendChild(span);
           }
           inputContainer.appendChild(label);
@@ -746,6 +794,97 @@ class Alert90s {
         }
     }, 10);
   }
+  /**
+   * Renders a Neo-Brutalist Theme Switcher into a target container.
+   * Useful for documentations or retro-styled portfolios.
+   */
+  static renderThemeToggle(selector, options = {}) {
+    const el = document.querySelector(selector);
+    if (!el) return null;
+    const width = options.width || "100%";
+    const isDark = options.isDark || false;
+    const svgHtml = `
+      <label class="alert90s-theme-wrapper" aria-label="Neo Brutalist Theme Switcher" style="width: ${width}; height: auto; aspect-ratio: 5 / 2;">
+          <input type="checkbox" class="alert90s-theme-checkbox" ${isDark ? 'checked' : ''} />
+          <svg viewBox="0 0 300 120" style="width: 100%; height: 100%; overflow: visible;">
+              <!-- HARD OFFSET SHADOW -->
+              <rect class="alert90s-theme-track-shadow" x="18" y="18" width="280" height="100" />
+              <!-- MAIN TRACK -->
+              <rect class="alert90s-theme-track-base" x="10" y="10" width="280" height="100" />
+              <!-- DECORATIVE 90S UI ELEMENTS -->
+              <g class="alert90s-theme-deco-elements" stroke="#000" stroke-width="2">
+                  <circle cx="25" cy="25" r="4" fill="#FFF" />
+                  <line x1="23" y1="23" x2="27" y2="27" />
+                  <circle cx="275" cy="25" r="4" fill="#FFF" />
+                  <line x1="273" y1="27" x2="277" y2="23" />
+                  <circle cx="25" cy="95" r="4" fill="#FFF" />
+                  <line x1="23" y1="95" x2="27" y2="95" />
+                  <circle cx="275" cy="95" r="4" fill="#FFF" />
+                  <line x1="275" y1="93" x2="275" y2="97" />
+                  <line x1="120" y1="20" x2="120" y2="35" stroke-width="3" />
+                  <line x1="128" y1="20" x2="128" y2="35" stroke-width="5" />
+                  <line x1="138" y1="20" x2="138" y2="35" stroke-width="2" />
+                  <line x1="145" y1="20" x2="145" y2="35" stroke-width="6" />
+              </g>
+              <!-- DAY / NIGHT TEXT -->
+              <text class="alert90s-theme-text-label alert90s-theme-text-night" x="40" y="75">NIGHT</text>
+              <text class="alert90s-theme-text-label alert90s-theme-text-day" x="190" y="75">DAY</text>
+              <!-- NEON DECORATIVE STICKER -->
+              <rect class="alert90s-theme-deco-accent" x="120" y="85" width="60" height="15" stroke="#000" stroke-width="3" />
+              <text x="125" y="96" font-size="10" font-weight="bold" fill="#000" font-family="sans-serif">SYS.UI</text>
+              <!-- SLIDING THUMB GROUP -->
+              <g class="alert90s-theme-thumb-group">
+                  <!-- Thumb Shadow -->
+                  <rect class="alert90s-theme-thumb-shadow" x="23" y="23" width="80" height="80" />
+                  <!-- Thumb Body -->
+                  <rect class="alert90s-theme-thumb-body" x="15" y="15" width="80" height="80" />
+                  <!-- SUN ICON -->
+                  <g class="alert90s-theme-icon-sun">
+                      <rect x="40" y="40" width="30" height="30" fill="#facc15" stroke="#000" stroke-width="4" />
+                      <rect x="48" y="48" width="14" height="14" fill="#ef4444" stroke="#000" stroke-width="2" />
+                      <rect x="50" y="20" width="10" height="10" fill="#ef4444" stroke="#000" stroke-width="4" />
+                      <rect x="50" y="80" width="10" height="10" fill="#ef4444" stroke="#000" stroke-width="4" />
+                      <rect x="20" y="50" width="10" height="10" fill="#ef4444" stroke="#000" stroke-width="4" />
+                      <rect x="80" y="50" width="10" height="10" fill="#ef4444" stroke="#000" stroke-width="4" />
+                      <rect x="25" y="25" width="10" height="10" fill="#facc15" stroke="#000" stroke-width="4" />
+                      <rect x="75" y="25" width="10" height="10" fill="#facc15" stroke="#000" stroke-width="4" />
+                      <rect x="25" y="75" width="10" height="10" fill="#facc15" stroke="#000" stroke-width="4" />
+                      <rect x="75" y="75" width="10" height="10" fill="#facc15" stroke="#000" stroke-width="4" />
+                  </g>
+                  <!-- MOON ICON -->
+                  <g class="alert90s-theme-icon-moon">
+                      <path fill="#000" transform="translate(3, 3)" d="M 60 30 v -5 h 10 v 5 h 5 v 10 h 5 v 30 h -5 v 10 h -5 v 5 h -10 v -5 h -5 v -5 h 5 v -5 h 5 v -20 h -5 v -5 h -5 v -10 h 5 v -5 Z" />
+                      <path fill="#00FFFF" stroke="#000" stroke-width="3" stroke-linejoin="miter" d="M 60 30 v -5 h 10 v 5 h 5 v 10 h 5 v 30 h -5 v 10 h -5 v 5 h -10 v -5 h -5 v -5 h 5 v -5 h 5 v -20 h -5 v -5 h -5 v -10 h 5 v -5 Z" />
+                      <rect x="70" y="40" width="5" height="5" fill="#FFFFFF" opacity="0.8" />
+                      <rect x="65" y="70" width="5" height="5" fill="#FFFFFF" opacity="0.8" />
+                  </g>
+              </g>
+          </svg>
+      </label>
+    `;
+    el.innerHTML = svgHtml;
+    const checkbox = el.querySelector('.alert90s-theme-checkbox');
+    checkbox.addEventListener('change', (e) => {
+       if (typeof options.onChange === 'function') {
+           options.onChange(e.target.checked);
+       }
+    });
+    return el;
+  }
 }
 export default Alert90s;

package/src/styles.css CHANGED Viewed

@@ -273,36 +273,69 @@ select.alert90s-select {
   box-shadow: inset 0 0 0 4px #fff;
 }
-/* Checkbox */
+/* Checkbox (SVG Brutalist) */
 .alert90s-checkbox-label {
-  display: flex;
+  display: inline-flex;
   align-items: center;
   gap: 0.75rem;
-  font-weight: bold;
   cursor: pointer;
+  font-weight: bold;
   font-size: 1rem;
+  user-select: none;
+  position: relative;
 }
 .alert90s-checkbox-label input[type="checkbox"] {
-  appearance: none;
-  width: 1.25rem;
-  height: 1.25rem;
-  border: 4px solid #000;
-  margin: 0;
+  position: absolute;
+  opacity: 0;
   cursor: pointer;
-  position: relative;
-  background-color: #f8fafc;
+  height: 0;
+  width: 0;
 }
-.alert90s-checkbox-label input[type="checkbox"]:checked {
-  background-color: #000;
+.alert90s-cb-svg {
+  overflow: visible;
+  transition: transform 0.1s ease;
 }
-.alert90s-checkbox-label input[type="checkbox"]:checked::after {
-  content: '✔';
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  color: #fff;
-  font-size: 0.8rem;
+.alert90s-checkbox-label:hover .alert90s-cb-svg {
+  transform: translate(-2px, -2px);
+}
+.alert90s-checkbox-label:active .alert90s-cb-svg {
+  transform: translate(2px, 2px);
+}
+.cb-box {
+  transition: fill 0.1s ease;
+}
+.alert90s-checkbox-label input[type="checkbox"]:checked ~ .alert90s-cb-svg .cb-box {
+  fill: #ffffff;
+}
+.cb-check {
+  stroke-dasharray: 120;
+  stroke-dashoffset: 120;
+  transition: stroke-dashoffset 0.15s ease-out;
+}
+.alert90s-checkbox-label input[type="checkbox"]:checked ~ .alert90s-cb-svg .cb-check {
+  stroke-dashoffset: 0;
+}
+.alert90s-checkbox-label input[type="checkbox"]:checked ~ .alert90s-cb-svg {
+  animation: alert90s-cb-shake 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
+}
+@keyframes alert90s-cb-shake {
+  0% { transform: scale(1) translate(0, 0); }
+  30% { transform: scale(1.15) translate(-2px, -2px) rotate(-4deg); }
+  50% { transform: scale(0.95) translate(2px, 2px) rotate(3deg); }
+  75% { transform: scale(1.05) translate(-1px, -1px) rotate(-1deg); }
+  100% { transform: scale(1) translate(0, 0) rotate(0deg); }
+}
+.alert90s-cb-text {
+  transition: color 0.2s;
+}
+.alert90s-checkbox-label input[type="checkbox"]:checked ~ .alert90s-cb-text {
+  animation: alert90s-cb-bump 0.2s ease-out forwards;
+  color: #ff6b35;
+}
+@keyframes alert90s-cb-bump {
+  0% { transform: translateX(0); }
+  50% { transform: translateX(4px); }
+  100% { transform: translateX(0); }
 }
 /* Toggle Switch */
@@ -504,6 +537,88 @@ select.alert90s-select {
   animation: alert90s-marquee 1.5s linear infinite;
 }
+/* Segmented SVG Progress Bar */
+.alert90s-spinner.segmented {
+  display: flex;
+  justify-content: center;
+  width: 100%;
+}
+.alert90s-spinner.segmented svg {
+  max-width: 100%;
+  height: auto;
+}
+/* Segment visibility - staggered appear */
+.a90s-seg-1 { animation: a90s-op1 6s infinite; }
+.a90s-seg-2 { animation: a90s-op2 6s infinite; }
+.a90s-seg-3 { animation: a90s-op3 6s infinite; }
+.a90s-seg-4 { animation: a90s-op4 6s infinite; }
+.a90s-seg-5 { animation: a90s-op5 6s infinite; }
+.a90s-seg-6 { animation: a90s-op6 6s infinite; }
+.a90s-seg-7 { animation: a90s-op7 6s infinite; }
+.a90s-seg-8 { animation: a90s-op8 6s infinite; }
+.a90s-seg-9 { animation: a90s-op9 6s infinite; }
+.a90s-seg-10 { animation: a90s-op10 6s infinite; }
+@keyframes a90s-op1  { 0%,9%  {opacity:0} 10%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op2  { 0%,17% {opacity:0} 18%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op3  { 0%,25% {opacity:0} 26%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op4  { 0%,33% {opacity:0} 34%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op5  { 0%,41% {opacity:0} 42%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op6  { 0%,49% {opacity:0} 50%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op7  { 0%,57% {opacity:0} 58%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op8  { 0%,65% {opacity:0} 66%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op9  { 0%,73% {opacity:0} 74%,92% {opacity:1} 92.1%,100% {opacity:0} }
+@keyframes a90s-op10 { 0%,81% {opacity:0} 82%,92% {opacity:1} 92.1%,100% {opacity:0} }
+/* Segment flash (white pop on appear) */
+.a90s-fl-1 { animation: a90s-fl1 6s infinite; }
+.a90s-fl-2 { animation: a90s-fl2 6s infinite; }
+.a90s-fl-3 { animation: a90s-fl3 6s infinite; }
+.a90s-fl-4 { animation: a90s-fl4 6s infinite; }
+.a90s-fl-5 { animation: a90s-fl5 6s infinite; }
+.a90s-fl-6 { animation: a90s-fl6 6s infinite; }
+.a90s-fl-7 { animation: a90s-fl7 6s infinite; }
+.a90s-fl-8 { animation: a90s-fl8 6s infinite; }
+.a90s-fl-9 { animation: a90s-fl9 6s infinite; }
+.a90s-fl-10 { animation: a90s-fl10 6s infinite; }
+@keyframes a90s-fl1  { 0%,9%  {fill:#ff6b35} 10%,13% {fill:#fff} 13.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl2  { 0%,17% {fill:#ff6b35} 18%,21% {fill:#fff} 21.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl3  { 0%,25% {fill:#ff6b35} 26%,29% {fill:#fff} 29.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl4  { 0%,33% {fill:#ff6b35} 34%,37% {fill:#fff} 37.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl5  { 0%,41% {fill:#ff6b35} 42%,45% {fill:#fff} 45.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl6  { 0%,49% {fill:#ff6b35} 50%,53% {fill:#fff} 53.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl7  { 0%,57% {fill:#ff6b35} 58%,61% {fill:#fff} 61.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl8  { 0%,65% {fill:#ff6b35} 66%,69% {fill:#fff} 69.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl9  { 0%,73% {fill:#ff6b35} 74%,77% {fill:#fff} 77.1%,100% {fill:#ff6b35} }
+@keyframes a90s-fl10 { 0%,81% {fill:#ff6b35} 82%,85% {fill:#fff} 85.1%,100% {fill:#ff6b35} }
+/* Percentage text visibility */
+.a90s-txt-0   { animation: a90s-t0 6s infinite; }
+.a90s-txt-10  { animation: a90s-t10 6s infinite; opacity:0; }
+.a90s-txt-20  { animation: a90s-t20 6s infinite; opacity:0; }
+.a90s-txt-30  { animation: a90s-t30 6s infinite; opacity:0; }
+.a90s-txt-40  { animation: a90s-t40 6s infinite; opacity:0; }
+.a90s-txt-50  { animation: a90s-t50 6s infinite; opacity:0; }
+.a90s-txt-60  { animation: a90s-t60 6s infinite; opacity:0; }
+.a90s-txt-70  { animation: a90s-t70 6s infinite; opacity:0; }
+.a90s-txt-80  { animation: a90s-t80 6s infinite; opacity:0; }
+.a90s-txt-90  { animation: a90s-t90 6s infinite; opacity:0; }
+.a90s-txt-100 { animation: a90s-t100 6s infinite; opacity:0; }
+@keyframes a90s-t0   { 0%,9.9%  {opacity:1} 10%,91.9%  {opacity:0} 92%,100% {opacity:1} }
+@keyframes a90s-t10  { 0%,9.9%  {opacity:0} 10%,17.9%  {opacity:1} 18%,100% {opacity:0} }
+@keyframes a90s-t20  { 0%,17.9% {opacity:0} 18%,25.9%  {opacity:1} 26%,100% {opacity:0} }
+@keyframes a90s-t30  { 0%,25.9% {opacity:0} 26%,33.9%  {opacity:1} 34%,100% {opacity:0} }
+@keyframes a90s-t40  { 0%,33.9% {opacity:0} 34%,41.9%  {opacity:1} 42%,100% {opacity:0} }
+@keyframes a90s-t50  { 0%,41.9% {opacity:0} 42%,49.9%  {opacity:1} 50%,100% {opacity:0} }
+@keyframes a90s-t60  { 0%,49.9% {opacity:0} 50%,57.9%  {opacity:1} 58%,100% {opacity:0} }
+@keyframes a90s-t70  { 0%,57.9% {opacity:0} 58%,65.9%  {opacity:1} 66%,100% {opacity:0} }
+@keyframes a90s-t80  { 0%,65.9% {opacity:0} 66%,73.9%  {opacity:1} 74%,100% {opacity:0} }
+@keyframes a90s-t90  { 0%,73.9% {opacity:0} 74%,81.9%  {opacity:1} 82%,100% {opacity:0} }
+@keyframes a90s-t100 { 0%,81.9% {opacity:0} 82%,91.9%  {opacity:1} 92%,100% {opacity:0} }
 @keyframes alert90s-hourglass {
   0% { transform: rotate(0); }
   25% { transform: rotate(180deg); }
@@ -777,3 +892,113 @@ select.alert90s-select {
   0% { opacity: 0; transform: scale(0.9); }
   100% { opacity: 1; transform: scale(1); }
 }
+/* =======================================
+   DARK MODE OVERRIDES
+   ======================================= */
+.alert90s-dark.alert90s-box {
+  background-color: #2a2a35;
+  color: #eaeaea;
+}
+.alert90s-dark .alert90s-title {
+  color: #fff;
+  text-shadow: 2px 2px 0 #000;
+}
+.alert90s-dark .alert90s-message, .alert90s-dark .alert90s-html {
+  color: #d4d4d4;
+}
+.alert90s-dark .alert90s-html a {
+  color: #60a5fa;
+}
+.alert90s-dark .alert90s-input, .alert90s-dark select.alert90s-select {
+  background-color: #1a1a24;
+  color: #fff;
+  border-color: #000;
+  box-shadow: inset 4px 4px 0 0 rgba(0,0,0,0.5);
+}
+.alert90s-dark .alert90s-input:focus {
+  border-color: #00FFFF;
+}
+.alert90s-dark .alert90s-button {
+  background-color: #ececec;
+  color: #000;
+}
+.alert90s-dark .alert90s-button.cancel { background-color: #f87171; }
+.alert90s-dark .alert90s-button.deny { background-color: #fb923c; }
+.alert90s-dark .alert90s-button.confirm { background-color: #4ade80; }
+.alert90s-dark .alert90s-checkbox-label .cb-box { fill: #1a1a24; stroke: #555; }
+.alert90s-dark .alert90s-checkbox-label input[type="checkbox"]:checked ~ .alert90s-cb-svg .cb-box { fill: #2a2a35; }
+.alert90s-dark .alert90s-checkbox-label .cb-shadow { fill: #555; }
+.alert90s-dark .alert90s-cb-text { color: #eaeaea; }
+.alert90s-dark .alert90s-radio-label input[type="radio"] { background-color: #1a1a24; }
+.alert90s-dark .alert90s-radio-label input[type="radio"]:checked { background-color: #00FFFF; box-shadow: inset 0 0 0 4px #000; }
+/* =======================================
+   THEME TOGGLE COMPONENT (.alert90s-theme-wrapper)
+   ======================================= */
+.alert90s-theme-checkbox { display: none; }
+.alert90s-theme-wrapper {
+  position: relative;
+  cursor: pointer;
+  transform: rotate(-1deg);
+  transition: transform 0.1s;
+  display: inline-block;
+}
+.alert90s-theme-wrapper:active { transform: rotate(0deg) scale(0.98); }
+.alert90s-theme-track-shadow { fill: #000; }
+.alert90s-theme-track-base {
+  fill: #facc15;
+  stroke: #000;
+  stroke-width: 6;
+  stroke-linejoin: miter;
+  transition: fill 0.5s cubic-bezier(0.8, 0, 0.2, 1);
+}
+.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-track-base {
+  fill: #1e1e26;
+}
+.alert90s-theme-thumb-group {
+  transform: translateX(0);
+  transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
+}
+.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-thumb-group {
+  transform: translateX(190px);
+}
+.alert90s-theme-thumb-shadow { fill: #000; }
+.alert90s-theme-thumb-body {
+  fill: #FFFFFF;
+  stroke: #000;
+  stroke-width: 6;
+  stroke-linejoin: miter;
+  transition: fill 0.3s;
+}
+.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-thumb-body {
+  fill: #EAEAEA;
+}
+.alert90s-theme-icon-sun { opacity: 1; transition: opacity 0s 0.25s; }
+.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-icon-sun { opacity: 0; }
+.alert90s-theme-icon-moon {
+  opacity: 0;
+  transition: opacity 0s 0.25s;
+  filter: drop-shadow(0 0 10px #00FFFF) drop-shadow(0 0 20px #00FFFF);
+}
+.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-icon-moon { opacity: 1; }
+.alert90s-theme-text-label {
+  font-family: Impact, 'Arial Black', sans-serif;
+  font-size: 38px;
+  letter-spacing: 2px;
+  pointer-events: none;
+  user-select: none;
+}
+.alert90s-theme-text-day { fill: #000; opacity: 1; transition: opacity 0.3s ease; }
+.alert90s-theme-text-night { fill: #00FFFF; opacity: 0; transition: opacity 0.3s ease; }
+.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-text-day { opacity: 0; }
+.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-text-night { opacity: 1; }
+.alert90s-theme-deco-accent { fill: #ff90e8; transition: fill 0.4s; }
+.alert90s-theme-wrapper:has(.alert90s-theme-checkbox:checked) .alert90s-theme-deco-accent { fill: #4ade80; }