{{#each categories}}
  <div class="tui-hotel-content room-information">
    <div class="room-information-header">
      <header>
        <h2>{{name}}</h2>
        {{#not ../bedbank}}
          <div class="tui-icon-item">
            {{>icon_svg name='user-family'}}
            <h4>
              {{#compare minPax '==' maxPax}}
                {{#eq maxPax 1}}
                {{getResource ../resourceObject 'roomsNumberOfPeopleSingular' maxPax}}
                {{else}}
                {{getResource ../resourceObject 'roomsNumberOfPeoplePlural' maxPax}}
                {{/eq}}
              {{/compare}}
              {{#compare minPax '!=' maxPax}}
                {{getResource ../resourceObject 'roomsNumberOfPeople' minPax maxPax}}
              {{/compare}}
            </h4>
          </div>
          {{#if usp}}
          <div class="preamble usp">{{usp}}</div>
          {{/if}}
          {{#if remark}}
          <div class="room-remark">
            <div class="remark-icon">{{>icon_svg name='letter-info--circled'}}</div>
            <p>{{remark}}</p>
          </div>
          {{/if}}
        {{/not}}
      </header>
      {{#if ../facts.facts}}
        {{>list_key_value valueList=../facts.facts className='col-double room-facts'}}
      {{/if}}
        {{#if images}}
           {{#gt images.length 1}}
             <div class="main-carousel" data-swipe-id="category-{{@index}}">
               {{#each images}}
               {{>swipe_image}}
               {{/each}}
             </div>
             <div class="image-caption" data-swipe-caption-id="category-{{@index}}">&nbsp;</div>
           {{else}}
             {{>image_responsive_card image-url=images.0.url alt-text=image.0.caption}}
           {{/gt}}
         {{/if}}
    </div>
    {{#each roomTypes}}
      <div class="room-information-details">
        <div class="tui-accordion">
          <div class="accordion-item">
            <h4 class="trigger">
              <div class="main-facilities">
                {{#each mainFacilities}}
                  {{capitalize name}}{{#not @last}},{{/not}}
                {{/each}}
              </div>
              {{>toggle_icon}}
            </h4>
            <div class="tui-text-expander">
              <div class="tui-text-expander-content">
                <h5 class="additional-facilities tui-text-content">
                  {{#each additionalFacilities}}
                    {{capitalize name}}{{#not @last}},{{/not}}
                  {{/each}}
                </h5>
                <ul class="additional-information">
                  {{#if description}}
                    <li>
                      {{>icon_svg name='user-family'}}
                      <span class="text">{{description}}</span>
                    </li>
                  {{/if}}

                  {{#if remark}}
                    <li>
                      {{>icon_svg name='letter-info--circled'}}
                      <span class="text">{{remark}}</span>
                    </li>
                  {{/if}}
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    {{/each}}
  </div>
{{/each}}
