<details>
  <summary>Shell with More and the account menu</summary>
  <div data-kit-layout="shell" data-kit-density="field">
    <a data-kit-region="skip-link" href="#kit-shell-subject">Skip to content</a>
    <nav data-kit-region="rail" aria-label="Application">
      <a data-kit-role="identity" data-kit-region="rail-head" href="?destination=main#main"><span data-kit-mark aria-hidden="true">H</span><span data-kit-wordmark>Hallkeeper</span><span data-kit-region="tenant">Oakmere Village Hall</span></a>
      <ul>
        <li><a data-kit-role="destination" data-kit-state="current" href="?destination=main#main" aria-current="page"><svg data-kit-icon="house" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M219.31,108.68l-80-80a16,16,0,0,0-22.62,0l-80,80A15.87,15.87,0,0,0,32,120v96a8,8,0,0,0,8,8h64a8,8,0,0,0,8-8V160h32v56a8,8,0,0,0,8,8h64a8,8,0,0,0,8-8V120A15.87,15.87,0,0,0,219.31,108.68ZM208,208H160V152a8,8,0,0,0-8-8H104a8,8,0,0,0-8,8v56H48V120l80-80,80,80Z"/></svg><span data-kit-region="name">Work</span></a></li></ul><ul data-kit-region="destinations">
        <li data-kit-region="destination-group">
          <ul>
            <li><a data-kit-role="destination" href="?destination=diary#main"><svg data-kit-icon="calendar" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Zm-96-88v64a8,8,0,0,1-16,0V132.94l-4.42,2.22a8,8,0,0,1-7.16-14.32l16-8A8,8,0,0,1,112,120Zm59.16,30.45L152,176h16a8,8,0,0,1,0,16H136a8,8,0,0,1-6.4-12.8l28.78-38.37A8,8,0,1,0,145.07,132a8,8,0,1,1-13.85-8A24,24,0,0,1,176,136,23.76,23.76,0,0,1,171.16,150.45Z"/></svg><span data-kit-region="name">Diary</span></a></li>
          </ul>
        </li>
        <li data-kit-region="destination-group">
          <p data-kit-region="group-name" id="role-phone-sheet-group-1">The building</p>
          <ul aria-labelledby="role-phone-sheet-group-1">
            <li><a data-kit-role="destination" href="?destination=rooms#main"><svg data-kit-icon="buildings" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M240,208H224V96a16,16,0,0,0-16-16H144V32a16,16,0,0,0-24.88-13.32L39.12,72A16,16,0,0,0,32,85.34V208H16a8,8,0,0,0,0,16H240a8,8,0,0,0,0-16ZM208,96V208H144V96ZM48,85.34,128,32V208H48ZM112,112v16a8,8,0,0,1-16,0V112a8,8,0,1,1,16,0Zm-32,0v16a8,8,0,0,1-16,0V112a8,8,0,1,1,16,0Zm0,56v16a8,8,0,0,1-16,0V168a8,8,0,0,1,16,0Zm32,0v16a8,8,0,0,1-16,0V168a8,8,0,0,1,16,0Z"/></svg><span data-kit-region="name">Rooms</span></a></li>
            <li><a data-kit-role="destination" href="?destination=repairs#main"><svg data-kit-icon="wrench" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M226.76,69a8,8,0,0,0-12.84-2.88l-40.3,37.19-17.23-3.7-3.7-17.23,37.19-40.3A8,8,0,0,0,187,29.24,72,72,0,0,0,88,96,72.34,72.34,0,0,0,94,124.94L33.79,177c-.15.12-.29.26-.43.39a32,32,0,0,0,45.26,45.26c.13-.13.27-.28.39-.42L131.06,162A72,72,0,0,0,232,96,71.56,71.56,0,0,0,226.76,69ZM160,152a56.14,56.14,0,0,1-27.07-7,8,8,0,0,0-9.92,1.77L67.11,211.51a16,16,0,0,1-22.62-22.62L109.18,133a8,8,0,0,0,1.77-9.93,56,56,0,0,1,58.36-82.31l-31.2,33.81a8,8,0,0,0-1.94,7.1L141.83,108a8,8,0,0,0,6.14,6.14l26.35,5.66a8,8,0,0,0,7.1-1.94l33.81-31.2A56.06,56.06,0,0,1,160,152Z"/></svg><span data-kit-region="name">Repairs</span></a></li>
          </ul>
        </li>
        <li data-kit-region="destination-group">
          <p data-kit-region="group-name" id="role-phone-sheet-group-2">Money</p>
          <ul aria-labelledby="role-phone-sheet-group-2">
            <li><a data-kit-role="destination" href="?destination=payments#main"><svg data-kit-icon="credit-card" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M224,48H32A16,16,0,0,0,16,64V192a16,16,0,0,0,16,16H224a16,16,0,0,0,16-16V64A16,16,0,0,0,224,48Zm0,16V88H32V64Zm0,128H32V104H224v88Zm-16-24a8,8,0,0,1-8,8H168a8,8,0,0,1,0-16h32A8,8,0,0,1,208,168Zm-64,0a8,8,0,0,1-8,8H120a8,8,0,0,1,0-16h16A8,8,0,0,1,144,168Z"/></svg><span data-kit-region="name">Payments</span></a></li>
            <li><a data-kit-role="destination" href="?destination=statements#main"><svg data-kit-icon="chart-bar" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M224,200h-8V40a8,8,0,0,0-8-8H152a8,8,0,0,0-8,8V80H96a8,8,0,0,0-8,8v40H48a8,8,0,0,0-8,8v64H32a8,8,0,0,0,0,16H224a8,8,0,0,0,0-16ZM160,48h40V200H160ZM104,96h40V200H104ZM56,144H88v56H56Z"/></svg><span data-kit-region="name">Statements</span></a></li>
          </ul>
        </li>
        <li data-kit-region="profile"><button type="button" id="role-phone-sheet-profile" aria-haspopup="menu" aria-controls="role-phone-sheet-account"><span data-kit-role="avatar" aria-hidden="true"><span data-kit-region="initials">JB</span></span><span data-kit-region="name">Jonathan Bell-Whitmore</span></button></li>
      </ul>
    </nav>
    <div data-kit-region="identity-strip"><div data-kit-role="identity"><span data-kit-mark aria-hidden="true">H</span><span data-kit-wordmark>Hallkeeper</span><span data-kit-region="tenant">Oakmere Village Hall</span></div></div>
    <header data-kit-region="header">
      <div><h1 data-kit-region="subject" id="kit-shell-subject" tabindex="-1">Post-hire checks due</h1></div>
    </header>
    <main data-kit-region="body" id="main">
        <div data-kit-layout="home" data-kit-holds="assigned-upcoming">
          <div data-kit-region="notices" aria-live="polite"></div>
          <section data-kit-region="assigned-upcoming" aria-labelledby="role-phone-sheet-assigned-title">
            <h2 id="role-phone-sheet-assigned-title">Assigned to you</h2>
            <article data-kit-role="row"><div data-kit-region="content-column"><div data-kit-region="subject-column"><div data-kit-region="line"><div data-kit-region="subject-stamp"><a data-kit-region="subject" href="../../../record/">Main hall</a></div><div data-kit-region="facts-column"><p data-kit-region="facts"><span data-kit-region="fact">Fold the stack chairs back against the store room wall</span></p><p data-kit-region="facts"><span data-kit-region="fact">Today</span></p></div></div></div></div></article>
            <article data-kit-role="row"><div data-kit-region="content-column"><div data-kit-region="subject-column"><div data-kit-region="line"><div data-kit-region="subject-stamp"><a data-kit-region="subject" href="../../../record/">Kitchen</a></div><div data-kit-region="facts-column"><p data-kit-region="facts"><span data-kit-region="fact">Check the stopcock, the extractor and the fridge seal</span></p><p data-kit-region="facts"><span data-kit-region="fact">Today</span></p></div></div></div></div></article>
            <article data-kit-role="row"><div data-kit-region="content-column"><div data-kit-region="subject-column"><div data-kit-region="line"><div data-kit-region="subject-stamp"><a data-kit-region="subject" href="../../../record/">Toilets</a></div><div data-kit-region="facts-column"><p data-kit-region="facts"><span data-kit-region="fact">Check the locks, the hand dryers and the floor drains</span></p><p data-kit-region="facts"><span data-kit-region="fact">Today</span></p></div></div></div></div></article>
          </section>
        </div>
    </main>
    <nav data-kit-region="bottom-bar" aria-label="Application">
      <ul data-kit-region="destinations">
        <li><a data-kit-role="destination" data-kit-state="current" href="?destination=main#main" aria-current="page"><svg data-kit-icon="house" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M219.31,108.68l-80-80a16,16,0,0,0-22.62,0l-80,80A15.87,15.87,0,0,0,32,120v96a8,8,0,0,0,8,8h64a8,8,0,0,0,8-8V160h32v56a8,8,0,0,0,8,8h64a8,8,0,0,0,8-8V120A15.87,15.87,0,0,0,219.31,108.68ZM208,208H160V152a8,8,0,0,0-8-8H104a8,8,0,0,0-8,8v56H48V120l80-80,80,80Z"/></svg><span data-kit-region="name">Work</span></a></li>
        <li><a data-kit-role="destination" href="?destination=diary#main"><svg data-kit-icon="calendar" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Zm-96-88v64a8,8,0,0,1-16,0V132.94l-4.42,2.22a8,8,0,0,1-7.16-14.32l16-8A8,8,0,0,1,112,120Zm59.16,30.45L152,176h16a8,8,0,0,1,0,16H136a8,8,0,0,1-6.4-12.8l28.78-38.37A8,8,0,1,0,145.07,132a8,8,0,1,1-13.85-8A24,24,0,0,1,176,136,23.76,23.76,0,0,1,171.16,150.45Z"/></svg><span data-kit-region="name">Diary</span></a></li>
        <li data-kit-region="profile"><button type="button" id="role-phone-sheet-profile-bar" aria-haspopup="menu" aria-controls="role-phone-sheet-account"><span data-kit-role="avatar" data-kit-size="small" aria-hidden="true"><span data-kit-region="initials">J</span></span><span data-kit-region="name">Jonathan Bell-Whitmore</span></button></li>
        <li data-kit-region="more">
          <button type="button" popovertarget="role-phone-sheet-more"><svg data-kit-icon="dots-three" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M140,128a12,12,0,1,1-12-12A12,12,0,0,1,140,128Zm56-12a12,12,0,1,0,12,12A12,12,0,0,0,196,116ZM60,116a12,12,0,1,0,12,12A12,12,0,0,0,60,116Z"/></svg>More</button>
          <ul id="role-phone-sheet-more" data-kit-role="phone-sheet" popover="auto">
            <li data-kit-region="destination-group">
              <p data-kit-region="group-name" id="role-phone-sheet-more-group-0">The building</p>
              <ul aria-labelledby="role-phone-sheet-more-group-0">
                <li><a data-kit-role="destination" href="?destination=rooms#main"><svg data-kit-icon="buildings" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M240,208H224V96a16,16,0,0,0-16-16H144V32a16,16,0,0,0-24.88-13.32L39.12,72A16,16,0,0,0,32,85.34V208H16a8,8,0,0,0,0,16H240a8,8,0,0,0,0-16ZM208,96V208H144V96ZM48,85.34,128,32V208H48ZM112,112v16a8,8,0,0,1-16,0V112a8,8,0,1,1,16,0Zm-32,0v16a8,8,0,0,1-16,0V112a8,8,0,1,1,16,0Zm0,56v16a8,8,0,0,1-16,0V168a8,8,0,0,1,16,0Zm32,0v16a8,8,0,0,1-16,0V168a8,8,0,0,1,16,0Z"/></svg><span data-kit-region="name">Rooms</span></a></li>
                <li><a data-kit-role="destination" href="?destination=repairs#main"><svg data-kit-icon="wrench" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M226.76,69a8,8,0,0,0-12.84-2.88l-40.3,37.19-17.23-3.7-3.7-17.23,37.19-40.3A8,8,0,0,0,187,29.24,72,72,0,0,0,88,96,72.34,72.34,0,0,0,94,124.94L33.79,177c-.15.12-.29.26-.43.39a32,32,0,0,0,45.26,45.26c.13-.13.27-.28.39-.42L131.06,162A72,72,0,0,0,232,96,71.56,71.56,0,0,0,226.76,69ZM160,152a56.14,56.14,0,0,1-27.07-7,8,8,0,0,0-9.92,1.77L67.11,211.51a16,16,0,0,1-22.62-22.62L109.18,133a8,8,0,0,0,1.77-9.93,56,56,0,0,1,58.36-82.31l-31.2,33.81a8,8,0,0,0-1.94,7.1L141.83,108a8,8,0,0,0,6.14,6.14l26.35,5.66a8,8,0,0,0,7.1-1.94l33.81-31.2A56.06,56.06,0,0,1,160,152Z"/></svg><span data-kit-region="name">Repairs</span></a></li>
              </ul>
            </li>
            <li data-kit-region="destination-group">
              <p data-kit-region="group-name" id="role-phone-sheet-more-group-1">Money</p>
              <ul aria-labelledby="role-phone-sheet-more-group-1">
                <li><a data-kit-role="destination" href="?destination=payments#main"><svg data-kit-icon="credit-card" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M224,48H32A16,16,0,0,0,16,64V192a16,16,0,0,0,16,16H224a16,16,0,0,0,16-16V64A16,16,0,0,0,224,48Zm0,16V88H32V64Zm0,128H32V104H224v88Zm-16-24a8,8,0,0,1-8,8H168a8,8,0,0,1,0-16h32A8,8,0,0,1,208,168Zm-64,0a8,8,0,0,1-8,8H120a8,8,0,0,1,0-16h16A8,8,0,0,1,144,168Z"/></svg><span data-kit-region="name">Payments</span></a></li>
                <li><a data-kit-role="destination" href="?destination=statements#main"><svg data-kit-icon="chart-bar" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M224,200h-8V40a8,8,0,0,0-8-8H152a8,8,0,0,0-8,8V80H96a8,8,0,0,0-8,8v40H48a8,8,0,0,0-8,8v64H32a8,8,0,0,0,0,16H224a8,8,0,0,0,0-16ZM160,48h40V200H160ZM104,96h40V200H104ZM56,144H88v56H56Z"/></svg><span data-kit-region="name">Statements</span></a></li>
              </ul>
            </li>
          </ul>
        </li>
      </ul>
    </nav>
    <div id="role-phone-sheet-account-menu" data-kit-region="account-menu"><ul aria-labelledby="role-phone-sheet-profile" id="role-phone-sheet-account" popover="manual" role="menu" data-kit-role="popover"><li role="none" data-kit-region="head"><p title="Jonathan Bell-Whitmore" data-kit-region="account-name">Jonathan Bell-Whitmore</p><p title="jon.bell@oakmerevillagehall.org.uk" data-kit-region="account-email"><span><span>jon<wbr />.bell@</span><wbr/><span>oakmerevillagehall<wbr />.org.uk</span></span></p></li><li role="none" data-kit-region="group"><span id="role-phone-sheet-account-group-0" data-kit-region="group-name">Your halls</span><ul aria-labelledby="role-phone-sheet-account-group-0" role="group"><li role="none"><a aria-current="true" id="role-phone-sheet-account/0-0" role="menuitem" href="?hall=oakmere#main" data-kit-region="item"><span data-kit-region="name">Oakmere Village Hall</span></a></li><li role="none"><a id="role-phone-sheet-account/0-1" role="menuitem" href="?hall=st-annes#main" data-kit-region="item"><span data-kit-region="name">St Anne&#x27;s Church Hall</span></a></li></ul></li><li role="none" data-kit-region="group"><ul role="group"><li role="none"><a id="role-phone-sheet-account/1-0" role="menuitem" href="?destination=account-settings#main" data-kit-region="item"><span data-kit-region="name">Account settings</span></a></li><li role="none"><button id="role-phone-sheet-account/1-1" role="menuitem" type="submit" form="role-phone-sheet-account/1-1-form" data-kit-region="item"><span data-kit-region="name">Sign out</span></button><form id="role-phone-sheet-account/1-1-form" action="?sign-out" method="post" hidden></form></li></ul></li></ul></div>
  </div>
