@import url("./design-system/components/generator-guide.css?v=793d9a2");
@import url("./design-system/adapters/upscale-editor-theme.css?v=793d9a2");
@import url("./upscale-editor-ux.css?v=793d9a2");

/* Generation Panel layout and behavior.
   Visual ownership lives in design-system/adapters/generation-panel-theme.css.
   The empty-folder helper is a shared component contract loaded here because
   this stylesheet is the common entrypoint for Image/Video/3D generator pages.
   The scoped Upscale editor adapter is imported here because upscale_editor.html
   consumes this layout directly instead of the generator route theme bundle. */

.generation-panel {
  border-radius: 28px;
  padding: 18px 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1 1 0%;
  min-height: 0;
  overflow: hidden;
}

.generation-panel__header { display: flex; flex-direction: column; gap: 12px; }
.generation-panel__header h2 { margin: 0; font-size: 14px; letter-spacing: 0.32em; text-transform: uppercase; }
.genprep-tabs { padding: 0 10px 10px; display: flex; gap: 10px; border-bottom-style: solid; border-bottom-width: 1px; }
.genprep-tab {
  flex: 1;
  border-radius: 999px;
  border-style: solid;
  border-width: 1px;
  padding: 10px 12px;
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
  user-select: none;
  letter-spacing: 0.06em;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
  outline: none;
  background-clip: padding-box;
}
.genprep-tab:focus { outline: none; }
.generation-panel__content {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  background: transparent;
  gap: 0;
  scrollbar-width: thin;
}
.generation-panel__content::-webkit-scrollbar { width: 4px; }
.generation-panel__content::-webkit-scrollbar-track { background: transparent; }
.generation-panel__content::-webkit-scrollbar-thumb { border-radius: 4px; }
.genprep-panel { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.genprep-panel[hidden] { display: none; }
.genprep-panel > [data-module] { flex: 1 1 auto; min-height: 0; }
.project-details-scope[data-project-details] {
  flex: 1 1 0%;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: transparent;
}
@media (max-width: 1040px) { .generation-panel { flex: 1 1 auto; } }
@media (max-width: 768px) {
  .generation-panel__header h2 { letter-spacing: 0.24em; }
  .genprep-tabs { flex-direction: column; border-bottom: none; }
}