/* Early paint / Tauri shell — loaded from index.html before the app bundle */

.login-brand-name {
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  font-display: optional;
}

/*
 * Anonymous /login first paint: tint #root before the JS bundle runs so a cold
 * restart does not flash a blank white page for several seconds (dev Vite).
 */
html:not([data-tauri]) body:not([data-tauri]) #root:empty {
  min-height: 100dvh;
  background-color: #f4f4f5;
}

@media (prefers-color-scheme: dark) {
  html:not([data-tauri]) body:not([data-tauri]) #root:empty {
    background-color: #18181b;
  }
}

/*
 * Zero the user-agent body margin before the app bundle. A full navigation
 * otherwise paints body at y=8, then layout.css sets margin:0 and the
 * document jumps up 8px (mobile CLS ~0.012 on every list route).
 */
html,
body {
  margin: 0;
}

body {
  font-display: optional;
}

html[data-tauri],
body[data-tauri],
html[data-tauri] #root,
body[data-tauri] #root {
  background: transparent !important;
  background-color: transparent !important;
}

html.tauri-transparent,
body.tauri-transparent {
  background: transparent !important;
  background-color: transparent !important;
  min-height: 100vh;
}

/*
 * Authenticated desktop shell: opaque host so gaps never show the OS desktop through
 * the transparent Tauri window. Only compact auth routes keep tauri-transparent.
 * Body is included from html: boot-early runs in <head>, before body exists.
 */
html.desktop-app:not(.tauri-transparent),
html.desktop-app:not(.tauri-transparent) body,
body.desktop-app:not(.tauri-transparent),
html[data-tauri="1"]:not(.tauri-transparent),
html[data-tauri="1"]:not(.tauri-transparent) body {
  background: var(--surface, #f0eeea) !important;
  background-color: var(--surface, #f0eeea) !important;
  min-height: 100%;
  overflow: hidden;
}

/* Clear host only while splash art is actually mounted. An empty #tauri-loading
   must not punch the paper out: that first frame is white or the desktop. */
html[data-tauri="1"]:has(#tauri-loading .boot-splash),
html[data-tauri="1"]:has(#tauri-loading .boot-splash) body {
  background: transparent !important;
  background-color: transparent !important;
}

html.desktop-app:not(.tauri-transparent) #root,
html[data-tauri="1"]:not(.tauri-transparent) #root {
  background: var(--surface, #f0eeea) !important;
  background-color: var(--surface, #f0eeea) !important;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

#tauri-loading {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  background: transparent;
  background-color: transparent;
}

/*
 * Client first frame. Blues match jmsit.cloud (--accent-gradient / --primary-gradient).
 * Shown only for data-tauri="1". #root stays laid out and is hidden only once
 * the art is actually mounted, so a missed script cannot blank the app.
 */
html[data-tauri="1"] {
  --boot-splash-deep: #2196f3;
  --boot-splash-blue: #4facfe;
  --boot-splash-bright: #00f2fe;
}

html[data-tauri="1"] #tauri-loading:has(.boot-splash) {
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  background-color: transparent;
}

html[data-tauri="1"] #tauri-loading:has(.boot-splash) ~ #root {
  visibility: hidden;
}

.boot-splash {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  background-color: transparent;
  opacity: 0;
  animation: boot-splash-in 280ms ease-out forwards;
}

@keyframes boot-splash-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Leave unhides #root while the mark is still opaque, then the shell fades it out. */
html[data-tauri="1"] #tauri-loading.boot-splash-leave:has(.boot-splash) ~ #root {
  visibility: visible;
}

@media (prefers-reduced-motion: reduce) {
  .boot-splash {
    animation: none;
    opacity: 1;
  }
}

.boot-splash-mark {
  display: block;
  width: 420px;
  max-width: 100%;
  height: auto;
  background: transparent;
  background-color: transparent;
  object-fit: contain;
}

.boot-splash-credit {
  margin: 0;
  padding: 0;
  background-color: transparent;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1;
  color: var(--boot-splash-blue, #4facfe);
  background-image: linear-gradient(
    135deg,
    var(--boot-splash-deep, #2196f3),
    var(--boot-splash-blue, #4facfe) 55%,
    var(--boot-splash-bright, #00f2fe)
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/*
 * Authenticated / pre-glass: empty #root stays paper so a late splash dismiss
 * never punches through to the OS desktop. Glass routes stay transparent.
 */
html.desktop-app:not(.tauri-transparent) #root:empty,
html[data-tauri="1"]:not(.tauri-transparent) #root:empty {
  background: var(--surface, #f0eeea) !important;
  background-color: var(--surface, #f0eeea) !important;
}

html.tauri-transparent #root:empty {
  background: transparent !important;
  background-color: transparent !important;
}
