.notifications-page{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;position:relative;overflow-x:hidden}.notifications-page:before{content:"";pointer-events:none;background:radial-gradient(circle at 25% 75%,#6366f133 0%,#0000 50%),radial-gradient(circle at 75% 25%,#a855f733 0%,#0000 50%);position:absolute;inset:0}.notifications-layout{z-index:1;position:relative}.notifications-page .bg-white,.notifications-page [class*=dark\:bg-gray-800]{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;transition:all .3s}.dark .notifications-page .bg-white,.dark .notifications-page [class*=dark\:bg-gray-800]{background:#1f2937f2}.notifications-page .bg-white:hover,.notifications-page [class*=dark\:bg-gray-800]:hover{transform:translateY(-1px);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.notifications-page .peer:checked+div{background-color:#2563eb}.notifications-page .peer:focus+div{box-shadow:0 0 0 3px #2563eb1a}.notifications-page .peer+div,.notifications-page .peer+div:after{transition:all .3s}.notifications-page button{transition:all .3s;position:relative;overflow:hidden}.notifications-page button:before{content:"";background:#fff3;border-radius:50%;width:0;height:0;transition:width .3s,height .3s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.notifications-page button:active:before{width:300px;height:300px}.notifications-page button:disabled{cursor:not-allowed;opacity:.6}.notifications-page .test-button{transition:all .2s;transform:translateY(0)}.notifications-page .test-button:hover{transform:translateY(-2px);box-shadow:0 8px 15px #0003}.notifications-page .test-button:active{transform:translateY(0)}.permission-status{position:relative}.permission-status:before{content:"";opacity:0;background:linear-gradient(45deg,#0000,#22c55e4d,#0000);border-radius:50%;animation:2s linear infinite rotate;position:absolute;inset:-2px}.permission-status.granted:before{opacity:1;background:linear-gradient(45deg,#0000,#22c55e4d,#0000)}.permission-status.denied:before{opacity:1;background:linear-gradient(45deg,#0000,#ef44444d,#0000)}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-shimmer{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%) 0 0/200% 100%;animation:1.5s infinite shimmer}.dark .loading-shimmer{background:linear-gradient(90deg,#374151 25%,#4b5563 50%,#374151 75%) 0 0/200% 100%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.notification-success{background:linear-gradient(135deg,#10b9811a 0%,#0000 100%);border-left:4px solid #10b981}.notification-error{background:linear-gradient(135deg,#ef44441a 0%,#0000 100%);border-left:4px solid #ef4444}.notification-info{background:linear-gradient(135deg,#3b82f61a 0%,#0000 100%);border-left:4px solid #3b82f6}.notification-warning{background:linear-gradient(135deg,#f59e0b1a 0%,#0000 100%);border-left:4px solid #f59e0b}.notifications-page .breadcrumb{position:relative}.notifications-page .breadcrumb a{text-decoration:none;transition:color .3s;position:relative}.notifications-page .breadcrumb a:after{content:"";background:currentColor;width:0;height:2px;transition:width .3s;position:absolute;bottom:-2px;left:0}.notifications-page .breadcrumb a:hover:after{width:100%}.notifications-page .icon-pulse{animation:2s ease-in-out infinite iconPulse}@keyframes iconPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.tooltip{position:relative}.tooltip:before{content:attr(data-tooltip);color:#fff;white-space:nowrap;opacity:0;visibility:hidden;z-index:1000;background:#1f2937;border-radius:.375rem;padding:.5rem;font-size:.875rem;transition:all .3s;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.tooltip:after{content:"";opacity:0;visibility:hidden;border:4px solid #0000;border-top-color:#1f2937;transition:all .3s;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.tooltip:hover:before,.tooltip:hover:after{opacity:1;visibility:visible}@media (max-width:768px){.notifications-page{padding:1rem}.notifications-page .grid{grid-template-columns:1fr;gap:1rem}.notifications-page button{justify-content:center;width:100%}.notifications-page .flex{flex-direction:column;gap:.75rem}}@media (max-width:480px){.notifications-page .text-3xl{font-size:1.5rem}.notifications-page .text-xl{font-size:1.25rem}.notifications-page .px-6{padding-left:1rem;padding-right:1rem}.notifications-page .py-3{padding-top:.75rem;padding-bottom:.75rem}}.notifications-page :focus{outline:none}.notifications-page button:focus,.notifications-page input:focus{box-shadow:0 0 0 3px #3b82f61a}@media (prefers-contrast:high){.notifications-page .bg-white{background:#fff;border:2px solid #000}.notifications-page button{border:2px solid}.notifications-page .text-gray-600{color:#000}}@media (prefers-reduced-motion:reduce){.notifications-page *{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (prefers-color-scheme:dark){.notifications-page{background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%)}}@media print{.notifications-page{color:#000!important;background:#fff!important}.notifications-page button{display:none}.notifications-page .shadow-sm{box-shadow:none!important;border:1px solid #000!important}}.notifications-page ::-webkit-scrollbar{width:8px}.notifications-page ::-webkit-scrollbar-track{background:#f1f5f9;border-radius:4px}.notifications-page ::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.notifications-page ::-webkit-scrollbar-thumb:hover{background:#94a3b8}.dark .notifications-page ::-webkit-scrollbar-track{background:#374151}.dark .notifications-page ::-webkit-scrollbar-thumb{background:#6b7280}.dark .notifications-page ::-webkit-scrollbar-thumb:hover{background:#9ca3af}