/* ============================================================================
   ZENBU Kintone テーマ  v1.0  (2026-09-09)
   cybozu.com システムカスタマイズ（全アプリ共通）に「CSS」として登録して使う。
   ・見た目だけを変える。動作・入力値・保存には一切触れない。
   ・外す時はこのファイルを外すだけで完全に元へ戻る。
   ・配色は自社資料と同じ 紺(#1b3a5f) 1色 ＋ 橙(#e76f0f) を差し色に。
   ============================================================================ */

:root {
  --z-navy: #1b3a5f;
  --z-navy-d: #142c48;
  --z-orange: #e76f0f;
  --z-ink: #1f2937;
  --z-mute: #6b7280;
  --z-line: #e5e7eb;
  --z-bg: #f4f5f7;
  --z-card: #ffffff;
}

/* ---------- 全体の下地 ---------- */
body,
.gaia-argoui-app,
.gaia-argoui-app-index,
.gaia-argoui-app-show {
  background: var(--z-bg) !important;
  color: var(--z-ink);
}

/* 文字を少しだけ大きく、行間を広げる（1日中見る画面なので） */
.gaia-argoui-app,
.recordlist-gaia,
.control-value-gaia {
  font-size: 13.5px;
  line-height: 1.7;
}

/* ---------- ヘッダー（2026-09-09 実機で確認） ----------
   ・上の黄色いバーは <header>。ZENBUロゴが乗っているので色は変えない。
   ・その下の灰色バーは <nav>。ここを紺にする。
   ・クラス名は sc-xxxx の自動生成でKintone更新のたびに変わるため、要素で狙う。 */
body > div nav,
#header + nav,
nav[class^="sc-"] {
  background: var(--z-navy) !important;
  border-bottom: 3px solid var(--z-orange) !important;
  box-shadow: none !important;
}

/* アプリ名を主役にする */
.gaia-argoui-app-title-name,
.gaia-argoui-app-titlearea-name {
  font-weight: 900 !important;
  color: var(--z-navy) !important;
  letter-spacing: .01em;
}

/* ---------- 一覧 ---------- */
.recordlist-gaia {
  border: 1px solid var(--z-line) !important;
  border-radius: 10px;
  overflow: hidden;
  background: var(--z-card);
}
.recordlist-header-gaia,
.recordlist-header-cell-gaia {
  background: var(--z-navy) !important;
  color: #fff !important;
  font-weight: 800 !important;
  border-color: var(--z-navy-d) !important;
  white-space: nowrap;
}
.recordlist-header-label-gaia,
.recordlist-header-sort-gaia {
  color: #fff !important;
}
.recordlist-row-gaia > td {
  border-bottom: 1px solid #eef0f3 !important;
  padding-top: 9px !important;
  padding-bottom: 9px !important;
}
/* 交互の薄い縞。行を目で追いやすくする */
.recordlist-row-gaia:nth-child(even) > td {
  background: #fafbfc;
}
.recordlist-row-gaia:hover > td {
  background: #fff7ed !important;
}
/* 数字は桁を揃える */
.recordlist-cell-gaia .value-NUMBER,
.recordlist-cell-gaia .value-CALC,
.control-value-gaia .input-number-gaia,
.value-NUMBER, .value-CALC {
  font-variant-numeric: tabular-nums;
}

/* ---------- ボタン ---------- */
.gaia-ui-actionmenu-add,
.gaia-argoui-app-menu-add,
button.button-simple-cybozu,
.gaia-ui-actionmenu button {
  border-radius: 7px !important;
}
.gaia-ui-actionmenu-add,
.gaia-argoui-app-menu-add {
  background: var(--z-orange) !important;
  border-color: var(--z-orange) !important;
  color: #fff !important;
  font-weight: 800 !important;
}
.gaia-ui-actionmenu-add:hover,
.gaia-argoui-app-menu-add:hover {
  background: #cf6209 !important;
}

/* ---------- レコード詳細 ---------- */
.gaia-argoui-app-show-mainpane,
.layout-gaia {
  background: var(--z-card);
  border-radius: 12px;
}
/* 項目名は控えめ、値は濃く。目が値へ行くようにする */
.control-label-gaia,
.control-label-text-gaia {
  color: var(--z-mute) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
}
.control-value-gaia {
  color: var(--z-ink) !important;
}
/* グループ見出しに紺の縦線 */
.control-group-gaia > .control-label-gaia,
.subtable-label-gaia {
  border-left: 5px solid var(--z-navy);
  padding-left: 9px;
}

/* ---------- ステータス（プロセス管理） ---------- */
.gaia-argoui-app-statusbar,
.status-value-gaia {
  font-weight: 800 !important;
}

/* ---------- 入力の見やすさ ---------- */
input.input-text-cybozu,
textarea.textarea-cybozu,
select.select-cybozu {
  border-radius: 6px !important;
  border-color: #cbd2da !important;
}
input.input-text-cybozu:focus,
textarea.textarea-cybozu:focus,
select.select-cybozu:focus {
  border-color: var(--z-navy) !important;
  outline: 2px solid rgba(27, 58, 95, .18) !important;
  outline-offset: 1px;
}

/* ---------- テーブル（サブテーブル） ---------- */
.subtable-gaia th,
.subtable-header-cybozu {
  background: #eef1f5 !important;
  color: var(--z-navy) !important;
  font-weight: 800 !important;
}

/* ---------- 添付ファイル ---------- */
.control-file-gaia a,
.file-name-gaia {
  color: var(--z-navy) !important;
  font-weight: 700;
}

/* ---------- 通知・エラー ---------- */
.gaia-argoui-notification-error,
.error-gaia {
  border-left: 5px solid #b91c1c !important;
}

/* ---------- ポータル（実機のクラス名で確認済み 2026-09-09） ----------
   ・HOMEの背景画像（.ocean-portal-index-header-img）には一切触らない。
   ・パネルは .ocean-portal-widget が1枚ずつの箱。 */
.ocean-portal-index,
.ocean-portal-body,
.kintone-portal-content-space {
  background: var(--z-bg) !important;
}
/* パネル（スペース／アプリ／お知らせ など）をカードにする */
.ocean-portal-widget {
  background: var(--z-card) !important;
  border: 1px solid var(--z-line) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  overflow: hidden;
  margin-bottom: 14px !important;
}
/* スペース一覧の行 */
.gaia-argoui-spacescrollinglist-item {
  border-bottom: 1px solid #eef0f3 !important;
  transition: background .12s;
}
.gaia-argoui-spacescrollinglist-item:hover {
  background: #fff7ed !important;
}
.gaia-argoui-spacescrollinglist-name {
  color: var(--z-ink) !important;
}
/* ※カラム幅は変えない。2026-09-09に62%/36%を試したが、
   画面幅が狭いときにパネルが枠からはみ出て角丸と右端が切れたため取り消した。
   ポータル右側の余白が気になる場合は、Kintoneのポータル設定側で
   ウィジェットの配置を変えるほうが安全。 */
.gaia-argoui-spacescrollinglist-item:hover .gaia-argoui-spacescrollinglist-name {
  color: var(--z-orange) !important;
}
/* HOMEの見出し文字は読みやすく（画像の上に乗るので影を付ける） */
.ocean-portal-index-header-name {
  font-weight: 900 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .55);
}

/* ---------- アプリ設定画面 ---------- */
.gaia-admin-app-editor,
.gaia-argoui-app-settings {
  background: var(--z-card);
}

/* ---------- 印刷時は装飾を落とす ---------- */
@media print {
  header, body > div nav { display: none !important; }
  body { background: #fff !important; }
}