@autenticar-me/vue 0.2.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/README.md +55 -4
  2. package/dist/components/SignIn.vue.d.ts +6 -3
  3. package/dist/components/SignIn.vue.d.ts.map +1 -1
  4. package/dist/components/SignUp.vue.d.ts +6 -3
  5. package/dist/components/SignUp.vue.d.ts.map +1 -1
  6. package/dist/index.cjs +43 -7
  7. package/dist/index.cjs.map +1 -1
  8. package/dist/index.d.ts +2 -0
  9. package/dist/index.d.ts.map +1 -1
  10. package/dist/index.js +43 -7
  11. package/dist/index.js.map +1 -1
  12. package/package.json +2 -3
  13. package/dist/vue.css +0 -1761
package/README.md CHANGED
@@ -40,9 +40,13 @@ app.mount('#app')
40
40
  ### Componentes Disponíveis
41
41
 
42
42
  #### Botões
43
- - `SignInButton` - Botão de login
43
+ - `SignInButton` - Botão de login que abre modal
44
44
  - `SignOutButton` - Botão de logout
45
- - `SignUpButton` - Botão de cadastro
45
+ - `SignUpButton` - Botão de cadastro que abre modal
46
+
47
+ #### Formulários
48
+ - `SignIn` - Formulário de login completo com logo e rodapé
49
+ - `SignUp` - Formulário de cadastro completo com logo e rodapé
46
50
 
47
51
  #### Layouts
48
52
  - `SignedIn` - Wrapper para conteúdo visível apenas para usuários autenticados
@@ -50,11 +54,58 @@ app.mount('#app')
50
54
 
51
55
  #### Outros
52
56
  - `AuthSwitcher` - Alterna entre estados autenticado/não autenticado
53
- - `SignIn` - Formulário de login completo
54
- - `SignUp` - Formulário de cadastro completo
55
57
  - `UserProfile` - Perfil do usuário
56
58
  - `Notification` - Sistema de notificações
57
59
 
60
+ ### Exemplos de Uso
61
+
62
+ #### Usando Formulários com Redirecionamento Automático
63
+
64
+ ```vue
65
+ <template>
66
+ <div class="login-page">
67
+ <h1>Faça login</h1>
68
+ <SignIn redirect="/dashboard" />
69
+ </div>
70
+ </template>
71
+
72
+ <script setup>
73
+ import { SignIn } from '@autenticar-me/vue'
74
+ </script>
75
+ ```
76
+
77
+ ```vue
78
+ <template>
79
+ <div class="signup-page">
80
+ <h1>Criar conta</h1>
81
+ <SignUp redirect="/onboarding" />
82
+ </div>
83
+ </template>
84
+
85
+ <script setup>
86
+ import { SignUp } from '@autenticar-me/vue'
87
+ </script>
88
+ ```
89
+
90
+ #### Redirecionamento Customizado
91
+
92
+ ```vue
93
+ <template>
94
+ <SignIn @completed="handleLogin" />
95
+ </template>
96
+
97
+ <script setup>
98
+ import { SignIn } from '@autenticar-me/vue'
99
+ import { useRouter } from 'vue-router'
100
+
101
+ const router = useRouter()
102
+
103
+ const handleLogin = () => {
104
+ router.push('/minha-rota')
105
+ }
106
+ </script>
107
+ ```
108
+
58
109
  ## Tipos
59
110
 
60
111
  O pacote exporta tipos TypeScript para:
package/dist/components/SignIn.vue.d.ts CHANGED
@@ -1,10 +1,13 @@
1
- declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
1
+ interface Props {
2
+ redirect?: string;
3
+ }
4
+ declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
2
5
  completed: (...args: any[]) => void;
3
6
  "sign-up": (...args: any[]) => void;
4
- }, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
7
+ }, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
5
8
  onCompleted?: ((...args: any[]) => any) | undefined;
6
9
  "onSign-up"?: ((...args: any[]) => any) | undefined;
7
- }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
10
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
8
11
  emailInput: HTMLInputElement;
9
12
  passwordInput: HTMLInputElement;
10
13
  }, any>;
package/dist/components/SignIn.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SignIn.vue.d.ts","sourceRoot":"","sources":["../../src/components/SignIn.vue"],"names":[],"mappings":";;;;;;;;;;AAi3CA,wBAOG"}
1
+ {"version":3,"file":"SignIn.vue.d.ts","sourceRoot":"","sources":["../../src/components/SignIn.vue"],"names":[],"mappings":"AAu0BA,UAAU,KAAK;IACX,QAAQ,CAAC,EAAE,MAAM,CAAA;CACpB;;;;;;;;;;;AA0kBD,wBAQG"}
package/dist/components/SignUp.vue.d.ts CHANGED
@@ -1,10 +1,13 @@
1
- declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
1
+ interface Props {
2
+ redirect?: string;
3
+ }
4
+ declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
2
5
  completed: () => any;
3
6
  "sign-in": () => any;
4
- }, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
7
+ }, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
5
8
  onCompleted?: (() => any) | undefined;
6
9
  "onSign-in"?: (() => any) | undefined;
7
- }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
10
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
8
11
  firstNameInput: HTMLInputElement;
9
12
  emailInput: HTMLInputElement;
10
13
  }, any>;
