/* Override styles from various versions */

/* Scene card and model overrides */
.scene-card-desc{display:none!important}
.scene-tag{font-size:10px!important}
.model-card{padding:14px!important}
.model-img-row{margin-bottom:12px!important}
.model-desc{font-size:12px!important;line-height:1.5!important}

/* Section accordion overrides */
.section-accordion{background:transparent!important;border:none!important;border-bottom:none!important;border-radius:0!important;margin-bottom:12px!important;overflow:visible!important}
.section-accordion>.panel-head{padding:12px 0!important}
.section-accordion>.panel-body{padding:0 0 14px!important}
.section-accordion>.panel-head .panel-title{font-size:20px!important;font-weight:650!important;letter-spacing:-.02em!important}
.section-summary{font-size:13px;color:var(--text3);line-height:1.45;margin-top:4px}

/* Setup and product refs */
.setup-productrefs{padding:0 0 18px!important;margin:0 0 10px!important;background:transparent!important;border:none!important;border-radius:0!important}
.core-subject{padding:0 0 18px!important;margin:0 0 10px!important;background:transparent!important;border:none!important;border-radius:0!important}

/* Sub-item panels inside Build sections: no box border, thin dividers between items */
/* Targets both direct children of panel-body AND dynamic containers */
#setup-section .panel:not(.section-accordion),
#core-section .panel:not(.section-accordion),
#product-section .panel:not(.section-accordion),
#body-section .panel:not(.section-accordion),
#advancedBox .panel,
#core-panels > .panel,
#product-panels > .panel,
#body-panels > .panel,
#advanced-panels > .panel{
  border:none!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  margin-bottom:0!important;
  overflow:visible!important;
}
/* Dividers: border-top on all except first child in each container */
#industry-panel + #model-panel,
#model-panel + .panel,
#core-panels > .panel + .panel,
#product-panels > .panel + .panel,
#body-panels > .panel + .panel,
#advanced-panels > .panel + .panel{
  border-top:1px solid rgba(0,0,0,.07)!important;
}

/* Layout overrides */
.layout{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:0 !important;
  width:100% !important;
  min-height:calc(100vh - 54px) !important;
  align-items:stretch !important;
  margin:0 !important;
}
.left{
  padding:0 24px 60px 28px !important;
  border-right:1px solid rgba(0,0,0,.07) !important;
  min-height:calc(100vh - 54px) !important;
  overflow-y:auto !important;
}
.right{
  position:sticky !important;
  top:54px !important;
  height:calc(100vh - 54px) !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}
.right .output-panel{
  flex:1 !important;
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
  border:none !important;
  border-radius:0 !important;
  position:relative !important;
  z-index:1 !important;
}
#panePrompt,#paneImage{
  flex:1 !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
}
#panePrompt.hidden,#paneImage.hidden{display:none !important;}
#output{
  flex:1 !important;
  min-height:0 !important;
  resize:none !important;
}

/* Hide the old scene library box — the trigger+overlay are injected by scene-overlay.js */
#sceneLibraryBox,#sceneBrowserPanel,.scene-library-control{display:none!important;}

/* ── Left column scene library trigger row ───────────────────────────── */
#sceneLibraryTrigger{
  display:flex!important;flex-direction:column!important;align-items:stretch!important;
  padding:12px 0 11px!important;border-bottom:none!important;
  margin-bottom:4px!important;cursor:pointer!important;user-select:none!important;
}
.trigger-top-row{display:flex!important;align-items:center!important;justify-content:space-between!important;}
#sceneLibraryTrigger:hover .trigger-label{color:var(--text2)!important;}
.trigger-label{
  display:flex!important;align-items:center!important;gap:10px!important;
  font-size:20px!important;font-weight:650!important;letter-spacing:-.03em!important;
  color:var(--text)!important;transition:color .12s!important;
  line-height:1.12!important;
}
.trigger-active-scene{font-size:12px!important;color:var(--text3)!important;font-weight:400!important;}
.trigger-scene-count{font-size:11px!important;font-weight:500!important;color:var(--text3)!important;background:rgba(0,0,0,.06)!important;border-radius:999px!important;padding:1px 7px!important;letter-spacing:0!important;}
.trigger-arrow{
  font-size:12px!important;color:var(--text3)!important;
  display:flex!important;align-items:center!important;gap:6px!important;font-weight:500!important;
}

