/* Rahmah identity: the "To resolve" list on Results (migration 315). Approved mockup: docs/design/mockups/resolve/resolve.html.
 * SCOPE: only :is(#results-resolve-detail, .rz-inline) (class .rz). Every rule starts with :is(#results-resolve-detail, .rz-inline). No other screen is touched.
 * TO REVERT: delete the one <link href="rahmah-resolve.css"> in index.html's <head>.
 */
:is(#results-resolve-detail, .rz-inline) { --rz-fig: #412B3F; --rz-clay: #A96461; --rz-dawn: #EFD8D0; --rz-cream: #FBF5ED; --rz-ink: #30222E; --rz-rule: #D8C8CE; --rz-mut: #70586B; --rz-edge: #8C7687;
  font-family: "BYM Afacad", "Afacad Flux", "Avenir Next", Arial, sans-serif; font-size: 1.0625rem; line-height: 1.5; color: var(--rz-ink); }
:is(#results-resolve-detail, .rz-inline) *, :is(#results-resolve-detail, .rz-inline) *::before, :is(#results-resolve-detail, .rz-inline) *::after { box-sizing: border-box; box-shadow: none !important; text-shadow: none !important; }
:is(#results-resolve-detail, .rz-inline) :where(button, textarea):focus-visible { outline: 3px solid var(--rz-fig); outline-offset: 2px; }
:is(#results-resolve-detail, .rz-inline) .rz-h { font-size: 1.75rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.15; color: var(--rz-fig); margin: 0 0 6px; }
:is(#results-resolve-detail, .rz-inline) .rz-sub { color: var(--rz-mut); margin: 0 0 14px; font-size: 1.0625rem; }
:is(#results-resolve-detail, .rz-inline) .rz-sum { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px; }
:is(#results-resolve-detail, .rz-inline) .rz-sum div { background: #fff; border: 1px solid var(--rz-rule); padding: 10px 12px; }
:is(#results-resolve-detail, .rz-inline) .rz-sum b { display: block; font-size: 1.75rem; line-height: 1; color: var(--rz-fig); }
:is(#results-resolve-detail, .rz-inline) .rz-sum span { font-size: .9375rem; color: var(--rz-mut); }
:is(#results-resolve-detail, .rz-inline) .rz-note { background: var(--rz-dawn); border-inline-start: 3px solid var(--rz-fig); padding: 12px 16px; margin: 0 0 14px; font-size: 1rem; }
:is(#results-resolve-detail, .rz-inline) .rz-chips { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 14px; }
:is(#results-resolve-detail, .rz-inline) .rz-chips button { min-height: 44px; padding: 0 16px; border: 1px solid var(--rz-edge); border-radius: 4px; background: #fff; color: var(--rz-ink); font: 500 1rem "BYM Afacad", "Afacad Flux", Arial, sans-serif; cursor: pointer; }
:is(#results-resolve-detail, .rz-inline) .rz-chips button.rz-on { background: var(--rz-fig); border-color: var(--rz-fig); color: var(--rz-cream); font-weight: 600; }
:is(#results-resolve-detail, .rz-inline) .rz-item { background: #fff; border: 1px solid var(--rz-rule); border-inline-start: 4px solid var(--rz-rule); padding: 16px; margin-bottom: 12px; }
:is(#results-resolve-detail, .rz-inline) .rz-item[data-s="open"] { border-inline-start-color: var(--rz-clay); }
:is(#results-resolve-detail, .rz-inline) .rz-item[data-s="closed"] { border-inline-start-color: #315e49; }
:is(#results-resolve-detail, .rz-inline) .rz-item[data-s="unresolved"] { border-inline-start-color: #B88355; }
:is(#results-resolve-detail, .rz-inline) .rz-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 6px; }
:is(#results-resolve-detail, .rz-inline) .rz-tag { font-size: .8125rem; font-weight: 600; padding: 2px 8px; border-radius: 4px; }
:is(#results-resolve-detail, .rz-inline) .rz-red { background: #f9e7e7; color: #9d343c; }
:is(#results-resolve-detail, .rz-inline) .rz-disc { background: #f6ede2; color: #7a5530; }
:is(#results-resolve-detail, .rz-inline) .rz-ch { font-size: .9375rem; color: var(--rz-mut); }
:is(#results-resolve-detail, .rz-inline) .rz-q { font-size: 1.375rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.25; color: var(--rz-fig); margin: 0 0 8px; }
:is(#results-resolve-detail, .rz-inline) .rz-ans { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; font-size: 1rem; }
:is(#results-resolve-detail, .rz-inline) .rz-ans div { background: var(--rz-dawn); padding: 8px 10px; min-width: 0; overflow-wrap: anywhere; }
:is(#results-resolve-detail, .rz-inline) .rz-ans small { display: block; font-size: .8125rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--rz-mut); }
:is(#results-resolve-detail, .rz-inline) .rz-who { display: grid; gap: 6px; margin-bottom: 10px; }
:is(#results-resolve-detail, .rz-inline) .rz-who > div { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
:is(#results-resolve-detail, .rz-inline) .rz-who b { min-width: 64px; }
:is(#results-resolve-detail, .rz-inline) .rz-pill { display: inline-block; font-size: .9375rem; font-weight: 600; padding: 2px 10px; border-radius: 4px; background: #fff; border: 1px solid var(--rz-edge); color: var(--rz-ink); }
:is(#results-resolve-detail, .rz-inline) .rz-pill.rz-ok { background: #e6eee6; border-color: #b9cfbf; color: #315e49; }
:is(#results-resolve-detail, .rz-inline) .rz-pill.rz-open { background: #f9e7e7; border-color: #e0b4b4; color: #9d343c; }
:is(#results-resolve-detail, .rz-inline) .rz-pill.rz-un { background: #f6ede2; border-color: #d9c3a6; color: #7a5530; }
:is(#results-resolve-detail, .rz-inline) .rz-pill.rz-wait { color: var(--rz-mut); font-weight: 500; }
:is(#results-resolve-detail, .rz-inline) .rz-how { color: var(--rz-mut); font-size: .9375rem; }
:is(#results-resolve-detail, .rz-inline) .rz-state { font-weight: 600; margin: 0 0 10px; }
:is(#results-resolve-detail, .rz-inline) .rz-st-closed { color: #315e49; }
:is(#results-resolve-detail, .rz-inline) .rz-st-open { color: #9d343c; }
:is(#results-resolve-detail, .rz-inline) .rz-st-unresolved { color: #7a5530; }
:is(#results-resolve-detail, .rz-inline) .rz-st-earlier { color: var(--rz-mut); }
:is(#results-resolve-detail, .rz-inline) .rz-b { min-height: 44px; padding: 0 18px; border: 1px solid var(--rz-fig); border-radius: 4px; background: var(--rz-fig); color: var(--rz-cream); font: 600 1rem "BYM Afacad", "Afacad Flux", Arial, sans-serif; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
:is(#results-resolve-detail, .rz-inline) .rz-b.rz-s { background: transparent; color: var(--rz-fig); }
:is(#results-resolve-detail, .rz-inline) .rz-b:disabled { background: #e4dadd; border-color: var(--rz-edge); color: var(--rz-mut); cursor: not-allowed; }
:is(#results-resolve-detail, .rz-inline) .rz-panel { margin-top: 12px; border-top: 1px solid var(--rz-rule); padding-top: 12px; }
:is(#results-resolve-detail, .rz-inline) .rz-opt { display: flex; gap: 10px; align-items: flex-start; width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid var(--rz-edge); border-radius: 4px; background: #fff; text-align: start; margin-bottom: 8px; color: var(--rz-ink); font: 500 1rem "BYM Afacad", "Afacad Flux", Arial, sans-serif; cursor: pointer; }
:is(#results-resolve-detail, .rz-inline) .rz-opt i { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--rz-edge); margin-top: 2px; }
:is(#results-resolve-detail, .rz-inline) .rz-opt[aria-pressed="true"] { background: var(--rz-fig); border-color: var(--rz-fig); color: var(--rz-cream); }
:is(#results-resolve-detail, .rz-inline) .rz-opt[aria-pressed="true"] i { border-color: #fff; background: radial-gradient(circle, #fff 0 38%, transparent 42%); }
:is(#results-resolve-detail, .rz-inline) .rz-opt small { display: block; opacity: .85; font-size: .9375rem; font-weight: 400; }
:is(#results-resolve-detail, .rz-inline) .rz-hows { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; }
:is(#results-resolve-detail, .rz-inline) .rz-hows button { min-height: 44px; padding: 0 14px; border: 1px solid var(--rz-edge); border-radius: 4px; background: #FFFAF5; color: var(--rz-ink); font: 500 1rem "BYM Afacad", "Afacad Flux", Arial, sans-serif; cursor: pointer; }
:is(#results-resolve-detail, .rz-inline) .rz-hows button[aria-pressed="true"] { background: var(--rz-dawn); border: 2px solid var(--rz-fig); color: var(--rz-fig); font-weight: 600; }
:is(#results-resolve-detail, .rz-inline) .rz-ta { width: 100%; min-height: 72px; padding: 10px 12px; border: 1px solid var(--rz-edge); border-radius: 4px; font: inherit; font-size: 1rem; background: #fff; margin-bottom: 10px; color: var(--rz-ink); }
:is(#results-resolve-detail, .rz-inline) .rz-row { display: flex; gap: 8px; flex-wrap: wrap; }
:is(#results-resolve-detail, .rz-inline) .rz-err { color: #9d343c; margin: 8px 0 0; min-height: 1.2em; }
@media (max-width: 600px) { :is(#results-resolve-detail, .rz-inline) .rz-ans { grid-template-columns: 1fr; } :is(#results-resolve-detail, .rz-inline) { padding: 14px; } }

/* The panel is a boxed card of its own; inside a chapter section the same items sit directly on the section card, so there is no second box. */
#results-resolve-detail { background: #FFFAF5; border: 1px solid #D8C8CE; border-radius: 0; padding: 20px; margin-bottom: 16px; }
.rz-inline { margin: 16px 0 0; }
:is(#results-resolve-detail, .rz-inline) .rz-h.rz-h-in { font-size: 1.25rem; font-weight: 600; letter-spacing: -.01em; color: #412B3F; margin: 0 0 4px; }

/* Talking points inside a Results section: numbered, and coloured by person with the same blue for him and purple for her that the answers use elsewhere on Results. */
.rz-inline .rz-num { display: inline-grid; place-items: center; min-width: 28px; height: 28px; padding: 0 6px; border-radius: 50%; background: #412B3F; color: #FBF5ED; font-weight: 700; font-size: .9375rem; margin-right: 8px; }
.rz-inline .rz-who-chip { display: inline-block; font-size: .8125rem; font-weight: 700; padding: 1px 8px; border-radius: 4px; margin-right: 4px; background: #fff; border: 1px solid currentColor; }
.rz-inline .rz-who-chip.rz-p-his { color: #3a6a8e; }
.rz-inline .rz-who-chip.rz-p-her { color: #7a5a8e; }
:is(#results-resolve-detail, .rz-inline) .rz-ans > div.rz-p-his { background: #eaf1f6; border-inline-start: 4px solid #4a7a9e; }
:is(#results-resolve-detail, .rz-inline) .rz-ans > div.rz-p-her { background: #f1ebf5; border-inline-start: 4px solid #8a6a9e; }
:is(#results-resolve-detail, .rz-inline) .rz-ans > div.rz-p-his small { color: #3a6a8e; font-weight: 700; }
:is(#results-resolve-detail, .rz-inline) .rz-ans > div.rz-p-her small { color: #7a5a8e; font-weight: 700; }