/* Shared control theme for the public page, admin and embedded asset workspace. */
:root {
  --ui-accent: var(--dz-accent);
  --ui-accent-soft: var(--dz-accent-soft);
  --ui-surface: var(--dz-surface);
  --ui-text: var(--dz-text);
  --ui-muted: var(--dz-muted);
  --ui-border: var(--dz-border);
  --ui-radius: 9px;
  --ui-shadow: 0 8px 28px rgba(31, 35, 41, .09), 0 2px 6px rgba(31, 35, 41, .04);
}
select:not([multiple]):not([size]), select:not([multiple])[size="1"], select:not([multiple])[size="0"] {
  appearance: none; -webkit-appearance: none;
  background-color: var(--ui-surface) !important; color: var(--ui-text) !important;
  border: 1px solid var(--ui-border) !important; border-radius: 7px !important;
  padding-right: 32px !important; font-family: inherit; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23828a94' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 10px center !important;
  background-size: 16px !important;
  transition: border-color .15s, box-shadow .15s, background-color .15s;
}
select:not([multiple]):not(:disabled):hover { border-color: #f0bd96 !important; }
select:not([multiple]):focus-visible, select[aria-expanded="true"] {
  outline: none !important; border-color: var(--ui-accent) !important;
  box-shadow: 0 0 0 3px rgba(237, 123, 32, .11) !important;
}
select[aria-expanded="true"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ed7b20' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 14 5-5 5 5'/%3E%3C/svg%3E") !important;
}
select:disabled { cursor: not-allowed; opacity: .55; }
.app-select-menu, .video-model-menu {
  position: fixed; z-index: 10010; box-sizing: border-box; overflow-y: auto;
  overscroll-behavior: contain; border: 1px solid var(--ui-border); border-radius: var(--ui-radius);
  background: var(--ui-surface); color: var(--ui-text); box-shadow: var(--ui-shadow);
  padding: 5px; font: 13px/1.5 Inter, "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  scrollbar-width: thin; scrollbar-color: #d8dce2 transparent;
  animation: ui-control-enter .12s ease-out;
}
.app-select-menu [role="option"], .video-model-menu [role="option"] {
  position: relative; min-height: 36px; padding: 8px 32px 8px 11px;
  border-radius: 5px; cursor: pointer; overflow-wrap: anywhere;
  transition: background-color .1s, color .1s;
}
.app-select-menu [role="option"].active, .video-model-menu [role="option"].active {
  background: var(--ui-accent-soft); color: var(--dz-accent);
}
.image-model-menu [role="option"] { white-space: nowrap; overflow-wrap: normal; }
.app-select-menu [role="option"][aria-selected="true"], .video-model-menu [role="option"][aria-selected="true"] {
  color: var(--dz-accent); font-weight: 600;
}
.app-select-menu [role="option"][aria-selected="true"]::after,
.video-model-menu [role="option"][aria-selected="true"]::after {
  content: ""; position: absolute; right: 13px; top: 13px; width: 6px; height: 10px;
  border-right: 1.8px solid var(--ui-accent); border-bottom: 1.8px solid var(--ui-accent);
  transform: rotate(45deg);
}
.video-model-menu [role="option"] { min-height: 0; padding-top: 6px; padding-bottom: 6px; }
.app-select-group { padding: 8px 11px 4px; color: var(--ui-muted); font-size: 11px; }
.app-tooltip, .video-model-tooltip, .unit-assets-gate-tooltip {
  box-sizing: border-box; border: 1px solid var(--ui-border); border-radius: var(--ui-radius);
  background: var(--ui-surface); color: var(--ui-text); box-shadow: var(--ui-shadow);
  padding: 10px 13px; font: 12px/1.65 Inter, "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  white-space: pre-wrap; overflow-wrap: anywhere;
}
.app-tooltip, .video-model-tooltip {
  position: fixed; z-index: 10011; pointer-events: none;
  max-width: min(320px, calc(100vw - 16px)); animation: ui-control-enter .12s ease-out;
}
.app-tooltip .model-tooltip-price { display: block; font-size: 13px; font-weight: 600; color: var(--dz-accent); }
.app-tooltip .model-tooltip-remark { display: block; margin-top: 4px; color: var(--ui-muted); }
.app-tooltip[hidden], .video-model-tooltip[hidden] { display: none; }
.asset-workspace button[data-ui-title*="资产库"] {
  background: var(--ui-surface) !important; color: var(--ui-muted) !important;
  border: 1px solid var(--ui-border) !important;
}
.asset-workspace button[data-ui-title*="资产库"]:hover {
  background: var(--ui-accent-soft) !important; color: var(--dz-accent) !important;
}
@keyframes ui-control-enter { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .app-select-menu, .app-tooltip { animation: none; }
  select, .app-select-menu [role="option"] { transition: none; }
}

/* Search stays reachable while scrolling long model catalogs. */
.model-search-input{position:sticky;top:0;z-index:2;display:block;box-sizing:border-box;width:100%;min-width:0;margin:0 0 6px;padding:9px 10px;border:1px solid var(--dz-border);border-radius:6px;background:var(--dz-surface);color:var(--dz-text);font:inherit}
.model-search-input:focus{outline:2px solid var(--dz-accent);outline-offset:-2px}
.model-search-empty{padding:14px 10px;color:var(--dz-muted);font-size:12px}
.studio-select-option[hidden],.model-search-empty[hidden]{display:none!important}