/* =============================================================================
   ELBE3D Quote – Frontend Styles (Glass UI + Anthracite Plate)
   ============================================================================= */

:root {
  --e3dq-bg: rgba(246, 248, 252, 0.92);
  --e3dq-card: rgba(255, 255, 255, 0.88);
  --e3dq-border: rgba(148, 163, 184, 0.32);
  --e3dq-shadow: 0 20px 45px rgba(15, 23, 42, 0.14);
  --e3dq-radius: 20px;
  --e3dq-text: #0f172a;
  --e3dq-muted: #64748b;
  --e3dq-primary: #21b36b;
  --e3dq-primary-dark: #1a9a5b;
  --e3dq-danger: #b91c1c;
  --e3dq-success: #166534;
}

#elbe3d-quote,
.elbe3d-widget {
  font-family: inherit;
  color: var(--e3dq-text);
}

#elbe3d-quote .e3d-grid,
.elbe3d-widget .e3d-grid {
  display: grid;
  grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
  gap: 28px;
}

@media (max-width: 1024px) {
  #elbe3d-quote .e3d-grid,
  .elbe3d-widget .e3d-grid {
    grid-template-columns: 1fr;
  }
}

.e3dq-view-tools{ display:flex; gap:.5rem; align-items:center; margin:.5rem 0 0; flex-wrap:wrap; }
.e3dq-btn{ font:inherit; font-weight:600; line-height:1; padding:.6rem .7rem; border:1px solid rgba(0,0,0,.12); border-radius:12px; background:#fff; cursor:pointer; }
.e3dq-btn:hover{ box-shadow:0 2px 8px rgba(0,0,0,.08); }
.e3dq-color-chip{ display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .55rem; border:1px solid rgba(0,0,0,.1); border-radius:999px; cursor:pointer; }
.e3dq-color-swatch{ width:14px; height:14px; border-radius:50%; border:1px solid rgba(0,0,0,.25); }
.e3dq-color-chip[aria-pressed="true"]{ outline:2px solid rgba(0,0,0,.15); }
@media (min-width:1024px){ .elbe3d-qualities-row{ display:flex; gap:.5rem; } }

.e3d-sidebar,
.e3d-main {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.e3d-card,
.e3d-preview-card {
  position: relative;
  background: var(--e3dq-card);
  border-radius: var(--e3dq-radius);
  border: 1px solid var(--e3dq-border);
  padding: 22px;
  box-shadow: var(--e3dq-shadow);
  backdrop-filter: blur(22px) saturate(140%);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
}

.e3d-card-title {
  margin: 0 0 0.5rem;
  font-size: 1.1rem;
  font-weight: 700;
}

.e3d-card-desc,
.e3d-preview-hint,
.e3d-price-info,
.e3d-hint,
.e3d-status,
.e3d-preview-card p,
.e3d-card p {
  color: var(--e3dq-muted);
  font-size: 0.92rem;
  line-height: 1.5;
}

.e3d-preview-card {
  background: var(--e3dq-card-bg, #fff);
  border: 1px solid var(--e3dq-border, rgba(0, 0, 0, 0.06));
  box-shadow: var(--e3dq-shadow, 0 16px 32px rgba(15, 23, 42, 0.12));
  color: var(--e3dq-card-fg, #111);
}

.e3d-preview-card .e3d-card-title {
  color: inherit;
}

.e3d-preview-card .e3d-preview-hint {
  color: var(--e3dq-muted, #4b5563);
  margin-top: 0.75rem;
}

.e3d-preview {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid var(--e3dq-border, rgba(0, 0, 0, 0.06));
  background: transparent;
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.elbe3dq-viewer {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
}

.elbe3dq-viewer canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.e3d-preview canvas {
  width: 100%;
  height: 100%;
  display: block;
}

.e3dq-widget.e3dq-is-analyzing .e3dq-preview::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  z-index: 2;
}

.e3dq-widget.e3dq-is-analyzing .e3dq-preview::after {
  content: '';
  position: absolute;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 5px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgba(33, 179, 107, 0.85);
  animation: e3dq-spin 1.1s linear infinite;
  z-index: 3;
  top: 50%;
  left: 50%;
  margin-top: -32px;
  margin-left: -32px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
}

@keyframes e3dq-spin {
  to { transform: rotate(360deg); }
}

.e3d-upload {
  display: flex;
  align-items: center;
  gap: 12px;
}

.e3d-file-name {
  flex: 1;
  min-width: 0;
  font-size: 0.92rem;
  color: var(--e3dq-muted);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.e3dq-progress {
  height: 6px;
  border-radius: 999px;
  background: rgba(226, 232, 240, 0.6);
  margin-top: 14px;
  overflow: hidden;
}

.e3dq-progress #elbe3d-progress-bar {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--e3dq-primary), var(--e3dq-primary-dark));
  transition: width 0.2s ease;
}

.e3d-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 18px;
}

.e3d-section h4 {
  margin: 0;
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--e3dq-muted);
}

.e3d-chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.e3dq-quality-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.elbe3d-chip {
  appearance: none;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(255, 255, 255, 0.9);
  color: var(--e3dq-text);
  font: inherit;
  padding: 8px 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.08);
  min-height: 40px;
}

.elbe3d-chip:is(:hover, :focus-visible) {
  border-color: rgba(33, 179, 107, 0.55);
  transform: translateY(-1px);
  box-shadow: 0 18px 28px rgba(33, 179, 107, 0.18);
  outline: none;
}

.elbe3d-chip:focus-visible {
  box-shadow: 0 0 0 4px rgba(33, 179, 107, 0.25);
}

.elbe3d-chip.is-selected {
  background: linear-gradient(135deg, rgba(33, 179, 107, 0.18), rgba(33, 179, 107, 0.08));
  border-color: rgba(33, 179, 107, 0.7);
  color: var(--e3dq-primary-dark);
}

.elbe3d-chip.is-disabled,
.elbe3d-chip[aria-disabled="true"] {
  opacity: 0.55;
  pointer-events: none;
}

.elbe3d-chip .elbe3d-color-swatch,
.elbe3d-chip .elbe3d-plate-thumb {
  width: 24px;
  height: 24px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.4);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.55);
}

