/* ==========================================================================
   UPLOAD PAGE
   ========================================================================== */

.upload-main{
  padding-bottom: 80px;
  max-width: 640px;
}

.upload-notice{
  background: rgba(255, 176, 32, .08);
  border: 1px solid var(--amber);
  border-radius: var(--radius);
  padding: 18px 20px;
  margin-bottom: 30px;
  font-size: .9rem;
  color: var(--text);
}
.upload-notice strong{ color: var(--amber); }
.upload-notice p{ margin: 8px 0 0; color: var(--text-dim); font-size: .85rem; }

.upload-tabs{
  display: flex; gap: 8px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--line);
}
.upload-tab{
  font-family: var(--f-mono);
  font-size: .8rem; letter-spacing: .06em; text-transform: uppercase;
  padding: 12px 4px;
  margin-right: 20px;
  background: none; border: none;
  color: var(--text-faint);
  position: relative;
  transition: color .2s ease;
}
.upload-tab:hover{ color: var(--text-dim); }
.upload-tab.active{ color: var(--cyan); }
.upload-tab.active::after{
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px;
  height: 2px; background: var(--cyan); box-shadow: 0 0 8px var(--cyan);
}

.upload-form{
  display: grid; gap: 18px;
  padding-bottom: 20px;
}
.upload-form .field label{
  display: block;
  font-family: var(--f-mono); font-size: .7rem; letter-spacing: .08em;
  text-transform: uppercase; color: var(--text-faint);
  margin-bottom: 8px;
}
.upload-form input[type="text"],
.upload-form select,
.upload-form textarea{
  width: 100%;
  background: var(--bg-elev);
  border: 1px solid var(--line);
  color: var(--text);
  padding: 12px 14px;
  border-radius: var(--radius);
  font-family: var(--f-body);
  font-size: .9rem;
}
.upload-form input[type="text"]:focus,
.upload-form select:focus,
.upload-form textarea:focus{ border-color: var(--cyan); }

.upload-form input[type="file"]{
  width: 100%;
  font-family: var(--f-body);
  font-size: .85rem;
  color: var(--text-dim);
  padding: 10px 0;
}
.upload-form .hint{
  display: block; margin-top: 6px;
  font-family: var(--f-mono); font-size: .68rem; color: var(--text-faint);
}

.rights-check{
  display: flex; align-items: flex-start; gap: 10px;
  font-size: .82rem; color: var(--text-dim);
  cursor: pointer;
  line-height: 1.4;
}
.rights-check input{ margin-top: 3px; flex-shrink: 0; }

.upload-submit{
  justify-self: start;
  padding: 13px 30px;
  border: 1px solid var(--cyan);
  color: var(--cyan);
  background: var(--cyan-soft);
  border-radius: var(--radius);
  font-family: var(--f-mono);
  font-size: .8rem; letter-spacing: .1em; text-transform: uppercase;
  transition: box-shadow .2s ease;
}
.upload-submit:hover{ box-shadow: 0 0 20px var(--cyan-soft); }
.upload-submit:disabled{
  opacity: .5; cursor: not-allowed; box-shadow: none;
}

.upload-status{
  font-family: var(--f-mono); font-size: .78rem;
  color: var(--text-dim);
  min-height: 1.2em;
}
.upload-status.ok{ color: var(--cyan); }
.upload-status.err{ color: var(--magenta); }