@lion-npm/ui 1.0.2 → 1.0.3

package/dist/style.css

@@ -0,0 +1,2 @@
+:root{--lion-packages:#ff8731;--lion-parking:#ff8731;--lion-tech:#b11226;--lion-glam:#ff69b4;--lion-black:#111;--lion-white:#fff}.bg-lion-black{background-color:var(--lion-black)}.bg-lion-white{background-color:var(--lion-white)}.bg-lion-packages{background-color:var(--lion-packages)}.bg-lion-parking{background-color:var(--lion-parking)}.bg-lion-tech{background-color:var(--lion-tech)}.bg-lion-glam{background-color:var(--lion-glam)}.text-lion-black{color:var(--lion-black)}.text-lion-white{color:var(--lion-white)}.text-lion-packages{color:var(--lion-packages)}.text-lion-parking{color:var(--lion-parking)}.text-lion-glam{color:var(--lion-glam)}.text-lion-tech{color:var(--lion-tech)}.android-btn{--btn-color:#0d6efd;--btn-bg:var(--btn-color);--btn-text:#fff;--btn-disabled-bg:#1c1b1f1f;--btn-disabled-color:#1c1b1f61;--btn-disabled-border:transparent;letter-spacing:.1px;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:500;transition:background-color .2s cubic-bezier(.2,0,0,1),box-shadow .2s cubic-bezier(.2,0,0,1),border-color .2s cubic-bezier(.2,0,0,1),border-radius .2s cubic-bezier(.2,0,0,1);display:inline-flex;position:relative;overflow:hidden}.android-btn-pill.android-btn-sm{border-radius:16px}.android-btn-pill.android-btn-md{border-radius:20px}.android-btn-pill.android-btn-lg{border-radius:24px}.android-btn-rounded.android-btn-sm{border-radius:6px}.android-btn-rounded.android-btn-md{border-radius:8px}.android-btn-rounded.android-btn-lg{border-radius:12px}.android-btn:disabled,.android-btn.disabled,fieldset:disabled .android-btn{pointer-events:none;cursor:not-allowed!important;box-shadow:none!important;opacity:.38!important}.android-btn-filled:disabled,.android-btn-filled.disabled{background-color:var(--btn-bg)!important;color:var(--btn-text)!important;border-color:#0000!important}.android-btn-elevated:disabled,.android-btn-elevated.disabled{color:var(--btn-color)!important;background-color:#fff!important;border-color:#0000!important}.android-btn-tonal:disabled,.android-btn-tonal.disabled{background-color:color-mix(in srgb, var(--btn-color) 16%, #fff)!important;color:var(--btn-color)!important;border-color:#0000!important}.android-btn-outlined:disabled,.android-btn-outlined.disabled{color:var(--btn-color)!important;border-color:var(--btn-color)!important;background-color:#0000!important}.android-btn-text:disabled,.android-btn-text.disabled{color:var(--btn-color)!important;background-color:#0000!important;border-color:#0000!important}.android-btn-filled{background-color:var(--btn-bg);color:var(--btn-text)!important}.android-btn-filled:hover:not(:disabled):not(.disabled){filter:brightness(.92)}.android-btn-elevated{background-color:#fff;box-shadow:0 1px 3px 1px #00000026,0 1px 2px #0000004d;color:var(--btn-color)!important}.android-btn-elevated:hover:not(:disabled):not(.disabled){background-color:#00000005;box-shadow:0 2px 6px 2px #00000026,0 1px 2px #0000004d}.android-btn-tonal{background-color:color-mix(in srgb, var(--btn-color) 16%, #fff);color:var(--btn-color)!important}.android-btn-tonal:hover:not(:disabled):not(.disabled){background-color:color-mix(in srgb, var(--btn-color) 24%, #fff)}.android-btn-outlined{border-color:var(--btn-color);background-color:#0000;color:var(--btn-color)!important}.android-btn-outlined:hover:not(:disabled):not(.disabled){background-color:color-mix(in srgb, var(--btn-color) 8%, transparent)}.android-btn-text{background-color:#0000;color:var(--btn-color)!important}.android-btn-text:hover:not(:disabled):not(.disabled){background-color:color-mix(in srgb, var(--btn-color) 8%, transparent)}.android-btn .ripple{border-radius:inherit;opacity:0;pointer-events:none;background-color:currentColor;transition:opacity .2s ease-in-out;position:absolute;inset:0}.android-btn:active:not(:disabled):not(.disabled) .ripple{opacity:.12}.android-btn-sm{height:32px;padding:0 12px;font-size:.8125rem}.android-btn-md{height:40px;padding:0 24px;font-size:.875rem}.android-btn-lg{height:48px;padding:0 28px;font-size:1rem}.android-btn.btn-primary{--btn-color:#0d6efd;--btn-text:#fff}.android-btn.btn-secondary{--btn-color:#6c757d;--btn-text:#fff}.android-btn.btn-success{--btn-color:#198754;--btn-text:#fff}.android-btn.btn-danger{--btn-color:#dc3545;--btn-text:#fff}.android-btn.btn-warning{--btn-color:#ffc107;--btn-text:#000}.android-btn.btn-info{--btn-color:#0dcaf0;--btn-text:#000}.android-btn.btn-light{--btn-color:#6c757d;--btn-bg:#f8f9fa;--btn-text:#212529}.android-btn.btn-dark{--btn-color:#212529;--btn-text:#fff}.android-btn.btn-link{--btn-color:#0d6efd;--btn-text:#0d6efd;text-decoration:underline;box-shadow:none!important;background-color:#0000!important}.android-btn.btn-lion-packages{--btn-color:var(--lion-packages,#6f42c1);--btn-text:#fff}.android-btn.btn-lion-parking{--btn-color:var(--lion-parking,#fd7e14);--btn-text:#fff}.android-btn.btn-lion-tech{--btn-color:var(--lion-tech,#20c997);--btn-text:#fff}.android-btn.btn-lion-glam{--btn-color:var(--lion-glam,#e83e8c);--btn-text:#fff}.ios-btn{--btn-color:#007aff;--btn-bg:var(--btn-color);--btn-text:#fff;letter-spacing:-.24px;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;will-change:transform, opacity;border:none;outline:none;justify-content:center;align-items:center;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,SF Pro Display,Helvetica Neue,sans-serif;font-weight:600;transition:opacity .1s ease-out,transform .25s cubic-bezier(.2,.9,.4,1.1),background-color .15s ease-in-out;display:inline-flex;position:relative}@media (hover:hover){.ios-btn-filled:hover:not(:disabled){filter:brightness(.96)}.ios-btn-tinted:hover:not(:disabled){background-color:color-mix(in srgb, var(--btn-color) 22%, transparent)}.ios-btn-gray:hover:not(:disabled){background-color:#7878803d}.ios-btn-plain:hover:not(:disabled){opacity:.8}}.ios-btn:active:not(:disabled){opacity:.55;transition-duration:50ms;transform:scale(.96)}.ios-btn-rounded.ios-btn-sm{border-radius:9px}.ios-btn-rounded.ios-btn-md{border-radius:12px}.ios-btn-rounded.ios-btn-lg{border-radius:16px}.ios-btn-capsule{border-radius:9999px}.ios-btn.disabled,.ios-btn:disabled{cursor:not-allowed;opacity:.35!important;filter:none!important;transform:none!important}.ios-btn-filled{background-color:var(--btn-bg);color:var(--btn-text)!important}.ios-btn-tinted{background-color:color-mix(in srgb, var(--btn-color) 15%, transparent);color:var(--btn-color)!important}.ios-btn-gray{background-color:#78788029;color:var(--btn-color)!important}.ios-btn-plain{background-color:#0000;color:var(--btn-color)!important;padding-left:4px!important;padding-right:4px!important}.ios-btn-sm{height:28px;padding:0 10px;font-size:.8125rem}.ios-btn-md{height:36px;padding:0 16px;font-size:.9375rem}.ios-btn-lg{height:50px;padding:0 22px;font-size:1.0625rem}.ios-btn.btn-primary{--btn-color:var(--bs-primary,#007aff);--btn-text:#fff}.ios-btn.btn-secondary{--btn-color:var(--bs-secondary,#6c757d);--btn-text:#fff}.ios-btn.btn-success{--btn-color:var(--bs-success,#34c759);--btn-text:#fff}.ios-btn.btn-danger{--btn-color:var(--bs-danger,#ff3b30);--btn-text:#fff}.ios-btn.btn-warning{--btn-color:var(--bs-warning,#ff9500);--btn-text:#000}.ios-btn.btn-info{--btn-color:var(--bs-info,#5ac8fa);--btn-text:#000}.ios-btn.btn-light{--btn-color:#8e8e93;--btn-bg:var(--bs-light,#e5e5ea);--btn-text:#000}.ios-btn.btn-dark{--btn-color:var(--bs-dark,#1c1c1e);--btn-text:#fff}.ios-btn.btn-link{--btn-color:var(--bs-link-hover-color,#007aff);--btn-text:#007aff;text-decoration:underline;background-color:#0000!important}.ios-btn.btn-lion-packages{--btn-color:var(--lion-packages,#af52de);--btn-text:#fff}.ios-btn.btn-lion-parking{--btn-color:var(--lion-parking,#ff9500);--btn-text:#fff}.ios-btn.btn-lion-tech{--btn-color:var(--lion-tech,#30b0c7);--btn-text:#fff}.ios-btn.btn-lion-glam{--btn-color:var(--lion-glam,#ff2d55);--btn-text:#fff}.ios-btn-tinted.btn-light{background-color:#7878801f;color:#1c1c1e!important}.ios-btn-gray.btn-light{background-color:#7878802e;color:#1c1c1e!important}.ios-btn-plain.btn-light{color:#1c1c1e!important}.btn-outline-light{--bs-btn-color:#212529;--bs-btn-border-color:#ced4da;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#f8f9fa;--bs-btn-hover-border-color:#ced4da;--bs-btn-active-color:#000;--bs-btn-active-bg:#e9ecef;--bs-btn-active-border-color:#ced4da;--bs-btn-disabled-color:#6c757d;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#ced4da}.btn-lion-packages{--bs-btn-color:var(--lion-white);--bs-btn-bg:var(--lion-packages,#6f42c1);--bs-btn-border-color:var(--lion-packages,#6f42c1);--bs-btn-hover-color:var(--lion-white);--bs-btn-hover-bg:color-mix(in srgb, var(--lion-packages,#6f42c1) 85%, #000);--bs-btn-hover-border-color:color-mix(in srgb, var(--lion-packages,#6f42c1) 85%, #000);--bs-btn-active-color:var(--lion-white);--bs-btn-active-bg:color-mix(in srgb, var(--lion-packages,#6f42c1) 75%, #000);--bs-btn-active-border-color:color-mix(in srgb, var(--lion-packages,#6f42c1) 75%, #000);--bs-btn-disabled-color:var(--lion-white);--bs-btn-disabled-bg:var(--lion-packages,#6f42c1);--bs-btn-disabled-border-color:var(--lion-packages,#6f42c1)}.btn-outline-lion-packages{--bs-btn-color:var(--lion-packages,#6f42c1);--bs-btn-border-color:var(--lion-packages,#6f42c1);--bs-btn-hover-color:var(--lion-white);--bs-btn-hover-bg:var(--lion-packages,#6f42c1);--bs-btn-hover-border-color:var(--lion-packages,#6f42c1);--bs-btn-active-color:var(--lion-white);--bs-btn-active-bg:var(--lion-packages,#6f42c1);--bs-btn-active-border-color:var(--lion-packages,#6f42c1);--bs-btn-disabled-color:var(--lion-packages,#6f42c1);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--lion-packages,#6f42c1)}.btn-lion-parking{--bs-btn-color:var(--lion-white);--bs-btn-bg:var(--lion-parking,#fd7e14);--bs-btn-border-color:var(--lion-parking,#fd7e14);--bs-btn-hover-color:var(--lion-white);--bs-btn-hover-bg:color-mix(in srgb, var(--lion-parking,#fd7e14) 85%, #000);--bs-btn-hover-border-color:color-mix(in srgb, var(--lion-parking,#fd7e14) 85%, #000);--bs-btn-active-color:var(--lion-white);--bs-btn-active-bg:color-mix(in srgb, var(--lion-parking,#fd7e14) 75%, #000);--bs-btn-active-border-color:color-mix(in srgb, var(--lion-parking,#fd7e14) 75%, #000);--bs-btn-disabled-color:var(--lion-white);--bs-btn-disabled-bg:var(--lion-parking,#fd7e14);--bs-btn-disabled-border-color:var(--lion-parking,#fd7e14)}.btn-outline-lion-parking{--bs-btn-color:var(--lion-parking,#fd7e14);--bs-btn-border-color:var(--lion-parking,#fd7e14);--bs-btn-hover-color:var(--lion-white);--bs-btn-hover-bg:var(--lion-parking,#fd7e14);--bs-btn-hover-border-color:var(--lion-parking,#fd7e14);--bs-btn-active-color:var(--lion-white);--bs-btn-active-bg:var(--lion-parking,#fd7e14);--bs-btn-active-border-color:var(--lion-parking,#fd7e14);--bs-btn-disabled-color:var(--lion-parking,#fd7e14);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--lion-parking,#fd7e14)}.btn-lion-tech{--bs-btn-color:var(--lion-white);--bs-btn-bg:var(--lion-tech,#20c997);--bs-btn-border-color:var(--lion-tech,#20c997);--bs-btn-hover-color:var(--lion-white);--bs-btn-hover-bg:color-mix(in srgb, var(--lion-tech,#20c997) 85%, #000);--bs-btn-hover-border-color:color-mix(in srgb, var(--lion-tech,#20c997) 85%, #000);--bs-btn-active-color:var(--lion-white);--bs-btn-active-bg:color-mix(in srgb, var(--lion-tech,#20c997) 75%, #000);--bs-btn-active-border-color:color-mix(in srgb, var(--lion-tech,#20c997) 75%, #000);--bs-btn-disabled-color:var(--lion-white);--bs-btn-disabled-bg:var(--lion-tech,#20c997);--bs-btn-disabled-border-color:var(--lion-tech,#20c997)}.btn-outline-lion-tech{--bs-btn-color:var(--lion-tech,#20c997);--bs-btn-border-color:var(--lion-tech,#20c997);--bs-btn-hover-color:var(--lion-white);--bs-btn-hover-bg:var(--lion-tech,#20c997);--bs-btn-hover-border-color:var(--lion-tech,#20c997);--bs-btn-active-color:var(--lion-white);--bs-btn-active-bg:var(--lion-tech,#20c997);--bs-btn-active-border-color:var(--lion-tech,#20c997);--bs-btn-disabled-color:var(--lion-tech,#20c997);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--lion-tech,#20c997)}.btn-lion-glam{--bs-btn-color:var(--lion-white);--bs-btn-bg:var(--lion-glam,#e83e8c);--bs-btn-border-color:var(--lion-glam,#e83e8c);--bs-btn-hover-color:var(--lion-white);--bs-btn-hover-bg:color-mix(in srgb, var(--lion-glam,#e83e8c) 85%, #000);--bs-btn-hover-border-color:color-mix(in srgb, var(--lion-glam,#e83e8c) 85%, #000);--bs-btn-active-color:var(--lion-white);--bs-btn-active-bg:color-mix(in srgb, var(--lion-glam,#e83e8c) 75%, #000);--bs-btn-active-border-color:color-mix(in srgb, var(--lion-glam,#e83e8c) 75%, #000);--bs-btn-disabled-color:var(--lion-white);--bs-btn-disabled-bg:var(--lion-glam,#e83e8c);--bs-btn-disabled-border-color:var(--lion-glam,#e83e8c)}.btn-outline-lion-glam{--bs-btn-color:var(--lion-glam,#e83e8c);--bs-btn-border-color:var(--lion-glam,#e83e8c);--bs-btn-hover-color:var(--lion-white);--bs-btn-hover-bg:var(--lion-glam,#e83e8c);--bs-btn-hover-border-color:var(--lion-glam,#e83e8c);--bs-btn-active-color:var(--lion-white);--bs-btn-active-bg:var(--lion-glam,#e83e8c);--bs-btn-active-border-color:var(--lion-glam,#e83e8c);--bs-btn-disabled-color:var(--lion-glam,#e83e8c);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--lion-glam,#e83e8c)}.android-input-container{--android-input-color:var(--bs-primary,#0d6efd);--android-input-label-bg:var(--bs-body-bg,#fff);--android-input-border-color:var(--bs-border-color,#ccc);--android-input-error-color:var(--bs-danger,#dc3545);width:100%;max-width:100%;font-family:var(--bs-body-font-family,Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);box-sizing:border-box;flex-direction:column;display:flex;position:relative}.android-input-field-wrapper{box-sizing:border-box;align-items:center;width:100%;max-width:100%;transition:all .4s ease-in-out;display:flex;position:relative}.android-input-element{border:1px solid var(--android-input-border-color);border-radius:var(--bs-border-radius-sm,4px);width:100%;max-width:100%;color:var(--bs-body-color,#212529);font:inherit;box-sizing:border-box;background-color:#0000;outline:none;font-size:1rem;transition:border-color .4s,box-shadow .4s,background-color .4s}.android-input-field-wrapper.android-size-normal .android-input-element{padding:14.5px 14px}.android-input-field-wrapper.android-size-small .android-input-element{padding:10px 12px;font-size:.875rem}.android-input-field-wrapper.android-style-outlined{background-color:#0000}.android-input-field-wrapper.android-style-outlined .android-input-element:focus,.android-input-field-wrapper.android-style-outlined .android-input-element:not(:placeholder-shown){border-color:var(--android-active-color,var(--android-input-color))}.android-input-field-wrapper.android-style-outlined .android-input-element:focus{box-shadow:0 0 0 1px var(--android-active-color,var(--android-input-color))}.android-input-field-wrapper.android-style-filled{background-color:color-mix(in srgb, var(--android-active-color,var(--android-input-color)) 8%, var(--bs-body-bg,#fff));border-bottom:1px solid var(--android-input-border-color);border-radius:4px 4px 0 0}.android-input-field-wrapper.android-style-filled .android-input-element{background:0 0;border:none}.android-input-field-wrapper.android-style-filled.android-size-normal .android-input-element{padding:22px 14px 6px}.android-input-field-wrapper.android-style-filled.android-size-small .android-input-element{padding:18px 12px 4px}.android-input-field-wrapper.android-style-filled.is-focused{border-bottom:2px solid var(--android-active-color,var(--android-input-color));background-color:color-mix(in srgb, var(--android-active-color,var(--android-input-color)) 14%, var(--bs-body-bg,#fff))}.android-input-field-wrapper.android-style-filled:has(.android-input-element:not(:placeholder-shown)){border-bottom:2px solid var(--android-active-color,var(--android-input-color));background-color:color-mix(in srgb, var(--android-active-color,var(--android-input-color)) 14%, var(--bs-body-bg,#fff))}.android-input-label{pointer-events:none;color:var(--bs-secondary-color,#777);z-index:2;white-space:nowrap;text-overflow:ellipsis;background-color:#0000;max-width:calc(100% - 28px);margin:0;padding:0 4px;font-size:1rem;transition:all .2s cubic-bezier(.4,0,.2,1);position:absolute;top:50%;left:14px;overflow:hidden;transform:translateY(-50%)}.android-input-field-wrapper.android-size-small .android-input-label{max-width:calc(100% - 24px);font-size:.875rem;left:12px}.android-input-field-wrapper.android-style-outlined.android-size-normal .android-input-element:focus~.android-input-label,.android-input-field-wrapper.android-style-outlined.android-size-normal .android-input-element:not(:placeholder-shown)~.android-input-label{color:var(--android-active-color,var(--android-input-color));background-color:var(--android-input-label-bg);font-size:.75rem;top:0;transform:translateY(-50%)}.android-input-field-wrapper.android-style-outlined.android-size-small .android-input-element:focus~.android-input-label,.android-input-field-wrapper.android-style-outlined.android-size-small .android-input-element:not(:placeholder-shown)~.android-input-label{color:var(--android-active-color,var(--android-input-color));background-color:var(--android-input-label-bg);font-size:.68rem;top:0;transform:translateY(-50%)}.android-input-field-wrapper.android-style-filled.android-size-normal .android-input-element:focus~.android-input-label,.android-input-field-wrapper.android-style-filled.android-size-normal .android-input-element:not(:placeholder-shown)~.android-input-label{color:var(--android-active-color,var(--android-input-color));background-color:#0000;font-size:.75rem;top:8px;transform:translateY(0)}.android-input-field-wrapper.android-style-filled.android-size-small .android-input-element:focus~.android-input-label,.android-input-field-wrapper.android-style-filled.android-size-small .android-input-element:not(:placeholder-shown)~.android-input-label{color:var(--android-active-color,var(--android-input-color));background-color:#0000;font-size:.68rem;top:5px;transform:translateY(0)}.android-input-element:not(:focus)::placeholder{color:#0000!important}.android-input-element:focus::placeholder{color:var(--bs-secondary-color,#aaa);opacity:.7}.android-input-container.android-variant-primary{--android-active-color:var(--bs-primary,#0d6efd)}.android-input-container.android-variant-secondary{--android-active-color:var(--bs-secondary,#6c757d)}.android-input-container.android-variant-success{--android-active-color:var(--bs-success,#198754)}.android-input-container.android-variant-danger{--android-active-color:var(--bs-danger,#dc3545)}.android-input-container.android-variant-warning{--android-active-color:var(--bs-warning,#ffc107)}.android-input-container.android-variant-info{--android-active-color:var(--bs-info,#0dcaf0)}.android-input-container.android-variant-dark{--android-active-color:var(--bs-dark,#212529)}.android-input-container.android-variant-lion-packages{--android-active-color:var(--lion-packages,#6f42c1)}.android-input-container.android-variant-lion-parking{--android-active-color:var(--lion-parking,#20c997)}.android-input-container.android-variant-lion-tech{--android-active-color:var(--lion-tech,#fd7e14)}.android-input-container.android-variant-lion-glam{--android-active-color:var(--lion-glam,#e83e8c)}.android-input-field-wrapper.has-error,.android-input-field-wrapper.has-error .android-input-element{border-color:var(--android-input-error-color)!important}.android-input-field-wrapper.has-error .android-input-label{color:var(--android-input-error-color)!important}.android-input-subtext-container{justify-content:space-between;padding:.25rem .25rem 0;display:flex}.android-input-error-text{color:var(--android-input-error-color);margin-top:.25rem;font-size:.78rem;font-weight:500}.android-input-helper-text{color:var(--bs-secondary-color,#777);margin-top:.25rem;font-size:.78rem}.android-input-counter{color:var(--bs-secondary-color,#777);margin-top:.25rem;margin-left:auto;font-size:.78rem}.ios-input-container{--ios-input-bg:var(--bs-body-bg,#fff);--ios-input-color:var(--bs-body-color,#212529);--ios-input-border-color:var(--bs-border-color,#dee2e6);--ios-input-placeholder-color:var(--bs-secondary-color,#6c757d);--ios-input-focus-color:var(--bs-primary,#0d6efd);--ios-input-error-color:var(--bs-danger,#dc3545);--ios-input-disabled-bg:var(--bs-tertiary-bg,#f8f9fa);box-sizing:border-box;flex-direction:column;gap:6px;width:100%;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,SF Pro Display,Helvetica Neue,sans-serif;display:flex}.ios-input-label{color:var(--ios-input-color);letter-spacing:-.08px;margin-left:4px;font-size:13px;font-weight:600}.ios-input-wrapper{background-color:var(--ios-input-bg);color:var(--ios-input-color);box-sizing:border-box;align-items:center;width:100%;transition:all .2s ease-in-out;display:flex;position:relative;overflow:hidden}.ios-input-wrapper.ios-size-sx{min-height:30px;padding:0 8px;font-size:12px}.ios-input-wrapper.ios-size-sm{min-height:36px;padding:0 10px;font-size:14px}.ios-input-wrapper.ios-size-md{min-height:44px;padding:0 14px;font-size:16px}.ios-input-wrapper.ios-size-lg{min-height:52px;padding:0 16px;font-size:18px}.ios-input-wrapper.ios-shape-rounded{border-radius:12px!important}.ios-input-wrapper.ios-shape-pill{border-radius:9999px!important;padding-left:18px!important;padding-right:18px!important}.ios-input-wrapper.ios-shape-square{border-radius:4px!important}.ios-input-wrapper.ios-style-rounded-border,.ios-input-wrapper.ios-style-outlined{border:1.5px solid var(--ios-input-border-color);background-color:#0000}.ios-input-wrapper.ios-style-rounded-border.is-focused,.ios-input-wrapper.ios-style-outlined.is-focused{border-color:var(--ios-active-color,var(--ios-input-focus-color));box-shadow:0 0 0 3px color-mix(in srgb, var(--ios-active-color,var(--ios-input-focus-color)) 20%, transparent)}.ios-input-wrapper.ios-style-form{border:none;border-bottom:1px solid var(--ios-input-border-color);background-color:#0000;border-radius:0!important;padding-left:0!important;padding-right:0!important}.ios-input-wrapper.ios-style-form.is-focused{border-bottom-color:var(--ios-active-color,var(--ios-input-focus-color));box-shadow:none}.ios-input-wrapper.ios-style-filled{background-color:var(--bs-tertiary-bg,#f1f3f5);border:1px solid #0000}.ios-input-wrapper.ios-style-filled.is-focused{background-color:var(--ios-input-bg);border-color:var(--ios-active-color,var(--ios-input-focus-color));box-shadow:0 0 0 3px color-mix(in srgb, var(--ios-active-color,var(--ios-input-focus-color)) 20%, transparent)}.ios-input-wrapper.ios-style-plain{background-color:#0000;border:none;padding:0!important}.ios-input-container.ios-variant-primary{--ios-active-color:var(--bs-primary,#0d6efd)}.ios-input-container.ios-variant-secondary{--ios-active-color:var(--bs-secondary,#6c757d)}.ios-input-container.ios-variant-success{--ios-active-color:var(--bs-success,#198754)}.ios-input-container.ios-variant-danger{--ios-active-color:var(--bs-danger,#dc3545)}.ios-input-container.ios-variant-warning{--ios-active-color:var(--bs-warning,#ffc107)}.ios-input-container.ios-variant-info{--ios-active-color:var(--bs-info,#0dcaf0)}.ios-input-container.ios-variant-dark{--ios-active-color:var(--bs-dark,#212529)}.ios-input-container.ios-variant-lion-packages{--ios-active-color:var(--lion-packages,#6f42c1)}.ios-input-container.ios-variant-lion-parking{--ios-active-color:var(--lion-parking,#20c997)}.ios-input-container.ios-variant-lion-tech{--ios-active-color:var(--lion-tech,#fd7e14)}.ios-input-container.ios-variant-lion-glam{--ios-active-color:var(--lion-glam,#e83e8c)}.ios-input-wrapper.has-error{border-color:var(--ios-input-error-color)!important;box-shadow:0 0 0 3px color-mix(in srgb, var(--ios-input-error-color) 20%, transparent)!important}.ios-input-wrapper.is-disabled{background-color:var(--ios-input-disabled-bg);opacity:.6;cursor:not-allowed}.ios-input-wrapper.is-readonly{background-color:var(--ios-input-disabled-bg)}.ios-input-element{width:100%;color:inherit;font-family:inherit;font-size:inherit;background:0 0;border:none;outline:none;padding:6px 0}.ios-input-element::placeholder{color:var(--ios-input-placeholder-color);opacity:1}.ios-input-icon-left,.ios-input-icon-right{color:var(--ios-input-placeholder-color);flex-shrink:0;justify-content:center;align-items:center;display:flex}.ios-input-icon-left{margin-right:8px}.ios-input-icon-right{margin-left:8px}.input-prefix{color:var(--ios-input-placeholder-color);margin-right:6px}.input-suffix{color:var(--ios-input-placeholder-color);margin-left:6px}.ios-clear-button{background:var(--bs-secondary-bg,#e9ecef);color:var(--ios-input-color);cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;margin-left:6px;padding:0;font-size:10px;transition:background .2s;display:flex}.ios-clear-button:hover{background:var(--bs-secondary,#6c757d);color:#fff}.ios-input-helper-text{color:var(--ios-input-placeholder-color);margin-left:4px;font-size:12px}.ios-input-error-text{color:var(--ios-input-error-color);margin-left:4px;font-size:12px;font-weight:500}.form-control.bootstrap-variant-primary{--bootstrap-active-color:var(--bs-primary,#0d6efd)}.form-control.bootstrap-variant-secondary{--bootstrap-active-color:var(--bs-secondary,#6c757d)}.form-control.bootstrap-variant-success{--bootstrap-active-color:var(--bs-success,#198754)}.form-control.bootstrap-variant-danger{--bootstrap-active-color:var(--bs-danger,#dc3545)}.form-control.bootstrap-variant-warning{--bootstrap-active-color:var(--bs-warning,#ffc107)}.form-control.bootstrap-variant-info{--bootstrap-active-color:var(--bs-info,#0dcaf0)}.form-control.bootstrap-variant-dark{--bootstrap-active-color:var(--bs-dark,#212529)}.form-control.bootstrap-variant-lion-packages{--bootstrap-active-color:var(--lion-packages,#6f42c1)}.form-control.bootstrap-variant-lion-parking{--bootstrap-active-color:var(--lion-parking,#20c997)}.form-control.bootstrap-variant-lion-tech{--bootstrap-active-color:var(--lion-tech,#fd7e14)}.form-control.bootstrap-variant-lion-glam{--bootstrap-active-color:var(--lion-glam,#e83e8c)}.form-control.bootstrap-variant-primary:focus,.form-control.bootstrap-variant-secondary:focus,.form-control.bootstrap-variant-success:focus,.form-control.bootstrap-variant-danger:focus,.form-control.bootstrap-variant-warning:focus,.form-control.bootstrap-variant-info:focus,.form-control.bootstrap-variant-dark:focus,.form-control.bootstrap-variant-lion-packages:focus,.form-control.bootstrap-variant-lion-parking:focus,.form-control.bootstrap-variant-lion-tech:focus,.form-control.bootstrap-variant-lion-glam:focus{border-color:var(--bootstrap-active-color);box-shadow:0 0 0 .25rem color-mix(in srgb, var(--bootstrap-active-color) 25%, transparent)}:is(.form-floating:has(.form-control.bootstrap-variant-primary:focus)>label,.form-floating:has(.form-control.bootstrap-variant-primary:not(:placeholder-shown))>label){color:var(--bs-primary)}:is(.form-floating:has(.form-control.bootstrap-variant-secondary:focus)>label,.form-floating:has(.form-control.bootstrap-variant-secondary:not(:placeholder-shown))>label){color:var(--bs-secondary)}:is(.form-floating:has(.form-control.bootstrap-variant-success:focus)>label,.form-floating:has(.form-control.bootstrap-variant-success:not(:placeholder-shown))>label){color:var(--bs-success)}:is(.form-floating:has(.form-control.bootstrap-variant-danger:focus)>label,.form-floating:has(.form-control.bootstrap-variant-danger:not(:placeholder-shown))>label){color:var(--bs-danger)}:is(.form-floating:has(.form-control.bootstrap-variant-warning:focus)>label,.form-floating:has(.form-control.bootstrap-variant-warning:not(:placeholder-shown))>label){color:var(--bs-warning)}:is(.form-floating:has(.form-control.bootstrap-variant-info:focus)>label,.form-floating:has(.form-control.bootstrap-variant-info:not(:placeholder-shown))>label){color:var(--bs-info)}:is(.form-floating:has(.form-control.bootstrap-variant-dark:focus)>label,.form-floating:has(.form-control.bootstrap-variant-dark:not(:placeholder-shown))>label){color:var(--bs-dark)}:is(.form-floating:has(.form-control.bootstrap-variant-lion-packages:focus)>label,.form-floating:has(.form-control.bootstrap-variant-lion-packages:not(:placeholder-shown))>label){color:var(--lion-packages,#6f42c1)}:is(.form-floating:has(.form-control.bootstrap-variant-lion-parking:focus)>label,.form-floating:has(.form-control.bootstrap-variant-lion-parking:not(:placeholder-shown))>label){color:var(--lion-parking,#20c997)}:is(.form-floating:has(.form-control.bootstrap-variant-lion-tech:focus)>label,.form-floating:has(.form-control.bootstrap-variant-lion-tech:not(:placeholder-shown))>label){color:var(--lion-tech,#fd7e14)}:is(.form-floating:has(.form-control.bootstrap-variant-lion-glam:focus)>label,.form-floating:has(.form-control.bootstrap-variant-lion-glam:not(:placeholder-shown))>label){color:var(--lion-glam,#e83e8c)}.form-control.rounded-pill{padding-left:1.25rem;padding-right:1.25rem}.modal-backdrop.web-modal-backdrop,.modal-backdrop.ios-modal-backdrop,.modal-backdrop.android-modal-backdrop,.web-modal~.modal-backdrop,.ios-modal~.modal-backdrop,.android-modal~.modal-backdrop{opacity:.45;-webkit-backdrop-filter:blur(3px)}.web-modal .modal-content{overflow:hidden;border:1px solid #00000014!important;border-radius:12px!important;box-shadow:0 12px 32px #0000001a!important}.web-modal .custom-modal-title{color:#212529;font-size:1.15rem}.web-modal .custom-btn-group .btn-modal{text-align:center;flex:1 1 0;width:auto}.web-modal .custom-btn-group .btn-modal:not(:first-child):before{content:"";background-color:var(--bs-modal-footer-border-color);width:1px;height:auto;position:absolute;top:0;bottom:0;left:-1px}.web-modal .btn-modal{box-sizing:border-box;-webkit-tap-highlight-color:#00000026;width:100%;padding:12px 10px;font-size:16px;position:relative;box-shadow:none!important;color:inherit!important;background-color:#0000!important;border:none!important;outline:none!important}.web-modal .btn-modal:hover{background-color:#0000000a!important}.web-modal .btn-modal:active{background-color:#00000014!important}.web-modal .btn-modal:focus,.web-modal .btn-modal:focus-visible,.web-modal .btn-modal:focus-within{box-shadow:none!important;background-color:#0000!important}.ios-modal .modal-content{-webkit-backdrop-filter:blur(20px)saturate(180%);overflow:hidden;border:none!important;border-radius:22px!important;box-shadow:0 20px 40px #0000002e,0 0 1px #0003!important}.ios-modal .custom-modal-header{position:relative;border-bottom:1px solid #3c3c431f!important}.ios-modal .custom-modal-title{letter-spacing:-.2px;color:var(--lion-black,#000);font-size:1.1rem}.ios-modal .custom-modal-header .btn-close{background-size:10px;border-radius:50%;position:absolute;top:50%;right:16px;opacity:.8!important;margin:0!important;padding:8px!important;transform:translateY(-50%)!important}.ios-modal .custom-modal-body{font-size:.95rem;line-height:1.5}.ios-modal .custom-modal-footer{background-color:#0000!important;border-top:1px solid #3c3c431f!important}.ios-modal .custom-btn-group .btn-modal{text-align:center;flex:1 1 0;padding:14px 10px;font-size:1rem;font-weight:400}.ios-modal .btn-modal-cancel{font-weight:600}.ios-modal .custom-btn-group .btn-modal:not(:first-child):before{content:"";background-color:#3c3c431f;width:1px;position:absolute;top:0;bottom:0;left:0}.ios-modal .btn-modal{box-sizing:border-box;position:relative;box-shadow:none!important;background-color:#0000!important;border:none!important;outline:none!important}.ios-modal .btn-modal:hover{background-color:#0000000a!important}.ios-modal .btn-modal:active{background-color:#00000014!important}.android-modal .modal-content{overflow:hidden;border:none!important;border-radius:28px!important;box-shadow:0 8px 24px #00000026!important}.android-modal .custom-modal-header{padding-top:24px;padding-bottom:8px;border-bottom:none!important}.android-modal .custom-modal-title{color:#1d1b20;font-size:1.35rem;font-weight:500!important}.android-modal .custom-modal-body{font-size:.95rem}.android-modal .custom-modal-footer{border-top:1px solid #00000014!important;padding:0!important}.android-modal .custom-btn-group .btn-modal{text-transform:uppercase;letter-spacing:.5px;text-align:center;flex:1 1 0;padding:14px 10px;font-size:.9rem;font-weight:500}.android-modal .custom-btn-group .btn-modal:not(:first-child):before{content:"";background-color:#00000014;width:1px;height:auto;position:absolute;top:0;bottom:0;left:-1px}.android-modal .btn-modal{box-sizing:border-box;position:relative;box-shadow:none!important;background-color:#0000!important;border:none!important;outline:none!important}.android-modal .btn-modal:hover{color:var(--lion-black);background-color:#6750a414!important}.android-modal .btn-modal:active{color:var(--lion-black);background-color:#6750a41f!important}.custom-progress-bar{--lion-active-color:var(--bs-primary,#0d6efd);background-color:#e0e0e0;border-radius:4px;height:4px;position:relative;overflow:hidden}.custom-progress-bar.loading-variant-primary{--lion-active-color:var(--bs-primary,#0d6efd)}.custom-progress-bar.loading-variant-secondary{--lion-active-color:var(--bs-secondary,#6c757d)}.custom-progress-bar.loading-variant-success{--lion-active-color:var(--bs-success,#198754)}.custom-progress-bar.loading-variant-danger{--lion-active-color:var(--bs-danger,#dc3545)}.custom-progress-bar.loading-variant-warning{--lion-active-color:var(--bs-warning,#ffc107)}.custom-progress-bar.loading-variant-info{--lion-active-color:var(--bs-info,#0dcaf0)}.custom-progress-bar.loading-variant-light,.custom-progress-bar.loading-variant-dark{--lion-active-color:var(--bs-dark,#212529)}.custom-progress-bar.loading-variant-link{--lion-active-color:var(--bs-primary,#0d6efd)}.custom-progress-bar.loading-variant-lion-packages{--lion-active-color:var(--lion-packages,#6f42c1)}.custom-progress-bar.loading-variant-lion-parking{--lion-active-color:var(--lion-parking,#20c997)}.custom-progress-bar.loading-variant-lion-tech{--lion-active-color:var(--lion-tech,#fd7e14)}.custom-progress-bar.loading-variant-lion-glam{--lion-active-color:var(--lion-glam,#e83e8c)}.custom-progress-bar .indeterminate{background-color:var(--lion-active-color);border-radius:4px;width:40%;height:100%;animation:1.2s infinite indeterminate;position:absolute;top:0;left:-40%}@keyframes indeterminate{0%{width:40%;left:-40%}50%{width:60%;left:20%}to{width:40%;left:100%}}
+/*$vite$:1*/

package/package.json

@@ -1,11 +1,25 @@
+
 {
   "name": "@lion-npm/ui",
   "private": false,
-  "version": "1.0.2",
+  "version": "1.0.3",
   "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./style.css": "./dist/style.css"
+  },
+  "files": [
+    "dist"
+  ],
   "scripts": {
     "dev": "vite",
-    "build": "tsc -b && vite build",
+    "build": "tsc -p tsconfig.build.json && vite build",
     "lint": "oxlint",
     "preview": "vite preview"
   },
@@ -25,5 +39,9 @@
     "react-router-dom": "^7.18.4",
     "typescript": "~6.0.2",
     "vite": "^8.1.1"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   }
 }