package/dist/components/SignUp.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SignUp.vue.d.ts","sourceRoot":"","sources":["../../src/components/SignUp.vue"],"names":[],"mappings":";;;;;;;;;;AAqmCA,wBAOG"}
1
+ {"version":3,"file":"SignUp.vue.d.ts","sourceRoot":"","sources":["../../src/components/SignUp.vue"],"names":[],"mappings":"AAkqBA,UAAU,KAAK;IACX,QAAQ,CAAC,EAAE,MAAM,CAAA;CACpB;;;;;;;;;;;AAmeD,wBAQG"}
package/dist/index.cjs CHANGED
@@ -1,4 +1,12 @@
1
- "use strict";
1
+
2
+ (function() {
3
+ if (typeof document !== 'undefined') {
4
+ const style = document.createElement('style');
5
+ style.textContent = "\n.atm-overlay[data-v-c347df44] {\n position: fixed;\n inset: 0;\n z-index: 99999;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(4px);\n overflow-y: auto;\n padding: 1.5rem 0;\n}\n.atm-container[data-v-c347df44] {\n padding: 0 1.5rem;\n width: 100%;\n margin: auto;\n}\n.atm-fade-layer[data-v-c347df44] {\n position: fixed;\n inset: 0;\n transition: opacity 0.2s ease;\n pointer-events: none;\n}\n.atm-fade-bg[data-v-c347df44] {\n position: absolute;\n inset: 0;\n opacity: 0.75;\n}\n.atm-modal[data-v-c347df44] {\n position: relative;\n display: inline-block;\n vertical-align: bottom;\n background-color: #ffffff;\n border-radius: 0.5rem;\n text-align: left;\n box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);\n transform: translate(0);\n transition: all 0.2s ease-in-out;\n max-width: 32rem;\n width: 100%;\n max-height: calc(100vh - 3rem);\n display: flex;\n flex-direction: column;\n}\n.atm-close-button[data-v-c347df44] {\n position: absolute;\n top: 1rem;\n right: 1rem;\n color: #9ca3af;\n background: transparent;\n border: none;\n cursor: pointer;\n padding: 0.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10;\n}\n.atm-close-button[data-v-c347df44]:hover {\n color: #4b5563;\n}\n.atm-icon[data-v-c347df44] {\n width: 1.5rem;\n height: 1.5rem;\n}\n.atm-modal-content[data-v-c347df44] {\n padding: 1.25rem;\n overflow-y: auto;\n flex: 1;\n min-height: 0;\n}\n.atm-modal-title[data-v-c347df44] {\n font-size: 1.125rem;\n font-weight: 500;\n color: #111827;\n margin: 0;\n margin-bottom: 0.75rem;\n}\n@media (max-width: 768px) {\n.atm-overlay[data-v-c347df44] {\n padding: 1rem 0;\n}\n.atm-container[data-v-c347df44] {\n padding: 0 1rem;\n}\n.atm-modal[data-v-c347df44] {\n border-radius: 0.375rem;\n max-height: calc(100vh - 2rem);\n}\n.atm-modal-content[data-v-c347df44] {\n padding: 1rem;\n}\n.atm-modal-title[data-v-c347df44] {\n font-size: 1rem;\n margin-bottom: 0.75rem;\n}\n.atm-close-button[data-v-c347df44] {\n top: 0.75rem;\n right: 0.75rem;\n}\n.atm-icon[data-v-c347df44] {\n width: 1.25rem;\n height: 1.25rem;\n}\n}\n@media (max-width: 480px) {\n.atm-overlay[data-v-c347df44] {\n padding: 0.5rem 0;\n}\n.atm-container[data-v-c347df44] {\n padding: 0 0.5rem;\n}\n.atm-modal[data-v-c347df44] {\n border-radius: 0.25rem;\n max-width: 100%;\n max-height: calc(100vh - 1rem);\n}\n.atm-modal-content[data-v-c347df44] {\n padding: 0.875rem;\n}\n.atm-modal-title[data-v-c347df44] {\n font-size: 0.9375rem;\n margin-bottom: 0.625rem;\n}\n.atm-close-button[data-v-c347df44] {\n top: 0.5rem;\n right: 0.5rem;\n}\n}\n@media (max-width: 360px) {\n.atm-overlay[data-v-c347df44] {\n padding: 0.25rem 0;\n}\n.atm-container[data-v-c347df44] {\n padding: 0 0.25rem;\n}\n.atm-modal[data-v-c347df44] {\n max-height: calc(100vh - 0.5rem);\n}\n.atm-modal-content[data-v-c347df44] {\n padding: 0.75rem;\n}\n.atm-modal-title[data-v-c347df44] {\n font-size: 0.875rem;\n margin-bottom: 0.5rem;\n}\n}\n\n.atm-login-container[data-v-305a11b6] {\n background: #ffffff;\n border-radius: 8px;\n font-family: 'Segoe UI', system-ui, sans-serif;\n text-align: center;\n}\n.atm-logo-container[data-v-305a11b6] {\n margin-bottom: 12px;\n}\n.atm-logo-placeholder[data-v-305a11b6] {\n width: 44px;\n height: 44px;\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #f0f0f0;\n border-radius: 50%;\n color: #888;\n font-size: 11px;\n}\n.atm-logo-image[data-v-305a11b6] {\n max-width: 44px;\n max-height: 44px;\n margin: 0 auto;\n display: block;\n border-radius: 4px;\n object-fit: contain;\n}\n.atm-project-name[data-v-305a11b6] {\n margin: 0 0 4px 0;\n font-size: 18px;\n color: var(--v18341448);\n font-weight: 600;\n}\n.atm-welcome-text[data-v-305a11b6] {\n margin: 0 0 16px 0;\n font-size: 14px;\n color: #666;\n}\n.atm-form-group[data-v-305a11b6] {\n margin-bottom: 12px;\n text-align: left;\n}\n.atm-input-label[data-v-305a11b6] {\n display: block;\n margin-bottom: 4px;\n font-size: 13px;\n color: #555;\n font-weight: 500;\n}\n.atm-input-field[data-v-305a11b6] {\n width: 100%;\n padding: 8px 10px;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n box-sizing: border-box;\n transition: border-color 0.2s;\n}\n.atm-input-field[data-v-305a11b6]:focus {\n outline: none;\n border-color: var(--v18341448);\n box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-input-field[data-v-305a11b6]:disabled {\n background-color: #f5f5f5;\n cursor: not-allowed;\n}\n.atm-field-error[data-v-305a11b6] {\n color: #dc3545;\n font-size: 12px;\n margin-top: 4px;\n text-align: left;\n}\n.atm-alternative-options[data-v-305a11b6] {\n margin-top: 8px;\n text-align: center;\n}\n.atm-forgot-password-link[data-v-305a11b6] {\n font-size: 12px;\n background: none;\n border: none;\n color: var(--v97f49b54);\n cursor: pointer;\n text-decoration: none;\n padding: 0;\n font-family: inherit;\n}\n.atm-forgot-password-link[data-v-305a11b6]:hover:not(:disabled) {\n text-decoration: underline;\n}\n.atm-forgot-password-link[data-v-305a11b6]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.atm-strategy-choice[data-v-305a11b6] {\n text-align: center;\n margin-bottom: 12px;\n}\n.atm-strategy-title[data-v-305a11b6] {\n font-size: 14px;\n color: #666;\n margin-bottom: 12px;\n}\n.atm-strategy-buttons[data-v-305a11b6] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.atm-strategy-button[data-v-305a11b6] {\n width: 100%;\n padding: 10px;\n background: #f8f9fa;\n color: #333;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n cursor: pointer;\n transition: all 0.2s;\n}\n.atm-strategy-button[data-v-305a11b6]:hover:not(:disabled) {\n background: #e9ecef;\n border-color: var(--v18341448);\n}\n.atm-strategy-button[data-v-305a11b6]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.atm-email-link-text[data-v-305a11b6] {\n font-size: 14px;\n color: #666;\n margin: 0;\n text-align: center;\n}\n.atm-login-button[data-v-305a11b6] {\n width: 100%;\n padding: 10px;\n margin-top: 4px;\n background: var(--v18341448);\n color: #fff;\n border: none;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s;\n min-height: 42px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.atm-login-button[data-v-305a11b6]:hover:not(:disabled) {\n opacity: 0.9;\n transform: translateY(-1px);\n}\n.atm-login-button[data-v-305a11b6]:disabled {\n opacity: 0.8;\n cursor: not-allowed;\n transform: none;\n}\n.button-spinner[data-v-305a11b6] {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n color: #fff;\n font-weight: 500;\n}\n.spinner-svg[data-v-305a11b6] {\n animation: spin-305a11b6 1s linear infinite;\n width: 18px;\n height: 18px;\n stroke: #fff;\n}\n.spinner-circle[data-v-305a11b6] {\n stroke-dasharray: 90, 150;\n stroke-linecap: round;\n}\n@keyframes spin-305a11b6 {\n0% {\n transform: rotate(0deg);\n}\n100% {\n transform: rotate(360deg);\n}\n}\n.atm-footer-links[data-v-305a11b6] {\n margin-top: 16px;\n font-size: 13px;\n}\n.atm-signup-text[data-v-305a11b6] {\n color: #666;\n margin-bottom: 6px;\n}\n.atm-signup-link[data-v-305a11b6] {\n color: var(--v97f49b54);\n text-decoration: none;\n cursor: pointer;\n}\n.atm-signup-link[data-v-305a11b6]:hover {\n text-decoration: underline;\n}\n.atm-powered-by[data-v-305a11b6] {\n color: #999;\n font-size: 11px;\n margin: 0;\n}\n@media (max-width: 768px) {\n.atm-project-name[data-v-305a11b6] {\n font-size: 17px;\n}\n.atm-welcome-text[data-v-305a11b6] {\n font-size: 13px;\n margin-bottom: 14px;\n}\n.atm-form-group[data-v-305a11b6] {\n margin-bottom: 10px;\n}\n.atm-input-label[data-v-305a11b6] {\n font-size: 12px;\n margin-bottom: 4px;\n}\n.atm-input-field[data-v-305a11b6] {\n padding: 8px 10px;\n font-size: 13px;\n}\n.atm-login-button[data-v-305a11b6] {\n font-size: 13px;\n padding: 9px;\n min-height: 40px;\n}\n.atm-strategy-button[data-v-305a11b6] {\n padding: 9px;\n font-size: 13px;\n}\n.atm-footer-links[data-v-305a11b6] {\n margin-top: 14px;\n font-size: 12px;\n}\n}\n@media (max-width: 480px) {\n.atm-logo-placeholder[data-v-305a11b6] {\n width: 40px;\n height: 40px;\n font-size: 10px;\n}\n.atm-logo-image[data-v-305a11b6] {\n max-width: 40px;\n max-height: 40px;\n}\n.atm-project-name[data-v-305a11b6] {\n font-size: 16px;\n margin-bottom: 4px;\n}\n.atm-welcome-text[data-v-305a11b6] {\n font-size: 12px;\n margin-bottom: 12px;\n}\n.atm-form-group[data-v-305a11b6] {\n margin-bottom: 10px;\n}\n.atm-input-label[data-v-305a11b6] {\n font-size: 12px;\n margin-bottom: 3px;\n}\n.atm-input-field[data-v-305a11b6] {\n padding: 7px 9px;\n font-size: 13px;\n}\n.atm-login-button[data-v-305a11b6] {\n font-size: 13px;\n padding: 9px;\n min-height: 38px;\n}\n.atm-forgot-password-link[data-v-305a11b6] {\n font-size: 11px;\n}\n.atm-strategy-title[data-v-305a11b6] {\n font-size: 13px;\n margin-bottom: 10px;\n}\n.atm-strategy-button[data-v-305a11b6] {\n padding: 9px;\n font-size: 13px;\n}\n.atm-email-link-text[data-v-305a11b6] {\n font-size: 13px;\n}\n.atm-footer-links[data-v-305a11b6] {\n margin-top: 12px;\n font-size: 12px;\n}\n.atm-powered-by[data-v-305a11b6] {\n font-size: 10px;\n}\n.spinner-svg[data-v-305a11b6] {\n width: 16px;\n height: 16px;\n}\n.button-spinner[data-v-305a11b6] {\n gap: 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-logo-placeholder[data-v-305a11b6] {\n width: 36px;\n height: 36px;\n font-size: 9px;\n}\n.atm-logo-image[data-v-305a11b6] {\n max-width: 36px;\n max-height: 36px;\n}\n.atm-project-name[data-v-305a11b6] {\n font-size: 15px;\n margin-bottom: 3px;\n}\n.atm-welcome-text[data-v-305a11b6] {\n font-size: 11px;\n margin-bottom: 10px;\n}\n.atm-form-group[data-v-305a11b6] {\n margin-bottom: 8px;\n}\n.atm-input-label[data-v-305a11b6] {\n font-size: 11px;\n margin-bottom: 3px;\n}\n.atm-input-field[data-v-305a11b6] {\n padding: 6px 8px;\n font-size: 12px;\n}\n.atm-login-button[data-v-305a11b6] {\n font-size: 12px;\n padding: 8px;\n min-height: 36px;\n}\n.atm-strategy-button[data-v-305a11b6] {\n padding: 8px;\n font-size: 12px;\n}\n.atm-footer-links[data-v-305a11b6] {\n margin-top: 10px;\n font-size: 11px;\n}\n.spinner-svg[data-v-305a11b6] {\n width: 14px;\n height: 14px;\n}\n}\n\n.atm-notification-container[data-v-f5e47084] {\n font-family: Arial, Helvetica, sans-serif;\n position: fixed;\n top: 20px;\n right: 20px;\n z-index: 99999;\n pointer-events: none;\n}\n.atm-notification[data-v-f5e47084] {\n padding: 12px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n min-width: 250px;\n max-width: 350px;\n pointer-events: auto;\n}\n.atm-notification--error[data-v-f5e47084] {\n background: #ff3333;\n color: #FFF;\n}\n.atm-notification--success[data-v-f5e47084] {\n background: #00a622;\n color: #FFF;\n}\n.atm-notification--warning[data-v-f5e47084] {\n background: #ffa500;\n color: #FFF;\n}\n.atm-notification-enter-active[data-v-f5e47084] {\n transition: all 0.3s ease-out;\n}\n.atm-notification-leave-active[data-v-f5e47084] {\n transition: all 0.3s ease-in;\n}\n.atm-notification-enter-from[data-v-f5e47084] {\n transform: translateX(100%);\n opacity: 0;\n}\n.atm-notification-leave-to[data-v-f5e47084] {\n transform: translateX(100%);\n opacity: 0;\n}\n@media (max-width: 768px) {\n.atm-notification-container[data-v-f5e47084] {\n top: 16px;\n right: 16px;\n left: 16px;\n}\n.atm-notification[data-v-f5e47084] {\n min-width: auto;\n max-width: 100%;\n padding: 11px 14px;\n font-size: 13px;\n}\n}\n@media (max-width: 480px) {\n.atm-notification-container[data-v-f5e47084] {\n top: 12px;\n right: 12px;\n left: 12px;\n}\n.atm-notification[data-v-f5e47084] {\n padding: 10px 12px;\n font-size: 12px;\n border-radius: 5px;\n}\n}\n@media (max-width: 360px) {\n.atm-notification-container[data-v-f5e47084] {\n top: 10px;\n right: 10px;\n left: 10px;\n}\n.atm-notification[data-v-f5e47084] {\n padding: 9px 11px;\n font-size: 11px;\n border-radius: 4px;\n}\n}\n\n.atm-signup-container[data-v-e15f7da9] {\n width: 100%;\n border-radius: 8px;\n font-family: 'Segoe UI', system-ui, sans-serif;\n text-align: center;\n}\n.atm-logo-container[data-v-e15f7da9] {\n margin-bottom: 12px;\n}\n.atm-logo-placeholder[data-v-e15f7da9] {\n width: 44px;\n height: 44px;\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #f0f0f0;\n border-radius: 50%;\n color: #888;\n font-size: 11px;\n}\n.atm-logo-image[data-v-e15f7da9] {\n max-width: 44px;\n max-height: 44px;\n margin: 0 auto;\n display: block;\n border-radius: 4px;\n object-fit: contain;\n}\n.atm-project-name[data-v-e15f7da9] {\n margin: 0 0 4px 0;\n font-size: 18px;\n color: var(--v1ca6007a);\n font-weight: 600;\n}\n.atm-welcome-text[data-v-e15f7da9] {\n margin: 0 0 16px 0;\n font-size: 14px;\n color: #666;\n}\n.atm-form-group[data-v-e15f7da9] {\n margin-bottom: 12px;\n text-align: left;\n}\n.atm-input-label[data-v-e15f7da9] {\n display: block;\n margin-bottom: 4px;\n font-size: 13px;\n color: #555;\n font-weight: 500;\n}\n.atm-input-field[data-v-e15f7da9] {\n width: 100%;\n padding: 8px 10px;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n box-sizing: border-box;\n transition: border-color 0.2s;\n}\n.atm-input-field[data-v-e15f7da9]:focus {\n outline: none;\n border-color: var(--v1ca6007a);\n box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-input-field[data-v-e15f7da9]:disabled {\n background-color: #f5f5f5;\n cursor: not-allowed;\n}\n.atm-field-error[data-v-e15f7da9] {\n color: #dc3545;\n font-size: 12px;\n margin-top: 4px;\n text-align: left;\n}\n.atm-signup-button[data-v-e15f7da9] {\n width: 100%;\n padding: 10px;\n margin-top: 4px;\n background: var(--v1ca6007a);\n color: #fff;\n border: none;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s;\n min-height: 42px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.atm-signup-button[data-v-e15f7da9]:hover:not(:disabled) {\n opacity: 0.9;\n transform: translateY(-1px);\n}\n.atm-signup-button[data-v-e15f7da9]:disabled {\n opacity: 0.8;\n cursor: not-allowed;\n transform: none;\n}\n.button-spinner[data-v-e15f7da9] {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n color: #fff;\n font-weight: 500;\n}\n.spinner-svg[data-v-e15f7da9] {\n animation: spin-e15f7da9 1s linear infinite;\n width: 18px;\n height: 18px;\n stroke: #fff;\n}\n.spinner-circle[data-v-e15f7da9] {\n stroke-dasharray: 90, 150;\n stroke-linecap: round;\n}\n@keyframes spin-e15f7da9 {\n0% {\n transform: rotate(0deg);\n}\n100% {\n transform: rotate(360deg);\n}\n}\n.atm-footer-links[data-v-e15f7da9] {\n margin-top: 16px;\n font-size: 13px;\n}\n.atm-login-text[data-v-e15f7da9] {\n color: #666;\n margin-bottom: 6px;\n}\n.atm-login-link[data-v-e15f7da9] {\n color: var(--v12f1ab11);\n text-decoration: none;\n cursor: pointer;\n transition: opacity 0.2s;\n}\n.atm-login-link[data-v-e15f7da9]:hover:not(.disabled-link) {\n text-decoration: underline;\n}\n.atm-login-link.disabled-link[data-v-e15f7da9] {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n.atm-powered-by[data-v-e15f7da9] {\n color: #999;\n font-size: 11px;\n margin: 0;\n}\n@media (max-width: 768px) {\n.atm-project-name[data-v-e15f7da9] {\n font-size: 17px;\n}\n.atm-welcome-text[data-v-e15f7da9] {\n font-size: 13px;\n margin-bottom: 14px;\n}\n.atm-form-group[data-v-e15f7da9] {\n margin-bottom: 10px;\n}\n.atm-input-label[data-v-e15f7da9] {\n font-size: 12px;\n margin-bottom: 4px;\n}\n.atm-input-field[data-v-e15f7da9] {\n padding: 8px 10px;\n font-size: 13px;\n}\n.atm-signup-button[data-v-e15f7da9] {\n font-size: 13px;\n padding: 9px;\n min-height: 40px;\n}\n.atm-footer-links[data-v-e15f7da9] {\n margin-top: 14px;\n font-size: 12px;\n}\n}\n@media (max-width: 480px) {\n.atm-logo-placeholder[data-v-e15f7da9] {\n width: 40px;\n height: 40px;\n font-size: 10px;\n}\n.atm-logo-image[data-v-e15f7da9] {\n max-width: 40px;\n max-height: 40px;\n}\n.atm-project-name[data-v-e15f7da9] {\n font-size: 16px;\n margin-bottom: 4px;\n}\n.atm-welcome-text[data-v-e15f7da9] {\n font-size: 12px;\n margin-bottom: 12px;\n}\n.atm-form-group[data-v-e15f7da9] {\n margin-bottom: 10px;\n}\n.atm-input-label[data-v-e15f7da9] {\n font-size: 12px;\n margin-bottom: 3px;\n}\n.atm-input-field[data-v-e15f7da9] {\n padding: 7px 9px;\n font-size: 13px;\n}\n.atm-signup-button[data-v-e15f7da9] {\n font-size: 13px;\n padding: 9px;\n min-height: 38px;\n}\n.atm-footer-links[data-v-e15f7da9] {\n margin-top: 12px;\n font-size: 12px;\n}\n.atm-powered-by[data-v-e15f7da9] {\n font-size: 10px;\n}\n.spinner-svg[data-v-e15f7da9] {\n width: 16px;\n height: 16px;\n}\n.button-spinner[data-v-e15f7da9] {\n gap: 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-logo-placeholder[data-v-e15f7da9] {\n width: 36px;\n height: 36px;\n font-size: 9px;\n}\n.atm-logo-image[data-v-e15f7da9] {\n max-width: 36px;\n max-height: 36px;\n}\n.atm-project-name[data-v-e15f7da9] {\n font-size: 15px;\n margin-bottom: 3px;\n}\n.atm-welcome-text[data-v-e15f7da9] {\n font-size: 11px;\n margin-bottom: 10px;\n}\n.atm-form-group[data-v-e15f7da9] {\n margin-bottom: 8px;\n}\n.atm-input-label[data-v-e15f7da9] {\n font-size: 11px;\n margin-bottom: 3px;\n}\n.atm-input-field[data-v-e15f7da9] {\n padding: 6px 8px;\n font-size: 12px;\n}\n.atm-signup-button[data-v-e15f7da9] {\n font-size: 12px;\n padding: 8px;\n min-height: 36px;\n}\n.atm-footer-links[data-v-e15f7da9] {\n margin-top: 10px;\n font-size: 11px;\n}\n.spinner-svg[data-v-e15f7da9] {\n width: 14px;\n height: 14px;\n}\n}\n\n.atm-signin-btn[data-v-4139c6d0] {\n padding: 12px;\n margin-top: 8px;\n background: var(--v0f0ded3a);\n color: #FFF;\n border: none;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: background 0.2s;\n min-height: 44px;\n}\n.atm-signin-btn[data-v-4139c6d0]:hover {\n opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-signin-btn[data-v-4139c6d0] {\n padding: 11px;\n font-size: 13px;\n min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-signin-btn[data-v-4139c6d0] {\n padding: 10px;\n font-size: 13px;\n min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-signin-btn[data-v-4139c6d0] {\n padding: 9px;\n font-size: 12px;\n min-height: 38px;\n}\n}\n\n.atm-signup-btn[data-v-959aa7ef] {\n padding: 12px;\n margin-top: 8px;\n background: var(--v1112fbaa);\n color: #FFF;\n border: none;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: background 0.2s;\n min-height: 44px;\n}\n.atm-signup-btn[data-v-959aa7ef]:hover {\n opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-signup-btn[data-v-959aa7ef] {\n padding: 11px;\n font-size: 13px;\n min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-signup-btn[data-v-959aa7ef] {\n padding: 10px;\n font-size: 13px;\n min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-signup-btn[data-v-959aa7ef] {\n padding: 9px;\n font-size: 12px;\n min-height: 38px;\n}\n}\n\n.atm-profile-container {\n position: relative;\n display: inline-block;\n font-family: 'Segoe UI', system-ui, sans-serif;\n}\n.atm-profile-button {\n display: flex;\n align-items: center;\n gap: 8px;\n background: none;\n border: none;\n cursor: pointer;\n padding: 8px 12px;\n border-radius: 6px;\n transition: background 0.2s;\n}\n.atm-profile-button:hover {\n background: #f0f0f0;\n}\n.atm-profile-avatar {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background-color: var(--v1982ae74);\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 12px;\n font-weight: 500;\n}\n.atm-profile-avatar.large {\n width: 48px;\n height: 48px;\n font-size: 16px;\n}\n.atm-profile-avatar-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 50%;\n}\n.atm-profile-name {\n font-size: 14px;\n color: #333;\n font-weight: 500;\n}\n.atm-profile-arrow {\n width: 16px;\n height: 16px;\n transition: transform 0.2s;\n}\n.atm-rotate {\n transform: rotate(180deg);\n}\n.atm-profile-menu {\n position: absolute;\n top: 100%;\n left: 0;\n width: 280px;\n background: white;\n border-radius: 8px;\n box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n z-index: 1000;\n overflow: hidden;\n margin-top: 4px;\n}\n.atm-profile-info {\n display: flex;\n gap: 12px;\n padding: 16px;\n border-bottom: 1px solid #f0f0f0;\n}\n.atm-profile-details {\n flex: 1;\n min-width: 0;\n}\n.atm-profile-fullname {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.atm-profile-email {\n margin: 4px 0 0;\n font-size: 13px;\n color: #666;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.atm-profile-options {\n padding: 8px 0;\n}\n.atm-profile-option {\n display: flex;\n align-items: center;\n width: 100%;\n padding: 10px 16px;\n background: none;\n border: none;\n text-align: left;\n cursor: pointer;\n font-size: 14px;\n color: #333;\n gap: 10px;\n transition: background 0.2s;\n}\n.atm-profile-option:hover {\n background: #f5f5f5;\n}\n.atm-profile-icon {\n width: 18px;\n height: 18px;\n color: #666;\n}\n.atm-fade-enter-active,\n.atm-fade-leave-active {\n transition: opacity 0.2s, transform 0.2s;\n}\n.atm-fade-enter-from,\n.atm-fade-leave-to {\n opacity: 0;\n transform: translateY(-10px);\n}\n.atm-profile-modal {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 9999;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow-y: auto;\n padding: 1.5rem;\n}\n.atm-profile-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.5);\n pointer-events: none;\n}\n.atm-profile-content {\n position: relative;\n width: 100%;\n max-width: 450px;\n background: white;\n border-radius: 12px;\n box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);\n z-index: 1;\n max-height: calc(100vh - 3rem);\n display: flex;\n flex-direction: column;\n margin: auto;\n}\n.atm-profile-header {\n padding: 16px;\n border-bottom: 1px solid #f0f0f0;\n display: flex;\n align-items: center;\n}\n.atm-profile-close {\n background: none;\n border: none;\n font-size: 24px;\n cursor: pointer;\n padding: 8px;\n margin-right: 12px;\n color: #666;\n}\n.atm-profile-title {\n margin: 0;\n font-size: 18px;\n font-weight: 600;\n color: #333;\n}\n.atm-profile-tabs {\n display: flex;\n border-bottom: 1px solid #f0f0f0;\n background: #f8f9fa;\n}\n.atm-tab {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n padding: 12px 16px;\n background: none;\n border: none;\n cursor: pointer;\n font-size: 14px;\n font-weight: 500;\n color: #666;\n transition: all 0.2s;\n}\n.atm-tab:hover {\n background: #e9ecef;\n}\n.atm-tab-active {\n color: var(--v1982ae74) !important;\n background: white;\n border-bottom: 2px solid var(--v1982ae74);\n}\n.atm-tab-icon {\n width: 16px;\n height: 16px;\n}\n.atm-profile-body {\n padding: 24px;\n text-align: center;\n overflow-y: auto;\n flex: 1;\n min-height: 0;\n}\n.atm-profile-avatar-large {\n width: 80px;\n height: 80px;\n border-radius: 50%;\n background-color: var(--v1982ae74);\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 24px;\n font-weight: 600;\n margin: 0 auto 20px;\n}\n.atm-profile-info-grid {\n width: 100%;\n text-align: left;\n margin-top: 20px;\n}\n.atm-profile-info-row {\n display: flex;\n flex-direction: column;\n margin-bottom: 16px;\n}\n.atm-profile-info-label {\n font-size: 13px;\n color: #666;\n margin-bottom: 4px;\n}\n.atm-profile-info-value {\n font-size: 16px;\n color: #333;\n font-weight: 500;\n}\n.atm-profile-edit-form {\n width: 100%;\n text-align: left;\n margin-top: 20px;\n}\n.atm-form-group {\n margin-bottom: 16px;\n}\n.atm-input-label {\n display: block;\n margin-bottom: 6px;\n font-size: 13px;\n color: #555;\n font-weight: 500;\n}\n.atm-input-field {\n width: 100%;\n padding: 10px 12px;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n box-sizing: border-box;\n transition: border-color 0.2s;\n}\n.atm-input-field:focus {\n outline: none;\n border-color: var(--v1982ae74);\n box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-form-actions {\n display: flex;\n gap: 12px;\n margin-top: 24px;\n}\n.atm-save-btn,\n.atm-edit-profile-btn,\n.atm-reset-password-btn,\n.atm-add-email-btn {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px;\n background: var(--v1982ae74);\n color: #FFF;\n border: none;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: opacity 0.2s;\n justify-content: center;\n}\n.atm-save-btn:hover,\n.atm-edit-profile-btn:hover,\n.atm-reset-password-btn:hover,\n.atm-add-email-btn:hover {\n opacity: 0.9;\n}\n.atm-cancel-btn {\n display: flex;\n align-items: center;\n gap: 8px;\n flex: 1;\n padding: 12px;\n background: #f8f9fa;\n color: #666;\n border: 1px solid #ddd;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s;\n justify-content: center;\n}\n.atm-cancel-btn:hover {\n background: #e9ecef;\n}\n.atm-btn-icon {\n width: 16px;\n height: 16px;\n}\n.atm-email-add-section {\n margin-bottom: 24px;\n text-align: left;\n}\n.atm-email-list {\n display: flex;\n flex-direction: column;\n gap: 12px;\n text-align: left;\n}\n.atm-email-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px;\n background: #f8f9fa;\n border-radius: 6px;\n border: 1px solid #e9ecef;\n}\n.atm-email-info {\n display: flex;\n flex-direction: column;\n gap: 8px;\n flex: 1;\n}\n.atm-email-address {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.atm-email-icon {\n width: 16px;\n height: 16px;\n color: var(--c7d31cfc);\n}\n.atm-email-badges {\n display: flex;\n gap: 6px;\n flex-wrap: wrap;\n}\n.atm-badge {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 2px 8px;\n font-size: 11px;\n font-weight: 500;\n border-radius: 12px;\n text-transform: uppercase;\n}\n.atm-badge-icon {\n width: 12px;\n height: 12px;\n}\n.atm-badge-primary {\n background: #e3f2fd;\n color: #1976d2;\n}\n.atm-badge-verified {\n background: #e8f5e8;\n color: #2e7d32;\n}\n.atm-badge-unverified {\n background: #fff3e0;\n color: #f57c00;\n}\n.atm-email-actions {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n.atm-verify-btn {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 6px 12px;\n background: var(--v1982ae74);\n color: white;\n border: none;\n border-radius: 4px;\n font-size: 12px;\n font-weight: 500;\n cursor: pointer;\n transition: opacity 0.2s;\n}\n.atm-verify-btn:hover {\n opacity: 0.9;\n}\n.atm-delete-btn {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 6px 12px;\n background: #dc3545;\n color: white;\n border: none;\n border-radius: 4px;\n font-size: 12px;\n font-weight: 500;\n cursor: pointer;\n transition: opacity 0.2s;\n}\n.atm-delete-btn:hover {\n opacity: 0.9;\n}\n.atm-password-section {\n text-align: left;\n}\n.atm-sessions-section {\n text-align: left;\n}\n.atm-sessions-info {\n margin-bottom: 20px;\n}\n.atm-sessions-description {\n margin: 0;\n font-size: 14px;\n color: #666;\n line-height: 1.5;\n}\n.atm-sessions-list {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n.atm-session-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n border: 1px solid #e9ecef;\n gap: 16px;\n}\n.atm-session-header {\n display: flex;\n gap: 12px;\n align-items: flex-start;\n}\n.atm-session-icon {\n width: 24px;\n height: 24px;\n color: var(--c7d31cfc);\n flex-shrink: 0;\n}\n.atm-session-details {\n flex: 1;\n min-width: 0;\n}\n.atm-session-title {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-bottom: 4px;\n font-size: 15px;\n font-weight: 600;\n color: #333;\n}\n.atm-session-device-info {\n font-size: 13px;\n color: #666;\n margin-bottom: 8px;\n}\n.atm-badge-current {\n background: #d1f4e0;\n color: #0f9d58;\n}\n.atm-session-timestamps {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n.atm-session-timestamp {\n display: flex;\n gap: 6px;\n font-size: 13px;\n color: #666;\n}\n.atm-timestamp-label {\n font-weight: 500;\n color: #555;\n}\n.atm-session-actions {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.atm-close-session-btn {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 14px;\n background: #dc3545;\n color: white;\n border: none;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n transition: opacity 0.2s;\n white-space: nowrap;\n}\n.atm-close-session-btn:hover {\n opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-profile-button {\n padding: 6px 10px;\n gap: 6px;\n}\n.atm-profile-name {\n font-size: 13px;\n}\n.atm-profile-menu {\n width: 260px;\n}\n.atm-profile-modal {\n padding: 1rem;\n}\n.atm-profile-content {\n max-width: 90%;\n max-height: calc(100vh - 2rem);\n}\n.atm-profile-header {\n padding: 14px;\n}\n.atm-profile-title {\n font-size: 16px;\n}\n.atm-profile-body {\n padding: 20px;\n}\n.atm-tab {\n padding: 10px 12px;\n font-size: 13px;\n gap: 4px;\n}\n.atm-tab-icon {\n width: 14px;\n height: 14px;\n}\n.atm-profile-avatar-large {\n width: 70px;\n height: 70px;\n font-size: 22px;\n}\n.atm-email-item {\n flex-direction: column;\n gap: 12px;\n align-items: flex-start;\n}\n.atm-email-actions {\n flex-direction: row;\n width: 100%;\n}\n.atm-verify-btn,\n .atm-delete-btn {\n flex: 1;\n justify-content: center;\n}\n.atm-session-item {\n flex-direction: column;\n align-items: flex-start;\n}\n.atm-session-actions {\n width: 100%;\n}\n.atm-close-session-btn {\n width: 100%;\n justify-content: center;\n}\n}\n@media (max-width: 480px) {\n.atm-profile-button {\n padding: 4px 8px;\n gap: 4px;\n}\n.atm-profile-avatar {\n width: 28px;\n height: 28px;\n font-size: 11px;\n}\n.atm-profile-avatar.large {\n width: 40px;\n height: 40px;\n font-size: 14px;\n}\n.atm-profile-name {\n font-size: 12px;\n}\n.atm-profile-arrow {\n width: 14px;\n height: 14px;\n}\n.atm-profile-menu {\n width: calc(100vw - 20px);\n max-width: 240px;\n}\n.atm-profile-info {\n padding: 12px;\n gap: 10px;\n}\n.atm-profile-fullname {\n font-size: 13px;\n}\n.atm-profile-email {\n font-size: 12px;\n}\n.atm-profile-option {\n padding: 8px 12px;\n font-size: 13px;\n gap: 8px;\n}\n.atm-profile-icon {\n width: 16px;\n height: 16px;\n}\n.atm-profile-modal {\n padding: 0.5rem;\n}\n.atm-profile-content {\n max-width: 95%;\n max-height: calc(100vh - 1rem);\n}\n.atm-profile-header {\n padding: 12px;\n}\n.atm-profile-close {\n font-size: 20px;\n padding: 4px;\n margin-right: 8px;\n}\n.atm-profile-title {\n font-size: 15px;\n}\n.atm-profile-body {\n padding: 16px;\n}\n.atm-tab {\n padding: 8px 8px;\n font-size: 12px;\n gap: 3px;\n}\n.atm-tab-icon {\n width: 13px;\n height: 13px;\n}\n.atm-profile-avatar-large {\n width: 60px;\n height: 60px;\n font-size: 20px;\n margin-bottom: 16px;\n}\n.atm-profile-info-label {\n font-size: 12px;\n}\n.atm-profile-info-value {\n font-size: 14px;\n}\n.atm-input-label {\n font-size: 12px;\n}\n.atm-input-field {\n padding: 8px 10px;\n font-size: 13px;\n}\n.atm-form-actions {\n flex-direction: column;\n gap: 8px;\n}\n.atm-save-btn,\n .atm-cancel-btn,\n .atm-edit-profile-btn,\n .atm-reset-password-btn {\n width: 100%;\n padding: 10px;\n font-size: 13px;\n}\n.atm-email-item {\n padding: 10px;\n}\n.atm-email-address {\n font-size: 13px;\n}\n.atm-badge {\n font-size: 10px;\n padding: 2px 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-profile-button {\n padding: 4px 6px;\n}\n.atm-profile-avatar {\n width: 26px;\n height: 26px;\n font-size: 10px;\n}\n.atm-profile-name {\n display: none;\n}\n.atm-profile-menu {\n width: calc(100vw - 16px);\n max-width: 220px;\n}\n.atm-profile-modal {\n padding: 0.25rem;\n}\n.atm-profile-content {\n max-width: 98%;\n max-height: calc(100vh - 0.5rem);\n}\n.atm-profile-body {\n padding: 12px;\n}\n.atm-tab {\n padding: 8px 6px;\n font-size: 11px;\n flex-direction: column;\n gap: 2px;\n}\n.atm-profile-avatar-large {\n width: 50px;\n height: 50px;\n font-size: 18px;\n}\n.atm-email-item {\n padding: 8px;\n}\n}\n\n.atm-auth-buttons[data-v-0c63ecb8] {\n display: flex;\n flex-wrap: wrap;\n gap: 16px;\n}\n@media (max-width: 768px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n gap: 14px;\n}\n}\n@media (max-width: 480px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n gap: 12px;\n flex-direction: column;\n}\n}\n@media (max-width: 360px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n gap: 10px;\n}\n}\n\n.atm-logout-btn[data-v-7157f989] {\n padding: 12px;\n margin-top: 8px;\n background: var(--v2ec0f896);\n color: #FFF;\n border: none;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: opacity 0.2s;\n min-height: 44px;\n}\n.atm-logout-btn[data-v-7157f989]:hover {\n opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-logout-btn[data-v-7157f989] {\n padding: 11px;\n font-size: 13px;\n min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-logout-btn[data-v-7157f989] {\n padding: 10px;\n font-size: 13px;\n min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-logout-btn[data-v-7157f989] {\n padding: 9px;\n font-size: 12px;\n min-height: 38px;\n}\n}\n";
6
+ document.head.appendChild(style);
7
+ }
8
+ })();
9
+ "use strict";
2
10
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
11
  const vue = require("vue");
