/* ── LiveJudge Help Center — additions on top of guide.css ── */


/* home cover + search */
.cover--help { padding: 40px 0 12px; }
.cover--help .cover__title { font-size: 42px; }
.helpsearch { position: relative; max-width: 560px; margin: 22px auto 8px; }
.helpsearch__input {
  width: 100%; box-sizing: border-box; font: inherit; font-size: 17px;
  padding: 14px 18px; border: 1.5px solid var(--card-border); border-radius: 14px;
  background: #fff; box-shadow: 0 2px 10px rgba(30,34,51,.06); outline: none;
}
.helpsearch__input:focus { border-color: var(--gold); box-shadow: 0 2px 14px rgba(244,166,33,.18); }
.helpsearch__results {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 50;
  background: #fff; border: 1px solid var(--card-border); border-radius: 14px;
  box-shadow: 0 10px 32px rgba(30,34,51,.16); overflow: hidden; text-align: left;
}
.helpsearch__results a { display: block; padding: 11px 16px; text-decoration: none; border-bottom: 1px solid var(--card-border); }
.helpsearch__results a:last-child { border-bottom: 0; }
.helpsearch__results a:hover { background: var(--accent-tint, #fdf3e0); }
.helpsearch__results a strong { display: block; color: var(--ink); font-size: 14.5px; }
.helpsearch__results a span { display: block; color: var(--muted); font-size: 12.5px; margin-top: 2px; }
.helpsearch__none { margin: 0; padding: 14px 16px; color: var(--muted); font-size: 14px; }
/* the "no matches" line is prose, not a result row — keep its link inline */
.helpsearch__none a { display: inline; padding: 0; border-bottom: 0; font-weight: 700; }
.helpsearch__none a:hover { background: none; text-decoration: underline; }

/* category cards */
.cat-acc { margin: 26px 0 0; }
.cat-acc .acc__sum { align-items: center; }
.cat-acc .section-head__text { flex: 1 1 auto; min-width: 0; }
.cat-acc .acc__chev { margin-left: auto; margin-top: 0 !important; align-self: center; }
.cat-acc .acc__body > .cat-card__sec:first-child { margin-top: 0; }
.cat-card {
  background: #fff; border: 1px solid var(--card-border); border-radius: 18px;
  padding: 22px 24px; box-shadow: 0 1px 3px rgba(30,34,51,.04);
}
.cat-card__title { margin: 0 0 4px; font-size: 19px; font-weight: 850; letter-spacing: -.01em; }
.cat-card__blurb { margin: 0 0 10px; color: var(--muted); font-size: 13.5px; }
.cat-card__sec { margin: 14px 0 4px; font-size: 11.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--gold-text, #98690a); }
.cat-card__list { margin: 8px 0 4px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.cat-card__list li { margin: 0; }
.cat-card__list a {
  display: block; padding: 10px 14px; text-decoration: none; color: var(--ink);
  font-weight: 650; font-size: 14px; line-height: 1.35; border-radius: 12px;
  background: #f2f3f8;
  border: 1px solid #e5e7f0;
  transition: transform .12s, box-shadow .12s, border-color .12s, background .12s;
}
.cat-card__list a:hover {
  border-color: var(--gold); background: #eef0ff;
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(36,38,44,.10);
}

/* article page */
.crumbs a { text-decoration: none; }
.crumbs__sep { color: var(--muted); margin: 0 2px; }
.article {
  background: #fff; border: 1px solid var(--card-border); border-radius: 18px;
  padding: 30px 34px 34px; margin: 14px 0 22px; box-shadow: 0 1px 3px rgba(30,34,51,.04);
}
.article__title { margin: 0 0 18px; font-size: 30px; font-weight: 850; letter-spacing: -.02em; line-height: 1.15; }
.article__body > :first-child { margin-top: 0; }
.article__body img { max-width: 100%; height: auto; }
@media (max-width: 600px) { .article { padding: 20px 18px 24px; } .article__title { font-size: 24px; } }

/* related articles */
.related {
  background: #fff; border: 1px solid var(--card-border); border-radius: 16px;
  padding: 18px 22px; margin: 0 0 24px;
}
.related__head { margin: 0 0 8px; font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--gold-text, #98690a); }
.related ul { margin: 0; padding: 0; list-style: none; }
.related a { display: block; padding: 5px 0; text-decoration: none; font-weight: 600; font-size: 14.5px; color: var(--ink); }
.related a:hover { color: var(--gold-text, #98690a); }

/* imported raw HTML: tables + video embeds */
.rawhtml { margin: 0 0 18px; }
.tablewrap { overflow-x: auto; margin: 16px 0; }
.tablewrap table { border-collapse: collapse; width: 100%; font-size: 14px; }
.tablewrap th, .tablewrap td { border: 1px solid var(--card-border); padding: 8px 12px; text-align: left; vertical-align: top; }
.tablewrap th { background: var(--accent-tint, #fdf3e0); font-weight: 700; }
.videowrap { position: relative; padding-top: 56.25%; margin: 16px 0; border-radius: 12px; overflow: hidden; background: #000; }
.videowrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ── support tickets ── */
.tkt-form { background: #fff; border: 1px solid var(--card-border); border-radius: 18px; padding: 24px 26px; margin: 20px 0; display: flex; flex-direction: column; gap: 14px; }
.tkt-form label { font-weight: 700; font-size: 14px; display: flex; flex-direction: column; gap: 6px; }
.tkt-form input, .tkt-form textarea { font: inherit; font-size: 15px; padding: 10px 12px; border: 1.5px solid var(--card-border); border-radius: 10px; outline: none; }
.tkt-form input:focus, .tkt-form textarea:focus { border-color: var(--gold); }
.tkt-form .btn { border: none; cursor: pointer; font: inherit; font-weight: 700; padding: 11px 20px; border-radius: 10px; align-self: flex-start; }
.tkt-hp { position: absolute; left: -9999px; height: 1px; width: 1px; opacity: 0; }
.tkt-note { margin: 0; font-size: 13px; color: var(--muted); }
.tkt-thread { margin: 18px 0; display: flex; flex-direction: column; gap: 12px; }
.tkt-msg { border: 1px solid var(--card-border); border-radius: 14px; padding: 14px 18px; background: #fff; }
.tkt-msg--support { background: #f3f4ff; border-color: #c7ccff; }
.tkt-msg__meta { margin: 0 0 6px; font-size: 12px; font-weight: 700; color: var(--gold-text, #98690a); }
.tkt-msg__body { font-size: 15px; }
.tkt-badge { display: inline-block; font-size: 11.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 3px 10px; border-radius: 20px; vertical-align: middle; }
.tkt-badge--open { background: #e8f4ec; color: #0f7a45; }
.tkt-badge--pending { background: #fdf3e0; color: #98690a; }
.tkt-badge--solved { background: #ececf1; color: #5b5e6b; }
.tkt-tabs { display: flex; gap: 8px; margin: 14px 0 18px; flex-wrap: wrap; }
.tkt-tab { text-decoration: none; font-weight: 700; font-size: 13.5px; padding: 7px 14px; border-radius: 20px; border: 1.5px solid var(--card-border); color: var(--ink); background: #fff; }
.tkt-tab.is-active { background: var(--charcoal, #24262c); color: #fff; border-color: var(--charcoal, #24262c); }
.tkt-table { border-collapse: collapse; width: 100%; font-size: 14px; background: #fff; }
.tkt-table th, .tkt-table td { border-bottom: 1px solid var(--card-border); padding: 10px 12px; text-align: left; vertical-align: top; }
.tkt-table a { text-decoration: none; }
.tkt-dim { color: var(--muted); font-size: 12.5px; }
.tkt-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.tkt-actions .btn { border: none; cursor: pointer; font: inherit; font-weight: 700; padding: 10px 16px; border-radius: 10px; }

/* top-nav right button group (help site) */
.topnav__right { justify-self: end; display: inline-flex; gap: 8px; align-items: center; }
.topnav__right .topnav__print { justify-self: auto; }
.topnav__ghost { background: #fff; border: 1.5px solid #b9b5ad; color: #5b5e66 !important; font-weight: 700; padding: 6.5px 13px; border-radius: 9px; font-size: 13px; white-space: nowrap; text-decoration: none; }
.topnav__ghost:hover { border-color: var(--charcoal, #24262c); color: var(--charcoal, #24262c) !important; }
.topnav .lbl-short { display: none; }
@media (max-width: 640px) {
  .topnav .lbl-full { display: none; }
  .topnav .lbl-short { display: inline; }
  .topnav__ghost { padding: 5.5px 10px; font-size: 12px; }
}

.tkt-ghost {
  font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer;
  background: #fff; color: #5b5e66; border: 1.5px solid #d4d1c8; border-radius: 10px;
  padding: 9px 16px; transition: border-color .12s, color .12s, box-shadow .12s;
}
.tkt-ghost:hover { border-color: var(--charcoal, #24262c); color: var(--charcoal, #24262c); box-shadow: 0 1px 4px rgba(36,38,44,.10); }
.tkt-ghost:active { transform: translateY(0.5px); }

.pagefoot__logo { height: 22px; width: auto; display: block; }

.tkt-form select { font: inherit; font-size: 15px; padding: 10px 12px; border: 1.5px solid var(--card-border); border-radius: 10px; background: #fff; outline: none; }
.tkt-form select:focus { border-color: var(--gold); }

.tkt-topic { display: inline-block; background: #f6f4ee; color: #55584f; border: 1px solid #cfc9ba; font-size: 11.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 3px 10px; border-radius: 20px; vertical-align: middle; white-space: nowrap; }
.tkt-topic--sm { margin-top: 3px; font-size: 10.5px; padding: 2px 8px; }

/* inline assistant panel (landing) */
.askpanel { max-width: 560px; margin: 14px auto 0; background: #fff; border: 1.5px solid #c7ccff; border-radius: 16px; padding: 14px 16px; box-shadow: 0 2px 10px rgba(244,166,33,.10); }
.askpanel__head { margin: 0 0 10px; font-size: 12.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--gold-text, #98690a); text-align: center; }
.askpanel__form { display: flex; gap: 8px; }
.askpanel__input { flex: 1; font: inherit; font-size: 15px; padding: 10px 13px; border: 1.5px solid var(--card-border); border-radius: 10px; outline: none; }
.askpanel__input:focus { border-color: var(--gold); }
.askpanel__btn { border: none; cursor: pointer; font: inherit; font-weight: 800; font-size: 14px; padding: 0 20px; border-radius: 10px; background: var(--charcoal, #24262c); color: #fff; }
.askpanel__btn:hover { background: #3a3d45; }
.askpanel__log { margin: 2px 0 12px; max-height: 340px; overflow-y: auto; text-align: left; }
.askpanel__q { margin: 14px 0 12px; padding-bottom: 12px; font-weight: 800; color: var(--charcoal, #24262c); border-bottom: 1.5px dashed #d9d6cc; }
.askpanel__q::before { content: "You: "; color: var(--gold-text, #98690a); }
.askpanel__a { margin: 0 0 8px; font-size: 14.5px; line-height: 1.55; white-space: pre-wrap; }
.askpanel__src { margin: 2px 0 12px; font-size: 13.5px; }
.askpanel__srchead { margin: 0 0 6px; font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-text, #98690a); }
.askpanel__src a { display: block; font-weight: 700; text-decoration: none; padding: 3px 0; color: var(--ink); }
.askpanel__src a:hover { color: var(--gold-text, #98690a); }
.askpanel__src a::before { content: ""; display: inline-block; width: 8px; height: 8px; background: var(--charcoal, #24262c); border-radius: 2.5px; margin-right: 9px; vertical-align: 1px; }
.askpanel__src a.askpanel__human::before { display: none; }
.askpanel__human { display: inline-block; background: var(--charcoal, #24262c); color: #fff !important; padding: 7px 13px; border-radius: 10px; }

/* ── ticket priority + attachments (BUILD 20260703-31) ── */
.tkt-badge--urgent { background: #fdecec; color: #b3341c; }
.tkt-badge--high { background: #fef0e0; color: #c2410c; }
.tkt-badge--medium { background: #eef1f7; color: #47506b; }
.tkt-badge--low { background: #ececf1; color: #7a7d89; }
.tkt-prio { display: flex; gap: 8px; flex-wrap: wrap; }
.tkt-prio button { font: inherit; font-size: 13.5px; font-weight: 700; padding: 7px 16px; border-radius: 20px; border: 1.5px solid var(--card-border); background: #fff; color: #5b5e6b; cursor: pointer; }
.tkt-prio button:hover { border-color: var(--gold); }
.tkt-prio button.is-on { border-color: transparent; }
.tkt-prio button[data-v="low"].is-on { background: #ececf1; color: #55586a; }
.tkt-prio button[data-v="medium"].is-on { background: #eef1f7; color: #333c58; border-color: #b9c2d8; }
.tkt-prio button[data-v="high"].is-on { background: #fef0e0; color: #c2410c; border-color: #eebd8f; }
.tkt-prio button[data-v="urgent"].is-on { background: #fdecec; color: #b3341c; border-color: #eba9a0; }
.tkt-optional { font-weight: 500; color: #9a958a; }
.tkt-form input[type="file"] { border: 1.5px dashed var(--card-border); background: #fbfaf7; padding: 9px 12px; border-radius: 10px; font-size: 14px; }
.tkt-shotprev { max-width: 240px; max-height: 180px; border-radius: 10px; border: 1px solid var(--card-border); object-fit: cover; }
.tkt-msg__attach { margin: 10px 0 0; }
.tkt-msg__attach img { max-width: 320px; max-height: 240px; border-radius: 10px; border: 1px solid var(--card-border); display: block; }

/* ── admin list layout (BUILD 20260703-32) ── */
.tkt-nowrap { white-space: nowrap; }
.tkt-topicline { margin: 14px 0 0; }

/* OwnTheCrowd wordmark sizing */
.pagefoot__logo--full { height: 40px; width: auto; display: block; }

/* ── Return to Contents (article pages) ── */
.artnav { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 2px; }
.artnav__cat { font-size: 12.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.backto {
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  padding: 8px 16px; border-radius: 999px; text-decoration: none;
  background: #fff; border: 1.5px solid var(--card-border); color: var(--ink) !important;
  font-size: 13.5px; font-weight: 700;
  transition: border-color .12s, background .12s, box-shadow .12s, transform .12s;
}
.backto:hover {
  border-color: var(--gold); background: var(--gold-tint);
  color: var(--ink) !important; box-shadow: 0 2px 8px rgba(36, 38, 44, .10);
  transform: translateY(-1px);
}
.backto:active { transform: translateY(0); }
.backto__ico { font-size: 15px; line-height: 1; color: var(--gold-text); }
.backto-foot { margin: 0 0 22px; }

/* admin-only Edit shortcut in the nav — brand-tinted so it reads as an admin
   control without competing with the primary button. Must come after
   .topnav__ghost: same specificity, source order decides. */
.topnav__edit { background: var(--gold-tint); border-color: var(--gold-border); color: var(--gold-text) !important; }
.topnav__edit:hover { background: #fff; border-color: var(--gold); color: var(--gold-text) !important; }
/* An admin nav carries an extra Edit button and no longer fits one phone row —
   drop the button group onto its own line rather than forcing the whole page
   wider than the viewport. Admin-only: the public nav layout is untouched. */
@media (max-width: 640px) {
  .topnav--admin { grid-template-columns: auto 1fr; row-gap: 8px; }
  .topnav--admin .topnav__right { grid-column: 1 / -1; justify-self: start; flex-wrap: wrap; }
}

/* The site title is the one nav item with no length ceiling — it comes from
   site.title, which is editable. On phones it swaps to site.shortTitle via the
   usual lbl-full/lbl-short pair; this is the backstop for whatever is set there,
   letting the title's track shrink and ellipsise instead of shoving the whole
   page wider than the viewport (it used to force 401px at a 375px window). */
@media (max-width: 640px) {
  .topnav:not(.topnav--admin) { grid-template-columns: auto minmax(0, 1fr) auto; }
  .topnav__pkg { justify-self: stretch; text-align: center; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
}

/* The nav brand is the circular OwnTheCrowd mark, not the wordmark, so it needs
   its own sizing - the wordmark's 30px height is a ~226x34 lockup, while the
   mark is roughly square and would read as a dot at that height. */
.topnav__logo--mark { height: 34px; width: auto; }
@media (max-width: 560px) { .topnav__logo--mark { height: 28px; } }
