@onpe/ui 1.0.9 → 1.0.10

package/dist/components.esm.js

@@ -156,33 +156,33 @@ var Overlay = function (_a) {
     var getColorClass = function () {
         switch (color) {
             case "blue":
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
             case "skyblue":
-                return "bg-skyblue/80";
+                return "bg-onpe-ui-skyblue/80";
             case "skyblue-light":
-                return "bg-skyblue-light/80";
+                return "bg-onpe-ui-skyblue-light/80";
             case "yellow":
-                return "bg-yellow/80";
+                return "bg-onpe-ui-yellow/80";
             case "light-skyblue":
-                return "bg-light-skyblue/80";
+                return "bg-onpe-ui-light-skyblue/80";
             case "gray":
-                return "bg-gray/80";
+                return "bg-onpe-ui-gray/80";
             case "gray-light":
-                return "bg-gray-light/80";
+                return "bg-onpe-ui-gray-light/80";
             case "gray-extra-light":
-                return "bg-gray-extra-light/80";
+                return "bg-onpe-ui-gray-extra-light/80";
             case "red":
-                return "bg-red/80";
+                return "bg-onpe-ui-red/80";
             case "dark-gray":
-                return "bg-dark-gray/80";
+                return "bg-onpe-ui-dark-gray/80";
             case "green":
-                return "bg-green/80";
+                return "bg-onpe-ui-green/80";
             case "yellow-light":
-                return "bg-yellow-light/80";
+                return "bg-onpe-ui-yellow-light/80";
             case "primary":
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
             default:
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
         }
     };
     return (jsx("div", { onClick: onClick, className: "".concat(show ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0", " absolute inset-0 w-full h-screen z-10 ").concat(getColorClass(), " transition-all duration-500 ease-in-out") }));
@@ -204,7 +204,7 @@ var Modal = function (_a) {
                                     ? "flex flex-col items-center justify-center"
                                     : "bg-white flex flex-col items-center justify-center  md:px-auto px-1 lg:px-5 min-w-[320px] w-[98vw] md:w-[500px] lg:w-[1024px] max-w-[95vw] max-h-[90vh] overflow-y-auto",
                                 props.className ? props.className : "py-10 lg:py-16",
-                            ]), children: children }), closeButton && (jsx("button", { onClick: onClose, className: "absolute top-4 right-4 rounded-full bg-red p-[7px] flex items-center justify-center z-30", "aria-label": "Cerrar", children: jsx(IconClose, { className: "h-[10px]  w-[10px] text-white" }) }))] })] }) }));
+                            ]), children: children }), closeButton && (jsx("button", { onClick: onClose, className: "absolute top-4 right-4 rounded-full bg-onpe-ui-red p-[7px] flex items-center justify-center z-30", "aria-label": "Cerrar", children: jsx(IconClose, { className: "h-[10px]  w-[10px] text-white" }) }))] })] }) }));
 };
 
 var IconWarning = function (props) { return (jsx("svg", __assign({ width: 16, height: 16, viewBox: "0 0 60 51", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsx("path", { d: "M0.667969 50.9987L30.0013 0.332031L59.3346 50.9987H0.667969ZM9.86797 45.6654H50.1346L30.0013 10.9987L9.86797 45.6654ZM30.0013 42.9987C30.7569 42.9987 31.3906 42.7427 31.9026 42.2307C32.4146 41.7187 32.6697 41.0858 32.668 40.332C32.668 39.5765 32.412 38.9427 31.9 38.4307C31.388 37.9187 30.7551 37.6636 30.0013 37.6654C29.2457 37.6654 28.612 37.9214 28.1 38.4334C27.588 38.9454 27.3329 39.5783 27.3346 40.332C27.3346 41.0876 27.5906 41.7214 28.1026 42.2334C28.6146 42.7454 29.2475 43.0005 30.0013 42.9987ZM27.3346 34.9987H32.668V21.6654H27.3346V34.9987Z", fill: "currentColor" }) }))); };
@@ -219,7 +219,7 @@ var IconEdgeColor = function (props) { return (jsxs("svg", __assign({ width: 48,
 
 var BrowserIncompatible = function (_a) {
     var _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.className, className = _d === void 0 ? "" : _d;
-    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, children: [jsx("div", { className: "flex justify-center items-center", children: jsx(IconWarning, { className: "w-22 h-22 text-skyblue" }) }), jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-skyblue font-medium", children: "Navegador no recomendado" }), jsx("p", { className: "text-sm md:text-lg text-center mt-6", children: "Para una mejor experiencia y mayor seguridad, debes ingresar con los siguientes navegadores:" }), jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5", children: [jsx(IconChromeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconSafariColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconMozillaColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconEdgeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
+    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, children: [jsx("div", { className: "flex justify-center items-center", children: jsx(IconWarning, { className: "w-22 h-22 text-onpe-ui-skyblue" }) }), jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-onpe-ui-skyblue font-medium", children: "Navegador no recomendado" }), jsx("p", { className: "text-sm md:text-lg text-center mt-6", children: "Para una mejor experiencia y mayor seguridad, debes ingresar con los siguientes navegadores:" }), jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5", children: [jsx(IconChromeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconSafariColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconMozillaColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconEdgeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
 };
 
 var IconCheck = function (props) { return (jsx("svg", __assign({ width: 64, height: 64, viewBox: "0 0 64 64", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "mt-10 lg:mt-16" }, props, { children: jsx("path", { d: "M28.2673 44.2663L47.0673 25.4663L43.334 21.733L28.2673 36.7997L20.6673 29.1997L16.934 32.933L28.2673 44.2663ZM32.0007 58.6663C28.3118 58.6663 24.8451 57.9659 21.6007 56.565C18.3562 55.1641 15.534 53.2646 13.134 50.8663C10.734 48.4663 8.83443 45.6441 7.43532 42.3997C6.03621 39.1552 5.33576 35.6886 5.33398 31.9997C5.33398 28.3108 6.03443 24.8441 7.43532 21.5997C8.83621 18.3552 10.7358 15.533 13.134 13.133C15.534 10.733 18.3562 8.83345 21.6007 7.43434C24.8451 6.03523 28.3118 5.33479 32.0007 5.33301C35.6895 5.33301 39.1562 6.03345 42.4007 7.43434C45.6451 8.83523 48.4673 10.7348 50.8673 13.133C53.2673 15.533 55.1678 18.3552 56.5686 21.5997C57.9695 24.8441 58.6691 28.3108 58.6673 31.9997C58.6673 35.6886 57.9669 39.1552 56.566 42.3997C55.1651 45.6441 53.2655 48.4663 50.8673 50.8663C48.4673 53.2663 45.6451 55.1668 42.4007 56.5677C39.1562 57.9686 35.6895 58.6681 32.0007 58.6663ZM32.0007 53.333C37.9562 53.333 43.0006 51.2663 47.134 47.133C51.2673 42.9997 53.334 37.9552 53.334 31.9997C53.334 26.0441 51.2673 20.9997 47.134 16.8663C43.0006 12.733 37.9562 10.6663 32.0007 10.6663C26.0451 10.6663 21.0007 12.733 16.8673 16.8663C12.734 20.9997 10.6673 26.0441 10.6673 31.9997C10.6673 37.9552 12.734 42.9997 16.8673 47.133C21.0007 51.2663 26.0451 53.333 32.0007 53.333Z", fill: "currentColor" }) }))); };
@@ -243,7 +243,7 @@ var ModalConfirm = function (_a) {
         onCancel();
         onClose();
     };
-    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, topAbsolute: true, children: [jsxs("div", { className: "flex items-center justify-center", children: [icon === "warning" && jsx(IconWarning, { className: "w-16 h-16 text-skyblue" }), icon === "success" && jsx(IconCheck, { className: "w-16 h-16 text-skyblue" })] }), jsx("p", { className: "mt-3 text-lg font-medium text-center lg:mt-4 lg:text-2xl text-skyblue", children: title }), jsx("p", { className: "mt-7 text-sm lg:text-lg text-center max-w-full lg:max-w-[576px]", children: message }), jsxs("div", { className: "flex flex-col-reverse items-center justify-center w-full gap-5 mt-11 lg:mt-20 lg:flex-row", children: [twoButtons && jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "blue", title: textButtonCancel, onClick: handleCancel }), jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "red", title: textButtonConfirm, onClick: handleConfirm })] })] }));
+    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, topAbsolute: true, children: [jsxs("div", { className: "flex items-center justify-center", children: [icon === "warning" && jsx(IconWarning, { className: "w-16 h-16 text-onpe-ui-skyblue" }), icon === "success" && jsx(IconCheck, { className: "w-16 h-16 text-onpe-ui-skyblue" })] }), jsx("p", { className: "mt-3 text-lg font-medium text-center lg:mt-4 lg:text-2xl text-onpe-ui-skyblue", children: title }), jsx("p", { className: "mt-7 text-sm lg:text-lg text-center max-w-full lg:max-w-[576px]", children: message }), jsxs("div", { className: "flex flex-col-reverse items-center justify-center w-full gap-5 mt-11 lg:mt-20 lg:flex-row", children: [twoButtons && jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "blue", title: textButtonCancel, onClick: handleCancel }), jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "red", title: textButtonConfirm, onClick: handleConfirm })] })] }));
 };
 
 var IconSpinnerDesktop = function (props) { return (jsx("svg", __assign({ width: 102, height: 102, viewBox: "0 0 102 102", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsx("path", { d: "M50.9999 3.08313C23.9241 3.08208 3.08296 24.6456 3.08325 51C3.08354 75.4375 22.453 98.9167 50.9999 98.9167C77.5573 98.9167 98.9166 77.3542 98.9166 51", stroke: "currentColor", strokeWidth: 6, strokeLinecap: "round" }) }))); };
