/* セット版の共通ページ /series/ の枠。左カラム・開閉バー・一覧のカードの見た目は /series/common/series-common.css（3 製品と同じ）。
   ここは枠の置き方（左カラム x0/y0・全高 | 幅ハンドル 10px | 右: 共通バー 40px + 共通の面）と、ポータル固有の小さな部品だけ。 */
html, body { margin: 0; padding: 0; background: #f5f7f6; color: #202a25; }
body { font-family: system-ui, -apple-system, "Segoe UI", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", Meiryo, sans-serif; }
.portal-shell { display: grid; grid-template-columns: var(--tsn-nav-w, 210px) 10px minmax(0, 1fr); min-height: 100dvh; }
.portal-shell.nav-closed { grid-template-columns: minmax(0, 1fr); }
.portal-side { grid-column: 1; position: sticky; top: 0; align-self: start; height: 100dvh; overflow: hidden auto; box-sizing: border-box; }
.portal-resizer { grid-column: 2; position: sticky; top: 0; align-self: start; height: 100dvh; margin-left: -1px; }
.portal-main { grid-column: 3; min-width: 0; }
.portal-shell.nav-closed .portal-main { grid-column: 1; }
.portal-shell.nav-closed .portal-side,
.portal-shell.nav-closed .portal-resizer { display: none !important; }
.portal-bar { position: sticky; top: 0; z-index: 40; }
.portal-main > .tsn-page:focus { outline: none; }
.portal-loading { margin: 0; color: #68746e; font-size: 13px; }
.portal-noscript { margin: 16px; }

/* 一覧の見出しの右の操作（新しい案件・新規顧客・顧客情報を編集・戻る）。主操作は緑、ほかは白地に線。
   FIX-14: 3 製品の共通一覧と同じ 高さ 44px・角丸 10px・14px、アイコン 20px */
.tsn-list.tsn-list .portal-action,
.tsn-list.tsn-list .portal-work-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin: 0;
  padding: 8px 14px;
  border: 1px solid #d3dfd8;
  border-radius: 10px;
  background: #fff;
  color: #244d3a;
  font-size: 14px;
  font-weight: 650;
  text-decoration: none;
  white-space: nowrap;
}
.tsn-list.tsn-list .portal-action:hover,
.tsn-list.tsn-list .portal-work-link:hover { background: #f2f8f4; border-color: #a9c8b6; }
.tsn-list.tsn-list .portal-action:focus-visible,
.tsn-list.tsn-list .portal-work-link:focus-visible { outline: 3px solid #b4d8c8; outline-offset: 1px; }
.tsn-list.tsn-list .portal-action-icon { display: inline-flex; flex: none; }
.tsn-list.tsn-list .portal-action-icon svg { width: 20px; height: 20px; }
.tsn-list.tsn-list .portal-action.portal-primary { background: #167451; border-color: #167451; color: #fff; }
.tsn-list.tsn-list .portal-action.portal-primary:hover { background: #0e5e41; border-color: #0e5e41; }
/* 「新しい案件」はダイアログを開くボタン（見た目はリンクの操作と同じ） */
.tsn-list.tsn-list button.portal-action { font-family: inherit; line-height: inherit; cursor: pointer; }
.tsn-list.tsn-list .portal-work { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 4px; }
.tsn-list.tsn-list .portal-work-link { padding: 8px 16px; background: #167451; border-color: #167451; color: #fff; }
.tsn-list.tsn-list .portal-work-link:hover { background: #0e5e41; border-color: #0e5e41; }
.tsn-list.tsn-list .portal-auth-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tsn-list.tsn-list .portal-auth-actions .tsn-btn { margin: 0; }
.portal-notice:empty { display: none; }

/* 狭い画面（3 製品共通の境目 860px）: 1 列。左カラムはドロワー、幅ハンドルなし */
@media (max-width: 860px) {
  .portal-shell, .portal-shell.nav-closed { grid-template-columns: minmax(0, 1fr); }
  .portal-main { grid-column: 1; }
  .portal-resizer { display: none !important; }
  .portal-side { position: fixed; inset: 0 auto 0 0; z-index: 70; width: min(86vw, 300px); height: 100dvh; box-shadow: 0 0 24px #26323b40; }
}
/* スマホ（600px 以下）の案件一覧だけ: 見出しの下に「すぐ現調を始める」「新しい案件」を順に縦並び（幅 100%・高さ 60px・18px・中央寄せ）。
   発行書類一覧は通常の 44px のまま下段。portal-case-actions / portal-action-main は案件一覧の操作にだけ付く（portal.mjs）。
   画面端の余白は共通の .tsn-view-head の左右 16px（series-common.css の 860px 以下）で確保済みなので、幅 100% はその内側。
   ボタン間は 12px。見出しとの間は見出しの行間 8px + margin-top 4px = 12px */
@media (max-width: 600px) {
  .tsn-list.tsn-list .tsn-view-actions.portal-case-actions { flex: 1 0 100%; flex-direction: column; align-items: flex-end; gap: 12px; margin-left: 0; margin-top: 4px; }
  .tsn-list.tsn-list .portal-case-actions > .portal-action.portal-action-main {
    box-sizing: border-box;
    align-self: stretch;
    justify-content: center;
    width: 100%;
    height: 60px;
    min-height: 60px;
    font-size: 18px;
    text-align: center;
  }
}
@media print {
  .portal-shell { display: block; }
  .portal-side, .portal-resizer, .portal-bar { display: none !important; }
}