/* ── Submit Report page (redesign) ─────────────────────────────────
   All styles are scoped under `.upload-v2` so this file cannot leak
   into the surrounding app shell (sidebar / topbar live in base.html).
   ----------------------------------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');

.upload-v2 {
  /* Local design tokens — mapped onto the project palette in style.css.
     Keeping a local layer means we can tweak the upload page without
     touching globals, while still inheriting the app's color identity. */
  --u-surface:     var(--bg-card,           #30302e);
  --u-surface-2:   var(--bg-input,          #1f1f1f);
  --u-surface-3:   var(--bg-hover,          #2a2a2a);
  --u-line:        var(--border-color,      #30302e9e);
  --u-line-strong: var(--border-light,      #3f3f3f);
  --u-text:        var(--text-primary,      #f5f5f5);
  --u-text-2:      var(--text-secondary,    #a3a3a3);
  --u-text-3:      var(--text-muted,        #737373);
  --u-accent:      var(--color-primary,     #6b7280);
  --u-accent-2:    var(--color-primary-dark,#4b5563);
  --u-accent-soft: color-mix(in oklab, var(--u-accent) 18%, transparent);
  --u-accent-ring: color-mix(in oklab, var(--u-accent) 35%, transparent);
  --u-ok:          var(--color-success,     #4CAF50);
  --u-ok-soft:     color-mix(in oklab, var(--u-ok) 18%, transparent);
  --u-warn:        var(--color-warning,     #ffc107);
  --u-warn-soft:   color-mix(in oklab, var(--u-warn) 18%, transparent);
  --u-err:         var(--color-danger,      #e53e3e);
  --u-err-soft:    color-mix(in oklab, var(--u-err) 18%, transparent);
  --u-r: 12px;
  --u-r-lg: 16px;

  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 8px 4px 40px;
  color: var(--u-text);
  font-family: 'Manrope', system-ui, sans-serif;
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.upload-v2 *,
.upload-v2 *::before,
.upload-v2 *::after { box-sizing: border-box; }

.upload-v2::before {
  content: '';
  position: absolute;
  inset: -40px -40px auto auto;
  width: 1100px;
  height: 540px;
  background: radial-gradient(1100px 540px at 80% 0%, color-mix(in oklab, var(--u-accent) 10%, transparent), transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.upload-v2 > * { position: relative; z-index: 1; }

.upload-v2 .mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }

.upload-v2 button {
  font-family: inherit;
  cursor: pointer;
  border: 0;
  background: none;
  color: inherit;
}

.upload-v2 ::selection { background: var(--u-accent-soft); color: #fff; }

/* Breadcrumbs */
.upload-v2__crumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--u-text-3);
  font-size: 12.5px;
  margin-bottom: 18px;
}
.upload-v2__crumbs .sep { opacity: .4; }
.upload-v2__crumbs .here { color: var(--u-text-2); }

/* Page head */
.upload-v2__page-head {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 32px;
  margin-bottom: 28px;
  text-align: left;
  justify-content: space-between;
}
.upload-v2__page-head h1 {
  font-size: 30px;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin: 0 0 8px;
  font-weight: 700;
  color: var(--u-text);
  text-align: left;
}
.upload-v2__lede {
  color: var(--u-text-2);
  font-size: 14.5px;
  margin: 0 0 10px;
  text-align: left;
}

.upload-v2__template-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: #fde68a;
  background: rgba(120, 53, 15, 0.5);
  border: 1px solid rgba(245, 158, 11, 0.7);
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
  padding: 10px 14px;
  margin: 0;
  line-height: 1.5;
  text-align: left;

}
.upload-v2__template-note i {
  margin-top: 2px;
  flex-shrink: 0;
  color: #f59e0b;
}
.upload-v2__head-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
.upload-v2__step-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 8px;
  border-radius: 999px;
  background: var(--u-accent-soft);
  border: 1px solid color-mix(in oklab, var(--u-accent) 30%, transparent);
  color: color-mix(in oklab, var(--u-accent) 80%, #fff 30%);
  font-size: 12px;
  font-weight: 600;
}
.upload-v2__step-pill .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--u-accent);
}
.upload-v2__tiny { font-size: 11.5px; color: var(--u-text-3); }

/* Selectors row — same column tracks as .upload-v2__body-grid so the
   two inputs line up with the Requirements card and drop zone below. */
.upload-v2__selectors {
  display: grid;
  grid-template-columns: 5fr 6fr;
  gap: 18px;
  margin-bottom: 18px;
}
.upload-v2__field label {
  display: block;
  font-size: 12px;
  color: var(--u-text-2);
  margin-bottom: 8px;
  letter-spacing: 0.01em;
}
.upload-v2 .select {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--u-surface);
  border: 1px solid var(--u-line-strong);
  border-radius: var(--u-r);
  padding: 0 14px;
  height: 48px;
  transition: border-color .15s, background .15s;
}
.upload-v2 .select:hover { border-color: rgba(255, 255, 255, 0.16); }
.upload-v2 .select:focus-within {
  border-color: var(--u-accent);
  box-shadow: 0 0 0 3px var(--u-accent-ring);
}
/* Heavy specificity so we win over the global .upload-select rules. */
.upload-v2 .select select,
.upload-v2 .select select.upload-select {
  appearance: none;
  -webkit-appearance: none;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  color: var(--u-text) !important;
  font: 600 14px Manrope, sans-serif !important;
  width: 100%;
  height: 100%;
  padding: 0 24px 0 0 !important;
  cursor: pointer;
}
.upload-v2 .select select option { background: #1a1a25; color: var(--u-text); }
.upload-v2 .select select optgroup {
  background: #1a1a25;
  color: var(--u-text-2);
  font-weight: 700;
}
.upload-v2 .select .chev {
  position: absolute;
  right: 14px;
  color: var(--u-text-3);
  pointer-events: none;
  font-size: 11px;
}
/* Body grid */
.upload-v2__body-grid {
  display: grid;
  grid-template-columns: 5fr 6fr;
  gap: 18px;
  align-items: stretch;
}
.upload-v2__card {
  background: var(--u-surface);
  border: 1px solid var(--u-line);
  border-radius: var(--u-r-lg);
  padding: 22px;
}
.upload-v2__card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.upload-v2__card-head h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.005em;
  color: var(--u-text);
}
.upload-v2__card-head .icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--u-accent-soft);
  color: color-mix(in oklab, var(--u-accent) 85%, #fff 15%);
  display: grid;
  place-items: center;
}

/* Requirements list */
.upload-v2__req-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.upload-v2__req-row {
  display: grid;
  grid-template-columns: 132px 1fr;
  gap: 14px;
  padding: 12px 4px;
  border-top: 1px dashed var(--u-line);
  font-size: 13.5px;
}
.upload-v2__req-row:first-child { border-top: 0; }
.upload-v2__req-key {
  color: var(--u-text-3);
  font-weight: 500;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.06em;
  padding-top: 2px;
}
.upload-v2__req-val {
  color: var(--u-text);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
/* Download-template CTA — one shared look for the header button and the
   in-card one under "Report Requirements". Raised surface + strong border
   + lift/glow on hover so it reads as clickable, not as a flat label. */
.upload-v2__template-btn,
.upload-v2__req-download {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 16px 9px 10px;
  border-radius: 10px;
  background:
    linear-gradient(180deg,
      color-mix(in oklab, var(--u-surface-3) 92%, #fff 8%),
      var(--u-surface-3));
  border: 1px solid var(--u-line-strong);
  box-shadow:
    0 1px 0 color-mix(in oklab, #fff 7%, transparent) inset,
    0 2px 6px rgba(0, 0, 0, 0.22);
  color: var(--u-text);
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s,
              transform 0.12s;
}
.upload-v2__template-btn { margin-top: 4px; }
.upload-v2__req-download { margin-top: 10px; }

/* Icon sits in its own accent chip — gives the control a hit-target shape
   and a spot of color without filling the whole button. */
.upload-v2__template-btn .fa,
.upload-v2__req-download .fa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 7px;
  background: var(--u-accent-soft);
  border: 1px solid var(--u-accent-ring);
  font-size: 12px;
  transition: background 0.15s, border-color 0.15s, transform 0.12s;
}

.upload-v2__template-btn:hover,
.upload-v2__req-download:hover {
  background: linear-gradient(180deg,
    color-mix(in oklab, var(--u-accent) 16%, var(--u-surface-3)),
    color-mix(in oklab, var(--u-accent) 8%, var(--u-surface-3)));
  border-color: color-mix(in oklab, var(--u-accent) 55%, var(--u-line-strong));
  box-shadow:
    0 1px 0 color-mix(in oklab, #fff 9%, transparent) inset,
    0 4px 12px rgba(0, 0, 0, 0.3),
    0 0 0 3px var(--u-accent-soft);
  color: var(--u-text);
  transform: translateY(-1px);
  text-decoration: none;
}
.upload-v2__template-btn:hover .fa,
.upload-v2__req-download:hover .fa {
  background: color-mix(in oklab, var(--u-accent) 32%, transparent);
  border-color: color-mix(in oklab, var(--u-accent) 60%, transparent);
  transform: translateY(1px);
}

.upload-v2__template-btn:active,
.upload-v2__req-download:active {
  transform: translateY(0);
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.28) inset,
    0 0 0 3px var(--u-accent-soft);
}

.upload-v2__template-btn:focus-visible,
.upload-v2__req-download:focus-visible {
  outline: 2px solid var(--u-accent);
  outline-offset: 2px;
}

.upload-v2__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border-radius: 6px;
  background: var(--u-surface-3);
  color: var(--u-text-2);
  font-size: 11.5px;
  font-weight: 600;
  border: 1px solid var(--u-line);
}
.upload-v2__badge.accent {
  background: var(--u-accent-soft);
  color: color-mix(in oklab, var(--u-accent) 85%, #fff 15%);
  border-color: color-mix(in oklab, var(--u-accent) 25%, transparent);
}

/* Drop zone */
.upload-v2__drop {
  position: relative;
  min-height: 340px;
  border-radius: var(--u-r-lg);
  background:
    radial-gradient(600px 200px at 50% 0%, color-mix(in oklab, var(--u-accent) 6%, transparent), transparent 60%),
    var(--u-surface);
  border: 1.5px dashed var(--u-line-strong);
  transition: border-color .2s, background .2s, transform .15s;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.upload-v2__drop.drag {
  border-color: var(--u-accent);
  background:
    radial-gradient(600px 240px at 50% 0%, color-mix(in oklab, var(--u-accent) 14%, transparent), transparent 60%),
    var(--u-surface);
}
.upload-v2__drop.has-file {
  border-style: solid;
  border-color: var(--u-line-strong);
}
.upload-v2__drop.error {
  border-color: var(--u-err);
  background: radial-gradient(600px 240px at 50% 0%, var(--u-err-soft), transparent 60%), var(--u-surface);
}

.upload-v2__drop-input { display: none; }

.upload-v2__drop-empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 32px;
  text-align: center;
}
.upload-v2__glyph {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in oklab, var(--u-accent) 18%, transparent), color-mix(in oklab, var(--u-accent) 6%, transparent));
  border: 1px solid color-mix(in oklab, var(--u-accent) 25%, transparent);
  display: grid;
  place-items: center;
  color: var(--u-accent);
  box-shadow: 0 8px 24px color-mix(in oklab, var(--u-accent) 20%, transparent);
  font-size: 26px;
}
.upload-v2__drop-empty .h {
  font-weight: 700;
  font-size: 16px;
  letter-spacing: -0.01em;
}
.upload-v2__drop-empty .sub {
  color: var(--u-text-2);
  font-size: 13px;
  margin-top: 4px;
}
.upload-v2__formats {
  display: flex;
  gap: 8px;
  margin-top: 6px;
}
.upload-v2__browse {
  margin-top: 6px;
  padding: 10px 16px;
  border-radius: 10px;
  background: var(--u-accent);
  color: var(--accent-ink);
  font-weight: 700;
  font-size: 13.5px;
  border: 1px solid color-mix(in oklab, var(--u-accent) 60%, #000);
  box-shadow: 0 6px 18px color-mix(in oklab, var(--u-accent) 30%, transparent);
}
.upload-v2__browse:hover {
  background: var(--color-primary-hover, #9ca3af);
  color: var(--accent-ink);
}

/* File card */
.upload-v2__file-card {
  margin: 18px;
  padding: 16px;
  background: var(--u-surface-2);
  border: 1px solid var(--u-line);
  border-radius: var(--u-r);
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.upload-v2__file-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.upload-v2__file-ico {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: linear-gradient(180deg,
    color-mix(in oklab, var(--u-ok) 80%, #fff 0%),
    color-mix(in oklab, var(--u-ok) 60%, #000 25%));
  color: #0e1a12;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 11px;
  flex-shrink: 0;
  letter-spacing: 0.04em;
}
.upload-v2__file-ico--err {
  background: linear-gradient(180deg,
    color-mix(in oklab, var(--u-err) 85%, #fff 5%),
    color-mix(in oklab, var(--u-err) 60%, #000 20%));
  color: #fff;
}
.upload-v2__file-meta { flex: 1; min-width: 0; }
.upload-v2__file-name {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--u-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.upload-v2__file-sub {
  display: flex;
  gap: 10px;
  align-items: center;
  color: var(--u-text-3);
  font-size: 11.5px;
  margin-top: 4px;
}
.upload-v2__file-sub .ok {
  color: color-mix(in oklab, var(--u-ok) 85%, #fff 15%);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.upload-v2__file-actions { display: flex; gap: 6px; }
.upload-v2__icon-btn {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: var(--u-surface);
  border: 1px solid var(--u-line);
  color: var(--u-text-2);
}
.upload-v2__icon-btn:hover {
  color: var(--u-text);
  background: var(--u-surface-3);
}

.upload-v2__progress {
  height: 6px;
  background: var(--u-surface-3);
  border-radius: 999px;
  overflow: hidden;
  position: relative;
}
.upload-v2__progress > div {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--u-accent), var(--color-primary-hover, #9ca3af));
  border-radius: 999px;
  transition: width .15s linear;
  position: relative;
}
.upload-v2__progress > div::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.25), transparent);
  animation: uploadV2Sheen 1.4s linear infinite;
}
@keyframes uploadV2Sheen {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
.upload-v2__progress-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--u-text-2);
  font-size: 12px;
}

.upload-v2__hint {
  padding: 0 18px 18px;
  margin-top: auto;
  color: var(--u-text-3);
  font-size: 12.5px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.upload-v2__hint b { color: var(--u-text-2); font-weight: 600; }

.upload-v2__validation {
  margin: 0 18px 18px;
  padding: 12px 14px;
  border-radius: 10px;
  background: var(--u-ok-soft);
  border: 1px solid color-mix(in oklab, var(--u-ok) 30%, transparent);
  color: color-mix(in oklab, var(--u-ok) 70%, #fff 30%);
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
}
.upload-v2__validation.err {
  background: var(--u-err-soft);
  border-color: color-mix(in oklab, var(--u-err) 30%, transparent);
  color: color-mix(in oklab, var(--u-err) 75%, #fff 25%);
}

/* Footer actions */
.upload-v2__actions {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--u-line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.upload-v2__status {
  color: var(--u-text-3);
  font-size: 12.5px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.upload-v2__status .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--u-text-3);
}
.upload-v2__status.live .dot {
  background: var(--u-accent);
  box-shadow: 0 0 0 4px var(--u-accent-soft);
}
.upload-v2__status.ok .dot {
  background: var(--u-ok);
  box-shadow: 0 0 0 4px var(--u-ok-soft);
}
.upload-v2__status.err .dot {
  background: var(--u-err);
  box-shadow: 0 0 0 4px var(--u-err-soft);
}
.upload-v2__actions .right { display: flex; gap: 10px; }

.upload-v2__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  font-weight: 600;
  font-size: 13.5px;
  border: 1px solid var(--u-line-strong);
  background: var(--u-surface);
  color: var(--u-text);
  transition: background .15s, border-color .15s, transform .05s;
  text-decoration: none;
}
.upload-v2__btn:hover {
  background: var(--u-surface-2);
  border-color: rgba(255, 255, 255, 0.16);
  color: var(--u-text);
  text-decoration: none;
}
.upload-v2__btn:active { transform: translateY(1px); }
.upload-v2__btn--ghost {
  background: transparent;
  border-color: transparent;
  color: var(--u-text-2);
}
.upload-v2__btn--ghost:hover {
  background: var(--u-surface);
  color: var(--u-text);
  border-color: var(--u-line);
}
.upload-v2__btn--primary {
  background: linear-gradient(180deg, var(--u-accent), var(--u-accent-2));
  border-color: color-mix(in oklab, var(--u-accent) 70%, #000);
  color: var(--accent-ink);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12) inset, 0 6px 20px color-mix(in oklab, var(--u-accent) 30%, transparent);
}
.upload-v2__btn--primary:hover {
  background: linear-gradient(180deg, var(--color-primary-hover, #9ca3af), var(--u-accent));
  color: var(--accent-ink);
  filter: none;
}
.upload-v2__btn--primary[disabled],
.upload-v2__btn--primary:disabled {
  background: var(--u-surface-2);
  color: var(--u-text-3);
  border-color: var(--u-line);
  box-shadow: none;
  cursor: not-allowed;
  filter: none;
}

/* Field errors (server-rendered) */
.upload-v2__field-error {
  font-size: 12px;
  color: color-mix(in oklab, var(--u-err) 80%, #fff 20%);
  margin: 6px 0 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.upload-v2__error-banner {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: 10px;
  background: var(--u-err-soft);
  border: 1px solid color-mix(in oklab, var(--u-err) 30%, transparent);
  color: color-mix(in oklab, var(--u-err) 75%, #fff 25%);
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
}

.upload-v2__pop { animation: uploadV2Pop .25s ease both; }
@keyframes uploadV2Pop {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* Responsive */
@media (max-width: 980px) {
  .upload-v2__body-grid { grid-template-columns: 1fr; }
  .upload-v2__selectors { grid-template-columns: 1fr; gap: 10px; }
  .upload-v2__page-head { flex-direction: column; align-items: flex-start; gap: 12px; }
  .upload-v2__head-meta { align-items: flex-start; }
}


#retryBtn {
  display: flex;
  justify-content: center;
}

/* ── Light theme overrides ─────────────────────────────────────────
   ponytail: light-mode override block. The --u-* tokens read from the
   core globals (var(--bg-card) etc.), so chrome follows the shipped
   light theme automatically — we only flip the hardcoded literals that
   bypass those tokens and the dark-idiom tricks. Dark block above is
   untouched and remains the default.
   ----------------------------------------------------------------- */

/* ::selection — dark used #fff text on the accent wash; on a light wash
   dark text reads better. */
[data-bs-theme="light"] .upload-v2 ::selection { color: #18181b; }

/* Template note — dark used a brown fill (rgba(120,53,15,.5)) with pale
   amber text (#fde68a). On white that inverts: a light amber tint with
   dark-amber text. */
[data-bs-theme="light"] .upload-v2__template-note {
  color: #92400e;
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.45);
  border-left-color: #f59e0b;
}

/* Select hover — dark lightened the border with a white overlay; on
   light, darken with a black overlay instead. */
[data-bs-theme="light"] .upload-v2 .select:hover {
  border-color: rgba(0, 0, 0, 0.16);
}

/* Native dropdown list — dark used a near-black option background. */
[data-bs-theme="light"] .upload-v2 .select select option,
[data-bs-theme="light"] .upload-v2 .select select optgroup {
  background: #ffffff;
}

/* Progress sheen — soften the white streak so it doesn't blow out on a
   light track, but keep the same animated highlight idea. */
[data-bs-theme="light"] .upload-v2__progress > div::after {
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.55), transparent);
}

/* Footer button hover — dark lightened the border with a white overlay;
   on light, darken with a black overlay instead. */
[data-bs-theme="light"] .upload-v2__btn:hover {
  border-color: rgba(0, 0, 0, 0.16);
}

/* Accent-filled primary CTAs — --u-accent (=--color-primary #6b7280) is
   never redefined under light, so the gray fill stays gray while --u-text
   flips to dark ink. Dark-ink-on-gray drops below 4.5:1 for these bold
   labels; white reads better on the gray fill here. */
[data-bs-theme="light"] .upload-v2__btn--primary,
[data-bs-theme="light"] .upload-v2__btn--primary:hover {
  color: #18181b;
}

/* Download CTAs on light — the dark-mode drop shadow and the white inset
   sheen both read as grime on paper. Soften the shadow, drop the sheen. */
[data-bs-theme="light"] .upload-v2__template-btn,
[data-bs-theme="light"] .upload-v2__req-download {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
  border-color: rgba(0, 0, 0, 0.14);
}
[data-bs-theme="light"] .upload-v2__template-btn:hover,
[data-bs-theme="light"] .upload-v2__req-download:hover {
  box-shadow:
    0 3px 8px rgba(0, 0, 0, 0.12),
    0 0 0 3px var(--u-accent-soft);
  border-color: color-mix(in oklab, var(--u-accent) 45%, transparent);
}

/* Choose file button — dark label in light mode. */
[data-bs-theme="light"] .upload-v2__browse,
[data-bs-theme="light"] .upload-v2__browse:hover {
  color: var(--u-text);
}

/* Selected file name — dark text in light mode. Hardcoded + !important:
   the var(--u-text) chain resolves correctly on paper but something in the
   cascade was still winning, so force it directly rather than re-assert
   the same variable reference. */
[data-bs-theme="light"] .upload-v2__file-name {
  color: #18181b !important;
}

/* Accent text on the pale soft wash — the color-mix(accent N%, #fff M%)
   text colors mix the gray TOWARD white, so on the light --u-accent-soft
   wash they fall well below 4.5:1. Drop them to dark ink instead so they
   read against the pale wash. Covers: step-pill, badge.accent,
   card-head .icon. */
[data-bs-theme="light"] .upload-v2__step-pill,
[data-bs-theme="light"] .upload-v2__badge.accent,
[data-bs-theme="light"] .upload-v2__card-head .icon {
  color: var(--u-text);
}