/* =========================================================
   ミエルカシステム 共通スタイル（login + FBタイムライン対応）
   最終更新: 2025-09-22
   ========================================================= */

/* ========== [0] Tokens（変数） ========== */
:root {
  --bg:#f7f7f8;
  --card:#ffffff;
  --text:#1a1a1a;
  --muted:#6b7280;
  --primary:#398F3D;
  --primary-hover:#2f7a33;
  --danger:#b91c1c;
  --ring:#3b82f6;
  --info:#2563eb;
  --info-hover:#1d4ed8;
  --info-soft:color-mix(in srgb, var(--info) 15%, transparent);
  --radius-8:8px;
  --radius-10:10px;
  --radius-12:12px;
  --radius-14:14px;
  --radius-16:16px;
  --btn-h:36px;
  --btn-h-lg:40px;
  --btn-pad-x:16px;
  --btn-pad-x-sm:12px;
  --shadow-sm:0 10px 25px rgba(0,0,0,0.08);
  --shadow-md:0 6px 14px rgba(56,128,69,0.25);
  --shadow-lg:0 28px 60px rgba(15,23,42,0.32);
  --shadow-accent:0 8px 18px rgba(56,128,69,0.28);
  --shadow-xl:0 12px 28px rgba(47,122,51,0.35);
  --shadow:var(--shadow-sm);
  --space-12:12px;
  --space-48:48px;
  --w-96:96px;
  --w-120:120px;
  --w-160:160px;
  --w-200:200px;
  --w-540:540px;
  --z-overlay:400000;
  --z-dialog:400001;
  --z-popup:400002;
}
/* Breakpoints: sm=640px, md=768px, lg=1024px, xl=1280px */

:root.force-light-theme {
  --bg:#f7f7f8;
  --card:#ffffff;
  --text:#1a1a1a;
  --muted:#6b7280;
  --shadow:0 10px 25px rgba(0,0,0,0.08);
  color-scheme: light;
}
body.force-light-theme {
  background:var(--bg);
  color:var(--text);
}

/* ========== [1] Base（html/body/reset） ========== */
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  font-family:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
               "Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic UI","Meiryo",sans-serif;
  background:var(--bg);
  color:var(--text);
  display:flex;
  flex-direction:column;
  min-height:100svh;
}
img { max-width:100%; height:auto; display:block; }

