/*
 * Token giao diện chung của Identity (trang đăng nhập + màn /admin/), chép GIÁ TRỊ từ Ref Tracking FE
 * (iviec-fe/ainavi-rt-fe, origin/develop 9e1cf44 — chỉ đọc, không import gói @iviec-fe):
 *   - màu navy, chữ, viền, nền, bóng: src/styles/index.css (--rt-navy-*, --color-*, --shadow-surface)
 *     và src/lib/theme.ts (NAVY, DS_METRICS: chữ 13px, control 34px, bo 8/6/12px).
 *   - font: Be Vietnam Pro (SIL OFL 1.1, fonts/OFL.txt) — cùng font RT nạp qua @iviec-fe/theme/fonts.css;
 *     tự host trong repo (CSP font-src 'self'), chỉ bộ latin + vietnamese, độ đậm 400/500/600.
 * RT chưa có dark mode nên Identity cũng chỉ có giao diện sáng.
 */
@font-face {
  font-family: "Be Vietnam Pro";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("/static/fonts/be-vietnam-pro-latin-400-normal.woff2?v=ad42fe062467") 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: "Be Vietnam Pro";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("/static/fonts/be-vietnam-pro-vietnamese-400-normal.woff2?v=ad42fe062467") format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: "Be Vietnam Pro";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url("/static/fonts/be-vietnam-pro-latin-500-normal.woff2?v=ad42fe062467") 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: "Be Vietnam Pro";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url("/static/fonts/be-vietnam-pro-vietnamese-500-normal.woff2?v=ad42fe062467") format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: "Be Vietnam Pro";
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url("/static/fonts/be-vietnam-pro-latin-600-normal.woff2?v=ad42fe062467") 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: "Be Vietnam Pro";
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url("/static/fonts/be-vietnam-pro-vietnamese-600-normal.woff2?v=ad42fe062467") format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

:root {
  --rt-navy-shade-20: #1e2d46;
  --rt-navy-base: #253858;
  --rt-navy-tint-20: #516079;
  --rt-navy-tint-40: #7c889b;
  --rt-navy-tint-60: #a8afbc;
  --rt-navy-tint-75: #c8cdd5;
  --rt-navy-tint-88: #e5e7eb;
  --rt-navy-tint-95: #f4f5f7;
  --color-brand: var(--rt-navy-base);
  --color-brand-hover: var(--rt-navy-tint-20);
  --color-brand-active: var(--rt-navy-shade-20);
  --color-danger: #dc2626;
  --color-danger-bg: #fef2f2;
  --color-success: #059669;
  --color-success-bg: #ecfdf5;
  --color-warning: #d97706;
  --color-warning-bg: #fffbf0;
  --color-text: #1f2937;
  --color-text-secondary: #374151;
  --color-text-muted: #6b7280;
  --color-text-disabled: #9ca3af;
  --color-border: #e5e7eb;
  --color-line: #f1f2f4;
  --color-surface: #ffffff;
  --color-surface-soft: #f8fafc;
  --color-paper: #f5f7fb;
  --shadow-surface: 0 1px 3px 0 rgba(30, 45, 70, 0.08), 0 4px 12px 0 rgba(30, 45, 70, 0.05);
  /* antd: focus ring = màu chính alpha ~0.1 (controlOutline). */
  --focus-ring: 0 0 0 2px rgba(37, 56, 88, 0.12);
  --radius-sm: 6px;
  --radius: 8px;
  --radius-lg: 12px;
  --control-height: 34px;
  --font-sans: "Be Vietnam Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  color: var(--color-text);
  background: var(--color-paper);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background: var(--color-paper);
  color: var(--color-text);
  font: 13px/1.5715 var(--font-sans);
}

/* ---- Control kiểu antd (input, nút) ---- */
.input {
  display: block;
  width: 100%;
  height: var(--control-height);
  padding: 4px 11px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  background: var(--color-surface);
  color: var(--color-text);
  font: inherit;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.input:hover { border-color: var(--rt-navy-tint-20); }
.input:focus { outline: 0; border-color: var(--rt-navy-tint-20); box-shadow: var(--focus-ring); }
.input::placeholder { color: var(--color-text-muted); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: var(--control-height);
  padding: 4px 15px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  background: var(--color-surface);
  color: var(--color-text);
  font: inherit;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.2s, background 0.2s, border-color 0.2s;
}
.btn:hover { color: var(--color-brand-hover); border-color: var(--color-brand-hover); }
.btn:focus-visible { outline: 0; box-shadow: var(--focus-ring); }
.btn-primary { background: var(--color-brand); border-color: var(--color-brand); color: #fff; }
.btn-primary:hover { background: var(--color-brand-hover); border-color: var(--color-brand-hover); color: #fff; }
.btn-primary:active { background: var(--color-brand-active); border-color: var(--color-brand-active); }
.btn-danger { color: var(--color-danger); border-color: #fca5a5; }
.btn-danger:hover { color: #fff; background: var(--color-danger); border-color: var(--color-danger); }
.btn-link { border-color: transparent; background: transparent; color: var(--color-brand); padding-inline: 4px; }
.btn-link:hover { border-color: transparent; color: var(--color-brand-hover); }
.btn-block { display: flex; width: 100%; }

.alert {
  margin: 0 0 16px;
  padding: 8px 12px;
  border: 1px solid #fecaca;
  border-radius: var(--radius);
  background: var(--color-danger-bg);
  color: var(--color-danger);
}
.alert-info { border-color: var(--rt-navy-tint-75); background: var(--rt-navy-tint-95); color: var(--color-brand); }
