
    /* CSS (נשאר כמעט זהה, רק הוספתי שימוש במשתנה) */
    .comments-wrapper { margin-top: 60px; padding-top: 40px; border-top: 1px solid rgba(255,255,255,0.1); }
    .comments-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; }
    .comments-title { font-family: 'Heebo', sans-serif; font-size: 1.8rem; font-weight: 700; color: #fff; display: flex; align-items: center; gap: 10px; }
    
    .forum-link-btn { background: rgba(255,255,255,0.05); color: #aaa; padding: 8px 16px; border-radius: 6px; font-size: 0.9rem; text-decoration: none; transition: 0.3s; border: 1px solid rgba(255,255,255,0.1); }
    .forum-link-btn:hover { border-color: var(--comment-primary); color: var(--comment-primary); }
    
    .comment-item { display: flex; gap: 20px; margin-bottom: 25px; background: rgba(20, 20, 25, 0.6); padding: 20px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.03); animation: fadeIn 0.5s ease; }
    @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
    
    .comment-avatar img { width: 50px; height: 50px; border-radius: 50%; object-fit: cover; border: 2px solid #333; }
    .comment-body { flex-grow: 1; min-width: 0; }
    .comment-author { color: var(--comment-primary); font-weight: 700; font-size: 1rem; margin-left: 10px; }
    .comment-date { color: #d8d8d8; font-size: 0.8rem; }
    .comment-text { color: #ddd; line-height: 1.6; margin-top: 5px; word-break: break-word; }
    .comment-text img { max-width: 200px; border-radius: 6px; margin: 10px 0; cursor: zoom-in; }

    /* באנר פער */
    .comments-gap-banner { background: rgba(255,255,255,0.03); border: 1px dashed rgba(255,255,255,0.2); border-radius: 8px; padding: 20px; text-align: center; margin-bottom: 30px; }
    .btn-gap-forum { background: var(--comment-primary); color: #000; padding: 8px 20px; border-radius: 50px; font-weight: 700; text-decoration: none; display: inline-block; margin-top: 10px; }

    /* טופס */
    .post-comment-box { background: rgba(0,0,0,0.2); padding: 25px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.08); margin-top: 40px; }
    .comment-textarea { width: 100%; background: #0e0e12; border: 1px solid #333; color: #fff; padding: 15px; border-radius: 6px; min-height: 100px; margin-bottom: 15px; resize: vertical; }
    .comment-textarea:focus { outline: none; border-color: var(--comment-primary); }
    .btn-submit-comment { background: var(--comment-primary); color: #000; border: none; padding: 10px 25px; font-weight: 700; border-radius: 4px; cursor: pointer; transition: 0.3s; }
    .btn-submit-comment:hover { opacity: 0.9; }
    .btn-submit-comment:disabled { opacity: 0.5; cursor: not-allowed; }

    /* הודעת חסימה */
    .ban-notice-box { background: rgba(255, 68, 68, 0.08); border: 1px solid #ff4444; padding: 30px; border-radius: 12px; text-align: center; }
    .btn-ban-details { background: #ff4444; color: #fff; padding: 10px 20px; border-radius: 50px; text-decoration: none; font-weight: 700; display: inline-block; margin-top: 15px; }
    
    /* Login Prompt */
    .login-prompt-box { text-align: center; padding: 40px; background: rgba(0,0,0,0.3); border-radius: 8px; border: 1px solid rgba(255,255,255,0.05); }
    .social-login-btn { padding: 10px 20px; border-radius: 6px; margin: 5px; display: inline-block; color: white; text-decoration: none; font-weight: bold; }
    .social-login-btn.discord { background: #5865F2; }
    .social-login-btn.google { background: #fff; color: #333; }
    .social-login-btn.twitch { background: #9146FF; }
    
    /* Lightbox */
    .lightbox-overlay { display: none; position: fixed; z-index: 99999; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.9); justify-content: center; align-items: center; }
    .lightbox-content { max-width: 90%; max-height: 90%; }
    .lightbox-close { position: absolute; top: 20px; right: 30px; color: #fff; font-size: 40px; cursor: pointer; }