package/.oxlintrc.json

@@ -1,8 +0,0 @@
-{
-  "$schema": "./node_modules/oxlint/configuration_schema.json",
-  "plugins": ["react", "oxc"],
-  "rules": {
-    "react/rules-of-hooks": "error",
-    "react/only-export-components": ["warn", { "allowConstantExport": true }]
-  }
-}

package/Dockerfile

@@ -1,7 +0,0 @@
-FROM node:24-bookworm
-
-WORKDIR /home/node/app
-
-USER node
-
-CMD ["bash"]

package/compose.yml

@@ -1,14 +0,0 @@
-services:
-  reactts:
-    container_name: ui-reactts
-    build:
-      context: .
-      dockerfile: Dockerfile
-    working_dir: /home/node/app
-    user: node
-    ports:
-      - "5173:5173"
-    stdin_open: true
-    tty: true
-    volumes:
-      - .:/home/node/app

package/index.html

@@ -1,15 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <title>Lion-UI</title>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" crossorigin="anonymous"></script>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>

package/src/App.tsx

@@ -1,84 +0,0 @@
-import "./assets/css/index.css";
-import "./assets/css/custom.css";
-
-import "./assets/css/buttons/buttons-android.css";
-import "./assets/css/buttons/buttons-ios.css";
-import "./assets/css/buttons/buttons-web.css";
-
-import "./assets/css/inputs/inputs-android.css";
-import "./assets/css/inputs/inputs-ios.css";
-import "./assets/css/inputs/inputs-bootstrap.css";
-
-import "./assets/css/modals/modals.css";
-
-import "./assets/css/loadings/loading-bar.css";
-
-import { Fragment } from "react";
-import { Container } from "react-bootstrap";
-import { Routes, Route } from 'react-router-dom';
-import { LionUIComponentsProvider } from "./context/LionUIComponentsContext.tsx";
-import Header from "./features/Header.tsx";
-import ButtonsSection from "./features/buttons/ButtonsSection.tsx";
-import ButtonsAndroidSection from "./features/buttons/components/ButtonsAndroidSection.tsx";
-import ButtonsIOSSection from "./features/buttons/components/ButtonsIOSSection.tsx";
-import ButtonsBootstrapSection from "./features/buttons/components/ButtonsBootstrapSection.tsx";
-import ButtonsCustomSection from "./features/buttons/components/ButtonsCustomSection.tsx";
-import InputsSection from "./features/inputs/InputsSection.tsx";
-import InputsAndroidSection from "./features/inputs/components/InputsAndroidSection.tsx";
-import InputsIOSSection from "./features/inputs/components/InputsIOSSection.tsx";
-import InputsBootstrapSection from "./features/inputs/components/InputsBootstrapSection.tsx";
-import ModalsSection from "./features/modals/ModalsSection.tsx";
-import ModalsAndroidSection from "./features/modals/components/ModalsAndroidSection.tsx";
-import ModalsIOSSection from "./features/modals/components/ModalsIOSSection.tsx";
-import ModalsWebSection from "./features/modals/components/ModalsWebSection.tsx";
-import LoadingSection from "./features/loadings/LoadingSection.tsx";
-import LoadingBarSection from "./features/loadings/components/LoadingBarSection.tsx";
-import InputsCustomSection from "./features/inputs/components/InputsCustomSection.tsx";
-
-export default function App() {
-    return (
-        <Fragment>
-            <Header />
-
-            <Container className={"py-2"}>
-                <LionUIComponentsProvider>
-                    <Routes>
-                        <Route path={"/"} element={<h1>Explore the page.</h1>} />
-
-                        <Route path={"buttons"} element={<ButtonsSection />}>
-                            <Route path={"custom"} element={<ButtonsCustomSection />} />
-
-                            <Route path={"android"} element={<ButtonsAndroidSection />} />
-
-                            <Route path={"ios"} element={<ButtonsIOSSection />} />
-
-                            <Route path={"web"} element={<ButtonsBootstrapSection />} />
-                        </Route>
-
-                        <Route path={"inputs"} element={<InputsSection />}>
-                            <Route path={"custom"} element={<InputsCustomSection />} />
-
-                            <Route path={"android"} element={<InputsAndroidSection />} />
-
-                            <Route path={"ios"} element={<InputsIOSSection />} />
-
-                            <Route path={"web"} element={<InputsBootstrapSection />} />
-                        </Route>
-
-                        <Route path={"modals"} element={<ModalsSection />}>
-                            <Route path={"android"} element={<ModalsAndroidSection />} />
-
-                            <Route path={"ios"} element={<ModalsIOSSection />} />
-
-                            <Route path={"web"} element={<ModalsWebSection />} />
-                        </Route>
-
-                        <Route path={"loadings"} element={<LoadingSection />}>
-                            <Route path={"bar"} element={<LoadingBarSection />} />
-                        </Route>
-                    </Routes>
-                </LionUIComponentsProvider>
-            </Container>
-        </Fragment>
-    );
-}