</details>
<details>
  <summary>List with Filters</summary>
  <div data-kit-layout="list">
    <div data-kit-region="notices" aria-live="polite"></div>
    <section data-kit-region="saved-views-filters-sort" data-kit-holds="form-group" aria-label="Invoice views and controls">
      <nav aria-label="Saved views" data-kit-role="local-tabs" id="role-phone-sheet-open-saved-views">
        <a href="?view=awaiting&amp;page=1" aria-current="page" data-kit-state="current"><span data-kit-region="name">Awaiting payment</span><span data-kit-region="reserve" aria-hidden="true">Awaiting payment</span></a>
        <a href="?view=paid&amp;page=1"><span data-kit-region="name">Paid this month</span><span data-kit-region="reserve" aria-hidden="true">Paid this month</span></a>
        <div data-kit-region="more" hidden>
          <button data-kit-role="subtle-action" popovertarget="role-phone-sheet-open-saved-views-more" type="button"><span data-kit-region="label"><span data-kit-region="name">More</span></span></button>
          <div data-kit-role="popover" id="role-phone-sheet-open-saved-views-more" popover="auto">
            <ul>
              <li hidden><a href="?view=awaiting&amp;page=1" aria-current="page"><span data-kit-region="name">Awaiting payment</span></a></li>
              <li hidden><a href="?view=paid&amp;page=1"><span data-kit-region="name">Paid this month</span></a></li>
            </ul>
          </div>
        </div>
      </nav>
      <div data-kit-role="form-group"><label for="role-phone-sheet-list-hirer">Search invoices</label><div data-kit-region="control"><input id="role-phone-sheet-list-hirer" type="search" enterkeyhint="search" value="Oakmere Primary School" placeholder="Find invoices by hirer name"><button type="button" data-kit-role="icon-action" data-kit-region="clear" id="role-phone-sheet-list-hirer-clear" aria-label="Clear"><svg data-kit-icon="x" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z"/></svg></button></div></div>
      <button type="button" data-kit-role="secondary-action" popovertarget="role-phone-sheet-list-filters"><span data-kit-region="label">Filters</span></button>
      <div data-kit-region="filters" id="role-phone-sheet-list-filters" data-kit-role="phone-sheet" popover="auto">
        <div data-kit-role="form-group" data-kit-region="sort" data-kit-sort="columnless-order" id="role-phone-sheet-list-sort-form-group"><label for="role-phone-sheet-list-sort">Sort</label><div data-kit-region="select"><select id="role-phone-sheet-list-sort"><option value="relevance" selected>Relevance</option><option value="hirer">Hirer, A to Z</option><option value="hirer-desc">Hirer, Z to A</option><option value="amount-desc">Amount due, largest first</option><option value="amount">Amount due, smallest first</option></select><svg data-kit-icon="caret-down" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z"/></svg></div></div>
      </div>
    </section>
    <section data-kit-region="rows" aria-label="Invoices">
      <div data-kit-region="notices" aria-live="polite"></div>
      <article data-kit-role="row"><div data-kit-region="content-column"><div data-kit-region="subject-column"><div data-kit-region="line"><div data-kit-region="subject-stamp"><a data-kit-region="subject" href="../../../record/">Oakmere Primary School</a></div><div data-kit-region="facts-column"><p data-kit-region="facts"><span data-kit-region="fact">Awaiting payment</span></p></div></div></div></div></article>
    </section>
  </div>
