.notification-card{display:flex;gap:12px;padding:16px;background:#fff;border-bottom:1px solid #e2e8f0;min-width:400px}@keyframes slideInNotification{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.notification-card:hover,.notification-card.unread{background:#f8fafc}.notification-icon{width:32px!important;height:32px!important;min-width:32px!important;background:#f1f5f9!important;border:1px solid #e2e8f0!important;padding:6px!important;border-radius:6px!important}.notification-icon img{width:100%;height:100%;object-fit:contain}.notification-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.notification-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.notification-text{font-size:.875rem!important;color:#475569!important;line-height:1.5!important;margin:0!important;padding-right:8px}.creator-name{font-weight:600;color:#1e293b}.document-type{color:#1e293b}.amount{color:#047857;font-weight:500}.notification-time{font-size:.75rem!important;color:#94a3b8!important;white-space:nowrap}.notification-details{display:flex;flex-direction:column;gap:2px}.document-title{font-size:.813rem!important;color:#64748b!important;margin:0!important}.customer-name{font-size:.813rem!important;color:#94a3b8!important;margin:0!important}.info-boxes-section{margin-left:52px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:stretch}.document-details-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:8px}.payment-details-box{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:8px;min-width:200px}.notification-search-section{background:#fafbfc;border-bottom:1px solid #f0f2f5;padding:16px 24px}.notification-search-input{background:#fff;border-radius:8px;margin-bottom:16px}.notification-filter-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.notification-filter-button{border-radius:6px;text-transform:none;font-weight:500;transition:all .2s ease}.notification-filter-button:hover{transform:translateY(-1px);box-shadow:var(--shadow-lg)}.notification-filter-panel{background:#fff;border-radius:8px;border:1px solid #e2e8f0;padding:16px;margin-top:16px;display:flex;gap:16px;flex-wrap:wrap;align-items:center;box-shadow:var(--shadow-sm)}.notification-date-input,.notification-type-select{min-width:150px}.notification-results-count{color:#6b7280;font-size:12px;margin-left:auto;font-weight:500}.notification-clear-filters{color:#ef4444;text-transform:none;font-weight:500;transition:all .2s ease}.notification-clear-filters:hover{background:#ef44441a}.notification-empty-state{padding:40px 24px;text-align:center}.notification-empty-state h6{margin-bottom:8px;font-weight:600}.notification-empty-state p{color:#6b7280;font-size:14px;margin:0}@media(max-width:768px){.notification-filter-panel{flex-direction:column;align-items:stretch}.notification-date-input,.notification-type-select{min-width:100%}.notification-filter-controls{flex-direction:column;align-items:stretch}.notification-results-count{margin-left:0;text-align:center}}.notification-filter-panel{animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.notification-search-input:focus-within{box-shadow:var(--focus-ring-blue-alt)}.notification-filter-button:focus{box-shadow:var(--focus-ring-blue-alt)}.notification-search-input:hover{box-shadow:var(--shadow-sm)}.notification-filter-button:hover{background:#3b82f61a}
