/* ============================================================================
   Albash — Nocturne theme for the sign-in (auth.albash.de), injected SAME-ORIGIN
   by the theming proxy. Matches albash.de: warm paper by day, Nocturne dark + gold
   by night (follows the device). Removes all Authelia branding. No CSP changes —
   every asset is served same-origin, so Authelia's strict nonce CSP stays intact.
   ============================================================================ */

/* ---- Brand fonts (served same-origin by the proxy) ---- */
@font-face{font-family:'InterAlbash';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/inter-400.woff2') format('woff2');}
@font-face{font-family:'InterAlbash';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/inter-500.woff2') format('woff2');}
@font-face{font-family:'InterAlbash';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/inter-600.woff2') format('woff2');}

/* ---- Day/night tokens (mirror welcome.css) ---- */
:root{
  --ink:#211d15; --muted:#6c6456; --line:#d8cdb6;
  --accent:#9a6b16; --accent-strong:#b5832a; --on-accent:#ffffff;
  --frame-bg:linear-gradient(180deg, rgba(154,107,22,0.06), rgba(255,255,255,0.55));
  --page-bg:radial-gradient(135% 95% at 50% -12%, #fbf6ea 0%, #efe7d4 60%);
  --frame-shadow:0 26px 70px rgba(60,50,30,0.14);
  --contour-op:0.30; --field-bg:rgba(255,255,255,0.55); --field-solid:#faf5ea;
}
@media (prefers-color-scheme: dark){
  :root{
    --ink:#ece6da; --muted:#a69d8a; --line:#3a3327;
    --accent:#d8a657; --accent-strong:#e7bd74; --on-accent:#1c1505;
    --frame-bg:linear-gradient(180deg, rgba(216,166,87,0.05), rgba(255,255,255,0.012));
    --page-bg:radial-gradient(135% 95% at 50% -12%, #221d14 0%, #100e0a 58%);
    --frame-shadow:0 30px 80px rgba(0,0,0,0.5);
    --contour-op:0.42; --field-bg:rgba(255,255,255,0.02); --field-solid:#1c1813;
  }
}

/* ---- Canvas ---- */
html,body{
  background:var(--page-bg) !important; color:var(--ink) !important;
  font-family:'InterAlbash', system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  min-height:100vh;
}
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:url('/brand/contours.svg') center top / cover no-repeat; opacity:var(--contour-op);
}
#root{position:relative; z-index:1; min-height:100vh;}

/* ---- Top language bar -> blend into the canvas ---- */
header.MuiPaper-root{background:transparent !important; box-shadow:none !important;}
header.MuiPaper-root .MuiTypography-root, header.MuiPaper-root .MuiIconButton-root{color:var(--muted) !important;}

/* ---- Sign-in card (Authelia puts content in a maxWidthXs container, not a Paper) ---- */
.MuiContainer-root.MuiContainer-maxWidthXs{
  background:var(--frame-bg) !important; border:1px solid var(--line) !important;
  border-radius:18px !important; box-shadow:var(--frame-shadow) !important;
  padding:40px 34px !important; max-width:432px !important; backdrop-filter:blur(2px);
}

/* ---- Brand mark = gold-A seal ---- */
img[alt="Logo"]{
  content:url('/brand/seal.svg') !important;
  width:80px !important; height:80px !important; object-fit:contain;
  border-radius:18px; filter:drop-shadow(0 8px 20px rgba(0,0,0,0.28));
}

/* ---- Headings -> serif (matches --font-head) ---- */
h1,h2,h3,h4,h5,h6,
.MuiTypography-h1,.MuiTypography-h2,.MuiTypography-h3,.MuiTypography-h4,.MuiTypography-h5,.MuiTypography-h6{
  font-family:Georgia,"Iowan Old Style","Palatino Linotype","Times New Roman",serif !important;
  color:var(--ink) !important; letter-spacing:.2px;
}
.MuiTypography-root{color:var(--ink) !important;}

/* ---- Inputs (outlined + underline variants) ---- */
.MuiInputBase-root,.MuiInputBase-input,.MuiOutlinedInput-input,.MuiInput-input{color:var(--ink) !important;}
.MuiInputBase-root{background:var(--field-bg) !important; border-radius:10px !important;}
.MuiOutlinedInput-notchedOutline{border-color:var(--line) !important;}
.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline{border-color:var(--accent-strong) !important;}
.Mui-focused .MuiOutlinedInput-notchedOutline{border-color:var(--accent) !important; border-width:2px !important;}
.MuiInput-underline:before,.MuiInputBase-root:before{border-bottom-color:var(--line) !important;}
.MuiInput-underline:after,.MuiInputBase-root:after{border-bottom-color:var(--accent) !important;}
.MuiInputLabel-root,.MuiFormLabel-root{color:var(--muted) !important;}
.MuiInputLabel-root.Mui-focused,.MuiFormLabel-root.Mui-focused{color:var(--accent) !important;}
.MuiIconButton-root{color:var(--muted) !important;}

/* ---- Tame Chrome autofill so saved-credential fields match the theme (not blue/yellow) ---- */
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{
  -webkit-text-fill-color:var(--ink) !important;
  -webkit-box-shadow:0 0 0 100px var(--field-solid) inset !important;
  caret-color:var(--ink) !important;
  border-radius:10px !important;
  transition:background-color 9999s ease 0s !important;
}

/* ---- Primary button -> gold ---- */
.MuiButton-containedPrimary,.MuiButton-contained,button[type="submit"]{
  background:var(--accent) !important; color:var(--on-accent) !important;
  font-family:'InterAlbash', system-ui, sans-serif !important; font-weight:700 !important;
  letter-spacing:.03em !important; border-radius:11px !important;
  box-shadow:0 8px 22px rgba(0,0,0,.18) !important;
}
.MuiButton-containedPrimary:hover,.MuiButton-contained:hover,button[type="submit"]:hover{background:var(--accent-strong) !important;}
.MuiButton-text,.MuiButton-outlined{color:var(--accent) !important;}
.MuiButton-outlined{border-color:var(--line) !important;}

/* ---- Links ---- */
a,.MuiLink-root{color:var(--accent) !important;}

/* ---- Checkbox + spinner ---- */
.MuiCheckbox-root{color:var(--muted) !important;}
.MuiCheckbox-root.Mui-checked{color:var(--accent) !important;}
.MuiCircularProgress-root,.MuiCircularProgress-colorPrimary{color:var(--accent) !important;}

/* ---- Alerts keep rounded corners ---- */
.MuiAlert-root{border-radius:10px !important;}

/* ---- Keep login error states clearly visible (don't let the theme mask them) ---- */
.Mui-error .MuiOutlinedInput-notchedOutline{border-color:#c0392b !important;}
.MuiFormHelperText-root.Mui-error,.MuiInputLabel-root.Mui-error,.MuiFormLabel-root.Mui-error{color:#c0392b !important;}
.MuiAlert-standardError,.MuiAlert-standardError .MuiAlert-message,.MuiAlert-standardError .MuiAlert-icon{color:#7f1d1d !important;}
.MuiAlert-filledError,.MuiAlert-filledError .MuiAlert-message{color:#ffffff !important;}

/* ---- Remove the only Authelia brand link: "Powered by Authelia" (-> authelia.com) ---- */
a[href*="authelia.com" i]{display:none !important;}

/* ---- Mobile ---- */
@media (max-width:520px){.MuiContainer-root.MuiContainer-maxWidthXs{padding:30px 22px !important; border-radius:16px !important;}}
@media (prefers-reduced-motion: reduce){*{transition:none !important;}}