4
12
  const UniversalCookie = require("universal-cookie");
@@ -245,15 +253,19 @@ const _hoisted_27$2 = { class: "atm-footer-links" };
245
253
  const _hoisted_28$1 = { class: "atm-signup-text" };
246
254
  const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
247
255
  __name: "SignIn",
256
+ props: {
257
+ redirect: {}
258
+ },
248
259
  emits: [
249
260
  "completed",
250
261
  "sign-up"
251
262
  ],
252
263
  setup(__props, { emit: __emit }) {
253
264
  vue.useCssVars((_ctx) => ({
254
- "e2d4c99e": atmPrimaryColor.value,
255
- "v182122ff": atmSecondaryColor.value
265
+ "v18341448": atmPrimaryColor.value,
266
+ "v97f49b54": atmSecondaryColor.value
256
267
  }));
268
+ const props = __props;
257
269
  const emit = __emit;
258
270
  const showNotification = vue.inject("showNotification");
259
271
  const form = vue.ref({
@@ -424,6 +436,15 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
424
436
  showNotification?.("Login realizado com sucesso!", "success");
425
437
  setTimeout(() => {
426
438
  emit("completed");
439
+ if (props.redirect) {
440
+ const instance = vue.getCurrentInstance();
441
+ const router = instance?.appContext.config.globalProperties.$router;
442
+ if (router) {
443
+ router.push(props.redirect);
444
+ } else {
445
+ window.location.href = props.redirect;
446
+ }
447
+ }
427
448
  }, 1e3);
428
449
  } catch (error) {
429
450
  showNotification?.(error.message || "Erro ao finalizar autenticação");
@@ -612,7 +633,7 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
612
633
  };
613
634
  }
614
635
  });
