/* The cloud picker's modal: the same shell the rest of the site uses, plus the
   list of files a provider hands back. */

.cloud-box { max-width: 560px; }
.cloud-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.cloud-head h3 { margin: 0; font-size: 1.05rem; flex: 1 1 auto; }
.cloud-close {
  border: none; background: none; font-size: 1.4rem; line-height: 1; cursor: pointer;
  color: var(--muted); padding: 2px 6px;
}
.cloud-close:hover { color: var(--ink); }
.cloud-body { display: flex; flex-direction: column; gap: 10px; }

.cloud-keys { margin: 0; padding-left: 20px; font-size: .88rem; }
.cloud-keys code {
  background: var(--accent-soft); border-radius: 5px; padding: 1px 6px;
  font-size: .85rem;
}
.cloud-docs { font-size: .88rem; color: var(--accent-dark); }
.cloud-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; margin-top: 6px; }

.cloud-filter,
.cloud-url {
  width: 100%; font: inherit; font-size: .9rem; padding: 9px 12px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--white);
  color: var(--ink);
}
.cloud-list {
  max-height: min(46vh, 360px); overflow: auto; display: flex; flex-direction: column;
  gap: 2px; border: 1px solid var(--line); border-radius: 10px; padding: 6px;
}
.cloud-row {
  display: flex; align-items: center; gap: 10px; width: 100%; text-align: left;
  border: none; background: none; font: inherit; font-size: .9rem; cursor: pointer;
  padding: 9px 10px; border-radius: 8px; color: var(--ink);
}
.cloud-row:hover { background: var(--accent-soft); }
.cloud-name { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cloud-size { color: var(--muted); font-size: .82rem; white-space: nowrap; }
.cloud-row.is-busy { opacity: .55; pointer-events: none; }
.cloud-row.is-failed { color: var(--red); }

/* The sources row inside a tool's upload box: "or bring a file from" and the
   three providers, under the tool's own Choose button. */
.cloud-sources {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center;
  margin-top: 4px; padding-top: 14px; border-top: 1px solid var(--line); width: 100%;
}
.cloud-sources-cap { font-size: .82rem; color: var(--muted); margin-right: 2px; }
.cloud-source {
  display: inline-flex; align-items: center; gap: 7px; font: inherit; font-size: .82rem;
  padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--white); color: var(--ink); cursor: pointer;
  transition: border-color .12s, box-shadow .12s, color .12s;
}
.cloud-source:hover {
  border-color: var(--accent); color: var(--accent-dark); box-shadow: var(--shadow-sm);
}
.cloud-source i { font-size: 1.05rem; color: var(--accent); }