</details>
<details>
  <summary>Calendar with Filters</summary>
  <div data-kit-layout="calendar">
    <div data-kit-region="notices" aria-live="polite"></div>
    <section data-kit-region="toolbar" aria-label="Calendar controls">
      <div data-kit-region="range"><strong data-kit-region="range-in-words"><time datetime="2025-04-14/2025-04-16"><span>14 – </span><wbr><span>16 April 2025</span></time></strong><button type="button" data-kit-role="secondary-action" data-kit-region="today"><span data-kit-region="label">Today</span></button><a data-kit-role="icon-action" data-kit-region="previous" href="?week=previous" rel="prev" aria-label="Previous week"><svg data-kit-icon="caret-left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M165.66,202.34a8,8,0,0,1-11.32,11.32l-80-80a8,8,0,0,1,0-11.32l80-80a8,8,0,0,1,11.32,11.32L91.31,128Z"/></svg></a><a data-kit-role="icon-action" data-kit-region="next" href="?week=next" rel="next" aria-label="Next week"><svg data-kit-icon="caret-right" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z"/></svg></a><div data-kit-region="date"><div data-kit-role="form-group" id="phone-sheet-open-date"><label for="phone-sheet-open-date-control" id="phone-sheet-open-date-label">Go to a date</label><div data-kit-role="date-field" id="phone-sheet-open-date-control-date-field" data-kit-dates='{"direction":"either","firstDay":"mon","locale":"en-GB","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2025-04-14"}'><input id="phone-sheet-open-date-control" type="text" autocomplete="off" value="Monday, 14 April 2025" aria-describedby="phone-sheet-open-date-control-resolved" aria-expanded="false" aria-controls="phone-sheet-open-date-control-month"><span data-kit-region="widest-dates" aria-hidden="true">Wednesday, 22 January 2025
