/*
 * GIZ Surface Aura foundations.
 * All loading states use the approved GIZ UI Experience glow and progress animation.
 */
:root{
  --giz-wallpaper-light:url('/brand/giz-ui/aurora-light-landscape.jpg');
  --giz-wallpaper-light-portrait:url('/brand/giz-ui/aurora-light-portrait.jpg');
  --giz-wallpaper-dark:url('/brand/giz-ui/aurora-dark-landscape.jpg');
  --giz-wallpaper-dark-portrait:url('/brand/giz-ui/aurora-dark-portrait.jpg');
  --giz-wallpaper:var(--giz-wallpaper-light);
  --giz-loading-accent:#7356a8;
  --giz-page-canvas:#f8f6f3;
  --giz-page-ink:#17192d;
}
:root[data-theme="dark"]{
  --giz-wallpaper:var(--giz-wallpaper-dark);
  --giz-loading-accent:#bba3df;
  --giz-page-canvas:#11121a;
  --giz-page-ink:#f3f1f7;
}

/* Portrait aurora on phone-width screens. */
@media(max-width:740px){
  :root{--giz-wallpaper:var(--giz-wallpaper-light-portrait)}
  :root[data-theme="dark"]{--giz-wallpaper:var(--giz-wallpaper-dark-portrait)}
}

/* Shared with AuthLoading; available before React for the initial HTML boot. */
.auth-loading-glow{position:relative;width:70px;height:70px;margin:0 auto 8px;border-radius:50%;background:radial-gradient(circle,rgba(139,94,205,.46) 0%,rgba(139,94,205,.23) 25%,rgba(139,94,205,.08) 48%,transparent 72%);filter:blur(1px);animation:auth-loading-glow 2.8s ease-in-out infinite}
.auth-loading-glow::before{content:"";position:absolute;inset:15px;border-radius:50%;background:radial-gradient(circle,rgba(141,95,213,.4),rgba(141,95,213,.1) 58%,transparent 76%);filter:blur(8px)}
.auth-progress{width:min(100%,235px);height:5px;margin:6px 0 0;overflow:hidden;border-radius:99px;background:var(--giz-line,color-mix(in srgb,var(--giz-page-ink) 14%,transparent))}
.auth-progress span{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,rgba(140,186,183,.9),var(--giz-accent,var(--giz-loading-accent)),rgba(216,171,123,.9));transform-origin:left center;animation:auth-progress 2.6s ease-in-out infinite}
@keyframes auth-progress{0%{transform:scaleX(.04);opacity:1}78%{transform:scaleX(1);opacity:1;filter:brightness(1.08)}100%{transform:scaleX(1);opacity:0}}
@keyframes auth-loading-glow{0%,100%{opacity:.62;transform:scale(.92)}50%{opacity:1;transform:scale(1.12)}}

.giz-loading{box-sizing:border-box;width:100%;display:grid;place-items:center;padding:24px;color:var(--giz-ink,var(--giz-page-ink))}
.giz-loading__card{box-sizing:border-box;width:min(100%,340px);display:grid;justify-items:center;gap:10px;padding:28px;border:1px solid var(--giz-line-strong,color-mix(in srgb,var(--giz-page-ink) 18%,transparent));border-radius:var(--giz-radius-card,22px);background:var(--giz-glass,color-mix(in srgb,var(--giz-page-canvas) 82%,transparent));color:var(--giz-ink,var(--giz-page-ink));font-family:var(--giz-font-body,Inter,ui-sans-serif,system-ui,sans-serif);text-align:center;-webkit-backdrop-filter:blur(25px) saturate(110%);backdrop-filter:blur(25px) saturate(110%)}
.giz-loading__card>strong{font-size:18px;font-weight:600;line-height:1.2;letter-spacing:-.025em}
.giz-loading__card>p{margin:0;color:var(--giz-muted,color-mix(in srgb,var(--giz-page-ink) 65%,transparent));font-size:13px;line-height:1.5}
.giz-loading--inline{min-height:76px;padding:12px}
.giz-loading--inline .giz-loading__card{width:min(100%,480px);grid-template-columns:48px minmax(0,1fr);justify-items:start;gap:6px 12px;padding:14px 16px;border-radius:20px;text-align:left}
.giz-loading--inline .auth-loading-glow{grid-column:1;grid-row:1/4;width:48px;height:48px;margin:0;align-self:center}
.giz-loading--inline .giz-loading__card>strong,.giz-loading--inline .giz-loading__card>p,.giz-loading--inline .auth-progress{grid-column:2}
.giz-loading--inline .giz-loading__card>strong{font-size:14px}
.giz-top-loader{position:fixed;top:0;left:0;right:0;z-index:60;height:3px;overflow:hidden;pointer-events:none}
.giz-top-loader__bar{display:block;width:38%;height:100%;border-radius:99px;background:linear-gradient(90deg,rgba(140,186,183,.9),var(--giz-accent,var(--giz-loading-accent)),rgba(216,171,123,.9));box-shadow:0 0 12px var(--giz-accent,var(--giz-loading-accent));animation:giz-top-loader 1.3s cubic-bezier(.4,0,.2,1) infinite}
@keyframes giz-top-loader{0%{transform:translateX(-100%)}100%{transform:translateX(265%)}}
.giz-thinking{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:4px 14px;padding:14px 16px;border:1px solid var(--giz-line-strong,color-mix(in srgb,var(--giz-page-ink) 18%,transparent));border-radius:var(--giz-radius-card,22px);background:var(--giz-glass,color-mix(in srgb,var(--giz-page-canvas) 82%,transparent));color:var(--giz-ink,var(--giz-page-ink))}
.giz-thinking .auth-loading-glow{grid-column:1;grid-row:1/4;width:48px;height:48px;margin:0}
.giz-thinking>div{grid-column:2;display:grid;gap:4px;min-width:0}
.giz-thinking__title{font-size:15px;font-weight:600;letter-spacing:-.02em;background:linear-gradient(100deg,var(--giz-ink,var(--giz-page-ink)) 30%,var(--giz-accent,var(--giz-loading-accent)) 50%,var(--giz-ink,var(--giz-page-ink)) 70%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:giz-thinking-title 2.4s linear infinite}
.giz-thinking__detail{color:var(--giz-muted,color-mix(in srgb,var(--giz-page-ink) 65%,transparent));font-size:12px;line-height:1.5}
.giz-thinking .auth-progress{width:100%;margin:6px 0 0}
.giz-thinking__sweep{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(110deg,transparent 20%,rgba(170,118,231,.16) 40%,rgba(246,201,145,.18) 54%,transparent 74%);background-size:250% 100%;animation:giz-thinking-sweep 2.4s ease-in-out infinite}
@keyframes giz-thinking-title{from{background-position:120% 0}to{background-position:-120% 0}}
@keyframes giz-thinking-sweep{0%{background-position:120% 0;opacity:0}30%{opacity:1}100%{background-position:-60% 0;opacity:0}}
@media(prefers-reduced-motion:reduce){.auth-loading-glow,.auth-progress span,.giz-top-loader__bar,.giz-thinking__sweep,.giz-thinking__title{animation:none}.auth-progress span{transform:none}.giz-top-loader__bar{width:100%;opacity:.7}.auth-loading-glow{opacity:.8}}
