/* Streamlit-like uploader styling - KB3 Brand Colors */
.st-upload {
  --bg: #ffffff;
  --bg-subtle: #F6F5F2;  /* Warm White */
  --border: #E2DFD7;     /* Warm White Shade 2 */
  --text: #283981;       /* Dark Blue */
  --text-muted: #32469C; /* Dark Blue Tint */
  --accent: #0295E5;     /* Blue */
  --chip-bg: #EAE8E3;    /* Warm White Shade 1 */
}

.st-upload-label {
  color: var(--text);
  font-weight: 600;
}

.st-upload-dropzone {
  background: var(--bg);
  border: 2px dashed var(--border);
  border-radius: 0.75rem;
  padding: 1rem 1rem;
  cursor: pointer;
  transition: border-color 120ms ease, box-shadow 120ms ease;
}

.st-upload-dropzone:hover {
  border-color: var(--accent);
}

.st-upload-dropzone.st-dragover {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 20%, transparent);
}

.st-upload-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.st-upload-left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--text);
}

.st-upload-icon {
  width: 28px;
  height: 28px;
  color: var(--text-muted);
}

.st-upload-title {
  color: var(--text);
  font-weight: 600;
}

.st-upload-subtitle {
  color: var(--text-muted);
  font-size: 0.875rem;
}

.st-upload-browse {
  background: var(--chip-bg);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 0.5rem;
  padding: 0.375rem 0.75rem;
  font-weight: 600;
  font-size: 0.875rem;
}

.st-upload-browse:hover {
  filter: brightness(1.05);
}

.st-upload-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.5rem;
}

.st-upload-filename {
  color: var(--text-muted);
  font-size: 0.875rem;
}

.st-upload-submit {
  background: #0295E5;  /* KB3 Blue */
  color: white;
  border-radius: 0.5rem;
  padding: 0.375rem 0.75rem;
  font-weight: 600;
  font-size: 0.875rem;
  border: none;
}

.st-upload-submit:hover {
  filter: brightness(1.05);
}

.st-upload-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}