/* Support & Feedback page. Fields sit on a light slate panel so the white inputs
   read clearly, with no extra dividers (brand system sections 22 and 41). */
.help-page .lh-page-header { border-bottom: 0; }
.help-tabs { display: inline-flex; align-items: center; gap: .25rem; padding: .25rem; background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: .5rem; }
.help-tab { min-width: 112px; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .55rem .95rem; border-radius: .375rem; color: #475569; font-size: .875rem; line-height: 1.25rem; font-weight: 700; text-decoration: none; transition: background-color .15s ease, color .15s ease, box-shadow .15s ease; }
.help-tab:hover { color: #0f172a; }
.help-tab-active { background: #fff; color: var(--lh-blue, #2458a6); box-shadow: 0 1px 2px rgba(15, 23, 42, .08); }

.help-panel { overflow: hidden; background: #f8fafc; border: 1px solid #dbe2ea; border-radius: var(--lh-radius-panel, .5rem); }
.help-panel__body { padding: 1.25rem; background: #f8fafc; }
.help-panel__foot { display: flex; justify-content: flex-end; padding-top: .25rem; }
.help-panel__foot > button { width: 100%; }
.help-aside { margin: 1rem 0 0; color: var(--lh-slate-500, #64748b); font-size: .875rem; line-height: 1.5rem; }
.help-aside a { color: var(--lh-blue, #2458a6); font-weight: 600; text-decoration: none; }
.help-aside a:hover { text-decoration: underline; }

@media (min-width: 640px) {
    .help-panel__body { padding: 1.75rem; }
    .help-panel__foot > button { width: auto; }
}

/* Hidden form inputs come first, so the spacing utility would push the first field down. */
.help-panel__body form:is(.space-y-4, .space-y-6) > div:first-of-type { margin-top: 0; }