.auth-providers[data-v-9d0ee2f9] { border-left: 1px solid var(--p-content-border-color); background: var(--p-content-hover-background); min-width: 0; font-size: inherit; flex-direction: column; padding: 32px; display: flex; } .provider-panel[data-v-9d0ee2f9] { text-align: center; flex-direction: column; flex: 1; min-height: 330px; padding: 16px 0 28px; } .provider-panel[data-v-9d0ee2f9], .provider-qr-placeholder[data-v-9d0ee2f9] { justify-content: center; align-items: center; display: flex; } .provider-qr-placeholder[data-v-9d0ee2f9] { border: 2px dashed var(--p-content-border-color); background: var(--p-content-background); width: 176px; height: 176px; color: var(--p-text-muted-color); border-radius: 12px; margin-bottom: 20px; } .provider-qr-placeholder .pi[data-v-9d0ee2f9] { font-size: 48px; } .provider-heading[data-v-9d0ee2f9] { color: var(--p-text-color); margin: 0; font-size: 1em; font-weight: 600; } .provider-description[data-v-9d0ee2f9] { color: var(--p-text-muted-color); margin: 8px 0 0; font-size: 1em; line-height: 1.6; } .provider-tabs[data-v-9d0ee2f9] { background: color-mix( in srgb, var(--p-text-color) 6%, var(--p-content-background) ); border-radius: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 4px; display: grid; position: relative; } .provider-tab-indicator[data-v-9d0ee2f9] { background: var(--p-content-background); pointer-events: none; border-radius: 7px; width: calc(50% - 4px); transition: transform 0.2s; position: absolute; top: 4px; bottom: 4px; left: 4px; box-shadow: 0 1px 3px #00000014; } .provider-tabs button[data-v-9d0ee2f9] { min-height: 44px; color: var(--p-text-muted-color); font: inherit; cursor: pointer; background: 0 0; border: 0; border-radius: 7px; padding: 8px; font-weight: 500; position: relative; } .provider-tabs button.active[data-v-9d0ee2f9] { color: var(--p-text-color); } .provider-tabs button[data-v-9d0ee2f9]:disabled { opacity: 0.45; cursor: not-allowed; } .provider-tabs button[data-v-9d0ee2f9]:focus-visible { outline: 2px solid var(--p-primary-color); outline-offset: -2px; } .provider-config-error[data-v-9d0ee2f9] { margin-top: 16px; } .login-qr[data-v-9d0ee2f9] .p-button { min-height: 44px; font-size: 1em; } @media (width<=760px) { .auth-providers[data-v-9d0ee2f9] { border-left: 0; border-top: 1px solid var(--p-content-border-color); padding: 24px; } .provider-panel[data-v-9d0ee2f9] { min-height: 300px; padding-top: 0; } .provider-qr-placeholder[data-v-9d0ee2f9] { width: 152px; height: 152px; } } @media (prefers-reduced-motion: reduce) { .provider-tab-indicator[data-v-9d0ee2f9] { transition: none; } } .login-qr[data-v-9d0ee2f9] { grid-template-rows: 200px 64px 44px; justify-items: center; gap: 8px; width: 100%; padding: 12px 0; font-size: 1em; display: grid; } .qr-stage[data-v-9d0ee2f9] { justify-content: center; height: 200px; display: flex; } .qr-stage[data-v-9d0ee2f9], .qr-status[data-v-9d0ee2f9] { width: 100%; min-height: 0; } .qr-status[data-v-9d0ee2f9] { align-items: center; display: grid; overflow: auto; } .qr-status[data-v-9d0ee2f9] .p-message { margin: 0; } .qr-actions[data-v-9d0ee2f9] { height: 44px; } .qr-request[data-v-9d0ee2f9] { flex-direction: column; gap: 12px; width: 100%; height: 100%; display: flex; } .qr-request[data-v-9d0ee2f9] .p-button-icon { font-size: 32px; } .qr-box[data-v-9d0ee2f9] { border: 1px solid var(--p-content-border-color); background: var(--p-content-background); border-radius: 12px; justify-content: center; align-items: center; width: 200px; height: 200px; display: flex; overflow: hidden; } .qr-box-idle[data-v-9d0ee2f9] { background: 0 0; border-style: dashed; } .qr-img[data-v-9d0ee2f9] { -o-object-fit: contain; object-fit: contain; width: 100%; height: 100%; } .qr-img-dim[data-v-9d0ee2f9] { opacity: 0.35; } .qr-tip[data-v-9d0ee2f9] { color: var(--p-text-color); margin: 0; } .qr-clients[data-v-9d0ee2f9] { flex-direction: column; gap: 12px; width: 100%; max-height: 200px; overflow-y: auto; } .qr-client[data-v-9d0ee2f9], .qr-clients[data-v-9d0ee2f9] { align-items: center; display: flex; } .qr-client[data-v-9d0ee2f9] { cursor: pointer; gap: 8px; } .qr-client.disabled[data-v-9d0ee2f9] { opacity: 0.5; cursor: not-allowed; } .qr-client-btn[data-v-9d0ee2f9] { margin-top: 4px; }