/* ── Scene overlay — frosted glass over the right panel ─────────────── */
#sceneOverlay{
  position:absolute!important;inset:0!important;z-index:100!important;
  background:rgba(248,248,246,0.72)!important;
  backdrop-filter:blur(20px) saturate(130%)!important;
  -webkit-backdrop-filter:blur(20px) saturate(130%)!important;
  display:none!important;flex-direction:column!important;overflow:hidden!important;
}
#sceneOverlay.open{display:flex!important;}
#sceneOverlayHeader{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  padding:18px 22px 14px!important;flex-shrink:0!important;
  border-bottom:1px solid rgba(0,0,0,.07)!important;
}
#sceneOverlayTitle{font-size:20px!important;font-weight:600!important;letter-spacing:-.03em!important;}
#sceneOverlayClose{
  width:28px!important;height:28px!important;display:flex!important;
  align-items:center!important;justify-content:center!important;
  border-radius:999px!important;cursor:pointer!important;font-size:16px!important;
  color:var(--text2)!important;background:rgba(0,0,0,.06)!important;
  border:none!important;transition:background .12s!important;flex-shrink:0!important;
}
#sceneOverlayClose:hover{background:rgba(0,0,0,.12)!important;color:var(--text)!important;}
#sceneOverlayBody{flex:1!important;overflow-y:auto!important;padding:18px 20px 24px!important;}
#sceneOverlayGrid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;}
/* Filter bar */
#sceneOverlayFilterBar{display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin:0 0 16px!important;}
.scene-overlay-filter-chip{
  border:1px solid rgba(0,0,0,.14)!important;background:rgba(255,255,255,.5)!important;
  color:#777!important;border-radius:999px!important;padding:7px 12px!important;
  font-size:11px!important;font-weight:700!important;letter-spacing:.06em!important;
  text-transform:uppercase!important;cursor:pointer!important;
  transition:border-color .12s,background .12s,color .12s!important;
}
.scene-overlay-filter-chip:hover{border-color:#111!important;color:#111!important;background:rgba(255,255,255,.8)!important;}
.scene-overlay-filter-chip.active{border-color:#111!important;background:#111!important;color:#fff!important;}
.scene-overlay-empty{grid-column:1/-1!important;color:#777!important;font-size:12px!important;padding:20px 0!important;}
/* Scene cards inside overlay */
#sceneOverlayGrid .scene-card{
  cursor:pointer!important;border-radius:10px!important;overflow:hidden!important;
  border:1px solid rgba(0,0,0,.08)!important;background:rgba(255,255,255,.7)!important;
  transition:border-color .12s,box-shadow .12s!important;
}
#sceneOverlayGrid .scene-card:hover{
  border-color:rgba(0,0,0,.22)!important;
  box-shadow:0 2px 8px rgba(0,0,0,.08)!important;
  transform:none!important;
}
#sceneOverlayGrid .scene-card.selected{
  border-color:#111!important;box-shadow:0 0 0 1.5px #111 inset,0 4px 14px rgba(0,0,0,.12)!important;
}
#sceneOverlayGrid .scene-card-thumb{width:100%!important;height:110px!important;object-fit:cover!important;display:block!important;}
#sceneOverlayGrid .scene-card-thumb-placeholder{
  width:100%!important;height:110px!important;background:rgba(0,0,0,.05)!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
}
#sceneOverlayGrid .scene-card-body{padding:9px 10px 10px!important;}
#sceneOverlayGrid .scene-card-name{font-size:12px!important;font-weight:600!important;letter-spacing:-.01em!important;margin-bottom:3px!important;line-height:1.3!important;}
#sceneOverlayGrid .scene-tag{font-size:9px!important;padding:2px 6px!important;margin-top:3px!important;}
.scene-deselect{z-index:3!important;}

