/*
 * React Fabric
 * @version: 1.0.0
 *
 *
 * The MIT License (MIT)
 * Copyright (c) 2024 Adarsh Pastakia
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
 * and associated documentation files (the "Software"), to deal in the Software without restriction,
 * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
 * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
 * subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in all copies or substantial
 * portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
 * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
 * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
 * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 */

@layer components {
  .fabric-panel {
    grid-template: "title" auto "content" 1fr / 1fr;
    background-color: var(--fabric-bg);

    & > * {
      background-color: transparent;
    }

    &.fixed {
      box-shadow: 0 0 18px var(--fabric-shadow);
    }

    & .fabric-panelHeader {
      background-color: var(--bg-color-dimmed);
    }

    & .fabric-panelAction {
      padding: 0.25rem;
    }

    & .fabric-panelBody {
      grid-template: "header header header" auto ". loader ." auto "start content end" 1fr "footer footer footer" auto / auto 1fr auto;
    }
  }
}

@layer utilities {
  .fabric-panelGroup {
    & > .fabric-panel {
      &[data-collapsed="true"] {
        flex: 0 0 auto;
      }

      &[data-collapsed="false"] {
        flex: 1 1 auto;
        min-height: 15rem;

        [data-ref="panelCollapse"] {
          pointer-events: none;
          color: var(--color-tint);
          opacity: 0.25;
        }
      }
    }

    & > .fabric-panel:not(:first-child) {
      border-start-start-radius: 0;
      border-start-end-radius: 0;
    }

    & > .fabric-panel:not(:last-child) {
      border-bottom: 1px solid var(--border-color-soft);
      border-end-start-radius: 0;
      border-end-end-radius: 0;
    }
  }

  [data-ref="asideBody"] > .fabric-panelGroup > .fabric-panel {
    border-radius: 0;
    outline: 0;
  }
}