/* ==================================================================================================================
   rtt-splash.css (2026-11-13): the REYSTI boot splash shared by every app (Waiter, Kitchen, Back office, Customer).
   Copied from APPS/KIOSK/RTT.Kiosk/wwwroot/css/app.css (BOOT SPLASH 2026-10-29), which keeps its own copy.
   Replaces the legacy Intro.gif + Logo.png + progress ring + divEffects 3D glowing text (Marc 2026-11-13:
   no old design of the legacy app anywhere).
   ================================================================================================================== */
   ================================================================================================================== */
#divLogo_index.rs-splash {
    --rs-bg: var(--rtt-bg, #0a0a14);
    --rs-ink: var(--rtt-text, #f0f0f5);
    --rs-accent: var(--rtt-primary, #84baf8);
    --rs-accent-rgb: var(--rtt-primary-rgb, 132, 186, 248);
    position: fixed;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 3.2vmin, 34px);
    min-height: 0;
    height: auto;
    padding: 0;
    background: var(--rs-bg);
    color: var(--rs-ink);
    font-family: 'Sora', system-ui, sans-serif;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
}

.rs-glow {
    position: absolute;
    left: 50%;
    top: 46%;
    width: 120vmax;
    height: 120vmax;
    transform: translate(-50%, -50%);
    background: radial-gradient(closest-side, rgba(var(--rs-accent-rgb), .16), rgba(var(--rs-accent-rgb), .05) 45%, transparent 100%); /* soft edge: no visible ring */
    pointer-events: none;
    animation: rs-breathe 6s ease-in-out infinite;
}

.rs-mark {
    position: relative;
    display: flex;
    padding-left: .42em; /* optical centring: the tracking adds space after the last letter */
    font-size: clamp(30px, 8.5vmin, 96px);
    font-weight: 600;
    letter-spacing: .42em;
    line-height: 1;
}

.rs-mark span {
    display: inline-block;
    animation: rs-rise .9s cubic-bezier(.16, 1, .3, 1) both;
}

.rs-mark span:nth-child(2) { animation-delay: .07s; }
.rs-mark span:nth-child(3) { animation-delay: .14s; }
.rs-mark span:nth-child(4) { animation-delay: .21s; }
.rs-mark span:nth-child(5) { animation-delay: .28s; }
.rs-mark span:nth-child(6) { animation-delay: .35s; }

.rs-line {
    position: relative;
    width: clamp(120px, 26vmin, 260px);
    height: 2px;
    border-radius: 2px;
    background: rgba(var(--rs-accent-rgb), .16);
    overflow: hidden;
    animation: rs-fade .8s ease .5s both;
}

.rs-line i {
    position: absolute;
    inset: 0 auto 0 0;
    width: var(--blazor-load-percentage, 0%);
    background: var(--rs-accent);
    box-shadow: 0 0 12px rgba(var(--rs-accent-rgb), .7);
    transition: width .25s ease-out;
}

.rs-pct {
    min-height: 1.2em;
    font-size: clamp(11px, 1.5vmin, 15px);
    font-weight: 500;
    letter-spacing: .18em;
    font-variant-numeric: tabular-nums;
    color: rgba(var(--rs-accent-rgb), .75);
    animation: rs-fade .8s ease .6s both;
}

.rs-pct::after { content: var(--blazor-load-percentage-text, ""); }

/* no progress value (MAUI host): a light travels along the line */
.rs-indet .rs-line i {
    width: 34%;
    background: linear-gradient(90deg, transparent, var(--rs-accent), transparent);
    animation: rs-travel 1.6s cubic-bezier(.45, .05, .55, .95) infinite;
}

@keyframes rs-rise { from { opacity: 0; transform: translateY(.35em); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes rs-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes rs-breathe { 0%, 100% { opacity: .7; transform: translate(-50%, -50%) scale(.96); } 50% { opacity: 1; transform: translate(-50%, -50%) scale(1.04); } }
@keyframes rs-travel { from { transform: translateX(-110%); } to { transform: translateX(310%); } }

@media (prefers-reduced-motion: reduce) {
    .rs-glow, .rs-mark span, .rs-line, .rs-pct { animation: none; }
    .rs-indet .rs-line i { animation: none; width: 100%; opacity: .5; }
}

/* ==================================================================================================================
   2026-11-13: "new version ready" bar of rtt-sw-update.js (shown only away from the sign-in / home page)
   ================================================================================================================== */
.rtt-update-bar {
    position: fixed;
    left: 50%;
    bottom: max(16px, env(safe-area-inset-bottom, 0px));
    transform: translateX(-50%);
    z-index: 2147483000;
    display: flex;
    align-items: center;
    gap: 14px;
    max-width: calc(100vw - 32px);
    padding: 10px 10px 10px 18px;
    border: 1px solid var(--rtt-border, rgba(255, 255, 255, .08));
    border-radius: var(--rtt-radius-full, 9999px);
    background: var(--rtt-bg-elevated, #14142a);
    color: var(--rtt-text, #f0f0f5);
    font: 500 14px/1.3 var(--rtt-font-family, 'Sora', system-ui, sans-serif);
    box-shadow: var(--rtt-shadow-xl, 0 20px 50px rgba(0, 0, 0, .6));
}

.rtt-update-bar button {
    flex: 0 0 auto;
    padding: 8px 16px;
    border: none;
    border-radius: var(--rtt-radius-full, 9999px);
    background: var(--rtt-gradient-primary, #84baf8);
    color: var(--rtt-text-on-primary, #0a0a14);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.rtt-update-bar button:focus-visible {
    outline: 2px solid var(--rtt-focus-ring, #3cc2fc);
    outline-offset: 2px;
}