/*
 * Altacee skin for Ory's kratos-selfservice-ui-node (accounts.altacee.dev).
 * Tokens mirror altacee_2.0 src/styles.css. Loaded last (standard_headers.hbs), so it wins over
 * Ory's theme.css. Ory Elements class names carry build hashes; match on the stable prefix only.
 */
@font-face { font-family: "Altacee Inter"; font-weight: 400 900; font-display: swap;
  src: url("fonts/inter-400-900-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Altacee Inter"; font-weight: 400 900; font-display: swap;
  src: url("fonts/inter-400-900-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Altacee Mono"; font-weight: 400 700; font-display: swap;
  src: url("fonts/jetbrains-mono-400-latin.woff2") format("woff2"); }

:root {
  --a-black: #080808; --a-black-soft: #0C0C0C; --a-surface: #111111; --a-raised: #171717; --a-strong: #1D1D1D;
  --a-gold: #D4AF37; --a-gold-soft: #E8CD72; --a-gold-dark: #9A761D;
  --a-grey: #A5A5A5; --a-grey-dark: #777777; --a-ink: #F5F5F5; --a-line: rgba(255, 255, 255, .1);
  --a-ease: cubic-bezier(0.22, 0.86, 0.24, 1);
  color-scheme: dark;
}

html body {
  --ory-theme-font-family: "Altacee Inter", ui-sans-serif, system-ui, sans-serif;
  --ory-theme-font-family-mono: "Altacee Mono", monospace;
  --ory-theme-accent-def: var(--a-gold);
  --ory-theme-accent-muted: var(--a-gold-dark);
  --ory-theme-accent-emphasis: var(--a-gold-soft);
  --ory-theme-accent-disabled: var(--a-strong);
  --ory-theme-accent-subtle: rgba(212, 175, 55, .1);
  --ory-theme-foreground-def: var(--a-ink);
  --ory-theme-foreground-muted: var(--a-grey);
  --ory-theme-foreground-subtle: var(--a-grey-dark);
  --ory-theme-foreground-disabled: #555555;
  --ory-theme-foreground-on-dark: var(--a-ink);
  --ory-theme-foreground-on-accent: var(--a-black);
  --ory-theme-foreground-on-disabled: #555555;
  --ory-theme-background-surface: var(--a-surface);
  --ory-theme-background-canvas: var(--a-black);
  --ory-theme-background-subtle: var(--a-raised);
  --ory-theme-error-def: #F87171;
  --ory-theme-error-subtle: rgba(248, 113, 113, .08);
  --ory-theme-error-muted: #FCA5A5;
  --ory-theme-error-emphasis: #EF4444;
  --ory-theme-success-emphasis: #22C55E;
  --ory-theme-border-def: var(--a-line);
  --ory-theme-text-def: var(--a-ink);
  --ory-theme-text-disabled: var(--a-grey-dark);
  --ory-theme-input-background: var(--a-black-soft);
  --ory-theme-input-disabled: var(--a-strong);
  --ory-theme-input-placeholder: var(--a-grey-dark);
  --ory-theme-input-text: var(--a-ink);
  background: var(--a-black);
  color: var(--a-ink);
  font-family: "Altacee Inter", ui-sans-serif, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.content-page, .content-layout body { background: var(--a-black); }
::selection { background: var(--a-black); color: var(--a-gold); }
:focus-visible { outline: 2px solid var(--a-gold); outline-offset: 2px; }

/* ---- chrome: top bar + footer (views/partials/altacee_bar.hbs, ory_branding.hbs) ---- */
.a-bar { display: flex; align-items: center; justify-content: space-between; padding: 22px 32px; border-bottom: 1px solid var(--a-line); }
.a-brand { display: flex; align-items: center; gap: 10px; color: var(--a-ink); text-decoration: none; }
.a-brand img { width: 28px; height: 28px; display: block; }
.a-brand span { font-weight: 800; letter-spacing: .1em; font-size: 15px; }
.a-mono { font-family: "Altacee Mono", monospace; font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--a-grey); }
.ory-branding.a-foot { position: static; display: flex; justify-content: space-between; gap: 16px; padding: 18px 32px; border-top: 1px solid var(--a-line); background: transparent; width: 100%; box-sizing: border-box; }
.a-dot { width: 8px; height: 8px; background: #22C55E; display: inline-block; margin-right: 8px; vertical-align: 1px; }
main .auth-container { padding: 56px 20px 48px; }
@media (max-width: 520px) {
  .a-bar, .ory-branding.a-foot { padding: 16px; } .a-foot .a-mono:last-child { display: none; }
  main .auth-container { padding: 28px 16px 32px; }
  [data-testid$="auth-card"] { padding: 32px 22px 26px; width: 100%; box-sizing: border-box; }
  [data-testid$="auth-card"] h2 { font-size: 26px; }
}

/* ---- card ---- */
[class*="ory_elements__card__"][data-testid$="auth-card"], [data-testid$="auth-card"] {
  background: var(--a-surface); border: 1px solid var(--a-line); border-radius: 0; box-shadow: none; position: relative;
}
[data-testid$="auth-card"]::before { content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 3px; background: var(--a-gold); }
[data-testid$="auth-card"] h2 {
  font-size: 32px; line-height: .98; font-weight: 900; text-transform: uppercase; letter-spacing: -.03em; color: var(--a-ink);
}
[data-testid$="auth-card"] h2 + *, [data-testid$="auth-card"] h2 ~ p { color: var(--a-grey); }
[class*="ory_elements__divider__"] { border: 0; border-top: 1px solid var(--a-line); background: none; height: 0; }

/* ---- fields ---- */
label[class*="ory_elements__typography__"] { font-family: "Altacee Mono", monospace; font-size: 11.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--a-grey); }
label [class*="ory_elements__input_field__"] { color: var(--a-gold); }
input[class*="ory_elements__input_field__"], select, textarea {
  border-radius: 0; border: 1px solid var(--a-line); background: var(--a-black-soft); color: var(--a-ink); height: 48px;
  transition: border-color 200ms var(--a-ease);
}
input[class*="ory_elements__input_field__"]:hover { border-color: rgba(255, 255, 255, .22); }
input[class*="ory_elements__input_field__"]:focus { border-color: var(--a-gold); outline: none; box-shadow: none; }
input:-webkit-autofill { -webkit-text-fill-color: var(--a-ink); -webkit-box-shadow: 0 0 0 1000px var(--a-black-soft) inset; caret-color: var(--a-ink); }
[aria-label="Toggle password visibility"] svg path { fill: var(--a-grey); }
input[type="checkbox"] { accent-color: var(--a-gold); border-radius: 0; }

/* ---- buttons ---- */
button[class*="ory_elements__button__"], a[class*="ory_elements__button__"] {
  border-radius: 0; height: 56px; font-weight: 800; font-size: 14px; letter-spacing: .04em; text-transform: uppercase;
  background: var(--a-gold); color: var(--a-black); border: 0;
  transition: background 200ms var(--a-ease), transform 160ms var(--a-ease);
}
button[class*="ory_elements__button__"]:hover, a[class*="ory_elements__button__"]:hover { background: var(--a-gold-soft); }
button[class*="ory_elements__button__"]:active { transform: scale(.98); }
button[class*="ory_elements__button__"]:disabled { background: var(--a-strong); color: #555; }
/* secondary / social / resend buttons */
button[class*="button_variant_regular"], button[class*="ory_elements__button_social"], [class*="button_social__"] {
  background: transparent; color: var(--a-ink); border: 1px solid var(--a-line); border-radius: 0;
}
button[class*="button_variant_regular"]:hover, [class*="button_social__"]:hover { background: transparent; border-color: rgba(212, 175, 55, .5); color: var(--a-gold); }

/* ---- links + messages ---- */
a, [class*="ory_elements__button_link__"] { color: var(--a-gold); }
a:hover, [class*="ory_elements__button_link__"]:hover { color: var(--a-gold-soft); }
[class*="ory_elements__message__"] { border-radius: 0; }
[class*="message_severity_error"] { color: #FCA5A5; background: rgba(248, 113, 113, .08); border-left: 2px solid #F87171; padding: 10px 12px; text-align: left; }
[class*="message_severity_success"], [class*="message_severity_info"] { color: var(--a-grey); background: var(--a-raised); border-left: 2px solid var(--a-gold); padding: 10px 12px; text-align: left; }

/* ---- settings / welcome (content layout) ---- */
nav, [class*="ory_elements__nav__"] { background: var(--a-black-soft) !important; border-color: var(--a-line) !important; }
[class*="ory_elements__nav__"] a[class*="selected"], [class*="nav_section_link"][aria-current] { color: var(--a-gold); }
[class*="ory_elements__card__"] { border-radius: 0; }
pre, code { font-family: "Altacee Mono", monospace; background: var(--a-raised); border-radius: 0; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }