/* Store page: team tips, visitor comments, "Did this code work?" */
.store-community { margin: 32px 0 8px; font-family: 'Montserrat', sans-serif; color: #2e2e2e; }
.store-community h4 { font-size: 20px; font-weight: 700; margin: 0 0 12px; }
.store-community h5 { font-size: 16px; font-weight: 700; margin: 0 0 6px; }

.team-tips { background: #f2fbfa; border: 1px solid #c9eeea; border-left: 4px solid #2ec4b6; border-radius: 10px; padding: 18px 20px; margin-bottom: 28px; }
.team-tips ul { margin: 0; padding-left: 20px; }
.team-tips li { margin-bottom: 8px; line-height: 1.55; font-size: 14px; }
.team-tips-sign { margin: 10px 0 0; font-size: 13px; font-weight: 600; color: #1d8f84; }

.community-comments { border: 1px solid #e2e2e2; border-radius: 10px; padding: 18px 20px; }
.community-muted { color: #6b7280; font-size: 13px; margin: 0 0 12px; }
.community-empty { background: #f5f5f5; border-radius: 8px; padding: 14px 16px; font-size: 14px; margin: 0 0 18px; }

.comment-list { list-style: none; margin: 0 0 18px; padding: 0; }
.comment-item { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid #eee; }
.comment-item:last-child { border-bottom: 0; }
.comment-avatar { flex: 0 0 36px; height: 36px; border-radius: 50%; background: #2ec4b6; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.comment-main { min-width: 0; flex: 1; }
.comment-meta { font-size: 13px; color: #6b7280; }
.comment-meta strong { color: #2e2e2e; }
.comment-body { margin: 4px 0 0; font-size: 14px; line-height: 1.55; white-space: pre-line; overflow-wrap: anywhere; }
.comment-reply { margin-top: 10px; background: #f2fbfa; border-left: 3px solid #2ec4b6; border-radius: 6px; padding: 8px 12px; font-size: 13px; }
.comment-reply p { margin: 2px 0 0; }

.comment-form { border-top: 1px solid #eee; padding-top: 16px; }
.comment-form textarea, .comment-form input { width: 100%; border: 1px solid #dedcdc; border-radius: 8px; padding: 10px 12px; font: inherit; font-size: 14px; margin-bottom: 8px; }
.comment-form textarea:focus, .comment-form input:focus { outline: none; border-color: #2ec4b6; box-shadow: 0 0 0 3px rgba(46,196,182,.15); }
.comment-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 575px) { .comment-form-row { grid-template-columns: 1fr; gap: 0; } }
.comment-form button { background: #2ec4b6; color: #fff; border: 0; border-radius: 999px; padding: 10px 22px; font-weight: 600; font-size: 14px; cursor: pointer; }
.comment-form button:disabled { opacity: .6; cursor: default; }
.comment-form .hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.field-error { display: block; color: #9b2226; font-size: 12px; margin: -4px 0 8px; }
.comment-success { background: #e8f8f5; color: #1d6f66; border-radius: 8px; padding: 10px 12px; font-size: 14px; }

.code-vote { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 14px 10px; border-top: 1px dashed #e2e2e2; font-size: 12.5px; color: #6b7280; }
.code-vote-q { font-weight: 600; color: #2e2e2e; }
.code-vote-btn { border: 1px solid #dedcdc; background: #fff; border-radius: 999px; padding: 2px 12px; font-size: 12.5px; cursor: pointer; color: #2e2e2e; }
.code-vote-btn.yes:hover { border-color: #2ec4b6; color: #1d8f84; }
.code-vote-btn.no:hover { border-color: #9b2226; color: #9b2226; }
.code-vote-btn:disabled { opacity: .6; }
.code-vote-thanks { color: #1d8f84; font-weight: 600; }
.code-vote-stats { margin-left: auto; }
@media (max-width: 575px) { .code-vote-stats { margin-left: 0; width: 100%; } }