615
- const SignIn = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-69af412a"]]);
636
+ const SignIn = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-305a11b6"]]);
616
637
  const _hoisted_1$6 = {
617
638
  key: 0,
618
639
  class: "atm-notification-container"
@@ -704,12 +725,16 @@ const _hoisted_26$1 = { class: "atm-footer-links" };
704
725
  const _hoisted_27$1 = { class: "atm-login-text" };
705
726
  const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
706
727
  __name: "SignUp",
728
+ props: {
729
+ redirect: {}
730
+ },
707
731
  emits: ["completed", "sign-in"],
708
732
  setup(__props, { emit: __emit }) {
709
733
  vue.useCssVars((_ctx) => ({
710
- "v8c008960": atmPrimaryColor.value,
711
- "v1183b75e": atmSecondaryColor.value
734
+ "v1ca6007a": atmPrimaryColor.value,
735
+ "v12f1ab11": atmSecondaryColor.value
712
736
  }));
737
+ const props = __props;
713
738
  const emit = __emit;
714
739
  const { configurations } = useAtm();
715
740
  const form = vue.ref({
@@ -851,6 +876,15 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
851
876
  showNotification("Login realizado com sucesso!", "success");
852
877
  setTimeout(() => {
853
878
  emit("completed");
879
+ if (props.redirect) {
880
+ const instance = vue.getCurrentInstance();
881
+ const router = instance?.appContext.config.globalProperties.$router;
882
+ if (router) {
883
+ router.push(props.redirect);
884
+ } else {
885
+ window.location.href = props.redirect;
886
+ }
887
+ }
854
888
  }, 1e3);
855
889
  } catch (error) {
856
890
  if (error.errors && typeof error.errors === "object") {
@@ -994,7 +1028,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
994
1028
  };
995
1029
  }
996
1030
  });
997
- const SignUp = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-de716df2"]]);
1031
+ const SignUp = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-e15f7da9"]]);
998
1032
  const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
999
1033
  __name: "SignInModal",
1000
1034
  emits: [
@@ -2256,8 +2290,10 @@ const atmPlugin = {
2256
2290
  }
2257
2291
  };
2258
2292
  exports.AuthSwitcher = AuthSwitcher;
2293
+ exports.SignIn = SignIn;
2259
2294
  exports.SignInButton = SignInButton;
2260
2295
  exports.SignOutButton = SignOutButton;
2296
+ exports.SignUp = SignUp;
2261
2297
  exports.SignUpButton = SignUpButton;
2262
2298
  exports.SignedIn = _sfc_main$1;
2263
2299
  exports.SignedOut = _sfc_main;