/* ==========================================================================
   IFC4-BIM-Viewer — Modul-Styles (php/bim/)
   Modal-Chrome (Box/Backdrop/Bar/Close/Loader/Hint) 1:1 vom STEP-3D-Viewer
   (fileadmin/php/step/assets/css/step_viewer.css) uebernommen, nur mit
   eigenem Klassen-/ID-Praefix bimv- (Kollisionsfreiheit auf derselben Seite).
   Die 3D-Buehne selbst bleibt DUNKEL (wie die Standalone-Seite bim/viewer.php),
   dazu zusaetzlich Legende + Artikel-Info (bimv-legend/bimv-info) — beides gibt
   es im STEP-Modal nicht, da dort keine Port-Farbcodierung existiert.
   Button erscheint in der Produktdatenbank-Downloadspalte und erbt dort die
   Basis-Link-Optik; hier Akzent + 3D-Icon + Modal.
   ========================================================================== */

/* --- Ausloesender Button (in der Downloadspalte) --- */
a.bimv-view{cursor:pointer}
a.bimv-view:hover{border-color:#006aac!important;background:#e8f2f9!important;color:#00568a!important}
.bimv-ico{display:inline-flex;align-items:center;justify-content:center;
    width:18px;height:18px;flex-shrink:0;border-radius:4px;background:#006aac;color:#fff;
    font-size:.6rem;font-weight:700;letter-spacing:.02em}

/* --- Modal-Overlay (1:1 vom STEP-Modal) --- */
#bimv-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center}
#bimv-modal.bimv-hidden{display:none}
#bimv-modal .bimv-backdrop{position:absolute;inset:0;background:rgba(18,26,36,.55)}
#bimv-modal .bimv-box{position:relative;width:min(92vw,1100px);height:min(88vh,820px);
    display:flex;flex-direction:column;background:#ffffff;color:#333;border:1px solid #d7dee6;
    border-radius:12px;overflow:hidden;box-shadow:0 24px 64px rgba(15,25,40,.35);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
#bimv-modal .bimv-bar{display:flex;align-items:center;gap:10px;padding:10px 12px;
    border-bottom:1px solid #e4e9ef;background:#f5f7fa}
#bimv-modal .bimv-title{font-size:14px;font-weight:650;color:#2c3e50}
#bimv-modal .bimv-title b{color:#006aac}
#bimv-modal .bimv-close{margin-left:auto;width:34px;height:34px;line-height:1;font-size:22px;
    border:1px solid #d7dee6;border-radius:8px;background:#fff;color:#6b7885;cursor:pointer;transition:.15s}
#bimv-modal .bimv-close:hover{color:#006aac;border-color:#006aac;background:#e8f2f9}
#bimv-modal .bimv-stage{position:relative;flex:1;min-height:0;background:#f5f7fa}
#bimv-modal .bimv-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;
    touch-action:none;outline:none}
#bimv-modal .bimv-loader{position:absolute;inset:0;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:14px;color:#556270;font-size:13px;
    background:#f5f7fa;text-align:center;padding:20px}
#bimv-modal .bimv-loader.bimv-err{color:#b02a37}
#bimv-modal .bimv-spin{width:38px;height:38px;border-radius:50%;border:3px solid #dbe3ec;
    border-top-color:#006aac;animation:bimvspin 1s linear infinite}
#bimv-modal .bimv-loader.bimv-err .bimv-spin{display:none}
@keyframes bimvspin{to{transform:rotate(360deg)}}
#bimv-modal .bimv-hint{position:absolute;left:0;right:0;bottom:0;padding:7px 10px;
    font-size:11px;color:#6b7885;background:rgba(255,255,255,.85);border-top:1px solid #e4e9ef;text-align:center}

/* --- BIM-spezifisch: Artikel-Info + Port-Legende ueber dem dunklen 3D-Canvas ---
   (analog #info/#legend der Standalone-Seite bim/viewer.php, hier als Overlay
   in der Modal-Buehne; pointer-events:none -> stoert Orbit-Drag nicht) */
/* Helles Panel-Design passend zum Studio-Hintergrund (2026-07-21, vorher dunkle
   Boxen mit hellgrauem Text — am Desktop schlecht lesbar). Groessere Schrift,
   voller Kontrast, Umbruch statt Abschneiden. */
#bimv-modal .bimv-info{position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.92);
    border:1px solid #DEE2E6;border-radius:10px;padding:11px 14px;max-width:min(78vw,400px);
    color:#444;font-size:13px;line-height:1.45;overflow-wrap:break-word;pointer-events:none}
#bimv-modal .bimv-info-bez{font-size:13.5px;color:#03518B;font-weight:700}
#bimv-modal .bimv-info-ports{font-size:13px;margin-top:7px;font-variant-numeric:tabular-nums}
#bimv-modal .bimv-legend{position:absolute;right:14px;top:12px;background:rgba(255,255,255,.92);
    border:1px solid #DEE2E6;border-radius:10px;padding:9px 12px;font-size:12.5px;color:#444;
    pointer-events:none}
#bimv-modal .bimv-row{display:flex;align-items:center;gap:7px;margin:2px 0}
#bimv-modal .bimv-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}

@media(max-width:640px){
    /* dezenter Rand rundum (Backdrop bleibt sichtbar) + handy-sichere Hoehe via dvh,
       damit das Modal NICHT unter die Browser-Leiste laeuft und das X immer erreichbar ist
       (1:1 vom STEP-Modal uebernommen) */
    #bimv-modal .bimv-box{
        width:calc(100vw - 20px);
        height:calc(100vh - 20px);
        height:calc(100dvh - 20px);
        border-radius:12px;
        border:1px solid #006aac;
    }
    /* groesseres, klar sichtbares Schliessen-X (Tap-Ziel >=42px, hoher Kontrast) */
    #bimv-modal .bimv-bar{padding:12px}
    #bimv-modal .bimv-close{width:42px;height:42px;font-size:26px;color:#fff;
        background:#006aac;border-color:#006aac}
    #bimv-modal .bimv-hint{font-size:10px}
    /* Legende/Info verkleinert nach unten/rechts, damit sie auf schmalen Screens
       nicht mit der Titelleiste bzw. dem Hinweistext kollidiert */
    #bimv-modal .bimv-legend{top:auto;bottom:60px;right:14px}
    #bimv-modal .bimv-info{max-width:56vw}
}