@@ -263,7 +263,7 @@ var IconApple = function (props) { return (jsx("svg", __assign({ stroke: "curren
 
 var ModalSystemIncompatible = function (_a) {
     var _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.className, className = _d === void 0 ? "" : _d;
-    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-10 pb-24.5 ".concat(className), closeButton: true, closeDisabled: true, children: [jsx("div", { className: "flex justify-center items-center", children: jsx(IconWarning, { className: "w-22 h-22 text-skyblue" }) }), jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-skyblue font-medium", children: "Sistema Operativo no recomendado" }), jsx("p", { className: "text-sm md:text-lg mt-10 text-center xl:px-12", children: "Para descargar e instalar el ONPEID utiliza un dispositivo con sistema operativo Windows, macOS, Android o iOS." }), jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5 text-skyblue", children: [jsx(IconWindow, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconAndroid, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconApple, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
+    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-10 pb-24.5 ".concat(className), closeButton: true, closeDisabled: true, children: [jsx("div", { className: "flex justify-center items-center", children: jsx(IconWarning, { className: "w-22 h-22 text-onpe-ui-skyblue" }) }), jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-onpe-ui-skyblue font-medium", children: "Sistema Operativo no recomendado" }), jsx("p", { className: "text-sm md:text-lg mt-10 text-center xl:px-12", children: "Para descargar e instalar el ONPEID utiliza un dispositivo con sistema operativo Windows, macOS, Android o iOS." }), jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5 text-onpe-ui-skyblue", children: [jsx(IconWindow, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconAndroid, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconApple, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
 };
 
 export { BrowserIncompatible, Button, Modal, ModalConfirm, ModalLoading, ModalSystemIncompatible, Overlay, Portal, Show };

package/dist/components.js

@@ -158,33 +158,33 @@ var Overlay = function (_a) {
     var getColorClass = function () {
         switch (color) {
             case "blue":
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
             case "skyblue":
-                return "bg-skyblue/80";
+                return "bg-onpe-ui-skyblue/80";
             case "skyblue-light":
-                return "bg-skyblue-light/80";
+                return "bg-onpe-ui-skyblue-light/80";
             case "yellow":
-                return "bg-yellow/80";
+                return "bg-onpe-ui-yellow/80";
             case "light-skyblue":
-                return "bg-light-skyblue/80";
+                return "bg-onpe-ui-light-skyblue/80";
             case "gray":
-                return "bg-gray/80";
+                return "bg-onpe-ui-gray/80";
             case "gray-light":
-                return "bg-gray-light/80";
+                return "bg-onpe-ui-gray-light/80";
             case "gray-extra-light":
-                return "bg-gray-extra-light/80";
+                return "bg-onpe-ui-gray-extra-light/80";
             case "red":
-                return "bg-red/80";
+                return "bg-onpe-ui-red/80";
             case "dark-gray":
-                return "bg-dark-gray/80";
+                return "bg-onpe-ui-dark-gray/80";
             case "green":
-                return "bg-green/80";
+                return "bg-onpe-ui-green/80";
             case "yellow-light":
-                return "bg-yellow-light/80";
+                return "bg-onpe-ui-yellow-light/80";
             case "primary":
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
             default:
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
         }
     };
     return (jsxRuntime.jsx("div", { onClick: onClick, className: "".concat(show ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0", " absolute inset-0 w-full h-screen z-10 ").concat(getColorClass(), " transition-all duration-500 ease-in-out") }));
@@ -206,7 +206,7 @@ var Modal = function (_a) {
                                     ? "flex flex-col items-center justify-center"
                                     : "bg-white flex flex-col items-center justify-center  md:px-auto px-1 lg:px-5 min-w-[320px] w-[98vw] md:w-[500px] lg:w-[1024px] max-w-[95vw] max-h-[90vh] overflow-y-auto",
                                 props.className ? props.className : "py-10 lg:py-16",
-                            ]), children: children }), closeButton && (jsxRuntime.jsx("button", { onClick: onClose, className: "absolute top-4 right-4 rounded-full bg-red p-[7px] flex items-center justify-center z-30", "aria-label": "Cerrar", children: jsxRuntime.jsx(IconClose, { className: "h-[10px]  w-[10px] text-white" }) }))] })] }) }));
+                            ]), children: children }), closeButton && (jsxRuntime.jsx("button", { onClick: onClose, className: "absolute top-4 right-4 rounded-full bg-onpe-ui-red p-[7px] flex items-center justify-center z-30", "aria-label": "Cerrar", children: jsxRuntime.jsx(IconClose, { className: "h-[10px]  w-[10px] text-white" }) }))] })] }) }));
 };
 
 var IconWarning = function (props) { return (jsxRuntime.jsx("svg", __assign({ width: 16, height: 16, viewBox: "0 0 60 51", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsxRuntime.jsx("path", { d: "M0.667969 50.9987L30.0013 0.332031L59.3346 50.9987H0.667969ZM9.86797 45.6654H50.1346L30.0013 10.9987L9.86797 45.6654ZM30.0013 42.9987C30.7569 42.9987 31.3906 42.7427 31.9026 42.2307C32.4146 41.7187 32.6697 41.0858 32.668 40.332C32.668 39.5765 32.412 38.9427 31.9 38.4307C31.388 37.9187 30.7551 37.6636 30.0013 37.6654C29.2457 37.6654 28.612 37.9214 28.1 38.4334C27.588 38.9454 27.3329 39.5783 27.3346 40.332C27.3346 41.0876 27.5906 41.7214 28.1026 42.2334C28.6146 42.7454 29.2475 43.0005 30.0013 42.9987ZM27.3346 34.9987H32.668V21.6654H27.3346V34.9987Z", fill: "currentColor" }) }))); };
