/*
 * 全ページ共通のベーススタイル。
 *
 * 各画面の HTML から
 *   <link rel="stylesheet" href="/static/woff-common.css">
 * で読み込む。ページ固有のスタイルは各 HTML の <style> に書く。
 *
 * ここに置くのは「全ページで同一だったもの」だけに限る。
 * 一部のページだけで使う値を入れると、上書きの追いかけが必要になって
 * かえって読みにくくなるため。
 */

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

/* 高さ・overflow の扱いはページごとに異なるため、幅だけを共通化する */
html, body {
  width: 100%;
}

body {
  font-family: -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;
  font-size: 14px;
  background: #f5f5f5;
  color: #333;
}

/* 認証が通るまで隠しておき、各ページの初期化処理で表示する */
#mainScreen {
  display: none;
}

/* ヘッダー左端の「‹」戻るリンク */
.back-btn {
  color: #fff;
  text-decoration: none;
  font-size: 22px;
  line-height: 1;
  margin-right: 2px;
  opacity: .9;
}

/* 画面上部に固定するヘッダー領域（検索条件バーなどを含む） */
.sticky-top {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10;
}

/* ヘッダー右端の補足テキスト（ユーザー名など） */
header span.sub { font-size: 11px; font-weight: normal; opacity: .8; margin-left: auto; }

/*
 * ── 検索一覧ページ共通（在庫検索・受注残検索） ──────────────
 * 「絞り込み行＋キーワード検索＋一覧表（タップで行を展開）」という
 * 同じ骨格を持つページ間で重複していたスタイルを集約した。
 * 色・サイズなどページ固有の見た目はヘッダー背景色等で各ページ側が
 * 個別に上書きする。ただし .filter-row ／ .num ／ .empty-msg はクラス名が
 * 他ページ（alcohol_review.html の絞り込み欄、namakon.html の丸数字バッジ、
 * admin.html 等の空状態メッセージ）と衝突し、他ページ側が一部プロパティしか
 * 上書きしないせいで意図しない見た目の変化を招くため、table 要素など
 * 汎用度の高いセレクタと合わせてここには含めず、各ページの <style> に
 * 残している。
 */
.search-bar {
  background: #fff;
  padding: 4px 12px;
  border-bottom: 1px solid #e0e0e0;
}
.status {
  padding: 5px 12px;
  font-size: 12px;
  color: #666;
  background: #f5f5f5;
  border-bottom: 1px solid #e8e8e8;
}
.err { color: #d93025; }
.result-count { font-weight: bold; color: #1a73e8; }

.tbl-header {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
.tbl-header th {
  background: #1a73e8;
  color: #fff;
  padding: 7px 6px;
  font-size: 12px;
  font-weight: bold;
  text-align: left;
  white-space: nowrap;
}
.table-wrap {
  width: 100%;
  overflow-x: hidden;
}
/* 一覧の行タップで下に詳細を展開する共通パターン */
tbody tr.item-row { cursor: pointer; }
tbody tr.item-row:active { background: #eef3f9; }
.row-arrow { display: inline-block; font-size: 9px; color: #aaa; margin-left: 4px; transition: transform .15s; }
tbody tr.item-row.expanded .row-arrow { transform: rotate(90deg); }
.detail-row td { padding: 0; border-bottom: 1px solid #eee; }
.detail-body { display: none; padding: 8px 10px; background: #f5f8fb; }
.detail-body.open { display: block; }

/* 製品の区分バッジ（規格品／加工品／特注品）。kubunBadge() で生成する */
.kubun-badge {
  display: inline-block;
  font-size: 10px;
  padding: 1px 4px;
  border-radius: 4px;
  background: #e0e0e0;
  color: #555;
}
.kubun-badge.kakouhin   { background: #d2e9ff; color: #0b5394; }
.kubun-badge.tokuchuhin { background: #fce8b2; color: #7a5e00; }
.kubun-badge.other      { background: #e8d5f5; color: #5b2d8e; }