/* CYBE MARQUE LOADER
   Full-screen overlay shown on every page load. Sits above everything
   else in the site (including the Cybe AI Receptionist backdrop and
   the Tawk widget) so visitors never see the FOUC flash while
   CSS/JS/images finish loading. Counts up to 100%, shows "Welcome" /
   "Welcome back", then fades out. */

#cybeMarqueLoader {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 22px;
    background: var(--surface, #f4f6fb);
    opacity: 1;
    visibility: visible;
    transition: opacity .5s ease, visibility 0s linear 0s;
    /* Failsafe: if the loader JS never runs (blocked by an extension,
       network error, unrelated JS exception on the page) this forces
       the overlay away on its own after 14s — longer than the JS's
       own 8s safety timeout, so it only ever fires as a last resort.
       Prevents a visitor being trapped behind a frozen loader, which
       would be worse than the FOUC it's meant to fix. */
    animation: cybeMarqueForceHide 0.01s 14s forwards;
}

@keyframes cybeMarqueForceHide {
    to { opacity: 0; visibility: hidden; pointer-events: none; }
}

#cybeMarqueLoader.is-done {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease, visibility 0s linear .5s;
    pointer-events: none;
}

body.cybe-marque-loading {
    overflow: hidden;
    /* Matches #cybeMarqueLoader's own failsafe above — if JS never
       runs to remove this class, scrolling still unlocks on its own
       so the page is never permanently stuck. */
    animation: cybeMarqueUnlockScroll 0.01s 14s forwards;
}

@keyframes cybeMarqueUnlockScroll {
    to { overflow: visible; }
}

.cybe-marque-loader-logo {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: var(--neu-flat, 0 4px 18px rgba(0,0,0,.12));
}

.cybe-marque-loader-brand {
    font-family: 'Syne', sans-serif;
    font-weight: 700;
    font-size: 1.15rem;
    letter-spacing: .04em;
    color: var(--text, #1a1a2e);
}

.cybe-marque-loader-bar-track {
    width: min(260px, 70vw);
    height: 6px;
    border-radius: 999px;
    background: rgba(0,0,255,.10);
    overflow: hidden;
}

.cybe-marque-loader-bar-fill {
    height: 100%;
    width: 0%;
    border-radius: 999px;
    background: linear-gradient(90deg, #2f2fe0, #5b7bff);
    transition: width .18s ease-out;
}

.cybe-marque-loader-pct {
    font-family: 'Space Grotesk', sans-serif;
    font-size: .85rem;
    font-weight: 600;
    color: var(--text-muted, #6b6f8a);
    min-height: 1.2em;
}

.cybe-marque-loader-welcome {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--text, #1a1a2e);
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .35s ease, transform .35s ease;
}

#cybeMarqueLoader.is-welcome .cybe-marque-loader-bar-track,
#cybeMarqueLoader.is-welcome .cybe-marque-loader-pct { display: none; }

#cybeMarqueLoader.is-welcome .cybe-marque-loader-welcome {
    opacity: 1;
    transform: translateY(0);
}

.cybe-no-shadow { box-shadow: none !important; }

[data-theme="dark"] #cybeMarqueLoader { background: var(--surface, #14141f); }