@@ -221,7 +221,7 @@ var IconEdgeColor = function (props) { return (jsxRuntime.jsxs("svg", __assign({
 
 var BrowserIncompatible = function (_a) {
     var _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.className, className = _d === void 0 ? "" : _d;
-    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, children: [jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: jsxRuntime.jsx(IconWarning, { className: "w-22 h-22 text-skyblue" }) }), jsxRuntime.jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-skyblue font-medium", children: "Navegador no recomendado" }), jsxRuntime.jsx("p", { className: "text-sm md:text-lg text-center mt-6", children: "Para una mejor experiencia y mayor seguridad, debes ingresar con los siguientes navegadores:" }), jsxRuntime.jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5", children: [jsxRuntime.jsx(IconChromeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconSafariColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconMozillaColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconEdgeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
+    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, children: [jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: jsxRuntime.jsx(IconWarning, { className: "w-22 h-22 text-onpe-ui-skyblue" }) }), jsxRuntime.jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-onpe-ui-skyblue font-medium", children: "Navegador no recomendado" }), jsxRuntime.jsx("p", { className: "text-sm md:text-lg text-center mt-6", children: "Para una mejor experiencia y mayor seguridad, debes ingresar con los siguientes navegadores:" }), jsxRuntime.jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5", children: [jsxRuntime.jsx(IconChromeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconSafariColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconMozillaColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconEdgeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
 };
 
 var IconCheck = function (props) { return (jsxRuntime.jsx("svg", __assign({ width: 64, height: 64, viewBox: "0 0 64 64", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "mt-10 lg:mt-16" }, props, { children: jsxRuntime.jsx("path", { d: "M28.2673 44.2663L47.0673 25.4663L43.334 21.733L28.2673 36.7997L20.6673 29.1997L16.934 32.933L28.2673 44.2663ZM32.0007 58.6663C28.3118 58.6663 24.8451 57.9659 21.6007 56.565C18.3562 55.1641 15.534 53.2646 13.134 50.8663C10.734 48.4663 8.83443 45.6441 7.43532 42.3997C6.03621 39.1552 5.33576 35.6886 5.33398 31.9997C5.33398 28.3108 6.03443 24.8441 7.43532 21.5997C8.83621 18.3552 10.7358 15.533 13.134 13.133C15.534 10.733 18.3562 8.83345 21.6007 7.43434C24.8451 6.03523 28.3118 5.33479 32.0007 5.33301C35.6895 5.33301 39.1562 6.03345 42.4007 7.43434C45.6451 8.83523 48.4673 10.7348 50.8673 13.133C53.2673 15.533 55.1678 18.3552 56.5686 21.5997C57.9695 24.8441 58.6691 28.3108 58.6673 31.9997C58.6673 35.6886 57.9669 39.1552 56.566 42.3997C55.1651 45.6441 53.2655 48.4663 50.8673 50.8663C48.4673 53.2663 45.6451 55.1668 42.4007 56.5677C39.1562 57.9686 35.6895 58.6681 32.0007 58.6663ZM32.0007 53.333C37.9562 53.333 43.0006 51.2663 47.134 47.133C51.2673 42.9997 53.334 37.9552 53.334 31.9997C53.334 26.0441 51.2673 20.9997 47.134 16.8663C43.0006 12.733 37.9562 10.6663 32.0007 10.6663C26.0451 10.6663 21.0007 12.733 16.8673 16.8663C12.734 20.9997 10.6673 26.0441 10.6673 31.9997C10.6673 37.9552 12.734 42.9997 16.8673 47.133C21.0007 51.2663 26.0451 53.333 32.0007 53.333Z", fill: "currentColor" }) }))); };
@@ -245,7 +245,7 @@ var ModalConfirm = function (_a) {
         onCancel();
         onClose();
     };
-    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, topAbsolute: true, children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-center", children: [icon === "warning" && jsxRuntime.jsx(IconWarning, { className: "w-16 h-16 text-skyblue" }), icon === "success" && jsxRuntime.jsx(IconCheck, { className: "w-16 h-16 text-skyblue" })] }), jsxRuntime.jsx("p", { className: "mt-3 text-lg font-medium text-center lg:mt-4 lg:text-2xl text-skyblue", children: title }), jsxRuntime.jsx("p", { className: "mt-7 text-sm lg:text-lg text-center max-w-full lg:max-w-[576px]", children: message }), jsxRuntime.jsxs("div", { className: "flex flex-col-reverse items-center justify-center w-full gap-5 mt-11 lg:mt-20 lg:flex-row", children: [twoButtons && jsxRuntime.jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "blue", title: textButtonCancel, onClick: handleCancel }), jsxRuntime.jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "red", title: textButtonConfirm, onClick: handleConfirm })] })] }));
+    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, topAbsolute: true, children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-center", children: [icon === "warning" && jsxRuntime.jsx(IconWarning, { className: "w-16 h-16 text-onpe-ui-skyblue" }), icon === "success" && jsxRuntime.jsx(IconCheck, { className: "w-16 h-16 text-onpe-ui-skyblue" })] }), jsxRuntime.jsx("p", { className: "mt-3 text-lg font-medium text-center lg:mt-4 lg:text-2xl text-onpe-ui-skyblue", children: title }), jsxRuntime.jsx("p", { className: "mt-7 text-sm lg:text-lg text-center max-w-full lg:max-w-[576px]", children: message }), jsxRuntime.jsxs("div", { className: "flex flex-col-reverse items-center justify-center w-full gap-5 mt-11 lg:mt-20 lg:flex-row", children: [twoButtons && jsxRuntime.jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "blue", title: textButtonCancel, onClick: handleCancel }), jsxRuntime.jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "red", title: textButtonConfirm, onClick: handleConfirm })] })] }));
 };
 
 var IconSpinnerDesktop = function (props) { return (jsxRuntime.jsx("svg", __assign({ width: 102, height: 102, viewBox: "0 0 102 102", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsxRuntime.jsx("path", { d: "M50.9999 3.08313C23.9241 3.08208 3.08296 24.6456 3.08325 51C3.08354 75.4375 22.453 98.9167 50.9999 98.9167C77.5573 98.9167 98.9166 77.3542 98.9166 51", stroke: "currentColor", strokeWidth: 6, strokeLinecap: "round" }) }))); };
@@ -265,7 +265,7 @@ var IconApple = function (props) { return (jsxRuntime.jsx("svg", __assign({ stro
 
 var ModalSystemIncompatible = function (_a) {
     var _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.className, className = _d === void 0 ? "" : _d;
-    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-10 pb-24.5 ".concat(className), closeButton: true, closeDisabled: true, children: [jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: jsxRuntime.jsx(IconWarning, { className: "w-22 h-22 text-skyblue" }) }), jsxRuntime.jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-skyblue font-medium", children: "Sistema Operativo no recomendado" }), jsxRuntime.jsx("p", { className: "text-sm md:text-lg mt-10 text-center xl:px-12", children: "Para descargar e instalar el ONPEID utiliza un dispositivo con sistema operativo Windows, macOS, Android o iOS." }), jsxRuntime.jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5 text-skyblue", children: [jsxRuntime.jsx(IconWindow, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconAndroid, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconApple, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
+    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-10 pb-24.5 ".concat(className), closeButton: true, closeDisabled: true, children: [jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: jsxRuntime.jsx(IconWarning, { className: "w-22 h-22 text-onpe-ui-skyblue" }) }), jsxRuntime.jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-onpe-ui-skyblue font-medium", children: "Sistema Operativo no recomendado" }), jsxRuntime.jsx("p", { className: "text-sm md:text-lg mt-10 text-center xl:px-12", children: "Para descargar e instalar el ONPEID utiliza un dispositivo con sistema operativo Windows, macOS, Android o iOS." }), jsxRuntime.jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5 text-onpe-ui-skyblue", children: [jsxRuntime.jsx(IconWindow, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconAndroid, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconApple, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
 };
 
 exports.BrowserIncompatible = BrowserIncompatible;

package/dist/index.css

@@ -1 +1 @@
-/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer theme, base, components, utilities;@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-500:oklch(63.7% 0.237 25.331);--color-red-600:oklch(57.7% 0.245 27.325);--color-orange-500:oklch(70.5% 0.213 47.604);--color-orange-600:oklch(64.6% 0.222 41.116);--color-green-500:oklch(72.3% 0.219 149.579);--color-green-600:oklch(62.7% 0.194 149.214);--color-blue-500:oklch(62.3% 0.214 259.815);--color-blue-600:oklch(54.6% 0.245 262.881);--color-purple-500:oklch(62.7% 0.265 303.9);--color-purple-600:oklch(55.8% 0.288 302.321);--color-gray-100:oklch(96.7% 0.003 264.542);--color-gray-600:oklch(44.6% 0.03 256.802);--color-white:#fff;--spacing:0.25rem;--container-md:28rem;--container-2xl:42rem;--container-4xl:56rem;--text-xs:0.75rem;--text-xs--line-height:1.33333;--text-sm:0.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-base--line-height:1.5;--text-lg:1.125rem;--text-lg--line-height:1.55556;--text-xl:1.25rem;--text-xl--line-height:1.4;--text-2xl:1.5rem;--text-2xl--line-height:1.33333;--text-4xl:2.25rem;--text-4xl--line-height:1.11111;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--leading-normal:1.5;--radius-md:0.375rem;--radius-lg:0.5rem;--ease-in-out:cubic-bezier(0.4,0,0.2,1);--animate-spin:spin 1s linear infinite;--default-transition-duration:150ms;--default-transition-timing-function:cubic-bezier(0.4,0,0.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-onpe-ui-blue:var(--blue);--color-onpe-ui-skyblue:var(--skyblue);--color-onpe-ui-skyblue-light:var(--skyblue-light);--color-onpe-ui-yellow:var(--yellow);--color-onpe-ui-light-skyblue:var(--light-skyblue);--color-onpe-ui-gray:var(--gray);--color-onpe-ui-gray-light:var(--gray-light);--color-onpe-ui-gray-extra-light:var(--gray-extra-light);--color-onpe-ui-red:var(--red);--color-onpe-ui-dark-gray:var(--dark-gray);--color-onpe-ui-green:var(--green);--color-onpe-ui-yellow-light:var(--yellow-light)}}@layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:var(--default-font-feature-settings,normal);-webkit-tap-highlight-color:transparent;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:var(--default-mono-font-feature-settings,normal);font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}::file-selector-button,button,input,optgroup,select,textarea{font-feature-settings:inherit;background-color:transparent;border-radius:0;color:inherit;font:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}::file-selector-button,button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:calc(var(--spacing)*0)}.top-0{top:calc(var(--spacing)*0)}.top-4{top:calc(var(--spacing)*4)}.right-4{right:calc(var(--spacing)*4)}.-z-10{z-index:-10}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-50{z-index:50}.z-100{z-index:100}.container{width:100%;@media (width >= 640px){max-width:640px}@media (width >= 768px){max-width:768px}@media (width >= 1024px){max-width:1024px}@media (width >= 1200px){max-width:1200px}@media (width >= 1280px){max-width:1280px}@media (width >= 1536px){max-width:1536px}@media (width >= 1650px){max-width:1650px}}.mx-auto{margin-inline:auto}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-5{margin-top:calc(var(--spacing)*5)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-7{margin-top:calc(var(--spacing)*7)}.mt-10{margin-top:calc(var(--spacing)*10)}.mt-11{margin-top:calc(var(--spacing)*11)}.mr-2{margin-right:calc(var(--spacing)*2)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.-ml-1{margin-left:calc(var(--spacing)*-1)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-14{height:calc(var(--spacing)*14)}.h-16{height:calc(var(--spacing)*16)}.h-20{height:calc(var(--spacing)*20)}.h-22{height:calc(var(--spacing)*22)}.h-\[10px\]{height:10px}.h-\[32px\]{height:32px}.h-screen{height:100vh}.max-h-\[90vh\]{max-height:90vh}.min-h-screen{min-height:100vh}.w-4{width:calc(var(--spacing)*4)}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-16{width:calc(var(--spacing)*16)}.w-22{width:calc(var(--spacing)*22)}.w-\[10px\]{width:10px}.w-\[32px\]{width:32px}.w-\[98vw\]{width:98vw}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-\[95vw\]{max-width:95vw}.max-w-\[200px\]{max-width:200px}.max-w-\[680px\]{max-width:680px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.min-w-\[200px\]{min-width:200px}.min-w-\[320px\]{min-width:320px}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-decimal{list-style-type:decimal}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.justify-center{justify-content:center}.gap-4{gap:calc(var(--spacing)*4)}.gap-5{gap:calc(var(--spacing)*5)}.gap-6{gap:calc(var(--spacing)*6)}.gap-8{gap:calc(var(--spacing)*8)}.space-y-1{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*1*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*1*var(--tw-space-y-reverse))}}.space-y-3{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*3*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*3*var(--tw-space-y-reverse))}}.space-y-4{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*4*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*4*var(--tw-space-y-reverse))}}.space-y-6{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*6*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*6*var(--tw-space-y-reverse))}}.space-x-3{:where(&>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)*3*(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)*3*var(--tw-space-x-reverse))}}.space-x-4{:where(&>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)*4*(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)*4*var(--tw-space-x-reverse))}}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:calc(infinity * 1px)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-blue-500{border-color:var(--color-blue-500)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-green-500{background-color:var(--color-green-500)}.bg-onpe-ui-blue{background-color:var(--color-onpe-ui-blue)}.bg-onpe-ui-dark-gray{background-color:var(--color-onpe-ui-dark-gray)}.bg-onpe-ui-gray{background-color:var(--color-onpe-ui-gray)}.bg-onpe-ui-gray-extra-light{background-color:var(--color-onpe-ui-gray-extra-light)}.bg-onpe-ui-gray-light{background-color:var(--color-onpe-ui-gray-light)}.bg-onpe-ui-green{background-color:var(--color-onpe-ui-green)}.bg-onpe-ui-light-skyblue{background-color:var(--color-onpe-ui-light-skyblue)}.bg-onpe-ui-red{background-color:var(--color-onpe-ui-red)}.bg-onpe-ui-skyblue{background-color:var(--color-onpe-ui-skyblue)}.bg-onpe-ui-skyblue-light{background-color:var(--color-onpe-ui-skyblue-light)}.bg-onpe-ui-yellow{background-color:var(--color-onpe-ui-yellow)}.bg-onpe-ui-yellow-light{background-color:var(--color-onpe-ui-yellow-light)}.bg-orange-500{background-color:var(--color-orange-500)}.bg-purple-500{background-color:var(--color-purple-500)}.bg-red-500{background-color:var(--color-red-500)}.bg-white{background-color:var(--color-white)}.bg-white\/20{background-color:color-mix(in srgb,#fff 20%,transparent);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-6{padding:calc(var(--spacing)*6)}.p-8{padding:calc(var(--spacing)*8)}.p-\[7px\]{padding:7px}.px-1{padding-inline:calc(var(--spacing)*1)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.py-10{padding-block:calc(var(--spacing)*10)}.pt-5{padding-top:calc(var(--spacing)*5)}.pt-10{padding-top:calc(var(--spacing)*10)}.pb-8{padding-bottom:calc(var(--spacing)*8)}.pb-24\.5{padding-bottom:calc(var(--spacing)*24.5)}.text-center{text-align:center}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-normal{--tw-leading:var(--leading-normal);line-height:var(--leading-normal)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-blue-500{color:var(--color-blue-500)}.text-gray-600{color:var(--color-gray-600)}.text-orange-500{color:var(--color-orange-500)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.opacity-25{opacity:25%}.opacity-50{opacity:50%}.opacity-75{opacity:75%}.opacity-100{opacity:100%}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,rgba(0,0,0,.1)),0 1px 2px -1px var(--tw-shadow-color,rgba(0,0,0,.1))}.shadow,.shadow-lg{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,rgba(0,0,0,.1)),0 4px 6px -4px var(--tw-shadow-color,rgba(0,0,0,.1))}.transition-all{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-colors{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.duration-300{--tw-duration:300ms;transition-duration:.3s}.duration-500{--tw-duration:500ms;transition-duration:.5s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.hover\:bg-blue-600{&:hover{@media (hover:hover){background-color:var(--color-blue-600)}}}.hover\:bg-green-600{&:hover{@media (hover:hover){background-color:var(--color-green-600)}}}.hover\:bg-orange-600{&:hover{@media (hover:hover){background-color:var(--color-orange-600)}}}.hover\:bg-purple-600{&:hover{@media (hover:hover){background-color:var(--color-purple-600)}}}.hover\:bg-red-600{&:hover{@media (hover:hover){background-color:var(--color-red-600)}}}.focus\:ring-2{&:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\:ring-offset-2{&:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}}.focus\:outline-none{&:focus{--tw-outline-style:none;outline-style:none}}.disabled\:cursor-not-allowed{&:disabled{cursor:not-allowed}}.disabled\:bg-onpe-ui-gray{&:disabled{background-color:var(--color-onpe-ui-gray)}}.disabled\:opacity-50{&:disabled{opacity:50%}}.disabled\:hover\:bg-onpe-ui-gray{&:disabled{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray)}}}}.md\:block,.md\:gap-12,.md\:grid-cols-2,.md\:grid-cols-3,.md\:grid-cols-4,.md\:h-\[48px\],.md\:hidden,.md\:hover\:bg-onpe-ui-blue\/30,.md\:mt-20,.md\:text-2xl,.md\:text-\[64px\],.md\:text-lg,.md\:w-\[48px\],.md\:w-\[500px\]{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-blue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-blue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-dark-gray\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-dark-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-dark-gray) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray-extra-light\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-extra-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-extra-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray-light\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-green\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-green);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-green) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-light-skyblue\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-light-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-light-skyblue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-red\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-red);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-red) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-skyblue-light\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-skyblue\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-yellow-light\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-yellow-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-yellow\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-yellow);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow) 30%,transparent)}}}}}.lg\:flex-row,.lg\:grid-cols-4,.lg\:max-w-\[576px\],.lg\:mt-16,.lg\:mt-20,.lg\:mt-4,.lg\:px-5,.lg\:py-16,.lg\:text-2xl,.lg\:text-lg,.lg\:w-\[1024px\],.lg\:w-\[200px\],.xl\:px-12{@media (width >= 1280px){padding-inline:calc(var(--spacing)*12)}}}:root{--blue:#003770;--skyblue:#0073cf;--skyblue-light:#69b2e8;--yellow:#ffb81c;--light-skyblue:#aaeff6;--gray:#bcbcbc;--gray-light:#bdbdbd;--gray-extra-light:#f2f2f2;--red:#e3002b;--dark-gray:#4f4f4f;--green:#76bd43;--yellow-light:#fff1d2}button{cursor:pointer}@keyframes fastBlink{0%{opacity:1}25%{opacity:.8}50%{opacity:.4}75%{opacity:.8}to{opacity:1}}.fast-blink{animation:fastBlink .8s ease-in-out infinite}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(1turn)}}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial}}}
+/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer theme, base, components, utilities;@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-orange-500:oklch(70.5% 0.213 47.604);--color-blue-500:oklch(62.3% 0.214 259.815);--color-purple-500:oklch(62.7% 0.265 303.9);--color-purple-600:oklch(55.8% 0.288 302.321);--color-white:#fff;--spacing:0.25rem;--container-md:28rem;--container-2xl:42rem;--container-4xl:56rem;--text-xs:0.75rem;--text-xs--line-height:1.33333;--text-sm:0.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-base--line-height:1.5;--text-lg:1.125rem;--text-lg--line-height:1.55556;--text-xl:1.25rem;--text-xl--line-height:1.4;--text-2xl:1.5rem;--text-2xl--line-height:1.33333;--text-4xl:2.25rem;--text-4xl--line-height:1.11111;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--leading-normal:1.5;--radius-md:0.375rem;--radius-lg:0.5rem;--ease-in-out:cubic-bezier(0.4,0,0.2,1);--animate-spin:spin 1s linear infinite;--default-transition-duration:150ms;--default-transition-timing-function:cubic-bezier(0.4,0,0.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-onpe-ui-blue:var(--blue);--color-onpe-ui-skyblue:var(--skyblue);--color-onpe-ui-skyblue-light:var(--skyblue-light);--color-onpe-ui-yellow:var(--yellow);--color-onpe-ui-light-skyblue:var(--light-skyblue);--color-onpe-ui-gray:var(--gray);--color-onpe-ui-gray-light:var(--gray-light);--color-onpe-ui-gray-extra-light:var(--gray-extra-light);--color-onpe-ui-red:var(--red);--color-onpe-ui-dark-gray:var(--dark-gray);--color-onpe-ui-green:var(--green);--color-onpe-ui-yellow-light:var(--yellow-light)}}@layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:var(--default-font-feature-settings,normal);-webkit-tap-highlight-color:transparent;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:var(--default-mono-font-feature-settings,normal);font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}::file-selector-button,button,input,optgroup,select,textarea{font-feature-settings:inherit;background-color:transparent;border-radius:0;color:inherit;font:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}::file-selector-button,button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:calc(var(--spacing)*0)}.top-0{top:calc(var(--spacing)*0)}.top-4{top:calc(var(--spacing)*4)}.right-4{right:calc(var(--spacing)*4)}.-z-10{z-index:-10}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-50{z-index:50}.z-100{z-index:100}.container{width:100%;@media (width >= 40rem){max-width:40rem}@media (width >= 48rem){max-width:48rem}@media (width >= 64rem){max-width:64rem}@media (width >= 80rem){max-width:80rem}@media (width >= 96rem){max-width:96rem}}.mx-auto{margin-inline:auto}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-5{margin-top:calc(var(--spacing)*5)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-7{margin-top:calc(var(--spacing)*7)}.mt-10{margin-top:calc(var(--spacing)*10)}.mt-11{margin-top:calc(var(--spacing)*11)}.mr-2{margin-right:calc(var(--spacing)*2)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.-ml-1{margin-left:calc(var(--spacing)*-1)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-14{height:calc(var(--spacing)*14)}.h-16{height:calc(var(--spacing)*16)}.h-20{height:calc(var(--spacing)*20)}.h-22{height:calc(var(--spacing)*22)}.h-\[10px\]{height:10px}.h-\[32px\]{height:32px}.h-screen{height:100vh}.max-h-\[90vh\]{max-height:90vh}.min-h-screen{min-height:100vh}.w-4{width:calc(var(--spacing)*4)}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-16{width:calc(var(--spacing)*16)}.w-22{width:calc(var(--spacing)*22)}.w-\[10px\]{width:10px}.w-\[32px\]{width:32px}.w-\[98vw\]{width:98vw}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-\[95vw\]{max-width:95vw}.max-w-\[200px\]{max-width:200px}.max-w-\[680px\]{max-width:680px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.min-w-\[200px\]{min-width:200px}.min-w-\[320px\]{min-width:320px}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-decimal{list-style-type:decimal}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.justify-center{justify-content:center}.gap-4{gap:calc(var(--spacing)*4)}.gap-5{gap:calc(var(--spacing)*5)}.gap-6{gap:calc(var(--spacing)*6)}.gap-8{gap:calc(var(--spacing)*8)}.space-y-1{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*1*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*1*var(--tw-space-y-reverse))}}.space-y-3{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*3*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*3*var(--tw-space-y-reverse))}}.space-y-4{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*4*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*4*var(--tw-space-y-reverse))}}.space-y-6{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*6*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*6*var(--tw-space-y-reverse))}}.space-x-3{:where(&>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)*3*(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)*3*var(--tw-space-x-reverse))}}.space-x-4{:where(&>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)*4*(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)*4*var(--tw-space-x-reverse))}}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:calc(infinity * 1px)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-blue-500{border-color:var(--color-blue-500)}.bg-onpe-ui-blue,.bg-onpe-ui-blue\/80{background-color:var(--color-onpe-ui-blue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-blue) 80%,transparent)}}.bg-onpe-ui-dark-gray,.bg-onpe-ui-dark-gray\/80{background-color:var(--color-onpe-ui-dark-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-dark-gray) 80%,transparent)}}.bg-onpe-ui-gray{background-color:var(--color-onpe-ui-gray)}.bg-onpe-ui-gray-extra-light,.bg-onpe-ui-gray-extra-light\/80{background-color:var(--color-onpe-ui-gray-extra-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-extra-light) 80%,transparent)}}.bg-onpe-ui-gray-light,.bg-onpe-ui-gray-light\/80{background-color:var(--color-onpe-ui-gray-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-light) 80%,transparent)}}.bg-onpe-ui-gray\/80{background-color:var(--color-onpe-ui-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray) 80%,transparent)}}.bg-onpe-ui-green,.bg-onpe-ui-green\/80{background-color:var(--color-onpe-ui-green);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-green) 80%,transparent)}}.bg-onpe-ui-light-skyblue,.bg-onpe-ui-light-skyblue\/80{background-color:var(--color-onpe-ui-light-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-light-skyblue) 80%,transparent)}}.bg-onpe-ui-red,.bg-onpe-ui-red\/80{background-color:var(--color-onpe-ui-red);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-red) 80%,transparent)}}.bg-onpe-ui-skyblue{background-color:var(--color-onpe-ui-skyblue)}.bg-onpe-ui-skyblue-light,.bg-onpe-ui-skyblue-light\/80{background-color:var(--color-onpe-ui-skyblue-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue-light) 80%,transparent)}}.bg-onpe-ui-skyblue\/80{background-color:var(--color-onpe-ui-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue) 80%,transparent)}}.bg-onpe-ui-yellow{background-color:var(--color-onpe-ui-yellow)}.bg-onpe-ui-yellow-light,.bg-onpe-ui-yellow-light\/80{background-color:var(--color-onpe-ui-yellow-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow-light) 80%,transparent)}}.bg-onpe-ui-yellow\/80{background-color:var(--color-onpe-ui-yellow);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow) 80%,transparent)}}.bg-purple-500{background-color:var(--color-purple-500)}.bg-white{background-color:var(--color-white)}.bg-white\/20{background-color:color-mix(in srgb,#fff 20%,transparent);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-6{padding:calc(var(--spacing)*6)}.p-8{padding:calc(var(--spacing)*8)}.p-\[7px\]{padding:7px}.px-1{padding-inline:calc(var(--spacing)*1)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.py-10{padding-block:calc(var(--spacing)*10)}.pt-5{padding-top:calc(var(--spacing)*5)}.pt-10{padding-top:calc(var(--spacing)*10)}.pb-8{padding-bottom:calc(var(--spacing)*8)}.pb-24\.5{padding-bottom:calc(var(--spacing)*24.5)}.text-center{text-align:center}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-normal{--tw-leading:var(--leading-normal);line-height:var(--leading-normal)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-onpe-ui-blue{color:var(--color-onpe-ui-blue)}.text-onpe-ui-dark-gray{color:var(--color-onpe-ui-dark-gray)}.text-onpe-ui-gray{color:var(--color-onpe-ui-gray)}.text-onpe-ui-gray-light{color:var(--color-onpe-ui-gray-light)}.text-onpe-ui-green{color:var(--color-onpe-ui-green)}.text-onpe-ui-red{color:var(--color-onpe-ui-red)}.text-onpe-ui-skyblue{color:var(--color-onpe-ui-skyblue)}.text-onpe-ui-yellow{color:var(--color-onpe-ui-yellow)}.text-orange-500{color:var(--color-orange-500)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.opacity-25{opacity:25%}.opacity-50{opacity:50%}.opacity-75{opacity:75%}.opacity-100{opacity:100%}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,rgba(0,0,0,.1)),0 1px 2px -1px var(--tw-shadow-color,rgba(0,0,0,.1))}.shadow,.shadow-lg{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,rgba(0,0,0,.1)),0 4px 6px -4px var(--tw-shadow-color,rgba(0,0,0,.1))}.transition-all{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-colors{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.duration-300{--tw-duration:300ms;transition-duration:.3s}.duration-500{--tw-duration:500ms;transition-duration:.5s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.hover\:bg-onpe-ui-blue{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-blue)}}}.hover\:bg-onpe-ui-blue\/80{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-blue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-blue) 80%,transparent)}}}}.hover\:bg-onpe-ui-dark-gray{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-dark-gray)}}}.hover\:bg-onpe-ui-gray-extra-light{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-extra-light)}}}.hover\:bg-onpe-ui-gray\/80{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray) 80%,transparent)}}}}.hover\:bg-onpe-ui-green{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-green)}}}.hover\:bg-onpe-ui-green\/80{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-green);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-green) 80%,transparent)}}}}.hover\:bg-onpe-ui-light-skyblue{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-light-skyblue)}}}.hover\:bg-onpe-ui-red{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-red)}}}.hover\:bg-onpe-ui-red\/80{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-red);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-red) 80%,transparent)}}}}.hover\:bg-onpe-ui-skyblue{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue)}}}.hover\:bg-purple-600{&:hover{@media (hover:hover){background-color:var(--color-purple-600)}}}.focus\:ring-2{&:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\:ring-offset-2{&:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}}.focus\:outline-none{&:focus{--tw-outline-style:none;outline-style:none}}.disabled\:cursor-not-allowed{&:disabled{cursor:not-allowed}}.disabled\:bg-onpe-ui-gray{&:disabled{background-color:var(--color-onpe-ui-gray)}}.disabled\:opacity-50{&:disabled{opacity:50%}}.disabled\:hover\:bg-onpe-ui-gray{&:disabled{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray)}}}}.md\:block,.md\:gap-12,.md\:grid-cols-2,.md\:grid-cols-3,.md\:grid-cols-4,.md\:h-\[48px\],.md\:hidden,.md\:hover\:bg-onpe-ui-blue\/30,.md\:mt-20,.md\:text-2xl,.md\:text-\[64px\],.md\:text-lg,.md\:w-\[48px\],.md\:w-\[500px\]{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-blue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-blue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-dark-gray\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-dark-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-dark-gray) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray-extra-light\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-extra-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-extra-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray-light\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-green\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-green);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-green) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-light-skyblue\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-light-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-light-skyblue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-red\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-red);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-red) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-skyblue-light\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-skyblue\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-yellow-light\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-yellow-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-yellow\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-yellow);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow) 30%,transparent)}}}}}.lg\:flex-row,.lg\:grid-cols-4,.lg\:max-w-\[576px\],.lg\:mt-16,.lg\:mt-20,.lg\:mt-4,.lg\:px-5,.lg\:py-16,.lg\:text-2xl,.lg\:text-lg,.lg\:w-\[1024px\],.lg\:w-\[200px\],.xl\:px-12{@media (width >= 80rem){padding-inline:calc(var(--spacing)*12)}}}:root{--blue:#003770;--skyblue:#0073cf;--skyblue-light:#69b2e8;--yellow:#ffb81c;--light-skyblue:#aaeff6;--gray:#bcbcbc;--gray-light:#bdbdbd;--gray-extra-light:#f2f2f2;--red:#e3002b;--dark-gray:#4f4f4f;--green:#76bd43;--yellow-light:#fff1d2}button{cursor:pointer}@keyframes fastBlink{0%{opacity:1}25%{opacity:.8}50%{opacity:.4}75%{opacity:.8}to{opacity:1}}.fast-blink{animation:fastBlink .8s ease-in-out infinite}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(1turn)}}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial}}}

package/dist/index.esm.css

@@ -1 +1 @@
-/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer theme, base, components, utilities;@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-500:oklch(63.7% 0.237 25.331);--color-red-600:oklch(57.7% 0.245 27.325);--color-orange-500:oklch(70.5% 0.213 47.604);--color-orange-600:oklch(64.6% 0.222 41.116);--color-green-500:oklch(72.3% 0.219 149.579);--color-green-600:oklch(62.7% 0.194 149.214);--color-blue-500:oklch(62.3% 0.214 259.815);--color-blue-600:oklch(54.6% 0.245 262.881);--color-purple-500:oklch(62.7% 0.265 303.9);--color-purple-600:oklch(55.8% 0.288 302.321);--color-gray-100:oklch(96.7% 0.003 264.542);--color-gray-600:oklch(44.6% 0.03 256.802);--color-white:#fff;--spacing:0.25rem;--container-md:28rem;--container-2xl:42rem;--container-4xl:56rem;--text-xs:0.75rem;--text-xs--line-height:1.33333;--text-sm:0.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-base--line-height:1.5;--text-lg:1.125rem;--text-lg--line-height:1.55556;--text-xl:1.25rem;--text-xl--line-height:1.4;--text-2xl:1.5rem;--text-2xl--line-height:1.33333;--text-4xl:2.25rem;--text-4xl--line-height:1.11111;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--leading-normal:1.5;--radius-md:0.375rem;--radius-lg:0.5rem;--ease-in-out:cubic-bezier(0.4,0,0.2,1);--animate-spin:spin 1s linear infinite;--default-transition-duration:150ms;--default-transition-timing-function:cubic-bezier(0.4,0,0.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-onpe-ui-blue:var(--blue);--color-onpe-ui-skyblue:var(--skyblue);--color-onpe-ui-skyblue-light:var(--skyblue-light);--color-onpe-ui-yellow:var(--yellow);--color-onpe-ui-light-skyblue:var(--light-skyblue);--color-onpe-ui-gray:var(--gray);--color-onpe-ui-gray-light:var(--gray-light);--color-onpe-ui-gray-extra-light:var(--gray-extra-light);--color-onpe-ui-red:var(--red);--color-onpe-ui-dark-gray:var(--dark-gray);--color-onpe-ui-green:var(--green);--color-onpe-ui-yellow-light:var(--yellow-light)}}@layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:var(--default-font-feature-settings,normal);-webkit-tap-highlight-color:transparent;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:var(--default-mono-font-feature-settings,normal);font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}::file-selector-button,button,input,optgroup,select,textarea{font-feature-settings:inherit;background-color:transparent;border-radius:0;color:inherit;font:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}::file-selector-button,button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:calc(var(--spacing)*0)}.top-0{top:calc(var(--spacing)*0)}.top-4{top:calc(var(--spacing)*4)}.right-4{right:calc(var(--spacing)*4)}.-z-10{z-index:-10}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-50{z-index:50}.z-100{z-index:100}.container{width:100%;@media (width >= 640px){max-width:640px}@media (width >= 768px){max-width:768px}@media (width >= 1024px){max-width:1024px}@media (width >= 1200px){max-width:1200px}@media (width >= 1280px){max-width:1280px}@media (width >= 1536px){max-width:1536px}@media (width >= 1650px){max-width:1650px}}.mx-auto{margin-inline:auto}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-5{margin-top:calc(var(--spacing)*5)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-7{margin-top:calc(var(--spacing)*7)}.mt-10{margin-top:calc(var(--spacing)*10)}.mt-11{margin-top:calc(var(--spacing)*11)}.mr-2{margin-right:calc(var(--spacing)*2)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.-ml-1{margin-left:calc(var(--spacing)*-1)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-14{height:calc(var(--spacing)*14)}.h-16{height:calc(var(--spacing)*16)}.h-20{height:calc(var(--spacing)*20)}.h-22{height:calc(var(--spacing)*22)}.h-\[10px\]{height:10px}.h-\[32px\]{height:32px}.h-screen{height:100vh}.max-h-\[90vh\]{max-height:90vh}.min-h-screen{min-height:100vh}.w-4{width:calc(var(--spacing)*4)}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-16{width:calc(var(--spacing)*16)}.w-22{width:calc(var(--spacing)*22)}.w-\[10px\]{width:10px}.w-\[32px\]{width:32px}.w-\[98vw\]{width:98vw}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-\[95vw\]{max-width:95vw}.max-w-\[200px\]{max-width:200px}.max-w-\[680px\]{max-width:680px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.min-w-\[200px\]{min-width:200px}.min-w-\[320px\]{min-width:320px}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-decimal{list-style-type:decimal}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.justify-center{justify-content:center}.gap-4{gap:calc(var(--spacing)*4)}.gap-5{gap:calc(var(--spacing)*5)}.gap-6{gap:calc(var(--spacing)*6)}.gap-8{gap:calc(var(--spacing)*8)}.space-y-1{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*1*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*1*var(--tw-space-y-reverse))}}.space-y-3{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*3*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*3*var(--tw-space-y-reverse))}}.space-y-4{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*4*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*4*var(--tw-space-y-reverse))}}.space-y-6{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*6*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*6*var(--tw-space-y-reverse))}}.space-x-3{:where(&>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)*3*(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)*3*var(--tw-space-x-reverse))}}.space-x-4{:where(&>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)*4*(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)*4*var(--tw-space-x-reverse))}}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:calc(infinity * 1px)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-blue-500{border-color:var(--color-blue-500)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-green-500{background-color:var(--color-green-500)}.bg-onpe-ui-blue{background-color:var(--color-onpe-ui-blue)}.bg-onpe-ui-dark-gray{background-color:var(--color-onpe-ui-dark-gray)}.bg-onpe-ui-gray{background-color:var(--color-onpe-ui-gray)}.bg-onpe-ui-gray-extra-light{background-color:var(--color-onpe-ui-gray-extra-light)}.bg-onpe-ui-gray-light{background-color:var(--color-onpe-ui-gray-light)}.bg-onpe-ui-green{background-color:var(--color-onpe-ui-green)}.bg-onpe-ui-light-skyblue{background-color:var(--color-onpe-ui-light-skyblue)}.bg-onpe-ui-red{background-color:var(--color-onpe-ui-red)}.bg-onpe-ui-skyblue{background-color:var(--color-onpe-ui-skyblue)}.bg-onpe-ui-skyblue-light{background-color:var(--color-onpe-ui-skyblue-light)}.bg-onpe-ui-yellow{background-color:var(--color-onpe-ui-yellow)}.bg-onpe-ui-yellow-light{background-color:var(--color-onpe-ui-yellow-light)}.bg-orange-500{background-color:var(--color-orange-500)}.bg-purple-500{background-color:var(--color-purple-500)}.bg-red-500{background-color:var(--color-red-500)}.bg-white{background-color:var(--color-white)}.bg-white\/20{background-color:color-mix(in srgb,#fff 20%,transparent);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-6{padding:calc(var(--spacing)*6)}.p-8{padding:calc(var(--spacing)*8)}.p-\[7px\]{padding:7px}.px-1{padding-inline:calc(var(--spacing)*1)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.py-10{padding-block:calc(var(--spacing)*10)}.pt-5{padding-top:calc(var(--spacing)*5)}.pt-10{padding-top:calc(var(--spacing)*10)}.pb-8{padding-bottom:calc(var(--spacing)*8)}.pb-24\.5{padding-bottom:calc(var(--spacing)*24.5)}.text-center{text-align:center}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-normal{--tw-leading:var(--leading-normal);line-height:var(--leading-normal)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-blue-500{color:var(--color-blue-500)}.text-gray-600{color:var(--color-gray-600)}.text-orange-500{color:var(--color-orange-500)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.opacity-25{opacity:25%}.opacity-50{opacity:50%}.opacity-75{opacity:75%}.opacity-100{opacity:100%}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,rgba(0,0,0,.1)),0 1px 2px -1px var(--tw-shadow-color,rgba(0,0,0,.1))}.shadow,.shadow-lg{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,rgba(0,0,0,.1)),0 4px 6px -4px var(--tw-shadow-color,rgba(0,0,0,.1))}.transition-all{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-colors{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.duration-300{--tw-duration:300ms;transition-duration:.3s}.duration-500{--tw-duration:500ms;transition-duration:.5s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.hover\:bg-blue-600{&:hover{@media (hover:hover){background-color:var(--color-blue-600)}}}.hover\:bg-green-600{&:hover{@media (hover:hover){background-color:var(--color-green-600)}}}.hover\:bg-orange-600{&:hover{@media (hover:hover){background-color:var(--color-orange-600)}}}.hover\:bg-purple-600{&:hover{@media (hover:hover){background-color:var(--color-purple-600)}}}.hover\:bg-red-600{&:hover{@media (hover:hover){background-color:var(--color-red-600)}}}.focus\:ring-2{&:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\:ring-offset-2{&:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}}.focus\:outline-none{&:focus{--tw-outline-style:none;outline-style:none}}.disabled\:cursor-not-allowed{&:disabled{cursor:not-allowed}}.disabled\:bg-onpe-ui-gray{&:disabled{background-color:var(--color-onpe-ui-gray)}}.disabled\:opacity-50{&:disabled{opacity:50%}}.disabled\:hover\:bg-onpe-ui-gray{&:disabled{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray)}}}}.md\:block,.md\:gap-12,.md\:grid-cols-2,.md\:grid-cols-3,.md\:grid-cols-4,.md\:h-\[48px\],.md\:hidden,.md\:hover\:bg-onpe-ui-blue\/30,.md\:mt-20,.md\:text-2xl,.md\:text-\[64px\],.md\:text-lg,.md\:w-\[48px\],.md\:w-\[500px\]{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-blue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-blue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-dark-gray\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-dark-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-dark-gray) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray-extra-light\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-extra-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-extra-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray-light\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-green\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-green);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-green) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-light-skyblue\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-light-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-light-skyblue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-red\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-red);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-red) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-skyblue-light\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-skyblue\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-yellow-light\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-yellow-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-yellow\/30{@media (width >= 768px){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-yellow);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow) 30%,transparent)}}}}}.lg\:flex-row,.lg\:grid-cols-4,.lg\:max-w-\[576px\],.lg\:mt-16,.lg\:mt-20,.lg\:mt-4,.lg\:px-5,.lg\:py-16,.lg\:text-2xl,.lg\:text-lg,.lg\:w-\[1024px\],.lg\:w-\[200px\],.xl\:px-12{@media (width >= 1280px){padding-inline:calc(var(--spacing)*12)}}}:root{--blue:#003770;--skyblue:#0073cf;--skyblue-light:#69b2e8;--yellow:#ffb81c;--light-skyblue:#aaeff6;--gray:#bcbcbc;--gray-light:#bdbdbd;--gray-extra-light:#f2f2f2;--red:#e3002b;--dark-gray:#4f4f4f;--green:#76bd43;--yellow-light:#fff1d2}button{cursor:pointer}@keyframes fastBlink{0%{opacity:1}25%{opacity:.8}50%{opacity:.4}75%{opacity:.8}to{opacity:1}}.fast-blink{animation:fastBlink .8s ease-in-out infinite}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(1turn)}}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial}}}
+/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer theme, base, components, utilities;@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-orange-500:oklch(70.5% 0.213 47.604);--color-blue-500:oklch(62.3% 0.214 259.815);--color-purple-500:oklch(62.7% 0.265 303.9);--color-purple-600:oklch(55.8% 0.288 302.321);--color-white:#fff;--spacing:0.25rem;--container-md:28rem;--container-2xl:42rem;--container-4xl:56rem;--text-xs:0.75rem;--text-xs--line-height:1.33333;--text-sm:0.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-base--line-height:1.5;--text-lg:1.125rem;--text-lg--line-height:1.55556;--text-xl:1.25rem;--text-xl--line-height:1.4;--text-2xl:1.5rem;--text-2xl--line-height:1.33333;--text-4xl:2.25rem;--text-4xl--line-height:1.11111;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--leading-normal:1.5;--radius-md:0.375rem;--radius-lg:0.5rem;--ease-in-out:cubic-bezier(0.4,0,0.2,1);--animate-spin:spin 1s linear infinite;--default-transition-duration:150ms;--default-transition-timing-function:cubic-bezier(0.4,0,0.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-onpe-ui-blue:var(--blue);--color-onpe-ui-skyblue:var(--skyblue);--color-onpe-ui-skyblue-light:var(--skyblue-light);--color-onpe-ui-yellow:var(--yellow);--color-onpe-ui-light-skyblue:var(--light-skyblue);--color-onpe-ui-gray:var(--gray);--color-onpe-ui-gray-light:var(--gray-light);--color-onpe-ui-gray-extra-light:var(--gray-extra-light);--color-onpe-ui-red:var(--red);--color-onpe-ui-dark-gray:var(--dark-gray);--color-onpe-ui-green:var(--green);--color-onpe-ui-yellow-light:var(--yellow-light)}}@layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:var(--default-font-feature-settings,normal);-webkit-tap-highlight-color:transparent;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:var(--default-mono-font-feature-settings,normal);font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}::file-selector-button,button,input,optgroup,select,textarea{font-feature-settings:inherit;background-color:transparent;border-radius:0;color:inherit;font:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}::file-selector-button,button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:calc(var(--spacing)*0)}.top-0{top:calc(var(--spacing)*0)}.top-4{top:calc(var(--spacing)*4)}.right-4{right:calc(var(--spacing)*4)}.-z-10{z-index:-10}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-50{z-index:50}.z-100{z-index:100}.container{width:100%;@media (width >= 40rem){max-width:40rem}@media (width >= 48rem){max-width:48rem}@media (width >= 64rem){max-width:64rem}@media (width >= 80rem){max-width:80rem}@media (width >= 96rem){max-width:96rem}}.mx-auto{margin-inline:auto}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-5{margin-top:calc(var(--spacing)*5)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-7{margin-top:calc(var(--spacing)*7)}.mt-10{margin-top:calc(var(--spacing)*10)}.mt-11{margin-top:calc(var(--spacing)*11)}.mr-2{margin-right:calc(var(--spacing)*2)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.-ml-1{margin-left:calc(var(--spacing)*-1)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-14{height:calc(var(--spacing)*14)}.h-16{height:calc(var(--spacing)*16)}.h-20{height:calc(var(--spacing)*20)}.h-22{height:calc(var(--spacing)*22)}.h-\[10px\]{height:10px}.h-\[32px\]{height:32px}.h-screen{height:100vh}.max-h-\[90vh\]{max-height:90vh}.min-h-screen{min-height:100vh}.w-4{width:calc(var(--spacing)*4)}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-16{width:calc(var(--spacing)*16)}.w-22{width:calc(var(--spacing)*22)}.w-\[10px\]{width:10px}.w-\[32px\]{width:32px}.w-\[98vw\]{width:98vw}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-\[95vw\]{max-width:95vw}.max-w-\[200px\]{max-width:200px}.max-w-\[680px\]{max-width:680px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.min-w-\[200px\]{min-width:200px}.min-w-\[320px\]{min-width:320px}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-decimal{list-style-type:decimal}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.justify-center{justify-content:center}.gap-4{gap:calc(var(--spacing)*4)}.gap-5{gap:calc(var(--spacing)*5)}.gap-6{gap:calc(var(--spacing)*6)}.gap-8{gap:calc(var(--spacing)*8)}.space-y-1{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*1*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*1*var(--tw-space-y-reverse))}}.space-y-3{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*3*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*3*var(--tw-space-y-reverse))}}.space-y-4{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*4*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*4*var(--tw-space-y-reverse))}}.space-y-6{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*6*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*6*var(--tw-space-y-reverse))}}.space-x-3{:where(&>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)*3*(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)*3*var(--tw-space-x-reverse))}}.space-x-4{:where(&>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-end:calc(var(--spacing)*4*(1 - var(--tw-space-x-reverse)));margin-inline-start:calc(var(--spacing)*4*var(--tw-space-x-reverse))}}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:calc(infinity * 1px)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-blue-500{border-color:var(--color-blue-500)}.bg-onpe-ui-blue,.bg-onpe-ui-blue\/80{background-color:var(--color-onpe-ui-blue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-blue) 80%,transparent)}}.bg-onpe-ui-dark-gray,.bg-onpe-ui-dark-gray\/80{background-color:var(--color-onpe-ui-dark-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-dark-gray) 80%,transparent)}}.bg-onpe-ui-gray{background-color:var(--color-onpe-ui-gray)}.bg-onpe-ui-gray-extra-light,.bg-onpe-ui-gray-extra-light\/80{background-color:var(--color-onpe-ui-gray-extra-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-extra-light) 80%,transparent)}}.bg-onpe-ui-gray-light,.bg-onpe-ui-gray-light\/80{background-color:var(--color-onpe-ui-gray-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-light) 80%,transparent)}}.bg-onpe-ui-gray\/80{background-color:var(--color-onpe-ui-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray) 80%,transparent)}}.bg-onpe-ui-green,.bg-onpe-ui-green\/80{background-color:var(--color-onpe-ui-green);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-green) 80%,transparent)}}.bg-onpe-ui-light-skyblue,.bg-onpe-ui-light-skyblue\/80{background-color:var(--color-onpe-ui-light-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-light-skyblue) 80%,transparent)}}.bg-onpe-ui-red,.bg-onpe-ui-red\/80{background-color:var(--color-onpe-ui-red);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-red) 80%,transparent)}}.bg-onpe-ui-skyblue{background-color:var(--color-onpe-ui-skyblue)}.bg-onpe-ui-skyblue-light,.bg-onpe-ui-skyblue-light\/80{background-color:var(--color-onpe-ui-skyblue-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue-light) 80%,transparent)}}.bg-onpe-ui-skyblue\/80{background-color:var(--color-onpe-ui-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue) 80%,transparent)}}.bg-onpe-ui-yellow{background-color:var(--color-onpe-ui-yellow)}.bg-onpe-ui-yellow-light,.bg-onpe-ui-yellow-light\/80{background-color:var(--color-onpe-ui-yellow-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow-light) 80%,transparent)}}.bg-onpe-ui-yellow\/80{background-color:var(--color-onpe-ui-yellow);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow) 80%,transparent)}}.bg-purple-500{background-color:var(--color-purple-500)}.bg-white{background-color:var(--color-white)}.bg-white\/20{background-color:color-mix(in srgb,#fff 20%,transparent);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-6{padding:calc(var(--spacing)*6)}.p-8{padding:calc(var(--spacing)*8)}.p-\[7px\]{padding:7px}.px-1{padding-inline:calc(var(--spacing)*1)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.py-10{padding-block:calc(var(--spacing)*10)}.pt-5{padding-top:calc(var(--spacing)*5)}.pt-10{padding-top:calc(var(--spacing)*10)}.pb-8{padding-bottom:calc(var(--spacing)*8)}.pb-24\.5{padding-bottom:calc(var(--spacing)*24.5)}.text-center{text-align:center}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-normal{--tw-leading:var(--leading-normal);line-height:var(--leading-normal)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-onpe-ui-blue{color:var(--color-onpe-ui-blue)}.text-onpe-ui-dark-gray{color:var(--color-onpe-ui-dark-gray)}.text-onpe-ui-gray{color:var(--color-onpe-ui-gray)}.text-onpe-ui-gray-light{color:var(--color-onpe-ui-gray-light)}.text-onpe-ui-green{color:var(--color-onpe-ui-green)}.text-onpe-ui-red{color:var(--color-onpe-ui-red)}.text-onpe-ui-skyblue{color:var(--color-onpe-ui-skyblue)}.text-onpe-ui-yellow{color:var(--color-onpe-ui-yellow)}.text-orange-500{color:var(--color-orange-500)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.opacity-25{opacity:25%}.opacity-50{opacity:50%}.opacity-75{opacity:75%}.opacity-100{opacity:100%}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,rgba(0,0,0,.1)),0 1px 2px -1px var(--tw-shadow-color,rgba(0,0,0,.1))}.shadow,.shadow-lg{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,rgba(0,0,0,.1)),0 4px 6px -4px var(--tw-shadow-color,rgba(0,0,0,.1))}.transition-all{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-colors{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.duration-300{--tw-duration:300ms;transition-duration:.3s}.duration-500{--tw-duration:500ms;transition-duration:.5s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.hover\:bg-onpe-ui-blue{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-blue)}}}.hover\:bg-onpe-ui-blue\/80{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-blue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-blue) 80%,transparent)}}}}.hover\:bg-onpe-ui-dark-gray{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-dark-gray)}}}.hover\:bg-onpe-ui-gray-extra-light{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-extra-light)}}}.hover\:bg-onpe-ui-gray\/80{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray) 80%,transparent)}}}}.hover\:bg-onpe-ui-green{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-green)}}}.hover\:bg-onpe-ui-green\/80{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-green);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-green) 80%,transparent)}}}}.hover\:bg-onpe-ui-light-skyblue{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-light-skyblue)}}}.hover\:bg-onpe-ui-red{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-red)}}}.hover\:bg-onpe-ui-red\/80{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-red);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-red) 80%,transparent)}}}}.hover\:bg-onpe-ui-skyblue{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue)}}}.hover\:bg-purple-600{&:hover{@media (hover:hover){background-color:var(--color-purple-600)}}}.focus\:ring-2{&:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\:ring-offset-2{&:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}}.focus\:outline-none{&:focus{--tw-outline-style:none;outline-style:none}}.disabled\:cursor-not-allowed{&:disabled{cursor:not-allowed}}.disabled\:bg-onpe-ui-gray{&:disabled{background-color:var(--color-onpe-ui-gray)}}.disabled\:opacity-50{&:disabled{opacity:50%}}.disabled\:hover\:bg-onpe-ui-gray{&:disabled{&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray)}}}}.md\:block,.md\:gap-12,.md\:grid-cols-2,.md\:grid-cols-3,.md\:grid-cols-4,.md\:h-\[48px\],.md\:hidden,.md\:hover\:bg-onpe-ui-blue\/30,.md\:mt-20,.md\:text-2xl,.md\:text-\[64px\],.md\:text-lg,.md\:w-\[48px\],.md\:w-\[500px\]{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-blue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-blue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-dark-gray\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-dark-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-dark-gray) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray-extra-light\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-extra-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-extra-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray-light\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-gray\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-gray);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-gray) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-green\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-green);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-green) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-light-skyblue\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-light-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-light-skyblue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-red\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-red);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-red) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-skyblue-light\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-skyblue\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-skyblue);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-skyblue) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-yellow-light\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-yellow-light);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow-light) 30%,transparent)}}}}}.md\:hover\:bg-onpe-ui-yellow\/30{@media (width >= 48rem){&:hover{@media (hover:hover){background-color:var(--color-onpe-ui-yellow);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--color-onpe-ui-yellow) 30%,transparent)}}}}}.lg\:flex-row,.lg\:grid-cols-4,.lg\:max-w-\[576px\],.lg\:mt-16,.lg\:mt-20,.lg\:mt-4,.lg\:px-5,.lg\:py-16,.lg\:text-2xl,.lg\:text-lg,.lg\:w-\[1024px\],.lg\:w-\[200px\],.xl\:px-12{@media (width >= 80rem){padding-inline:calc(var(--spacing)*12)}}}:root{--blue:#003770;--skyblue:#0073cf;--skyblue-light:#69b2e8;--yellow:#ffb81c;--light-skyblue:#aaeff6;--gray:#bcbcbc;--gray-light:#bdbdbd;--gray-extra-light:#f2f2f2;--red:#e3002b;--dark-gray:#4f4f4f;--green:#76bd43;--yellow-light:#fff1d2}button{cursor:pointer}@keyframes fastBlink{0%{opacity:1}25%{opacity:.8}50%{opacity:.4}75%{opacity:.8}to{opacity:1}}.fast-blink{animation:fastBlink .8s ease-in-out infinite}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(1turn)}}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial}}}

package/dist/index.esm.js

@@ -156,33 +156,33 @@ var Overlay = function (_a) {
     var getColorClass = function () {
         switch (color) {
             case "blue":
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
             case "skyblue":
-                return "bg-skyblue/80";
+                return "bg-onpe-ui-skyblue/80";
             case "skyblue-light":
-                return "bg-skyblue-light/80";
+                return "bg-onpe-ui-skyblue-light/80";
             case "yellow":
-                return "bg-yellow/80";
+                return "bg-onpe-ui-yellow/80";
             case "light-skyblue":
-                return "bg-light-skyblue/80";
+                return "bg-onpe-ui-light-skyblue/80";
             case "gray":
-                return "bg-gray/80";
+                return "bg-onpe-ui-gray/80";
             case "gray-light":
-                return "bg-gray-light/80";
+                return "bg-onpe-ui-gray-light/80";
             case "gray-extra-light":
-                return "bg-gray-extra-light/80";
+                return "bg-onpe-ui-gray-extra-light/80";
             case "red":
-                return "bg-red/80";
+                return "bg-onpe-ui-red/80";
             case "dark-gray":
-                return "bg-dark-gray/80";
+                return "bg-onpe-ui-dark-gray/80";
             case "green":
-                return "bg-green/80";
+                return "bg-onpe-ui-green/80";
             case "yellow-light":
-                return "bg-yellow-light/80";
+                return "bg-onpe-ui-yellow-light/80";
             case "primary":
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
             default:
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
         }
     };
     return (jsx("div", { onClick: onClick, className: "".concat(show ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0", " absolute inset-0 w-full h-screen z-10 ").concat(getColorClass(), " transition-all duration-500 ease-in-out") }));
@@ -204,7 +204,7 @@ var Modal = function (_a) {
                                     ? "flex flex-col items-center justify-center"
                                     : "bg-white flex flex-col items-center justify-center  md:px-auto px-1 lg:px-5 min-w-[320px] w-[98vw] md:w-[500px] lg:w-[1024px] max-w-[95vw] max-h-[90vh] overflow-y-auto",
                                 props.className ? props.className : "py-10 lg:py-16",
-                            ]), children: children }), closeButton && (jsx("button", { onClick: onClose, className: "absolute top-4 right-4 rounded-full bg-red p-[7px] flex items-center justify-center z-30", "aria-label": "Cerrar", children: jsx(IconClose, { className: "h-[10px]  w-[10px] text-white" }) }))] })] }) }));
+                            ]), children: children }), closeButton && (jsx("button", { onClick: onClose, className: "absolute top-4 right-4 rounded-full bg-onpe-ui-red p-[7px] flex items-center justify-center z-30", "aria-label": "Cerrar", children: jsx(IconClose, { className: "h-[10px]  w-[10px] text-white" }) }))] })] }) }));
 };
 
 var IconWarning = function (props) { return (jsx("svg", __assign({ width: 16, height: 16, viewBox: "0 0 60 51", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsx("path", { d: "M0.667969 50.9987L30.0013 0.332031L59.3346 50.9987H0.667969ZM9.86797 45.6654H50.1346L30.0013 10.9987L9.86797 45.6654ZM30.0013 42.9987C30.7569 42.9987 31.3906 42.7427 31.9026 42.2307C32.4146 41.7187 32.6697 41.0858 32.668 40.332C32.668 39.5765 32.412 38.9427 31.9 38.4307C31.388 37.9187 30.7551 37.6636 30.0013 37.6654C29.2457 37.6654 28.612 37.9214 28.1 38.4334C27.588 38.9454 27.3329 39.5783 27.3346 40.332C27.3346 41.0876 27.5906 41.7214 28.1026 42.2334C28.6146 42.7454 29.2475 43.0005 30.0013 42.9987ZM27.3346 34.9987H32.668V21.6654H27.3346V34.9987Z", fill: "currentColor" }) }))); };
