.app-btn{position:relative;--text-default:var(--text-title);--text-contrast:#fff;border:none;border-radius:4px;cursor:pointer;display:inline-flex;font-size:16px;font-weight:600;outline:none;--bg-color:var(--body-bg);box-sizing:border-box;touch-action:manipulation}.app-btn,.app-btn .app-btn-loading{align-items:center;justify-content:center}.app-btn .app-btn-loading{bottom:0;color:currentColor;display:flex;left:0;position:absolute;right:0;top:0}.app-btn .app-btn-loading>*{animation:spin .6s linear infinite}.app-btn[data-state=loading] .icon-container,.app-btn[data-state=loading] .text-container{opacity:0}.app-btn.primary{background-color:var(--bg-primary);color:var(--text-contrast)}.app-btn.primary:hover{background-color:color-mix(in srgb,var(--bg-primary) 90%,#000)}.app-btn.primary:active{background-color:color-mix(in srgb,var(--bg-primary) 80%,#000)}.app-btn.primary.bordered{border:1px solid var(--bg-primary)}.app-btn.primary.outlined{background-color:transparent;color:var(--bg-primary)}.app-btn.primary.outlined:hover{background-color:color-mix(in srgb,var(--bg-primary) 10%,transparent)}.app-btn.primary.outlined:active{background-color:color-mix(in srgb,var(--bg-primary) 20%,transparent)}.app-btn.secondary{background-color:var(--bg-secondary);color:var(--text-contrast)}.app-btn.secondary:hover{background-color:color-mix(in srgb,var(--bg-secondary) 90%,#000)}.app-btn.secondary:active{background-color:color-mix(in srgb,var(--bg-secondary) 80%,#000)}.app-btn.secondary.outlined{background-color:transparent;color:var(--bg-secondary)}.app-btn.secondary.outlined:hover{background-color:color-mix(in srgb,var(--bg-secondary) 10%,transparent)}.app-btn.secondary.outlined:active{background-color:color-mix(in srgb,var(--bg-secondary) 20%,transparent)}.app-btn.accent{background-color:var(--bg-accent);color:var(--text-contrast)}.app-btn.accent:hover{background-color:color-mix(in srgb,var(--bg-accent) 90%,#000)}.app-btn.accent:active{background-color:color-mix(in srgb,var(--bg-accent) 80%,#000)}.app-btn.accent.outlined{background-color:transparent;color:var(--bg-accent)}.app-btn.accent.outlined:hover{background-color:color-mix(in srgb,var(--bg-accent) 10%,transparent)}.app-btn.accent.outlined:active{background-color:color-mix(in srgb,var(--bg-accent) 20%,transparent)}.app-btn.gradient{background:linear-gradient(135.34deg,#8c421d 15.43%,#fbe67b 38.47%,#fcfbe7 53.36%,#f7d14e 69.97%,#d4a041 86.26%);border:2px solid #d4a041;position:relative}.app-btn.gradient.hover-effect:hover{box-shadow:0 2px 2px -1px #00000040}.app-btn.gradient.outlined{background:linear-gradient(var(--bg-color),var(--bg-color)) padding-box,linear-gradient(135.34deg,#8c421d 15.43%,#fbe67b 38.47%,#fcfbe7 53.36%,#f7d14e 69.97%,#d4a041 86.26%) border-box;border:2px solid transparent;border-radius:4px}.app-btn.gradient.outlined.hover-effect:hover{background:linear-gradient(135.34deg,#8c421d 15.43%,#fbe67b 38.47%,#fcfbe7 53.36%,#f7d14e 69.97%,#d4a041 86.26%);border-color:#d4a041;box-shadow:0 2px 2px -1px #00000040}.app-btn.neutral{background-color:var(--bg-neutral);border:2px solid var(--bg-neutral);color:var(--text-neutral)}.app-btn.neutral.outlined{background-color:transparent;color:var(--bg-neutral)}.app-btn.neutral.outlined:hover{background-color:color-mix(in srgb,var(--bg-neutral) 10%,transparent)}.app-btn.neutral.outlined:active{background-color:color-mix(in srgb,var(--bg-neutral) 20%,transparent)}.app-btn.black{background-color:var(--bg-black);border:2px solid var(--bg-black);color:var(--text-white)}.app-btn.black.outlined{background-color:transparent;color:var(--bg-black)}.app-btn.black.outlined:hover{background-color:color-mix(in srgb,var(--bg-black) 10%,transparent)}.app-btn.black.outlined:active{background-color:color-mix(in srgb,var(--bg-black) 20%,transparent)}.app-btn.info{background-color:var(--bg-info);color:var(--text-info)}.app-btn.danger{background-color:var(--bg-danger);color:var(--text-danger)}.app-btn.success{background-color:var(--bg-success);color:var(--text-success)}.app-btn.warning{background-color:var(--bg-warning);color:var(--text-warning)}.app-btn.app-btn-text{min-width:40px;padding:8px 16px}.app-btn.app-btn-text.app-btn-sm{padding:6px 8px}.app-btn.app-btn-icon{gap:4px;padding:8px}.app-btn.app-btn-icon.app-btn-sm{padding:4px}.app-btn.app-btn-sm{font-size:14px}.app-btn.app-btn-lg{font-size:20px;min-height:55px;min-width:200px}.app-btn .icon-container,.app-btn .text-container{z-index:1}.app-btn .icon-container{align-items:center;display:flex;justify-content:center}.app-btn .icon-container>svg{height:26px;width:26px}.app-btn:disabled{cursor:not-allowed}
