
/**
 * /src/css/layouts/panel.css
 * 
 */

/**
 * Panel
 * 
 */
:host([data-annex-search-layout^="panel"]) {
/*    --annex-search-content-max-height: 100vh;*/
    --annex-search-content-max-height: 100dvh;
}

/**
 * Root
 * 
 */
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content {
    width: 80%;
    max-width: 640px;
    position: absolute;
    top: 0;
    bottom: 0;
    box-shadow: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
}
:host([data-annex-search-layout="panel-left"]) [data-view-name="RootView"] > div.content {
    left: 0;
    transform: translateX(-100%);
    transition: transform var(--annex-search-show-panel-duration);
}
:host([data-annex-search-layout="panel-left"][data-annex-search-showing="1"]) [data-view-name="RootView"] > div.content {
    transform: translateX(0%);
}
:host([data-annex-search-layout="panel-right"]) [data-view-name="RootView"] > div.content {
    right: 0;
    transform: translateX(100%);
    transition: transform var(--annex-search-show-panel-duration);
}
:host([data-annex-search-layout="panel-right"][data-annex-search-showing="1"]) [data-view-name="RootView"] > div.content {
    transform: translateX(0%);
}

/**
 * Body
 * 
 */
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="BodyView"] {
    height: calc(var(--annex-search-content-max-height) - var(--annex-search-header-height) - var(--annex-search-footer-height));
}
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="BodyView"] > [data-view-name="ErrorBodyView"],
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="BodyView"] > [data-view-name="ErrorBodyView"] > div.content,
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="BodyView"] > [data-view-name="IdleBodyView"],
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="BodyView"] > [data-view-name="ResultsBodyView"],
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="BodyView"] > [data-view-name="ResultsBodyView"] > [data-view-name="EmptyResultsBodyView"],
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="BodyView"] > [data-view-name="ResultsBodyView"] > [data-view-name="EmptyResultsBodyView"] > div.content {
    height: inherit;
}

/**
 * Header
 * 
 */
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="HeaderView"] {
    border-radius: 0;
}
:host([data-annex-search-layout^="panel"][data-annex-search-query]:not([data-annex-search-query=""])) [data-view-name="RootView"][data-searching="0"] > div.content > [data-view-name="HeaderView"] > div.hide {
    display: none;
}

/**
 * Footer
 * 
 */
:host([data-annex-search-layout^="panel"]) [data-view-name="RootView"] > div.content > [data-view-name="FooterView"] {
    border-radius: 0;
}