package/src/assets/css/buttons/buttons-android.css

@@ -1,251 +0,0 @@
-/* ==========================================================================
-   Android Material Design 3 - Base Configuration
-   ========================================================================== */
-
-.android-btn {
-    --btn-color: #0d6efd;
-    --btn-bg: var(--btn-color);
-    --btn-text: #ffffff;
-    --btn-disabled-bg: rgba(28, 27, 31, 0.12);
-    --btn-disabled-color: rgba(28, 27, 31, 0.38);
-    --btn-disabled-border: transparent;
-
-    position: relative;
-    overflow: hidden;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border: 1px solid transparent;
-    font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
-    font-weight: 500;
-    letter-spacing: 0.1px;
-    cursor: pointer;
-    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1),
-    box-shadow 0.2s cubic-bezier(0.2, 0, 0, 1),
-    border-color 0.2s cubic-bezier(0.2, 0, 0, 1),
-    border-radius 0.2s cubic-bezier(0.2, 0, 0, 1);
-}
-
-/* Shapes: Pill vs Rounded Rectangle */
-.android-btn-pill.android-btn-sm { border-radius: 16px; }
-.android-btn-pill.android-btn-md { border-radius: 20px; }
-.android-btn-pill.android-btn-lg { border-radius: 24px; }
-
-.android-btn-rounded.android-btn-sm { border-radius: 6px; }
-.android-btn-rounded.android-btn-md { border-radius: 8px; }
-.android-btn-rounded.android-btn-lg { border-radius: 12px; }
-
-/* ==========================================================================
-   M3 Base Disabled Behavior (Universal Reset)
-   ========================================================================== */
-
-.android-btn:disabled,
-.android-btn.disabled,
-fieldset:disabled .android-btn {
-    cursor: not-allowed !important;
-    box-shadow: none !important;
-    pointer-events: none;
-    opacity: 0.38 !important; /* M3 standard opacity for disabled state */
-}
-
-/* Maintain original background color when disabled with opacity */
-.android-btn-filled:disabled,
-.android-btn-filled.disabled {
-    background-color: var(--btn-bg) !important;
-    color: var(--btn-text) !important;
-    border-color: transparent !important;
-}
-
-.android-btn-elevated:disabled,
-.android-btn-elevated.disabled {
-    background-color: #ffffff !important;
-    color: var(--btn-color) !important;
-    border-color: transparent !important;
-}
-
-.android-btn-tonal:disabled,
-.android-btn-tonal.disabled {
-    background-color: color-mix(in srgb, var(--btn-color) 16%, #ffffff) !important;
-    color: var(--btn-color) !important;
-    border-color: transparent !important;
-}
-
-.android-btn-outlined:disabled,
-.android-btn-outlined.disabled {
-    background-color: transparent !important;
-    color: var(--btn-color) !important;
-    border-color: var(--btn-color) !important;
-}
-
-.android-btn-text:disabled,
-.android-btn-text.disabled {
-    background-color: transparent !important;
-    color: var(--btn-color) !important;
-    border-color: transparent !important;
-}
-
-/* ==========================================================================
-   M3 Styles (Filled, Elevated, Tonal, Outlined, Text)
-   ========================================================================== */
-
-/* 1. Filled Button */
-.android-btn-filled {
-    background-color: var(--btn-bg);
-    color: var(--btn-text) !important;
-}
-.android-btn-filled:hover:not(:disabled):not(.disabled) {
-    filter: brightness(0.92);
-}
-
-/* 2. Elevated Button */
-.android-btn-elevated {
-    background-color: #ffffff;
-    color: var(--btn-color) !important;
-    box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.30);
-}
-.android-btn-elevated:hover:not(:disabled):not(.disabled) {
-    box-shadow: 0px 2px 6px 2px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.30);
-    background-color: rgba(0, 0, 0, 0.02);
-}
-
-/* 3. Filled Tonal Button */
-.android-btn-tonal {
-    background-color: color-mix(in srgb, var(--btn-color) 16%, #ffffff);
-    color: var(--btn-color) !important;
-}
-.android-btn-tonal:hover:not(:disabled):not(.disabled) {
-    background-color: color-mix(in srgb, var(--btn-color) 24%, #ffffff);
-}
-
-/* 4. Outlined Button */
-.android-btn-outlined {
-    background-color: transparent;
-    color: var(--btn-color) !important;
-    border-color: var(--btn-color);
-}
-.android-btn-outlined:hover:not(:disabled):not(.disabled) {
-    background-color: color-mix(in srgb, var(--btn-color) 8%, transparent);
-}
-
-/* 5. Text Button */
-.android-btn-text {
-    background-color: transparent;
-    color: var(--btn-color) !important;
-}
-.android-btn-text:hover:not(:disabled):not(.disabled) {
-    background-color: color-mix(in srgb, var(--btn-color) 8%, transparent);
-}
-
-/* ==========================================================================
-   Ripple Effect
-   ========================================================================== */
-
-.android-btn .ripple {
-    position: absolute;
-    inset: 0;
-    border-radius: inherit;
-    background-color: currentColor;
-    opacity: 0;
-    pointer-events: none;
-    transition: opacity 0.2s ease-in-out;
-}
-
-.android-btn:active:not(:disabled):not(.disabled) .ripple {
-    opacity: 0.12;
-}
-
-/* ==========================================================================
-   Sizes
-   ========================================================================== */
-
-.android-btn-sm {
-    height: 32px;
-    padding: 0 12px;
-    font-size: 0.8125rem;
-}
-
-.android-btn-md {
-    height: 40px;
-    padding: 0 24px;
-    font-size: 0.875rem;
-}
-
-.android-btn-lg {
-    height: 48px;
-    padding: 0 28px;
-    font-size: 1rem;
-}
-
-/* ==========================================================================
-   Color Mapping and Text Contrast Fixes
-   ========================================================================== */
-
-.android-btn.btn-primary {
-    --btn-color: #0d6efd;
-    --btn-text: #ffffff;
-}
-
-.android-btn.btn-secondary {
-    --btn-color: #6c757d;
-    --btn-text: #ffffff;
-}
-
-.android-btn.btn-success {
-    --btn-color: #198754;
-    --btn-text: #ffffff;
-}
-
-.android-btn.btn-danger {
-    --btn-color: #dc3545;
-    --btn-text: #ffffff;
-}
-
-.android-btn.btn-warning {
-    --btn-color: #ffc107;
-    --btn-text: #000000;
-}
-
-.android-btn.btn-info {
-    --btn-color: #0dcaf0;
-    --btn-text: #000000;
-}
-
-.android-btn.btn-light {
-    --btn-color: #6c757d;
-    --btn-bg: #f8f9fa;
-    --btn-text: #212529;
-}
-
-.android-btn.btn-dark {
-    --btn-color: #212529;
-    --btn-text: #ffffff;
-}
-
-.android-btn.btn-link {
-    --btn-color: #0d6efd;
-    --btn-text: #0d6efd;
-    background-color: transparent !important;
-    text-decoration: underline;
-    box-shadow: none !important;
-}
-
-/* Custom Lion Variants */
-.android-btn.btn-lion-packages {
-    --btn-color: var(--lion-packages, #6f42c1);
-    --btn-text: #ffffff;
-}
-
-.android-btn.btn-lion-parking {
-    --btn-color: var(--lion-parking, #fd7e14);
-    --btn-text: #ffffff;
-}
-
-.android-btn.btn-lion-tech {
-    --btn-color: var(--lion-tech, #20c997);
-    --btn-text: #ffffff;
-}
-
-.android-btn.btn-lion-glam {
-    --btn-color: var(--lion-glam, #e83e8c);
-    --btn-text: #ffffff;
-}