Thursday, 23 January 2025
Friday, 24 January 2025
Saturday, 25 January 2025
Sunday, 26 January 2025
Monday, 27 January 2025
Tuesday, 28 January 2025
Saturday, 22 February 2025
Sunday, 23 February 2025
Monday, 24 February 2025
Tuesday, 25 February 2025
Wednesday, 26 February 2025
Thursday, 27 February 2025
Friday, 28 February 2025
Saturday, 22 March 2025
Sunday, 23 March 2025
Monday, 24 March 2025
Tuesday, 25 March 2025
Wednesday, 26 March 2025
Thursday, 27 March 2025
Friday, 28 March 2025
Tuesday, 22 April 2025
Wednesday, 23 April 2025
Thursday, 24 April 2025
Friday, 25 April 2025
Saturday, 26 April 2025
Sunday, 27 April 2025
Monday, 28 April 2025
Thursday, 22 May 2025
Friday, 23 May 2025
Saturday, 24 May 2025
Sunday, 25 May 2025
Monday, 26 May 2025
Tuesday, 27 May 2025
Wednesday, 28 May 2025
Sunday, 22 June 2025
Monday, 23 June 2025
Tuesday, 24 June 2025
Wednesday, 25 June 2025
Thursday, 26 June 2025
Friday, 27 June 2025
Saturday, 28 June 2025
Tuesday, 22 July 2025
Wednesday, 23 July 2025
Thursday, 24 July 2025
Friday, 25 July 2025
Saturday, 26 July 2025
Sunday, 27 July 2025
Monday, 28 July 2025
Friday, 22 August 2025
Saturday, 23 August 2025
Sunday, 24 August 2025
Monday, 25 August 2025
Tuesday, 26 August 2025
Wednesday, 27 August 2025
Thursday, 28 August 2025
Monday, 22 September 2025
Tuesday, 23 September 2025
Wednesday, 24 September 2025
Thursday, 25 September 2025
Friday, 26 September 2025
Saturday, 27 September 2025
Sunday, 28 September 2025
Wednesday, 22 October 2025
Thursday, 23 October 2025
Friday, 24 October 2025
Saturday, 25 October 2025
Sunday, 26 October 2025
Monday, 27 October 2025
Tuesday, 28 October 2025
Saturday, 22 November 2025
Sunday, 23 November 2025
Monday, 24 November 2025
Tuesday, 25 November 2025
Wednesday, 26 November 2025
Thursday, 27 November 2025
Friday, 28 November 2025
Monday, 22 December 2025
Tuesday, 23 December 2025
Wednesday, 24 December 2025
Thursday, 25 December 2025
Friday, 26 December 2025
Saturday, 27 December 2025
Sunday, 28 December 2025</span><span id="phone-sheet-open-date-control-resolved" data-kit-region="resolved" aria-live="polite"></span><button type="button" data-kit-role="icon-action" data-kit-region="calendar" id="phone-sheet-open-date-control-calendar" aria-label="Calendar" aria-describedby="phone-sheet-open-date-control"><svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"/></svg></button><input type="hidden" name="date" value="2025-04-14"><div id="phone-sheet-open-date-control-month" data-kit-role="popover" data-kit-region="month" popover="manual"></div></div></div></div></div>
      <div data-kit-region="scope">
        <div data-kit-role="form-group"><label for="role-phone-sheet-calendar-hall">Hall</label><div data-kit-region="select"><select id="role-phone-sheet-calendar-hall"><option value="all">All halls</option><option value="oakmere">Oakmere Hall</option></select><svg data-kit-icon="caret-down" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z"/></svg></div></div>
        <button type="button" data-kit-role="secondary-action" popovertarget="role-phone-sheet-calendar-filters"><span data-kit-region="label">Filters</span></button>
        <div data-kit-region="filters" id="role-phone-sheet-calendar-filters" data-kit-role="phone-sheet" popover="auto">
          <div data-kit-role="form-group"><label for="role-phone-sheet-calendar-room">Room</label><div data-kit-region="select"><select id="role-phone-sheet-calendar-room"><option value="all">All rooms</option><option value="main-hall">Main Hall</option></select><svg data-kit-icon="caret-down" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z"/></svg></div></div>
        </div>
      </div>
      <div data-kit-region="view"><div data-kit-role="form-group" id="role-phone-sheet-calendar-view-form-group"><fieldset><legend id="role-phone-sheet-calendar-view-form-group-label">View</legend><div data-kit-role="segmented-control" id="role-phone-sheet-calendar-view-form-group-control"><label data-kit-region="segment"><input type="radio" name="role-phone-sheet-calendar-view" value="week" checked><span data-kit-region="segment-name">Week</span></label><label data-kit-region="segment"><input type="radio" name="role-phone-sheet-calendar-view" value="day"><span data-kit-region="segment-name">Day</span></label></div></fieldset></div></div>
      <div data-kit-region="actions"><button data-kit-role="primary-action" type="button"><span data-kit-region="label">New booking</span></button></div>
    </section>
    <div data-kit-region="notices" aria-live="polite"></div>
    <div data-kit-region="days">
      <section data-kit-region="day">
        <header data-kit-region="day-heading"><span><strong>Mon</strong><br /><time datetime="2025-04-14">14 Apr</time></span></header>
        <p>Nothing booked</p>
      </section>
    </div>
  </div>
</details>