.comments-modern-container{padding:30px 20px;max-width:1200px;margin:0 auto;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.comments-modern-wrapper{grid-template-columns:1fr 1fr;gap:30px;margin-top:20px;display:grid}@media (max-width:968px){.comments-modern-wrapper{grid-template-columns:1fr}}.comments-form-section{padding:30px;border:1px solid #e5e7eb;box-shadow:0 2px 8px rgba(0,0,0,.08);border-radius:16px;background:#fff}.comments-form-header{margin-bottom:25px;border-bottom:2px solid #f3f4f6;padding-bottom:20px}.comments-form-header h2{font-size:24px;font-weight:700;color:#111827;gap:12px;margin:0 0 8px;align-items:center;display:flex}.comments-form-header h2 i{font-size:28px;color:#3b82f6}.comments-form-header p{font-size:14px;color:#6b7280;margin:0;line-height:1.6}.comments-form-group{margin-bottom:20px}.comments-form-label{font-size:14px;font-weight:600;margin-bottom:8px;color:#374151;display:block}.comments-form-input,.comments-form-select,.comments-form-textarea{padding:12px 16px;font-size:15px;border:2px solid #e5e7eb;color:#111827;transition:all .2s ease;border-radius:10px;background:#fff;width:100%;font-family:inherit}.comments-form-input:focus,.comments-form-select:focus,.comments-form-textarea:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.1)}.comments-form-input[readonly]{color:#6b7280;background:#f9fafb;cursor:not-allowed}.comments-form-textarea{min-height:120px;resize:vertical;line-height:1.6}.comments-form-select{appearance:none;padding-right:40px;background-position:right 16px center;cursor:pointer;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 9 1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat}.comments-form-submit{padding:14px 24px;font-size:16px;border:none;font-weight:600;color:#fff;transition:all .2s ease;box-shadow:0 4px 6px rgba(59,130,246,.2);border-radius:10px;background:linear-gradient(135deg,#3b82f6,#2563eb);cursor:pointer;width:100%;margin-top:10px}.comments-form-submit:hover{transform:translateY(-2px);box-shadow:0 6px 12px rgba(59,130,246,.3)}.comments-form-submit:active{transform:translateY(0)}.comments-form-submit:disabled{transform:none;opacity:.6;cursor:not-allowed}.comments-message{padding:16px 20px;font-size:14px;margin-bottom:20px;border-radius:10px;line-height:1.6}.comments-message.info{border:1px solid #bfdbfe;color:#1e40af;background:#eff6ff}.comments-message.success{border:1px solid #bbf7d0;color:#166534;background:#f0fdf4}.comments-message.error{border:1px solid #fecaca;color:#991b1b;background:#fef2f2}.comments-list-section{padding:30px;border:1px solid #e5e7eb;box-shadow:0 2px 8px rgba(0,0,0,.08);border-radius:16px;background:#fff}.comments-list-header{margin-bottom:25px;border-bottom:2px solid #f3f4f6;padding-bottom:20px}.comments-list-header h2{font-size:24px;font-weight:700;color:#111827;gap:12px;margin:0;align-items:center;display:flex}.comments-list-header h2 i{font-size:28px;color:#10b981}.comments-list{flex-direction:column;gap:24px;display:flex}.comment-card{padding:20px;border:1px solid #e5e7eb;transition:all .2s ease;border-radius:12px;background:#f9fafb}.comment-card:hover{border-color:#d1d5db;box-shadow:0 4px 12px rgba(0,0,0,.08)}.comment-header{margin-bottom:16px;gap:16px;align-items:flex-start;display:flex}.comment-avatar{height:56px;flex-shrink:0;justify-content:center;font-size:20px;font-weight:700;color:#fff;align-items:center;box-shadow:0 2px 8px rgba(59,130,246,.3);border-radius:50%;background:linear-gradient(135deg,#3b82f6,#8b5cf6);width:56px;display:flex}.comment-info{flex:1}.comment-title{font-size:18px;font-weight:700;color:#111827;margin:0 0 8px;line-height:1.4}.comment-ratings{flex-wrap:wrap;font-size:13px;margin-bottom:12px;color:#6b7280;gap:16px;display:flex}.comment-rating-item{gap:6px;align-items:center;display:flex}.comment-rating-item img{height:16px;width:auto}.comment-body{font-size:15px;margin-bottom:16px;color:#374151;line-height:1.7}.comment-body p{margin:0 0 8px}.comment-body p:last-child{margin-bottom:0}.comment-product{border-left:4px solid #3b82f6;padding:12px 16px;font-size:13px;margin-bottom:16px;color:#1e40af;border-radius:8px;background:#eff6ff}.comment-product a{text-decoration:none;font-weight:600;color:#1e40af;gap:8px;align-items:center;display:flex}.comment-product a:hover{text-decoration:underline}.comment-product i{color:#3b82f6}.comment-footer{padding-top:16px;flex-wrap:wrap;font-size:13px;color:#6b7280;border-top:1px solid #e5e7eb;gap:16px;display:flex}.comment-footer-item{gap:6px;align-items:center;display:flex}.comment-footer-item i{color:#9ca3af}.comments-loading{padding:40px 20px;color:#6b7280;text-align:center}.comments-loading i{animation:spin 1s linear infinite;font-size:32px;color:#3b82f6}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.comments-empty{padding:60px 20px;color:#6b7280;text-align:center}.comments-empty i{font-size:48px;margin-bottom:16px;color:#d1d5db}.comments-empty p{font-size:16px;margin:0}@media (max-width:640px){.comments-modern-container{padding:20px 15px}.comments-form-section,.comments-list-section{padding:20px}.comments-form-header h2,.comments-list-header h2{font-size:20px}.comment-header{flex-direction:column;align-items:flex-start}.comment-avatar{height:48px;font-size:18px;width:48px}}