/* SECO-Startscreen – Look & CI übernommen aus SECO-AR-local (public/style.css).
   Geteilt von allen Startseiten (index/medizin/industrie/filling/flyer.html). */
/* Assets liegen jetzt IN web-ar (self-contained). Von web-ar/app/ aus: ../assets/ = web-ar/assets/ */
@import url("../assets/fonts/seco-fonts.css");   /* SECO-CI: DM Sans + --seco-* Variablen */

#seco-start { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center;
  background: #fff; z-index: 10000; padding: 24px; color: var(--seco-ink, #212529); }
#seco-start.hidden { display: none; }
#seco-start .overlay-card { display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 28px; width: 100%; max-width: 640px; text-align: center; }
#seco-start .overlay-logo { height: 112px; width: auto; max-width: 82%; display: block; }
#seco-start .overlay-actions { display: flex; flex-direction: column; align-items: center; gap: 14px; }
#seco-start .overlay-motif { max-width: 62%; max-height: 30vh; width: auto; height: auto; display: block;
  border-radius: 12px; box-shadow: 0 4px 16px rgba(0,0,0,.16); }
#seco-start .hint { color: #6b7680; line-height: 1.5; max-width: 340px; margin: 4px auto 0;
  font-family: var(--seco-font-sans, Arial, sans-serif); font-size: .95rem; }
/* Desktop-Hinweis (Nicht-Mobilgeräte) */
#seco-start .overlay-title { margin: 0; font-size: 1.4rem; font-weight: 700; color: var(--seco-ink, #212529);
  font-family: var(--seco-font-sans, Arial, sans-serif); }
#seco-start .desktop-url { color: var(--seco-teal-dark, #326152); font-weight: 700; word-break: break-all; }
#seco-start .btn { background: var(--seco-teal, #4b9b8b); color: #fff; border: 0; border-radius: 999px;
  padding: 16px 60px; font-size: 1.15rem; font-weight: 700; cursor: pointer;
  font-family: var(--seco-font-sans, Arial, sans-serif); -webkit-tap-highlight-color: transparent; }
#seco-start .lang-switch { display: flex; gap: 8px; margin-bottom: 18px; }
.lang-pill { border: 1.5px solid rgba(75,155,139,.5); background: #fff; color: var(--seco-teal-dark, #326152);
  border-radius: 999px; padding: 6px 14px; cursor: pointer; font-weight: 700;
  font-family: var(--seco-font-sans, Arial, sans-serif); }
.lang-pill.is-active { background: var(--seco-teal, #4b9b8b); color: #fff; border-color: var(--seco-teal, #4b9b8b); }
.lang-pill:active { transform: translateY(1px); }
/* Rechtliches-Menü (Burger, bleibt auch während AR erreichbar – wie im Original) */
.legal-menu { position: fixed; top: 12px; right: 12px; z-index: 10001; }
/* Weißes Burger-Icon. Dezenter dunkler Chip, damit es AUCH auf dem weißen Startscreen sichtbar
   bleibt (weiß-auf-weiß wäre sonst unsichtbar) und über dem Kamerabild gut lesbar ist. */
.legal-toggle { width: 44px; height: 44px; border: 0; border-radius: 12px;
  background: rgba(0,0,0,.28); color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.legal-panel { position: absolute; top: 52px; right: 0; background: #fff; border-radius: 12px;
  box-shadow: 0 8px 28px rgba(0,0,0,.18); min-width: 180px; overflow: hidden; }
.legal-panel[hidden] { display: none; }
.legal-panel a { display: block; padding: 13px 18px; color: var(--seco-ink, #212529); text-decoration: none;
  font-family: var(--seco-font-sans, Arial, sans-serif); font-size: .96rem; }
.legal-panel a + a { border-top: 1px solid #eee; }
.legal-lang { display: flex; gap: 8px; padding: 10px 12px; border-bottom: 1px solid #eee; }
.legal-lang .lang-pill { flex: 1; text-align: center; }

/* App-Steuerung (Button-Leiste unten, erscheint nach "Start").
   Layout wie im MindAR-Projekt: feste Button-Breite, max. 2 pro Reihe (max-width = 2 Spalten),
   zentriert; einzelner Button in einer Reihe ist mittig. Buttons ändern nie ihre Breite. */
.seco-controls { position: fixed; left: 0; right: 0; bottom: 18px; z-index: 9000;
  display: none; flex-wrap: wrap; gap: 8px; justify-content: center; align-items: flex-end;
  padding: 0 10px; max-width: 372px; margin: 0 auto; pointer-events: none; }
.seco-controls.visible { display: flex; }
.seco-ctrl-group { display: contents; }   /* Buttons werden direkte Flex-Items der Leiste (2er-Umbruch) */
.seco-ctrl-btn { pointer-events: auto; flex: 0 0 auto; width: 168px; box-sizing: border-box;
  background: var(--seco-teal, #4b9b8b); color: #fff; border: 0; border-radius: 16px;
  padding: 11px 12px; font-size: 1.02rem; font-weight: 700; letter-spacing: .2px; cursor: pointer;
  font-family: var(--seco-font-sans, Arial, sans-serif);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center;
  text-shadow: 0 1px 3px rgba(0,0,0,.28); -webkit-tap-highlight-color: transparent; }
.seco-ctrl-btn:active { transform: translateY(1px); }
/* aktiv = GLEICHE Farbe + weißer Ring (keine Abdunklung); inaktiv = ohne Ring – wie im MindAR-Projekt */
.seco-ctrl-btn.is-active { box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 4px 14px rgba(0,0,0,.22); }

/* 8th-Wall-Lade-/Kamera-Screen NICHT anzeigen: der SECO-Startscreen bleibt als Hintergrund stehen,
   bis die Kamera läuft (der iOS-Kamera-Dialog erscheint darüber). Kein dunkler 8th-Wall-Screen,
   kein "powered by 8thWall". */
#loadBackground, #requestingCameraPermissions, .poweredby-img { display: none !important; }

/* Kalibrier-Modus (?cal=1): Panel zum Live-Einstellen von Größe/Rotation. Erscheint nach "Start". */
.seco-cal { position: fixed; left: 8px; right: 8px; bottom: 14px; z-index: 9500; display: none;
  background: rgba(27,39,51,.92); color: #fff; border-radius: 14px; padding: 10px 12px;
  font-family: var(--seco-font-sans, Arial, sans-serif); box-shadow: 0 6px 20px rgba(0,0,0,.3); }
.seco-cal.visible { display: block; }
.seco-cal .row { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; margin: 5px 0; }
.seco-cal .lbl { opacity: .85; font-size: .85rem; }
.seco-cal .val { font-weight: 700; min-width: 56px; text-align: center; }
.seco-cal button { background: var(--seco-teal, #4b9b8b); color: #fff; border: 0; border-radius: 999px;
  padding: 8px 15px; font-weight: 700; font-size: 1rem; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.seco-cal .readout { text-align: center; font-size: .8rem; opacity: .95; margin-top: 6px; word-break: break-all;
  user-select: all; -webkit-user-select: all; }