@@ -219,7 +219,7 @@ var IconEdgeColor = function (props) { return (jsxs("svg", __assign({ width: 48,
 
 var BrowserIncompatible = function (_a) {
     var _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.className, className = _d === void 0 ? "" : _d;
-    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, children: [jsx("div", { className: "flex justify-center items-center", children: jsx(IconWarning, { className: "w-22 h-22 text-skyblue" }) }), jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-skyblue font-medium", children: "Navegador no recomendado" }), jsx("p", { className: "text-sm md:text-lg text-center mt-6", children: "Para una mejor experiencia y mayor seguridad, debes ingresar con los siguientes navegadores:" }), jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5", children: [jsx(IconChromeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconSafariColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconMozillaColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconEdgeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
+    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, children: [jsx("div", { className: "flex justify-center items-center", children: jsx(IconWarning, { className: "w-22 h-22 text-onpe-ui-skyblue" }) }), jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-onpe-ui-skyblue font-medium", children: "Navegador no recomendado" }), jsx("p", { className: "text-sm md:text-lg text-center mt-6", children: "Para una mejor experiencia y mayor seguridad, debes ingresar con los siguientes navegadores:" }), jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5", children: [jsx(IconChromeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconSafariColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconMozillaColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconEdgeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
 };
 
 var IconCheck = function (props) { return (jsx("svg", __assign({ width: 64, height: 64, viewBox: "0 0 64 64", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "mt-10 lg:mt-16" }, props, { children: jsx("path", { d: "M28.2673 44.2663L47.0673 25.4663L43.334 21.733L28.2673 36.7997L20.6673 29.1997L16.934 32.933L28.2673 44.2663ZM32.0007 58.6663C28.3118 58.6663 24.8451 57.9659 21.6007 56.565C18.3562 55.1641 15.534 53.2646 13.134 50.8663C10.734 48.4663 8.83443 45.6441 7.43532 42.3997C6.03621 39.1552 5.33576 35.6886 5.33398 31.9997C5.33398 28.3108 6.03443 24.8441 7.43532 21.5997C8.83621 18.3552 10.7358 15.533 13.134 13.133C15.534 10.733 18.3562 8.83345 21.6007 7.43434C24.8451 6.03523 28.3118 5.33479 32.0007 5.33301C35.6895 5.33301 39.1562 6.03345 42.4007 7.43434C45.6451 8.83523 48.4673 10.7348 50.8673 13.133C53.2673 15.533 55.1678 18.3552 56.5686 21.5997C57.9695 24.8441 58.6691 28.3108 58.6673 31.9997C58.6673 35.6886 57.9669 39.1552 56.566 42.3997C55.1651 45.6441 53.2655 48.4663 50.8673 50.8663C48.4673 53.2663 45.6451 55.1668 42.4007 56.5677C39.1562 57.9686 35.6895 58.6681 32.0007 58.6663ZM32.0007 53.333C37.9562 53.333 43.0006 51.2663 47.134 47.133C51.2673 42.9997 53.334 37.9552 53.334 31.9997C53.334 26.0441 51.2673 20.9997 47.134 16.8663C43.0006 12.733 37.9562 10.6663 32.0007 10.6663C26.0451 10.6663 21.0007 12.733 16.8673 16.8663C12.734 20.9997 10.6673 26.0441 10.6673 31.9997C10.6673 37.9552 12.734 42.9997 16.8673 47.133C21.0007 51.2663 26.0451 53.333 32.0007 53.333Z", fill: "currentColor" }) }))); };
@@ -243,7 +243,7 @@ var ModalConfirm = function (_a) {
         onCancel();
         onClose();
     };
-    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, topAbsolute: true, children: [jsxs("div", { className: "flex items-center justify-center", children: [icon === "warning" && jsx(IconWarning, { className: "w-16 h-16 text-skyblue" }), icon === "success" && jsx(IconCheck, { className: "w-16 h-16 text-skyblue" })] }), jsx("p", { className: "mt-3 text-lg font-medium text-center lg:mt-4 lg:text-2xl text-skyblue", children: title }), jsx("p", { className: "mt-7 text-sm lg:text-lg text-center max-w-full lg:max-w-[576px]", children: message }), jsxs("div", { className: "flex flex-col-reverse items-center justify-center w-full gap-5 mt-11 lg:mt-20 lg:flex-row", children: [twoButtons && jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "blue", title: textButtonCancel, onClick: handleCancel }), jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "red", title: textButtonConfirm, onClick: handleConfirm })] })] }));
+    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, topAbsolute: true, children: [jsxs("div", { className: "flex items-center justify-center", children: [icon === "warning" && jsx(IconWarning, { className: "w-16 h-16 text-onpe-ui-skyblue" }), icon === "success" && jsx(IconCheck, { className: "w-16 h-16 text-onpe-ui-skyblue" })] }), jsx("p", { className: "mt-3 text-lg font-medium text-center lg:mt-4 lg:text-2xl text-onpe-ui-skyblue", children: title }), jsx("p", { className: "mt-7 text-sm lg:text-lg text-center max-w-full lg:max-w-[576px]", children: message }), jsxs("div", { className: "flex flex-col-reverse items-center justify-center w-full gap-5 mt-11 lg:mt-20 lg:flex-row", children: [twoButtons && jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "blue", title: textButtonCancel, onClick: handleCancel }), jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "red", title: textButtonConfirm, onClick: handleConfirm })] })] }));
 };
 
 var IconSpinnerDesktop = function (props) { return (jsx("svg", __assign({ width: 102, height: 102, viewBox: "0 0 102 102", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsx("path", { d: "M50.9999 3.08313C23.9241 3.08208 3.08296 24.6456 3.08325 51C3.08354 75.4375 22.453 98.9167 50.9999 98.9167C77.5573 98.9167 98.9166 77.3542 98.9166 51", stroke: "currentColor", strokeWidth: 6, strokeLinecap: "round" }) }))); };