.elbe3d-chip .elbe3d-plate-thumb {
  object-fit: cover;
  border-radius: 8px;
}

.elbe3d-placeholder {
  filter: grayscale(1);
  opacity: 0.7;
}

.elbe3d-chip-note {
  font-size: 0.75rem;
  color: var(--e3dq-muted);
}

.e3d-qty {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.e3d-qty input[type="number"] {
  width: 80px;
  text-align: center;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  padding: 10px;
  font: inherit;
  background: rgba(255, 255, 255, 0.95);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  -moz-appearance: textfield;
}

.e3d-qty input[type="number"]:focus-visible {
  outline: none;
  border-color: rgba(33, 179, 107, 0.6);
  box-shadow: 0 0 0 3px rgba(33, 179, 107, 0.25);
}

.e3d-qty input[type="number"]::-webkit-inner-spin-button,
.e3d-qty input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.e3d-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  font-weight: 600;
}

.e3d-toggle input[type="checkbox"] {
  width: 18px;
  height: 18px;
}

.e3d-price-box {
  display: flex;
  align-items: baseline;
  gap: 0.65rem;
  font-size: 1.2rem;
  font-weight: 600;
}

.e3d-price-box.is-loading {
  position: relative;
  color: rgba(148, 163, 184, 0.6);
}

.e3d-price-box.is-loading::after {
  content: '';
  position: absolute;
  right: -36px;
  top: 50%;
  width: 24px;
  height: 24px;
  margin-top: -12px;
  border-radius: 50%;
  border: 3px solid rgba(148, 163, 184, 0.35);
  border-top-color: var(--e3dq-primary);
  animation: e3dq-spin 0.8s linear infinite;
}

.e3dq-widget.e3dq-is-pricing .e3d-price-box {
  opacity: 0.7;
}

.e3d-status {
  margin-top: 12px;
  padding: 12px 16px;
  border-radius: 14px;
  background: rgba(248, 250, 252, 0.85);
  border: 1px solid rgba(148, 163, 184, 0.28);
  min-height: 1.5rem;
}

