.auth-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px}.auth-modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.auth-modal-content{position:relative;width:100%;max-width:420px;max-height:90vh;background:var(--bg-secondary, #ffffff);border-radius:16px;box-shadow:0 25px 50px -12px #00000040;padding:32px;animation:authModalSlideIn .3s ease-out;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}.auth-modal-content::-webkit-scrollbar{display:none}@keyframes authModalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.auth-modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border:none;background:var(--bg-tertiary, #f3f4f6);color:var(--text-secondary, #6b7280);border-radius:8px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.auth-modal-close:hover{background:var(--bg-tertiary, #e5e7eb);color:var(--text-primary, #111827)}.auth-modal-close:focus,.auth-modal-close:active{outline:none;transform:none;box-shadow:none}.auth-modal-header{text-align:center;margin-bottom:28px}.auth-modal-header h2{font-size:24px;font-weight:700;color:var(--text-primary, #111827);margin:0 0 8px}.auth-modal-header p{font-size:14px;color:var(--text-secondary, #6b7280);margin:0}.auth-form{display:flex;flex-direction:column;gap:16px}.auth-form .form-group{display:flex;flex-direction:column;gap:6px}.auth-form label{font-size:13px;font-weight:600;color:var(--text-primary, #374151)}.auth-form input[type=email],.auth-form input[type=password],.auth-form input[type=text]{width:100%;padding:12px 14px;font-size:14px;border:1px solid var(--border-color, #e5e7eb);border-radius:8px;background:var(--bg-primary, #ffffff);color:var(--text-primary, #111827);transition:all .2s}.auth-form input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #8d203226}.auth-form input::-moz-placeholder{color:var(--text-tertiary, #9ca3af)}.auth-form input::placeholder{color:var(--text-tertiary, #9ca3af)}.password-input-wrapper{position:relative;display:flex;align-items:center}.password-input-wrapper input{padding-right:40px!important}.password-toggle-btn{position:absolute;right:10px;background:none;border:none;color:var(--text-tertiary, #9ca3af);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:color .2s;outline:none}.password-toggle-btn:hover{color:var(--text-primary, #374151);background:#0000000d}.password-toggle-btn:focus,.password-toggle-btn:active{outline:none;transform:none;box-shadow:none}.role-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:4px}.role-option{cursor:pointer}.role-option input[type=radio]{position:absolute;opacity:0;pointer-events:none}.role-card{display:flex;flex-direction:column;align-items:center;padding:10px 8px;border:2px solid var(--border-color, #e5e7eb);border-radius:10px;background:var(--bg-primary, #ffffff);transition:all .2s;height:100%}.role-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;margin-bottom:6px;color:var(--text-tertiary, #9ca3af);transition:all .2s}.role-icon svg{width:24px;height:24px}.role-name{font-size:13px;font-weight:600;color:var(--text-primary, #111827);margin-bottom:2px}.role-desc{font-size:10px;color:var(--text-secondary, #6b7280);text-align:center;line-height:1.2}.role-option input:checked+.role-card{border-color:var(--accent);background:#8d20320d}.role-option:hover .role-card{border-color:var(--accent)}.role-option:focus .role-card,.role-option:active .role-card{outline:none;transform:none}.role-card:focus,.role-card:active{outline:none;transform:none}.auth-error{padding:12px 14px;background:#ef44441a;border:1px solid var(--danger);border-radius:8px;color:var(--danger);font-size:13px;font-weight:500}.auth-success{padding:12px 14px;background:#2f8f6a1a;border:1px solid var(--success);border-radius:8px;color:var(--success);font-size:13px;font-weight:500}[data-theme=dark] .auth-modal-backdrop{background:#000000bf}[data-theme=dark] .auth-modal-content{background:#1a1a1a;border:1px solid hsl(0,0%,20%);box-shadow:0 25px 50px -12px #00000080}[data-theme=dark] .auth-modal-close{background:#262626;color:#b3b3b3}[data-theme=dark] .auth-modal-close:hover{background:#333;color:#f2f2f2}[data-theme=dark] .auth-modal-header h2{color:#f2f2f2}[data-theme=dark] .auth-modal-header p{color:#b3b3b3}[data-theme=dark] .auth-form label{color:#f2f2f2}[data-theme=dark] .auth-form input[type=email],[data-theme=dark] .auth-form input[type=password],[data-theme=dark] .auth-form input[type=text]{background:#0d0d0d;color:#f2f2f2;border-color:#333}[data-theme=dark] .auth-form input::-moz-placeholder{color:#737373}[data-theme=dark] .auth-form input::placeholder{color:#737373}[data-theme=dark] .auth-form input:focus{border-color:#bb2a43;box-shadow:0 0 0 3px #bb2a4333}[data-theme=dark] .password-toggle-btn{color:#8c8c8c}[data-theme=dark] .password-toggle-btn:hover{color:#f2f2f2;background:#ffffff0d}[data-theme=dark] .role-card{background:#0d0d0d;border-color:#333}[data-theme=dark] .role-name{color:#f2f2f2}[data-theme=dark] .role-desc{color:#b3b3b3}[data-theme=dark] .role-icon{color:#8c8c8c}[data-theme=dark] .role-option input:checked+.role-card{border-color:#bb2a43;background:#bb2a431a}[data-theme=dark] .auth-switch{border-top-color:#333;color:#b3b3b3}[data-theme=dark] .remember-me-label{color:#f2f2f2}[data-theme=dark] .checkmark-box{background:#0d0d0d;border-color:#4d4d4d}[data-theme=dark] .user-menu-btn{background:#262626;border-color:#333}[data-theme=dark] .user-menu-btn:hover{background:#333}[data-theme=dark] .user-email{color:#f2f2f2}[data-theme=dark] .user-role{color:#a6a6a6}[data-theme=dark] .user-dropdown{background:#1a1a1a;border-color:#333;box-shadow:0 10px 25px -5px #0006}[data-theme=dark] .dropdown-item{color:#f2f2f2}[data-theme=dark] .dropdown-item:hover{background:#262626}[data-theme=dark] .dropdown-divider{background:#333}[data-theme=dark] .auth-error{background:#dc262626;border-color:#dc26264d}[data-theme=dark] .auth-success{background:#16a34a26;border-color:#16a34a4d}.auth-submit{width:100%;padding:14px 20px;font-size:15px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:none!important;background:var(--accent, hsl(350, 63%, 34%));color:var(--accent-foreground, #ffffff)}.auth-submit:hover{background:var(--accent-hover, hsl(350, 63%, 28%))}.auth-submit:focus,.auth-submit:active{outline:none;transform:none;box-shadow:none!important}[data-theme=dark] .auth-submit{background:#bb2a43;color:#fff}[data-theme=dark] .auth-submit:hover{background:#d5445c}[data-theme=dark] .auth-submit:focus,[data-theme=dark] .auth-submit:active{outline:none;transform:none;box-shadow:none!important}.auth-submit:disabled{opacity:.7;cursor:not-allowed}.btn-loading{display:inline-flex;align-items:center;gap:8px}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.auth-link{text-align:center}.auth-link a{font-size:13px;color:var(--accent);text-decoration:none;font-weight:500}.auth-link a:hover{text-decoration:underline}.auth-link a:focus,.auth-link a:active{outline:none;transform:none}.auth-switch{margin-top:24px;padding-top:20px;border-top:1px solid var(--border-color, #e5e7eb);text-align:center;font-size:14px;color:var(--text-secondary, #6b7280)}.auth-switch a{color:var(--accent);text-decoration:none;font-weight:600;margin-left:4px}.auth-switch a:hover{text-decoration:underline}.auth-switch a:focus,.auth-switch a:active{outline:none;transform:none}.header-auth{display:flex;align-items:center;gap:10px;opacity:0;transition:opacity .25s ease}.header-auth.auth-ready{opacity:1}.btn-sm{padding:8px 16px!important;font-size:13px!important}.user-menu{position:relative}.user-menu-btn{display:flex;align-items:center;gap:10px;padding:6px 12px 6px 6px;background:var(--bg-tertiary, #f3f4f6);border:1px solid var(--border-color, #e5e7eb);border-radius:40px;cursor:pointer;transition:all .2s}.user-menu-btn:hover{background:var(--bg-tertiary, #e5e7eb)}.user-menu-btn:focus,.user-menu-btn:active{outline:none;transform:none;box-shadow:none}.user-avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center}[data-theme=dark] .user-avatar{color:var(--bg-hero)}.user-info{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2}.user-email{font-size:13px;font-weight:600;color:var(--text-primary, #111827);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-role{font-size:11px;color:var(--text-secondary, #6b7280)}.chevron{color:var(--text-secondary, #6b7280)}.user-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:180px;background:var(--bg-secondary, #ffffff);border:1px solid var(--border-color, #e5e7eb);border-radius:10px;box-shadow:0 10px 25px -5px #0000001a;padding:6px;z-index:1000}.dropdown-item{display:block;padding:10px 12px;font-size:13px;font-weight:500;color:var(--text-primary, #374151);text-decoration:none;border-radius:6px;transition:all .15s}.dropdown-item:hover{background:var(--bg-tertiary, #f3f4f6)}.dropdown-item:focus,.dropdown-item:active{outline:none;transform:none;box-shadow:none}.dropdown-divider{height:1px;background:var(--border-color, #e5e7eb);border:none;margin:6px 0}@media(max-width:480px){.auth-modal-content{padding:24px;margin:16px;max-width:calc(100% - 32px)}.role-selector{grid-template-columns:1fr}.role-card{flex-direction:row;text-align:left;gap:12px}.role-icon{font-size:24px;margin-bottom:0}.user-info{display:none}.user-menu-btn{padding:4px}}.remember-me-group{display:flex;align-items:left;justify-content:flex-start;padding:8px 0}.remember-me-label{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;color:var(--text-primary, #374151);-webkit-user-select:none;-moz-user-select:none;user-select:none}.remember-me-label input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}.checkmark-box{width:18px;height:18px;border:2px solid var(--border-color, #d1d5db);border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s;background:var(--bg-primary, #ffffff)}.remember-me-label input[type=checkbox]:checked+.checkmark-box{background:var(--accent);border-color:var(--accent)}.remember-me-label input[type=checkbox]:checked+.checkmark-box:after{content:"";width:5px;height:9px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg);margin-bottom:2px}.remember-me-label:hover .checkmark-box{border-color:var(--accent)}.remember-me-label:focus,.remember-me-label:active{outline:none;transform:none}.checkmark-box:focus,.checkmark-box:active{outline:none;transform:none}.remember-me-text{font-weight:500}.google-signin-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;border:1px solid var(--border-color, #ddd);border-radius:8px;background:var(--bg-primary, #ffffff);color:var(--text-primary, #333);cursor:pointer;font-size:14px;font-weight:500;transition:background .2s,border-color .2s}.google-signin-btn:hover{background:var(--bg-tertiary, #f9fafb);border-color:var(--border-color-strong, #ccc)}.google-signin-btn:active,.google-signin-btn:focus{outline:none;transform:none;box-shadow:none}.google-signin-btn svg{flex-shrink:0}[data-theme=dark] .google-signin-btn{background:#1f1f1f;color:#e6e6e6;border-color:#404040}[data-theme=dark] .google-signin-btn:hover{background:#2e2e2e;border-color:#595959}.auth-modal .btn,.auth-modal .btn-primary,.auth-modal .btn-secondary,.auth-modal [class*=btn-]{overflow:hidden;transform:none!important}.auth-modal .btn:before,.auth-modal .btn:after,.auth-modal .btn-primary:before,.auth-modal .btn-primary:after,.auth-modal .btn-secondary:before,.auth-modal .btn-secondary:after,.auth-modal [class*=btn-]:before,.auth-modal [class*=btn-]:after{display:none!important;content:none!important}.auth-modal .btn:hover,.auth-modal .btn-primary:hover,.auth-modal .btn-secondary:hover,.auth-modal [class*=btn-]:hover{transform:none!important;box-shadow:none!important}.auth-modal .btn:active,.auth-modal .btn:focus,.auth-modal .btn-primary:active,.auth-modal .btn-primary:focus,.auth-modal .btn-secondary:active,.auth-modal .btn-secondary:focus,.auth-modal [class*=btn-]:active,.auth-modal [class*=btn-]:focus{transform:none!important;box-shadow:none!important}.auth-modal button,.auth-modal a,.auth-modal [role=button],.auth-modal [type=button],.auth-modal [type=submit]{outline:none}.auth-modal button:focus,.auth-modal button:active,.auth-modal a:focus,.auth-modal a:active,.auth-modal [role=button]:focus,.auth-modal [role=button]:active,.auth-modal [type=button]:focus,.auth-modal [type=button]:active,.auth-modal [type=submit]:focus,.auth-modal [type=submit]:active{transform:none!important;box-shadow:none!important;outline:none!important}