@@ -263,7 +263,7 @@ var IconApple = function (props) { return (jsx("svg", __assign({ stroke: "curren
 
 var ModalSystemIncompatible = function (_a) {
     var _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.className, className = _d === void 0 ? "" : _d;
-    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-10 pb-24.5 ".concat(className), closeButton: true, closeDisabled: true, children: [jsx("div", { className: "flex justify-center items-center", children: jsx(IconWarning, { className: "w-22 h-22 text-skyblue" }) }), jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-skyblue font-medium", children: "Sistema Operativo no recomendado" }), jsx("p", { className: "text-sm md:text-lg mt-10 text-center xl:px-12", children: "Para descargar e instalar el ONPEID utiliza un dispositivo con sistema operativo Windows, macOS, Android o iOS." }), jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5 text-skyblue", children: [jsx(IconWindow, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconAndroid, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconApple, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
+    return (jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-10 pb-24.5 ".concat(className), closeButton: true, closeDisabled: true, children: [jsx("div", { className: "flex justify-center items-center", children: jsx(IconWarning, { className: "w-22 h-22 text-onpe-ui-skyblue" }) }), jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-onpe-ui-skyblue font-medium", children: "Sistema Operativo no recomendado" }), jsx("p", { className: "text-sm md:text-lg mt-10 text-center xl:px-12", children: "Para descargar e instalar el ONPEID utiliza un dispositivo con sistema operativo Windows, macOS, Android o iOS." }), jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5 text-onpe-ui-skyblue", children: [jsx(IconWindow, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconAndroid, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsx(IconApple, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
 };
 
 /**

package/dist/index.js

@@ -158,33 +158,33 @@ var Overlay = function (_a) {
     var getColorClass = function () {
         switch (color) {
             case "blue":
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
             case "skyblue":
-                return "bg-skyblue/80";
+                return "bg-onpe-ui-skyblue/80";
             case "skyblue-light":
-                return "bg-skyblue-light/80";
+                return "bg-onpe-ui-skyblue-light/80";
             case "yellow":
-                return "bg-yellow/80";
+                return "bg-onpe-ui-yellow/80";
             case "light-skyblue":
-                return "bg-light-skyblue/80";
+                return "bg-onpe-ui-light-skyblue/80";
             case "gray":
-                return "bg-gray/80";
+                return "bg-onpe-ui-gray/80";
             case "gray-light":
-                return "bg-gray-light/80";
+                return "bg-onpe-ui-gray-light/80";
             case "gray-extra-light":
-                return "bg-gray-extra-light/80";
+                return "bg-onpe-ui-gray-extra-light/80";
             case "red":
-                return "bg-red/80";
+                return "bg-onpe-ui-red/80";
             case "dark-gray":
-                return "bg-dark-gray/80";
+                return "bg-onpe-ui-dark-gray/80";
             case "green":
-                return "bg-green/80";
+                return "bg-onpe-ui-green/80";
             case "yellow-light":
-                return "bg-yellow-light/80";
+                return "bg-onpe-ui-yellow-light/80";
             case "primary":
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
             default:
-                return "bg-blue/80";
+                return "bg-onpe-ui-blue/80";
         }
     };
     return (jsxRuntime.jsx("div", { onClick: onClick, className: "".concat(show ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0", " absolute inset-0 w-full h-screen z-10 ").concat(getColorClass(), " transition-all duration-500 ease-in-out") }));
@@ -206,7 +206,7 @@ var Modal = function (_a) {
                                     ? "flex flex-col items-center justify-center"
                                     : "bg-white flex flex-col items-center justify-center  md:px-auto px-1 lg:px-5 min-w-[320px] w-[98vw] md:w-[500px] lg:w-[1024px] max-w-[95vw] max-h-[90vh] overflow-y-auto",
                                 props.className ? props.className : "py-10 lg:py-16",
-                            ]), children: children }), closeButton && (jsxRuntime.jsx("button", { onClick: onClose, className: "absolute top-4 right-4 rounded-full bg-red p-[7px] flex items-center justify-center z-30", "aria-label": "Cerrar", children: jsxRuntime.jsx(IconClose, { className: "h-[10px]  w-[10px] text-white" }) }))] })] }) }));
+                            ]), children: children }), closeButton && (jsxRuntime.jsx("button", { onClick: onClose, className: "absolute top-4 right-4 rounded-full bg-onpe-ui-red p-[7px] flex items-center justify-center z-30", "aria-label": "Cerrar", children: jsxRuntime.jsx(IconClose, { className: "h-[10px]  w-[10px] text-white" }) }))] })] }) }));
 };
 
 var IconWarning = function (props) { return (jsxRuntime.jsx("svg", __assign({ width: 16, height: 16, viewBox: "0 0 60 51", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsxRuntime.jsx("path", { d: "M0.667969 50.9987L30.0013 0.332031L59.3346 50.9987H0.667969ZM9.86797 45.6654H50.1346L30.0013 10.9987L9.86797 45.6654ZM30.0013 42.9987C30.7569 42.9987 31.3906 42.7427 31.9026 42.2307C32.4146 41.7187 32.6697 41.0858 32.668 40.332C32.668 39.5765 32.412 38.9427 31.9 38.4307C31.388 37.9187 30.7551 37.6636 30.0013 37.6654C29.2457 37.6654 28.612 37.9214 28.1 38.4334C27.588 38.9454 27.3329 39.5783 27.3346 40.332C27.3346 41.0876 27.5906 41.7214 28.1026 42.2334C28.6146 42.7454 29.2475 43.0005 30.0013 42.9987ZM27.3346 34.9987H32.668V21.6654H27.3346V34.9987Z", fill: "currentColor" }) }))); };
@@ -221,7 +221,7 @@ var IconEdgeColor = function (props) { return (jsxRuntime.jsxs("svg", __assign({
 
 var BrowserIncompatible = function (_a) {
     var _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.className, className = _d === void 0 ? "" : _d;
-    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, children: [jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: jsxRuntime.jsx(IconWarning, { className: "w-22 h-22 text-skyblue" }) }), jsxRuntime.jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-skyblue font-medium", children: "Navegador no recomendado" }), jsxRuntime.jsx("p", { className: "text-sm md:text-lg text-center mt-6", children: "Para una mejor experiencia y mayor seguridad, debes ingresar con los siguientes navegadores:" }), jsxRuntime.jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5", children: [jsxRuntime.jsx(IconChromeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconSafariColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconMozillaColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconEdgeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
+    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, children: [jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: jsxRuntime.jsx(IconWarning, { className: "w-22 h-22 text-onpe-ui-skyblue" }) }), jsxRuntime.jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-onpe-ui-skyblue font-medium", children: "Navegador no recomendado" }), jsxRuntime.jsx("p", { className: "text-sm md:text-lg text-center mt-6", children: "Para una mejor experiencia y mayor seguridad, debes ingresar con los siguientes navegadores:" }), jsxRuntime.jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5", children: [jsxRuntime.jsx(IconChromeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconSafariColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconMozillaColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconEdgeColor, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
 };
 
 var IconCheck = function (props) { return (jsxRuntime.jsx("svg", __assign({ width: 64, height: 64, viewBox: "0 0 64 64", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: "mt-10 lg:mt-16" }, props, { children: jsxRuntime.jsx("path", { d: "M28.2673 44.2663L47.0673 25.4663L43.334 21.733L28.2673 36.7997L20.6673 29.1997L16.934 32.933L28.2673 44.2663ZM32.0007 58.6663C28.3118 58.6663 24.8451 57.9659 21.6007 56.565C18.3562 55.1641 15.534 53.2646 13.134 50.8663C10.734 48.4663 8.83443 45.6441 7.43532 42.3997C6.03621 39.1552 5.33576 35.6886 5.33398 31.9997C5.33398 28.3108 6.03443 24.8441 7.43532 21.5997C8.83621 18.3552 10.7358 15.533 13.134 13.133C15.534 10.733 18.3562 8.83345 21.6007 7.43434C24.8451 6.03523 28.3118 5.33479 32.0007 5.33301C35.6895 5.33301 39.1562 6.03345 42.4007 7.43434C45.6451 8.83523 48.4673 10.7348 50.8673 13.133C53.2673 15.533 55.1678 18.3552 56.5686 21.5997C57.9695 24.8441 58.6691 28.3108 58.6673 31.9997C58.6673 35.6886 57.9669 39.1552 56.566 42.3997C55.1651 45.6441 53.2655 48.4663 50.8673 50.8663C48.4673 53.2663 45.6451 55.1668 42.4007 56.5677C39.1562 57.9686 35.6895 58.6681 32.0007 58.6663ZM32.0007 53.333C37.9562 53.333 43.0006 51.2663 47.134 47.133C51.2673 42.9997 53.334 37.9552 53.334 31.9997C53.334 26.0441 51.2673 20.9997 47.134 16.8663C43.0006 12.733 37.9562 10.6663 32.0007 10.6663C26.0451 10.6663 21.0007 12.733 16.8673 16.8663C12.734 20.9997 10.6673 26.0441 10.6673 31.9997C10.6673 37.9552 12.734 42.9997 16.8673 47.133C21.0007 51.2663 26.0451 53.333 32.0007 53.333Z", fill: "currentColor" }) }))); };
@@ -245,7 +245,7 @@ var ModalConfirm = function (_a) {
         onCancel();
         onClose();
     };
-    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, topAbsolute: true, children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-center", children: [icon === "warning" && jsxRuntime.jsx(IconWarning, { className: "w-16 h-16 text-skyblue" }), icon === "success" && jsxRuntime.jsx(IconCheck, { className: "w-16 h-16 text-skyblue" })] }), jsxRuntime.jsx("p", { className: "mt-3 text-lg font-medium text-center lg:mt-4 lg:text-2xl text-skyblue", children: title }), jsxRuntime.jsx("p", { className: "mt-7 text-sm lg:text-lg text-center max-w-full lg:max-w-[576px]", children: message }), jsxRuntime.jsxs("div", { className: "flex flex-col-reverse items-center justify-center w-full gap-5 mt-11 lg:mt-20 lg:flex-row", children: [twoButtons && jsxRuntime.jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "blue", title: textButtonCancel, onClick: handleCancel }), jsxRuntime.jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "red", title: textButtonConfirm, onClick: handleConfirm })] })] }));
+    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-5 pb-8 ".concat(className), closeButton: true, closeDisabled: true, topAbsolute: true, children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-center", children: [icon === "warning" && jsxRuntime.jsx(IconWarning, { className: "w-16 h-16 text-onpe-ui-skyblue" }), icon === "success" && jsxRuntime.jsx(IconCheck, { className: "w-16 h-16 text-onpe-ui-skyblue" })] }), jsxRuntime.jsx("p", { className: "mt-3 text-lg font-medium text-center lg:mt-4 lg:text-2xl text-onpe-ui-skyblue", children: title }), jsxRuntime.jsx("p", { className: "mt-7 text-sm lg:text-lg text-center max-w-full lg:max-w-[576px]", children: message }), jsxRuntime.jsxs("div", { className: "flex flex-col-reverse items-center justify-center w-full gap-5 mt-11 lg:mt-20 lg:flex-row", children: [twoButtons && jsxRuntime.jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "blue", title: textButtonCancel, onClick: handleCancel }), jsxRuntime.jsx(Button, { className: "w-full max-w-[200px] lg:w-[200px]", color: "red", title: textButtonConfirm, onClick: handleConfirm })] })] }));
 };
 
 var IconSpinnerDesktop = function (props) { return (jsxRuntime.jsx("svg", __assign({ width: 102, height: 102, viewBox: "0 0 102 102", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsxRuntime.jsx("path", { d: "M50.9999 3.08313C23.9241 3.08208 3.08296 24.6456 3.08325 51C3.08354 75.4375 22.453 98.9167 50.9999 98.9167C77.5573 98.9167 98.9166 77.3542 98.9166 51", stroke: "currentColor", strokeWidth: 6, strokeLinecap: "round" }) }))); };
@@ -265,7 +265,7 @@ var IconApple = function (props) { return (jsxRuntime.jsx("svg", __assign({ stro
 
 var ModalSystemIncompatible = function (_a) {
     var _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.onClose, onClose = _c === void 0 ? function () { } : _c, _d = _a.className, className = _d === void 0 ? "" : _d;
-    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-10 pb-24.5 ".concat(className), closeButton: true, closeDisabled: true, children: [jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: jsxRuntime.jsx(IconWarning, { className: "w-22 h-22 text-skyblue" }) }), jsxRuntime.jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-skyblue font-medium", children: "Sistema Operativo no recomendado" }), jsxRuntime.jsx("p", { className: "text-sm md:text-lg mt-10 text-center xl:px-12", children: "Para descargar e instalar el ONPEID utiliza un dispositivo con sistema operativo Windows, macOS, Android o iOS." }), jsxRuntime.jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5 text-skyblue", children: [jsxRuntime.jsx(IconWindow, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconAndroid, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconApple, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
+    return (jsxRuntime.jsxs(Modal, { isOpen: isOpen, onClose: onClose, className: "max-w-[680px] pt-10 pb-24.5 ".concat(className), closeButton: true, closeDisabled: true, children: [jsxRuntime.jsx("div", { className: "flex justify-center items-center", children: jsxRuntime.jsx(IconWarning, { className: "w-22 h-22 text-onpe-ui-skyblue" }) }), jsxRuntime.jsx("p", { className: "text-sm md:text-2xl text-center mt-6 text-onpe-ui-skyblue font-medium", children: "Sistema Operativo no recomendado" }), jsxRuntime.jsx("p", { className: "text-sm md:text-lg mt-10 text-center xl:px-12", children: "Para descargar e instalar el ONPEID utiliza un dispositivo con sistema operativo Windows, macOS, Android o iOS." }), jsxRuntime.jsxs("div", { className: "flex justify-center items-center gap-8 md:gap-12 mt-5 text-onpe-ui-skyblue", children: [jsxRuntime.jsx(IconWindow, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconAndroid, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" }), jsxRuntime.jsx(IconApple, { className: "md:w-[48px] md:h-[48px] w-[32px] h-[32px]" })] })] }));
 };
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onpe/ui",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "type": "module",
   "description": "Librería completa de UI para ONPE - Componentes, Hooks, Utils y Librerías",
   "main": "dist/index.js",