sul-dlss/argo

.show-document {
  $button-width: 11rem;
  $external-link-button-width: 9rem;

  .document-header {
    border-bottom: 1px solid $gray-300;

  }

  .search-links {
    border-bottom: $pagination-border-width solid $pagination-border-color;
    margin-bottom: 1em;
    padding-bottom: 1em;

    .pagination-search-widgets {
      border-bottom-width: 0px;
      margin-bottom: 0em;
      padding-bottom: 0em;
    }
  }

  .object-type {
    width: 15rem;
    height: 2.4rem;

    &.object-type-apo {
      background-color: $sky-light;
    }

    &.object-type-collection {
      background-color: $fog;
    }

    &.object-type-item {
      background-color: $illuminating-light;
    }

    &.object-type-virtual-object {
      background-color: $bay-light;
    }
  }

  .argo-show-btn-group {
    .btn {
      min-width: $button-width;
      margin-right: .5rem;
      margin-bottom: .5rem;

      &.small {
        @extend .small;
      }
    }
  }

  .full-view-links {
    padding: 20px;
  }

  .button-header {
    font-size: 12pt;
    font-weight: bold;
  }

  .external-link-button {
    margin-right: .5rem;
    margin-bottom: .5rem;
    width: $external-link-button-width;
    @extend .btn;
    @extend .btn-outline-primary;

    &.disabled {
      color: $btn-link-disabled-color;
      border-color: $btn-link-disabled-color;
      opacity: $btn-disabled-opacity;
    }
  }

  .blacklight-item {
    margin-top: 1rem;
  }

  .open-close {
    width: 2rem;
    float: left;

    .btn {
      font-size: x-large;
      color: $color-cardinal-red;
    }
  }

  .document-title-heading {
    margin-left: 2rem;
  }

  /* content metadata section */
  .resource-list {
    list-style-type: none;
    padding: 0;

    .resource {
      background-color: $gray-200;
      padding: 1rem;
      margin-bottom: 1rem;

      .dl-horizontal {
        dt {
          clear: left;
          float: left;
          width: 7rem;
        }

        dd {
          margin-left: 8rem;
        }

        dt:after {
          content: ":";
        }

        dd:before,
        dd:after,
          {
          display: table;
          content: " ";
        }

        dd:after {
          clear: both;
        }
      }

      .resource-files {
        background-color: $body-bg;
        margin-left: .5rem;
        margin-right: .5rem;

        tr {
          td {
            max-width: 30vw;
            text-overflow: ellipsis;
            overflow: hidden;

            a {
              white-space: nowrap;
            }
          }
        }
      }
    }
  }

  .table {
    border: 1px solid $silver-sand;
  }

  .header {
    font-weight: 700;
    font-size: x-large;
    line-height: 1.5;
    padding: 0.25rem;
  }

  .table-light {
    --bs-table-bg: #{$table-border-color};
    @extend .header;
  }

  .caption-header > caption {
    caption-side: top;
    @extend .header;
    background-color: $silver-sand;
    color: $body-color;
  }

  #filehierarchy {
    ul {
      list-style-type: none;

      a:before {
        display: inline-block;
        content: "";
        flex-shrink: 0;
        width: 1rem;
        height: 1rem;
        margin-right: 0rem;
        background-repeat: no-repeat;
        background-size: 1rem 1rem;
      }

      a:not(.collapsed):before {
          background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-chevron-down' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>");
      }

      a.collapsed:before {
        background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-chevron-right' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/></svg>");
      }
    }
  }
}