.e3d-status[data-status="success"] {
  border-color: rgba(22, 101, 52, 0.45);
  background: rgba(187, 247, 208, 0.35);
  color: var(--e3dq-success);
}

.e3d-status[data-status="error"] {
  border-color: rgba(185, 28, 28, 0.45);
  background: rgba(254, 226, 226, 0.55);
  color: var(--e3dq-danger);
}

.e3d-status[data-status="info"] {
  border-color: rgba(33, 179, 107, 0.35);
  background: rgba(236, 253, 245, 0.5);
  color: var(--e3dq-primary-dark);
}

.e3dq-status-line {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.5rem;
  font-size: 0.95rem;
  color: var(--e3dq-muted);
}

.e3dq-status-line span {
  display: inline-flex;
  gap: 0.35rem;
  align-items: baseline;
}

.e3dq-status-line strong {
  color: var(--e3dq-text);
}

.e3dq-widget .e3dq-busy-lock[disabled] {
  cursor: not-allowed;
  opacity: 0.6;
}

.e3dq-widget .e3dq-price-box strong {
  font-size: 1.4rem;
}

.e3dq-widget .e3dq-cta {
  justify-content: center;
  font-size: 1rem;
  font-weight: 700;
  background: linear-gradient(135deg, var(--e3dq-primary), var(--e3dq-primary-dark));
  color: #fff;
  border: none;
  min-width: 200px;
}

.e3dq-widget .e3dq-cta:is(:hover, :focus-visible) {
  color: #fff;
  box-shadow: 0 18px 36px rgba(33, 179, 107, 0.3);
}

.e3dq-widget .e3d-note {
  background: rgba(255, 255, 255, 0.85);
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  padding: 16px;
  color: var(--e3dq-muted);
}

.e3dq-widget .e3d-hint a {
  color: var(--e3dq-primary);
  text-decoration: none;
}

.e3dq-widget .e3d-hint a:is(:hover, :focus-visible) {
  text-decoration: underline;
  color: var(--e3dq-primary-dark);
}

.e3dq-widget .e3d-preview[data-elbe3d-status]::after {
  position: absolute;
  inset: 16px;
  border-radius: 18px;
  border: 1px dashed rgba(255, 255, 255, 0.25);
  display: grid;
  place-items: center;
  background: rgba(15, 23, 42, 0.55);
  color: #f1f5f9;
  font-size: 0.9rem;
  padding: 18px;
}

.e3dq-widget .e3d-chip-group[role="tablist"] {
  padding: 4px;
  border-radius: 999px;
}

.e3dq-widget .e3d-chip-group .elbe3d-chip {
  min-width: 0;
}

.e3dq-widget .e3d-chip-group .elbe3d-chip .elbe3d-chip-label {
  font-weight: 600;
}

.e3dq-widget .e3d-chip-group .elbe3d-chip:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(33, 179, 107, 0.22);
}

.e3dq-widget .e3d-section:first-of-type {
  margin-top: 0;
}

.e3dq-widget .e3d-section > input[type="hidden"] {
  display: none;
}

.e3dq-widget .e3d-preview-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 1px solid rgba(255, 255, 255, 0.1);
  pointer-events: none;
}

.e3dq-widget .e3d-preview-card::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
  pointer-events: none;
}

.e3dq-widget .e3d-main > .e3d-card:last-child {
  margin-bottom: 0;
}

