/* comments.css — Isso × PaperMod tidy layout (no JS hacks) */
#isso-thread{
  /* light theme */
  --bg: #fff;
  --card: #fff;
  --text: #1f2937;
  --muted: #6b7280;
  --border: rgba(0,0,0,.14);
  --hover: rgba(0,0,0,.045);
  --shadow: 0 1px 2px rgba(0,0,0,.06), 0 8px 24px rgba(0,0,0,.08);
  --accent: #2563eb;
  --accent-weak: #dbeafe;
  color: var(--text);
}
html.dark #isso-thread,
body.dark #isso-thread,
html[data-theme="dark"] #isso-thread{
  --bg:#0b1220; --card:#0f1525; --text:#e5e7eb; --muted:#a1a1aa;
  --border: rgba(255,255,255,.16);
  --hover: rgba(255,255,255,.06);
  --shadow: 0 1px 2px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.28);
  --accent:#60a5fa; --accent-weak: rgba(96,165,250,.15);
}
#isso-thread a{ color:var(--accent); }

/* Cards: composer / preview / comments */
#isso-thread .isso-postbox,
#isso-thread .isso-comment,
#isso-thread .isso-preview{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow);
  padding: 1rem;
}
#isso-thread .isso-comment{ margin-top: 1rem; }

/* Composer layout: fields left, buttons right */
#isso-thread .isso-postbox > form{
  display:grid;
  grid-template-columns: minmax(0,1fr) max-content;
  column-gap: 1rem;
  align-items:start;
}

/* Inputs */
#isso-thread .isso-postbox .isso-auth-section,
#isso-thread .isso-postbox .auth-section{
  display:flex; flex-direction:column; gap:.6rem;
}
#isso-thread .isso-postbox textarea,
#isso-thread .isso-postbox input[type="text"],
#isso-thread .isso-postbox input[type="email"],
#isso-thread .isso-postbox input[type="url"],
#isso-thread .isso-postbox input[name="author"],
#isso-thread .isso-postbox input[name="email"],
#isso-thread .isso-postbox input[name="website"]{
  width:100%; max-width:none; box-sizing:border-box;
  margin-top:.5rem; background:transparent; color:var(--text);
  border:1px solid var(--border); border-radius:10px;
  padding:.75rem .9rem; font:inherit; line-height:1.4; outline:none;
}
#isso-thread .isso-postbox textarea{ min-height:140px; resize:vertical; }
#isso-thread .isso-postbox input:focus,
#isso-thread .isso-postbox textarea:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}

/* Action rail (native Isso) — keep visible & tidy */
#isso-thread .isso-postbox .isso-post-action,
#isso-thread .isso-postbox .post-action{
  grid-column:2; grid-row:1 / -1;
  display:flex; gap:.6rem; justify-content:flex-end; align-items:center;
  min-width:max-content; flex-wrap:nowrap;
}
#isso-thread .isso-postbox .isso-post-action > *,
#isso-thread .isso-postbox .post-action > *{
  flex:0 0 auto; white-space:nowrap;
}

/* Buttons look */
#isso-thread .isso-postbox .isso-post-action input[type="submit"],
#isso-thread .isso-postbox .post-action     input[type="submit"],
#isso-thread .isso-postbox .isso-post-action input.submit,
#isso-thread .isso-postbox .post-action     input.submit{
  background:var(--accent); color:#fff; border:0;
  padding:.6rem 1rem; border-radius:10px; font-weight:600; line-height:1;
  cursor:pointer;
}
#isso-thread .isso-postbox .isso-post-action input[name="preview"],
#isso-thread .isso-postbox .post-action     input[name="preview"],
#isso-thread .isso-postbox .isso-post-action input[type="button"],
#isso-thread .isso-postbox .post-action     input[type="button"]{
  background:transparent; color:var(--accent);
  border:1px solid var(--accent);
  padding:.6rem 1rem; border-radius:10px; font-weight:600; line-height:1;
  cursor:pointer;
}

