.admin-menu > summary {
  cursor: pointer;
  list-style-position: inside;
}

.admin-menu > summary:focus-visible {
  border-radius: 0.125rem;
  outline: 2px solid #93c5fd;
  outline-offset: 4px;
}

.dark .admin-menu > summary:focus-visible {
  outline-color: #60a5fa;
}

.dark .bg-white {
  background-color: #111827;
}

.dark .bg-gray-50 {
  background-color: #030712;
}

.dark .bg-gray-100 {
  background-color: #1f2937;
}

.dark .bg-gray-200 {
  background-color: #374151;
}

.dark .hover\:bg-gray-50:hover,
.dark .hover\:bg-gray-100:hover,
.dark .hover\:bg-gray-200:hover {
  background-color: #1f2937;
}

.dark .bg-green-50 {
  background-color: #052e16;
}

.dark .bg-green-100 {
  background-color: #14532d;
}

.dark .bg-yellow-50 {
  background-color: #422006;
}

.dark .bg-yellow-100 {
  background-color: #713f12;
}

.dark .bg-red-50 {
  background-color: #450a0a;
}

.dark .bg-red-100 {
  background-color: #7f1d1d;
}

.dark .text-gray-950,
.dark .text-gray-900,
.dark .text-gray-800,
.dark .text-gray-700 {
  color: #f3f4f6;
}

.dark .text-gray-600,
.dark .text-gray-500 {
  color: #d1d5db;
}

.dark .text-blue-700 {
  color: #93c5fd;
}

.dark .text-green-700,
.dark .text-green-800 {
  color: #bbf7d0;
}

.dark .text-yellow-700,
.dark .text-yellow-800,
.dark .text-yellow-900 {
  color: #fef08a;
}

.dark .text-red-600,
.dark .text-red-700,
.dark .text-red-800 {
  color: #fecaca;
}

.dark .border-gray-200,
.dark .border-gray-300 {
  border-color: #374151;
}

.dark .border-green-200,
.dark .border-green-300 {
  border-color: #15803d;
}

.dark .border-yellow-200,
.dark .border-yellow-300 {
  border-color: #a16207;
}

.dark .border-red-200,
.dark .border-red-300 {
  border-color: #b91c1c;
}

.dark .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.dark .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
  border-color: #1f2937;
}

.dark input,
.dark select,
.dark textarea {
  color-scheme: dark;
}

.mobile-card-list {
  display: grid;
}

.desktop-table {
  display: none;
}

@media (min-width: 64rem) {
  .mobile-card-list {
    display: none;
  }

  .desktop-table {
    display: block;
  }

  .admin-menu > .admin-menu-panel {
    display: none;
    top: 100%;
  }

  .admin-menu[open] > .admin-menu-panel,
  .admin-menu:hover > .admin-menu-panel,
  .admin-menu:focus-within > .admin-menu-panel {
    display: block;
  }
}

.tree ul {
  margin-left: 0.5rem;
  padding-left: 0.5rem;
  border-left: 1px dashed #d1d5db;
}

.dark .tree ul {
  border-left-color: #4b5563;
}

.tree li {
  list-style: none;
  color: #374151;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: normal;
}

.dark .tree li {
  color: #d1d5db;
}

.tree .dir {
  border-bottom: 1px solid transparent;
  color: #111827;
  text-decoration: none;
  transition: all 0.2s ease;
}

.dark .tree .dir {
  color: #f9fafb;
}

.tree .dir:hover {
  border-color: #e5e7eb;
  color: #111827;
}

.dark .tree .dir:hover {
  border-color: #4b5563;
  color: #ffffff;
}

.tree .dir,
.tree .dir > .dir {
  color: #111827;
  font-weight: bold;
}

.dark .tree .dir,
.dark .tree .dir > .dir {
  color: #f9fafb;
}

.tree-row {
  display: grid;
  grid-template-columns: 1.5rem minmax(0, 1fr);
  align-items: center;
  column-gap: 0.75rem;
  row-gap: 0.25rem;
  border-radius: 0.375rem;
  padding: 0.375rem 0.5rem;
}

.tree-name,
.tree-meta,
.tree-time {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  overflow-wrap: anywhere;
}

.tree-name {
  align-items: center;
  display: inline-flex;
  gap: 0.5rem;
}

.tree-meta,
.tree-time {
  grid-column: 2;
  text-align: left;
  color: #4b5563;
  font-weight: normal;
}

.dark .tree-meta,
.dark .tree-time {
  color: #d1d5db;
}

.tree-meta:empty,
.tree-time:empty {
  display: none;
}

@media (min-width: 48rem) {
  .tree ul {
    margin-left: 1rem;
    padding-left: 1rem;
  }

  .snapshot-tree {
    min-width: 56rem;
  }

  .tree-row {
    grid-template-columns: 1.5rem minmax(16rem, 1fr) 8rem 8rem 14rem;
    gap: 0.75rem;
  }

  .tree-meta,
  .tree-time {
    grid-column: auto;
    text-align: right;
  }
}


/* The icons
-------------------------------------------------------------- */

.tree li.file > .tree-row .tree-name:before,
.tree li.dir > .tree-row .tree-name:before {
  flex: 0 0 auto;
  content: "";
  height: 20px;
  width: 20px;
  background-repeat: no-repeat;
  /* file icon by default */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path fill='lightgrey' d='M85.714,42.857V87.5c0,1.487-0.521,2.752-1.562,3.794c-1.042,1.041-2.308,1.562-3.795,1.562H19.643 c-1.488,0-2.753-0.521-3.794-1.562c-1.042-1.042-1.562-2.307-1.562-3.794v-75c0-1.487,0.521-2.752,1.562-3.794 c1.041-1.041,2.306-1.562,3.794-1.562H50V37.5c0,1.488,0.521,2.753,1.562,3.795s2.307,1.562,3.795,1.562H85.714z M85.546,35.714 H57.143V7.311c3.05,0.558,5.505,1.767,7.366,3.627l17.41,17.411C83.78,30.209,84.989,32.665,85.546,35.714z' /></svg>");
  background-position: center 2px;
  background-size: 60% auto;
}

.tree li.dir > .tree-row .tree-name:before {
  /* dir icon if dir class is specified */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path fill='lightblue' d='M96.429,37.5v39.286c0,3.423-1.228,6.361-3.684,8.817c-2.455,2.455-5.395,3.683-8.816,3.683H16.071 c-3.423,0-6.362-1.228-8.817-3.683c-2.456-2.456-3.683-5.395-3.683-8.817V23.214c0-3.422,1.228-6.362,3.683-8.817 c2.455-2.456,5.394-3.683,8.817-3.683h17.857c3.422,0,6.362,1.228,8.817,3.683c2.455,2.455,3.683,5.395,3.683,8.817V25h37.5 c3.422,0,6.361,1.228,8.816,3.683C95.201,31.138,96.429,34.078,96.429,37.5z' /></svg>");
  background-position: center top;
  background-size: 75% auto;
}
