| @@ -1,4 +1,5 @@ | ||
| 1 | + | |
| 1 | 2 | /** |
| 2 | 3 | * All of the CSS for your public-facing functionality should be |
| 3 | 4 | * included in this file. |
| 4 | 5 | */ |
| @@ -2128,9 +2129,9 @@ | ||
| 2128 | 2129 | #master-container .custom-scene-navigation { |
| 2129 | 2130 | position: absolute; |
| 2130 | 2131 | top: 4px; |
| 2131 | 2132 | left: 4px; |
| 2132 | - z-index: 4; | |
| 2133 | + z-index: 40 !important; | |
| 2133 | 2134 | text-align: center; |
| 2134 | 2135 | display: flex; |
| 2135 | 2136 | flex-flow: column; |
| 2136 | 2137 | align-items: center; |
| @@ -2162,9 +2163,9 @@ | ||
| 2162 | 2163 | top: 20px; |
| 2163 | 2164 | color: #8e44ad; |
| 2164 | 2165 | width: 176px; |
| 2165 | 2166 | position: absolute; |
| 2166 | - z-index: 10; | |
| 2167 | + z-index: 50 !important; | |
| 2167 | 2168 | opacity: 0; |
| 2168 | 2169 | visibility: hidden; |
| 2169 | 2170 | transition: all 0.2s ease; |
| 2170 | 2171 | border-radius: 6px; |
| @@ -2335,15 +2336,8 @@ | ||
| 2335 | 2336 | visibility: visible !important; |
| 2336 | 2337 | opacity: 1 !important; |
| 2337 | 2338 | } |
| 2338 | 2339 | |
| 2339 | -#cp-logo-controls .cp-logo-ctrl:focus .cp-info, | |
| 2340 | -#cp-logo-controls .cp-logo-ctrl:focus-within .cp-info { | |
| 2341 | - display: block; | |
| 2342 | - opacity: 1; | |
| 2343 | - visibility: visible; | |
| 2344 | -} | |
| 2345 | - | |
| 2346 | 2340 | .wpvr-a11y-instructions { |
| 2347 | 2341 | position: absolute !important; |
| 2348 | 2342 | width: 1px !important; |
| 2349 | 2343 | height: 1px !important; |
| @@ -2358,4 +2352,355 @@ | ||
| 2358 | 2352 | @media (forced-colors: active) { |
| 2359 | 2353 | .pano-wrap.pnlm-container:focus-visible, |
| 2360 | 2354 | .pano-wrap .wpvr-a11y-control:focus-visible { |
| 2361 | 2355 | outline: 3px solid CanvasText !important; |
| 2356 | + } | |
| 2357 | +} | |
| 2358 | + | |
| 2359 | +/* ── WPVR Frontend Text Overlays & Controls Stacking ────────── */ | |
| 2360 | +/* Hotspots stay behind text overlays */ | |
| 2361 | +.pano-wrap .pnlm-hotspot-base, | |
| 2362 | +.pano-wrap .pnlm-hotspot, | |
| 2363 | +.pano-wrap .pnlm-tooltip, | |
| 2364 | +.pnlm-container .pnlm-hotspot-base, | |
| 2365 | +.pnlm-container .pnlm-hotspot, | |
| 2366 | +.pnlm-container .pnlm-tooltip { | |
| 2367 | + z-index: 2 !important; | |
| 2368 | +} | |
| 2369 | + | |
| 2370 | +/* Text overlay layer */ | |
| 2371 | +.wpvr-frontend-text-overlays { | |
| 2372 | + position: absolute; | |
| 2373 | + inset: 0; | |
| 2374 | + width: 100%; | |
| 2375 | + height: 100%; | |
| 2376 | + pointer-events: none; | |
| 2377 | + z-index: 10 !important; | |
| 2378 | + overflow: hidden; | |
| 2379 | +} | |
| 2380 | + | |
| 2381 | +.wpvr-frontend-text-overlay { | |
| 2382 | + position: absolute; | |
| 2383 | + box-sizing: border-box; | |
| 2384 | + pointer-events: auto; | |
| 2385 | + z-index: var(--wpvr-overlay-z-index, 10) !important; | |
| 2386 | + display: block; | |
| 2387 | + overflow: hidden; | |
| 2388 | + user-select: text; | |
| 2389 | + -webkit-user-select: text; | |
| 2390 | + text-align: left; | |
| 2391 | + transition: opacity 0.25s ease, transform 0.25s ease; | |
| 2392 | +} | |
| 2393 | + | |
| 2394 | +/* Pannellum UI overlay container and drag surface stay below text overlays and controls */ | |
| 2395 | +.pano-wrap .pnlm-ui, | |
| 2396 | +.pnlm-container .pnlm-ui { | |
| 2397 | + z-index: auto !important; | |
| 2398 | +} | |
| 2399 | + | |
| 2400 | +.pano-wrap .pnlm-dragfix, | |
| 2401 | +.pnlm-container .pnlm-dragfix { | |
| 2402 | + z-index: 1 !important; | |
| 2403 | + pointer-events: auto !important; | |
| 2404 | +} | |
| 2405 | + | |
| 2406 | +/* Tour control buttons & other tour-related buttons have preference over overlay */ | |
| 2407 | +.pano-wrap .pnlm-controls-container, | |
| 2408 | +.pano-wrap .pnlm-controls-container *, | |
| 2409 | +.pano-wrap .pnlm-controls, | |
| 2410 | +.pano-wrap .pnlm-controls *, | |
| 2411 | +.pano-wrap .pnlm-control, | |
| 2412 | +.pano-wrap .pnlm-control *, | |
| 2413 | +.pano-wrap .pnlm-zoom-controls, | |
| 2414 | +.pano-wrap .pnlm-zoom-controls *, | |
| 2415 | +.pano-wrap .pnlm-fullscreen-toggle-button, | |
| 2416 | +.pano-wrap .pnlm-orientation-button, | |
| 2417 | +.pano-wrap .pnlm-compass, | |
| 2418 | +.pano-wrap .pnlm-load-button, | |
| 2419 | +.pano-wrap .pnlm-load-box, | |
| 2420 | +.pano-wrap .pnlm-panorama-info, | |
| 2421 | +.pano-wrap .zoom-in-out-controls, | |
| 2422 | +.pano-wrap .zoom-in-out-controls *, | |
| 2423 | +.pano-wrap .controls, | |
| 2424 | +.pano-wrap .controls *, | |
| 2425 | +.pano-wrap .ctrl, | |
| 2426 | +.pano-wrap .ctrl *, | |
| 2427 | +.pano-wrap .explainer_button, | |
| 2428 | +.pano-wrap .explainer_button *, | |
| 2429 | +.pano-wrap .floor_map_button, | |
| 2430 | +.pano-wrap .floor_map_button *, | |
| 2431 | +.pano-wrap .generic_form_button, | |
| 2432 | +.pano-wrap .generic_form_button *, | |
| 2433 | +.pano-wrap .adcontrol, | |
| 2434 | +.pano-wrap .adcontrol *, | |
| 2435 | +.pano-wrap .audio_control, | |
| 2436 | +.pano-wrap .audio_control *, | |
| 2437 | +.pano-wrap #cp-logo-controls, | |
| 2438 | +.pano-wrap #cp-logo-controls *, | |
| 2439 | +.pano-wrap .cp-logo-ctrl, | |
| 2440 | +.pano-wrap .cp-logo-ctrl *, | |
| 2441 | +.pano-wrap .scene-gallery, | |
| 2442 | +.pano-wrap .scene-gallery *, | |
| 2443 | +.pano-wrap .vrowl-carousel, | |
| 2444 | +.pano-wrap .vrowl-carousel *, | |
| 2445 | +.pano-wrap .wpvr_slider_nav, | |
| 2446 | +.pano-wrap .wpvr_slider_nav *, | |
| 2447 | +.pano-wrap .wpvr_owl_prev, | |
| 2448 | +.pano-wrap .wpvr_owl_prev *, | |
| 2449 | +.pano-wrap .wpvr_owl_next, | |
| 2450 | +.pano-wrap .wpvr_owl_next *, | |
| 2451 | +.pano-wrap .vrgcontrols, | |
| 2452 | +.pano-wrap .vrgcontrols *, | |
| 2453 | +.pano-wrap .wpvr-scene-info-row, | |
| 2454 | +.pano-wrap .wpvr-cardboard-switcher, | |
| 2455 | +.pano-wrap .wpvr-cardboard-switcher *, | |
| 2456 | +.pano-wrap .wpvr-call-to-action-button, | |
| 2457 | +.pano-wrap .fullscreen-button, | |
| 2458 | +.pano-wrap .vr-pointer-container, | |
| 2459 | +.pnlm-container .pnlm-controls-container, | |
| 2460 | +.pnlm-container .pnlm-controls-container *, | |
| 2461 | +.pnlm-container .pnlm-controls, | |
| 2462 | +.pnlm-container .pnlm-controls *, | |
| 2463 | +.pnlm-container .pnlm-control, | |
| 2464 | +.pnlm-container .pnlm-control *, | |
| 2465 | +.pnlm-container .pnlm-zoom-controls, | |
| 2466 | +.pnlm-container .pnlm-zoom-controls *, | |
| 2467 | +.pnlm-container .pnlm-fullscreen-toggle-button, | |
| 2468 | +.pnlm-container .pnlm-orientation-button, | |
| 2469 | +.pnlm-container .pnlm-compass, | |
| 2470 | +.pnlm-container .pnlm-load-button, | |
| 2471 | +.pnlm-container .pnlm-load-box, | |
| 2472 | +.pnlm-container .pnlm-panorama-info, | |
| 2473 | +.pnlm-container .zoom-in-out-controls, | |
| 2474 | +.pnlm-container .zoom-in-out-controls *, | |
| 2475 | +.pnlm-container .controls, | |
| 2476 | +.pnlm-container .controls *, | |
| 2477 | +.pnlm-container .ctrl, | |
| 2478 | +.pnlm-container .ctrl *, | |
| 2479 | +.pnlm-container .explainer_button, | |
| 2480 | +.pnlm-container .explainer_button *, | |
| 2481 | +.pnlm-container .floor_map_button, | |
| 2482 | +.pnlm-container .floor_map_button *, | |
| 2483 | +.pnlm-container .generic_form_button, | |
| 2484 | +.pnlm-container .generic_form_button *, | |
| 2485 | +.pnlm-container .adcontrol, | |
| 2486 | +.pnlm-container .adcontrol *, | |
| 2487 | +.pnlm-container .audio_control, | |
| 2488 | +.pnlm-container .audio_control *, | |
| 2489 | +.pnlm-container #cp-logo-controls, | |
| 2490 | +.pnlm-container #cp-logo-controls *, | |
| 2491 | +.pnlm-container .cp-logo-ctrl, | |
| 2492 | +.pnlm-container .cp-logo-ctrl *, | |
| 2493 | +.pnlm-container .scene-gallery, | |
| 2494 | +.pnlm-container .scene-gallery *, | |
| 2495 | +.pnlm-container .vrowl-carousel, | |
| 2496 | +.pnlm-container .vrowl-carousel *, | |
| 2497 | +.pnlm-container .wpvr_slider_nav, | |
| 2498 | +.pnlm-container .wpvr_slider_nav *, | |
| 2499 | +.pnlm-container .wpvr_owl_prev, | |
| 2500 | +.pnlm-container .wpvr_owl_prev *, | |
| 2501 | +.pnlm-container .wpvr_owl_next, | |
| 2502 | +.pnlm-container .wpvr_owl_next *, | |
| 2503 | +.pnlm-container .vrgcontrols, | |
| 2504 | +.pnlm-container .vrgcontrols *, | |
| 2505 | +.pnlm-container .wpvr-scene-info-row, | |
| 2506 | +.pnlm-container .wpvr-cardboard-switcher, | |
| 2507 | +.pnlm-container .wpvr-cardboard-switcher *, | |
| 2508 | +.pnlm-container .wpvr-call-to-action-button, | |
| 2509 | +.pnlm-container .fullscreen-button, | |
| 2510 | +.pnlm-container .vr-pointer-container { | |
| 2511 | + z-index: 40 !important; | |
| 2512 | + pointer-events: auto !important; | |
| 2513 | +} | |
| 2514 | + | |
| 2515 | +.wpvr-frontend-text-overlay, | |
| 2516 | +.wpvr-frontend-text-overlay__body, | |
| 2517 | +.wpvr-frontend-text-overlay__content { | |
| 2518 | + text-align: left; | |
| 2519 | +} | |
| 2520 | + | |
| 2521 | +.wpvr-frontend-text-overlay * { | |
| 2522 | + user-select: text; | |
| 2523 | + -webkit-user-select: text; | |
| 2524 | +} | |
| 2525 | + | |
| 2526 | +.wpvr-frontend-text-overlay__body { | |
| 2527 | + position: absolute; | |
| 2528 | + inset: 0; | |
| 2529 | + width: 100%; | |
| 2530 | + height: 100%; | |
| 2531 | + overflow-y: auto; | |
| 2532 | + overflow-x: hidden; | |
| 2533 | + box-sizing: border-box; | |
| 2534 | + -webkit-overflow-scrolling: touch; | |
| 2535 | + text-align: left; | |
| 2536 | +} | |
| 2537 | + | |
| 2538 | +/* Custom sleek scrollbar for overlay body */ | |
| 2539 | +.wpvr-frontend-text-overlay__body::-webkit-scrollbar { | |
| 2540 | + width: 5px; | |
| 2541 | +} | |
| 2542 | +.wpvr-frontend-text-overlay__body::-webkit-scrollbar-track { | |
| 2543 | + background: transparent; | |
| 2544 | +} | |
| 2545 | +.wpvr-frontend-text-overlay__body::-webkit-scrollbar-thumb { | |
| 2546 | + background: rgba(255, 255, 255, 0.25); | |
| 2547 | + border-radius: 4px; | |
| 2548 | +} | |
| 2549 | +.wpvr-frontend-text-overlay__body::-webkit-scrollbar-thumb:hover { | |
| 2550 | + background: rgba(255, 255, 255, 0.45); | |
| 2551 | +} | |
| 2552 | + | |
| 2553 | +.wpvr-frontend-text-overlay__content { | |
| 2554 | + position: absolute; | |
| 2555 | + box-sizing: border-box; | |
| 2556 | + line-height: 1.55; | |
| 2557 | + color: #ffffff; | |
| 2558 | + word-break: break-word; | |
| 2559 | + padding-bottom: 24px; | |
| 2560 | + text-align: left; | |
| 2561 | +} | |
| 2562 | + | |
| 2563 | +.wpvr-frontend-text-overlay__content * { | |
| 2564 | + max-width: 100%; | |
| 2565 | + box-sizing: border-box; | |
| 2566 | +} | |
| 2567 | + | |
| 2568 | +.wpvr-frontend-text-overlay__content p { | |
| 2569 | + margin: 0 0 10px 0; | |
| 2570 | + text-align: left; | |
| 2571 | +} | |
| 2572 | +.wpvr-frontend-text-overlay__content p:last-child { | |
| 2573 | + margin-bottom: 0; | |
| 2574 | +} | |
| 2575 | + | |
| 2576 | +.wpvr-frontend-text-overlay__content h1, | |
| 2577 | +.wpvr-frontend-text-overlay__content h2, | |
| 2578 | +.wpvr-frontend-text-overlay__content h3, | |
| 2579 | +.wpvr-frontend-text-overlay__content h4, | |
| 2580 | +.wpvr-frontend-text-overlay__content h5, | |
| 2581 | +.wpvr-frontend-text-overlay__content h6 { | |
| 2582 | + margin: 0 0 8px 0; | |
| 2583 | + line-height: 1.25; | |
| 2584 | + color: inherit; | |
| 2585 | + font-weight: 700; | |
| 2586 | + text-align: left; | |
| 2587 | +} | |
| 2588 | + | |
| 2589 | +.wpvr-frontend-text-overlay__content ul, | |
| 2590 | +.wpvr-frontend-text-overlay__content ol { | |
| 2591 | + margin: 0 0 10px 0; | |
| 2592 | + padding-left: 20px; | |
| 2593 | +} | |
| 2594 | + | |
| 2595 | +.wpvr-frontend-text-overlay__content li { | |
| 2596 | + margin-bottom: 4px; | |
| 2597 | +} | |
| 2598 | + | |
| 2599 | +.wpvr-frontend-text-overlay__content blockquote { | |
| 2600 | + margin: 0 0 10px 0; | |
| 2601 | + padding: 4px 12px; | |
| 2602 | + border-left: 3px solid rgba(255, 255, 255, 0.45); | |
| 2603 | + font-style: italic; | |
| 2604 | +} | |
| 2605 | + | |
| 2606 | +.wpvr-frontend-text-overlay__content a { | |
| 2607 | + color: #60a5fa; | |
| 2608 | + text-decoration: underline; | |
| 2609 | + text-underline-offset: 2px; | |
| 2610 | + transition: color 0.15s ease; | |
| 2611 | +} | |
| 2612 | +.wpvr-frontend-text-overlay__content a:hover { | |
| 2613 | + color: #93c5fd; | |
| 2614 | +} | |
| 2615 | + | |
| 2616 | +.wpvr-frontend-text-overlay__content img { | |
| 2617 | + border-radius: 6px; | |
| 2618 | + height: auto; | |
| 2619 | +} | |
| 2620 | + | |
| 2621 | +/* Close button */ | |
| 2622 | +.wpvr-text-overlay-close-btn { | |
| 2623 | + position: absolute; | |
| 2624 | + /* Follow the top-right curve without leaving small overlays. */ | |
| 2625 | + top: min(var(--wpvr-overlay-close-inset, 12px), max(0px, calc(50% - 14px))); | |
| 2626 | + right: min(var(--wpvr-overlay-close-inset, 12px), max(0px, calc(50% - 14px))); | |
| 2627 | + width: 28px; | |
| 2628 | + height: 28px; | |
| 2629 | + border-radius: 50%; | |
| 2630 | + background: rgba(0, 0, 0, 0.45); | |
| 2631 | + border: 1px solid rgba(255, 255, 255, 0.22); | |
| 2632 | + color: #ffffff; | |
| 2633 | + cursor: pointer; | |
| 2634 | + display: flex; | |
| 2635 | + align-items: center; | |
| 2636 | + justify-content: center; | |
| 2637 | + padding: 0; | |
| 2638 | + margin: 0; | |
| 2639 | + z-index: 35 !important; | |
| 2640 | + backdrop-filter: blur(8px); | |
| 2641 | + -webkit-backdrop-filter: blur(8px); | |
| 2642 | + transition: background 0.15s ease, transform 0.15s ease, color 0.15s ease; | |
| 2643 | +} | |
| 2644 | + | |
| 2645 | +.wpvr-text-overlay-close-btn:hover { | |
| 2646 | + background: rgba(0, 0, 0, 0.75); | |
| 2647 | + transform: scale(1.08); | |
| 2648 | + color: #ffffff; | |
| 2649 | +} | |
| 2650 | + | |
| 2651 | +.wpvr-text-overlay-close-btn:focus-visible { | |
| 2652 | + outline: 2px solid #ffffff; | |
| 2653 | + outline-offset: 2px; | |
| 2654 | +} | |
| 2655 | + | |
| 2656 | +/* Reopen button */ | |
| 2657 | +.wpvr-text-overlay-reopen-btn { | |
| 2658 | + position: absolute; | |
| 2659 | + z-index: 35 !important; | |
| 2660 | + pointer-events: auto !important; | |
| 2661 | + display: inline-flex; | |
| 2662 | + align-items: center; | |
| 2663 | + gap: 7px; | |
| 2664 | + padding: 7px 13px; | |
| 2665 | + background: rgba(20, 20, 25, 0.85); | |
| 2666 | + border: 1px solid rgba(255, 255, 255, 0.22); | |
| 2667 | + border-radius: 9999px; | |
| 2668 | + color: #ffffff; | |
| 2669 | + font-size: 12.5px; | |
| 2670 | + font-weight: 500; | |
| 2671 | + cursor: pointer; | |
| 2672 | + box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35); | |
| 2673 | + backdrop-filter: blur(12px); | |
| 2674 | + -webkit-backdrop-filter: blur(12px); | |
| 2675 | + transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; | |
| 2676 | + user-select: none; | |
| 2677 | + -webkit-user-select: none; | |
| 2678 | +} | |
| 2679 | + | |
| 2680 | +.wpvr-text-overlay-reopen-btn:hover { | |
| 2681 | + background: rgba(30, 30, 42, 0.95); | |
| 2682 | + transform: translateY(-1px) scale(1.03); | |
| 2683 | + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45); | |
| 2684 | +} | |
| 2685 | + | |
| 2686 | +.wpvr-text-overlay-reopen-btn:focus-visible { | |
| 2687 | + outline: 2px solid #ffffff; | |
| 2688 | + outline-offset: 2px; | |
| 2689 | +} | |
| 2690 | + | |
| 2691 | +/* Responsive adjustments */ | |
| 2692 | +@media (max-width: 640px) { | |
| 2693 | + .wpvr-frontend-text-overlay--template-left { | |
| 2694 | + min-width: min(85%, 320px) !important; | |
| 2695 | + } | |
| 2696 | + .wpvr-frontend-text-overlay--template-right { | |
| 2697 | + min-width: min(85%, 320px) !important; | |
| 2698 | + left: auto !important; | |
| 2699 | + right: 0 !important; | |
| 2700 | + } | |
| 2701 | + .wpvr-frontend-text-overlay--template-top, | |
| 2702 | + .wpvr-frontend-text-overlay--template-bottom { | |
| 2703 | + min-height: min(60%, 260px) !important; | |
| 2704 | + } | |
| 2705 | +} | |
| 2706 | + | |
