/* ============================================================
   GRVN 統合管理サイト 共通スタイル（デザインの唯一の基準）

   このファイルが全モジュール共通のデザイントークンを定義する。
   trainee / interview / test-admin など各モジュールのCSSは、
   自前で色やフォントを持たず、必ずここの変数を参照すること
   （例: --navy: var(--grvn-navy);）。
   元は別サイトだったため各々が独自の色を持っていたが、
   統合にあたり全てこのパレットに寄せている。
   ============================================================ */
:root{
  /* --- ブランド色（GROP VIETNAMロゴ由来。勝手に変えない） --- */
  --grvn-navy:#16294e; --grvn-navy-2:#1f3864; --grvn-navy-3:#2a4578;
  --grvn-green:#3dae2b; --grvn-green-2:#2e8a20; --grvn-green-soft:#e8f5e3;

  /* --- 文字 --- */
  --grvn-ink:#1d2b45;       /* 本文 */
  --grvn-ink-soft:#4a5878;  /* 副次 */
  --grvn-mute:#68758c;      /* 補足・ラベル */
  --grvn-ghost:#c4cad6;     /* 無効・プレースホルダ */

  /* --- 面と罫線 --- */
  --grvn-card:#ffffff;      /* カード・パネル */
  --grvn-paper:#f7f8fb;     /* ページ背景 */
  --grvn-paper-2:#eef1f6;   /* 一段沈んだ面 */
  --grvn-line:#e4e7ef;      /* 通常の罫線 */
  --grvn-line-2:#d5d9e3;    /* 強い罫線・入力枠 */

  /* --- 状態色 --- */
  --grvn-ok:#2e8a20;   --grvn-ok-soft:#e8f5e3;
  --grvn-info:#2563eb; --grvn-info-2:#1d4ed8; --grvn-info-soft:#e7eefc;
  --grvn-warn:#d97706; --grvn-warn-soft:#fff4dd;
  --grvn-bad:#c0392b;  --grvn-bad-soft:#fcecea;

  /* --- タイポグラフィ（Interで英数字、Noto Sans JPで日本語） --- */
  --grvn-font:'Inter','Noto Sans JP','Hiragino Kaku Gothic ProN','Yu Gothic UI',Meiryo,system-ui,sans-serif;
  --grvn-font-num:'Inter',system-ui,sans-serif;

  /* --- 影・角丸 --- */
  --grvn-shadow-sm:0 1px 4px rgba(16,37,71,.08);
  --grvn-shadow-md:0 2px 12px rgba(16,37,71,.10);
  --grvn-shadow-lg:0 4px 20px rgba(16,37,71,.12);
  --grvn-radius:10px; --grvn-radius-sm:7px;
}

/* ===== 共通ヘッダー（grvn-nav.js が body 先頭に挿入） =====
   移植元のCSSに素の header{} ルールが残っている場合があり、
   それが差し込んだヘッダーに漏れて余白や配置がページごとに
   変わる事故が起きた。ここで明示的に打ち消しておく。 */
.grvn-header{background:var(--grvn-navy);color:#fff;position:sticky;top:0;z-index:1000;
  margin:0;padding:0;text-align:left;border:0;
  box-shadow:0 1px 0 rgba(0,0,0,.25);
  font-family:var(--grvn-font)}
.grvn-hd-in{max-width:1080px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:14px}
.grvn-brand{display:flex;align-items:center;gap:12px;padding:9px 0;text-decoration:none}
.grvn-logo-chip{background:#fff;border-radius:6px;padding:4px 9px;display:inline-flex;align-items:center}
.grvn-logo-chip img{height:24px;width:auto;display:block}
/* サイト名。ロゴが GROP VIETNAM を示すので、ここはシステム名を名乗る */
.grvn-brand .grvn-title{color:#fff;font-size:14px;font-weight:600;letter-spacing:.01em;
  padding-left:13px;border-left:1px solid rgba(255,255,255,.24);line-height:1.2}
.grvn-nav{display:flex;gap:2px;margin-left:auto;overflow-x:auto}
/* ログイン中のアカウント表示。誰で入っているのか分からないという指摘への対応 */
.grvn-me{display:flex;align-items:center;gap:10px;margin-left:18px;padding-left:16px;
  border-left:1px solid rgba(255,255,255,.18);white-space:nowrap}
.grvn-me-name{color:#e6ecf7;font-size:12.5px;font-weight:600}
.grvn-me-out{font:inherit;font-size:11.5px;color:#c3cee2;background:transparent;
  border:1px solid rgba(255,255,255,.28);border-radius:5px;padding:4px 9px;cursor:pointer}
.grvn-me-out:hover{color:#fff;border-color:rgba(255,255,255,.55)}
.grvn-nav a{color:#c3cee2;font-size:12.5px;padding:14px 10px 11px;text-decoration:none;
  border-bottom:3px solid transparent;white-space:nowrap}
.grvn-nav a:hover{color:#fff}
.grvn-nav a.on{color:#fff;border-bottom-color:var(--grvn-green);font-weight:600}
@media (max-width:720px){
  .grvn-hd-in{flex-wrap:wrap;gap:0 12px;padding:0 14px}
  .grvn-brand .grvn-title{font-size:13px;padding-left:10px}
  .grvn-nav{order:3;width:100%}
  .grvn-nav a{padding:10px 10px 8px}
  .grvn-me{margin-left:auto;padding-left:0;border-left:0;gap:8px}
  .grvn-me-name{font-size:11.5px}
}
/* 印刷・PDF生成時はナビを出さない */
@media print{ .grvn-header{display:none !important} }
body.print-mode .grvn-header{display:none !important}

/* ===== モジュール内サブナビ（共通ヘッダー直下・各ページ側で設置） ===== */
.grvn-subnav{background:var(--grvn-card);border-bottom:1px solid var(--grvn-line);display:flex;gap:2px;
  overflow-x:auto;
  font-family:var(--grvn-font)}
.grvn-subnav a{color:var(--grvn-mute);font-size:13px;padding:10px 12px;text-decoration:none;
  border-bottom:3px solid transparent;white-space:nowrap}
.grvn-subnav a:hover{color:var(--grvn-ink)}
.grvn-subnav a.active{color:var(--grvn-ink);border-bottom-color:var(--grvn-green);font-weight:600}
@media (max-width:720px){
  .grvn-subnav{overflow-x:auto;white-space:nowrap}
}
/* 印刷・PDF生成時はサブナビも出さない */
@media print{ .grvn-subnav{display:none !important} }
body.print-mode .grvn-subnav{display:none !important}