.feedback-backdrop{z-index:9998;background:#00000080;animation:.3s fadeIn;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.feedback-sidebar-container{z-index:9999;background:linear-gradient(135deg,#000 0%,#161716 100%);border-left:1px solid #3d4556;width:450px;height:100vh;transition:right .3s cubic-bezier(.4,0,.2,1);position:fixed;top:0;right:-450px;overflow-y:auto;box-shadow:-4px 0 20px #0000004d}.feedback-sidebar-container.open{right:0}.feedback-sidebar-wrapper{flex-direction:column;height:100%;padding:15px 2rem;display:flex}.feedback-sidebar-header{border-bottom:1px solid #3d4556;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.feedback-sidebar-header h3{background:linear-gradient(135deg,#60a5fa 0%,#3b82f6 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.5rem;font-weight:600}.close-sidebar-btn{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:.375rem;justify-content:center;align-items:center;padding:.5rem;transition:all .2s;display:flex}.close-sidebar-btn:hover{color:#fff;background:#ffffff1a}.feedback-sidebar-content{flex-direction:column;flex:1;margin-top:15px;padding-bottom:30px;display:flex}.feedback-form{flex-direction:column;gap:1.5rem;display:flex}.current-tab-info{background:#60a5fa1a;border:1px solid #60a5fa4d;border-radius:.5rem;margin-bottom:1rem;padding:.75rem}.current-tab-info p{color:#d1d5db;margin:0;font-size:.85rem}.current-tab-info strong{color:#60a5fa;text-transform:capitalize}.form-group{flex-direction:column;gap:.5rem;display:flex}.form-group label{color:#e5e7eb;font-size:.9rem;font-weight:500}.form-group label .required{color:#ef4444;margin-left:.25rem}.feedback-category-select-wrapper{width:100%;position:relative}.feedback-category-select{color:#ffffffe6;cursor:pointer;appearance:none;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;outline:none;width:100%;padding:10px 40px 10px 12px;font-family:inherit;font-size:.9rem;transition:all .2s}.feedback-category-select-wrapper .dropdown-icon{pointer-events:none;color:#fff9;transition:color .2s;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.feedback-category-select:hover{background:#ffffff14;border-color:#667eea4d}.feedback-category-select:hover+.dropdown-icon{color:#fffc}.feedback-category-select:focus{background:#ffffff14;border-color:#667eea80}.feedback-category-select:focus+.dropdown-icon{color:#667eeacc}.feedback-category-select option{color:#ffffffe6;background:#161716;padding:.5rem}.feedback-category-select.default-category{color:#ffffff80;font-style:italic}.feedback-category-select.default-category:hover{color:#ffffffb3}.feedback-category-select.default-category:focus{color:#ffffffe6;font-style:normal}.feedback-textarea{color:#fff;resize:vertical;background:#ffffff0d;border:1px solid #3d4556;border-radius:.5rem;width:100%;min-height:150px;padding:.75rem;font-family:inherit;font-size:.9rem;transition:all .2s}.feedback-textarea:focus{background:#ffffff14;border-color:#60a5fa;outline:none}.feedback-textarea::placeholder{color:#6b7280}.char-counter{text-align:right;color:#9ca3af;margin-top:-.5rem;font-size:.75rem}.char-counter.warning{color:#fbbf24}.char-counter.error{color:#ef4444}.feedback-submit-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#112a39 0%,#0214448a 100%);border:1px solid #2c2f5d;border-radius:.5rem;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;transition:all .2s;position:relative;overflow:hidden}.feedback-submit-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #3b82f666}.feedback-submit-btn:disabled{opacity:.5;cursor:not-allowed}.feedback-submit-btn.loading{pointer-events:none}.loader-btn{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:20px;height:20px;animation:.6s linear infinite spin;display:none}.feedback-submit-btn.loading .loader-btn{display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.feedback-submit-btn.loading span{opacity:0}@keyframes spin{to{transform:translate(-50%,-50%)rotate(360deg)}}@media (max-width:768px){.feedback-sidebar-container{width:100%;right:-100%}}
