#notification-container{position:fixed;top:1rem;right:1rem;z-index:9999;pointer-events:none}.notification-toast{background:var(--card);border-radius:.5rem;box-shadow:0 10px 25px color-mix(in oklch,var(--foreground) 10%,transparent),0 4px 6px color-mix(in oklch,var(--foreground) 5%,transparent);border:1px solid var(--border);max-width:400px;margin-bottom:.5rem;pointer-events:auto;transform:translate(100%);animation:slideIn .3s ease-out forwards;overflow:hidden}.notification-toast:hover{box-shadow:0 20px 35px color-mix(in oklch,var(--foreground) 15%,transparent),0 8px 10px color-mix(in oklch,var(--foreground) 10%,transparent)}.notification-toast.system_alert{border-left:4px solid var(--warning)}.notification-toast.lead_overdue{border-left:4px solid var(--destructive)}.notification-toast.customer_product_confirmed{border-left:4px solid var(--success)}.notification-toast.team_event,.notification-toast.project_update{border-left:4px solid var(--primary)}.notification-content{padding:1rem}.notification-header{display:flex;justify-content:between;align-items:flex-start;margin-bottom:.5rem}.notification-header strong{color:var(--foreground);font-weight:600;font-size:.875rem;line-height:1.25rem;flex:1;margin-right:.5rem}.notification-close{background:none;border:none;color:var(--muted-foreground);cursor:pointer;font-size:1.25rem;line-height:1;padding:0;width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;border-radius:.25rem;flex-shrink:0}.notification-close:hover{background-color:var(--muted);color:var(--foreground)}.notification-body{color:var(--muted-foreground);font-size:.875rem;line-height:1.5}.notification-badge{position:absolute;top:-.5rem;right:-.5rem;background-color:var(--destructive);color:var(--destructive-foreground);font-size:.75rem;font-weight:600;border-radius:50%;width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center;border:2px solid var(--card)}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOut{0%{transform:translate(0);opacity:1}to{transform:translate(100%);opacity:0}}.notification-toast.removing{animation:slideOut .3s ease-in forwards}@media(max-width:640px){#notification-container{left:1rem;right:1rem;top:1rem}.notification-toast{max-width:none;width:100%}}.sound-indicator{position:fixed;bottom:1rem;right:1rem;background:color-mix(in oklch,var(--foreground) 80%,transparent);color:var(--primary-foreground);padding:.5rem 1rem;border-radius:2rem;font-size:.875rem;z-index:9998;opacity:0;transform:translateY(1rem);transition:all .3s ease}.sound-indicator.show{opacity:1;transform:translateY(0)}.permission-prompt{position:fixed;top:0;left:0;right:0;background:var(--primary);color:var(--primary-foreground);padding:1rem;text-align:center;z-index:9999;transform:translateY(-100%);transition:transform .3s ease}.permission-prompt.show{transform:translateY(0)}.permission-prompt button{background:color-mix(in oklch,var(--primary-foreground) 20%,transparent);border:1px solid color-mix(in oklch,var(--primary-foreground) 30%,transparent);color:var(--primary-foreground);padding:.5rem 1rem;border-radius:.25rem;margin:0 .25rem;cursor:pointer;transition:all .2s ease}.permission-prompt button:hover{background:color-mix(in oklch,var(--primary-foreground) 30%,transparent);border-color:color-mix(in oklch,var(--primary-foreground) 50%,transparent)}.permission-prompt .primary{background:color-mix(in oklch,var(--primary-foreground) 90%,transparent);color:var(--primary);font-weight:600}.permission-prompt .primary:hover{background:var(--card)}
