.comfy-user-selection { width: 100vw; height: 100vh; position: absolute; top: 0; left: 0; z-index: 999; display: flex; align-items: center; justify-content: center; font-family: sans-serif; background: linear-gradient(var(--tr-even-bg-color), var(--tr-odd-bg-color)); } .comfy-user-selection-inner { background: var(--comfy-menu-bg); margin-top: -30vh; padding: 20px 40px; border-radius: 10px; min-width: 365px; position: relative; box-shadow: 0 0 20px rgba(0, 0, 0, 0.3); } .comfy-user-selection-inner form { width: 100%; display: flex; flex-direction: column; align-items: center; } .comfy-user-selection-inner h1 { margin: 10px 0 30px 0; font-weight: normal; } .comfy-user-selection-inner label { display: flex; flex-direction: column; width: 100%; } .comfy-user-selection input, .comfy-user-selection select { background-color: var(--comfy-input-bg); color: var(--input-text); border: 0; border-radius: 5px; padding: 5px; margin-top: 10px; } .comfy-user-selection input::placeholder { color: var(--descrip-text); opacity: 1; } .comfy-user-existing { width: 100%; } .no-users .comfy-user-existing { display: none; } .comfy-user-selection-inner .or-separator { margin: 10px 0; padding: 10px; display: block; text-align: center; width: 100%; color: var(--descrip-text); } .comfy-user-selection-inner .or-separator { overflow: hidden; text-align: center; margin-left: -10px; } .comfy-user-selection-inner .or-separator::before, .comfy-user-selection-inner .or-separator::after { content: ""; background-color: var(--border-color); position: relative; height: 1px; vertical-align: middle; display: inline-block; width: calc(50% - 20px); top: -1px; } .comfy-user-selection-inner .or-separator::before { right: 10px; margin-left: -50%; } .comfy-user-selection-inner .or-separator::after { left: 10px; margin-right: -50%; } .comfy-user-selection-inner section { width: 100%; padding: 10px; margin: -10px; transition: background-color 0.2s; } .comfy-user-selection-inner section.selected { background: var(--border-color); border-radius: 5px; } .comfy-user-selection-inner footer { display: flex; flex-direction: column; align-items: center; margin-top: 20px; } .comfy-user-selection-inner .comfy-user-error { color: var(--error-text); margin-bottom: 10px; } .comfy-user-button-next { font-size: 16px; padding: 6px 10px; width: 100px; display: flex; gap: 5px; align-items: center; justify-content: center; }