/* Segment dots — gray by default, green when segment is enabled */
.segment-dot,.section-state-dot{
  width:5px!important;height:5px!important;min-width:5px!important;border-radius:999px!important;
  display:inline-block!important;margin-right:7px!important;vertical-align:middle!important;
  background:#D0D0D0!important;box-shadow:none!important;transition:background .2s!important;
}
.segment-dot{
  width:8px!important;height:8px!important;min-width:8px!important;
}
.segment-dot.is-green,.section-state-dot.is-green{background:var(--green)!important;box-shadow:0 0 5px rgba(52,199,89,0.45)!important;}
.segment-dot.is-amber,.section-state-dot.is-amber{background:var(--orange)!important;box-shadow:none!important;}
.segment-dot.is-gray,.section-state-dot.is-gray{background:#D0D0D0!important;box-shadow:none!important;}

/* Pill value text: light when not selected */
.panel-title:has(.segment-dot.is-gray) .pill{color:#C0C0C0!important;}
.panel-title:has(.segment-dot.is-green) .pill{color:var(--text2)!important;}



/* Left panel accordion head hover: text darkens, no background flash */
.panel-head:hover{background:transparent!important;}
.panel-head:hover .panel-title{color:var(--text2)!important;}

/* Nav */
nav{padding:0 28px!important;}

/* Build page: no top padding — layout starts flush at nav bottom */
#buildPage{padding:0!important;}

/* Admin / Settings — restore sensible width */
#adminPage{padding:32px 28px 60px!important;}
#settingsPage{padding:32px 28px 60px!important;}
#adminPage .layout{max-width:1200px!important;margin:0 auto!important;min-height:auto!important;}

/* Responsive */
@media(max-width:860px){
  .layout{grid-template-columns:1fr!important;min-height:auto!important;}
  .right{position:static!important;height:auto!important;}
  .left{border-right:none!important;border-bottom:1px solid rgba(0,0,0,.07)!important;padding:16px 16px 40px!important;min-height:auto!important;}
  #sceneOverlayGrid{grid-template-columns:repeat(2,1fr)!important;}
}

/* Product refs visual match */
.box{
  border:none !important;
  background:transparent !important;
  border-bottom:none !important;
  border-radius:0 !important;
}

/* Correct nested accordion behavior */
.panel-body{display:none;}
.panel.open > .panel-body{display:block;}
.panel.open .panel-body .panel-body{display:none;}
.panel.open .panel.open > .panel-body{display:block;}

/* Consistent Setup/Core rows */
#setup-section > .panel-body,
#core-section > .panel-body{padding:0 0 14px!important;}
#setup-section > .panel-body > .panel,
#core-section > .panel-body > .panel,
#core-section > .panel-body > .box{margin:0!important;padding:0!important;border:none!important;border-bottom:none!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;}
#setup-section > .panel-body > .panel > .panel-head,
#core-section > .panel-body > .panel > .panel-head{padding:13px 0!important;border:none!important;background:transparent!important;}
#setup-section .panel-title,
#core-section .panel-title{font-size:17px!important;font-weight:600!important;line-height:1.25!important;letter-spacing:-.01em!important;display:flex!important;align-items:center!important;gap:8px!important;}
#setup-section .panel-desc,
#core-section .panel-desc{font-size:13px!important;line-height:1.45!important;color:var(--text3)!important;margin-top:6px!important;}
#setup-section .pill,
#core-section .pill{background:none!important;border:none!important;padding:0!important;margin-left:6px!important;color:#8E8E93!important;font-size:13px!important;font-weight:500!important;}
.productref-panel .panel-body{padding:0 0 18px!important;}
.core-row-title{display:flex!important;align-items:center!important;gap:8px!important;}

.options{margin:12px 0 18px!important;}
.preview{margin:0 0 0!important;background:transparent!important;border:none!important;border-radius:0!important;}
.model-grid{margin:12px 0 18px!important;}

/* Final section state overrides */
#setup-section,
#core-section,
#product-section,
#body-section,
#advancedBox{
  position:relative !important;
}

#setup-section::before,
#core-section::before,
#product-section::before,
#body-section::before,
#advancedBox::before{
  content:"" !important;
  display:block !important;
  width:100% !important;
  height:2px !important;
  background:#D8D8DC !important;
  margin:18px 0 14px !important;
}

/* Top-level sections: larger than nested rows */
#setup-section > .panel-head .panel-title.section-title-main,
#core-section > .panel-head .panel-title.section-title-main{
  font-size:20px !important;
  line-height:1.12 !important;
  font-weight:650 !important;
  letter-spacing:-.03em !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
}

#product-section > .panel-head .panel-title.section-title-main,
#body-section > .panel-head .panel-title.section-title-main{
  font-size:20px !important;
  line-height:1.12 !important;
  font-weight:650 !important;
  letter-spacing:-.03em !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
}

.panel-title.section-title-advanced{
  font-size:17px !important;
  font-weight:600 !important;
  letter-spacing:-.01em !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}

.section-state-dot{
  width:10px !important;
  height:10px !important;
}

/* Selected scene thumbnail card in trigger */
.trigger-selected-card{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px 10px;background:var(--surface2);border-radius:8px;cursor:default;}
.tsc-thumb{width:72px;height:54px;border-radius:6px;object-fit:cover;flex-shrink:0;background:#ddd;}
.tsc-thumb-initials{display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;background:#111;}
.tsc-info{flex:1;min-width:0;}
.tsc-name{font-size:13px;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tsc-tags{font-size:10px;color:var(--text3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tsc-remove{flex-shrink:0;border:none;background:none;font-size:16px;color:var(--text3);cursor:pointer;padding:2px 4px;line-height:1;}
.tsc-remove:hover{color:#111;}

/* Selected scene mini — bigger thumb */
.scene-mini{width:72px!important;height:54px!important;border-radius:8px!important;}
.selected-tags{font-size:10px;color:var(--text3);margin-top:2px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px;}

/* Overlay grid 4 columns — narrower cards */
#sceneOverlayGrid .scene-card-thumb{height:90px!important;}
#sceneOverlayGrid .scene-card-body{padding:7px 8px 8px!important;}
#sceneOverlayGrid .scene-card-name{font-size:11px!important;}

/* Mobile: overlay stays 2 col */
@media(max-width:600px){
  #sceneOverlayGrid{grid-template-columns:repeat(2,1fr)!important;}
}