@media (max-width: 640px) {
  .e3d-upload {
    flex-direction: column;
    align-items: stretch;
  }
  .e3d-file-name {
    text-align: center;
  }
  .e3d-price-box.is-loading::after {
    position: static;
    margin: 0 auto;
  }
  .e3d-price-box {
    flex-direction: column;
    align-items: flex-start;
  }
}
@media (min-width:1024px){
  .elbe3d-card--preview{ order:-1; }  /* Preview-Card nach links */
  .elbe3d-panel--sidebar{ order:0; }
}
.elbe3d-card--preview{
  background: var(--e3dq-card-bg,#fff);
  color: var(--e3dq-card-fg,#111);
  border: 1px solid var(--e3dq-border,rgba(0,0,0,.06));
  box-shadow: var(--e3dq-shadow,0 8px 24px rgba(0,0,0,.08));
}
.elbe3d-viewer-wrap{ background: transparent; } /* Card hell, Bett bleibt dunkel im Viewer */

#elbe3d-extras .e3d-extra-info{
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  position: relative;
}

.e3dq-extra-price-lines{
  list-style:none;
  margin:0.75rem 0 0;
  padding:0;
  font-size:0.85rem;
  color:var(--e3dq-muted,#4b5563);
  display:grid;
  gap:0.35rem;
}

.e3dq-extra-price-lines[hidden]{
  display:none!important;
}

.e3dq-extra-price-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.5rem;
  color:inherit;
}

.e3dq-extra-price-line.is-active{
  color:var(--e3dq-accent,#2563eb);
  font-weight:600;
}

.e3dq-extra-price{
  font-size: 0.75rem;
  color: var(--e3dq-muted);
  opacity: 0.85;
}

.e3d-extra-label{
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.e3d-extra-tip{
  background: transparent;
  border: 0;
  border-radius: 999px;
  width: 1.75rem;
  height: 1.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--e3dq-accent,#2563eb);
  cursor: pointer;
  font-weight: 600;
  font-size: 0.85rem;
  line-height: 1;
  transition: background-color .2s ease, color .2s ease;
}

.e3d-extra-tip:focus,
.e3d-extra-tip:hover{
  background: rgba(37,99,235,0.12);
  color: var(--e3dq-card-fg,#111);
  outline: none;
}

.e3d-extra-tip:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.e3d-extra-tooltip{
  position: absolute;
  inset-inline-start: 0;
  top: 100%;
  z-index: 20;
  margin-top: 0.5rem;
  padding: 0.75rem 1rem;
  border-radius: 0.75rem;
  background: rgba(17,24,39,0.94);
  color: #fff;
  font-size: 0.8125rem;
  line-height: 1.45;
  min-width: 14rem;
  max-width: min(24rem, 80vw);
  box-shadow: 0 12px 24px rgba(15,23,42,0.25);
}

.e3d-extra-tooltip a{
  color: inherit;
  text-decoration: underline;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-top: 0.5rem;
}

.e3d-extra-tooltip a::after{
  content: '\2197';
  font-size: 0.75em;
}

.e3d-extra-tooltip p{
  margin: 0;
}

@media (min-width:1024px){
  .elbe3d-card--preview{ order:-1; }
  .elbe3d-panel--sidebar{ order:0; }
}
.elbe3d-card--preview{
  background:#fff; color:#111;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 8px 24px rgba(0,0,0,.08);
}
.elbe3d-viewer-wrap{ background: transparent; }
@media (min-width:1024px){
  #elbe3d-quote .e3d-grid,
  .elbe3d-widget .e3d-grid{
    display:flex;
    flex-direction:row;
    align-items:flex-start;
    gap:28px;
  }
  .e3d-main{order:1;flex:1 1 auto;display:flex;flex-direction:column;gap:22px;}
  .elbe3d-panel--sidebar{order:2;flex:0 0 340px;display:flex;flex-direction:column;gap:22px;}
  .e3d-main .elbe3d-card--preview{order:0;}
  .e3d-main .elbe3d-card--stats{order:1;}
  .e3d-main .elbe3d-card--status{order:2;}
  .e3d-main .elbe3d-card--price{order:3;}
  .e3d-main .elbe3d-card--cta{order:4;}
  .elbe3d-panel--sidebar .e3d-section{display:flex;flex-direction:column;}
  .elbe3d-panel--sidebar #elbe3d-materials{order:10;}
  .elbe3d-panel--sidebar #elbe3d-quality{order:20;}
  .elbe3d-panel--sidebar #elbe3d-strength{order:30;}
  .elbe3d-panel--sidebar #elbe3d-colors{order:40;}
  .elbe3d-panel--sidebar #elbe3d-plates{order:50;}
  .elbe3d-panel--sidebar #elbe3d-quantity{order:60;}
  .elbe3d-panel--sidebar #elbe3d-extras{order:70;}
}
@media (min-width:1024px){
  .e3dq-quality-group{display:flex;gap:.5rem;flex-wrap:nowrap;}
}
.elbe3d-card--preview{
  background:var(--e3dq-card-bg,#fff);
  color:var(--e3dq-card-fg,#111);
  border:1px solid var(--e3dq-border,rgba(0,0,0,.06));
  box-shadow:var(--e3dq-shadow,0 8px 24px rgba(0,0,0,.08));
}
.e3dq-status-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  margin-left:.75rem;
  padding:.35rem .9rem;
  border-radius:999px;
  font-weight:600;
  background:rgba(255,255,255,.18);
  color:inherit;
  text-decoration:none;
}
.e3dq-status-cta:hover,
.e3dq-status-cta:focus{
  text-decoration:none;
  background:rgba(255,255,255,.28);
}
@media (min-width:1024px){
  .elbe3d-card--preview{order:-3;}
  .elbe3d-metrics-card{order:-2;}
  .elbe3d-status-card{order:-1;}
  .elbe3d-price-card{order:0;}
  .elbe3d-cta-card{order:1;}
}
.elbe3d-card--preview { background: #fff; }
.elbe3d-view {
  width: 100%;
  height: min(60vh, 560px);
  border-radius: 12px;
  overflow: hidden;
}
@media (min-width: 1024px) {
  .elbe3d-view {
    height: min(72vh, 720px);
  }
}

/* Viewer konsistent quadratisch + maximal */
.elbe3dq-viewer {
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  position: relative;
}

.elbe3dq-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

/* Karte nicht künstlich strecken */
.elbe3d-card--preview {
  max-height: none;
  min-height: 0;
}

/* Umgebender Wrap füllt Karte, ohne fixe Höhen */
.elbe3d-viewer-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.elbe3d-viewer-wrap canvas {
  display: block;
  width: 100%;
  height: 100%;
}


/* Legacy-Leisten robust entfernen */
.elbe3d-toolbar-bottom,
.elbe3d-toolbar-vertical,
.elbe3d-viewer-hint,
.e3dq-toolbar-bottom,
.elbe3dq-footbar,
.e3dq-toolbar.foot {
  display: none !important;
}

/* Floating-Toolbar eindeutig und lesbar */
[data-e3dq-toolbar] {
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

[data-e3dq-toolbar] .e3dq-btn {
  min-width: 40px;
  min-height: 40px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.14);
  font-weight: 700;
}

.elbe3d-legacy-footbar,
.elbe3d-legacy-hint {
  display: none !important;
}

/* Viewer-Host quadratisch und nicht unendlich hoch */
[data-e3dq-root] .elbe3dq-viewer {
  aspect-ratio: 1 / 1;
  max-height: clamp(280px, 50vh, 560px);
}

/* Canvas füllt den Host vollständig */
[data-e3dq-root] canvas.elbe3dq-canvas {
  width: 100%;
  height: 100%;
  display: block;
}

/* Alte Fußleisten und Hinweise vollständig ausblenden */
[data-e3dq-root] .e3dq-toolbar-bottom,
[data-e3dq-root] .elbe3dq-footbar,
[data-e3dq-root] .elbe3d-legacy-footbar,
[data-e3dq-root] .elbe3d-legacy-hint {
  display: none !important;
}
/* Nur Checkbox-Toggles sichtbar lassen */
.e3dq-extras-hints,
.e3dq-extras-secondary,
.e3dq-extra-hint,
.e3dq-extra-note,
.e3dq-extra-price { display: none !important; }

/* Host: Quadrat, viewport-begrenzt, ohne „Wachsen“ */
[data-e3dq-root] .elbe3dq-viewer {
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: clamp(280px, 55vh, 640px);
  position: relative;
}

/* Canvas füllt den Host */
[data-e3dq-root] canvas.elbe3dq-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

/* Alte Toolbars/Hints robust ausblenden */
.elbe3d-toolbar-bottom,
.elbe3d-toolbar-vertical,
.elbe3d-viewer-hint,
.e3dq-toolbar-bottom,
.elbe3dq-footbar,
.e3dq-toolbar.foot { display: none !important; }

/* Viewer-Host: quadratisch, viewport-begrenzt, zentriert */
[data-e3dq-root] .elbe3dq-viewer{
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: clamp(280px, 55vh, 640px);
  margin: 0 auto;
}
/* Canvas füllt den Host */
[data-e3dq-root] canvas.elbe3dq-canvas{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
/* Legacy-Leisten/Hints nur im Root ausblenden */
[data-e3dq-root] .e3dq-toolbar-bottom,
[data-e3dq-root] .elbe3dq-footbar,
[data-e3dq-root] .e3dq-toolbar.foot,
[data-e3dq-root] .elbe3d-viewer-hint{
  display: none !important;
}
/* Toolbar-Buttons gut klickbar */
[data-e3dq-root] [data-e3dq-toolbar] .e3dq-btn{
  min-width: 32px; min-height: 32px;
  border-radius: 10px; padding: 4px 8px;
  line-height: 1; cursor: pointer;
}
/* Viewer Host */
[data-e3dq-root] .elbe3dq-view {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: transparent;
}

/* Canvas füllt Host */
[data-e3dq-root] canvas.elbe3dq-canvas {
  width: 100%;
  height: 100%;
  display: block;
}

/* Floating toolbar (nur 2 Buttons) */
[data-e3dq-root] .elbe3dq-toolbar {
  position: absolute;
  top: .75rem;
  right: .75rem;
  display: flex;
  gap: .5rem;
  z-index: 3;
}
[data-e3dq-root] .elbe3dq-btn {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.08);
  background: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
  font-weight: 600;
  cursor: pointer;
}

/* Alte Fußleisten/Hints innerhalb des Roots sicher verstecken */
[data-e3dq-root] .elbe3d-toolbar--footer,
[data-e3dq-root] .elbe3dq-hint {
  display: none !important;
}

/* Vorschaukarte begrenzen (nicht endlos wachsen) */
.elbe3d-card--preview {
  max-height: min(60vh, 720px);
}
[data-elbe3d-widget] .view-wrap {
  position: relative;
  overflow: hidden;
}

[data-elbe3d-widget] .view-wrap canvas {
  display: block;
  width: 100%;
  height: 100%;
}

[data-elbe3d-widget] .view-toolbar {
  gap: .5rem;
}

[data-elbe3d-widget] .view-toolbar button {
  height: 34px;
  padding: 0 .75rem;
  font-size: 13px;
  border-radius: 10px;
}

[data-elbe3d-widget] [data-e3dq-toolbar],
[data-elbe3d-widget] .elbe3dq-toolbar {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  z-index: 3;
}

[data-elbe3d-widget] [data-e3dq-toolbar] .e3dq-btn,
[data-elbe3d-widget] .elbe3dq-toolbar .e3dq-btn {
  min-height: 34px;
  min-width: 0;
  padding: 6px 12px;
  font-size: 13px;
  line-height: 1.2;
  border-radius: 8px;
  border: 1px solid rgba(15, 23, 42, 0.18);
  background-color: rgba(255, 255, 255, 0.96);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.14);
  color: #0f172a;
  font-weight: 600;
  cursor: pointer;
}

[data-elbe3d-widget] [data-e3dq-toolbar] .e3dq-btn:focus-visible,
[data-elbe3d-widget] .elbe3dq-toolbar .e3dq-btn:focus-visible {
  outline: 2px solid #6366f1;
  outline-offset: 2px;
}

[data-elbe3d-widget] .e3d-preview {
  /* hard clip inside rounded card to avoid AA fringes */
  clip-path: inset(0 round 22px);
}
[data-elbe3d-widget] .e3d-preview .elbe3dq-viewer,
[data-elbe3d-widget] .e3d-preview canvas.elbe3dq-canvas {
  border-radius: 22px;
}

/* Toolbar kompakt & lesbar, oben rechts */
.e3dq-actions {
  position: absolute;
  top: .5rem; right: .5rem;
  display: grid; gap: .4rem;
  z-index: 3;
}
.e3dq-btn {
  font: 600 12px/1.2 system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  padding: .28rem .5rem;
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(255,255,255,.96);
  color: #1d2430;
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
  cursor: pointer; user-select: none; backdrop-filter: blur(2px);
}
.e3dq-btn:hover { background: #fff; }
.e3dq-btn:active { transform: translateY(1px); }

/* Canvas sauber clippen (runde Ecken) */
[data-elbe3d-widget] .three-wrap,
[data-e3d-root] .three-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
}
