/* Upload button + panel (site/upload.js). Live site only, so it lives here
   rather than in dashboard.css, which run.py's local build inlines too. */

.upload-btn {
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--gold);
  background: rgba(224,196,104,0.08);
  border: 1px solid color-mix(in srgb, var(--gold) 55%, transparent);
  border-radius: 6px;
  padding: 0.45rem 0.9rem;
  cursor: pointer;
  display: inline-block;
  /* The bar's entry and the Upload page's call to action are links now, so they
     must not pick up the underline. */
  text-decoration: none;
}
.upload-btn:hover { background: rgba(224,196,104,0.16); box-shadow: 0 0 10px var(--gold-glow); }
.upload-btn:focus-visible, .upload-link:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

.upload-link {
  font: inherit;
  font-size: 0.85rem;
  color: var(--text-dim);
  background: none;
  border: none;
  padding: 0;
  text-decoration: underline;
  cursor: pointer;
}
.upload-link:hover { color: var(--gold); }

.upload-panel {
  max-width: 44rem;
  background: linear-gradient(165deg, var(--panel-2-glass) 0%, var(--panel-glass) 100%);
  border: 1px solid var(--panel-border);
  border-top-color: var(--gold-glow);
  border-radius: 10px;
  padding: 1.25rem 1.5rem;
}
.upload-panel h2 { color: var(--gold); margin-bottom: 0.75rem; }
.upload-panel p { margin-bottom: 0.75rem; line-height: 1.5; }
.upload-panel a { color: var(--gold); }
.upload-panel code {
  display: inline-block;
  max-width: 100%;
  overflow-wrap: anywhere;
  background: rgba(0,0,0,0.3);
  border: 1px solid var(--hairline);
  border-radius: 4px;
  padding: 0.2rem 0.45rem;
  font-size: 0.82rem;
  user-select: all;
}
.upload-note { color: var(--text-dim); font-size: 0.85rem; }
.upload-steps { margin: 0 0 0.75rem 1.4rem; line-height: 1.5; }
.upload-steps li { margin-bottom: 0.9rem; padding-left: 0.2rem; }
.upload-steps li::marker { color: var(--gold); font-weight: 700; }
.upload-steps strong { color: var(--text); }
/* The path and its Copy button read as one field. */
.upload-path { display: flex; align-items: stretch; margin-top: 0.4rem; max-width: 100%; }
.upload-panel .upload-path code {
  flex: 1 1 auto; min-width: 0; display: flex; align-items: center;
  border-radius: 4px 0 0 4px; border-right: none; padding: 0.4rem 0.6rem;
}
.upload-copy {
  font: inherit; font-size: 0.82rem; font-weight: 600; white-space: nowrap;
  color: var(--gold);
  background: rgba(224,196,104,0.10);
  border: 1px solid color-mix(in srgb, var(--gold) 55%, transparent);
  border-radius: 0 4px 4px 0;
  padding: 0 0.9rem;
  min-width: 5.5rem;
  cursor: pointer;
}
.upload-copy:hover { background: rgba(224,196,104,0.2); }
.upload-copy:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.upload-actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 0.5rem; }
/* Visually hidden but still reachable: the <label>s are the visible controls. */
.upload-input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; user-select: none; }
.upload-status:empty { display: none; }
.upload-status { color: var(--text); }