/* Mobile: stack the rail under fields */
@media (max-width:700px){
  #isso-thread .isso-postbox>form{ grid-template-columns:1fr; }
  #isso-thread .isso-postbox .isso-post-action,
  #isso-thread .isso-postbox .post-action{
    grid-column:1; grid-row:auto; justify-content:flex-end; flex-wrap:wrap; margin-top:.7rem;
  }
}

/* Comment body */
#isso-thread .isso-comment .isso-meta{
  display:flex; gap:.5rem; flex-wrap:wrap; align-items:baseline;
  color:var(--muted); font-size:.92rem; margin-bottom:.35rem;
}
#isso-thread .isso-comment .isso-author{ color:var(--text); font-weight:600; }
#isso-thread .isso-comment .isso-text,
#isso-thread .isso-comment .text{ line-height:1.65; }
#isso-thread .isso-comment .isso-text a,
#isso-thread .isso-comment .text a{ color:var(--accent); text-decoration:underline; }
#isso-thread .isso-comment blockquote{
  margin:.5rem 0; padding:.5rem .75rem; border-left:3px solid var(--accent);
  background:var(--hover); border-radius:8px;
}
#isso-thread .isso-comment pre{
  background:var(--hover); border-radius:10px; padding:.6rem .75rem; overflow:auto;
}
#isso-thread .isso-avatar img,
#isso-thread .isso-avatar svg,
#isso-thread .isso-avatar canvas{ width:28px; height:28px; border-radius:999px; }

/* Per-comment actions */
#isso-thread .isso-comment .isso-actions,
#isso-thread .isso-comment .actions,
#isso-thread .isso-comment .footer{
  display:flex; align-items:center; flex-wrap:wrap; gap:.5rem; margin-top:.5rem;
}
#isso-thread .isso-comment .isso-actions a,
#isso-thread .isso-comment .actions a,
#isso-thread .isso-comment .footer a,
#isso-thread .isso-comment a.reply,
#isso-thread .isso-comment a.edit,
#isso-thread .isso-comment a.delete,
#isso-thread .isso-comment .isso-actions button,
#isso-thread .isso-comment .actions button,
#isso-thread .isso-comment .footer button,
#isso-thread .isso-comment .isso-actions input,
#isso-thread .isso-comment .actions input,
#isso-thread .isso-comment .footer input{
  appearance:none; background:transparent; color:var(--accent);
  border:1px solid var(--accent); border-radius:10px;
  padding:.35rem .6rem; text-decoration:none; line-height:1; font:inherit; cursor:pointer;
}
#isso-thread .isso-comment .isso-actions a:hover,
#isso-thread .isso-comment .actions a:hover,
#isso-thread .isso-comment .footer a:hover,
#isso-thread .isso-comment .isso-actions button:hover,
#isso-thread .isso-comment .actions button:hover,
#isso-thread .isso-comment .footer button:hover{
  background:var(--accent-weak);
}

/* Preview: never blank the UI */
#isso-thread .isso-preview{           /* default hidden until Isso shows it */
  display:none;
  padding:1rem;
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:var(--shadow);
  overflow:hidden;
}
/* Show preview when Isso toggles it (inline style) or if some build uses a class */
#isso-thread .isso-preview[style*="block"],
#isso-thread .isso-postbox.is-previewing .isso-preview{
  display:block;
}
/* Don’t double-style the fake comment inside the preview */
#isso-thread .isso-preview > .isso-comment{
  background:transparent; border:0; box-shadow:none; padding:0; margin:0;
}

/* Replies indentation */
#isso-thread .isso-follow-up{ margin-left:2.25rem; }
@media (max-width:520px){ #isso-thread .isso-follow-up{ margin-left:1rem; } }

/* Small spacing tweaks from your set */
#isso-thread .isso-delete {margin-left:5px;}
#isso-thread .isso-permalink {margin-left:5px; margin-right:5px;}
#isso-thread .isso-note {margin-left:auto; margin-right:5px;}
#isso-thread .post-meta-item {margin-left:15px;}