{
  "id": "quiet-clinic-help",
  "name": "Help Centre",
  "theme": "quiet-clinic",
  "category": "Search & Browse",
  "description": "A help centre that answers the top question inline on the search page instead of making you open an article to find one sentence.",
  "layout": "Large search field, then a top-answer panel rendered in full above the result list; results below carry a first line of their own answer rather than a category label.",
  "modules": [
    {
      "key": "search",
      "name": "Help search",
      "html": "\n<header class=\"hs\"><h1>How can we help?</h1><div class=\"in\"><input type=\"search\" value=\"How do I cancel an appointment?\" aria-label=\"Search help\"><button type=\"button\">Search</button></div><div class=\"pop\"><span>Common:</span><a href=\"#\">Cancel an appointment</a><a href=\"#\">Order a repeat prescription</a><a href=\"#\">Register someone else</a></div></header>"
    },
    {
      "key": "answer",
      "name": "Top answer",
      "html": "\n<section class=\"an\"><span class=\"k\">Answer</span><h2>How do I cancel an appointment?</h2><p>Open <b>Your appointments</b>, choose the appointment, then <b>Change or cancel</b>. You can do this up to two hours before. After that, please call the practice on 0113 496 0000 so somebody can offer the slot to another person.</p><p class=\"mn\">There is no penalty for cancelling, and it does not affect your record.</p><div class=\"was\"><span>Did this answer it?</span><button type=\"button\">Yes</button><button type=\"button\">No</button></div></section>"
    },
    {
      "key": "results",
      "name": "Other results",
      "html": "\n<section class=\"rs\"><h2>Other results</h2><ul>\n  <li><a href=\"#\">Rebooking after you cancel</a><p>Cancelled slots go back into the pool immediately, so an earlier time may appear.</p></li>\n  <li><a href=\"#\">Cancelling for someone else</a><p>You need proxy access first. Set this up under Your details.</p></li>\n  <li><a href=\"#\">What happens if I miss an appointment</a><p>Nothing automatic. Somebody may call to check you are alright.</p></li>\n  <li><a href=\"#\">Changing a hospital appointment</a><p>Hospital appointments are not managed here. Use the number on your letter.</p></li>\n</ul></section>"
    },
    {
      "key": "human",
      "name": "Talk to a person",
      "html": "\n<footer class=\"hm\"><h3>Still stuck?</h3><p>Call the practice, or send a message and someone will reply within two working days.</p><div><button type=\"button\" class=\"pri\">Send a message</button><button type=\"button\">0113 496 0000</button></div></footer>"
    }
  ],
  "moduleCount": 4,
  "reorderable": true,
  "meta": {
    "id": "quiet-clinic-help",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-08-29T18:59:53+09:00",
    "updatedAt": "2026-08-29T18:59:53+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/quiet-clinic-help.json",
  "structure": "Large search field, then a top-answer panel rendered in full above the result list; results below carry a first line of their own answer rather than a category label.",
  "html": "<div class=\"dz dz-quiet-clinic-help\" data-design=\"quiet-clinic-help\" data-theme=\"quiet-clinic\">\n<section class=\"dz-mod\" data-mod=\"search\" aria-label=\"Help search\">\n<header class=\"hs\"><h1>How can we help?</h1><div class=\"in\"><input type=\"search\" value=\"How do I cancel an appointment?\" aria-label=\"Search help\"><button type=\"button\">Search</button></div><div class=\"pop\"><span>Common:</span><a href=\"#\">Cancel an appointment</a><a href=\"#\">Order a repeat prescription</a><a href=\"#\">Register someone else</a></div></header></section>\n<section class=\"dz-mod\" data-mod=\"answer\" aria-label=\"Top answer\">\n<section class=\"an\"><span class=\"k\">Answer</span><h2>How do I cancel an appointment?</h2><p>Open <b>Your appointments</b>, choose the appointment, then <b>Change or cancel</b>. You can do this up to two hours before. After that, please call the practice on 0113 496 0000 so somebody can offer the slot to another person.</p><p class=\"mn\">There is no penalty for cancelling, and it does not affect your record.</p><div class=\"was\"><span>Did this answer it?</span><button type=\"button\">Yes</button><button type=\"button\">No</button></div></section></section>\n<section class=\"dz-mod\" data-mod=\"results\" aria-label=\"Other results\">\n<section class=\"rs\"><h2>Other results</h2><ul>\n  <li><a href=\"#\">Rebooking after you cancel</a><p>Cancelled slots go back into the pool immediately, so an earlier time may appear.</p></li>\n  <li><a href=\"#\">Cancelling for someone else</a><p>You need proxy access first. Set this up under Your details.</p></li>\n  <li><a href=\"#\">What happens if I miss an appointment</a><p>Nothing automatic. Somebody may call to check you are alright.</p></li>\n  <li><a href=\"#\">Changing a hospital appointment</a><p>Hospital appointments are not managed here. Use the number on your letter.</p></li>\n</ul></section></section>\n<section class=\"dz-mod\" data-mod=\"human\" aria-label=\"Talk to a person\">\n<footer class=\"hm\"><h3>Still stuck?</h3><p>Call the practice, or send a message and someone will reply within two working days.</p><div><button type=\"button\" class=\"pri\">Send a message</button><button type=\"button\">0113 496 0000</button></div></footer></section>\n</div>",
  "css": "\n.dz-quiet-clinic-help { background: var(--background); color: var(--foreground); font-family: var(--pv-body); padding: 32px 30px 30px; max-width: 46rem; margin: 0 auto; }\n.dz-quiet-clinic-help .hs h1 { font-size: 32px; font-weight: 700; margin: 0 0 16px; }\n.dz-quiet-clinic-help .in { display: flex; gap: 10px; }\n.dz-quiet-clinic-help .in input { flex: 1; min-width: 0; font: inherit; font-size: 18px; min-height: 56px; padding: 0 18px; border: 2px solid var(--border); border-radius: var(--pv-radius); background: var(--card); color: var(--foreground); }\n.dz-quiet-clinic-help .in input:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }\n.dz-quiet-clinic-help .in button { font: inherit; font-size: 17px; font-weight: 600; min-height: 56px; padding: 0 28px; border: 0; border-radius: var(--pv-radius); background: var(--primary); color: var(--primary-foreground); cursor: pointer; transition: opacity var(--dur) var(--ease); }\n.dz-quiet-clinic-help .in button:hover { opacity: .9; }\n.dz-quiet-clinic-help .pop { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 14px; font-size: 15px; }\n.dz-quiet-clinic-help .pop span { color: var(--muted-foreground); }\n.dz-quiet-clinic-help .pop a { color: var(--primary); }\n.dz-quiet-clinic-help .an { margin-top: 26px; background: var(--card); border-radius: var(--pv-radius-xl); padding: 24px 26px; box-shadow: 0 3px 14px color-mix(in srgb, var(--foreground) 8%, transparent); }\n.dz-quiet-clinic-help .k { font-size: 14.5px; color: var(--primary); }\n.dz-quiet-clinic-help .an h2 { font-size: 24px; font-weight: 700; margin: 6px 0 12px; }\n.dz-quiet-clinic-help .an p { margin: 0 0 12px; font-size: 17px; line-height: 1.72; }\n.dz-quiet-clinic-help .mn { color: var(--muted-foreground); font-size: 16px !important; }\n.dz-quiet-clinic-help .was { display: flex; align-items: center; gap: 10px; margin-top: 6px; padding-top: 16px; border-top: var(--pv-bw) solid var(--border); font-size: 15.5px; color: var(--muted-foreground); }\n.dz-quiet-clinic-help .was button { font: inherit; font-size: 15.5px; min-height: 48px; padding: 0 24px; border: var(--pv-bw) solid var(--border); border-radius: var(--pv-radius); background: var(--background); color: var(--foreground); cursor: pointer; transition: background var(--dur) var(--ease); }\n.dz-quiet-clinic-help .was button:hover { background: var(--secondary); }\n.dz-quiet-clinic-help .rs { margin-top: 26px; }\n.dz-quiet-clinic-help .rs h2 { font-size: 20px; font-weight: 700; margin: 0 0 8px; }\n.dz-quiet-clinic-help .rs ul { list-style: none; margin: 0; padding: 0; }\n.dz-quiet-clinic-help .rs li { padding: 15px 0; border-top: var(--pv-bw) solid var(--border); }\n.dz-quiet-clinic-help .rs a { font-size: 18px; color: var(--primary); }\n.dz-quiet-clinic-help .rs p { margin: 5px 0 0; font-size: 15.5px; line-height: 1.6; color: var(--muted-foreground); max-width: 62ch; }\n.dz-quiet-clinic-help .hm { margin-top: 26px; background: var(--muted); border-radius: var(--pv-radius); padding: 22px 24px; }\n.dz-quiet-clinic-help .hm h3 { font-size: 19px; font-weight: 700; margin: 0 0 6px; }\n.dz-quiet-clinic-help .hm p { margin: 0 0 16px; font-size: 16px; line-height: 1.6; color: var(--muted-foreground); }\n.dz-quiet-clinic-help .hm div { display: flex; flex-wrap: wrap; gap: 12px; }\n.dz-quiet-clinic-help .hm button { font: inherit; font-size: 16px; min-height: 52px; padding: 0 24px; border: var(--pv-bw) solid var(--border); border-radius: var(--pv-radius); background: var(--card); color: var(--foreground); cursor: pointer; transition: background var(--dur) var(--ease); }\n.dz-quiet-clinic-help .hm button:hover { background: var(--background); }\n.dz-quiet-clinic-help .hm .pri { background: var(--primary); color: var(--primary-foreground); border-color: var(--primary); font-weight: 600; }\n.dz-quiet-clinic-help .hm .pri:hover { background: var(--primary); opacity: .9; }\n@media (prefers-reduced-motion: reduce) { .dz-quiet-clinic-help *, .dz-quiet-clinic-help *::before, .dz-quiet-clinic-help *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; } }",
  "requiredTheme": "/api/v1/themes/quiet-clinic.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap"
}