/* R2-FI-01 — stable Files loading and bounded, actionable failure states. */
.files-tree-state {
  min-height: 8.5rem;
  display: grid;
  align-content: start;
  gap: 0.65rem;
  padding: 0.55rem;
}

.files-tree-loading {
  padding-top: 0.75rem;
}

.files-tree-skeleton {
  width: 100%;
  height: 2rem;
  border-radius: 0.3rem;
  background: linear-gradient(
    90deg,
    var(--ui-hover) 0 38%,
    var(--ui-raised) 50%,
    var(--ui-hover) 62% 100%
  );
  background-size: 220% 100%;
  animation: files-tree-loading 1.2s ease-in-out infinite;
}

.files-tree-skeleton:nth-of-type(2) { width: 86%; }
.files-tree-skeleton:nth-of-type(3) { width: 72%; }

.files-tree-failure > div {
  display: grid;
  gap: 0.55rem;
  padding: 0.8rem;
  border: 1px solid var(--ui-border);
  border-radius: 0.45rem;
  background: var(--ui-raised);
  color: var(--ui-text-soft);
  font-size: 0.75rem;
}

.files-tree-failure strong { color: var(--ui-text); }
.files-tree-failure p { margin: 0; line-height: 1.45; }
.files-tree-diagnostic {
  color: var(--ui-muted);
  font: 0.65rem/1.3 ui-monospace, Menlo, monospace;
}
.files-tree-retry,
.files-search-retry {
  width: max-content;
  min-height: 2rem;
  font-size: 0.75rem;
}
.files-search-retry { margin: 0 0.55rem 0.55rem; }

/* Completion announcements overlay the stable workspace instead of resizing it. */
.files-toast:not(:empty) {
  position: absolute;
  z-index: 20;
  right: 0.5rem;
  bottom: 0.5rem;
  left: 0.5rem;
  margin: 0;
  box-shadow: var(--ui-shadow-sm);
}

@keyframes files-tree-loading {
  to { background-position: -220% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .files-tree-skeleton {
    animation: none;
    background: var(--ui-hover);
  }
}

@media (max-width: 820px) {
  /* T319: phone stack owns layout via .files-phone-stack; keep failure padding. */
  .files-split:not(.files-phone-stack) {
    grid-template-rows: minmax(15rem, 42vh) minmax(12rem, 1fr);
  }
  .files-tree-failure > div {
    gap: 0.4rem;
    padding: 0.6rem;
    max-width: 100%;
    box-sizing: border-box;
  }
  .files-tree-retry,
  .files-search-retry {
    min-width: 44px;
    min-height: 44px;
    box-sizing: border-box;
  }
  .files-tree-skeleton {
    height: 44px;
    min-height: 44px;
  }
}