/* ========== [2] Utilities（.u-flex/.u-justify-end 等） ========== */
.u-flex { display:flex; }
.u-inline-flex { display:inline-flex; }
.u-center { justify-content:center; align-items:center; }
.u-between { justify-content:space-between; }
.u-end { justify-content:flex-end; }
.u-wrap { flex-wrap:wrap; }
.u-gap-8 { gap:8px; }
.u-gap-10 { gap:10px; }
.u-gap-12 { gap:12px; }
.u-gap-16 { gap:16px; }
.u-gap-18 { gap:18px; }
.u-w-full { width:100%; }
.u-text-right { text-align:right; }
.u-items-center { align-items:center; }
.container { width:1440px; margin:22px auto; }
.clcheck-page .container { width:1440px; margin:18px auto; }
.landscape-wide body {
  background:#eef2ff;
  min-height:100vh;
}
.clcheck-page .container:first-of-type { margin-top:18px; }
.clcheck-page .container:first-of-type { margin-bottom:10px; }
.top-header {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px;
  padding:16px 20px;
  margin:0;
  border-bottom:1px solid rgba(0,0,0,.06);
}
.top-header > * { flex:0 0 auto; }
.top-header .nav { flex:1 1 auto; min-width:0; }
.gyoseki-nippou .top-header { border-bottom: none; }
.sticky-header { position: sticky; top: 0; z-index: 1000; background: var(--card); }
body.torihiki-ichiran { --torihiki-table-offset: 210px; }
.page-shell { width:min(1440px, calc(100% - 40px)); margin:0 auto 60px; }
.site-header-shell { width:100%; margin:0 auto; display:flex; justify-content:center; position:sticky; top:0; z-index:1200; padding:16px 0 0; background:linear-gradient(180deg, var(--bg) 75%, rgba(245,246,251,0)); }
.site-header-shell > .card { width:100%; border-radius:18px; overflow:hidden; }
.page-root { width:100%; display:flex; flex-direction:column; gap:20px; margin-top:18px; }
.brand { min-width:160px; }
.brand a { display:inline-flex; align-items:center; padding:4px; border-radius:var(--radius-10); text-decoration:none; }
.brand a:hover { background:#f3f4f6; }
.brand img { height:40px; display:block; }
.brand .brand-label { margin-left:8px; font-weight:800; color:#111827; }
.brand a:hover .brand-label { color:#1e40af; }
.nav { flex:1 1 auto; gap:10px; justify-content:flex-start; }
.nav a { display:inline-flex; justify-content:center; align-items:center; text-decoration:none; color:#111827; background:#fff; padding:8px 12px; border-radius:var(--radius-12); border:1px solid #e5e7eb; font-weight:600; font-size:.9rem; white-space:nowrap; box-shadow:0 1px 0 rgba(0,0,0,.02); }
.nav a:hover { background:#f3f4f6; border-color:#d1d5db; }
/* 現在ページの強調（menu.php 以外で active/aria-current を付与） */
.nav a.active,
.nav a[aria-current="page"] {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.nav a.active:hover,
.nav a[aria-current="page"]:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
.nav a.is-disabled { opacity:.45; }
.user-ops {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
  min-width:0;
}
.user-ops form { display:flex; }
.user-ops form button { white-space:nowrap; }
.uname {
  font-size:.8rem;
  color:var(--muted);
  max-width:260px;
  line-height:1.3;
  display:block;
  max-height:calc(1.3em * 2);
  overflow:hidden;
  word-break:break-word;
  overflow-wrap:anywhere;
}
@supports (-webkit-line-clamp: 2) {
  .uname {
    display:-webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}
#btnRunAI.btn-ai {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
#btnRunAI.btn-ai:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
/* サブヘッダーのアクション行（共通） */
.header-actions,
.subheader-actions { margin-left:auto; display:flex; align-items:center; gap:10px; }
.filter-label { font-size:13px; color:var(--muted); font-weight:600; }

/* アクセシビリティ改善 */
:focus-visible { outline:3px solid var(--ring); outline-offset:2px; }
@media (prefers-reduced-motion: reduce) {
  * { animation:none !important; transition:none !important; }
}
body.modal-open { overflow: hidden; }

body[data-scale-canvas="1"] {
  background:var(--bg);
  min-height:100vh;
  padding:0 0 48px;
  box-sizing:border-box;
  display:block;
  opacity:0;
  transition:opacity .08s ease;
}
body[data-scale-canvas="1"] .pc-canvas-root {
  width:1440px;
  min-height:900px;
  transform-origin:top center;
  margin:0;
}
body[data-scale-canvas-ready="1"] {
  opacity:1;
}

/* ========== [3] Components（.btn/.chip/.modal/.tabs/.toggle/.table 等） ========== */
/* TODO: 2025-12-31 `.btn` 系の is-* バリエーションを定義統一したまま維持すること */
:is(.btn,
     .btn-ghost) {
  appearance: none;
  border-radius: var(--radius-10);
  border: 1px solid #d1d5db;
  background: #fff;
  color: #111827;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: var(--btn-h);
  padding: 0 var(--btn-pad-x);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
:is(.btn,
     .btn-ghost):hover {
  background: #f3f4f6;
  border-color: #d1d5db;
}
:is(.btn,
     .btn-ghost)[disabled],
:is(.btn,
     .btn-ghost)[aria-disabled="true"] {
  opacity: .55;
  cursor: not-allowed;
  box-shadow: none;
}

.kintai-warning-dialog {
  padding: 0;
}
.kintai-warning-dialog__wrapper {
  border-radius: var(--radius-12);
}
.kintai-warning-dialog__titlebar {
  font-weight: 700;
}
.kintai-warning-dialog__body {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 16px 8px;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #111827;
}
.kintai-warning-dialog__icon {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fef3c7;
  color: #92400e;
  font-weight: 700;
  font-size: 1rem;
}
.kintai-warning-dialog__message {
  margin: 0;
  white-space: pre-line;
}

.modal-pass-masked {
  -webkit-text-security: disc;
  text-security: disc;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.08em;
}

:is(.btn--sm) {
  min-height: 28px;
  padding: 0 var(--btn-pad-x-sm);
  font-size: 0.85rem;
  gap: 6px;
}
:is(.btn--lg) {
  min-height: var(--btn-h-lg);
  padding: 0 calc(var(--btn-pad-x) + 4px);
}
:is(.btn--wide) { min-width: calc(var(--w-120) + 20px); }
.btn--block { width: 100%; }

.btn-modern {
  background: #f9fafb;
  border-color: #d1d5db;
  color: #1f2937;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}
.btn-modern:hover {
  background: #eef2f7;
  border-color: #cbd5e1;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.10);
}
.btn-modern.small {
  min-height: 30px;
  padding: 0 12px;
  font-size: 0.85rem;
  gap: 6px;
}
:is(.btn, .btn-modern).modal-action-btn.apply {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
:is(.btn, .btn-modern).modal-action-btn.apply:hover {
  background: var(--primary-hover);
  border-color: var(--primary-hover);
}
.modal-action-btn.apply {
  box-shadow: var(--shadow-md);
}
.modal-action-btn.apply:hover {
  box-shadow: var(--shadow-accent);
}
:is(.btn, .btn-modern).modal-action-btn.cancel {
  background: #f3f4f6;
  border-color: #d1d5db;
  color: #374151;
}
:is(.btn, .btn-modern).modal-action-btn.cancel:hover {
  background: #e5e7eb;
  border-color: #cbd5e1;
}
.btn-ghost {
  background: transparent;
  border-color: rgba(148, 163, 184, 0.6);
  color: #1f2937;
  box-shadow: none;
}
.btn-ghost:hover {
  background: rgba(148, 163, 184, 0.12);
  border-color: rgba(148, 163, 184, 0.8);
  box-shadow: none;
}

.modal-pass-dialog { padding: 6px 4px; }
.modal-pass-dialog p { margin: 0 0 12px; font-size: 0.95rem; }
.modal-pass-desc { color: #374151; }
.modal-pass-hidden-field { height: 0; overflow: hidden; margin: 0; }
.modal-pass-hidden-field input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  height: 0;
  width: 0;
}
.modal-pass-input input {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: 1rem;
  line-height: 1.4;
  box-sizing: border-box;
}
.modal-pass-input input:focus {
  outline: 3px solid var(--ring);
  outline-offset: 1px;
}
.modal-pass-error {
  min-height: 18px;
  color: var(--danger, #b91c1c);
  font-size: 0.9rem;
  margin-top: -4px;
}
.modal-pass-actions { margin-top: 16px; }
.modal-pass-btn.cancel {
  background: none;
  border-color: inherit;
  color: inherit;
}
.modal-pass-btn.apply {
  background: none;
  border-color: inherit;
  color: inherit;
}

.icon-btn {
  width: var(--btn-h-lg);
  min-width: var(--btn-h-lg);
  height: var(--btn-h-lg);
  min-height: var(--btn-h-lg);
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
}
.icon-btn img { height:22px; }
/* 一部画面で上書きされるのを防ぐため強制指定 */
.user-ops button.icon-btn > img,
.user-ops a.icon-btn > img { height:22px !important; }

:is(.modal, .date-modal) {
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1400;
}
:is(.modal, .date-modal) .modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  opacity: 0;
  transition: opacity 0.2s ease;
}
:is(.modal, .date-modal).is-open { display: flex; }
:is(.modal, .date-modal).is-open .modal-backdrop { opacity: 1; }
:is(.modal, .date-modal) .modal-card {
  position: relative;
  width: var(--modal-card-width, min(520px, calc(100% - 32px)));
  background: var(--modal-card-bg, #fff);
  border-radius: var(--modal-card-radius, var(--radius-14));
  box-shadow: var(--modal-card-shadow, var(--shadow-lg));
  backdrop-filter: var(--modal-card-backdrop, none);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 32px);
}
:is(.modal, .date-modal) .modal-card :is(header, .modal-header) {
  display: flex;
  align-items: center;
  gap: var(--modal-header-gap, 10px);
  justify-content: space-between;
  padding: var(--modal-header-padding, 12px 18px);
  border-bottom: var(--modal-header-border, 1px solid #e2e8f0);
  background: var(--modal-header-bg, #fff);
  font-weight: 600;
  position: relative;
}
:is(.modal, .date-modal) .modal-card :is(header, .modal-header) strong {
  flex: 1 1 auto;
  text-align: center;
}
:is(.modal, .date-modal) .modal-card :is(header, .modal-header) .modal-close-btn {
  margin-left: auto;
  position: absolute;
  top: var(--modal-close-top, 16px);
  right: var(--modal-close-right, 16px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--modal-close-height, var(--btn-h));
  min-width: var(--modal-close-min-width, auto);
  padding: var(--modal-close-padding, 0 var(--btn-pad-x-sm));
  border-radius: var(--modal-close-radius, var(--radius-10));
  border: var(--modal-close-border, 1px solid #d1d5db);
  background: var(--modal-close-bg, #fff);
  color: var(--modal-close-color, #1f2937);
  font-weight: 700;
  transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
:is(.modal, .date-modal) .modal-card :is(header, .modal-header) .modal-close-btn:hover {
  border-color: var(--modal-close-border-hover, #cbd5e1);
  background: var(--modal-close-bg-hover, #f3f4f6);
}
:is(.modal, .date-modal) .modal-card :is(footer, .modal-footer) {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--modal-footer-gap, 10px); /* modal footer spacing is 10px unless個別 override */
  padding: var(--modal-footer-padding, 12px 18px);
  border-top: var(--modal-footer-border, 1px solid #e2e8f0);
  background: var(--modal-footer-bg, #fff);
}
:is(.modal, .date-modal) .modal-card :is(footer, .modal-footer) :is(.btn, .btn-modern) {
  min-width: var(--modal-footer-btn-min-width, auto);
  padding: var(--modal-footer-btn-padding, 0 var(--btn-pad-x));
  border-radius: var(--modal-footer-btn-radius, var(--radius-10));
  font-weight: var(--modal-footer-btn-weight, 600);
  box-shadow: var(--modal-footer-btn-shadow, none);
}
:is(.modal, .date-modal) .modal-body {
  padding: var(--modal-body-padding, 18px);
  font-size: var(--modal-body-font-size, 0.92rem);
  color: var(--modal-body-color, #1f2937);
  gap: var(--modal-body-gap, 0);
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
:is(.modal, .date-modal) .modal-row { display:flex; align-items:center; justify-content:center; }
:is(.modal, .date-modal) .modal-section + .modal-section { margin-top: 16px; }
:is(.modal, .date-modal) .modal-readonly {
  background: #f8fafc;
  border-radius: 10px;
  padding: 10px 12px;
  line-height: 1.5;
  color: #1f2937;
}
:is(.modal, .date-modal) .modal-readonly--body {
  max-height: 260px;
  overflow-y: auto;
  white-space: pre-wrap;
}
:is(.modal, .date-modal) .btn.is-ghost {
  color: #475569;
}
:is(.modal, .date-modal) .btn.is-ghost:hover {
  color: #1f2937;
}

/* TODO: 2025-12 remove #dateModal 独自指定（.date-modal へ移行完了後） */
:is(.date-modal, .haccp-page #haccpDateModal) {
  --modal-card-radius: calc(var(--radius-16) + 2px);
  --modal-card-bg: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(249,250,251,0.98) 100%);
  --modal-card-backdrop: blur(10px);
  --modal-header-gap: 12px;
  --modal-header-padding: 20px 24px 14px;
  --modal-header-border: 1px solid rgba(148, 163, 184, 0.25);
  --modal-header-bg: linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(244,247,252,0.98) 100%);
  --modal-close-top: 18px;
  --modal-close-right: 18px;
  --modal-close-height: calc(var(--btn-h) - 4px);
  --modal-close-padding: 0 var(--btn-pad-x);
  --modal-close-radius: var(--radius-12);
  --modal-close-border: 1px solid rgba(148, 163, 184, 0.5);
  --modal-close-border-hover: rgba(148, 163, 184, 0.75);
  --modal-close-bg: rgba(226, 232, 240, 0.9);
  --modal-close-bg-hover: rgba(209, 217, 230, 0.95);
  --modal-footer-gap: 10px;
  --modal-footer-padding: 16px 24px 20px;
  --modal-footer-border: 1px solid rgba(148, 163, 184, 0.22);
  --modal-footer-bg: linear-gradient(180deg, rgba(244,247,252,0.95) 0%, rgba(255,255,255,0.99) 100%);
  --modal-footer-btn-min-width: calc(var(--w-120) - var(--space-12));
  --modal-footer-btn-padding: 0 calc(var(--btn-pad-x) + 6px);
  --modal-footer-btn-radius: var(--radius-12);
  --modal-footer-btn-weight: 700;
  --modal-footer-btn-shadow: none;
  --modal-body-padding: 22px 26px 18px;
  --modal-body-gap: 16px;
}
:is(.date-modal, .haccp-page #haccpDateModal) .modal-header strong {
  font-size: 1.08rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: .02em;
}
:is(.date-modal, .haccp-page #haccpDateModal) .modal-body {
  display: flex;
  flex-direction: column;
}
:is(.date-modal, .haccp-page #haccpDateModal) .modal-footer :is(.btn, .btn-modern) {
  background: #fff;
  border: 1px solid #e5e7eb;
  color: #111827;
}
:is(.date-modal, .haccp-page #haccpDateModal) .modal-footer :is(.btn, .btn-modern).apply {
  background: #f9fafb;
}
:is(.date-modal, .haccp-page #haccpDateModal) .modal-footer :is(.btn, .btn-modern):hover {
  background:#f3f4f6;
  border-color:#d1d5db;
}
:is(#dateModal, #haccpDateModal) {
  --modal-card-width: min(var(--w-540), calc(100% - var(--space-48)));
  --modal-close-min-width: var(--w-96);
}
/* Gyoseki 日報の簡易 #dateModal にもモーダル統一デザインを適用 */
#dateModal .modal-header { gap: 12px; padding: 14px 18px 10px; border-bottom: 1px solid #e2e8f0; background: #fff; }
#dateModal .modal-footer { gap: 10px; padding: 12px 18px 16px; border-top: 1px solid #e2e8f0; background: #fff; }
#dateModal .modal-body { padding: 16px 18px 12px; }
#dateModal .modal-card { border-radius: calc(var(--radius-16) + 2px); background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(249,250,251,0.98) 100%); backdrop-filter: blur(10px); }
/* 日付グリッド（chip の見栄えは既存 .chip を流用） */
.gyoseki-nippou #dateModal .date-grid { width: 100%; border-collapse: collapse; table-layout: fixed; }
.gyoseki-nippou #dateModal .date-grid th { padding: 6px 0; font-weight: 700; text-align: center; font-size: .92rem; color:#0f172a; background:#f8fafc; border-bottom:1px solid #e5e7eb; }
.gyoseki-nippou #dateModal .date-grid td { padding: 6px; text-align: center; height: 58px; vertical-align: middle; }
/* #dateModal の chip.date-chip（.date-modal スタイル補完） */
#dateModal .chip.date-chip { min-width: 56px; padding: 10px 12px; font-size: 1.08rem; font-weight: 700; }
#dateModal .chip.date-chip:hover { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(22,163,74,0.15); }
#dateModal .chip.date-chip[aria-checked="true"] { background:#16a34a; color:#fff; border-color:#15803d; box-shadow: 0 0 0 3px rgba(22,163,74,0.2); }
#dateModal .chip.date-chip.is-today { border-color:var(--info); }
:is(.modal, .date-modal) .btn.is-tonal {
  background: var(--primary);
  border: 1px solid var(--primary);
  color: #fff;
}
:is(.modal, .date-modal) .btn.is-tonal:hover {
  background: var(--primary-hover);
  border-color: var(--primary-hover);
}
/* Gyoseki風 月選択 UI（HACCPでも流用） */
.date-input-group {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 2px solid var(--info);
  border-radius: var(--radius-16);
  background: #fff;
}
.date-input-group:focus-within { box-shadow: 0 0 0 4px var(--info-soft); }
.date-input-group .date-field {
  border: none;
  padding: 6px 10px;
  height: 36px;
  text-align: center;
  min-width: var(--w-200);
  line-height: 1;
  font-size: 16px;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
}
.date-input-group .date-field::-webkit-calendar-picker-indicator { opacity: 0; width:0; }
.date-input-group .date-field:focus { outline: none; }
.date-input-group .date-input-icon {
  width: 28px; height: 28px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  position: relative;
  background: #f8fafc;
}
.date-input-group .date-input-icon::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 6px;
  background: #cbd5e1;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

/* 温度管理タブ & テーブル（共通） */
.temp-tabs {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: #e5e7eb;
  margin: 8px 12px;
  margin-right: auto;
}
.temp-tabs-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}
.temp-tabs-bar .temp-tabs {
  margin: 0;
  margin-right: auto;
}
.temp-tabs-status {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 0.82rem;
  color: #475569;
  margin-left: auto;
}
.temp-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  font-weight: 600;
}
.temp-status::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.9;
}
.temp-status.is-complete {
  border-color: #86efac;
  background: #ecfdf5;
  color: #047857;
}
.temp-status.is-empty {
  border-color: #fecaca;
  background: #fef2f2;
  color: #b91c1c;
}
.temp-status.is-complete::before { background: #10b981; }
.temp-status.is-empty::before { background: #ef4444; }
.temp-tab {
  border: none;
  background: transparent;
  color: #4b5563;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 5px 16px;
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.temp-tab:hover { color: #1f2937; }
.temp-tab.is-active {
  background: var(--status-neutral, var(--info));
  color: #fff;
  box-shadow: 0 1px 4px rgba(17, 24, 39, 0.22);
}
.temp-tab:focus-visible { outline: 2px solid var(--info); outline-offset: 2px; }
table.temp-table {
  margin-top: 6px;
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
table.temp-table th,
table.temp-table td {
  text-align: center;
  vertical-align: middle;
  padding: 8px 6px;
}
table.temp-table th:nth-child(1),
table.temp-table td:nth-child(1) {
  width: 16%;
  text-align: left;
}
table.temp-table th:nth-child(2),
table.temp-table td:nth-child(2) { width: 8%; }
table.temp-table th:nth-child(3),
table.temp-table td:nth-child(3),
table.temp-table th:nth-child(4),
table.temp-table td:nth-child(4) { width: 14%; }
table.temp-table th:nth-child(5),
table.temp-table td:nth-child(5) { width: 12%; }
table.temp-table th:nth-child(6),
table.temp-table td:nth-child(6) { width: 14%; }
table.temp-table th:nth-child(7),
table.temp-table td:nth-child(7) { width: 24%; }
table.temp-table td:nth-child(4) { white-space: nowrap; }
table.temp-table .cycle-toggle,
table.temp-table .binary-toggle,
table.temp-table .switch-field { justify-content: center; }
table.temp-table input[type="number"],
table.temp-table input[type="time"],
table.temp-table select,
table.temp-table input[type="text"] {
  text-align: center;
  margin: 0 auto;
}
table.temp-table input[type="number"] {
  max-width: 70px;
}

/* Mania monthly report legacy tables */
.mania-section-title {
  margin: 24px 0 10px;
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
}
.mania-section-title:first-of-type { margin-top: 14px; }
table.mania-legacy-table {
  width: 100%;
  margin-top: 0;
  table-layout: auto;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #84b2e0;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  font-size: 0.9rem;
}
table.mania-legacy-table th,
table.mania-legacy-table td {
  padding: 9px 12px;
  border-right: 1px solid #c5ddf3;
  border-bottom: 1px solid #c5ddf3;
  width: auto !important;
}
table.mania-legacy-table thead th {
  background: linear-gradient(180deg, #4a79b7 0%, #315c97 100%);
  color: #ffffff;
  border-right: 1px solid rgba(255,255,255,0.15);
  border-bottom: 1px solid #295082;
  font-weight: 700;
  text-align: center;
}
table.mania-legacy-table thead th:first-child { text-align: left; }
table.mania-legacy-table tbody tr:nth-child(odd) { background: #fbfdff; }
table.mania-legacy-table td {
  text-align: right;
  color: #0f172a;
}
table.mania-legacy-table th:first-child,
table.mania-legacy-table td:first-child {
  text-align: left;
}
table.mania-legacy-table td:first-child:not(:empty) {
  font-weight: 700;
  color: #244b86;
  background: linear-gradient(180deg, #e8f1ff 0%, #d8e6fb 100%);
}
table.mania-legacy-table td:first-child.empty-group {
  background: linear-gradient(180deg, #f5faff 0%, #edf4ff 100%);
  border-top-color: transparent;
}
table.mania-legacy-table tr.is-group-header td,
table.mania-legacy-table tr.group-sub td {
  background: linear-gradient(180deg, #f5faff 0%, #edf4ff 100%);
}
/* グループ内部の横罫線を消す */
table.mania-legacy-table tr.group-sub td { border-top-color: transparent; }
/* グループの最終行だけ外枠の下罫線を戻す */
table.mania-legacy-table tr.group-sub.group-end td { border-bottom: 1px solid #c5ddf3; }
table.mania-legacy-table th:last-child,
table.mania-legacy-table td:last-child { border-right: 0; }
table.mania-legacy-table tr:last-child td { border-bottom: 0; }
table.mania-legacy-table input[type="number"],
table.mania-legacy-table input[type="text"] {
  width: 100%;
  max-width: 120px;
  padding: 6px 8px;
  border: 1px solid #d4d4d8;
  border-radius: 6px;
  font-size: 0.88rem;
  color: #111827;
  background: #fff;
}
table.mania-legacy-table input[type="text"] { text-align: left; }
table.mania-legacy-table input[type="number"] { text-align: right; }
table.mania-legacy-table input:focus {
  outline: 2px solid var(--primary);
  outline-offset: 1px;
}
table.mania-legacy-table tfoot td {
  border-top: 2px solid #84b2e0;
  font-weight: 700;
}
table.mania-legacy-table:not(.mania-breakdown-table):not(.mania-ywt-table) th:nth-child(1),
table.mania-legacy-table:not(.mania-breakdown-table):not(.mania-ywt-table) td:nth-child(1) { width: 26%; }
table.mania-legacy-table:not(.mania-breakdown-table):not(.mania-ywt-table) th:nth-child(2),
table.mania-legacy-table:not(.mania-breakdown-table):not(.mania-ywt-table) td:nth-child(2) { width: 18%; }
table.mania-legacy-table:not(.mania-breakdown-table):not(.mania-ywt-table) th:nth-child(3),
table.mania-legacy-table:not(.mania-breakdown-table):not(.mania-ywt-table) td:nth-child(3) { width: 20%; }
table.mania-legacy-table:not(.mania-breakdown-table):not(.mania-ywt-table) th:nth-child(4),
table.mania-legacy-table:not(.mania-breakdown-table):not(.mania-ywt-table) td:nth-child(4) { width: 18%; }
table.mania-legacy-table td:first-child:empty {
  border-top-color: transparent;
  background: #fbfdff;
}
table.mania-legacy-table tr:first-child td:first-child:empty {
  border-top-color: #c5ddf3;
}
table.mania-breakdown-table td:nth-child(2),
table.mania-breakdown-table td:nth-child(3),
table.mania-breakdown-table td:nth-child(4),
table.mania-breakdown-table td:nth-child(5),
table.mania-breakdown-table td:nth-child(6),
table.mania-breakdown-table td:nth-child(7),
table.mania-breakdown-table td:nth-child(8),
table.mania-breakdown-table td:nth-child(9) {
  text-align: right;
  white-space: nowrap;
}
table.mania-breakdown-table th,
table.mania-breakdown-table td { padding: 8px 10px; font-size: 0.85rem; }
table.mania-breakdown-table th:nth-child(1),
table.mania-breakdown-table td:nth-child(1) { width: 16%; }
table.mania-breakdown-table th:nth-child(2),
table.mania-breakdown-table td:nth-child(2) { width: 14%; }
table.mania-breakdown-table th:nth-child(3),
table.mania-breakdown-table td:nth-child(3) { width: 11%; }
table.mania-breakdown-table th:nth-child(4),
table.mania-breakdown-table td:nth-child(4),
table.mania-breakdown-table th:nth-child(5),
table.mania-breakdown-table td:nth-child(5) { width: 13%; }
table.mania-breakdown-table th:nth-child(6),
table.mania-breakdown-table td:nth-child(6) { width: 11%; }
table.mania-breakdown-table th:nth-child(7),
table.mania-breakdown-table td:nth-child(7) { width: 12%; }
table.mania-breakdown-table th:nth-child(8),
table.mania-breakdown-table td:nth-child(8) { width: 10%; }
table.mania-breakdown-table th:nth-child(9),
table.mania-breakdown-table td:nth-child(9) { width: 12%; }
table.mania-breakdown-table td:nth-child(2) { font-weight: 700; }
table.mania-breakdown-table td:nth-child(3) { color: #1d4ed8; }
table.mania-ywt-table th,
table.mania-ywt-table td {
  text-align: left;
  vertical-align: top;
}
table.mania-ywt-table td:first-child {
  text-align: center;
  font-weight: 700;
  color: #2563eb;
  width: 60px;
}
table.mania-ywt-table input[type="text"] {
  width: 100%;
  max-width: none;
  text-align: left;
  padding: 8px 10px;
  border: 1px solid #cbd5f5;
  border-radius: 6px;
  background: #fff;
}
table.mania-ywt-table input[type="text"]:focus {
  outline: 2px solid var(--primary);
  outline-offset: 1px;
}

/* バイナリトグル（2値選択） */
.binary-toggle {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
}
.binary-toggle-button {
  border: 1px solid #d1d5db;
  border-radius: 20px;
  background: #f9fafb;
  color: #4b5563;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 4px 16px;
  min-width: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.binary-toggle-button.binary-toggle-good { border-color: var(--status-good, #16a34a); color: var(--status-good, #16a34a); }
.binary-toggle-button.binary-toggle-bad { border-color: var(--status-bad, #b91c1c); color: var(--status-bad, #b91c1c); }
.binary-toggle-button.is-active { color: #fff; transform: translateY(-1px); }
.binary-toggle-button.binary-toggle-good.is-active {
  background: var(--status-good, #16a34a);
  border-color: var(--status-good, #16a34a);
}
.binary-toggle-button.binary-toggle-bad.is-active {
  background: var(--status-bad, #b91c1c);
  border-color: var(--status-bad, #b91c1c);
}
.binary-toggle-button:focus-visible { outline: 2px solid var(--info); outline-offset: 2px; }

/* サイクルトグル（〇/× 切替） */
.cycle-toggle {
  display: inline-flex;
  justify-content: center;
}
.cycle-toggle-button {
  border: 1px solid #d1d5db;
  border-radius: 999px;
  background: #f9fafb;
  color: #4b5563;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 6px 20px;
  min-width: 80px;
  min-height: 34px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.cycle-toggle-button.cycle-state-good {
  background: var(--status-good, #16a34a);
  border-color: var(--status-good, #16a34a);
  color: #fff;
}
.cycle-toggle-button.cycle-state-bad {
  background: var(--status-bad, #b91c1c);
  border-color: var(--status-bad, #b91c1c);
  color: #fff;
}
.cycle-toggle-button.cycle-state-neutral {
  background: #f9fafb;
  border-color: #d1d5db;
  color: #4b5563;
}
.cycle-toggle-button:focus-visible { outline: 2px solid var(--info); outline-offset: 2px; }

/* チップUI（フィルタ/セレクタ共通） */
.chip-list {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.chip-toggle {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.chip-toggle .chip-list.is-collapsed {
  display: none;
}
.chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px;
  border: 2px solid #dbeafe;
  border-radius: 9999px;
  background: #fff;
  color: #1f2937;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.chip:hover {
  border-color: #60a5fa;
  background: #f4f8ff;
  color: #1e3a8a;
}
.chip[aria-checked="true"] {
  border-color: var(--info);
  background: #eff6ff;
  color: var(--info-hover);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.18);
}
.chip.is-active {
  border-color: var(--info);
  background: #eff6ff;
  color: var(--info-hover);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.18);
}
.chip.is-static {
  cursor: default;
  border-color: #dbeafe;
  background: #fff;
  color: #1f2937;
  box-shadow: none;
}
.chip.is-static:hover {
  border-color: #dbeafe;
  background: #fff;
  color: #1f2937;
  box-shadow: none;
}
.chip.apply {
  background: #16a34a;
  border-color: #16a34a;
  color: #fff;
}
.chip.apply:hover {
  background: #15803d;
  border-color: #15803d;
}
.chip.all {
  border-color: var(--info);
  color: var(--info-hover);
}
.chip.all[aria-checked="true"] {
  background: var(--info);
  color: #fff;
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.25);
}
.chip.total {
  background: #fff;
  border-color: #e5e7eb;
  color: #111827;
}
.chip.total[aria-checked="true"] {
  background: #111827;
  border-color: #111827;
  color: #fff;
}
.chip-showmore {
  background: #f3f4f6;
  border-color: #cbd5f5;
  color: #1f2937;
  font-weight: 600;
  padding: 6px 18px;
  box-shadow: inset 0 0 0 1px rgba(59, 130, 246, 0.12);
}
.chip-showmore:hover {
  background: #e2e8f0;
  border-color: #93c5fd;
  color: #1e3a8a;
}

/* haccp のフォーム既定高さが干渉しないように限定リセット */
.haccp-page .modal input[type="month"] { height:36px; border-radius:0; }

.clcheck-card {
  display:flex;
  flex-direction:column;
  gap:16px;
}
.clcheck-card .card-title {
  font-size:1.35rem;
  font-weight:700;
  margin:0;
}
.clcheck-card .card-subtitle {
  margin:6px 0 0;
  color:var(--muted);
  font-size:.95rem;
}
.clcheck-header {
  display:flex;
  flex-direction:column;
  gap:6px;
}
.clcheck-card.card {
  padding:18px 22px 24px;
}
.clcheck-score {
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 18px;
  border-radius:var(--radius-14);
  background:linear-gradient(135deg, rgba(56,128,69,0.12) 0%, rgba(56,128,69,0.06) 100%);
  border:1px solid rgba(56,128,69,0.2);
  box-shadow:0 8px 22px rgba(56,128,69,0.18);
  margin-left:auto;
  align-self:flex-end;
  margin-bottom:4px;
}
.clcheck-score--sticky {
  position:sticky;
  top:16px;
  z-index:5;
}
.clcheck-score-label {
  font-size:.9rem;
  font-weight:700;
  color:#1f2937;
}
.clcheck-score-value {
  font-size:2.2rem;
  font-weight:800;
  color:var(--primary);
  line-height:1;
}
.clcheck-score-max {
  font-size:.9rem;
  font-weight:600;
  color:#64748b;
}
.clcheck-form {
  display:flex;
  flex-direction:column;
  gap:28px;
}
.clcheck-section {
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:var(--radius-16);
  box-shadow:0 16px 30px rgba(15,23,42,0.12);
  padding:22px 22px 26px;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.clcheck-section-title {
  margin:0;
  font-size:1.15rem;
  font-weight:700;
  color:#1f2937;
}
.clcheck-table {
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid #e2e8f0;
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 8px 24px rgba(15,23,42,0.08);
}
.clcheck-table thead th {
  background:linear-gradient(135deg, rgba(37,99,235,0.12), rgba(37,99,235,0.05));
  color:#1f2937;
  font-weight:700;
  font-size:.9rem;
  text-align:center;
  padding:12px 10px;
  border-bottom:1px solid #dbeafe;
}
.clcheck-table thead th:nth-child(1),
.clcheck-table tbody td:nth-child(1) {
  width:72px;
  min-width:72px;
  text-align:center;
}
.clcheck-table thead th:nth-child(2),
.clcheck-table tbody td:nth-child(2) {
  width:180px;
  min-width:170px;
}
.clcheck-table thead th:nth-child(3),
.clcheck-table tbody td:nth-child(3) {
  width:36%;
  min-width:280px;
}
.clcheck-table thead th:nth-child(4),
.clcheck-table tbody td:nth-child(4) {
  width:140px;
  min-width:130px;
  text-align:center;
}
.clcheck-table thead th:nth-child(5),
.clcheck-table tbody td:nth-child(5) {
  width:110px;
  min-width:100px;
  text-align:center;
}
.clcheck-table thead th:nth-child(6),
.clcheck-table tbody td:nth-child(6) {
  width:260px;
  min-width:220px;
}
.clcheck-table tbody td {
  background:#fff;
  padding:14px 12px;
  border-bottom:1px solid #e5e7eb;
  font-size:.95rem;
}
.clcheck-table tbody tr:last-child td { border-bottom:none; }
.clcheck-table tbody tr:hover td {
  background:#f8fafc;
}
.clcheck-table tbody tr.is-saving td {
  background:#e0f2fe;
  transition:background .2s ease;
}
.clcheck-table tbody td:nth-child(3) {
  text-align:left;
  line-height:1.6;
}
.clcheck-table tbody td:nth-child(6) {
  min-width:220px;
}
.clcheck-summary-table {
  width:100%;
  table-layout:fixed;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid #e2e8f0;
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 8px 24px rgba(15,23,42,0.08);
}
.clcheck-summary-table thead th {
  background:linear-gradient(135deg, rgba(37,99,235,0.12), rgba(37,99,235,0.05));
  color:#1f2937;
  font-weight:700;
  font-size:.9rem;
  text-align:center;
  padding:12px 10px;
  border-bottom:1px solid #dbeafe;
}
.clcheck-summary-table tbody td,
.clcheck-summary-table tfoot td,
.clcheck-summary-table tfoot th {
  padding:14px 12px;
  border-bottom:1px solid #e5e7eb;
  font-size:.95rem;
  text-align:center;
  background:#fff;
}
.clcheck-summary-table tbody tr:last-child td { border-bottom:none; }
.clcheck-summary-table tbody tr:hover td { background:#f8fafc; }
.clcheck-summary-table tfoot td,
.clcheck-summary-table tfoot th {
  font-weight:700;
  background:#f8fafc;
}
.clcheck-editor-table thead th:nth-child(1),
.clcheck-editor-table tbody td:nth-child(1) {
  width:80px;
  min-width:72px;
}
.clcheck-editor-table thead th:nth-child(4),
.clcheck-editor-table thead th:nth-child(5),
.clcheck-editor-table tbody td:nth-child(4),
.clcheck-editor-table tbody td:nth-child(5) {
  width:120px;
  min-width:110px;
}
.clcheck-editor-table thead th:nth-child(2),
.clcheck-editor-table thead th:nth-child(3),
.clcheck-editor-table tbody td:nth-child(2),
.clcheck-editor-table tbody td:nth-child(3) {
  text-align:left;
}
.clcheck-editor-table tbody td:nth-child(4),
.clcheck-editor-table tbody td:nth-child(5) {
  text-align:center;
}
.clcheck-editor-table tbody tr.is-new td {
  background:#f8fafc;
}
.clcheck-editor-table .input-modern {
  height:32px;
}
.clcheck-comment {
  width:100%;
  min-height:44px;
  resize:vertical;
  border:1px solid #d1d5db;
  border-radius:10px;
  padding:8px 10px;
  font-family:inherit;
  font-size:.95rem;
}
.clcheck-comment:focus {
  outline:3px solid rgba(37,99,235,0.25);
  border-color:var(--info);
}
.clcheck-photos {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:18px;
}
.clcheck-photo-block {
  border:1px solid #e2e8f0;
  border-radius:14px;
  padding:16px;
  background:#f9fafb;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.clcheck-photo-block h3 {
  margin:0;
  font-size:1rem;
  font-weight:700;
  color:#1f2937;
}
.clcheck-photo-list {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:12px;
  margin:0;
  padding:0;
  list-style:none;
}
.clcheck-photo-list li {
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 6px 18px rgba(15,23,42,0.16);
  background:#fff;
}
.clcheck-photo-list img {
  display:block;
  width:100%;
  height:auto;
}
.clcheck-photo-empty {
  margin:0;
  padding:24px 0;
  text-align:center;
  color:#6b7280;
  font-size:.92rem;
}
.clcheck-upload {
  position:relative;
}
.clcheck-file-input {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  border:0;
  clip:rect(0,0,0,0);
  overflow:hidden;
}
.clcheck-upload-label {
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:14px 16px;
  border:1px dashed #cbd5f5;
  border-radius:14px;
  background:#f8fafc;
  color:#1f2937;
  cursor:pointer;
  transition:border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.clcheck-upload-label:hover {
  border-color:#60a5fa;
  background:#eff6ff;
  box-shadow:0 6px 18px rgba(37,99,235,0.18);
  transform:translateY(-1px);
}
.clcheck-upload-main {
  font-weight:600;
  font-size:.95rem;
}
.clcheck-upload-sub {
  font-size:.82rem;
  color:#64748b;
}
.clcheck-actions {
  margin-top:12px;
  justify-content:flex-end;
}
.status-message {
  padding:12px 14px;
  border-radius:12px;
  font-size:.95rem;
  background:#f9fafb;
  border:1px solid #e2e8f0;
  color:#4b5563;
}
.status-message--success {
  background:rgba(56,128,69,0.12);
  border-color:rgba(56,128,69,0.32);
  color:#166534;
}
.status-message--error {
  background:rgba(239,68,68,0.12);
  border-color:rgba(239,68,68,0.32);
  color:#b91c1c;
}
.clcheck-page #loading {
  position:fixed;
  inset:0;
  background:rgba(255,255,255,0.74);
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.2rem;
  color:#1f2937;
}

/* -------------------------------
   ヘッダー（ロゴ）
-------------------------------- */
.site-header {
  display:flex; justify-content:center; align-items:center;
  padding:24px 0 8px;
}
.site-header img { height:42px; }

/* -------------------------------
   レイアウト（2カラム）
-------------------------------- */
.landing-grid {
  width:min(1100px,92vw);
  margin:0 auto 36px;
  display:grid;
  grid-template-columns:1fr;
  gap:22px;
}
@media (min-width: 1024px) {
  .landing-grid {
    grid-template-columns:minmax(420px,1fr) 560px; /* 右カードを固定幅 */
    align-items:stretch;
  }
  .card { height:100%; }
}

/* -------------------------------
   カード & タイポ
-------------------------------- */
.card {
  background:var(--card);
  border-radius:var(--radius-16);
  padding:24px 22px;
  box-shadow:var(--shadow);
}
/* 見た目を menu.php と一致させるためのヘッダー上書き */
.card.top-header { padding:16px 20px; }
.title { font-size:1.25rem; font-weight:700; margin:0 0 12px; }
.muted { color:var(--muted); font-size:.9rem; }

/* -------------------------------
   フォーム
-------------------------------- */
label { display:block; font-weight:600; margin:12px 0 6px; }
.req { color:var(--muted); margin-left:4px; font-weight:400; }
.field {
  width:100%;
  padding:12px 14px;
  border:1px solid #e5e7eb;
  border-radius:var(--radius-10);
  background:transparent;
  color:inherit;
  font-size:1rem;
  line-height:1.2;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.field:focus { border-color:var(--ring); box-shadow:0 0 0 4px rgba(59,130,246,.15); }
.password-wrap { position:relative; }
.toggle {
  position:absolute; right:10px; top:50%; transform:translateY(-50%);
  font-size:.9rem; cursor:pointer; user-select:none; color:var(--muted);
}
.row { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:10px; }
/* -------------------------------
   権限管理ページ
-------------------------------- */
.card--flush { padding: 0; }
.page-body--padded { padding: 7px 28px 36px; }
.page-title--tight { margin-bottom: 6px; }
.permissions-app {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.perm-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.filter-summary {
  font-size: 13px;
  color: #4b5563;
  display: flex;
  align-items: center;
  gap: 8px;
}
.filter-summary strong { color: #111827; }
.toolbar-actions {
  display: flex;
  gap: 10px;
  align-items: center;
}
.bulk-mode-toggle {
  display: inline-flex;
  border-radius: 9999px;
  border: 1px solid #d1d5db;
  background: #f9fafb;
  padding: 4px;
  gap: 4px;
}
.bulk-mode-toggle__btn {
  border: none;
  background: transparent;
  color: #4b5563;
  font-size: 13px;
  padding: 6px 14px;
  border-radius: 9999px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}
.bulk-mode-toggle__btn:hover {
  background: rgba(59, 130, 246, 0.08);
  color: var(--info-hover);
}
.bulk-mode-toggle__btn.is-active {
  background: #1f2937;
  color: #fff;
}
.bulk-mode-toggle__btn.is-active:hover {
  background: #111827;
}
.perm-role-list {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #f9fafb;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 216px;
  overflow-y: auto;
}
.perm-role-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 8px 12px;
  gap: 12px;
}
.perm-role-item__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.perm-role-item__name { font-weight: 600; color: #111827; }
.perm-role-item__meta { font-size: 12px; color: #6b7280; }
.perm-role-item__actions {
  display: flex;
  gap: 8px;
}
.perm-role-item__rename {
  border: 1px solid #d1d5db;
  background: #f3f4f6;
  color: #374151;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 12px;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border 0.15s ease;
}
.perm-role-item__rename:hover {
  background: #e5e7eb;
  border-color: #9ca3af;
}
.perm-role-item__delete {
  border: 1px solid #ef4444;
  background: rgba(239, 68, 68, 0.12);
  color: #b91c1c;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 12px;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border 0.15s ease;
}
.perm-role-item__delete:hover {
  background: rgba(239, 68, 68, 0.2);
  border-color: #b91c1c;
}
:is(.btn.is-outline) {
  border-color: #d1d5db;
  background: transparent;
  color: #1f2937;
}
:is(.btn.is-outline):hover {
  background: #f9fafb;
  border-color: #1f2937;
}

:is(.btn.is-ghost) {
  background: #fff;
  border-color: #e5e7eb;
  color: #111827;
}
:is(.btn.is-ghost):hover {
  background: #f3f4f6;
  border-color: #d1d5db;
}

:is(.btn.is-primary) {
  border-color: var(--primary);
  background: var(--primary);
  color: #fff;
}
:is(.btn.is-primary):hover {
  background: var(--primary-hover);
  border-color: var(--primary-hover);
}

:is(.btn.is-secondary) {
  border-color: var(--info);
  background: rgba(37, 99, 235, 0.12);
  color: var(--info-hover);
}
:is(.btn.is-secondary):hover {
  background: rgba(37, 99, 235, 0.18);
  border-color: var(--info-hover);
}

:is(.btn.is-danger) {
  border-color: #ef4444;
  background: rgba(239, 68, 68, 0.12);
  color: #b91c1c;
}
:is(.btn.is-danger):hover {
  background: rgba(239, 68, 68, 0.18);
  border-color: #b91c1c;
}

:is(.btn.is-tonal) {
  background: var(--info-hover);
  border-color: var(--info-hover);
  color: #fff;
}
:is(.btn.is-tonal):hover {
  background: #1e40af;
  border-color: #1e40af;
}

/* bulk request button states */
:is(.btn.is-primary).bulk-request--enabled {
  background: #16a34a;
  border-color: #15803d;
  color: #fff;
}
:is(.btn.is-primary).bulk-request--enabled:hover {
  background: #15803d;
  border-color: #14532d;
}
:is(.btn.is-primary).bulk-request--disabled,
:is(.btn.is-primary).bulk-request--disabled[disabled] {
  background: #e2e8f0;
  border-color: #cbd5f5;
  color: #475569;
  opacity: 1;
  cursor: not-allowed;
}
:is(.btn.is-primary).bulk-request--disabled[disabled]:hover {
  background: #e2e8f0;
  border-color: #cbd5f5;
}
.perm-table-wrapper {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  overflow: auto;
  max-height: 60vh;
}
.perm-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  min-width: 720px;
}
.perm-table thead th {
  background: #f3f4f6;
  position: sticky;
  top: 0;
  z-index: 2;
}
.perm-table th,
.perm-table td {
  padding: 10px 14px;
  border-bottom: 1px solid #e5e7eb;
  text-align: left;
  vertical-align: top;
}
.perm-table tbody tr:last-child td { border-bottom: none; }
.perm-col-name { width: 20%; }
.perm-col-scope { width: 14%; }
.perm-col-type { width: 12%; }
.perm-col-capabilities { width: 36%; min-width: 360px; }
.perm-col-updated { width: 10%; }
.perm-col-actions { width: 8%; }
.perm-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef2ff;
  color: #4338ca;
  font-size: 11px;
  margin: 0 6px 6px 0;
}
.perm-edit-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 14px;
  border-radius: 8px;
  border: 1px solid #1f2937;
  background: #fff;
  color: #1f2937;
  font-size: 12px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}
.perm-edit-button:hover:not(:disabled) {
  background: #1f2937;
  color: #fff;
}
.perm-edit-button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.perm-empty,
.perm-error,
.perm-loading {
  padding: 24px;
  text-align: center;
  color: #4b5563;
}
.perm-notice {
  margin-top: -8px;
  padding: 12px 16px;
  border-radius: 12px;
  background: #ecfdf5;
  color: #047857;
  font-size: 13px;
}
.perm-scope-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #e0f2fe;
  color: #0c4a6e;
  font-size: 11px;
}
.perm-meta {
  font-size: 12px;
  color: #6b7280;
  display: flex;
  gap: 18px;
}
.form-hint {
  display: block;
  font-size: 12px;
  color: #6b7280;
  margin-top: 4px;
}
.perm-modal-backdrop {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(15, 23, 42, 0.45);
  z-index: 1200;
}
.perm-modal-backdrop[data-confirm-modal] {
  z-index: 1300;
}
.perm-modal-backdrop[hidden] { display: none; }
.perm-modal {
  width: min(700px, 100%);
  max-height: calc(100vh - 48px);
  background: #fff;
  border-radius: var(--radius-16);
  box-shadow: 0 30px 60px rgba(15, 23, 42, 0.28);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.perm-modal--confirm {
  width: min(440px, 100%);
  max-height: none;
}
.perm-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 22px 26px 16px;
  border-bottom: 1px solid #e5e7eb;
}
.perm-modal__title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  color: #111827;
}
.perm-modal__scope {
  margin: 6px 0 0;
  font-size: 12px;
  color: #6b7280;
}
.perm-modal__close {
  border: none;
  background: transparent;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  color: #6b7280;
}
.perm-modal__close:hover { color: #111827; }
.perm-modal__body {
  padding: 6px 26px 16px;
  overflow-y: auto;
  flex: 1 1 auto;
}
.perm-modal__section { margin-top: 18px; }
.perm-modal__section:first-of-type { margin-top: 0; }
.perm-modal__label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  color: #374151;
}
.perm-modal__label input[type="text"],
.perm-modal__label select,
.perm-modal__label textarea {
  border: 1px solid #d1d5db;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 13px;
  background: #fff;
}
.perm-modal__label textarea { min-height: 88px; resize: vertical; }
.perm-modal__label--inline {
  flex-direction: column;
  align-items: flex-start;
}
.perm-modal__label select[multiple] {
  min-height: 180px;
}
.bulk-ability-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin-top: 10px;
  max-height: 200px;
  overflow-y: auto;
  padding-right: 6px;
  scrollbar-width: thin;
  scrollbar-color: rgba(156, 163, 175, 0.6) transparent;
}
.bulk-ability-grid::-webkit-scrollbar {
  width: 6px;
}
.bulk-ability-grid::-webkit-scrollbar-thumb {
  background: rgba(156, 163, 175, 0.6);
  border-radius: 9999px;
}
.bulk-ability-grid::-webkit-scrollbar-track {
  background: transparent;
}
.perm-confirm__message {
  font-size: 14px;
  color: #1f2937;
  margin: 12px 0 0;
  line-height: 1.6;
}
.perm-confirm__option {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  font-size: 13px;
  color: #1f2937;
}
.perm-confirm__option input[type="checkbox"] {
  width: 16px;
  height: 16px;
}
.perm-confirm__hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: #6b7280;
}
.perm-modal__checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #f9fafb;
  font-size: 13px;
  color: #1f2937;
}
.perm-modal__checkbox input[type="checkbox"] {
  width: 16px;
  height: 16px;
}
.perm-modal__error {
  margin-top: 16px;
  padding: 10px 14px;
  border-radius: 8px;
  background: #fee2e2;
  color: #991b1b;
  font-size: 12px;
}
.perm-modal__error[hidden] { display: none; }
.perm-modal__footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 26px;
  border-top: 1px solid #e5e7eb;
  background: #f9fafb;
  flex-shrink: 0;
}
.perm-modal__footer :is(.btn.is-primary) {
  padding: 8px 18px;
  border: none;
  border-radius: 8px;
  background: #1f2937;
  color: #fff;
  font-size: 13px;
  cursor: pointer;
}
.perm-modal__footer :is(.btn.is-primary)[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}
@media (max-width: 1024px) {
  .perm-table-wrapper { overflow-x: auto; }
  .perm-toolbar { flex-direction: column; align-items: flex-start; }
  .toolbar-actions { width: 100%; }
  .toolbar-actions :is(.btn.is-outline),
  .toolbar-actions :is(.btn.is-primary) { width: 100%; }
}
.btn:active { transform:translateY(1px); }
.hint { font-size:.85rem; color:var(--muted); margin-top:10px; }
.links a { color:inherit; text-decoration:underline; }

.gyoseki-nippou input.button {
  appearance: none;
  display: block;
  width: min(520px, 92%);
  padding: 18px 48px;
  margin: 32px auto 0;
  border: none;
  border-radius: 18px;
  background: var(--primary);
  color: #fff;
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: 0.03em;
  box-shadow: 0 12px 26px rgba(57, 143, 61, 0.28);
  cursor: pointer;
  transition: background-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.gyoseki-nippou input.button:hover {
  background: var(--primary-hover);
  box-shadow: 0 14px 30px rgba(47, 122, 51, 0.32);
}
.gyoseki-nippou input.button:active {
  transform: translateY(1px);
}

/* Gyoseki 日報：更新ボタンを右下フロート表示（機能変更なし・CSSのみ） */
.gyoseki-nippou input[type="submit"].button[name="更新"],
.gyoseki-nippou button.button[name="更新"] {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 1200; /* モーダル(1400)より下にして隠れるように */
  width: auto;
  min-width: 180px;
  margin: 0;
  padding: 14px 22px;
  border-radius: var(--radius-16);
  background: #2563eb;
  color: #fff;
  border: 1px solid #1d4ed8;
  box-shadow: 0 18px 38px rgba(37, 99, 235, 0.28);
  font-weight: 700;
}
.gyoseki-nippou input[type="submit"].button[name="更新"]:hover,
.gyoseki-nippou button.button[name="更新"]:hover {
  background: #1d4ed8;
  border-color: #1a44c7;
  box-shadow: 0 20px 44px rgba(29, 78, 216, 0.32);
}
.gyoseki-nippou input[type="submit"].button[name="更新"]:active,
.gyoseki-nippou button.button[name="更新"]:active {
  transform: translateY(1px);
}

@media (max-width: 768px) {
  .gyoseki-nippou input[type="submit"].button[name="更新"],
  .gyoseki-nippou button.button[name="更新"] {
    right: 14px;
    bottom: 14px;
    min-width: 150px;
    padding: 12px 18px;
  }
}

/* -------------------------------
   メンバー登録フォーム（useradd/re_members.php）
-------------------------------- */
body.signup-form { justify-content: center; padding: 24px 16px 48px; }
.signup-form__container {
  width: min(540px, 94vw);
  margin: 0 auto;
  flex: 1;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.signup-form__card { width: 100%; display: flex; flex-direction: column; gap: 12px; }
.signup-form__title { margin: 0; font-size: 1.6rem; text-align: center; }
.signup-form__lead { margin: -4px 0 8px; text-align: center; color: var(--muted); font-size: .95rem; }
.signup-form__form { display: flex; flex-direction: column; }
.form-block { display: flex; flex-direction: column; gap: 6px; margin-top: 16px; }
.form-block:first-of-type { margin-top: 8px; }
.signup-form__submit { margin-top: 24px; }
.validation-message {
  margin: 2px 0 0;
  font-size: .82rem;
  color: #ef4444;
}
.validation-message[hidden] { display: none; }
.field.is-error {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239,68,68,.12);
}

.signup-summary {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid #e5e7eb;
  display: grid;
  grid-template-columns: minmax(120px, 1fr) 2fr;
  gap: 10px 16px;
}
.signup-summary dt { font-weight: 700; color: var(--muted); font-size: .85rem; }
.signup-summary dd { margin: 0; font-size: 1rem; color: var(--text); word-break: break-word; }
.signup-success__actions { margin-top: 28px; display:flex; flex-direction:column; align-items:center; gap:18px; }
.signup-success__apps { display:flex; flex-wrap:wrap; gap:18px; justify-content:center; }
.signup-success__apps img { height:auto; }
.signup-success__message { font-size:.95rem; color:var(--muted); text-align:center; line-height:1.6; }
@media (max-width: 640px) {
  .signup-summary { grid-template-columns: 1fr; }
  .signup-summary dt { margin-bottom: 2px; }
}

@media (min-width: 768px) {
  .signup-form__card { padding: 32px 28px; }
  .signup-form__title { font-size: 1.8rem; }
  .signup-form__lead { font-size: 1rem; }
}

/* -------------------------------
   Facebookカード
-------------------------------- */
.fb-card { position:relative; }
.fb-card .title { margin-bottom:6px; }
.fb-card .muted { margin-bottom:12px; }

/* fb-page: 幅はカード幅に合わせ、JSで高さを上書き */
.fb-card .fb-page {
  width:100%;
  max-width:500px;    /* Facebookの実上限 */
  margin:0 auto;      /* 中央寄せ */
  min-height:0 !important; /* 強制リセット */
}

/* -------------------------------
   FBスケルトン（読み込み中のプレースホルダ）
-------------------------------- */
.fb-skeleton {
  position:absolute;
  inset:64px 16px 16px 16px;
  z-index:2;
  border:1px solid rgba(0,0,0,.06);
  border-radius:var(--radius-12);
  padding:14px;
  background:linear-gradient(90deg, rgba(0,0,0,0.04), rgba(0,0,0,0.06), rgba(0,0,0,0.04));
  background-size:200% 100%;
  animation:sk-shimmer 1.4s infinite linear;
  pointer-events:none;
  opacity:1;
  transition:opacity .25s ease;
}
.fb-skeleton.hidden { opacity:0; }
.fb-skeleton .sk-head { height:120px; border-radius:var(--radius-8); background:rgba(255,255,255,.65); margin-bottom:12px; }
.fb-skeleton .sk-line { height:12px; border-radius:9999px; background:rgba(255,255,255,.65); margin:10px 0; }
.fb-skeleton .sk-line.short { width:60%; }
@keyframes sk-shimmer {
  0% { background-position:200% 0; }
  100% { background-position:-200% 0; }
}

/* -------------------------------
   モバイル調整
-------------------------------- */
@media (max-width: 1024px) {
  .login-card { order:1; }
  .fb-card { order:2; }
  .card { padding:20px 18px; }
}

/* -------------------------------
   ユーティリティ
-------------------------------- */
.text-center { text-align:center; }
.mt-8{margin-top:8px} .mt-12{margin-top:12px} .mt-16{margin-top:16px}

/* ログインカード右上のロゴ配置 */
.login-card {
  position: relative;
}

/* =========================================================
   Kintai: 勤怠修正モーダル専用スタイル（jQuery UI）
   スコープ: #kintaiEditModal 配下のみ（他画面へ影響しない）
   競合対策: table.css のグローバル指定を上書きするためにIDで限定
   ========================================================= */
/* コンテンツ部（中身のみスクロール） */
#kintaiEditModal.ui-dialog-content {
  padding: 0;
  /* さらに縦幅を抑えて、内部スクロール主体に */
  max-height: min(58vh, calc(100vh - 260px));
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
/* コンテナの下余白を消して、フッター下の空白を解消 */
.ui-dialog[aria-describedby="kintaiEditModal"] { padding-bottom: 0; }
/* 内側フォーム余白 */
#kintaiEditModal form {
  margin: 0;
  padding: 12px 18px 16px;
}
#kintaiManualModal form {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.kintai-modal-header{
  padding:12px 18px 0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.kintai-modal-body{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.kintai-summary{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:12px;
  padding:10px 14px;
}
.kintai-summary__item{
  flex:1 1 160px;
  min-width:160px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.kintai-summary__label{
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#475569;
  font-weight:700;
}
.kintai-summary__value{
  font-size:15px;
  font-weight:700;
  color:#0f172a;
  line-height:1.25;
}
.kintai-manual-scroll{
  padding:12px 18px 16px;
  max-height:min(62vh, 520px);
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.kintai-manual-scroll::-webkit-scrollbar{
  width:6px;
}
.kintai-manual-scroll::-webkit-scrollbar-thumb{
  background:rgba(148,163,184,.45);
  border-radius:999px;
}
.kintai-manual-fields{
  display:flex;
  flex-direction:column;
}
.kintai-manual-fields > .form-grid{
  margin:0;
  border-radius:12px;
}
.kintai-modal-actions,
.kintai-manual-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:10px;
}
.kintai-modal-actions .btn,
.kintai-manual-actions .btn{
  min-width:120px;
  height:38px;
  border-radius:10px;
  font-weight:700;
}
.kintai-modal-actions .btn.is-ghost,
.kintai-manual-actions .btn.is-ghost{
  border:1px solid #d1d5db;
  background:#fff;
  color:#1f2937;
}

/* グリッド版フォームレイアウト */
#kintaiEditModal .form-grid,
#kintaiManualModal .form-grid{
  border:1px solid #e2e8f0;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
  margin-top:8px;
  width:100%;
}
#kintaiEditModal .form-row,
#kintaiManualModal .form-row{
  display:grid;
  grid-template-columns: minmax(140px,220px) 1fr;
  column-gap:12px;
  align-items:center;
  padding:9px 12px;
  border-bottom:1px solid #e2e8f0;
  background:#fff;
}
#kintaiEditModal .form-row:last-child,
#kintaiManualModal .form-row:last-child{ border-bottom:none; }
#kintaiEditModal .form-label,
#kintaiManualModal .form-label{
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  background:#f8fafc;
  padding:8px 10px;
  border-right:1px solid #e2e8f0;
}
/* テーブル基本（グローバルtable.cssより優先させる） */
#kintaiEditModal table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 0;
  table-layout: auto;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  overflow: hidden;
  display: table;
}
#kintaiEditModal tr { display: table-row; }
#kintaiEditModal th, #kintaiEditModal td { display: table-cell; vertical-align: middle; }
#kintaiEditModal th {
  min-width: 120px; max-width: 220px;
  text-align: left;
  padding: 8px 10px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#kintaiEditModal td {
  padding: 8px 10px;
  border-bottom: 1px solid #e2e8f0;
  background: #fff;
}
#kintaiEditModal tr:last-child th,
#kintaiEditModal tr:last-child td { border-bottom: none; }

/* 入力コントロール */
#kintaiEditModal input,
#kintaiEditModal select,
#kintaiEditModal textarea,
#kintaiManualModal input,
#kintaiManualModal select,
#kintaiManualModal textarea {
  width: 100%; box-sizing: border-box;
  padding: 6px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  font-size: 13px; line-height: 1.4; background: #fff;
}
#kintaiEditModal select,
#kintaiManualModal select { height: 36px; }
#kintaiEditModal input[type="time"],
#kintaiEditModal input[type="number"],
#kintaiManualModal input[type="time"],
#kintaiManualModal input[type="number"] { min-width: var(--w-140); max-width: 260px; }
#kintaiEditModal textarea,
#kintaiManualModal textarea { resize: vertical; min-height: 60px; }
#kintaiEditModal .field-inline,
#kintaiManualModal .field-inline { display: flex; gap: 8px; align-items: center; }
#kintaiEditModal .field-inline > *,
#kintaiManualModal .field-inline > * { flex: 1 1 auto; }

#kintaiEditJikyuRow,
#kintaiEditJikyu2Row,
#kintaiEditKyuyoRow,
#kintaiEditMakanaiRow,
#kintaiManualJikyuRow,
#kintaiManualJikyu2Row,
#kintaiManualMakanaiRow { display: none; }

.kintai-modal-message {
  margin: 4px 0;
  min-height: 1.2em;
  color: #d94841;
  font-weight: bold;
}

@media (max-width: 640px) {
  #kintaiEditModal .form-row,
  #kintaiManualModal .form-row {
    grid-template-columns: 42% 1fr;
    padding: 10px;
  }
}

#kintaiManualModal.is-step-search .kintai-modal-header,
#kintaiManualModal.is-step-search #kintaiManualMessage,
#kintaiManualModal.is-step-search form { display:none; }
#kintaiManualModal.is-step-form .manual-search-block { display: none; }
.manual-search__back {
  display: none;
  align-self: flex-start;
  margin-left: auto;
  height: 32px;
  padding: 0 14px;
  font-weight: 700;
  border-radius: 8px;
}
#kintaiManualModal.is-step-form .manual-search__back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.manual-search-block {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 10px;
}
.manual-search__controls {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}
.manual-search__input {
  flex: 1 1 260px;
}
.manual-search__input input {
  width: 100%;
  height: 36px;
  padding: 0 12px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  font-size: 13px;
}
.manual-search__input input:focus {
  outline: none;
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96,165,250,0.25);
}
.manual-search__store select {
  min-width: 160px;
  height: 36px;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  padding: 0 10px;
  font-size: 13px;
}
.manual-search__buttons .btn {
  height: 36px;
  font-weight: 700;
  padding: 0 16px;
}
.manual-search__hint {
  margin: 0;
  font-size: 12px;
  color: #64748b;
}
.manual-search__results {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 220px;
  overflow-y: auto;
  padding-right: 4px;
}
.manual-search__results::-webkit-scrollbar {
  width: 8px;
}
.manual-search__results::-webkit-scrollbar-thumb {
  background: rgba(100,116,139,0.4);
  border-radius: 999px;
}
.manual-search__empty {
  margin: 0;
  padding: 12px;
  font-size: 13px;
  color: #64748b;
  background: #f8fafc;
  border: 1px dashed #cbd5f5;
  border-radius: 10px;
  text-align: center;
}
.manual-search-result {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 12px;
  border: 1px solid #dbeafe;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.manual-search-result:hover {
  border-color: #60a5fa;
  box-shadow: 0 8px 16px rgba(96,165,250,0.15);
  transform: translateY(-1px);
}
.manual-search-result.is-selected {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37,99,235,0.25);
}
.manual-search-result__name {
  font-weight: 700;
  color: #0f172a;
  font-size: 14px;
}
.manual-search-result__meta,
.manual-search-result__sub,
.manual-search-result__code {
  font-size: 12px;
  color: #475569;
}
.login-card .logo-box {
  position: absolute;
  top: 12px;
  right: 16px;
}
.login-card .logo-box img {
  height: 36px; /* 大きさは調整可能 */
}

body.layout-center {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;       /* 画面高いっぱいで上下中央 */
}
@media (max-width: 768px) {
  body.layout-center { justify-content: flex-start; } /* モバイルは上揃え */
  .landing-grid { margin-top: 24px; }
}

/* =========================================================
   Gyoseki: Sort Modal
   並び替えモーダルのUIを限定スコープで定義（干渉防止）
   ========================================================= */
#sortModal .reorder-list li { display:flex; align-items:center; gap:8px; padding:6px 8px; border-bottom:1px solid #f3f4f6; }
#sortModal .reorder-list li:last-child { border-bottom:none; }
#sortModal .reorder-list li.selected { background:#f9fafb; }
#sortModal .reorder-list .label { flex:1; font-weight:700; }
#sortModal .reorder-list input[type="checkbox"]{ accent-color: var(--primary); width:14px; height:14px; }
#sortModal .btn.is-ghost { border:1px solid #e5e7eb; padding:2px 8px; border-radius:6px; background:#fff; color:#111827; height:24px; }
#sortModal .btn.is-ghost:disabled { opacity:.5; }
#sortModal .preset-chip { display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 12px; border:1px solid #e5e7eb; border-radius:999px; background:#fff; color:#111827; font-weight:700; cursor:pointer; }
#sortModal .preset-chip.active { background:var(--primary); color:#fff; border-color:var(--primary); }
#sortModal .preset-chip.disabled { background:#f3f4f6; color:#9ca3af; border-color:#e5e7eb; cursor:default; pointer-events:none; }
/* メモリー保存完了時のワンショット強調 */
#sortModal .preset-chip.saved-pulse { animation: chip-pulse 650ms ease-out; will-change: transform; }
@keyframes chip-pulse { 0%{ transform:scale(1); box-shadow:0 0 0 rgba(0,0,0,0); } 40%{ transform:scale(1.08); box-shadow:0 6px 16px rgba(0,0,0,.12); } 100%{ transform:scale(1); box-shadow:0 0 0 rgba(0,0,0,0); } }
#sortModal .reorder-list input[type="checkbox"]:checked + .label{ color: var(--primary); font-weight:800; }
#sortModal .reorder-list li.active{ background:#dbeafe; border:1px solid #93c5fd; border-radius:var(--radius-8); box-shadow: inset 0 0 0 2px #3b82f6; }
#sortModal .reorder-list li.active .label{ color:#1e3a8a; font-weight:800; }
/* 右ペイン内に置くプリセットバー */
#sortModal .preset-bar { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 8px; }

/* 上部プリセットカード（2段）を整える */
#sortModal .preset-wrap {
  border:1px solid #e5e7eb; border-radius:var(--radius-12); background:#fff;
  padding:8px 10px; margin:0 0 8px;
}
#sortModal .preset-wrap .preset-bar { justify-content:center; align-items:center; gap:8px; margin:0; }
#sortModal .preset-wrap .preset-row1 { margin-bottom:6px; }
#sortModal .preset-wrap .preset-chip { height:28px; padding:0 10px; font-size:.9rem; }
#sortModal .preset-wrap .preset-chip.active { background:var(--primary); color:#fff; border-color:var(--primary); }
#sortModal .preset-wrap + .sort-list-card { margin-top: 0; }
#sortModal .preset-bar .preset-break { flex-basis:100%; height:0; margin:0; padding:0; display:block; }

/* 上下余白のみを調整（左右は維持） */
#sortModal .sort-list-card { padding: 4px 10px; }
#sortModal .modal-body { padding: 6px 12px; }
/* 並び替えモーダルのフッターボタン整形（JSなしで中央寄せ＋非折返し） */
#sortModal .modal-footer .btn { justify-content: center; white-space: nowrap; overflow: hidden; }
#sortModal #btnResetDefaults { font-size: .9rem; }

/* （削除）NEWバッジ用スタイルは撤去 */
#sortModal .sort-list-card { -webkit-user-select: none; user-select: none; }
#sortModal .sort-list-card { overflow:hidden; }

/* Gridレイアウトで左右ペインを安定配置（inlineのdisplay:flexを上書き） */
#sortModal .sort-panes, #sortModal .sort-list-card > div {
  display: grid;
  grid-template-columns: 1fr 1fr; /* 左右同幅 */
  column-gap: 16px;
  align-items: start;
  justify-content: stretch;
}
/* 右ペイン固定幅を解除し、左右同幅に */
#sortModal .sort-panes .pane:last-child, #sortModal .sort-list-card > div .pane:last-child { width: auto; }
#sortModal .sort-panes .pane, #sortModal .sort-list-card > div .pane { min-height:0; }
#sortModal .sort-list-card .reorder-list { margin: 0; }
#sortModal .reorder-list li:empty { display:none; }
#sortModal #th1List::before,
#sortModal #th1List::after,
#sortModal #th2List::before,
#sortModal #th2List::after { content:none !important; display:none !important; }

/* チェックボックス周りのズレを抑制（行高さ・選択ハイライト・余白） */
#sortModal .reorder-list { user-select: none; }
/* さらにコンパクトに（ネイティブチェックボックスのみ縮小） */
#sortModal .reorder-list li{ display:flex; align-items:center; gap:6px; padding:4px 8px; line-height:1.3; }
#sortModal .reorder-list input[type="checkbox"]{
  -webkit-appearance: checkbox; appearance: auto;
  margin: 0 6px 0 0; vertical-align: middle; display:inline-block;
  width:11px; height:11px; position: static;
  transform: translateY(-1px); /* ベースライン微調整 */
  accent-color: var(--primary);
}
#sortModal .reorder-list .label{ display:inline-block; vertical-align: middle; line-height:1.3; }

/* 左ペイン(#th1List)だけをさらにタイトに */
#sortModal #th1List li { padding-top: 1px; padding-bottom: 1px; min-height: 20px; }
#sortModal #th1List input[type="checkbox"] { width: 10px; height: 10px; transform: translateY(-1px); }

/* (reverted) Keep default flex layout for list panes */

/* =========================================================
   Timecard: Unified Action Buttons
   画面内のアクションボタンをクラスベースで統一（!important 非依存）
   ========================================================= */

#tc-stage .tc-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 110px;
  min-width: 240px;
  padding: 0 40px;
  font-size: 2.2rem;
  line-height: 1;
  border-radius: 12px;
  border: 1px solid #d1d5db;
  box-shadow: none;
}

#tc-stage .tc-action--neutral {
  background: #e5e7eb;
  color: #111827;
  border-color: #d1d5db;
}

#tc-stage .tc-action--neutral:hover {
  background: #d1d5db;
  border-color: #cbd5e1;
}

#tc-stage .tc-action--primary {
  background: #10b981;
  color: #fff;
  border-color: #10b981;
}

#tc-stage .tc-action--primary:hover {
  background: #0f9a6a;
  border-color: #0f9a6a;
}

#tc-stage .tc-action--danger {
  background: #ef4444;
  color: #fff;
  border-color: #ef4444;
}

#tc-stage .tc-action--danger:hover {
  background: #dc2626;
  border-color: #dc2626;
}

#tc-stage .tc-action:disabled {
  background: #e5e7eb;
  color: #9ca3af;
  border-color: #d1d5db;
}

/* 配置のセンタリング補助 */
#tc-stage .form-actions,
#tc-stage #syukkinBotton,
#tc-stage .actions-row,
#tc-stage .checkin-actions {
  gap: 18px;
}

/* Back の重複排除: デフォルト非表示 → 指定箇所のみ表示 */
#tc-stage button[name="back"] { display: none; }
#tc-stage .form-actions button[name="back"],
#tc-stage button.keep-back { display: inline-flex; }

/* 複数テーブル対応へ向けたクラス版（.schedule-table） */
.schedule-table { width: auto; border-collapse: collapse; table-layout: fixed; margin: 10px 0; background: #fff; }
.schedule-table th, .schedule-table td { padding: 6px 8px; border: 1px solid #e2e8f0; text-align: center; }
.schedule-table th { background: #f5f7fa; font-weight: 600; position: sticky; top:0; z-index:5; white-space: nowrap; }
.schedule-table tr:nth-child(odd) { background: #fafbfd; }
.schedule-table tr:hover { background: #f0f6ff; }
.schedule-table td:first-child, .schedule-table th:first-child { position: sticky; left: 0; z-index: 6; background: #fff; }
.schedule-table th:first-child { background: #f5f7fa; z-index:7; }
.schedule-table td:first-child { background: #fff; text-align:left; }
.schedule-table td:first-child::after, .schedule-table th:first-child::after { content: ""; position: absolute; top:0; right:-1px; width:1px; height:100%; background:#e5e7eb; }
.schedule-table th:first-child, .schedule-table td:first-child { width: 200px; min-width: 200px; max-width: 200px; white-space: normal; line-height: 1.25; }
.schedule-table th:not(:first-child), .schedule-table td:not(:first-child) { width: 120px; min-width: 120px; max-width: 120px; }
.schedule-table td { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.35; font-size: 13.5px; }
.schedule-table td.shift-cell { font-variant-numeric: tabular-nums; }

/* セル編集状態の表示 */
.shift-cell.editing { outline: 2px solid var(--primary); background: #fff; }
/* 確定/未確定の視覚区別（viewschedule: 全て表示モード時のみ強調） */
body[data-confirm-mode="0"] .shift-cell.is-confirmed { background:#f3f4f6; color:#6b7280; cursor:not-allowed; }
body[data-confirm-mode="0"] .shift-cell.is-editable  { background:#ffffff; cursor:pointer; }
#shiftEditModal .seg-list { display:flex; flex-direction:column; gap:10px; }
#shiftEditModal .seg-row { display:flex; align-items:center; gap:10px; justify-content:flex-start; padding:8px 10px; border:1px solid #e5e7eb; border-radius:var(--radius-10); background:#f9fafb; }
#shiftEditModal .seg-row input[type="time"] { height:38px; padding:0 10px; border:1px solid #e5e7eb; border-radius:var(--radius-8); background:#fff; font-weight:700; }
#shiftEditModal .seg-row .seg-del { height:32px; padding:0 12px; border-radius:9999px; background:#fff; border:1px solid #e5e7eb; }
#shiftEditModal .seg-row .time-field {
  width:110px;
  height:42px;
  padding:0 14px;
  border:1px solid #d1d5db;
  border-radius:var(--radius-12);
  background:#fff;
  font-weight:700;
  font-size:1.05rem;
  text-align:center;
  color:#111827;
  box-shadow:0 1px 2px rgba(15,23,42,.05);
  transition:border-color .15s ease, box-shadow .15s ease;
}
#shiftEditModal .seg-row .time-field-wrap {
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:100%;
}
#shiftEditModal .seg-row .ui-timepicker-trigger {
  flex:0 0 32px;
  height:32px;
  width:32px;
  min-width:32px;
  padding:0;
  border-radius:8px;
  border:1px solid #d1d5db;
  background:#fff;
  color:#6b7280;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 1px 2px rgba(15,23,42,0.06);
}
#shiftEditModal .seg-row .ui-timepicker-trigger:hover {
  background:#f3f4f6;
}
#shiftEditModal .seg-row .ui-timepicker-trigger .ui-button-text {
  padding:0;
}
#shiftEditModal .seg-row .time-field:focus {
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(57,143,61,.15);
  outline:none;
}
#shiftEditModal .seg-row span {
  font-weight:700;
  color:#6b7280;
  font-size:1.15rem;
}
#shiftEditModal .seg-row .seg-del {
  height:38px;
  padding:0 16px;
  border-radius:9999px;
  font-weight:700;
  color:#b91c1c;
  border-color:#fecaca;
  background:#fff5f5;
}
#shiftEditModal .seg-row .seg-del:hover {
  background:#fee2e2;
  border-color:#fca5a5;
}
#shiftEditModal .seg-row .seg-del:focus {
  outline:none;
  box-shadow:0 0 0 3px rgba(248,113,113,.25);
}
#shiftEditModal .seg-row + .seg-row { margin-top:8px; }
#shiftEditModal .seg-row .time-field::placeholder { color:#9ca3af; font-weight:600; }
.ui-timepicker-div.viewschedule-timepicker {
  font-size:0.95rem;
  border-radius:var(--radius-12);
  box-shadow:var(--shadow-sm);
  border:1px solid #e5e7eb;
  background:#fff;
  padding:12px 16px;
  min-width:0;
}
.ui-timepicker-div.viewschedule-timepicker dl {
  display:flex;
  align-items:center;
  gap:10px;
  margin:0;
}
.ui-timepicker-div.viewschedule-timepicker dl > dt {
  display:none;
}
.ui-timepicker-div.viewschedule-timepicker select {
  font-weight:600;
  color:#111827;
  padding:6px 10px;
  border:1px solid #d1d5db;
  border-radius:var(--radius-8);
  background:#fff;
  min-width:72px;
}
.ui-timepicker-div.viewschedule-timepicker .ui-widget-header,
.ui-timepicker-div.viewschedule-timepicker .ui-timepicker-title,
.ui-timepicker-div.viewschedule-timepicker .ui_tpicker_time_label {
  display:none;
}
.ui-timepicker-div.viewschedule-timepicker .ui-timepicker-div-buttonset {
  margin-top:8px;
  display:flex;
  justify-content:flex-end;
  gap:6px;
}
.ui-timepicker-div.viewschedule-timepicker .ui-timepicker-buttonpane button {
  padding:5px 10px;
  font-weight:600;
  border-radius:var(--radius-8);
}
.simple-timepicker-list {
  list-style:none;
  margin:0;
  padding:6px 4px;
  max-height:240px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:center;
}
.simple-timepicker-item {
  width:120px;
  padding:8px 0;
  border-radius:var(--radius-10);
  font-weight:600;
  color:#111827;
  background:#f3f4f6;
  cursor:pointer;
  transition:background-color .18s ease, color .18s ease, transform .18s ease;
  text-align:center;
  box-shadow:0 1px 2px rgba(15,23,42,0.06);
}
.simple-timepicker-item:hover,
.simple-timepicker-item.active {
  background:var(--primary);
  color:#fff;
  transform:translateY(-1px);
}
#shiftEditModal #shiftMeta { font-weight:700; }
#btnAddSeg.btn { height:36px; }

/* Picker overlays: reset z-index adjustments (will rely on plugin defaults) */
.picker-open .table-wrap { overflow: visible !important; }
.picker-open .container,
.picker-open .card {
  overflow: visible !important;
  transform: none !important;
}
.dialog-open .table-wrap,
.dialog-open .container,
.dialog-open .card {
  overflow: visible !important;
  transform: none !important;
}
.ui-widget-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.32);
  z-index: var(--z-overlay) !important;
}
/* TODO: 2025-12 legacy個別調整を整理し `.ui-dialog` 共通スキンへ統合 */
.ui-dialog {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.22);
}
.ui-dialog .ui-dialog-titlebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  background: #f8fafc;
  border: 0;
}
.ui-dialog .ui-dialog-titlebar .ui-dialog-title {
  font-size: 1rem;
  font-weight: 800;
  color: #0f172a;
}
.ui-dialog .ui-dialog-titlebar-close {
  border: 1px solid #d1d5db;
  background: #fff;
  border-radius: 8px;
  padding: 4px 6px;
}
.ui-dialog .ui-dialog-content {
  padding: 12px 18px;
  background: #fff;
}
.ui-dialog .ui-dialog-buttonpane {
  box-sizing: border-box;
  width: 100%;
  margin: 0 !important;
  padding: 8px 18px !important;
  border-top: 1px solid #e2e8f0;
  background: #fff;
  background-image: none !important;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
  float: none;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.ui-dialog,
.ui-dialog.ui-front {
  z-index: var(--z-dialog) !important;
}
.flatpickr-calendar,
.ui-datepicker,
.ui-timepicker-div,
.ui-timepicker-container,
.xdsoft_datetimepicker {
  z-index: var(--z-popup) !important;
}

.ui-dialog,
.ui-dialog .ui-dialog-content {
  overflow: visible !important;
}

/* torihiki: gyoseki_unified 風フラットテーブル */
.torihiki-ichiran table.torihiki-table-base {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed; /* セル幅を極力均一化 */
  font-size: 12.5px;
  font-variant-numeric: tabular-nums;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: var(--card);
  box-shadow: var(--shadow);
}
.torihiki-ichiran table.torihiki-table-base th,
.torihiki-ichiran table.torihiki-table-base td { border-left: 1px solid #e5e7eb; }
.torihiki-ichiran table.torihiki-table-base th:last-child,
.torihiki-ichiran table.torihiki-table-base td:last-child { border-right: 1px solid #e5e7eb; }
.torihiki-ichiran table.torihiki-table-base th {
  padding: 6px 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  background: #111827;
  color: #fff;
  min-width: 88px;
  vertical-align: middle;
}
.torihiki-ichiran table.torihiki-table-base td {
  padding: 4px 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  min-width: 88px;
  vertical-align: middle;
}
.torihiki-ichiran table.torihiki-table-base td:first-child { text-align: left; font-weight: 700; }
.torihiki-ichiran table.torihiki-table-base td.cell-memo { text-align: left; }
.torihiki-ichiran table.torihiki-table-base td.cell-tekikaku { text-align: right; }
.torihiki-ichiran table.torihiki-table-base td.cell-memo input { text-align: left; }
.torihiki-ichiran table.torihiki-table-base td.cell-tekikaku input { text-align: right; border-radius:0; }
.torihiki-ichiran select.is-readonly { pointer-events:none; background:#f9fafb; color:#6b7280; border-color:#e5e7eb; }
/* メモ列を広めに確保 */
.torihiki-ichiran table.torihiki-table-base th.col-memo { width: 180px; min-width: 180px; }

/* 入力行を視覚的に強調（モダンブラウザ向け） */


/* テーブル内ボタンの統一デザイン */
.torihiki-ichiran table.torihiki-table-base button {
  appearance: none;
  border: 1px solid #d1d5db;
  background: #fff;
  color: #111827;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 36px;
  padding: 0 12px;
  line-height: 1;
  border-radius: 10px; /* 四角 + 角丸 */
  font-weight: 800;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.torihiki-ichiran table.torihiki-table-base button:hover {
  background: #f3f4f6;
  border-color: #cbd5e1;
}
.torihiki-ichiran table.torihiki-table-base button:disabled {
  opacity: .55;
  cursor: not-allowed;
}
/* 役割別の配色 */
.torihiki-ichiran table.torihiki-table-base button[name="add_torihiki"] {
  background: #16a34a;
  border-color: #16a34a;
  color: #fff;
}
.torihiki-ichiran table.torihiki-table-base button[name="add_torihiki"]:hover {
  background: #15803d;
  border-color: #15803d;
}
.torihiki-ichiran table.torihiki-table-base button[type="button"] { /* 一覧の修正ボタン */
  background: var(--info);
  border-color: var(--info);
  color: #fff;
}
.torihiki-ichiran table.torihiki-table-base button[type="button"]:hover {
  background: var(--info-hover);
  border-color: var(--info-hover);
}
.torihiki-ichiran table.torihiki-table-base td:last-child { text-align: center; }
.torihiki-ichiran button[name="edit_torihiki"] { /* 編集ダイアログ下の修正ボタン */
  background: var(--info);
  border-color: var(--info);
  color: #fff;
}
.torihiki-ichiran button[name="edit_torihiki"]:hover {
  background: var(--info-hover);
  border-color: var(--info-hover);
}
.torihiki-ichiran button[name="delete_torihiki"] {
  background: #ef4444;
  border-color: #ef4444;
  color: #fff;
}
.torihiki-ichiran button[name="delete_torihiki"]:hover {
  background: #dc2626;
  border-color: #dc2626;
}

/* 入力系（gyoseki_unified 相当） */
.torihiki-ichiran table.torihiki-table-base input[type="text"],
.torihiki-ichiran table.torihiki-table-base input[type="number"],
.torihiki-ichiran table.torihiki-table-base input[type="time"],
.torihiki-ichiran table.torihiki-table-base input[type="date"],
.torihiki-ichiran table.torihiki-table-base select,
.torihiki-ichiran table.torihiki-table-base textarea {
  width: 100%;
  height: 20px;            /* 行高30pxに収まるよう更に圧縮 */
  padding: 0 4px;          /* 余白をさらに圧縮 */
  margin: 0;               /* 余計な外側余白を削減 */
  border: 0;               /* セル内入力は枠線なし */
  border-radius: 0;
  background: transparent; /* 背景なじませ */
  color: inherit;
  font: inherit;
  box-sizing: border-box;
  outline: none;
}
.torihiki-ichiran table.torihiki-table-base input[type="number"] {
  border: 0;
  background: transparent;
  text-align: right;
  padding-right: 0;
}


/* ---------------------------------
   #tablefix: サイズのみ（完全フラット）
   --------------------------------- */
table#tablefix {
  width: 100%;
  font-size: 12.5px;
  font-variant-numeric: tabular-nums;
  border-collapse: separate;
  border-spacing: 0;
  /* auto レイアウト（直前版へロールバック） */
}
/* ヘッダー: 濃いブルー */
table#tablefix th {
  background:#0e3da5;
  color:#fff;
  /* 太字指定は排除（kpi クラスのみ太字） */
  font-weight: 400;
  text-align:center;
  padding:8px 10px;
  min-width: 88px;
  white-space:nowrap;
  border-top:1px solid #0e3da5;
  border-bottom:1px solid #0e3da5;
  border-left:1px solid #0e3da5;
}
table#tablefix th:last-child { border-right:1px solid #0e3da5; }
/* セル: 薄いブルー罫線 + ゼブラ */
table#tablefix td {
  padding:8px 10px;
  min-width: 88px; /* セル最小幅をやや広めに */
  white-space:nowrap;
  text-align:right; /* 数値は右寄せ */
  border-bottom:1px solid #84b2e0;
  border-left:1px solid #84b2e0;
  background:#fff;
}
table#tablefix td:last-child { border-right:1px solid #84b2e0; }
table#tablefix td:first-child { text-align:left; font-weight:800; }
table#tablefix tbody tr:nth-child(2n) td { background:#f1f6fc; }
table#tablefix tbody tr:hover td { background:#bbd4ee; }
/* 角丸: 最終行の左右端 */
#tablefix td:first-child { border-radius:0 !important; }
#tablefix tbody tr:last-child td:first-child { border-bottom-left-radius:12px !important; }
#tablefix tbody tr:last-child td:last-child  { border-bottom-right-radius:12px !important; }

/* 強調カラム（class 指定のみ） */
#tablefix td.kpi, #tablefix th.kpi {
  font-weight:800;
  font-size: 1.06rem;
}

/* レイアウト切替（非通信）: グループ非表示ルール */
#tablefix.hide-u     [data-colgroup="u"]:not([data-min="1"]),
#tablefix.hide-fl    [data-colgroup="fl"]:not([data-min="1"]),
#tablefix.hide-genka [data-colgroup="genka"]:not([data-min="1"]),
#tablefix.hide-etc   [data-colgroup="etc"]:not([data-min="1"]),
#tablefix.hide-profit[data-colgroup="profit"]:not([data-min="1"]) { display:none !important; }

/* help リンクの下線を無効化（ツールチップ用） */
#tablefix a.help,
#tablefix a.help:visited,
#tablefix a.help:hover,
#tablefix a.help:active {
  text-decoration: none;
  color: inherit;
  border: none;
}

/* ---------- Header color coding (Google-like palette) ---------- */
/* 売上管理 */
#tablefix th.th-u { background:#1e40af !important; border-color:#1e40af !important; color:#fff !important; }
/* FL比率 + 人件費 */
#tablefix th.th-fl { background:#16a34a !important; border-color:#16a34a !important; color:#fff !important; }
/* 原価 */
#tablefix th.th-genka { background:#e6dfcf !important; border-color:#e6dfcf !important; color:#111827 !important; }
/* その他コスト */
#tablefix th.th-etc { background:#e2e8f0 !important; border-color:#e2e8f0 !important; color:#111827 !important; }
/* 利益 */
#tablefix th.th-profit { background:#0f172a !important; border-color:#0f172a !important; color:#fff !important; }

/* Sticky header (JSでtopを実測設定) */
#tablefix thead th { position: sticky; top: 0; z-index: 3; }

/* Sticky first column: 店舗名（theadは .sticky-first のみ） */
#tablefix td:first-child,
#tablefix thead th.sticky-first { position: sticky; left: 0; z-index: 6; }
#tablefix thead th.sticky-first { z-index: 8; }
#tablefix td:first-child { box-shadow: 3px 0 0 rgba(0,0,0,0.06); }
/* ゼブラ背景と揃える（先頭列） */
#tablefix tbody tr:nth-child(odd)  td:first-child { background:#fff; }
#tablefix tbody tr:nth-child(even) td:first-child { background:#f1f6fc; }

/* トグルボタン（一覧上部の切替）: menu.php のナビと調和 */
.btn-toggle {
  display:inline-flex; align-items:center; justify-content:center;
  padding:8px 12px; border-radius:var(--radius-12); border:1px solid #e5e7eb;
  background:#fff; color:#111827; font-weight:700; cursor:pointer;
  transition: background-color .15s ease, border-color .15s ease;
  margin: 0 6px 8px 0;
}
.btn-toggle:hover { background:#f3f4f6; border-color:#d1d5db; }
.btn-toggle.is-active { background:#111827; color:#fff; border-color:#111827; }

/* =====================================
   Data Table: sticky header + first col
   ===================================== */
.table-scroll {
  width: 100%;
  margin: 10px auto 16px;
  border:1px solid #e5e7eb;
  border-radius:var(--radius-12);
  background:var(--card);
  box-shadow:var(--shadow);
  overflow:auto;
  padding-bottom:16px; /* 最下段が隠れないように */
  max-height: calc(100svh - 220px);
}

/* =====================================
   Nippou tables (gyoseki/nippou/gyoseki.php)
   gyoseki_unified のテーブル調に整形（単純1段ヘッダー想定）
   ===================================== */
.gyoseki-nippou table {
  width: 100%;
  max-width: 1440px; /* ヘッダー(.container)幅を上限に */
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12.5px;
  font-variant-numeric: tabular-nums;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: var(--card);
  box-shadow: var(--shadow);
  margin: 12px auto 16px; /* 中央寄せ */
}
.gyoseki-nippou #torihikitable {
  width: 100%;
  max-width: 1440px;
  margin: 12px auto 16px;
}
.gyoseki-nippou #torihikitable table {
  width: 100%;
  margin: 0;
}
.gyoseki-nippou caption {
  text-align: left;
  padding: 8px 10px;
  color: var(--muted);
  font-weight: 700;
}
.gyoseki-nippou th,
.gyoseki-nippou td {
  border-left: 1px solid #e5e7eb;
}
.gyoseki-nippou th:last-child,
.gyoseki-nippou td:last-child { border-right: 1px solid #e5e7eb; }
.gyoseki-nippou th {
  padding: 8px 10px;
  white-space: nowrap;
  text-align: center;
  background: #111827;
  color: #fff;
}
.gyoseki-nippou td {
  padding: 7px 10px;
  white-space: nowrap;
  text-align: right;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
}
.gyoseki-nippou tbody tr:nth-child(even) td { background: #f9fafb; }
.gyoseki-nippou tbody tr:hover td { background: #eef2ff; }
.gyoseki-nippou td:first-child { text-align: left; font-weight: 700; }
.gyoseki-nippou tbody tr:last-child td:first-child { border-bottom-left-radius: 12px; }
.gyoseki-nippou tbody tr:last-child td:last-child  { border-bottom-right-radius: 12px; }

/* 入力フィールドの高さ/幅を統一 */
.gyoseki-nippou table input[type="text"],
.gyoseki-nippou table input[type="number"],
.gyoseki-nippou table input[type="time"],
.gyoseki-nippou table input[type="date"],
.gyoseki-nippou table select,
.gyoseki-nippou table textarea {
  width: 100%;
  height: 28px;
  padding: 4px 8px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  background: #fff;
  color: inherit;
  font: inherit;
  box-sizing: border-box;
}
.gyoseki-nippou table input[type="number"] {
  border: none; /* 数値は外枠なし */
  background: transparent;
  text-align: right;
  padding-right: 0;
}
.gyoseki-nippou table input[type="number"][disabled],
.gyoseki-nippou table input[type="number"][readonly] {
  background: transparent;
  color: #6b7280;
}
.gyoseki-nippou table textarea { height: auto; min-height: 72px; }

/* コメントエリア */
.gyoseki-nippou .comment-area {
  width: 1440px;
  margin: 16px auto;
  padding: 16px 18px; /* .card にもpaddingあるが念のため指定 */
}
.gyoseki-nippou .comment-area .field {
  font-size: 14px;
  line-height: 1.5;
}


/* Debug table styling (#table-debug) */
table#table-debug {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12.5px;
  font-variant-numeric: tabular-nums;
}
/* Sticky header (3段) 用の高さ変数。JS実測で上書き可能 */
table#table-debug { --h1: 32px; --h2: 32px; --h3: 32px; }
/* thead を段ごとに sticky。背景色は各行/グループ指定を優先 */
table#table-debug thead th { position: sticky; z-index: 50; }
table#table-debug thead tr:nth-child(1) th { top: 0; }
table#table-debug thead tr:nth-child(2) th { top: var(--h1); }
table#table-debug thead tr:nth-child(3) th { top: calc(var(--h1) + var(--h2)); }
/* 長い th2/th3 は折り返し */
table#table-debug thead tr:nth-child(2) th,
table#table-debug thead tr:nth-child(3) th {
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.2;
}
table#table-debug thead tr:nth-child(1) th { background:#111827; color:#fff; border-color:#111827; }
table#table-debug thead tr:nth-child(2) th { background:#374151; color:#f9fafb; border-color:#374151; }
table#table-debug thead tr:nth-child(3) th { background:#9ca3af; color:#111827; border-color:#9ca3af; }
table#table-debug th {
  padding:8px 10px; min-width:84px; white-space:nowrap; text-align:center;
  border-top:1px solid #e5e7eb; border-left:1px solid #e5e7eb;
}
/* ヘッダーは太字・大きめを使わず、全段で同一サイズ/太さ */
table#table-debug thead th { font-weight: 400; font-size: 12.5px; }
table#table-debug th:last-child { border-right:1px solid #e5e7eb; }
table#table-debug td {
  padding:7px 10px; min-width:84px; white-space:nowrap; text-align:right;
  border-bottom:1px solid #e5e7eb; border-left:1px solid #e5e7eb; background:#fff;
}
table#table-debug td:first-child { text-align:left; font-weight:700; }
table#table-debug td:last-child { border-right:1px solid #e5e7eb; }
table#table-debug tbody tr:nth-child(even) td { background:#f9fafb; }
table#table-debug tbody tr:hover td { background:#eef2ff; }
table#table-debug tbody tr:last-child td:first-child { border-bottom-left-radius:12px; }
table#table-debug tbody tr:last-child td:last-child  { border-bottom-right-radius:12px; }
/* Total row emphasis */
table#table-debug tr.total-row td { background:#fff7cc; font-weight:800; }
table#tablefix tr.total-row td { background:#fff7cc; font-weight:800; }
table#table-debug tr.calc-summary-row td { color:#111827; }

/* Gyoseki unified: data-table readability tweaks */
.gyoseki-table-shell table#table-debug { font-size: 14px; }
.gyoseki-table-shell table#table-debug td { font-size: 14px; }
.gyoseki-table-shell table#table-debug thead th {
  padding: 4px 8px;
  line-height: 1.1;
}
.gyoseki-table-shell table#table-debug thead tr:nth-child(1) th {
  font-size: 15px !important;
}
.gyoseki-table-shell table#table-debug thead tr:nth-child(2) th,
.gyoseki-table-shell table#table-debug thead tr:nth-child(3) th {
  font-size: 14px !important;
}
.gyoseki-table-shell table#table-debug thead tr:nth-child(2) th.th-etc,
.gyoseki-table-shell table#table-debug thead tr:nth-child(3) th.th-etc {
  min-width: 140px;
}
.gyoseki-table-shell table#table-debug thead tr:nth-child(1) th.th-u,
.gyoseki-table-shell table#table-debug thead tr:nth-child(2) th.th-u,
.gyoseki-table-shell table#table-debug thead tr:nth-child(3) th.th-u {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  overflow: visible !important;
  width: 0;
  min-width: 0;
  max-width: 0;
  padding-left: 6px;
  padding-right: 6px;
}
.gyoseki-table-shell table#table-debug th.th-wide,
.gyoseki-table-shell table#table-debug td.td-wide {
  min-width: 220px;
  white-space: nowrap;
  overflow: visible;
}
.gyoseki-table-shell table#table-debug thead tr:nth-child(1) th.th-genka,
.gyoseki-table-shell table#table-debug thead tr:nth-child(2) th.th-genka {
  white-space: nowrap !important;
  overflow: visible !important;
  max-width: none;
}

/* Kintai log table */
.kintai-log-wrap {
  margin:20px auto 28px;
  padding:0;
  max-height:calc(100vh - 260px);
  overflow:auto;
  background:#fff;
  border:1px solid #dbeafe;
  border-radius:18px;
  box-shadow:0 20px 42px rgba(15,23,42,0.12);
}
.kintai-log-wrap::-webkit-scrollbar {
  height:10px;
  width:10px;
}
.kintai-log-wrap::-webkit-scrollbar-thumb {
  background:rgba(59,130,246,0.3);
  border-radius:999px;
}
.kintai-log-wrap::-webkit-scrollbar-thumb:hover {
  background:rgba(37,99,235,0.55);
}
.kintai-log-wrap::-webkit-scrollbar-track {
  background:transparent;
}
.kintai-log-table {
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:980px;
  background:#fff;
  border:0;
}
.kintai-log-table thead th {
  padding:12px 16px;
  font-size:13px;
  font-weight:700;
  color:#0f172a;
  text-align:center;
  background:linear-gradient(180deg, rgba(248,250,252,0.98), rgba(237,242,247,0.98));
  border-bottom:1px solid #dbeafe;
  position:sticky;
  position:-webkit-sticky;
  top:0;
  z-index:60;
  backdrop-filter:blur(6px);
}
.kintai-log-table thead th:first-child { border-top-left-radius:18px; }
.kintai-log-table thead th:last-child { border-top-right-radius:18px; }
.kintai-log-table tbody td {
  padding:10px 14px;
  font-size:13px;
  color:#1f2937;
  border-bottom:1px solid #e2e8f0;
  background:#fff;
  vertical-align:middle;
  transition:background-color .14s ease;
}
.kintai-log-table tbody tr.row-bottom td {
  background:#f9fafb;
}
.kintai-log-table tbody tr.row-top:hover td,
.kintai-log-table tbody tr.row-bottom:hover td {
  background:#eef2ff;
}
.kintai-log-table thead th.col-date,
.kintai-log-table tbody td.col-date {
  position:sticky;
  left:0;
  min-width:92px;
  width:92px;
  text-align:center;
  font-weight:700;
  z-index:70;
  box-shadow:6px 0 18px -12px rgba(15,23,42,0.45);
}
.kintai-log-table thead th.col-date { z-index:90; }
.kintai-log-table tbody tr.row-bottom td.col-date {
  background:#f9fafb;
}
.kintai-log-table tbody tr.row-top td.col-date {
  background:#fff;
}
.kintai-log-table tbody td.col-photo { text-align:center; width:96px; min-width:96px; }
.kintai-log-table tbody td.col-photo img {
  max-width:74px;
  border-radius:14px;
  box-shadow:0 8px 18px rgba(15,23,42,0.18);
}
.kintai-log-table tbody td.col-store,
.kintai-log-table thead th.col-store { width:180px; min-width:180px; text-align:left; word-break:break-word; }
.kintai-log-table tbody td.col-name,
.kintai-log-table thead th.col-name { width:136px; min-width:136px; text-align:left; }
.kintai-log-table tbody td.col-log,
.kintai-log-table thead th.col-log { width:102px; min-width:102px; text-align:center; }
.kintai-log-table tbody td.col-rest,
.kintai-log-table thead th.col-rest { width:124px; min-width:124px; text-align:center; }
.kintai-log-table tbody td.col-hrs,
.kintai-log-table thead th.col-hrs { width:90px; min-width:90px; text-align:center; }
.kintai-log-table tbody td.col-pay,
.kintai-log-table thead th.col-pay { width:88px; min-width:88px; text-align:right; }
.kintai-log-table tbody td.col-status,
.kintai-log-table thead th.col-status { width:86px; min-width:86px; text-align:center; }
.kintai-log-table tbody td.col-action,
.kintai-log-table thead th.col-action { width:94px; min-width:94px; text-align:center; }
#kintailog a.help {
  color:inherit;
  text-decoration:none;
  border-bottom:1px dotted currentColor;
  cursor:help;
}
#kintailog a.help:hover { text-decoration:underline; }
#kintailog a.help:focus { outline:2px solid #60a5fa; outline-offset:2px; }
#kintailog .pay-cell { text-align:right; font-variant-numeric:tabular-nums; }
#kintailog .pay-cell .subtext {
  display:block;
  margin-top:4px;
  font-size:12px;
  color:#64748b;
}
#kintailog .col-name.alt,
#kintailog .col-store.alt {
  font-size:12px;
  color:#64748b;
}
#kintailog .status-chip {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 14px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  min-width:84px;
  line-height:1.2;
  background:#e2e8f0;
  color:#1f2937;
  gap:6px;
  box-shadow:0 6px 14px rgba(15,23,42,0.12);
  transition:background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
#kintailog .status-chip.status-ok { background:#dcfce7; color:#166534; box-shadow:0 6px 14px rgba(22,101,52,0.18); }
#kintailog .status-chip.status-warn { background:#fee2e2; color:#b91c1c; box-shadow:0 6px 14px rgba(185,28,28,0.18); }
#kintailog .status-chip.status-edit { background:#fef3c7; color:#92400e; box-shadow:0 6px 14px rgba(146,64,14,0.18); }
#kintailog .status-chip.status-alert { background:#fee2e2; color:#b91c1c; box-shadow:0 6px 14px rgba(185,28,28,0.18); }
#kintailog .status-chip.status-chip--muted { background:#e5e7eb; color:#4b5563; font-weight:600; box-shadow:none; }
#kintailog .status-chip .help { border-bottom:1px dotted currentColor; }
#kintailog .status-chip .help:hover { text-decoration:underline; }
#kintailog .col-action form { display:inline-flex; align-items:center; justify-content:center; }
#kintailog .col-action input[type='submit'] {
  padding:6px 14px;
  border:1px solid #cbd5f5;
  border-radius:12px;
  background:#fff;
  font-size:12px;
  font-weight:700;
  color:#1d4ed8;
  cursor:pointer;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
#kintailog .col-action input[type='submit']:hover {
  background:#eff6ff;
  border-color:#60a5fa;
  color:#1e40af;
  box-shadow:0 6px 14px rgba(30,64,175,0.18);
}
#kintailog .col-action input[type='submit'][disabled] {
  color:#94a3b8;
  border-color:#e2e8f0;
  background:#f8fafc;
  cursor:not-allowed;
  box-shadow:none;
}
#kintailog .rest-pair { text-align:center; font-variant-numeric:tabular-nums; }
#kintailog .rest-pair span {
  display:block;
  font-size:12px;
  color:#475569;
  line-height:1.25;
}

@keyframes kintaiLogFlash {
  0%   { background:#fef3c7; transform:scale(1); }
  40%  { background:#fde68a; transform:scale(1.015); }
  100% { background:inherit; transform:scale(1); }
}
#kintailog tr.flash-highlight > td {
  animation:kintaiLogFlash 1s ease-out;
  will-change:transform, background-color;
}

#kintailog .col-date,
#kintailog .col-log,
#kintailog .col-rest,
#kintailog .col-hrs,
#kintailog .col-status,
#kintailog .col-action { font-variant-numeric:tabular-nums; }

/* Group-based header coloring (H1 groups) */
/* Soft, Google/corporate-inspired tones; overrides row-level defaults */
/* Palette reduced and greyish: name+u (blue-gray), fl (green-gray), genka/etc/profit (neutral gray) */
table#table-debug thead th[data-colgroup="name"],
table#table-debug thead th[data-colgroup="u"]      { background:#cbd8ea !important; color:#182335 !important; border-color:#b9cbe3 !important; }
table#table-debug thead th[data-colgroup="fl"]     { background:#cfe3d7 !important; color:#173025 !important; border-color:#b8d4c5 !important; }
table#table-debug thead th[data-colgroup="genka"],
table#table-debug thead th[data-colgroup="etc"],
table#table-debug thead th[data-colgroup="profit"] { background:#dcdfe6 !important; color:#232a32 !important; border-color:#cbd0d8 !important; }

/* Header/body vertical separators at H1/H2 boundaries */
/* デフォルトは強調線だったが、太さを通常(1px)に統一 */
table#table-debug th.sep-h1, table#table-debug td.sep-h1 { border-left: 1px solid #cbd0d8 !important; }
table#table-debug th.sep-h2, table#table-debug td.sep-h2 { border-left: 1px solid #cbd0d8 !important; }
/* ヘッダー内は h1 切替だけ線を出し、h2 の縦線は非表示（同一ブロック内の線を消す） */
table#table-debug thead th.sep-h2 { border-left: 0 !important; }
/* Tint header separators to match group hue */
/* 切替線の色は統一（強調カラーは使わない） */
table#table-debug thead th.sep-h1, table#table-debug thead th.sep-h2 { border-left-color:#cbd0d8 !important; }

/* 非表示化された重複ヘッダ（空セル）は縦罫線も非表示にする */
/* th-empty 方針は無効化（クラスは使用しない） */

/* ヘッダー内部の罫線は非表示（切替線を除く） */
table#table-debug thead th {
  /* 罫線幅ごと無効化（色透明ではなく幅0） */
  border: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}
/* 背景色と同色の『偽の境界線』で下層の td 縦線を隠す（h1/h2切替以外） */
table#table-debug thead th[data-colgroup="u"]:not(.sep-h1):not(.sep-h2)      { border-left: 1px solid #cbd8ea !important; }
table#table-debug thead th[data-colgroup="fl"]:not(.sep-h1):not(.sep-h2)     { border-left: 1px solid #cfe3d7 !important; }
table#table-debug thead th[data-colgroup="genka"]:not(.sep-h1):not(.sep-h2)  { border-left: 1px solid #dcdfe6 !important; }
table#table-debug thead th[data-colgroup="etc"]:not(.sep-h1):not(.sep-h2)    { border-left: 1px solid #dcdfe6 !important; }
table#table-debug thead th[data-colgroup="profit"]:not(.sep-h1):not(.sep-h2) { border-left: 1px solid #dcdfe6 !important; }
/* 先頭セルの左側は常に線なし */
table#table-debug thead th:first-child { border-left: 0 !important; }
/* ヘッダーの先頭固定列に付く影を無効化（縦線に見えるため） */
#table-debug thead th:first-child,
#table-debug thead .col-tenpo { box-shadow: none !important; }

/* TH2: 右側が同項目のグループに続く先頭セルは折り返し禁止（DOMは変更しない） */
table#table-debug thead tr:nth-child(2) th.th2-nowrap { white-space: nowrap !important; }

/* 先頭列（店舗）固定。クラス .col-tenpo を優先し、fallbackで first-child も固定 */
table#table-debug .col-tenpo { position: sticky; left: 0; }
table#table-debug thead .col-tenpo { z-index: 1000; }
table#table-debug tbody .col-tenpo { z-index: 900; }
table#table-debug th:first-child, table#table-debug td:first-child { position: sticky; left: 0; }
/* 視認性のための影は tbody のみ付与（theadは無効） */
table#table-debug tbody td:first-child,
table#table-debug tbody .col-tenpo { box-shadow: 2px 0 0 rgba(0,0,0,.06); }
/* 先頭列の最小幅を拡張 */
table#table-debug td:first-child,
table#table-debug th:first-child,
table#table-debug .col-tenpo { min-width: 160px; }
/* ゼブラ背景と揃える（sticky先頭列の背景を固定） */
table#table-debug tbody tr:nth-child(odd)  td:first-child { background:#fff; }
table#table-debug tbody tr:nth-child(even) td:first-child { background:#f9fafb; }

/* Column-specific width tweaks */
/* 予算達成率: 折り返し防止 + 幅拡張 */
table#table-debug thead th[data-key="achv"],
table#table-debug td[data-key="achv"] {
  min-width: 120px !important;
  white-space: nowrap !important;
}

/* Debug tools (reorder / toggle) */
.debug-tools { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:8px 0 10px; }
.debug-tools label { font-weight:700; }
.debug-tools .chips { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.debug-tools .chip { padding:6px 10px; border:1px solid #e5e7eb; border-radius:999px; background:#fff; cursor:pointer; user-select:none; font-weight:600; }
.debug-tools .chip input { margin-right:6px; }

/* KPI/利益の色味（グレイッシュに調整） */
table#table-debug td.kpi-pos,
table#table-debug td.profit-pos { color:#2e6f5e !important; }
table#table-debug td.kpi-neg,
table#table-debug td.profit-neg { color:#b14646 !important; }


/* Legacy header/nav in gyoseki_ichiran: hide (new header used) */
/* (旧 gyoseki_ichiran の h2/UL は削除済み) */

/* =========================================================
   Settings (New UI): Sections, Items, Toggles, Buttons
   既存のテーブルをJSで置換して使用
   ========================================================= */
.settings-section { background:#fff; border:1px solid #e5e7eb; border-radius:var(--radius-12); box-shadow:var(--shadow); margin:12px 0; }
.settings-section:last-child { margin-bottom: 0; }
/* Settings wrapper (mount target) */
#settings-sections { margin: 0; padding: 0; }
.settings-section .section-title { display:flex; align-items:center; justify-content:space-between; padding:14px 16px; font-weight:800; }
details.settings-section > summary.section-title { list-style:none; cursor:pointer; }
details.settings-section > summary.section-title::-webkit-details-marker { display:none; }
.settings-group { padding: 8px 16px 14px; display:grid; grid-template-columns: 1fr; gap:10px; }
@media (min-width: 1024px) { .settings-group { grid-template-columns: 1fr 1fr; } }
.setting-item { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:12px; border:1px solid #eef2f7; border-radius:var(--radius-12); background:#fff; }
.setting-item.wide { grid-column: 1 / -1; }
.setting-item.wide .left { display:none; }
.setting-item.wide .control { width:100%; }
.setting-item .left { flex:0 0 360px; max-width:440px; }
.setting-item .control { flex:1 1 auto; }
.setting-item .label { font-weight:700; }
.setting-item .desc { color:var(--muted); font-size:.85rem; }
.setting-item .control { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-start; }
.setting-item .control .months-header { width:100%; color:var(--muted); margin:2px 0 4px; font-weight:700; }
.setting-item .control .months-grid { display:grid; grid-template-columns: repeat(6, minmax(110px, 1fr)); gap:12px 14px; width:100%; }
.setting-item .control .months-grid .chip {
  padding:6px 14px; font-size:14px; line-height:1; border-radius:999px;
  border:1px solid #e5e7eb; background:#fff; color:#111827;
  background-image:none !important; box-shadow:none; text-decoration:none;
  transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.setting-item .control .months-grid .chip input[type="checkbox"]{ display:none !important; }
.setting-item .control .months-grid label.chip { display:inline-flex; align-items:center; gap:6px; }
.setting-item .control .months-grid .chip:hover { border-color:#cbd5e1; }
.setting-item .control .months-grid .chip[aria-checked="true"] {
  background:#eaf2ff; border-color:#bfdbfe; color:#1e40af;
}
.setting-item .control .months-grid .chip::before, 
.setting-item .control .months-grid .chip::after { content:none !important; display:none !important; }
/* チェックボックスの見た目を統一（menu.php 風） */
.chip input[type="checkbox"]{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  width:18px; height:18px; border-radius:4px; border:2px solid #cbd5e1; background:#fff; display:inline-block; position:relative;
}
.chip input[type="checkbox"]:checked{ background:#1e40af; border-color:#1e40af; }
.chip input[type="checkbox"]:checked::after{
  content:""; position:absolute; left:4px; top:1px; width:6px; height:10px; border:2px solid #fff; border-top:0; border-left:0; transform:rotate(45deg);
}
/* コントロール右側のツールボタン */
/* 一括ON/OFFは使用しない（将来用に残すが未表示） */
.months-tools { display:none; }

@media (max-width: 1024px) {
  .setting-item .control .months-grid { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
}
@media (max-width: 640px) {
  .setting-item .control .months-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
}

/* Toggle switch */
.switch { position: relative; display: inline-block; width: 54px; height: 32px; }
.switch input { opacity: 0; width: 0; height: 0; }
.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #e5e7eb; transition: .2s; border-radius: 999px; border:1px solid #d1d5db; }
.slider:before { position: absolute; content: ""; height: 24px; width: 24px; left: 4px; bottom: 3px; background-color: white; transition: .2s; border-radius: 50%; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
input:checked + .slider { background-color: #10b981; border-color:#10b981; }
input:checked + .slider:before { transform: translateX(22px); }

/* Group select (menu.php) */
.grp-form { display:inline-flex; align-items:center; gap:8px; }
.muted.small { font-size:.85rem; }
.select-modern {
  height:28px;
  padding:0 28px 0 10px; /* 右に矢印ぶんの余白 */
  border:1px solid #e5e7eb;
  border-radius:var(--radius-8);
  background:#fff;
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  font: inherit; color: inherit;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M6 8l4 4 4-4' stroke='%23898f9a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position: right 8px center;
}
.select-modern:hover { background-color:#f9fafb; border-color:#d1d5db; }
.select-modern:focus { outline:3px solid var(--ring); outline-offset:1px; }
.select-modern:disabled { background-color:#f3f4f6; color:#9ca3af; cursor:not-allowed; }
/* Edge/IE アイコン非表示（互換） */
select.select-modern::-ms-expand{ display:none; }
/* ドロップダウン（サポート範囲内で） */
.select-modern option { font-size:.95rem; }

/* Settings: filter + chips + toast */
.storechips-wrap { display:flex; flex-wrap:wrap; gap:8px; overflow:visible; }
:root.storechips-prefold .storechips-wrap { opacity:0; max-height:3.4rem; overflow:hidden; pointer-events:none; }
:root.storechips-prefold .storechips-wrap .chip-showmore { display:none; }
.filter-bar { margin:10px 0 16px; }
.filter-right { margin-left:auto; }
.multi-store-alert { font-size:12px; color:#f59e0b; font-weight:600; margin-left:auto; }
.is-disabled { opacity:.5; cursor:not-allowed !important; }
.filter-bar#store-filter { flex-direction:row; align-items:center; gap:8px; }
#store-filter .filter-main { flex:1 1 auto; }
#store-filter .filter-label { font-size:13px; color:#6b7280; font-weight:600; }
#store-filter .chip-list { gap:8px; }
#store-filter .chip-apply { background:var(--primary); color:#fff; border-color:var(--primary); font-weight:800; }
#store-filter .chip-apply:hover { background:var(--info-hover); border-color:var(--info-hover); }
/* 汎用化: 任意の filter-bar でも適用ボタンを同スタイルに */
.filter-bar .chip-apply,
.schedule-filter-bar .chip-apply { background:var(--primary); color:#fff; border-color:var(--primary); font-weight:800; }
.filter-bar .chip-apply:hover,
.schedule-filter-bar .chip-apply:hover { background:var(--info-hover); border-color:var(--info-hover); }
#store-filter .chip-create { background:var(--info); color:#fff; border-color:var(--info); font-weight:800; }
#store-filter .chip-create:hover { background:var(--info-hover); border-color:var(--info-hover); }
#store-filter .filter-search { margin-left:auto; }
/* Gyoseki 日報: 店舗チップバー（他ページ準拠でシンプルに） */
.gyoseki-nippou #tenpoFilterBar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.gyoseki-nippou #tenpoFilterBar .filter-main { display:flex; align-items:center; flex-wrap:wrap; gap:8px; flex:1 1 auto; min-width:0; }
.gyoseki-nippou #tenpoFilterBar .chip { display:inline-flex; align-items:center; }
.gyoseki-nippou #tenpoFilterBar .chip[data-hidden="1"] { display:none; }
:root.storechips-prefold .gyoseki-nippou #tenpoFilterBar { opacity: 0; max-height: 3.4rem; overflow: hidden; pointer-events: none; }
:root.storechips-prefold .gyoseki-nippou #tenpoFilterBar .chip[data-hidden="1"] { display:none; }
:root.storechips-prefold .gyoseki-nippou #tenpoFilterBar .chip-showmore { display:none; }
.input-modern {
  height:28px; padding:0 10px; border:1px solid #e5e7eb; border-radius:var(--radius-8); background:#fff;
  font:inherit; color:inherit;
}
.input-modern:focus { outline:3px solid var(--ring); outline-offset:1px; }

/* Loading overlay (menu.php) */
.loading-overlay { position:fixed; inset:0; background:rgba(255,255,255,.6); display:none; align-items:center; justify-content:center; z-index:600000; }
.loading-overlay .spinner {
  width:36px; height:36px; border-radius:50%; border:4px solid #e5e7eb; border-top-color: var(--primary);
  animation: spin 1s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* AI assistant toggle (menu.php) */
#aiToggleBtn.ai-toggle {
  position:fixed; right:16px; bottom:16px; z-index:2001;
  display:none; padding:8px 12px; border-radius:9999px; border:0;
  background: var(--primary); color:#fff; font-weight:800; cursor:pointer;
  box-shadow:0 10px 25px rgba(0,0,0,.15);
  white-space: nowrap; font-size:.9rem; line-height:1;
}
#aiToggleBtn.ai-toggle:hover { background: var(--primary-hover); }
.sticky-subheader { position: sticky; top: 72px; z-index: 950; background: var(--card); padding: 8px 10px; border-radius: 12px; }
/* サブヘッダー右側アクションのボタン高さとアイコンサイズを統一 */
.sticky-subheader .subheader-actions .btn { height: 36px; padding: 0 12px; display:inline-flex; align-items:center; }
.sticky-subheader .subheader-actions .btn img { width: 18px; height: 18px; display:block; }
.torihiki-ichiran .filter-main { display: flex; flex-direction: column; gap: 12px; width: 100%; }
.torihiki-ichiran .filter-main .chip-row { width: 100%; justify-content: flex-start; }
.torihiki-ichiran .filter-main .control-row { margin-left: auto; margin-top: auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: flex-end; align-self: flex-end; }
#store-filter .chip.all { width:auto; }
body.page-settings #store-filter { gap:10px; }
body.page-settings #store-filter .filter-main { flex:1 1 auto; }
#kintaiFilterBar .chip.all { min-width:72px; justify-content:center; }

.is-hidden { display:none !important; }

/* Kintai: 源泉徴収税額表（月額表） */
body.page-getsugakuhyou .container {
  width:min(840px, 94vw);
  margin:22px auto;
}
body.page-getsugakuhyou .card {
  padding:24px 26px;
}
body.page-getsugakuhyou .perm-table-wrapper {
  max-width:720px;
  margin:0 auto 24px;
  overflow-x:auto;
  border-radius:12px;
}
body.page-getsugakuhyou .perm-table {
  width:100%;
  min-width:640px;
  font-size:14px;
}
body.page-getsugakuhyou .perm-table--otsu {
  table-layout:fixed;
}
body.page-getsugakuhyou .perm-table--otsu col {
  width:calc((100% - 240px) / 2);
}
body.page-getsugakuhyou .perm-table--otsu col.col-deduction {
  width:240px;
}
body.page-getsugakuhyou .perm-table thead th {
  position:static;
  top:auto;
  z-index:auto;
}
body.page-getsugakuhyou .perm-table th,
body.page-getsugakuhyou .perm-table td {
  padding:12px 16px;
  text-align:center;
}
@media (max-width: 768px) {
  body.page-getsugakuhyou .perm-table {
    min-width:560px;
    font-size:13px;
  }
  body.page-getsugakuhyou .perm-table th,
  body.page-getsugakuhyou .perm-table td {
    padding:10px 12px;
  }
}

/* 科目設定モーダル: 余白最小化＋領域拡大 */
.kamoku-modal { justify-content:flex-start; padding-top:12px; }
.kamoku-modal .modal-card { margin:0 auto 8px; }
.kamoku-modal .modal-header { padding:6px 10px; }
.kamoku-modal .modal-body { padding:0; }
.kamoku-modal .kamoku-modal-card { width:1160px; max-width:calc(100% - 24px); }
.kamoku-modal .kamoku-modal-body { height:calc(100vh - 120px); }
.modal-label { font-weight:700; min-width:64px; text-align:right; }
.modal-month-input {
  height:40px;
  padding:8px 12px;
  width:180px;
  text-align:center;
  border:1px solid #e5e7eb;
  border-radius:var(--radius-10);
  font-size:1.05rem;
  font-weight:700;
  background:#fff;
}
.modal-days { display:block; margin:8px 0 6px; overflow-x:auto; }
.modal-days .date-grid { width:100%; border-collapse:collapse; table-layout:fixed; }
.modal-days .date-grid th { padding:4px 0; font-weight:600; text-align:center; font-size:0.9rem; }
.modal-days .date-grid td { padding:4px; text-align:center; height:58px; vertical-align:middle; }
.modal-close-btn { height:30px; }

.sim-container {
  margin-top:14px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.sim-header {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.sim-title {
  margin:0;
  font-size:1.05rem;
  font-weight:700;
  color:#1f2937;
}
.sim-mode-switch {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.sim-mode-btn {
  display:inline-flex;
  align-items:center;
  padding:6px 14px;
  border-radius:999px;
  border:1px solid #d1d5db;
  background:#fff;
  color:#1f2937;
  font-weight:600;
  cursor:pointer;
  transition:background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.sim-mode-btn:hover {
  border-color:var(--info);
  color:var(--info);
}
.sim-mode-btn.is-active {
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
  box-shadow:0 8px 18px color-mix(in srgb, var(--info) 18%, transparent);
}

.sim-card-grid {
  display:grid;
  gap:16px;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
}
.sim-card {
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:var(--radius-16);
  padding:18px 20px;
  box-shadow:0 10px 24px rgba(15,23,42,.08);
  display:flex;
  flex-direction:column;
  gap:14px;
}
.sim-card-header {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.sim-card-title {
  margin:0;
  font-size:1rem;
  font-weight:700;
  color:#111827;
}
.sim-card-meta {
  text-align:right;
}
.sim-card-label {
  display:block;
  font-size:0.78rem;
  color:#6b7280;
}
.sim-card-value {
  font-size:1.25rem;
  font-weight:800;
  color:#111827;
}
.sim-card-section {
  padding-top:12px;
}
.sim-card-section + .sim-card-section {
  border-top:1px solid #f1f5f9;
}
.sim-card-section h5 {
  margin:0 0 8px;
  font-size:0.85rem;
  font-weight:700;
  color:#4b5563;
}
.sim-meta {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:6px 12px;
  font-size:0.86rem;
}
.sim-meta > div {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.sim-meta dt {
  color:#6b7280;
  font-weight:600;
}
.sim-meta dd {
  margin:0;
  font-weight:700;
  color:#111827;
}

.shift-toolbar-card {
  margin-top:16px;
  padding:16px 18px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.shift-toolbar {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px 16px;
}
.shift-toolbar-primary {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.shift-toolbar-title {
  margin:0;
  font-size:1.05rem;
  font-weight:700;
  color:#111827;
}
.shift-toolbar-actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
}
.shift-toolbar-form {
  margin:0;
}
.shift-toolbar-form button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.shift-order-btn {
  font-weight:700;
  border-radius:999px;
  padding:6px 16px;
  border:1px solid #d1d5db;
  background:#fff;
  color:var(--info);
  cursor:pointer;
}
.shift-order-btn:hover {
  border-color:var(--info);
  background:#eff6ff;
}
.shift-status-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 18px;
  border-radius:999px;
  border:1px solid #f59e0b;
  background:#fef3c7;
  color:#92400e;
  font-weight:700;
  cursor:pointer;
}
.shift-status-btn.is-locked {
  border-color:#9ca3af;
  background:#e5e7eb;
  color:#374151;
}
.shift-export-btn {
  width:36px;
  height:36px;
  border-radius:999px;
}
.shift-export-btn img {
  width:20px;
  height:20px;
}
.shift-schedule-card {
  margin-top:14px;
  padding:18px 20px;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.shift-schedule-card,
#scheduleModule,
#simModule {
  position:relative;
}
#loading {
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,0.62);
  z-index:15000;
}
#loading::after {
  content:'';
  width:44px;
  height:44px;
  border:4px solid rgba(148,163,184,0.45);
  border-top-color:var(--info);
  border-radius:50%;
  animation:torihiki-spin 0.9s linear infinite;
}
.schedule-refresh-mask {
  opacity:0.38;
  transition:opacity .18s ease;
  pointer-events:none;
}

.sim-refresh-mask {
  opacity:0.38;
  transition:opacity .18s ease;
  pointer-events:none;
}
.shift-schedule-form { display:flex; flex-direction:column; gap:14px; }
.shift-schedule-body {
  border:1px solid #e5e7eb;
  border-radius:var(--radius-14);
  background:#fff;
  /* 上部の余白を少し詰めて、日付ピルとの隙間を解消 */
  padding:4px 12px 16px;
  position:relative;
}
.shift-schedule-body form {
  margin:0;
}

.shift-cover-pill {
  position:absolute;
  top:-20px;
  left:-20px;
  padding:20px 40px;
  background:#3f4a5b;
  color:#fff;
  border-radius:9999px;
  font-size:20px;
  font-weight:700;
  letter-spacing:.05em;
  box-shadow:0 12px 32px rgba(15,23,42,.25);
  pointer-events:none;
  z-index:4200;
}

.shift-date-pill {
  position:absolute;
  /* スケジュールヘッダーとの間の隙間をなくすために位置を微調整 */
  top:-11px;
  left:-3px;
  /* 視認性を保ちつつ高さをわずかに増やす */
  padding:12px 28px;
  background:linear-gradient(135deg,#4f46e5,#7c3aed);
  color:#fff;
  border-radius:24px;
  display:flex;
  align-items:center;
  gap:10px;
  box-shadow:0 10px 20px rgba(79,70,229,.25);
  pointer-events:none;
  z-index:4200;
}
.shift-date-pill__day {
  font-size:20px;
  font-weight:800;
  line-height:1;
}
.shift-date-pill__meta {
  display:flex;
  flex-direction:column;
  font-size:11px;
  letter-spacing:.05em;
  text-transform:uppercase;
  opacity:.8;
}



.shift-schedule-scroll {
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  max-height:70vh;
  border-radius:var(--radius-10);
  position:relative;
}
.shift-schedule-body .jq-schedule .sc_menu {
  position:sticky;
  top:0;
  z-index:4090;
  background:#3f4a5b;
}
.shift-schedule-body .sc_data_fixed_cover {
  pointer-events:none;
}
.shift-schedule-scroll #schedule {
  display:inline-block;
}
.shift-schedule-scroll #sc_main_box {
  overflow-y:auto;
  max-height:calc(70vh - 26px);
}
.shift-schedule-body .jq-schedule .sc_data,
.shift-schedule-body .jq-schedule .sc_main_box {
  max-height:none;
}
.shift-schedule-body #sc_main_box {
  max-height:calc(70vh - 26px);
}
.shift-schedule-scroll::-webkit-scrollbar {
  height:10px;
}
.shift-schedule-scroll::-webkit-scrollbar-track {
  background:transparent;
}
.shift-schedule-scroll::-webkit-scrollbar-thumb {
  background:rgba(148,163,184,.55);
  border-radius:999px;
}
.shift-schedule-scroll::-webkit-scrollbar-thumb:hover {
  background:rgba(71,85,105,.7);
}
.shift-schedule-body #schedule {
  min-width:720px;
  background:#fff;
}
.shift-schedule-body #schedule,
.shift-schedule-body #schedule::before,
.shift-schedule-body #schedule::after {
  border-radius:var(--radius-10);
}
.shift-schedule-body #schedule,
.shift-schedule-body #schedule table {
  width:100%;
}
.shift-schedule-body #schedule table {
  table-layout:fixed;
}
.shift-schedule-body #output {
  margin-top:12px;
}
.shift-schedule-actions {
  display:flex;
  justify-content:flex-end;
}
.shift-save-btn {
  min-width:calc(var(--w-160) + 20px);
  padding:12px 22px;
  border-radius:999px;
  border:0;
  background:linear-gradient(135deg, var(--primary), var(--primary-hover));
  color:#fff;
  font-size:1.05rem;
  font-weight:800;
  letter-spacing:0.04em;
  gap:10px;
  box-shadow:var(--shadow-xl);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.shift-save-btn:hover {
  background:linear-gradient(135deg, var(--primary-hover), #245b27);
  box-shadow:0 16px 34px rgba(47,122,51,0.35);
  transform:translateY(-1px);
}
.shift-save-btn:focus-visible {
  outline:3px solid rgba(57,143,61,0.35);
  outline-offset:3px;
}
.shift-save-btn:active {
  transform:translateY(0);
  box-shadow:0 8px 18px rgba(47,122,51,0.3);
}
.shift-save-btn:disabled,
.shift-save-btn[disabled] {
  background:linear-gradient(135deg, #9ac89c, #7fbf83);
  box-shadow:none;
  opacity:0.85;
  cursor:default;
}
.shift-save-btn__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
}
.shift-save-btn__icon svg {
  width:18px;
  height:18px;
  display:block;
}
.shift-save-btn__label {
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.period-button {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:2px;
  min-height: calc(var(--btn-h) + 10px);
  padding:8px calc(var(--btn-pad-x-sm) + 2px);
  border-radius:var(--radius-10);
  border:2px solid var(--info);
  background:#eff6ff;
  color:#111827;
  font-weight:700;
  line-height:1.2;
  box-shadow:0 1px 0 rgba(0,0,0,.03);
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.period-button:hover { background:#dbeafe; }
.period-button:focus,
.period-button:focus-visible {
  outline:none;
  border-color:var(--info-hover);
  box-shadow:0 0 0 2px var(--info-soft);
}
.period-button-label {
  font-size:12px;
  font-weight:700;
  color:var(--info-hover);
  letter-spacing:.04em;
  text-transform:uppercase;
}
.period-button--compact .period-button-label { display:none; }
.period-button-value { font-size:15px; font-weight:800; color:#111827; white-space:nowrap; }

/* -------------------------------
   シフト作成モジュール（色・フォントの調整）
   影響範囲は .shift-schedule-body 内の jq-schedule に限定
-------------------------------- */
.shift-schedule-body .jq-schedule .sc_menu .sc_header_cell,
.shift-schedule-body .jq-schedule .sc_data_head,
.shift-schedule-body .jq-schedule .sc_data_fixed_head {
  background:#3f4a5b; /* ダークスレートで視認性向上 */
  color:#fff;
}
.shift-schedule-body .jq-schedule .sc_header .sc_time,
.shift-schedule-body .jq-schedule .sc_main_scroll .sc_time {
  background:#3f4a5b;
  color:#fff;
  font-weight:800;
}
.shift-schedule-body .jq-schedule .sc_data_fixed .sc_data_fixed_cover {
  background:#3f4a5b;
}
/* 左側のスタッフ名・役職（固定列・スクロール側とも統一） */
.shift-schedule-body .jq-schedule .sc_data .timeline,
.shift-schedule-body .jq-schedule .sc_data_fixed .timeline {
  background:#3f4a5b;
  color:#fff;
  padding:10px 12px;
}
.shift-schedule-body .jq-schedule .timeline-title { 
  font-size:13.5px; 
  font-weight:800; 
  line-height:1.2; 
  color:#fff; 
}
/* 役職部分を小さく、コントラストは少し下げる */
.shift-schedule-body .jq-schedule .timeline-subtitle { 
  font-size:11px; 
  color:#d1d5db; 
}
.shift-schedule-body .jq-schedule .timeline-store { 
  font-size:11px; 
  color:#a5b4fc; 
}
.shift-schedule-body .jq-schedule .sc_data .timeline.store-colored,
.shift-schedule-body .jq-schedule .sc_data_fixed .timeline.store-colored {
  position:relative;
  padding-left:18px;
}
.shift-schedule-body .jq-schedule .sc_data .timeline.store-colored::before,
.shift-schedule-body .jq-schedule .sc_data_fixed .timeline.store-colored::before {
  content:'';
  position:absolute;
  top:8px;
  bottom:8px;
  left:0;
  width:6px;
  border-radius:3px;
  background:var(--store-color,rgba(255,255,255,.45));
}
.shift-schedule-body .jq-schedule .sc_data_fixed .timeline.store-colored::before {
  left:8px;
}
.shift-schedule-body .jq-schedule .sc_data .timeline.store-colored .timeline-store,
.shift-schedule-body .jq-schedule .sc_data_fixed .timeline.store-colored .timeline-store {
  color:var(--store-color,#a5b4fc);
  font-weight:700;
}
.shift-schedule-body .jq-schedule .sc_data .timeline.role-part,
.shift-schedule-body .jq-schedule .sc_data_fixed .timeline.role-part {
  background:#4c3f86;
}
.shift-schedule-body .jq-schedule .sc_data .timeline.role-regular,
.shift-schedule-body .jq-schedule .sc_data_fixed .timeline.role-regular {
  background:#3f4a5b;
}
.shift-schedule-card .jq-schedule .sc_bar.role-part {
  background:linear-gradient(135deg, #60a5fa, #3b82f6);
  border-color:#3b82f6;
  box-shadow:0 8px 18px rgba(59,130,246,.25);
}
.shift-schedule-card .jq-schedule .sc_bar.role-regular {
  background:linear-gradient(135deg, #34d399, #059669);
  border-color:#059669;
  box-shadow:0 8px 18px rgba(5,150,105,.25);
}
.shift-schedule-card .jq-schedule .sc_bar.sc_bar_photo {
  padding-left:60px;
}
.shift-schedule-card .jq-schedule .sc_bar.sc_bar_photo .head,
.shift-schedule-card .jq-schedule .sc_bar.sc_bar_photo .text,
.shift-schedule-card .jq-schedule .sc_bar.sc_bar_photo .memo {
  padding-left:0;
}
.shift-schedule-card .jq-schedule .sc_bar.sc_bar_photo .photo {
  position:absolute;
  left:10px;
  top:50%;
  width:44px;
  height:44px;
  transform:translateY(-50%);
  border-radius:50%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.25);
  border:2px solid rgba(255,255,255,.9);
  box-shadow:0 6px 16px rgba(15,23,42,.25);
}
.shift-schedule-card .jq-schedule .sc_bar.sc_bar_photo .photo img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.shift-schedule-card .jq-schedule .sc_bar.role-part.sc_bar_photo .photo {
  background:linear-gradient(135deg, rgba(96,165,250,.8), rgba(59,130,246,.95));
  border-color:rgba(191,219,254,.95);
}
.shift-schedule-card .jq-schedule .sc_bar.role-regular.sc_bar_photo .photo {
  background:linear-gradient(135deg, rgba(52,211,153,.8), rgba(5,150,105,.95));
  border-color:rgba(187,247,208,.95);
}
.shift-schedule-card .jq-schedule .sc_bar.role-part .head,
.shift-schedule-card .jq-schedule .sc_bar.role-part .text,
.shift-schedule-card .jq-schedule .sc_bar.role-part .memo,
.shift-schedule-card .jq-schedule .sc_bar.role-regular .head,
.shift-schedule-card .jq-schedule .sc_bar.role-regular .text,
.shift-schedule-card .jq-schedule .sc_bar.role-regular .memo {
  color:#fff;
}
/* バー（シフト本体）の状態別スタイル */
.shift-schedule-card .jq-schedule .sc_bar {
  color:#fff;
  border-radius:var(--radius-8);
  transition:background .2s ease, color .2s ease;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  padding:6px 12px;
}
.shift-schedule-card .jq-schedule .sc_bar .ui-resizable-handle { 
  width:6px; 
}
.shift-schedule-card .jq-schedule .sc_bar .head {
  margin:0;
  height:auto;
  font-size:12px;
  line-height:1.15;
  padding:0;
}
.shift-schedule-card .jq-schedule .sc_bar .text { 
  font-size:12px; 
  margin:0;
  height:auto;
  line-height:1.25;
  white-space:normal;
  word-break:break-word;
  overflow:hidden;
}
.shift-schedule-card .jq-schedule .sc_bar .memo { 
  font-size:11.5px; 
  margin:0;
  height:auto;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  display:block;
  color:#e5e7eb;
}

.shift-schedule-card.is-editing .shift-schedule-body {
  border-color:#93c5fd;
  box-shadow:0 0 0 1px rgba(147,197,253,.35) inset;
}
.shift-schedule-card.is-editing .jq-schedule .sc_bar {
  background:#7fbafa;
}
.shift-schedule-card.is-editing .jq-schedule .sc_bar.role-part {
  background:linear-gradient(135deg, #60a5fa, #3b82f6);
}
.shift-schedule-card.is-editing .jq-schedule .sc_bar.role-regular {
  background:linear-gradient(135deg, #34d399, #059669);
}
.shift-schedule-card.is-editing .jq-schedule .sc_bar .ui-resizable-handle { 
  background:#5fa3f5; 
}

.shift-schedule-card.is-confirmed .shift-schedule-body {
  border-color:#d1d5db;
  background:#f3f4f6;
}
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar {
  background:#9ca3af;
  color:#1f2937;
}
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar.role-part {
  background:#6a6fa4;
  color:#f8fafc;
}
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar.role-regular {
  background:#6b7280;
  color:#f8fafc;
}
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar .head,
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar .text,
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar .memo { 
  color:#111827; 
  font-weight:700; 
}
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar.role-part .head,
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar.role-part .text,
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar.role-part .memo,
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar.role-regular .head,
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar.role-regular .text,
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar.role-regular .memo { 
  color:#f8fafc;
  font-weight:700;
}
.shift-schedule-card.is-confirmed .jq-schedule .sc_bar .ui-resizable-handle { 
  background:#6b7280; 
}

.toggle-pill,
.toggle-syukei {
  display:inline-flex;
  align-items:stretch;
  background:#f4f4f5;
  border-radius:9999px;
  padding:0;
  gap:4px;
  height:32px;
}
.toggle-pill input,
.toggle-syukei input { display:none; }
.toggle-pill label,
.toggle-syukei label {
  height:100%;
  line-height:32px;
  display:flex;
  align-items:center;
  margin:0;
  padding:0 14px;
  border-radius:9999px;
  font-weight:700;
  cursor:pointer;
  color:#4b5563;
  font-size:.95rem;
  transition:background .15s ease, color .15s ease;
}
.toggle-pill input:checked + label,
.toggle-syukei input:checked + label {
  background:#111827;
  color:#fff;
}
/* ========== [4] Patterns（DateModal 等の組合せUI） ========== */

/* Date modal (共通スタイル) */
:is(.date-modal, .haccp-page #haccpDateModal) {
  padding: 12px;
}
:is(.date-modal, .haccp-page #haccpDateModal) .modal-body {
  display: flex;
  flex-direction: column;
}
:is(.date-modal, .haccp-page #haccpDateModal) .date-modal-toolbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin: 14px 0 4px;
}
:is(.date-modal, .haccp-page #haccpDateModal) .date-month-input {
  border: 2px solid var(--info);
  border-radius: var(--radius-16);
  padding: 10px 14px;
  min-width: var(--w-200);
  text-align: center;
  font-size: 1.05rem;
  font-weight: 700;
  background: #fff;
}
:is(.date-modal, .haccp-page #haccpDateModal) .date-month-input:focus {
  outline: none;
  box-shadow: 0 0 0 4px var(--info-soft);
}
:is(.date-modal, .haccp-page #haccpDateModal) .modal-body .row { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; }
:is(.date-modal, .haccp-page #haccpDateModal) .modal-body .row + .row { gap:10px; }
:is(.date-modal, .haccp-page #haccpDateModal) label[for="dlgClosing"] { font-weight:700; min-width:64px; text-align:right; }
#dlgDays { display:block; margin:8px 0 6px; }
#clcheckDlgDays { display:block; margin:8px 0 6px; }
:is(.date-modal, .haccp-page #haccpDateModal) .chip[aria-checked="true"] { background:#111827; border-color:#111827; color:#fff; }
:is(.date-modal, .haccp-page #haccpDateModal) .chip.date-chip {
  width:64px;
  height:52px;
  border-radius:26px;
  border:1px solid #d1d5db;
  background:#fff;
  color:#111827;
  font-size:1.05rem;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:relative;
  transition: all .15s ease;
}
:is(.date-modal, .haccp-page #haccpDateModal) .chip.date-chip:hover { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(22,163,74,0.15); }
:is(.date-modal, .haccp-page #haccpDateModal) .chip.date-chip[aria-checked="true"] { background:#16a34a; color:#fff; border-color:#15803d; box-shadow: 0 0 0 3px rgba(22,163,74,0.2); }
:is(.date-modal, .haccp-page #haccpDateModal) .chip.date-chip.is-today { border-color:var(--info); }
:is(.date-modal, .haccp-page #haccpDateModal) .chip.date-chip.has-data {
  box-shadow:0 0 0 3px rgba(37,99,235,0.18);
  border-color:var(--info);
}
:is(.date-modal, .haccp-page #haccpDateModal) .chip.date-chip.has-data::after {
  content:'';
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--info);
  position:absolute;
  bottom:6px;
}
:is(.date-modal) .chip.date-chip[aria-disabled="true"] {
  opacity:0.35;
  pointer-events:none;
  cursor:default;
}
:is(.date-modal, .haccp-page #haccpDateModal) .date-total-btn {
  min-width:var(--w-140);
  border-color:#d1d5db;
  background:#f3f4f6;
  color:#111827;
}
:is(.date-modal, .haccp-page #haccpDateModal) .date-total-btn:hover { background:#e5e7eb; }
:is(.date-modal, .haccp-page #haccpDateModal) .date-total-btn[aria-pressed="true"] {
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
:is(.date-modal, .haccp-page #haccpDateModal) .date-days-grid { display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:10px; justify-items:center; align-items:center; }
:is(.date-modal, .haccp-page #haccpDateModal) .date-days-grid .weekday { font-size:.86rem; font-weight:600; color:#6b7280; writing-mode:horizontal-tb; text-orientation:mixed; }
:is(.date-modal, .haccp-page #haccpDateModal) .date-day-placeholder { width:64px; height:52px; display:inline-flex; align-items:center; justify-content:center; color:#d1d5db; font-weight:600; }
#btnCloseDate { min-height:calc(var(--btn-h) - 4px); padding:0 12px; }
#haccpDateModal .modal-header button {
  min-width:74px;
  padding:4px 12px;
  font-size:14px;
  margin-left:auto;
}
.haccp-page #haccpDateModal .modal-header strong {
  flex: 1 1 auto;
  text-align: center;
}
.haccp-page #haccpDateModal .modal-header #haccpCloseDate {
  position: absolute;
  right: 24px;
  top: 20px;
}
.haccp-page #haccpDateModal .modal-footer { gap: 8px; }
:is(.date-modal, .haccp-page #haccpDateModal) .btn.is-ghost,
:is(.date-modal, .haccp-page #haccpDateModal) #btnCancelDate {
  background:#f3f4f6;
  border-color:#d1d5db;
  color:#111827;
}
:is(.date-modal, .haccp-page #haccpDateModal) .btn.is-ghost:hover,
:is(.date-modal, .haccp-page #haccpDateModal) #btnCancelDate:hover {
  background:#e5e7eb;
}
:is(.date-modal, .haccp-page #haccpDateModal) #btnApplyDate {
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
:is(.date-modal, .haccp-page #haccpDateModal) #btnApplyDate:hover {
  background:var(--primary-hover);
  border-color:var(--primary-hover);
}
/* Shift edit modal buttons */
#shiftEditModal .btn { height:var(--btn-h-lg); padding:0 18px; min-width:var(--w-120); font-weight:800; display:inline-flex; align-items:center; justify-content:center; }
#btnCancelShift.btn { background:#f3f4f6; border-color:#d1d5db; color:#111827; }
#btnCancelShift.btn:hover { background:#e5e7eb; }
#btnSaveShift.btn { background:var(--primary); border-color:var(--primary); color:#fff; }
#btnSaveShift.btn:hover { background:var(--primary-hover); border-color:var(--primary-hover); }
/* multi segment editor */
#shiftEditModal .seg-list { display:flex; flex-direction:column; gap:8px; }
#shiftEditModal .seg-row { display:flex; align-items:center; gap:8px; justify-content:center; }
#shiftEditModal .seg-row input[type="time"] { height:36px; padding:0 8px; border:1px solid #e5e7eb; border-radius:var(--radius-8); }
#shiftEditModal .seg-row .seg-del { height:28px; padding:0 10px; }
#kintaiLogContainer { margin:4px auto 16px; }
#kintaiLogContainer .table-host { overflow:auto; max-height:calc(100vh - 320px); position:relative; }
.card.table-card { padding:16px 0; }
.card.table-card .table-shell { background:#fff; border-radius:var(--radius-16); box-shadow:0 10px 30px rgba(15,23,42,0.08); border:1px solid #e2e8f0; overflow:hidden; }
.card.table-card .table-host { overflow:auto; max-height:calc(100vh - 320px); position:relative; }

/* -------------------------------
   給与明細カード（kintai_syukei_meisai.php）
-------------------------------- */
.pay-card { background: var(--card); overflow: hidden; }
.pay-card .pay-title { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 12px; border-radius:var(--radius-10); background:#2F6B4F; color:#fff; font-weight:800; }
.pay-card .pay-title .left { font-size:1rem; }
.pay-card .pay-title .right { font-size:.95rem; }
.pay-card .pay-subline { margin-top:6px; padding:6px 10px; border:1px solid #e5e7eb; border-radius:var(--radius-10); background:#f8fafc; color:#111827; font-size:.92rem; }
.pay-card .pay-grid { display:flex; flex-direction:column; align-items:flex-start; gap:12px; margin-top:12px; }
.pay-card .meisai-item { margin:0; padding:0; background:#fff; border-radius:var(--radius-14); border:1px solid #d8e0ea; box-shadow:0 10px 28px rgba(15,23,42,0.08); display:inline-flex; overflow:hidden; }
.pay-card .meisai-item + .meisai-item { margin-top:0; }
.pay-card .meisai-item table.meisaitable { width:auto; max-width:100%; display:inline-table; border-collapse:collapse; background:#fff; border:0; box-sizing:border-box; }
.pay-card .ops .pay-btn { display:inline-flex; align-items:center; justify-content:center; min-width:132px; height:38px; padding:0 18px; border-radius:var(--radius-10); font-size:.95rem; font-weight:700; text-align:center; }
.pay-card .ops .pay-btn--add { background:var(--primary); border-color:var(--primary); color:#fff; }
.pay-card .ops .pay-btn--add:hover { background:var(--primary-hover); border-color:var(--primary-hover); }
.pay-card .ops .pay-btn--confirm { background:#16a34a; border-color:#15803d; color:#fff; }
.pay-card .ops .pay-btn--confirm:hover { background:#15803d; border-color:#14532d; }
.pay-card .ops .pay-btn--confirmed { background:#4b5563; border-color:#4b5563; color:#fff; }
.pay-card .ops .pay-btn--confirmed:hover { background:#374151; border-color:#374151; }
.pay-card table.meisaitable th { background:#f8fafc; padding:6px 8px; text-align:center; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-sizing:border-box; width:120px; min-width:120px; }
.pay-card table.meisaitable th.label { background:#fff; text-align:center; width:120px; min-width:120px; }
.pay-card table.meisaitable th.editable { background:#fff; padding:4px; }
.pay-card table.meisaitable th.disabled { background:#f3f4f6; }
.pay-card table.meisaitable td { padding:6px 8px; text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-sizing:border-box; width:120px; min-width:120px; }
/* 内側の格子線と外枠を明示 */
.pay-card table.meisaitable th, .pay-card table.meisaitable td { border:1px solid #cbd5e1; }
.pay-card .pay-edit-btn { display:inline-flex; align-items:center; justify-content:center; width:100%; min-height:30px; padding:4px 8px; border-radius:var(--radius-8); border:1px solid #cbd5e1; background:#fff; font-size:.92rem; font-weight:700; color:var(--info); cursor:pointer; transition:all .18s ease; }
.pay-card .pay-edit-btn:hover { background:#eff6ff; border-color:var(--info); color:var(--info-hover); box-shadow:0 8px 20px color-mix(in srgb, var(--info) 16%, transparent); }
.pay-card .pay-edit-btn[disabled] { opacity:.6; cursor:not-allowed; color:#9ca3af; border-color:#e5e7eb; background:#f9fafb; box-shadow:none; }
@media (max-width: 1024px) {
  .pay-card .pay-grid { width:100%; }
}

/* ========== [5] Pages（.haccp-page, .torihiki-ichiran などの最小上書き） ========== */

/* -------------------------------
   HACCP 管理ページ
-------------------------------- */
body.haccp-page {
  background: var(--surface, #f3f4f6);
  color: #111827;
}
body.haccp-page .container {
  width: 1440px;
  margin: 18px auto;
}
@media (max-width: 1280px) {
  body.haccp-page .container { width: 100%; padding: 0 14px; box-sizing: border-box; }
}
.haccp-card {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 20px 20px 24px;
}
.haccp-card .card-title {
  margin: 0;
  font-size: 1.18rem;
  font-weight: 700;
  color: #0f172a;
}
.haccp-card .card-subtitle {
  margin: 0;
  font-size: .92rem;
  color: #4b5563;
}
.haccp-header-nav {
  margin-top: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.haccp-header-nav .chip {
  padding: 6px 16px;
  border-radius: 9999px;
  border: 1px solid #d1d5db;
  background: #fff;
  font-weight: 600;
  color: #1f2937;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.haccp-header-nav .chip:hover {
  border-color: #94a3b8;
  background: #f8fafc;
  color: var(--info-hover);
}
.haccp-header-nav .chip.is-active,
.haccp-header-nav .chip[aria-current="page"] {
  background: var(--info-hover);
  border-color: var(--info-hover);
  color: #fff;
}
.haccp-header-nav .chip.is-disabled {
  pointer-events: none;
  background: #f3f4f6;
  border-color: #e5e7eb;
  color: #9ca3af;
}
.haccp-subheader {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 8px 10px;
}
.haccp-subheader form {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  width: 100%;
}
.haccp-filter-group {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.haccp-filter-group label {
  margin: 0;
  font-weight: 600;
  color: #1f2937;
}
.haccp-filter-group select,
.haccp-filter-group input {
  height: 34px;
  padding: 6px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  font-size: .95rem;
  color: inherit;
}
.haccp-store-chips {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.haccp-store-chips .chip {
  padding: 6px 16px;
  border-radius: 9999px;
  border: 1px solid #d1d5db;
  background: #fff;
  font-weight: 600;
  color: #1f2937;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.haccp-store-chips .chip:hover {
  border-color: #94a3b8;
  background: #f8fafc;
  color: var(--info-hover);
}
.haccp-store-chips .chip.is-active {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: var(--info-hover);
}
.chip-static {
  background: #e5e7eb;
  border-color: #d1d5db;
  color: #1f2937;
  cursor: default;
}
.haccp-subheader .haccp-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-left: auto;
}
.haccp-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.haccp-nav .chip {
  padding: 6px 14px;
  border-radius: 9999px;
  border-width: 1px;
  border-color: #d1d5db;
  color: #1f2937;
  font-weight: 600;
  background: #fff;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.haccp-nav .chip:hover {
  border-color: #94a3b8;
  background: #f8fafc;
  color: var(--info-hover);
}
.haccp-nav .chip.is-active,
.haccp-nav .chip[aria-current="page"] {
  background: var(--info-hover);
  border-color: var(--info-hover);
  color: #fff;
}
.haccp-nav .chip.is-disabled {
  pointer-events: none;
  background: #f3f4f6;
  border-color: #e5e7eb;
  color: #9ca3af;
  cursor: not-allowed;
}
.haccp-table-wrapper {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(15,23,42,0.08);
  margin-top: 12px;
}
.haccp-table-scroll {
  overflow-x: auto;
}
.haccp-table-scroll.is-sticky-head {
  max-height: 520px;
  overflow-y: auto;
}
.haccp-table-section { margin-top: 12px; border: 1px solid #e2e8f0; border-radius: 14px; background:#fff; box-shadow: 0 12px 30px rgba(15,23,42,0.08); overflow:hidden; }
.haccp-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px;
  font-size: .95rem;
  color: #0f172a;
}
.haccp-table-incheck { table-layout: fixed; }
.haccp-check-table th,
.haccp-check-table td { vertical-align: middle; }
.haccp-check-table th:nth-child(1),
.haccp-check-table td:nth-child(1) { width: 160px; white-space: nowrap; }
.haccp-check-table th:nth-child(n+2):nth-child(-n+7),
.haccp-check-table td:nth-child(n+2):nth-child(-n+7) {
  width: 120px;
  white-space: normal;
  word-break: break-word;
}
.haccp-check-table th:nth-child(n+2):nth-child(-n+7) { text-align: center; font-size: 0.86rem; line-height: 1.3; }
.haccp-check-table td:nth-child(n+2):nth-child(-n+7) { text-align: center; }
.haccp-check-table th:nth-child(8),
.haccp-check-table td:nth-child(8) { width: 200px; white-space: nowrap; }
.haccp-check-table td:nth-child(9) { white-space: normal; min-width: 240px; word-break: break-word; }
.haccp-table caption {
  caption-side: top;
  padding: 12px 12px 6px;
  font-weight: 700;
  font-size: 1rem;
  text-align: left;
  color: #1f2937;
}
.haccp-table caption .caption-meta {
  display: block;
  margin-top: 4px;
  font-size: .85rem;
  font-weight: 500;
  color: #475569;
}
.haccp-table th,
.haccp-table td {
  padding: 10px 12px;
  text-align: center;
  border-bottom: 1px solid #e2e8f0;
  border-right: 1px solid #e2e8f0;
  background: #fff;
}
.haccp-table th:last-child,
.haccp-table td:last-child { border-right: none; }
.haccp-table thead th {
  background: #f8fafc;
  font-weight: 700;
  color: #1f2937;
  position: sticky;
  top: 0;
  z-index: 1;
}
.haccp-table tbody tr:nth-child(even) td {
  background: #f9fafb;
}
.haccp-table tfoot td {
  background: #eef2ff;
  font-weight: 700;
}
.haccp-table input[type="time"],
.haccp-table input[type="number"],
.haccp-table input[type="text"],
.haccp-table select,
.haccp-table textarea {
  width: 100%;
  box-sizing: border-box;
  border: none;
  background: transparent;
  font: inherit;
  color: inherit;
  padding: 4px 6px;
  text-align: center;
}
.haccp-table input[type="number"] { text-align: right; }
.haccp-table textarea { resize: vertical; min-height: 40px; text-align: left; }
.haccp-table select { cursor: pointer; }
.haccp-table input:focus,
.haccp-table select:focus,
.haccp-table textarea:focus {
  outline: 2px solid var(--ring);
  outline-offset: 2px;
  border-radius: 6px;
  background: rgba(59,130,246,.08);
}
.haccp-message {
  margin: 0;
  padding: 12px 16px;
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  color: #1f2937;
  font-size: .9rem;
  line-height: 1.6;
}
.haccp-message strong {
  font-weight: 700;
  color: var(--info-hover);
}
.haccp-actions .btn {
  height: 36px;
  padding: 0 16px;
  font-weight: 700;
}
.haccp-empty {
  padding: 36px;
  text-align: center;
  color: #6b7280;
  background: #f9fafb;
  border-radius: 14px;
  border: 1px dashed #d1d5db;
  font-size: .95rem;
}

/* モバイル調整 */
@media (max-width: 768px) {
  .haccp-card { padding: 16px 14px 20px; gap: 16px; }
  .haccp-subheader form { gap: 10px; }
  .haccp-filter-group { width: 100%; }
  .haccp-filter-group select,
  .haccp-filter-group input { width: 100%; }
  .haccp-actions { width: 100%; justify-content: flex-end; }
  .haccp-nav { gap: 6px; }
  .haccp-nav .chip { padding: 6px 12px; font-size: .9rem; }
  .haccp-table { min-width: 640px; font-size: .9rem; }
}

/* -------------------------------
   給与明細モーダル（手当追加／修正）- 共通スキンとの差分
-------------------------------- */
.ui-dialog:is([aria-describedby="addTeate"], [aria-describedby="teateEdit"]) {
  overflow: hidden;
}
.ui-dialog:is([aria-describedby="addTeate"], [aria-describedby="teateEdit"]) .ui-dialog-titlebar {
  padding: 8px 12px;
}
.ui-dialog .ui-dialog-content#addTeate,
.ui-dialog .ui-dialog-content#teateEdit {
  padding:14px 16px;
}
#addTeate table, #teateEdit table {
  width:100%;
  border-collapse:separate;
  border-spacing:0 8px;
  margin:6px 0 0;
}
#addTeate td:first-child, #teateEdit td:first-child {
  color:#374151;
  font-weight:700;
  white-space:nowrap;
  width:160px;
}
#addTeate input[type="text"], #addTeate input[type="number"], #addTeate select,
#teateEdit input[type="text"], #teateEdit input[type="number"], #teateEdit select {
  height:36px;
  padding:6px 10px;
  border:1px solid #e5e7eb;
  border-radius:var(--radius-10);
  background:#fff;
  font-size:14px;
  box-sizing:border-box;
  width:min(260px, 100%);
}
#addTeate hr, #teateEdit hr { border:none; border-top:1px solid #e5e7eb; margin:8px 0 12px; }

/* モーダル内のボタン（登録/修正/削除）を統一トーンに */
#addTeate button[type="submit"],
#teateEdit button[type="submit"] {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:38px;
  min-width: var(--w-140);
  padding:0 18px;
  border-radius:var(--radius-10);
  border:1px solid #e5e7eb;
  background:#fff;
  font-weight:800;
  cursor:pointer;
}
#addTeate button[name="addTeate_submit"],
#teateEdit button[name="editTeate_submit"] {
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
#addTeate button[name="addTeate_submit"]:hover,
#teateEdit button[name="editTeate_submit"]:hover {
  background:var(--primary-hover);
  border-color:var(--primary-hover);
}
#teateEdit button[name="delTeate_submit"] {
  background:#ef4444;
  border-color:#ef4444;
  color:#fff;
}
#teateEdit button[name="delTeate_submit"]:hover {
  background:#dc2626;
  border-color:#dc2626;
}

/* -------------------------------
   確定/確定済み モーダル（kakutei / editAble）
   機能はそのまま、見た目のみ統一
-------------------------------- */
.ui-dialog:is([aria-describedby="kakutei"], [aria-describedby="editAble"]) {
  overflow:hidden;
}
.ui-dialog:is([aria-describedby="kakutei"], [aria-describedby="editAble"]) .ui-dialog-titlebar {
  padding:8px 12px;
}
.ui-dialog .ui-dialog-content#kakutei,
.ui-dialog .ui-dialog-content#editAble {
  padding:14px 16px;
}
#kakutei p, #editAble p { margin:6px 0 8px; color:#111827; font-weight:700; text-align:center; }
#kakutei hr, #editAble hr { border:none; border-top:1px solid #e5e7eb; margin:8px 0 12px; }

/* モーダルの操作ボタン（はい/いいえ・許可/いいえ） */
#kakutei button, #editAble button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:38px;
  min-width: var(--w-140);
  padding:0 18px;
  border-radius:var(--radius-10);
  border:1px solid #e5e7eb;
  background:#fff;
  font-weight:800;
  cursor:pointer;
}
#kakutei button[name="kakutei_submit"],
#editAble button[name="edit_submit"] {
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
#kakutei button[name="kakutei_submit"]:hover,
#editAble button[name="edit_submit"]:hover {
  background:var(--primary-hover);
  border-color:var(--primary-hover);
}

/* -------------------------------
   店舗アカウント パスワード設定 モーダル
-------------------------------- */
.ui-dialog[aria-describedby="storeAccPassDialog"] {
  overflow:hidden;
}
.ui-dialog[aria-describedby="storeAccPassDialog"] .ui-dialog-titlebar {
  padding:8px 12px;
}
.ui-dialog .ui-dialog-content#storeAccPassDialog {
  padding:14px 16px;
}
.ui-dialog .ui-dialog-content#storeAccPassDialog p { margin:6px 0 8px; color:#111827; }
.ui-dialog .ui-dialog-content#storeAccPassDialog hr { border:none; border-top:1px solid #e5e7eb; margin:8px 0 12px; }
.ui-dialog .ui-dialog-content#storeAccPassDialog input[type="text"] {
  height:36px; padding:6px 10px; border:1px solid #e5e7eb; border-radius:var(--radius-10); background:#fff; font-size:14px; width:min(300px, 92%);
}
.ui-dialog .ui-dialog-content#storeAccPassDialog button#storeAccPassSubmit {
  display:inline-flex; align-items:center; justify-content:center; height:38px; min-width:var(--w-120); padding:0 16px; border-radius:var(--radius-10); border:1px solid #e5e7eb; background:var(--primary); color:#fff; font-weight:800; cursor:pointer;
}
.ui-dialog .ui-dialog-content#storeAccPassDialog button#storeAccPassSubmit:hover {
  background:var(--primary-hover); border-color:var(--primary-hover);
}
#kakutei button[name="kakutei_cansel"],
#editAble button[name="edit_cansel"] {
  background:#f3f4f6;
  border-color:#d1d5db;
  color:#111827;
}
#kakutei button[name="kakutei_cansel"]:hover,
#editAble button[name="edit_cansel"]:hover {
  background:#e5e7eb;
}
.kintai-tooltip {
  position:fixed;
  z-index:10000;
  background:#111827;
  color:#fff;
  padding:8px 10px;
  border-radius:var(--radius-8);
  font-size:12px;
  line-height:1.4;
  max-width:240px;
  pointer-events:none;
  box-shadow:0 8px 24px rgba(15,23,42,0.2);
  opacity:0;
  transition:opacity .12s ease;
}
.kintai-tooltip.show { opacity:1; }
.manual-modal { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:10040; padding:24px; background:rgba(15,23,42,0.45); }
.manual-modal[hidden] { display:none; }
.manual-modal__backdrop { position:absolute; inset:0; background:transparent; }
.manual-modal__panel { position:relative; display:flex; flex-direction:column; width:min(960px, 95vw); height:min(92vh, 900px); background:#fff; border-radius:var(--radius-14); box-shadow:0 24px 60px rgba(15,23,42,0.25); overflow:hidden; }
.manual-modal__head { display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-bottom:1px solid #e5e7eb; background:#f8fafc; }
.manual-modal__title { font-size:16px; font-weight:700; color:#0f172a; }
.manual-modal__close { padding:6px 12px; border:1px solid #d1d5db; border-radius:var(--radius-8); background:#fff; cursor:pointer; font-size:13px; }
.manual-modal__close:hover { background:#f3f4f6; }
.manual-modal__body { position:relative; flex:1 1 auto; background:#f1f5f9; }
.manual-modal__body iframe { width:100%; height:100%; border:0; background:#fff; }
.manual-modal.is-loading .manual-modal__body::after { content:''; position:absolute; inset:0; background:rgba(255,255,255,0.65); }
.manual-modal.is-loading .manual-modal__body::before {
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  width:42px;
  height:42px;
  margin:-21px 0 0 -21px;
  border-radius:50%;
  border:4px solid rgba(59,130,246,0.35);
  border-top-color:var(--info);
  animation:manual-modal-spin 0.75s linear infinite;
}
@keyframes manual-modal-spin {
  to { transform:rotate(360deg); }
}
html.manual-modal-open { overflow:hidden; }
/* Kintai log check modal */
#kModal { display:none; position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width:min(900px, 92vw); max-height:86vh; min-width:420px; min-height:240px; background:#fff; border-radius:var(--radius-10); box-shadow:0 10px 30px rgba(0,0,0,.3); z-index:9999; overflow:hidden; flex-direction:column; font-family:system-ui, sans-serif; }
.kModal__head { padding:12px 16px; border-bottom:1px solid #eee; display:flex; justify-content:space-between; align-items:center; background:#f7f9fc; }
.kModal__title { font-size:16px; font-weight:600; }
.kModal__close { padding:4px 10px; font-size:13px; border:1px solid #ddd; border-radius:6px; background:#fff; cursor:pointer; }
#kBody { flex:1 1 auto; margin:0; padding:30px 40px; overflow-y:auto; white-space:pre-wrap; word-break:break-word; font-size:15px; line-height:1.8; }
.btn-ai { padding:10px 16px; border:0; border-radius:6px; background:#0b79d0; color:#fff; cursor:pointer; font-size:14px; font-weight:600; position:fixed; right:16px; bottom:16px; z-index:9997; box-shadow:0 4px 10px rgba(0,0,0,0.25); transition:all 0.2s ease; }
.btn-ai:hover { background:#095f9f; transform:translateY(-2px); box-shadow:0 6px 14px rgba(0,0,0,0.3); }
.btn-ai:disabled { background:#ccc; cursor:not-allowed; transform:none; box-shadow:none; }
.save-toast { position:fixed; right:16px; bottom:16px; background:#111827; color:#fff; padding:10px 12px; border-radius:var(--radius-10); box-shadow:0 10px 25px rgba(0,0,0,.15); display:none; z-index:9999; }

/* Budget base data form */
.card.base-card {
  padding: 0;
  background: var(--card);
  border-radius: var(--radius-16);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.base-data-card { margin: 24px 0; }
.base-data-form { margin: 0; }
.base-data-container { margin: 10px auto 32px; }
.base-data-card + .base-data-card { margin-top: 28px; }
.base-card .card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid #e5e7eb;
  background: #f8fafc;
}
.base-card .card-actions { margin-left:auto; display:flex; align-items:center; gap:10px; }
.kiso-import-form { margin: 0; }
.kiso-import-btn { min-height: 30px; padding: 0 12px; font-weight: 700; }
.card-headline { display: flex; flex-direction: column; gap: 4px; }
.base-card .card-title { margin: 0; font-size: 1.05rem; font-weight: 700; color: #1f2937; }
.base-card .card-meta { margin: 0; font-size: .78rem; color: var(--muted); }
.base-card .card-body { padding: 24px; display: flex; flex-direction: column; gap: 24px; }
/* コンパクト版（基礎データ/予測） */
.base-data-card .card-body {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 18px;
  padding: 18px;
}
.base-data-card .sec-extra,
.base-data-card .sec-settings { grid-column: 1 / -1; }
.base-forecast-card .card-body { padding: 18px; gap: 14px; }
.base-forecast-card .table-wrap table th,
.base-forecast-card .table-wrap table td { padding: 6px 8px; font-size: .9rem; }
.base-forecast-card .sec-forecast .button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 32px;
  padding: 6px 14px;
  margin: 12px 0 0 auto;
  border: 1px solid #d1d5db;
  border-radius: var(--radius-10);
  background: #fff;
  color: #1f2937;
  font-weight: 700;
  box-shadow: none;
}
.base-forecast-card .sec-forecast .button:hover { background: #f3f4f6; border-color: #cbd5e1; }
.base-data-section { display: flex; flex-direction: column; gap: 12px; }
.base-data-section-title { margin: 0; font-size: .9rem; font-weight: 700; color: #1f2937; }
.base-data-section-title { text-align: left; }
.base-data-grid { display: grid; gap: 12px 18px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.base-data-card .base-data-grid { justify-items: start; }
.base-data-grid--tight { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px 14px; }
.base-data-grid--left { justify-items: start; }
.base-data-card .sec-cost .base-data-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.base-data-card .sec-goal .base-data-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 14px;
}
.base-data-card .base-data-item { gap: 4px; }
.base-data-card .base-data-label { font-size: .78rem; }
.base-data-card .base-data-control { justify-content: flex-start; }
.base-data-card .base-data-control input[type="number"] {
  padding: 5px 9px;
  max-width: 94px;
  flex: 0 1 94px;
}
.base-data-card .sec-cost .base-data-control input[type="number"],
.base-data-card .sec-goal .base-data-control input[type="number"] {
  max-width: 120px;
  flex: 0 1 120px;
}
.base-data-item { display: flex; flex-direction: column; gap: 6px; }
.base-data-label { font-size: .8rem; font-weight: 600; color: var(--muted); display:block; margin-left:0; padding-left:0; text-align:left; }
.base-data-control { display: flex; align-items: center; gap: 8px; width:100%; }
.base-data-control input[type="number"] {
  flex: 1 1 auto;
  width: 100%;
  padding: 6px 10px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font: inherit;
  color: inherit;
  background: #fff;
}
.gyoseki-nippou input[type="number"] { text-align: right; }
.base-data-control input[type="number"]:focus {
  outline: 3px solid var(--ring);
  outline-offset: 1px;
}
.base-data-item.is-narrow .base-data-control input[type="number"] {
  width: 160px;
  max-width: 200px;
}
@media (max-width: 768px) {
  .base-data-item.is-narrow .base-data-control input[type="number"] { width: 140px; }
}
.base-data-suffix { font-size: .78rem; color: var(--muted); }
.base-data-value { font-weight: 700; font-size: 1rem; padding: 6px 0; }
.base-stat-group { display: flex; flex-wrap: wrap; gap: 16px; }
.base-stat {
  min-width: 160px;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #f8fafc;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.05);
}
.base-stat-label { display: block; font-size: .75rem; font-weight: 600; color: var(--muted); }
.base-stat-value { display: block; margin-top: 6px; font-size: 1.2rem; font-weight: 700; color: #111827; }
.base-staff-body { gap: 20px; }
.base-staff-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.base-staff-grid { justify-items: start; }
.base-staff-item {
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #fff;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.07);
  max-width: 420px;
}
.base-staff-name { font-weight: 700; font-size: .92rem; color: #111827; margin-bottom: 10px; }
.base-staff-fields { display: flex; flex-wrap: wrap; gap: 12px; }
.base-staff-field { flex: 1 1 120px; display: flex; flex-direction: column; gap: 6px; }
.base-staff-field label { font-size: .75rem; font-weight: 600; color: var(--muted); }
.base-staff-field input[type="number"] {
  width: 100%;
  max-width: none;
  padding: 6px 10px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font: inherit;
  color: inherit;
  background: #fff;
}
.base-staff-field input[type="number"]:focus {
  outline: 3px solid var(--ring);
  outline-offset: 1px;
}

.base-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  margin-top: -4px;
}
.base-summary-label {
  font-size: .85rem;
  font-weight: 700;
  color: #475569;
}
.base-summary-value {
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: 0.02em;
}

@media (max-width: 768px) {
  .base-card .card-head { padding: 16px; }
  .base-card .card-body { padding: 18px; }
  .base-data-container { margin: 10px auto 24px; }
  .base-staff-fields { flex-direction: column; }
}

/* two-column wrapper for staff + inventory cards */
.pair-grid { display:grid; grid-template-columns: 1fr 1fr; gap:22px; align-items:flex-start; margin: 10px 0 24px; }
@media (max-width: 1280px) { .pair-grid { grid-template-columns: 1fr; } }
.pair-grid > .base-card { min-width: 0; }
.pair-grid.settings-tana-grid > .base-card,
.pair-grid.staff-forecast-grid > .base-card { width: 100%; }
.staff-forecast-grid { grid-template-columns: 1fr 1fr; }
/* 予測と予算の並びは pair-grid へ移行。売上予算カードは常に100%幅 */
.base-budget-card { display:block; width:100%; margin-right:0; }

/* -------------------------------
   EIS 集計ページ
-------------------------------- */
body.eis-page { background: var(--bg); color: var(--text); }
.eis-card { padding: 24px 26px; display:flex; flex-direction:column; gap:18px; }
.eis-card__header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.eis-card__title { margin:0; font-size:22px; font-weight:700; color:#0f172a; }
.eis-card__meta { margin:4px 0 0; font-size:.88rem; color:var(--muted); }
.eis-table { width:100%; min-width:1080px; border-collapse:collapse; background:#fff; table-layout:fixed; --eis-head-row1:48px; --eis-head-row2:48px; }
.eis-table th,
.eis-table td { border:1px solid #e5e7eb; padding:8px 10px; font-size:13px; color:#1f2937; text-align:center; }
.eis-table thead th { background:#f8fafc; font-weight:700; color:#0f172a; }
.eis-table thead tr:nth-child(1) th { position: sticky; top: 0; z-index: 6; }
.eis-table thead tr:nth-child(2) th { position: sticky; top: var(--eis-head-row1); z-index: 5; }
.eis-table thead th.group-heading { text-align:center; font-size:13px; }
.eis-table tbody tr:nth-child(even) td { background:#f9fafb; }
.eis-table tbody tr:hover td { background:#eef2ff; }
.eis-table td.text-left,
.eis-table th.text-left { text-align:left; }
.eis-table td.text-right { text-align:right; }
.eis-table td.metric-strong { font-weight:700; }
.eis-table td.cell-average { background:#eef2ff; font-weight:700; }
.eis-table th.col-rank,
.eis-table td.col-rank { width:64px; min-width:64px; }
.eis-table th.col-tenpo,
.eis-table td.col-tenpo { width:260px; min-width:260px; max-width:320px; text-align:left; }
.eis-table td.col-tenpo { white-space:normal; word-break:break-word; overflow-wrap:anywhere; }
.eis-table th.col-total,
.eis-table td.col-total { width:96px; min-width:96px; }
.eis-table th.col-metric,
.eis-table td.col-metric,
.eis-table th.header-average,
.eis-table td.header-average,
.eis-table th.col-extra,
.eis-table td.col-extra { width:96px; min-width:96px; }
.eis-table th.col-rate,
.eis-table td.col-rate,
.eis-table th.col-count,
.eis-table td.col-count { width:96px; min-width:96px; }
.eis-table th.vertical-header {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  padding: 12px 6px;
  white-space: nowrap;
  vertical-align: middle;
  line-height: 1.2;
}
.eis-table th.vertical-header .vertical-label { display:inline-block; }
.eis-table tr.is-focus td { background:#ecfdf5; }
.eis-table tr.is-focus.is-low-response td { background:#fef9c3; }
.eis-table tr.is-low-response td { background:#f3f4f6; color:#6b7280; }
.eis-table tr.is-no-response td { color:#9ca3af; font-style:italic; }
.eis-table tr.is-summary td { background:#f1f5f9; font-weight:700; }
.eis-table tr.is-summary td.summary-label { text-align:left; color:#0f172a; }
.eis-empty { padding:32px 0; text-align:center; color:var(--muted); font-size:.95rem; }

/* Forecast/Budget tables: equalized column widths */
.table-wrap { overflow-x: auto; position: relative; }
.table-wrap.torihiki-table-wrap { overflow: visible; }
.torihiki-table-container { position: relative; display: flex; flex-direction: column; gap: 0; }
.torihiki-table-head { position: relative; z-index: 120; }
.torihiki-table-head-inner { overflow: hidden; border-radius: var(--radius-12) var(--radius-12) 0 0; border: 1px solid #e5e7eb; border-bottom: 0; background: var(--card); box-shadow: var(--shadow); }
.torihiki-table-head .torihiki-table-base { border: 0; box-shadow: none; border-radius: var(--radius-12) var(--radius-12) 0 0; }
.torihiki-table-form { border-left:1px solid #e5e7eb; border-right:1px solid #e5e7eb; background: var(--card); }
.torihiki-table-form .torihiki-table-base { border:0; box-shadow:none; }
.torihiki-table-form td { background:#fff; }
.torihiki-ichiran #torihikiEditForm { position:relative; }
.torihiki-table-main tr.is-updated { animation: torihiki-row-flash 0.9s ease-out; }
.torihiki-table-main tr.is-updated td {
  background:#e0f2ff !important;
  transition: background 1.2s ease-out;
}
#torihikiExportBtn.is-loading {
  opacity:0.6;
  cursor:wait;
}
#torihikiExportBtn.is-loading img {
  animation: torihiki-spin 0.9s linear infinite;
}
.modal-loading { display:none; position:absolute; inset:0; background:rgba(255,255,255,0.72); align-items:center; justify-content:center; z-index:5; }
.modal-loading .spinner { width:46px; height:46px; border:4px solid #d1d5db; border-top-color:var(--info); border-radius:50%; animation:torihiki-spin 0.9s linear infinite; }
@keyframes torihiki-spin { to { transform:rotate(360deg); } }
@keyframes torihiki-row-flash {
  0% { transform:scale(1.005); }
  100% { transform:scale(1); }
}
.torihiki-genkin-summary { position:relative; display:flex; align-items:center; gap:18px; padding:12px 16px; border:1px solid #e5e7eb; border-bottom:0; border-radius:var(--radius-12) var(--radius-12) 0 0; background:var(--card); }
.torihiki-genkin-summary .genkin-toggle { margin-right:auto; }
.torihiki-genkin-summary .toggle-pill { background:#f4f4f5; border:1px solid #d1d5db; }
.torihiki-genkin-summary .toggle-pill label { font-size:.95rem; font-weight:700; padding:0 18px; }
.torihiki-genkin-summary .btn-zandaka {
  padding:6px 18px;
  border-radius:999px;
  border:1px solid var(--primary);
  background:var(--primary);
  color:#fff;
  font-weight:700;
  transition:background .15s ease, border-color .15s ease, transform .08s ease;
  margin-left:auto;
}
.torihiki-genkin-summary .btn-zandaka:hover {
  background:var(--primary-hover);
  border-color:var(--primary-hover);
}
.torihiki-table-body {
  overflow: auto;
  border-radius: 0 0 var(--radius-12) var(--radius-12);
  border: 1px solid #e5e7eb;
  border-top: 0;
  background: var(--card);
  box-shadow: var(--shadow);
  max-height: min(62vh, 720px);
}
.torihiki-table-body .torihiki-table-base { border: 0; box-shadow: none; border-radius: 0 0 var(--radius-12) var(--radius-12); }
.torihiki-table-body table#torihikitable thead.torihiki-body-thead { display: none; }
.torihiki-table-head-inner table { transform: translateX(0); transition: transform .1s ease-out; }

@media (max-width: 1024px) {
  .torihiki-table-body { max-height: min(68vh, 620px); }
}

@media (max-width: 640px) {
  .torihiki-table-body { max-height: 70vh; }
}
.base-forecast-card .table-wrap table,
.base-budget-card  .table-wrap table { table-layout: fixed; width: 100%; }
.base-forecast-card .table-wrap table th,
.base-forecast-card .table-wrap table td { width: 25%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.base-budget-card  .table-wrap table th,
.base-budget-card  .table-wrap table td { width: auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.base-budget-card  col.col-date     { width: 22%; }
.base-budget-card  col.col-week     { width: 64px !important; }
.base-budget-card  col.col-forecast { width: 15%; }
.base-budget-card  col.col-week-ly  { width: 64px !important; }
.base-budget-card  col.col-lyvalue  { width: 17%; }
.base-budget-card  col.col-budget   { width: 15%; }
.base-budget-card  col.col-actual   { width: 15%; }
.base-budget-card table th:nth-child(2),
.base-budget-card table th:nth-child(4),
.base-budget-card table td:nth-child(2),
.base-budget-card table td:nth-child(4) {
  text-align: center;
}

/* Bottom submit button: prominent wide rounded */
.gyoseki-nippou button.button {
  appearance: none;
  display: block;
  width: min(720px, 94%);
  padding: 18px 40px;
  margin: 28px auto 48px;
  border: none;
  border-radius: var(--radius-16);
  background: var(--primary);
  color: #fff;
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: .02em;
  box-shadow: 0 14px 32px rgba(57, 143, 61, .28);
  cursor: pointer;
  transition: background-color .15s ease, box-shadow .15s ease, transform .08s ease;
}
.gyoseki-nippou button.button:hover { background: var(--primary-hover); box-shadow: 0 16px 36px rgba(47,122,51,.32); }
.gyoseki-nippou button.button:active { transform: translateY(1px); }

/* =========================================================
   Gyoseki Top: App Grid
   menu.php のカードと調和するシンプルなアイコンメニュー
   ========================================================= */
.app-grid {
  display:grid;
  grid-template-columns: repeat(6, 1fr);
  gap:14px;
}
@media (max-width: 1280px) {
  .app-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1024px) {
  .app-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .app-grid { grid-template-columns: repeat(2, 1fr); }
}
.app-item {
  background: var(--card);
  border:1px solid #e5e7eb;
  border-radius:var(--radius-12);
  padding:14px 10px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color:inherit;
  transition: background-color .15s ease, border-color .15s ease, transform .02s ease;
}
.app-item:hover { background:#f9fafb; border-color:#d1d5db; }
.app-item:active { transform: translateY(1px); }
.app-item img { width:50px; height:50px; object-fit:contain; margin-bottom:8px; }
.app-item .label { font-weight:700; font-size:.95rem; text-align:center; }

/* Utility */
.card.no-padding { padding:0; }
/* (reverted) previously added overflow + table-layout styles for #table-debug */

/* =========================================================
   Debug table: TH separators (H1/H2)
   - H2の縦線も表示する（安全に戻せるよう末尾で上書き）
   ========================================================= */
table#table-debug thead th.sep-h1 { border-left: 1px solid #cbd0d8 !important; }
table#table-debug thead th.sep-h2 { border-left: 1px solid #cbd0d8 !important; }
/* Header colors: temporarily set all header backgrounds to white */
table#table-debug thead tr:nth-child(1) th,
table#table-debug thead tr:nth-child(2) th,
table#table-debug thead tr:nth-child(3) th,
table#table-debug thead th[data-colgroup],
table#table-debug thead th {
  background:#fff !important;
  color:#111827 !important;
  border-color:#e5e7eb !important;
}
/* Neutralize group tint lines except separators */
table#table-debug thead th[data-colgroup]:not(.sep-h1):not(.sep-h2) {
  border-left: 1px solid #fff !important;
}

/* =========================================================
   Header group underline (Google-like, minimal palette)
   - グループ判別を下端の太線のみで行う
   - 太さは4px（必要に応じて調整）
   ========================================================= */
table#table-debug thead tr:nth-child(3) th {
  border-bottom: 6px solid #e5e7eb !important; /* デフォルト（無指定/店舗など） */
}
/* 売上管理: Google Blue */
table#table-debug thead tr:nth-child(3) th.th-u { border-bottom-color: #1a73e8 !important; }
/* FL/人件費: Google Green */
table#table-debug thead tr:nth-child(3) th.th-fl { border-bottom-color: #34a853 !important; }
/* 原価: Google Amber */
table#table-debug thead tr:nth-child(3) th.th-genka { border-bottom-color: #f6bf26 !important; }
/* その他: Neutral Gray */
table#table-debug thead tr:nth-child(3) th.th-etc { border-bottom-color: #9aa0a6 !important; }
/* 利益: Teal（控えめな差別化） */
table#table-debug thead tr:nth-child(3) th.th-profit { border-bottom-color: #00acc1 !important; }
/* 左端固定（店舗/日付）: 売上管理と同色に統一 */
table#table-debug thead tr:nth-child(3) th.col-tenpo { border-bottom-color: #1a73e8 !important; }

/* =========================================================
   Header typography (readability)
   - 段ごとにウェイト差で視認性を向上
   - TH2/TH3 を左寄せ、微小レタスペで詰まりを緩和
   ========================================================= */
table#table-debug thead tr:nth-child(1) th {
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: .01em !important;
  text-align: left !important;
}
table#table-debug thead tr:nth-child(2) th {
  font-weight: 600 !important;
  font-size: 12.5px !important;
  letter-spacing: .01em !important;
  text-align: left !important;
}
table#table-debug thead tr:nth-child(3) th {
  font-weight: 700 !important; /* 太字 */
  font-size: 12.5px !important;
  letter-spacing: .005em !important;
  text-align: left !important;
}

/* 数値セル（gyoseki_unified のデータ列） */
/* KPI強調: 売上/予算達成率/FL/人件費率/原価率/利益/利益率 */
table#table-debug td.kpi-strong { font-weight:800 !important; font-size:14px !important; }
table#table-debug td.kpi-hit  { color:#166534 !important; }
table#table-debug td.kpi-warn { color:#92400e !important; background:#fef3c7 !important; }
table#table-debug td.kpi-miss { color:#b91c1c !important; background:#fee2e2 !important; }

/* =========================================================
   Header font colors by group (TH1/TH2)
   - 太め下線に合わせ、やや濃い色で文字色を統一
   ========================================================= */
/* Blue (売上) */
table#table-debug thead tr:nth-child(1) th.th-u,
table#table-debug thead tr:nth-child(2) th.th-u,
table#table-debug thead tr:nth-child(1) th.col-tenpo,
table#table-debug thead tr:nth-child(2) th.col-tenpo { color:#174ea6 !important; }
/* Green (FL/人件費) */
table#table-debug thead tr:nth-child(1) th.th-fl,
table#table-debug thead tr:nth-child(2) th.th-fl { color:#188038 !important; }
/* Amber (原価) */
table#table-debug thead tr:nth-child(1) th.th-genka,
table#table-debug thead tr:nth-child(2) th.th-genka { color:#b06c00 !important; }
/* Gray (その他) */
table#table-debug thead tr:nth-child(1) th.th-etc,
table#table-debug thead tr:nth-child(2) th.th-etc { color:#5f6368 !important; }
/* Teal (利益) */
table#table-debug thead tr:nth-child(1) th.th-profit,
table#table-debug thead tr:nth-child(2) th.th-profit { color:#007c91 !important; }

/* 以前の縦線カラー/角丸を復元（上書きの削除） */
/* ===== 実験: ?vtest=1 で TH1 ブロック先頭に色付き縦線（下線と同色・同太さ）を表示 ===== */
/* Use inset box-shadow for vertical separators to avoid tiny gaps between TH rows */
table#table-debug thead th.sep-h1,
table#table-debug thead th.sep-h2 { border-left-width: 0 !important; box-shadow: inset 4px 0 0 #cbd0d8; }
/* Color mapping (same as underline colors) */
table#table-debug thead th.sep-h1.th-u,      table#table-debug thead th.sep-h2.th-u,
table#table-debug thead th.sep-h1.col-tenpo, table#table-debug thead th.sep-h2.col-tenpo { box-shadow: inset 4px 0 0 #1a73e8 !important; }
table#table-debug thead th.sep-h1.th-fl,     table#table-debug thead th.sep-h2.th-fl     { box-shadow: inset 4px 0 0 #34a853 !important; }
table#table-debug thead th.sep-h1.th-genka,  table#table-debug thead th.sep-h2.th-genka  { box-shadow: inset 4px 0 0 #f6bf26 !important; }
table#table-debug thead th.sep-h1.th-etc,    table#table-debug thead th.sep-h2.th-etc    { box-shadow: inset 4px 0 0 #9aa0a6 !important; }
table#table-debug thead th.sep-h1.th-profit, table#table-debug thead th.sep-h2.th-profit { box-shadow: inset 4px 0 0 #00acc1 !important; }
/* vtest: TH2 境界も同色・同太さで連結 */
/* (above shadow mapping handles both sep-h1 and sep-h2) */

/* =========================================================
   Override: TH1 group head cells (with text) to dark back + white text
   - 文字が表示されるTH1先頭セル（sep-h1）をカテゴリ色の濃色背景に
   - 末尾に置き、前方の白背景指定を上書きする
   ========================================================= */
table#table-debug thead tr:nth-child(1) th.sep-h1.th-u {
  background:#174ea6 !important; border-color:#174ea6 !important; color:#fff !important;
}
table#table-debug thead tr:nth-child(1) th.sep-h1.th-fl {
  background:#1b6f3a !important; border-color:#1b6f3a !important; color:#fff !important;
}
table#table-debug thead tr:nth-child(1) th.sep-h1.th-genka {
  background:#b06c00 !important; border-color:#b06c00 !important; color:#fff !important;
}
table#table-debug thead tr:nth-child(1) th.sep-h1.th-profit {
  background:#007c91 !important; border-color:#007c91 !important; color:#fff !important;
}
table#table-debug thead tr:nth-child(1) th.sep-h1.th-etc {
  background:#4b5563 !important; border-color:#4b5563 !important; color:#fff !important;
}
.gyoseki-nippou table.cap-u caption      { background:#174ea6; color:#fff; border-bottom:1px solid #174ea6; }
.gyoseki-nippou table.cap-fl caption     { background:#1b6f3a; color:#fff; border-bottom:1px solid #1b6f3a; }
.gyoseki-nippou table.cap-genka caption  { background:#b06c00; color:#fff; border-bottom:1px solid #b06c00; }
.gyoseki-nippou table.cap-profit caption { background:#007c91; color:#fff; border-bottom:1px solid #007c91; }
.gyoseki-nippou table.cap-etc caption    { background:#4b5563; color:#fff; border-bottom:1px solid #4b5563; }
.gyoseki-nippou table[class^="cap-"] caption,
.gyoseki-nippou table[class*=" cap-"] caption { border-top-left-radius:12px; border-top-right-radius:12px; }

table#table-debug thead tr:nth-child(1) th.sep-h1.col-tenpo {
  background:#174ea6 !important; border-color:#174ea6 !important; color:#fff !important;
}

/* sep-h1 が未付与でも、TH1で文字表示があるセルは濃色背景に（:not(:empty)） */
table#table-debug thead tr:nth-child(1) th.th-u:not(:empty)      { background:#174ea6 !important; border-color:#174ea6 !important; color:#fff !important; }
table#table-debug thead tr:nth-child(1) th.th-fl:not(:empty)     { background:#1b6f3a !important; border-color:#1b6f3a !important; color:#fff !important; }
table#table-debug thead tr:nth-child(1) th.th-genka:not(:empty)  { background:#b06c00 !important; border-color:#b06c00 !important; color:#fff !important; }
table#table-debug thead tr:nth-child(1) th.th-profit:not(:empty) { background:#007c91 !important; border-color:#007c91 !important; color:#fff !important; }
table#table-debug thead tr:nth-child(1) th.th-etc:not(:empty)    { background:#4b5563 !important; border-color:#4b5563 !important; color:#fff !important; }
table#table-debug thead tr:nth-child(1) th.col-tenpo:not(:empty) { background:#174ea6 !important; border-color:#174ea6 !important; color:#fff !important; }

/* ---------------------------------------------------------
   取引モーダル: レイアウト調整
   --------------------------------------------------------- */
.edit-torihiki-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10000;
}

.edit-torihiki-card {
  width: 640px;
  max-width: calc(100% - 40px);
  background: #fff;
  border-radius: var(--radius-16);
  box-shadow: 0 24px 56px rgba(0,0,0,.25);
  padding: 20px 22px 24px;
  max-height: calc(100% - 80px);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.edit-torihiki-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px 18px;
}

.edit-torihiki-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.edit-torihiki-field.full {
  grid-column: 1 / -1;
}

.edit-torihiki-label {
  font-weight: 700;
  color: #374151;
  font-size: 0.9rem;
}

.edit-torihiki-form select,
.edit-torihiki-form input[type="number"],
.edit-torihiki-form input[type="text"] {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 0.95rem;
  background: #fff;
}

.edit-torihiki-form input[type="number"] {
  text-align: right;
}

.edit-torihiki-form select:disabled {
  background: #f3f4f6;
}

.edit-torihiki-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 16px;
}

.edit-torihiki-actions :is(.btn.is-primary) {
  background: var(--primary, var(--info));
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 10px 26px;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s ease, transform .1s ease;
}

.edit-torihiki-actions :is(.btn.is-primary):hover {
  background: var(--info-hover);
}

.edit-torihiki-actions :is(.btn.is-secondary) {
  background: #f3f4f6;
  color: #111827;
  border: 1px solid #d1d5db;
  border-radius: 12px;
  padding: 10px 26px;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s ease, transform .1s ease;
}

.edit-torihiki-actions :is(.btn.is-secondary):hover {
  background: #e5e7eb;
}

.edit-torihiki-actions :is(.btn.is-danger) {
  background: #ef4444;
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 10px 26px;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s ease, transform .1s ease;
}

.edit-torihiki-actions :is(.btn.is-danger):hover {
  background: #dc2626;
}

/* ---------------------------------------------------------
   テーブル内入力欄の枠線を非表示
   --------------------------------------------------------- */
.gyoseki-nippou table input[type="text"],
.gyoseki-nippou table input[type="number"],
.gyoseki-nippou table input[type="tel"],
.gyoseki-nippou table input[type="email"],
.gyoseki-nippou table select,
.gyoseki-nippou table textarea {
  border: 0;
  background: transparent;
  box-shadow: none;
}

.gyoseki-nippou table input[type="text"]:focus,
.gyoseki-nippou table input[type="number"]:focus,
.gyoseki-nippou table input[type="tel"]:focus,
.gyoseki-nippou table input[type="email"]:focus,
.gyoseki-nippou table select:focus,
.gyoseki-nippou table textarea:focus {
  outline: none;
}

/* ---------------------------------------------------------
   Gyoseki 日報 - 状態色ユーティリティ
   --------------------------------------------------------- */
.gyoseki-nippou {
  --status-good: #1b6f3a;
  --status-bad: #b91c1c;
  --status-neutral: #4b5563;
  --status-warning-bg: #fef3c7;
  --status-warning-text: #92400e;
  --status-complete-bg: #dcfce7;
  --status-complete-text: #14532d;
}

/* HACCPページでも同じ色トークンを利用 */
.haccp-page {
  --status-good: #1b6f3a;
  --status-bad: #b91c1c;
  --status-neutral: #4b5563;
  --status-warning-bg: #fef3c7;
  --status-warning-text: #92400e;
  --status-complete-bg: #dcfce7;
  --status-complete-text: #14532d;
}

.gyoseki-nippou .u-status-good { color: var(--status-good); }
.gyoseki-nippou .u-status-bad { color: var(--status-bad); }
.gyoseki-nippou .u-status-neutral { color: var(--status-neutral); }
.gyoseki-nippou .u-emphasis-alert {
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
}
.gyoseki-nippou .u-emphasis-complete {
  background: var(--status-complete-bg);
  color: var(--status-complete-text);
}

/* ---------------------------------------------------------
   冷蔵・冷凍庫温度管理 タブ UI
   --------------------------------------------------------- */
.gyoseki-nippou .temp-section {
  margin-bottom: 12px;
}

/* HACCP 温度表タブUI（gyosekiと同調） */
.haccp-page .temp-section { margin-bottom: 12px; }
.haccp-page .haccp-actions :is(.btn.is-primary) { margin-left: auto; }
.haccp-page .temp-row[hidden] { display: none; }

/* テーブル右上ツールバー */
.haccp-table-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-bottom: 1px solid #e2e8f0;
  background: #fff;
}

.haccp-table-toolbar--right {
  justify-content: flex-end;
}

/* 温度入力の数値を中央寄せ（HACCPのみ） */
.haccp-page .haccp-table input[type="number"] { text-align: center; }
/* 温度入力の幅をセル内に収まるように固定 */
.haccp-page table.temp-table input[type="number"] {
  width: 70px;
  max-width: 70px;
  display: inline-block;
}

/* ---------------------------------------------------------
   一般的衛生管理 2色トグル
   --------------------------------------------------------- */
.gyoseki-nippou .temp-section { margin-bottom: 12px; }
.gyoseki-nippou .temp-row[hidden] { display: none; }

/* 衛生管理・締めチェック テーブル整形 */
.gyoseki-nippou table.cap-etc-eisei {
  width: 100%;
  table-layout: fixed;
}

.gyoseki-nippou table.cap-etc-eisei th,
.gyoseki-nippou table.cap-etc-eisei td {
  padding: 10px 8px;
  text-align: center;
  vertical-align: middle;
}

.gyoseki-nippou table.cap-etc-eisei th {
  white-space: normal;
  line-height: 1.3;
}

.gyoseki-nippou table.cap-etc-eisei th:nth-child(-n+6),
.gyoseki-nippou table.cap-etc-eisei td:nth-child(-n+6) {
  width: 12%;
}

.gyoseki-nippou table.cap-etc-eisei th:nth-child(7),
.gyoseki-nippou table.cap-etc-eisei td:nth-child(7) {
  width: 12%;
}

.gyoseki-nippou table.cap-etc-eisei th:nth-child(8),
.gyoseki-nippou table.cap-etc-eisei td:nth-child(8) {
  width: 16%;
  text-align: left;
}

.gyoseki-nippou table.cap-etc-eisei .binary-toggle {
  width: 100%;
  justify-content: center;
}

.gyoseki-nippou table.cap-etc-eisei .binary-toggle-button {
  margin: 0 auto;
}

.haccp-check-table .binary-toggle { width: 100%; justify-content: center; }
.haccp-check-table .binary-toggle-button { margin: 0 auto; }

.gyoseki-nippou table.cap-etc-closecheck {
  width: 100%;
  table-layout: fixed;
}

.gyoseki-nippou table.cap-etc-closecheck th,
.gyoseki-nippou table.cap-etc-closecheck td {
  padding: 10px 8px;
  text-align: center;
  vertical-align: middle;
}

.gyoseki-nippou table.cap-etc-closecheck th:nth-child(-n+7),
.gyoseki-nippou table.cap-etc-closecheck td:nth-child(-n+7) {
  width: 8.5%;
}

.gyoseki-nippou table.cap-etc-closecheck th:nth-child(8),
.gyoseki-nippou table.cap-etc-closecheck td:nth-child(8) {
  width: 18%;
}

.gyoseki-nippou table.cap-etc-closecheck th:nth-child(9),
.gyoseki-nippou table.cap-etc-closecheck td:nth-child(9) {
  width: 18.5%;
  text-align: left;
}

.gyoseki-nippou table.cap-etc-closecheck .switch-field {
  width: 100%;
  justify-content: center;
}

.gyoseki-nippou table.cap-etc-closecheck .switch-control {
  margin: 0 auto;
}

.gyoseki-nippou table.cap-etc-haccp,
.gyoseki-nippou table.cap-etc-close {
  width: 100%;
  table-layout: fixed;
}

.gyoseki-nippou table.cap-etc-haccp th,
.gyoseki-nippou table.cap-etc-haccp td,
.gyoseki-nippou table.cap-etc-close th,
.gyoseki-nippou table.cap-etc-close td {
  padding: 10px 8px;
  text-align: center;
  vertical-align: middle;
}

.gyoseki-nippou table.cap-etc-haccp td:last-child,
.gyoseki-nippou table.cap-etc-haccp th:last-child,
.gyoseki-nippou table.cap-etc-close td:last-child,
.gyoseki-nippou table.cap-etc-close th:last-child {
  text-align: left;
}

.gyoseki-nippou table.cap-etc-haccp select,
.gyoseki-nippou table.cap-etc-close select,
.gyoseki-nippou table.cap-etc-haccp input[type="text"],
.gyoseki-nippou table.cap-etc-close input[type="text"] {
  width: 100%;
  box-sizing: border-box;
}

.gyoseki-nippou table.cap-etc-haccp .binary-toggle,
.gyoseki-nippou table.cap-etc-close .binary-toggle {
  justify-content: center;
}

.gyoseki-nippou table.cap-etc-haccp {
  width: 100%;
  table-layout: fixed;
}

.gyoseki-nippou table.cap-etc-haccp th,
.gyoseki-nippou table.cap-etc-haccp td {
  padding: 8px 6px;
  text-align: center;
  vertical-align: middle;
}

.gyoseki-nippou table.cap-etc-haccp th:nth-child(1),
.gyoseki-nippou table.cap-etc-haccp td:nth-child(1),
.gyoseki-nippou table.cap-etc-haccp th:nth-child(7),
.gyoseki-nippou table.cap-etc-haccp td:nth-child(7) {
  width: 14%;
}

.gyoseki-nippou table.cap-etc-haccp th:nth-child(2),
.gyoseki-nippou table.cap-etc-haccp td:nth-child(2),
.gyoseki-nippou table.cap-etc-haccp th:nth-child(3),
.gyoseki-nippou table.cap-etc-haccp td:nth-child(3),
.gyoseki-nippou table.cap-etc-haccp th:nth-child(4),
.gyoseki-nippou table.cap-etc-haccp td:nth-child(4),
.gyoseki-nippou table.cap-etc-haccp th:nth-child(5),
.gyoseki-nippou table.cap-etc-haccp td:nth-child(5),
.gyoseki-nippou table.cap-etc-haccp th:nth-child(6),
.gyoseki-nippou table.cap-etc-haccp td:nth-child(6) {
  width: 12%;
}

.gyoseki-nippou table.cap-etc-haccp th:nth-child(8),
.gyoseki-nippou table.cap-etc-haccp td:nth-child(8) {
  width: 20%;
  text-align: left;
}

.gyoseki-nippou table.cap-etc-haccp select,
.gyoseki-nippou table.cap-etc-haccp input[type="text"] {
  width: 100%;
  box-sizing: border-box;
}

.gyoseki-nippou table.cap-etc-haccp .cycle-toggle,
.gyoseki-nippou table.cap-etc-close .cycle-toggle {
  justify-content: center;
}


/* ---------------------------------------------------------
   締め作業チェック トグルスイッチ
   --------------------------------------------------------- */
.gyoseki-nippou .switch-field {
  display: flex;
  justify-content: center;
}

.gyoseki-nippou .switch-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}

.gyoseki-nippou .switch-control input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}

.gyoseki-nippou .switch-track {
  width: 44px;
  height: 24px;
  border-radius: 999px;
  background: #d1d5db;
  position: relative;
  transition: background .2s ease;
}

.gyoseki-nippou .switch-track::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(17,24,39,.35);
  transition: transform .2s ease;
}

.gyoseki-nippou .switch-control input[type="checkbox"]:focus-visible + .switch-track {
  outline: 2px solid var(--info);
  outline-offset: 2px;
}

.gyoseki-nippou .switch-control input[type="checkbox"]:checked + .switch-track {
  background: var(--status-good);
}

.gyoseki-nippou .switch-control input[type="checkbox"]:checked + .switch-track::after {
  transform: translateX(20px);
}

.gyoseki-nippou .switch-label {
  font-weight: 600;
  font-size: 0.9rem;
  min-width: 2.5em;
  color: #6b7280;
}

.gyoseki-nippou .switch-label::before {
  content: attr(data-unchecked);
}

.gyoseki-nippou .switch-control input[type="checkbox"]:checked + .switch-track + .switch-label {
  color: var(--status-good);
}

.gyoseki-nippou .switch-control input[type="checkbox"]:checked + .switch-track + .switch-label::before {
  content: attr(data-checked);
}
.base-section-highlight {
  --accent-r: 57;  /* default green */
  --accent-g: 143;
  --accent-b: 61;
  --accent: rgb(var(--accent-r), var(--accent-g), var(--accent-b));
  padding: 18px 20px;
  border-radius: 0 var(--radius-12) var(--radius-12) 0; /* 左辺は直線 */
  background: linear-gradient(180deg, rgba(var(--accent-r), var(--accent-g), var(--accent-b), 0.07), rgba(var(--accent-r), var(--accent-g), var(--accent-b), 0.03));
  border: 1px solid rgba(var(--accent-r), var(--accent-g), var(--accent-b), 0.18);
  border-left: 6px solid var(--accent);
  color: inherit;
}
.base-section-highlight .base-data-section-title { color: #14532d; }
.base-section-highlight .base-data-value { color: #0f172a; }
.base-section-highlight .base-data-control input[type="number"] {
  background: #fff;
  border-color: rgba(var(--accent-r), var(--accent-g), var(--accent-b), 0.25);
  color: inherit;
}
.base-section-highlight .base-data-control input[type="number"]:focus {
  outline: 3px solid rgba(var(--accent-r), var(--accent-g), var(--accent-b), 0.25);
  outline-offset: 1px;
}
/* カテゴリ別アクセント色 */
.base-section-highlight.sec-goal     { --accent-r: 37;  --accent-g: 99;  --accent-b: 235; }  /* 青 */
.base-section-highlight.sec-cost     { --accent-r: 180; --accent-g: 83;  --accent-b: 9;   }  /* アンバー */
.base-section-highlight.sec-extra    { --accent-r: 2;   --accent-g: 132; --accent-b: 199; }  /* シアン */
.base-section-highlight.sec-settings { --accent-r: 107; --accent-g: 114; --accent-b: 128; }  /* グレー */
.base-section-highlight.sec-staff    { --accent-r: 124; --accent-g: 58;  --accent-b: 237; }  /* バイオレット */
.base-section-highlight.sec-tana     { --accent-r: 5;   --accent-g: 150; --accent-b: 105; }  /* エメラルド */
.base-section-highlight.sec-forecast { --accent-r: 2;   --accent-g: 132; --accent-b: 199; }  /* シアン */
/* ===== Schedule modals (unified look) ===== */
.ui-dialog:is([aria-describedby="scheduleHope"], [aria-describedby="staffSort"], [aria-describedby="mydialog1"], [aria-describedby="mydialog2"]) {
  overflow: hidden;
  padding-bottom: 0; /* body + manual footer を使う */
}
.ui-dialog:is([aria-describedby="scheduleHope"], [aria-describedby="staffSort"], [aria-describedby="mydialog1"], [aria-describedby="mydialog2"]) .ui-dialog-titlebar {
  padding: 8px 12px;
  border-bottom: 1px solid #e5e7eb;
}
.ui-dialog:is([aria-describedby="scheduleHope"], [aria-describedby="staffSort"], [aria-describedby="mydialog1"], [aria-describedby="mydialog2"]) .ui-dialog-titlebar-close:hover {
  background: #f3f4f6;
}

/* Body spacing and scroll area */
.ui-dialog .ui-dialog-content#scheduleHope,
.ui-dialog .ui-dialog-content#staffSort,
.ui-dialog .ui-dialog-content#mydialog1,
.ui-dialog .ui-dialog-content#mydialog2 {
  padding: 12px 14px 10px;
  box-sizing: border-box;
}
.ui-dialog .ui-dialog-content#scheduleHope { max-height: min(60vh, calc(100vh - 240px)); overflow: auto; }
.ui-dialog .ui-dialog-content#staffSort { max-height: min(66vh, calc(100vh - 260px)); overflow: auto; }

/* ScheduleHope table look */
.ui-dialog .ui-dialog-content#scheduleHope table { width: 100%; border-collapse: collapse; }
.ui-dialog .ui-dialog-content#scheduleHope tr { border-bottom: 1px solid #f1f5f9; }
.ui-dialog .ui-dialog-content#scheduleHope td { padding: 8px 6px; vertical-align: middle; }
.ui-dialog .ui-dialog-content#scheduleHope td:nth-child(3),
.ui-dialog .ui-dialog-content#scheduleHope td:nth-child(5) { font-weight: 800; font-size: 18px; }
.ui-dialog .ui-dialog-content#scheduleHope tr:hover { background: #f9fafb; }

/* Field block (import destination) */
#scheduleHope .field { margin: 10px auto 6px; max-width: 420px; }
#scheduleHope .field label { display:block; margin-bottom:6px; font-weight:700; color:#374151; }
#scheduleHope .field select { width:100%; min-width: 240px; height: 34px; border:1px solid #d1d5db; border-radius: 8px; padding: 4px 8px; }
#scheduleHope .field small { display:block; color:#6b7280; margin-top:4px; }

/* Action buttons in dialogs */
#scheduleHope center > form#hopeSend,
#staffSort form,
#mydialog1 form,
#mydialog2 form { margin-top: 10px; }

/* Sort modal fine-tuning */
#staffSort select { min-width: 200px; height: 32px; border:1px solid #d1d5db; border-radius:var(--radius-8); padding: 2px 6px; }
#staffSort table td { padding: 4px 6px; }
.portal-open #ui-portal-root { pointer-events:auto; }
#ui-portal-root {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: var(--z-popup);
}
#ui-portal-root > * {
  pointer-events: auto;
}
/* --------------------------------------------------
 * 評価フォーム（answer）
 * -------------------------------------------------- */
.eval-answer-body {
  background: #f6f7fb;
  min-height: 100vh;
  color: #2c2f36;
}

.eval-answer-shell {
  max-width: 1120px;
  margin: 0 auto;
  padding: 32px 24px 48px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.eval-answer-header {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.eval-answer-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px;
}

.eval-answer-title {
  margin: 0;
  font-size: 1.6rem;
  font-weight: 600;
}

.eval-answer-description {
  margin: 6px 0 0;
  color: #6a7382;
}

.eval-answer-deadline {
  font-weight: 600;
  color: #1f4db8;
}

.eval-answer-stepper {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.eval-answer-stepper li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 999px;
  background: #eceffa;
  color: #5a6272;
  font-weight: 500;
  cursor: default;
}

.eval-answer-stepper li .step-index {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #c8d2f2;
  color: #314287;
  font-size: 0.85rem;
}

.eval-answer-stepper li.is-active {
  background: #2948c2;
  color: #fff;
}

.eval-answer-stepper li.is-active .step-index {
  background: rgba(255, 255, 255, 0.24);
  color: #fff;
}

.eval-answer-stepper li.is-completed {
  background: #3f62d7;
  color: #fff;
}

.eval-answer-main {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.eval-answer-panel {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.eval-answer-panel.is-hidden {
  display: none;
}

.panel-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.panel-head h2 {
  margin: 0;
  font-size: 1.3rem;
}

.panel-head p {
  margin: 6px 0 0;
  color: #6a7382;
}

.panel-instruments {
  display: flex;
  gap: 12px;
  align-items: center;
}

.eval-answer-target-list {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.eval-answer-target-card {
  border: 1px solid #dde2f3;
  border-radius: 12px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.eval-answer-target-card:hover {
  border-color: #3f62d7;
  box-shadow: 0 8px 18px rgba(47, 72, 177, 0.14);
}

.eval-answer-target-card header {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.eval-answer-target-card .target-name {
  font-size: 1.15rem;
  font-weight: 600;
}

.eval-answer-target-card .target-role {
  color: #758195;
  font-size: 0.9rem;
}

.eval-answer-target-card .target-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: #5a6272;
  font-size: 0.92rem;
}

.eval-answer-target-card .meta-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
}

.meta-tag.is-pending {
  background: #fff7eb;
  color: #b25d09;
}

.meta-tag.is-draft {
  background: #f1f5ff;
  color: #2341c1;
}

.meta-tag.is-submitted {
  background: #e5f8f0;
  color: #158762;
}

.meta-tag.is-released {
  background: #e9f5ff;
  color: #156cb8;
}

.meta-tag.is-delegate {
  background: #f7f1ff;
  color: #5a2bb2;
}

.eval-answer-target-card footer {
  display: flex;
  justify-content: flex-end;
}

.eval-answer-questions {
  display: flex;
  gap: 20px;
}

.eval-answer-outline {
  width: 200px;
  flex: 0 0 200px;
  border-right: 1px solid #e1e7f5;
  padding-right: 16px;
}

.outline-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.outline-item {
  border: 1px solid #cdd3eb;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.88rem;
  background: #fff;
  color: #4a5370;
  transition: all 0.2s ease;
}

.outline-item.is-answered {
  background: #2948c2;
  color: #fff;
  border-color: #2948c2;
}

.eval-answer-question-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.eval-answer-question-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.answer-question-card {
  border: 1px solid #d6dcf1;
  border-radius: 12px;
  padding: 18px;
  background: #fff;
  transition: border-color 0.2s ease;
}

.answer-question-card.is-highlight {
  border-color: #2948c2;
  box-shadow: 0 0 0 2px rgba(41, 72, 194, 0.14);
}

.question-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 12px;
}

.question-label {
  font-size: 0.95rem;
  font-weight: 600;
  color: #3f4c6d;
}

.question-title {
  font-size: 1.05rem;
  font-weight: 600;
}

.question-weight {
  margin-left: auto;
  font-size: 0.85rem;
  color: #6a7382;
}

.question-scale {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 12px;
}

.scale-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #cfd6ed;
  border-radius: 999px;
  padding: 6px 12px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 0.9rem;
}

.scale-option input {
  margin: 0;
}

.scale-option:hover {
  border-color: #2948c2;
}

.question-description,
.question-guideline {
  font-size: 0.9rem;
  color: #6f7a93;
  margin-top: 6px;
}

.question-comment textarea {
  width: 100%;
  resize: vertical;
}

.eval-answer-overall {
  border: 1px dashed #cdd3eb;
  border-radius: 12px;
  padding: 18px;
  background: #f8faff;
}

.panel-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.autosave-status {
  font-size: 0.88rem;
  color: #6a7382;
}

.eval-answer-review {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.review-summary {
  border: 1px solid #d6dcf1;
  border-radius: 12px;
  padding: 18px;
  background: #f8fbff;
}

.review-summary h3 {
  margin: 0 0 8px;
  font-size: 1.05rem;
}

.review-questions {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.review-block {
  border: 1px solid #dfe3f3;
  border-radius: 12px;
  padding: 16px;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.review-block header {
  font-weight: 600;
}

.review-score {
  color: #2f3a5c;
}

.review-comment .muted {
  color: #99a3ba;
}

.eval-hint {
  font-size: 0.85rem;
  color: #6a7382;
  margin-top: 4px;
}

.toast-root {
  position: fixed;
  right: 24px;
  bottom: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 9999;
}

.toast-item {
  transform: translateY(12px);
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease;
  background: #1f1f24;
  color: #fff;
  padding: 12px 16px;
  border-radius: 8px;
  min-width: 220px;
  box-shadow: 0 12px 24px rgba(15, 22, 73, 0.2);
}

.toast-item.is-visible {
  transform: translateY(0);
  opacity: 1;
}

.toast-item.is-info {
  background: #1f47b8;
}

.toast-item.is-success {
  background: #148954;
}

.toast-item.is-error {
  background: #b3261e;
}

.placeholder {
  text-align: center;
  padding: 32px 16px;
  color: #7b849a;
}

.placeholder.error {
  color: #b03824;
}

@media (max-width: 1024px) {
  .eval-answer-shell {
    padding: 24px 16px 36px;
  }
  .eval-answer-questions {
    flex-direction: column;
  }
  .eval-answer-outline {
    width: auto;
    border-right: none;
    border-bottom: 1px solid #e1e7f5;
    padding-right: 0;
    padding-bottom: 12px;
  }
}

@media (max-width: 640px) {
  .panel-instruments {
    flex-direction: column;
    align-items: stretch;
  }
  .eval-answer-target-list {
    grid-template-columns: 1fr;
  }
  .panel-footer {
    flex-direction: column;
    align-items: stretch;
  }
  .panel-footer .footer-actions {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
}

/* ========== [6] Legacy（将来削除予定：当面の互換上書き） ========== */
/* TODO: 2025-12-31 remove legacy dateModal form fields (#dlgYm,#dlgClosing) once new classes are adopted */
#dlgYm {
  border: 2px solid var(--info);
  border-radius: var(--radius-16);
  padding: 10px 14px;
  min-width: 200px;
  text-align: center;
  font-size: 1.05rem;
  font-weight: 700;
  background: #fff;
}
#dlgYm:focus {
  outline: none;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15);
}
#dlgClosing {
  min-width: 180px;
  padding: 6px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  font-weight: 700;
  color: #111827;
  height: 36px;
}

/* TODO: 2025-12-31 remove #table-01 legacy table once .schedule-table へ完全移行 */
#table-01 { width: auto; border-collapse: collapse; table-layout: fixed; margin: 10px 0; background: #fff; }
#table-01 th, #table-01 td { padding: 6px 8px; border: 1px solid #e2e8f0; text-align: center; }
#table-01 th { background: #f5f7fa; font-weight: 600; }
#table-01 tr:nth-child(odd) { background: #fafbfd; }
#table-01 tr:hover { background: #f0f6ff; }
#table-01 th { position: sticky; top: 0; z-index: 5; }
#table-01 td:first-child, #table-01 th:first-child { position: sticky; left: 0; z-index: 6; background: #fff; }
#table-01 th:first-child { background: #f5f7fa; z-index: 7; }
#table-01 td:first-child { background: #fff; text-align: left; }
#table-01 td:first-child::after, #table-01 th:first-child::after { content: ""; position: absolute; top: 0; right: -1px; width: 1px; height: 100%; background: #e5e7eb; }
#table-01 th:first-child, #table-01 td:first-child { width: 200px; min-width: 200px; max-width: 200px; }
#table-01 th:not(:first-child), #table-01 td:not(:first-child) { width: 120px; min-width: 120px; max-width: 120px; }
.schedule-filter-bar {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-end;
  padding:6px 12px;
  border-top:1px solid rgba(0,0,0,.06);
}

.schedule-filter-bar__chips {
  min-height:40px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  flex:1 1 auto;
}

.schedule-filter-bar__right {
  margin-left:auto;
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  flex-wrap:wrap;
  flex:1 0 auto;
}

.schedule-filter-bar__controls {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.schedule-filter-bar__controls form { margin:0; }

.schedule-filter-bar__note {
  color:#6b7280;
  font-size:0.95rem;
  margin-right:auto;
}

.schedule-filter-bar__alert {
  color:#f97316;
  font-size:0.92rem;
  font-weight:600;
  margin-right:auto;
}

:root.storechips-prefold .schedule-filter-bar__chips {
  visibility:hidden;
  max-height:3.4rem;
  overflow:hidden;
  pointer-events:none;
}

:root.storechips-prefold .schedule-filter-bar__chips .chip[data-hidden="1"] { display:none; }
:root.storechips-prefold .schedule-filter-bar__chips .chip-showmore { display:none; }

/* ========== Mania Monthly Report ========== */
body.mania-monthly-page { background: var(--bg); }
.mania-container { width: 1440px; margin: 22px auto; display: block; }
.card.mania-card {
  padding: 24px 26px 30px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  background: var(--card);
  border-radius: var(--radius-16);
  box-shadow: var(--shadow);
}
.mania-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}
.mania-report-content {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 12px;
}
.mania-report-content .mania-section-title {
  margin: 24px 0 12px;
}
.mania-report-content .mania-section-title:first-child {
  margin-top: 0;
}
table.mania-report-table-legacy {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #84b2e0;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
}
table.mania-report-table-legacy th,
table.mania-report-table-legacy td {
  padding: 10px 12px;
  border-right: 1px solid #84b2e0;
  border-bottom: 1px solid #84b2e0;
}
table.mania-report-table-legacy th:last-child,
table.mania-report-table-legacy td:last-child { border-right: 0; }
table.mania-report-table-legacy tr:last-child td { border-bottom: 0; }
/* 予算・実績・達成率/構成比の列（ヘッダー以外）は右寄せ */
.mania-report-content > table.mania-report-table-legacy:first-of-type tbody td:nth-child(4),
.mania-report-content > table.mania-report-table-legacy:first-of-type tbody td:nth-child(5),
.mania-report-content > table.mania-report-table-legacy:first-of-type tbody td:nth-child(6) {
  text-align: right;
}
/* 入力欄の中身も右寄せ（予算/実績/達成率） */
.mania-report-content > table.mania-report-table-legacy:first-of-type tbody td:nth-child(4) input,
.mania-report-content > table.mania-report-table-legacy:first-of-type tbody td:nth-child(5) input,
.mania-report-content > table.mania-report-table-legacy:first-of-type tbody td:nth-child(6) input {
  text-align: right;
}
/* 売上原価構成テーブル（2つ目のテーブル）: ヘッダー以外で左端以外は右寄せ */
.mania-report-content > table.mania-report-table-legacy:nth-of-type(2) tbody td { text-align: right; }
.mania-report-content > table.mania-report-table-legacy:nth-of-type(2) tbody td:first-child { text-align: left; }
/* 売上原価構成テーブル: 全セル幅を統一（9列想定） */
.mania-report-content > table.mania-report-table-legacy:nth-of-type(2) { table-layout: fixed; }

/* YWT/CSアンケートテーブル（3つ目）: rowspanセルの二重線を抑止（下線は最終行側に一本） */
.mania-report-content > table.mania-report-table-legacy:nth-of-type(3) td[rowspan] { border-bottom: 0; }
/* 2列目の縦線専用指定は全罫線描画に統合のため不要 */
/* === mgetsuji: 一時対応（全罫線を撤去） === */
/* 一時撤去していた罫線上書きは撤廃（全罫線を描画） */
.mania-card__header-left { display: flex; flex-direction: column; gap: 6px; }
.mania-card__title { margin: 0; font-size: 1.4rem; font-weight: 800; color: #0f172a; }
  .mania-card__meta { margin: 0; font-size: 0.9rem; color: var(--muted); }
  .mania-card__summary { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
  .mania-card__summary-label { font-size: 0.8rem; font-weight: 600; color: var(--muted); }
  .mania-card__summary-value { font-size: 1.45rem; font-weight: 800; color: var(--primary); }
/* mgetsuji: サブヘッダーカード（角丸不要・間隔確保） */
body.mania-monthly-page .mania-subheader-card { border-radius: 0; margin-bottom: 12px; }
/* mgetsuji: サブヘッダーはヘッダーと一体化（上部角丸を無効） */
/* このページではサブヘッダーは非sticky（ヘッダーのみ固定） */
body.mania-monthly-page .sticky-subheader {
  position: static !important;
  top: auto !important;
  z-index: auto !important;
  border-top-left-radius: 0; border-top-right-radius: 0;
}
/* mgetsuji: ヘッダー直下に密着（コンテナ上余白を除去） */
body.mania-monthly-page .mania-container { margin-top: 0; }
/* mgetsuji: チップラッパーの基本レイアウト（安全網） */
body.mania-monthly-page #maniaTenpoChips { display:flex; flex-wrap:wrap; gap:8px; }
.mania-report-form { display: flex; flex-direction: column; gap: 28px; }
.mania-block { display: flex; flex-direction: column; gap: 12px; }
.mania-section-title { margin: 0; font-size: 1.05rem; font-weight: 700; color: #1f2937; }
.mania-report-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}
.mania-report-table thead th {
  background: #f1f5f9;
  font-size: 0.85rem;
  font-weight: 700;
  text-align: center;
  padding: 10px 12px;
  color: #0f172a;
  border-bottom: 1px solid #e2e8f0;
}
.mania-report-table tbody th,
.mania-report-table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid #e2e8f0;
  font-size: 0.9rem;
  color: #1f2937;
}
.mania-report-table tbody th { text-align: left; font-weight: 700; }
.mania-report-table tbody td { text-align: right; }
.mania-report-table tbody tr:last-child td,
.mania-report-table tbody tr:last-child th { border-bottom: none; }
.mania-row-highlight td,
.mania-row-highlight th { background: #eef9f0; font-weight: 700; color: #14532d; }
.mania-row-muted td,
.mania-row-muted th { background: #f8fafc; }
.mania-row-sub td,
.mania-row-sub th {
  background: #fdfdfe;
  font-size: 0.84rem;
  color: #4b5563;
}
.mania-cell-label { text-align: left; }
.mania-cell-number { text-align: right; white-space: nowrap; }
.mania-cell-strong { font-weight: 800; color: var(--primary); }
.mania-cell-input { text-align: right; }
.mania-cell-input .mania-input { width: 100%; }
.mania-cell-spacer {
  width: 24px;
  background: transparent !important;
  border: none !important;
  pointer-events: none;
}
.mania-input {
  width: 100%;
  padding: 6px 10px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font: inherit;
  background: #fff;
  color: inherit;
}
.mania-input--right { text-align: right; }
.mania-input:focus {
  outline: 3px solid var(--ring);
  outline-offset: 1px;
}
.mania-textarea {
  width: 100%;
  min-height: 140px;
  padding: 12px 14px;
  border: 1px solid #d1d5db;
  border-radius: 12px;
  font: inherit;
  resize: vertical;
}
.mania-textarea:focus {
  outline: 3px solid var(--ring);
  outline-offset: 1px;
}
.month-picker-modal { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 2100; }
.month-picker-modal.is-open { display: flex; }
.month-picker-backdrop { position: absolute; inset: 0; background: rgba(15,23,42,.55); }
.month-picker-panel { position: relative; width: min(420px, calc(100% - 32px)); background: #fff; border-radius: 18px; box-shadow: 0 30px 80px rgba(15,23,42,0.35); overflow: hidden; z-index: 1; }
.month-picker-header { display: flex; justify-content: center; align-items: center; padding: 14px 16px; border-bottom: 1px solid #e5e7eb; position: relative; }
.month-picker-header h2 { margin: 0; font-size: 1.05rem; font-weight: 800; color: #0f172a; text-align: center; width: 100%; }
.month-picker-header .month-picker-close { position: absolute; right: 12px; top: 10px; width: 32px; height: 32px; border-radius: 50%; border: 1px solid #e5e7eb; background: #f8fafc; cursor: pointer; font-size: 1.1rem; color: #475569; }
.month-picker-body { padding: 18px 22px 16px; display: flex; flex-direction: column; gap: 14px; align-items: center; }
.month-picker-body input[type="month"] { padding: 14px 16px; border: 1px solid #e5e7eb; border-radius: 14px; font-size: 1.2rem; font-weight: 800; min-width: 260px; max-width: 100%; box-shadow: 0 18px 40px rgba(15,23,42,0.12), inset 0 0 0 1px #f3f4f6; background: #f8fafc; color: #0f172a; letter-spacing: .02em; text-align: center; appearance: none; -webkit-appearance: none; -moz-appearance: none; box-sizing: border-box; }
.month-picker-actions { display: flex; justify-content: space-between; gap: 12px; padding: 12px 16px 16px; border-top: 1px solid #e5e7eb; }
.month-picker-btn { flex: 1 1 0; height: 44px; padding: 0 18px; font-weight: 800; border-radius: 12px; border: 1px solid #d1d5db; background: #f8fafc; color: #1f2937; cursor: pointer; }
.month-picker-btn--primary { background: #2f9a48; color: #fff; border-color: #2f9a48; }
.mania-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 18px;
}
.mania-submit-btn {
  min-width: 220px;
  min-height: 42px;
  font-size: 1rem;
  font-weight: 700;
}
.mania-ywt-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
}
.mania-ywt-table thead th {
  background: #f1f5f9;
  padding: 10px;
  font-weight: 700;
  font-size: 0.85rem;
  color: #0f172a;
  border-bottom: 1px solid #e2e8f0;
  text-align: left;
}
.mania-ywt-table tbody th,
.mania-ywt-table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid #e2e8f0;
  font-size: 0.9rem;
}
.mania-ywt-table tbody th { font-weight: 700; width: 120px; }
.mania-ywt-table tbody input.mania-input { width: 100%; }
.mania-ywt-table tbody tr:last-child td,
.mania-ywt-table tbody tr:last-child th { border-bottom: none; }
.mania-modal-text { margin: 0; font-size: 0.95rem; line-height: 1.6; color: #1f2937; }
@media (max-width: 1480px) {
  .mania-container { width: calc(100% - 32px); }
  .card.mania-card { padding: 20px 18px 26px; gap: 24px; }
}
.mania-heading { margin: 0 0 8px; font-size: 1.2rem; font-weight: 700; color: #0f172a; }
.mania-card--empty { align-items:center; justify-content:center; text-align:center; min-height:180px; }
.mania-card--empty .muted { font-size:0.95rem; }