/* =========================================================
   ギギ楽くん - 調剤薬局 疑義照会アプリ スタイル
   ========================================================= */

:root {
  --brand: #334155;        /* slate-700 ダークグレー */
  --brand-ink: #1e293b;    /* slate-800 */
  --accent: #0ea5a3;       /* teal 医療やさしい差し色 */
  --accent-soft: #ccfbf1;  /* teal-100 */
  --danger: #dc2626;
  --warn: #d97706;
  --ok: #059669;
  --paper: #ffffff;
  --line: #e2e8f0;
}

html, body { font-family: 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'Yu Gothic', Meiryo, system-ui, -apple-system, sans-serif; }

/* サイドバー・ヘッダーのアクセント */
.brand-grad { background: linear-gradient(135deg, #1e293b 0%, #334155 100%); }
.accent-dot { color: var(--accent); }

/* タブ */
.tab-btn { transition: all .15s; }
.tab-btn.active { background: var(--brand-ink); color: #fff; }

/* チャット */
.chat-bubble-user { background: #0ea5a3; color: #fff; border-radius: 14px 14px 4px 14px; }
.chat-bubble-ai   { background: #f1f5f9; color: #0f172a; border-radius: 14px 14px 14px 4px; }

/* 入力欄の共通スタイル */
.form-input {
  width: 100%; padding: .55rem .75rem; border: 1px solid #cbd5e1; border-radius: .5rem;
  background: #fff; font-size: 14px; transition: border .15s, box-shadow .15s;
}
.form-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(14,165,163,.15); }
.form-label { display:block; font-size: 13px; color:#334155; font-weight:600; margin-bottom: .3rem; }

/* バッジ */
.badge { display:inline-flex; align-items:center; padding: 2px 8px; border-radius:999px; font-size:11px; font-weight:600; }
.badge-draft   { background:#e2e8f0; color:#334155; }
.badge-wait    { background:#fef3c7; color:#92400e; }
.badge-sent    { background:#cffafe; color:#155e75; }
.badge-done    { background:#d1fae5; color:#065f46; }
.badge-reject  { background:#fee2e2; color:#991b1b; }

/* ボタン */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.4rem; padding:.55rem 1rem; border-radius:.5rem; font-weight:600; font-size:14px; transition: all .12s; border:1px solid transparent; cursor:pointer; }
.btn-primary   { background: var(--brand-ink); color:#fff; }
.btn-primary:hover { background:#0f172a; }
.btn-accent    { background: var(--accent); color:#fff; }
.btn-accent:hover { background:#0d9488; }
.btn-ghost     { background:#fff; color:#334155; border-color:#cbd5e1; }
.btn-ghost:hover { background:#f8fafc; }
.btn-danger    { background: #fff; color: #b91c1c; border-color:#fecaca; }
.btn-danger:hover { background:#fef2f2; }

/* 警告吹き出し */
.alert-warn { background:#fffbeb; border:1px solid #fde68a; color:#92400e; padding:.6rem .8rem; border-radius:.5rem; font-size:13px; }
.alert-info { background:#ecfeff; border:1px solid #a5f3fc; color:#155e75; padding:.6rem .8rem; border-radius:.5rem; font-size:13px; }
.alert-danger { background:#fef2f2; border:1px solid #fecaca; color:#991b1b; padding:.6rem .8rem; border-radius:.5rem; font-size:13px; }

/* カード */
.card { background:#fff; border:1px solid var(--line); border-radius: .75rem; }

/* =========================================================
   印刷用レイアウト（FAX / 疑義照会書）
   A4縦 1枚に収まりやすいよう最適化
   ========================================================= */
.print-only { display: none; }

@media print {
  /* 余白を最小化して、ブラウザのヘッダー/フッター(アプリ名・URL・日付・ページ番号)
     が印字される領域を物理的に小さくする。
     ※ 完全に消すには、ブラウザの印刷ダイアログで
       「詳細設定」→「ヘッダーとフッター」をOFFにする必要がある。 */
  @page { size: A4 portrait; margin: 8mm 10mm; }

  /* 画面側は全て非表示、印刷レイアウトだけ見せる */
  html, body { background: #fff !important; margin: 0 !important; padding: 0 !important; }
  .no-print { display: none !important; }
  .print-only { display: block !important; }

  /* 印字本文 */
  .fax-sheet {
    color:#000; font-size: 11pt; line-height: 1.55;
    font-family: 'Hiragino Mincho ProN', 'Yu Mincho', 'MS Mincho', serif;
  }
  .fax-sheet h1 {
    font-size: 18pt; font-weight: 700; letter-spacing: .4em; text-align:center;
    border-top: 2px solid #000; border-bottom: 2px solid #000;
    padding: 6pt 0; margin: 0 0 10pt 0;
  }
  /* 印刷時はロゴ非表示（可読性とA4 1枚の収まり優先） */
  .fax-sheet .fax-logo { display: none !important; }
  .fax-sheet .section {
    border: 1px solid #000; padding: 5pt 8pt; margin-bottom: 6pt;
  }
  .fax-sheet .section-title {
    font-weight: 700; background:#e5e7eb; padding: 2pt 6pt; margin:-5pt -8pt 5pt -8pt;
    border-bottom:1px solid #000; font-size: 10.5pt;
  }
  .fax-sheet .kv { display: grid; grid-template-columns: 110px 1fr; gap: 2pt 10pt; font-size: 10.5pt; }
  .fax-sheet .kv dt { font-weight:600; color:#111; }
  .fax-sheet .kv dd { margin: 0; }
  .fax-sheet .qbody { white-space: pre-wrap; min-height: 40pt; }
  .fax-sheet .answer-box { min-height: 56pt; }
  .fax-sheet .answer-line { border-bottom: 1px solid #000; height: 18pt; margin-top:4pt; }
  .fax-sheet .check-row { display:flex; gap: 18pt; flex-wrap: wrap; font-size:10.5pt; }
  .fax-sheet .check-row span { display:inline-flex; align-items:center; gap:6pt; }
  .fax-sheet .check-row i.box { display:inline-block; width: 10pt; height:10pt; border:1.2px solid #000; }
  .fax-sheet .footer-note { font-size: 9.5pt; text-align: right; margin-top: 4pt; color:#333; }

  /* ページ分割防止 */
  .fax-sheet, .fax-sheet .section { break-inside: avoid; page-break-inside: avoid; }
}

/* 画面上の印刷プレビュー（実寸A4っぽく見せる） */
.print-preview {
  width: 210mm; min-height: 297mm; margin: 0 auto;
  padding: 12mm 14mm; background:#fff; color:#000;
  box-shadow: 0 4px 20px rgba(0,0,0,.08);
  font-family: 'Hiragino Mincho ProN', 'Yu Mincho', serif;
  font-size: 11pt; line-height: 1.55; position: relative;
}
.print-preview h1 {
  font-size: 18pt; font-weight: 700; letter-spacing: .4em; text-align:center;
  border-top: 2px solid #000; border-bottom: 2px solid #000;
  padding: 6pt 0; margin: 0 0 10pt 0;
}
.print-preview .fax-logo {
  position: absolute; top: 8mm; right: 14mm; width: 40px; height: 40px; opacity:.85;
}
.print-preview .section {
  border: 1px solid #000; padding: 5pt 8pt; margin-bottom: 6pt;
}
.print-preview .section-title {
  font-weight: 700; background:#e5e7eb; padding: 2pt 6pt; margin:-5pt -8pt 5pt -8pt;
  border-bottom:1px solid #000; font-size: 10.5pt;
}
.print-preview .kv { display: grid; grid-template-columns: 110px 1fr; gap: 2pt 10pt; font-size: 10.5pt; }
.print-preview .kv dt { font-weight:600; }
.print-preview .kv dd { margin: 0; white-space: pre-wrap; }
.print-preview .qbody { white-space: pre-wrap; min-height: 40pt; }
.print-preview .answer-line { border-bottom: 1px solid #000; height: 18pt; margin-top:4pt; }
.print-preview .check-row { display:flex; gap: 18pt; flex-wrap: wrap; font-size:10.5pt; }
.print-preview .check-row span { display:inline-flex; align-items:center; gap:6pt; }
.print-preview .check-row i.box { display:inline-block; width: 10pt; height:10pt; border:1.2px solid #000; }
.print-preview .footer-note { font-size: 9.5pt; text-align: right; margin-top: 4pt; color:#333; }

/* PDF出力用: html2pdf.jsで撮影する際に使う。画面の余白・影を外してキャプチャ */
.pdf-capture {
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 190mm !important;   /* A4(210mm) - 左右マージン(10+10)=190mm */
  min-height: auto !important;
}
.pdf-capture .fax-logo { display: none !important; }

/* スクロール抑止（モーダル等で使う） */
.scroll-lock { overflow: hidden; }

/* 小さいレスポンシブ微調整 */
@media (max-width: 640px) {
  .hide-sm { display: none; }
}
