/* Explore SEQ: comments tied to accounts (14 Nov 2026). Post comment form, the quiet account prompt, My SEQ comments, Latest comments cards.
   The Latest comments cards are .es-comm-rev (same card as "Latest reviews and tips", styled in comm.css); only the extras are here. */

/* ------------------------------------------------------------ post page: "Commenting as ..." */
.es-cmt-as { margin: 0 0 14px; padding: 12px 16px; background: var(--alt); border-radius: 14px; font: 500 15.5px/1.5 var(--font-body); color: var(--text); overflow-wrap: anywhere; }
.es-cmt-as b { font-weight: 700; }
.es-cmt-as .es-acct-link { display: inline; min-height: 0; padding: 0; font-size: 14.5px; color: var(--muted); }
.es-cmt-as .es-acct-link:hover { color: var(--accent-ink); }
#commentform [hidden] { display: none !important; }

/* ------------------------------------------------------------ post page: the quiet prompt under "awaiting approval" */
.es-cmt-prompt { margin: 14px 0 18px; padding: 16px 18px; background: #fff; border: 1px solid var(--line-2); border-left: 4px solid var(--accent); border-radius: 16px; font: 500 15.5px/1.5 var(--font-body); color: var(--text); max-width: 40em; }
.es-cmt-prompt p { margin: 0 0 10px; }
.es-cmt-prompt p:last-child { margin-bottom: 0; }
.es-cmt-prompt a { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 3px; }
.es-cmt-prompt__act { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; }
.es-cmt-prompt__act .btn { min-height: 48px; height: 48px; padding: 0 22px; }
.es-cmt-prompt__act .es-acct-link { color: var(--muted); font-weight: 500; }

/* ------------------------------------------------------------ My SEQ */
.es-cmt-my > p { overflow-wrap: anywhere; }
.es-cmt-delnote { margin: 10px 0 0; }

/* ------------------------------------------------------------ Community page: Latest comments */
.es-comm-rev--comment .es-comm-tag { text-transform: none; letter-spacing: .02em; font-size: 13.5px; }
.es-comm-rev--comment time { white-space: nowrap; }

/* ------------------------------------------------------------ Community page: empty states (every section always shows) */
.es-comm-emptystate { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding: 22px 24px; background: #fff; border: 1px dashed var(--line-2); border-radius: var(--radius-md); }
.es-comm-emptystate p { margin: 0; font: 500 16.5px/1.5 var(--font-body); color: var(--muted); max-width: 44em; }
.es-comm-emptystate p:has(> .btn) { flex: none; }
.es-comm-emptystate .btn { min-height: 48px; height: 48px; padding: 0 22px; }
@media (max-width: 640px) { .es-comm-emptystate { padding: 18px 18px; } .es-comm-emptystate p:has(> .btn), .es-comm-emptystate .btn { width: 100%; } }
