/* The guide shares help.css structure and the application's live Jemi palette.
   Do not use prefers-color-scheme: the user's in-app appearance is authoritative. */
.jemi-header-tools { display: flex; align-items: center; gap: .6em; flex-shrink: 0; }
.jemi-review-help { display: flex; justify-content: flex-end; margin-bottom: .6em; }
.jemi-contract-help-button {
    font: inherit;
    padding: .5em .8em;
    color: var(--jemi-text);
    background: var(--jemi-surface);
    border: 1px solid var(--jemi-surface-border);
    border-radius: .6em;
    cursor: pointer;
    white-space: nowrap;
}
.jemi-contract-help-button:hover { background: var(--jemi-accent-soft); }
.adh-themed-modal.jemi-contract-help {
    --dxbl-popup-footer-bg: var(--jemi-surface-strong);
    --dxbl-popup-footer-color: var(--jemi-text);
}
.adh-themed-modal.jemi-contract-help .dxbl-modal-content,
.adh-themed-modal.jemi-contract-help .dxbl-modal-footer {
    background: var(--jemi-surface-strong);
    color: var(--jemi-text);
}
.adh-themed-modal.jemi-contract-help .dxbl-modal-footer .dxbl-btn {
    --dxbl-btn-bg: var(--jemi-surface);
    --dxbl-btn-color: var(--jemi-text);
    --dxbl-btn-border-color: var(--jemi-surface-border);
    --dxbl-btn-hover-bg: var(--jemi-accent-soft);
    --dxbl-btn-hover-color: var(--jemi-text);
}
.jemi-contract-help-button:focus-visible,
.jemi-contract-help .jemi-help-navigation button:focus-visible {
    outline: 2px solid var(--jemi-accent);
    outline-offset: 3px;
}
.jemi-contract-help .help-container {
    max-width: none;
    padding: .25em;
    font: inherit;
    color: var(--jemi-text);
    line-height: 1.6;
}
.jemi-contract-help .help-container p { color: var(--jemi-text-soft); }
.jemi-contract-help .help-container h2 { font-size: 1.2em !important; color: var(--jemi-text); }
.jemi-contract-help .help-container h3 { font-size: 1.05em !important; color: var(--jemi-text); }
.jemi-contract-help .help-section {
    padding: 1.2em;
    margin: 0;
    background: var(--jemi-surface-strong);
    border-color: var(--jemi-surface-border);
    border-radius: .8em;
}
.jemi-contract-help .help-section > h2:first-child { margin-top: 0; }
.jemi-contract-help .jemi-help-intro { display: grid; grid-template-columns: minmax(0, 1fr) 8em; gap: 1em; align-items: center; }
.jemi-contract-help .jemi-help-avatar { width: 100%; height: auto; }
.jemi-contract-help .jemi-help-logo { width: min(22em, 100%); height: auto; }
.jemi-contract-help .jemi-help-logo-dark { display: none; }
:is(body.dxbl-theme-dark, html.anydata-dark-mode, body.anydata-dark-mode,
    html[data-theme="dark"], body[data-theme="dark"], html[data-theme-mode="dark"],
    body[data-theme-mode="dark"], html[data-bs-theme="dark"], body[data-bs-theme="dark"])
    .jemi-contract-help .jemi-help-logo-light { display: none; }
:is(body.dxbl-theme-dark, html.anydata-dark-mode, body.anydata-dark-mode,
    html[data-theme="dark"], body[data-theme="dark"], html[data-theme-mode="dark"],
    body[data-theme-mode="dark"], html[data-bs-theme="dark"], body[data-bs-theme="dark"])
    .jemi-contract-help .jemi-help-logo-dark { display: block; }
.jemi-contract-help .jemi-help-navigation { display: flex; flex-wrap: wrap; gap: .5em; margin: 1em 0; }
.jemi-contract-help .jemi-help-navigation button {
    font: inherit;
    padding: .55em .8em;
    border-radius: .6em;
    border: 1px solid var(--jemi-surface-border);
    background: var(--jemi-surface-strong);
    color: var(--jemi-text);
    cursor: pointer;
}
.jemi-contract-help .jemi-help-navigation button:hover,
.jemi-contract-help .jemi-help-navigation button[aria-pressed="true"] {
    background: var(--jemi-accent-soft);
    border-color: var(--jemi-accent);
}
.jemi-contract-help .jemi-help-navigation button[aria-pressed="true"] { font-weight: 700; }
.jemi-contract-help .jemi-help-table-scroll { overflow-x: auto; margin-block: 1em; }
.jemi-contract-help .jemi-help-table-scroll table { font: inherit; table-layout: fixed; }
.jemi-contract-help .jemi-help-table-scroll :is(th, td) {
    padding: .65em;
    border: 1px solid var(--jemi-surface-border);
    overflow-wrap: anywhere;
}
.jemi-contract-help .jemi-help-table-scroll th:first-child { width: 30%; }
.jemi-contract-help .jemi-help-table-scroll thead th { background: var(--jemi-header-bg); color: var(--jemi-text); }
.jemi-contract-help .jemi-help-table-scroll tbody tr:nth-child(even) { background: var(--jemi-surface-soft); }
.jemi-contract-help .help-steps { margin: .75em 0; padding: 0; }
.jemi-contract-help .help-steps li {
    grid-template-columns: 2em minmax(0, 1fr);
    padding: .75em;
    gap: .75em;
    background: var(--jemi-surface-soft);
    border-color: var(--jemi-surface-border);
    border-radius: .7em;
}
.jemi-contract-help .help-steps li::before {
    width: 2em;
    height: 2em;
    font-size: inherit;
    background: var(--jemi-accent-soft);
    color: var(--jemi-text);
    border: 1px solid var(--jemi-accent);
}
@media (max-width: 600px) {
    .jemi-header-tools { gap: .35em; }
    .jemi-contract-help-button { white-space: normal; }
    .jemi-contract-help .jemi-help-intro { grid-template-columns: minmax(0, 1fr) 4em; }
    .jemi-contract-help .help-section { padding: .75em; }
    .jemi-contract-help .jemi-help-table-scroll :is(th, td) { padding: .4em; }
    .jemi-contract-help .jemi-help-navigation button { flex: 1 1 45%; }
}