/*
 * Kimlik sunucusu sayfaları — Masraf.Admin.Web'in token'larından türetildi
 * (src/styles/app.css: renkler HSL üçlüsü, --radius, Geist). Bu sayfa
 * Tailwind ve React taşımıyor; yalnız giriş ekranı var ve tek dosya CSS
 * yeterli. Panelle aynı renk ve tipografi: kullanıcı yönlendirildiğinde
 * "başka bir siteye geldim" hissi olmasın.
 */
@font-face {
  font-family: 'Geist Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('../fonts/geist-latin-ext-wght-normal.woff2') format('woff2-variations');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, 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: 'Geist Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('../fonts/geist-latin-wght-normal.woff2') format('woff2-variations');
  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;
}

:root {
  --background: 220 4% 97%;
  --foreground: 220 10% 3.9%;
  --card: 0 0% 100%;
  --primary: 220 5.9% 10%;
  --primary-foreground: 0 0% 98%;
  --muted: 220 4.8% 92.9%;
  --muted-foreground: 220 3.8% 46.1%;
  --destructive: 0 84.2% 60.2%;
  --border: 220 5.9% 90%;
  --input: 220 5.9% 78%;
  --ring: 220 5.9% 10%;
  --radius: 0.675rem;
  --button-primary-shadow:
    0px 1px 1px -1px rgb(0 0 0 / 0.12), 0px 2px 2px -1px rgb(0 0 0 / 0.1),
    0px 0px 0px 1px rgb(0 0 0 / 0.08);
  --card-shadow:
    0px 0px 0px 1px rgb(0 0 0 / 0.05), 0px 1px 2px rgb(0 0 0 / 0.04),
    0px 8px 24px rgb(0 0 0 / 0.04);
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: 0 6.8% 6.1%;
    --foreground: 0 0% 93%;
    --card: 0 10% 3.9%;
    --primary: 0 0% 100%;
    --primary-foreground: 0 0% 0%;
    --muted: 0 10% 10%;
    --muted-foreground: 0 0% 63%;
    --destructive: 0 100% 64%;
    --border: 0 0% 15%;
    --input: 0 0% 30%;
    --ring: 0 0% 35%;
    --button-primary-shadow: 0px 0px 0px 1px rgb(255 255 255 / 0.1);
    --card-shadow: 0px 0px 0px 1px rgb(255 255 255 / 0.06);
  }
}

*, *::before, *::after { box-sizing: border-box; }

html, body { margin: 0; height: 100%; }

body {
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: 'Geist Variable', ui-sans-serif, system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

.stage {
  min-height: 100%;
  display: grid;
  place-items: center;
  padding: 24px 16px;
}

.card {
  width: 100%;
  max-width: 380px;
  background: hsl(var(--card));
  border-radius: calc(var(--radius) + 4px);
  box-shadow: var(--card-shadow);
  padding: 28px;
}

.card-header { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 20px; }

.logo {
  flex: none;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
}

.logo img { display: block; width: auto; height: 36px; }

h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.01em; margin: 0; }

.subtitle { margin: 2px 0 0; color: hsl(var(--muted-foreground)); }

form { display: grid; gap: 14px; }

.field { display: grid; gap: 6px; font-weight: 500; }

.field input {
  font: inherit;
  height: 38px;
  padding: 0 12px;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid hsl(var(--input));
  background: transparent;
  color: inherit;
  outline: none;
  transition: box-shadow 120ms ease, border-color 120ms ease;
}

.field input:focus-visible {
  border-color: hsl(var(--ring));
  box-shadow: 0 0 0 3px hsl(var(--ring) / 0.15);
}

.button {
  font: inherit;
  font-weight: 500;
  height: 38px;
  margin-top: 4px;
  border: 0;
  border-radius: calc(var(--radius) - 2px);
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
  box-shadow: var(--button-primary-shadow);
  cursor: pointer;
}

.button:hover { opacity: 0.92; }
.button:focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 2px; }

.alert {
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: calc(var(--radius) - 2px);
  background: hsl(var(--destructive) / 0.1);
  color: hsl(var(--destructive));
  border: 1px solid hsl(var(--destructive) / 0.25);
}

.footnote { margin: 18px 0 0; color: hsl(var(--muted-foreground)); font-size: 13px; }

/* Kayıt / etkinleştirme sayfaları */
a { color: inherit; text-underline-offset: 2px; }
.footnote a { color: hsl(var(--foreground)); font-weight: 500; }
.footnote.ayrac { margin-top: 12px; padding-top: 12px; border-top: 1px solid hsl(var(--border)); }
.field small { font-weight: 400; color: hsl(var(--muted-foreground)); font-size: 12px; }
.info { margin: 0 0 14px; color: hsl(var(--muted-foreground)); }
.button.ikincil {
  width: 100%;
  background: transparent;
  color: hsl(var(--foreground));
  box-shadow: inset 0 0 0 1px hsl(var(--input));
}
.button.baglanti {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: hsl(var(--muted-foreground)); }
.consent input { margin-top: 3px; width: 16px; height: 16px; accent-color: hsl(var(--primary)); flex: none; }
.consent a { color: hsl(var(--foreground)); }
.success {
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: calc(var(--radius) - 2px);
  background: hsl(142 70% 40% / 0.1);
  color: hsl(142 70% 30%);
  border: 1px solid hsl(142 70% 40% / 0.25);
}
@media (prefers-color-scheme: dark) { .success { color: hsl(142 60% 60%); } }
.info-box {
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: calc(var(--radius) - 2px);
  background: hsl(var(--muted));
}
.info-box p { margin: 0; }

/* Hukuki metinler: aynı kart, okunacak uzunlukta satır */
.card.legal { max-width: 720px; }
.legal h1 { font-size: 20px; }
.legal h2 { font-size: 15px; font-weight: 600; margin: 24px 0 8px; }
.legal p, .legal ul { margin: 0 0 10px; }
.legal ul { padding-left: 20px; }
.legal li { margin-bottom: 4px; }
