<?xml version="1.0" encoding="utf-8"?>
<rules xmlns="http://namespaces.plone.org/diazo"
       xmlns:css="http://namespaces.plone.org/diazo/css"
       xmlns:xhtml="http://www.w3.org/1999/xhtml"
       xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
       xmlns:xi="http://www.w3.org/2001/XInclude">

    <!--
    You can include this rules file in your own theme as follows:

    <rules xmlns="http://namespaces.plone.org/diazo"
           xmlns:css="http://namespaces.plone.org/diazo/css"
           xmlns:xhtml="http://www.w3.org/1999/xhtml"
           xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
           xmlns:xi="http://www.w3.org/2001/XInclude">
        <xi:include href="++theme++barceloneta/backend.xml" />
        <rules css:if-content="body.viewpermission-view, body.viewpermission-none">
           <theme href="index.html" />
           ... your rules
        </rules>
    </rules>

    This will include the toolbar in your theme and use Barceloneta to theme
    all your backend pages such as site setup and edit.
    -->

  <!-- Toolbar -->
  <before css:theme-children="body" css:content-children="#edit-bar" css:if-not-content=".ajax_load" css:if-content=".userrole-authenticated" />
  <replace css:theme="#anonymous-actions" css:content-children="#portal-personaltools-wrapper" css:if-not-content=".ajax_load" css:if-content=".userrole-anonymous" />

  <!-- We don't want overlays -->
  <drop attributes="class" css:content="#edit-bar a.pat-plone-modal" />

  <!-- Cut down barceloneta without just for backend UI -->
  <rules css:if-not-content="body.viewpermission-view, body.viewpermission-none">

    <theme href="../++theme++barceloneta/index.html" />
    <notheme css:if-not-content="#visual-portal-wrapper" />

    <!-- We can't control the bundle from here due to include. Just hard code -->
    <after css:theme-children="head">
      <link rel="stylesheet" href="/++theme++barceloneta/less/barceloneta-compiled.css" />
    </after>

    <rules css:if-content="#portal-top">
      <!-- Attributes -->
      <copy attributes="*" css:theme="html" css:content="html" />
      <!-- Base tag -->
      <before css:theme="title" css:content="base" />
      <!-- Title -->
      <replace css:theme="title" css:content="title" />
      <!-- Pull in Plone Meta -->
      <after css:theme-children="head" css:content="head meta" />
      <!-- Don't use Plone icons, use the theme's -->
      <drop css:content="head link[rel='apple-touch-icon']" />
      <drop css:content="head link[rel='shortcut icon']" />
    </rules>

    <!-- Copy over the id/class attributes on the body tag. This is important for per-section styling -->
    <copy attributes="*" css:content="body" css:theme="body" />

    <!-- CSS -->
    <drop css:content="head link[data-bundle='diazo']" />
    <after css:theme-children="head" css:content="head link" />

    <!-- Script -->
    <drop css:content="head script[data-bundle='diazo']" />
    <after css:theme-children="head" css:content="head script" />

    <!-- We don't need global nav -->
    <drop css:theme="#mainnavigation-wrapper" />

    <!-- Hero unit on homepage only -->
    <drop css:theme="div.principal" css:if-not-content="body.template-document_view.section-front-page" />

    <!-- Full-width breadcrumb -->
    <replace css:theme="#above-content" css:content="#viewlet-above-content" />
    <after css:theme-children="head">
        <style>.plone-breadcrumb {margin-top: 0;}</style>
    </after>

    <!-- Central column -->
    <replace css:theme="#content-container" method="raw">
      <xsl:variable name="central">
        <xsl:if test="//aside[@id='portal-column-one'] and //aside[@id='portal-column-two']">col-xs-12 col-sm-6</xsl:if>
        <xsl:if test="//aside[@id='portal-column-two'] and not(//aside[@id='portal-column-one'])">col-xs-12 col-sm-9</xsl:if>
        <xsl:if test="//aside[@id='portal-column-one'] and not(//aside[@id='portal-column-two'])">col-xs-12 col-sm-9</xsl:if>
        <xsl:if test="not(//aside[@id='portal-column-one']) and not(//aside[@id='portal-column-two'])">col-xs-12 col-sm-12</xsl:if>
      </xsl:variable>
      <div class="{$central}">
        <div class="row">
          <div class="col-xs-12 col-sm-12">
             <xsl:apply-templates css:select="#content" />
          </div>
        </div>
        <footer class="row">
          <div class="col-xs-12 col-sm-12">
           <xsl:copy-of css:select="#viewlet-below-content" />
          </div>
        </footer>
      </div><!--/row-->
    </replace>

    <!-- Alert message -->
    <replace css:theme-children="#global_statusmessage" css:content-children="#global_statusmessage" />

    <!-- Left column -->
    <rules css:if-content="#portal-column-one">
      <replace css:theme="#column1-container">
        <div class="col-xs-6 col-sm-3 sidebar-offcanvas">
          <aside id="portal-column-one">
            <xsl:copy-of css:select="#portal-column-one > *" />
          </aside>
        </div>
      </replace>
    </rules>

    <!-- Right column -->
    <rules css:if-content="#portal-column-two">
      <replace css:theme="#column2-container">
        <div class="col-xs-6 col-sm-3 sidebar-offcanvas" role="complementary">
          <aside id="portal-column-two">
            <xsl:copy-of css:select="#portal-column-two > *" />
          </aside>
        </div>
      </replace>
    </rules>

    <!-- Content header -->
    <drop css:theme="#portal-top" />
    <drop css:theme="#portal-footer-wrapper" />

  </rules>

</rules>