/**
 * @file
 * Styling for the tdresource hierarchy tree and generated file-type icons.
 */

.tdresources-tree-wrapper {
  margin-top: 0.5em;
}

.tdresources-tree {
  max-height: 20em;
  overflow-y: auto;
  border: 1px solid #ccc;
  padding: 0.5em;
}

.tdresources-tree-branch > summary {
  cursor: pointer;
}

.tdresources-tree-leaf {
  margin-left: 1.5em;
}

.tdresources-tree-link--active {
  font-weight: bold;
  text-decoration: underline;
}

.tdresources-intro-counter {
  font-style: italic;
}

.tdresources-intro-counter--over {
  color: #b91c1c;
  font-weight: bold;
}

/*
 * File-type icon: a small colored "document with folded corner" SVG,
 * labelled with the extension, styled per extension below. Colors are
 * applied to the SVG shapes via currentColor, so overriding
 * .tdresources-file-icon--{extension}'s `color` is enough for sites
 * that want different colors without touching the SVG markup.
 */
.tdresources-file-icon {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  width: 1.4em;
  height: 1.6em;
  color: #6b7280;
}

.tdresources-file-icon svg {
  width: 100%;
  height: 100%;
}

.tdresources-file-icon-body {
  fill: currentColor;
}

.tdresources-file-icon-fold {
  fill: rgb(255 255 255 / 40%);
}

.tdresources-file-icon-label {
  fill: #fff;
  font-size: 8px;
  font-family: sans-serif;
  font-weight: bold;
}

.tdresources-file-icon--pdf {
  color: #b91c1c;
}

.tdresources-file-icon--doc,
.tdresources-file-icon--docx {
  color: #1d4ed8;
}

.tdresources-file-icon--xls,
.tdresources-file-icon--xlsx {
  color: #15803d;
}

.tdresources-file-icon--ppt,
.tdresources-file-icon--pptx {
  color: #c2410c;
}

.tdresources-parent-link {
  font-style: italic;
  margin-bottom: 0.5em;
  /* Contains the floated .tdresources-add-child-link below, so the
   * following children table doesn't creep up alongside it. */
  overflow: hidden;
}

.tdresources-children-table {
  width: 100%;
  border-collapse: collapse;
}

.tdresources-children-table th,
.tdresources-children-table td {
  padding: 0.25em 0.5em;
  border-bottom: 1px solid #e5e7eb;
  text-align: left;
}

/*
 * "Add child" link: same line as the "Up to" parent link, right
 * aligned. Added client-side by tdresources.reorder.js, for users who
 * may manage the hierarchy.
 */
.tdresources-add-child-link {
  float: right;
  font-style: normal;
}

/*
 * Move-up/move-down column: added client-side by
 * tdresources.reorder.js, for users who may manage the hierarchy.
 */
.tdresources-move-cell {
  white-space: nowrap;
}

.tdresources-move-link {
  display: inline-block;
  padding: 0 0.25em;
  text-decoration: none;
  line-height: 1;
}