/* =============================================
   FH System — Admin UI
   ============================================= */
:root {
  --brand:       #2d6b22;
  --brand-lt:    #eaf3e6;
  --brand-dk:    #1c3d16;
  --brand-mid:   #4a8c3f;
  --sidebar-bg:  #1c3d16;
  --sidebar-w:   220px;
  --top-h:       52px;
  --cream:       #faf7f2;
  --white:       #FFFFFF;
  --border:      #dde8d8;
  --text:        #2c3a26;
  --text-mid:    #5a6b55;
  --text-muted:  #8fa085;
  --green:       #2d6b22;
  --green-lt:    #eaf3e6;
  --red:         #DC2626;
  --red-lt:      #FEE2E2;
  --blue:        #2563EB;
  --blue-lt:     #DBEAFE;
  --orange:      #8b6b2a;
  --orange-lt:   #f5eed8;
  --gray-lt:     #f4f8f2;
  --shadow-sm:   0 1px 4px rgba(44,58,38,.06);
  --shadow-md:   0 4px 16px rgba(44,58,38,.08);
  --radius:      10px;
  --radius-sm:   6px;
}

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

html { font-size: 15px; }
body {
  font-family: "Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  color: var(--text); background: var(--cream);
  line-height: 1.6;
}

a { color: var(--brand); text-decoration: none; }

/* ===== Layout ===== */
.sidebar {
  position: fixed; top: 0; left: 0; bottom: 0;
  width: var(--sidebar-w);
  background: var(--sidebar-bg);
  display: flex; flex-direction: column;
  z-index: 100; transition: transform .25s;
}

.main-wrap {
  margin-left: var(--sidebar-w);
  min-height: 100vh;
  display: flex; flex-direction: column;
}

/* Sidebar logo */
.sidebar-logo {
  display: flex; align-items: center; gap: .6rem;
  padding: 1.1rem 1.2rem;
  border-bottom: 1px solid rgba(255,255,255,.08);
  transition: background .15s;
}
.sidebar-logo:hover {
  background: rgba(255,255,255,.1);
}
.sidebar-logo-icon { font-size: 1.6rem; }
.sidebar-logo-text { font-size: 1rem; font-weight: 800; color: #fff; letter-spacing: .04em; }

/* Sidebar nav */
.sidebar-nav { flex: 1; padding: 1rem .75rem; overflow-y: auto; }
.nav-section-label {
  font-size: .68rem; letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.35); padding: .4rem .5rem; margin-bottom: .25rem;
}
.nav-item {
  display: flex; align-items: center; gap: .55rem;
  padding: .55rem .75rem; border-radius: var(--radius-sm);
  color: rgba(255,255,255,.7); font-size: .88rem; font-weight: 500;
  transition: background .15s, color .15s;
  margin-bottom: .15rem;
}
.nav-item:hover { background: rgba(255,255,255,.1); color: #fff; }
.nav-item.active { background: var(--brand-mid); color: #fff; }
.nav-icon { font-size: 1rem; }

/* Sidebar footer */
.sidebar-footer {
  padding: .9rem 1rem;
  border-top: 1px solid rgba(255,255,255,.08);
}
.sidebar-user {
  display: flex; align-items: center; gap: .6rem; margin-bottom: .6rem;
}
.sidebar-user-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--brand-mid); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; font-weight: 700; flex-shrink: 0;
}
.sidebar-user-name { font-size: .85rem; font-weight: 600; color: #fff; }
.sidebar-user-role { font-size: .72rem; color: rgba(255,255,255,.45); }
.logout-btn {
  display: block; text-align: center; padding: .4rem;
  border: 1px solid rgba(255,255,255,.2); border-radius: var(--radius-sm);
  color: rgba(255,255,255,.6); font-size: .8rem;
  transition: background .15s, color .15s;
}
.logout-btn:hover { background: rgba(255,255,255,.1); color: #fff; }

/* Overlay */
.sidebar-overlay {
  display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.4); z-index: 99;
}

/* Top bar */
.top-bar {
  height: var(--top-h); background: var(--white);
  border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: 1rem;
  padding: 0 1.5rem; flex-shrink: 0;
  box-shadow: var(--shadow-sm);
}
.top-bar-title { font-size: 1rem; font-weight: 700; color: var(--text); }
.top-bar-spacer { flex: 1; }

.hamburger {
  display: none; flex-direction: column; gap: 4px;
  background: none; border: none; cursor: pointer; padding: .3rem;
}
.hamburger span { display: block; width: 20px; height: 2px; background: var(--text); border-radius: 2px; }

/* Content */
.content {
  flex: 1; padding: 1.5rem;
}

/* ===== Auth ===== */
.auth-wrap {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(145deg, #1E1B4B 0%, #4C1D95 60%, #7C3AED 100%);
}
.auth-card {
  background: var(--white); border-radius: 16px;
  padding: 2.5rem 2rem; width: min(380px, 90vw);
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
  text-align: center;
}
.auth-logo { font-size: 3rem; margin-bottom: .5rem; }
.auth-title {
  font-size: 1.15rem; font-weight: 800; color: var(--brand-dk);
  margin-bottom: 1.8rem; line-height: 1.4;
}
.auth-title span { font-size: .85rem; font-weight: 500; color: var(--text-mid); }
.auth-form { text-align: left; }

/* ===== Alerts ===== */
.alert {
  padding: .7rem 1rem; border-radius: var(--radius-sm);
  font-size: .88rem; margin-bottom: 1rem;
  display: flex; align-items: center; gap: .5rem;
}
.alert-success { background: var(--green-lt);  color: #065F46; border: 1px solid #A7F3D0; }
.alert-error   { background: var(--red-lt);    color: #991B1B; border: 1px solid #FECACA; }

/* ===== Forms ===== */
.form-group { display: flex; flex-direction: column; gap: .35rem; margin-bottom: .8rem; }
.form-group label { font-size: .8rem; font-weight: 600; color: var(--text-mid); }
input[type="text"], input[type="date"], input[type="tel"], input[type="number"],
input[type="password"], select, textarea {
  border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  padding: .5rem .75rem; font-size: .9rem; font-family: inherit;
  transition: border-color .15s, box-shadow .15s;
  background: var(--white); color: var(--text); width: 100%;
}
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--brand-mid);
  box-shadow: 0 0 0 3px rgba(124,58,237,.12);
}
.input-readonly { background: var(--gray-lt); cursor: default; }
textarea { resize: vertical; }
.required { color: var(--red); }

.form-row {
  display: flex; gap: 1rem; flex-wrap: wrap; align-items: flex-start;
}
.form-row .form-group { flex: 1; min-width: 140px; margin-bottom: 0; }
.form-row .flex-2 { flex: 2; }
.form-row .flex-3 { flex: 3; }
.form-row .form-group-btn { flex: 0 0 auto; }

.form-section { margin-bottom: 1.5rem; }
.form-section-title {
  font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--brand); margin-bottom: .8rem; padding-bottom: .4rem;
  border-bottom: 2px solid var(--brand-lt);
}
.form-grid { background: var(--white); border-radius: var(--radius); padding: 1.5rem; box-shadow: var(--shadow-sm); margin-bottom: 1rem; }
.form-actions {
  display: flex; justify-content: flex-end; gap: .75rem;
  padding: 1rem; background: var(--white); border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.order-form {}

/* ===== Buttons ===== */
.btn {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .55em 1.2em; border-radius: var(--radius-sm);
  font-size: .88rem; font-weight: 600; cursor: pointer;
  border: 1.5px solid transparent; transition: background .15s, transform .1s, box-shadow .15s;
  text-decoration: none; white-space: nowrap;
}
.btn:active { transform: scale(.97); }
.btn-primary { background: var(--brand-mid); color: #fff; border-color: var(--brand-mid); }
.btn-primary:hover { background: var(--brand-dk); border-color: var(--brand-dk); }
.btn-ghost { background: transparent; color: var(--brand); border-color: var(--brand); }
.btn-ghost:hover { background: var(--brand-lt); }
.btn-danger { background: transparent; color: var(--red); border-color: var(--red); }
.btn-danger:hover { background: var(--red-lt); }
.btn-block { width: 100%; justify-content: center; }
.btn-sm { padding: .4em .9em; font-size: .82rem; }
.btn-xs { padding: .25em .6em; font-size: .76rem; }

/* ===== Toolbar ===== */
.toolbar {
  display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
  margin-bottom: 1rem;
}
.date-nav { display: flex; align-items: center; gap: .4rem; }
.date-input {
  border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  padding: .35rem .6rem; font-size: .85rem; cursor: pointer;
}
.filter-tabs { display: flex; gap: .3rem; flex-wrap: wrap; }
.filter-tab {
  padding: .3em .75em; border-radius: 999px; font-size: .78rem; font-weight: 600;
  border: 1.5px solid var(--border); color: var(--text-mid);
  transition: background .15s, color .15s, border-color .15s;
}
.filter-tab:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-lt); }
.filter-tab.active { background: var(--brand-mid); color: #fff; border-color: var(--brand-mid); }

.count-bar { margin-bottom: .6rem; }
.count-total { font-size: .82rem; color: var(--text-muted); }

/* ===== Table ===== */
.table-wrap { overflow-x: auto; border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.data-table {
  width: 100%; border-collapse: collapse; background: var(--white);
  font-size: .85rem;
}
.data-table thead th {
  background: var(--cream); padding: .65rem .8rem;
  text-align: left; font-size: .75rem; font-weight: 700; letter-spacing: .06em;
  color: var(--text-mid); border-bottom: 2px solid var(--border); white-space: nowrap;
}
.data-table tbody tr { border-bottom: 1px solid var(--border); transition: background .1s; }
.data-table tbody tr:hover { background: #F9F7FF; }
.data-table tbody td { padding: .6rem .8rem; vertical-align: middle; }
.row-disabled td { opacity: .45; }
.order-note-row td { padding: .25rem .8rem .5rem; }
.order-note-row .note-cell { font-size: .78rem; color: var(--text-muted); }
.note-icon { margin-right: .3rem; }

/* Column widths */
.col-no      { width: 40px;  text-align: center; }
.col-kubun   { width: 80px; }
.col-venue   { min-width: 120px; }
.col-family  { min-width: 100px; }
.col-product { min-width: 120px; }
.col-qty     { width: 70px;  white-space: nowrap; }
.col-fuda    { min-width: 100px; }
.col-taiou   { width: 70px; }
.col-status  { width: 120px; }
.col-action  { width: 110px; white-space: nowrap; }

.venue-name { font-weight: 600; }
.venue-room { font-size: .75rem; color: var(--text-muted); }
.fuda-text  { font-weight: 600; color: var(--brand); margin-right: .3rem; }
.fuda-name  { font-size: .8rem; color: var(--text-mid); }

/* Status select */
.status-select {
  border-radius: 999px; font-size: .75rem; font-weight: 600; cursor: pointer;
  padding: .25em .6em; border-width: 1.5px;
}
select.status-未対応      { background: var(--gray-lt);   color: var(--text-mid); border-color: var(--border); }
select.status-対応中      { background: var(--blue-lt);   color: var(--blue);    border-color: var(--blue); }
select.status-宿田さん手配 { background: var(--blue-lt);   color: var(--blue);    border-color: var(--blue); }
select.status-持出中      { background: var(--orange-lt); color: var(--orange);  border-color: var(--orange); }
select.status-配送完了    { background: var(--brand-lt);  color: var(--brand);   border-color: var(--brand); }
select.status-キャンセル  { background: var(--red-lt);    color: var(--red);     border-color: var(--red); }

/* Kubun badge */
.kubun-badge {
  display: inline-block; font-size: .72rem; font-weight: 600;
  background: var(--orange-lt); color: var(--orange);
  padding: .15em .55em; border-radius: 999px;
}

/* Inline form (for buttons in table cells) */
.inline-form { display: inline; }

/* ===== Empty State ===== */
.empty-state {
  text-align: center; padding: 4rem 1rem;
  background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow-sm);
}
.empty-icon { font-size: 3rem; margin-bottom: .8rem; }
.empty-state p { color: var(--text-muted); margin-bottom: 1.2rem; }

/* ===== Admin / Cards ===== */
.admin-layout { display: flex; flex-direction: column; gap: 1.5rem; }
.card { background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
.card-header {
  padding: 1rem 1.2rem; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: .75rem;
}
.card-header h2 { font-size: .95rem; font-weight: 700; }
.count-badge {
  font-size: .75rem; font-weight: 700; background: var(--brand-lt);
  color: var(--brand); padding: .2em .7em; border-radius: 999px;
}
.user-add-form { padding: 1.2rem; }

/* Edit Modal */
.modal-backdrop {
  display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.45);
  z-index: 1000; align-items: center; justify-content: center;
}
.modal-backdrop.open { display: flex; }
.modal-box {
  background: #fff; border-radius: 12px; box-shadow: 0 8px 40px rgba(0,0,0,.18);
  padding: 1.5rem; width: 100%; max-width: 480px; max-height: 90vh;
  overflow-y: auto; margin: 1rem;
}
.modal-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 1.2rem; padding-bottom: .8rem; border-bottom: 1px solid var(--border);
}
.modal-header h3 { font-size: 1.05rem; font-weight: 700; color: var(--brand-dk); margin: 0; }
.modal-close {
  background: none; border: none; font-size: 1.4rem; line-height: 1;
  color: var(--text-mid); cursor: pointer; padding: .2rem .4rem; border-radius: 4px;
}
.modal-close:hover { background: var(--gray-lt); }
.modal-footer {
  display: flex; gap: .6rem; justify-content: flex-end;
  margin-top: 1.2rem; padding-top: .8rem; border-top: 1px solid var(--border);
}
.modal-note {
  font-size: .75rem; color: var(--text-mid); margin-top: .25rem;
}

/* Role / status badges */
.role-badge {
  display: inline-block; font-size: .75rem; font-weight: 700;
  padding: .2em .7em; border-radius: 999px;
}
.role-admin       { background: var(--brand-lt); color: var(--brand-dk); }
.role-staff       { background: var(--gray-lt);  color: var(--text-mid); }
.role-f-yahataya  { background: #e0f2e9; color: #1a6b3a; }
.role-yahataya    { background: #e8f5e9; color: #2e7d32; }
.role-hibiya      { background: #fff3e0; color: #e65100; }
.role-syukuta     { background: #fce4ec; color: #880e4f; }
.badge-me {
  font-size: .7rem; background: var(--orange-lt); color: var(--orange);
  padding: .15em .5em; border-radius: 999px; margin-left: .4rem;
}
.status-dot {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .8rem; font-weight: 600;
}
.status-dot::before { content: ""; width: 7px; height: 7px; border-radius: 50%; }
.dot-active::before   { background: var(--green); }
.dot-inactive::before { background: var(--text-muted); }
.dot-active   { color: var(--green); }
.dot-inactive { color: var(--text-muted); }

.text-sm    { font-size: .8rem; }
.text-muted { color: var(--text-muted); }

/* ===== 受注プランタブ ===== */
.plan-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 1.2rem;
  border-bottom: 2px solid var(--border);
}
.plan-tab {
  padding: .6rem 1.6rem;
  font-size: .92rem;
  font-weight: 600;
  color: var(--text-mid);
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  text-decoration: none;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  transition: color .15s, border-color .15s, background .15s;
}
.plan-tab:hover { color: var(--brand); background: var(--brand-lt); }
.plan-tab.active {
  color: var(--brand);
  border-bottom-color: var(--brand);
  background: var(--brand-lt);
}
.plan-tab--aiplan:hover { color: #9c27b0; background: #f3e5f5; }
.plan-tab--aiplan.active {
  color: #9c27b0;
  border-bottom-color: #9c27b0;
  background: #f3e5f5;
}

/* あいプランフォーム：全体に色つき枠 */
.order-form--aiplan {
  border: 2px solid #ce93d8;
  border-radius: var(--radius);
  background: #fdf6ff;
  padding: 1rem;
}
.order-form--aiplan .form-section {
  background: #fff;
}

/* あいプラン：登録ボタン */
.btn-aiplan {
  background: linear-gradient(135deg, #ab47bc, #7b1fa2) !important;
}
.btn-aiplan:hover { opacity: .88; }

/* ===== あいプラン：式場絞り込みトグル ===== */
.venue-filter-bar {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .75rem;
  flex-wrap: wrap;
}
.venue-filter-label {
  font-size: .8rem;
  color: var(--text-muted);
  white-space: nowrap;
}
.venue-filter-btn {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .3rem .85rem;
  border: 1.5px solid var(--border);
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-mid);
  cursor: pointer;
  transition: border-color .12s, background .12s, color .12s;
  -webkit-user-select: none;
  user-select: none;
  background: #fff;
}
.venue-filter-btn input[type="radio"] { display: none; }
.venue-filter-btn:hover  { border-color: #1976d2; color: #1565c0; background: #e3f2fd; }
.venue-filter-btn.active { border-color: #1976d2; background: #1976d2; color: #fff; }

/* あいプラン：お届け種別トグル */
.delivery-type-bar {
  display: flex;
  gap: .5rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}
.delivery-type-btn {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .45rem 1.1rem;
  border: 2px solid var(--border);
  border-radius: 999px;
  font-size: .88rem;
  font-weight: 600;
  color: var(--text-mid);
  cursor: pointer;
  transition: border-color .15s, background .15s, color .15s;
  -webkit-user-select: none;
  user-select: none;
}
.delivery-type-btn input[type="radio"] { display: none; }
.delivery-type-btn:hover {
  border-color: #ab47bc;
  color: #7b1fa2;
  background: #f3e5f5;
}
.delivery-type-btn.active {
  border-color: #9c27b0;
  background: #9c27b0;
  color: #fff;
}

/* ===== 担当店舗選択 ===== */
.youto-mise-row {
  display: flex; align-items: center; flex-wrap: nowrap; gap: 2cm;
}
.youto-mise-row .youto-btns { margin: 0; }
.mise-btns { display: flex; gap: .45rem; flex-wrap: wrap; }
.mise-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: .4rem 1.1rem; border: 2px solid var(--border); border-radius: 999px;
  cursor: pointer; font-weight: 800; font-size: 1.1rem;
  color: var(--text-mid); background: #fff;
  transition: border-color .15s, background .15s, color .15s;
  -webkit-user-select: none;
  user-select: none; min-width: 2.8rem;
}
.mise-btn input[type="radio"] { display: none; }
.mise-btn:hover  { border-color: var(--brand-mid); color: var(--brand-dk); background: var(--brand-lt); }
.mise-btn.active { border-color: var(--brand); background: var(--brand); color: #fff; }

/* 宿 確認電話バナー */
.alert-mise-notice {
  display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
  background: #fff8e1; border: 1.5px solid #ffc107; border-radius: 8px;
  padding: .65rem 1rem; margin-bottom: .8rem;
  font-size: .9rem;
}
.mn-icon { font-size: 1.2rem; }
.mn-text { flex: 1; }
.mn-btn  { background: #f97316; color: #fff; border: none; white-space: nowrap; }
.mn-btn:hover { background: #ea580c; color: #fff; }

/* 手配先列 */
.col-mise { width: 48px; text-align: center; }

/* 一覧表示バッジ */
.mise-badge {
  display: inline-block; font-size: .68rem; font-weight: 800;
  padding: .1em .45em; border-radius: 4px; line-height: 1.4;
  background: var(--brand-lt); color: var(--brand-dk);
}
.mise-badge.mise-宿 { background: #fff3e0; color: #e65100; }
.mise-badge.mise-紅 { background: #fce4ec; color: #880e4f; }

/* ===== 用途選択 ===== */
.youto-section { background: var(--bg-sub, #f9f9fb); }
.youto-btns {
  display: flex;
  gap: .75rem;
  flex-wrap: wrap;
}
.youto-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .2rem;
  padding: .75rem 1.4rem;
  border: 2px solid var(--border);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color .15s, background .15s, box-shadow .15s;
  -webkit-user-select: none;
  user-select: none;
  min-width: 100px;
  background: #fff;
}
.youto-btn input[type="radio"] { display: none; }
.youto-icon { font-size: 1.4rem; line-height: 1; }
.youto-name { font-size: .95rem; font-weight: 700; }
.youto-desc { font-size: .72rem; color: var(--text-muted); }

/* 事前：青系 */
.youto-jizen:hover  { border-color: #42a5f5; background: #e3f2fd; }
.youto-jizen.active { border-color: #1976d2; background: #1976d2; box-shadow: 0 2px 8px rgba(25,118,210,.3); }
.youto-jizen.active .youto-name,
.youto-jizen.active .youto-desc { color: #fff; }

/* 葬儀：グレー濃いめ */
.youto-sougi:hover  { border-color: #757575; background: #f5f5f5; }
.youto-sougi.active { border-color: #424242; background: #424242; box-shadow: 0 2px 8px rgba(66,66,66,.3); }
.youto-sougi.active .youto-name,
.youto-sougi.active .youto-desc { color: #fff; }

/* 枕花：ピンク */
.youto-makura:hover  { border-color: #e91e63; background: #fce4ec; }
.youto-makura.active { border-color: #c2185b; background: #c2185b; box-shadow: 0 2px 8px rgba(194,24,91,.3); }
.youto-makura.active .youto-name,
.youto-makura.active .youto-desc { color: #fff; }

/* ===== あいプラン ===== */
.aiplan-badge {
  display: inline-block;
  background: linear-gradient(135deg, #e91e8c, #9c27b0);
  color: #fff;
  font-size: .78rem;
  font-weight: 700;
  padding: .25em .9em;
  border-radius: 999px;
  letter-spacing: .05em;
  margin-bottom: .75rem;
}
.aiplan-flag {
  color: #9c27b0;
  font-weight: 700;
  font-size: .9rem;
}
.checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .88rem;
  color: var(--text-mid);
  cursor: pointer;
}
.checkbox-label input[type="checkbox"] {
  width: 15px; height: 15px; cursor: pointer; accent-color: var(--brand);
}

/* nav section highlight for あいプラン */
.nav-section-label.aiplan-label {
  color: #d946b0;
}

/* ===== ステータス変数（かんばん・日別共通） ===== */
:root {
  --status-new:    #e57373;  /* 未対応 */
  --status-wip:    #42a5f5;  /* 対応中 */
  --status-mise:   #42a5f5;  /* 宿田さん手配（対応中と同色） */
  --status-out:    #ffb300;  /* 持出中 */
  --status-done:   #66bb6a;  /* 配送完了 */
  --status-cancel: #bdbdbd;  /* キャンセル */
  --bg-sub:        #f9f9fb;
}

/* ===== かんばんボード ===== */
.kanban-board {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: .75rem;
  align-items: start;
  align-items: start;
  overflow-x: auto;
  padding-bottom: 1rem;
}
.kanban-col {
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  min-height: 120px;
}
/* 対応中+宿田さん手配 縦積みグループ */
.kanban-col-group {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}

.kanban-col-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .6rem .8rem .5rem;
  font-size: .82rem;
  font-weight: 700;
  border-bottom: 1px solid var(--border);
}
.kanban-cards {
  padding: .5rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.kanban-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: .55rem .65rem;
  font-size: .82rem;
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.kanban-card-date  { font-size: .75rem; color: var(--text-muted); display: flex; align-items: center; gap: .25rem; flex-wrap: wrap; }
.kanban-card-family { font-size: .92rem; font-weight: 700; color: var(--text); }
.kanban-card-venue { font-size: .78rem; color: var(--text-mid); }
.kanban-card-product { font-size: .82rem; color: var(--text); }
.kanban-card-fuda  { font-size: .78rem; color: var(--brand); }
.kanban-card-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: .35rem;
  flex-wrap: wrap;
  gap: .3rem;
}
.kanban-tag {
  font-size: .7rem;
  background: var(--brand-lt);
  color: var(--brand);
  padding: .1em .45em;
  border-radius: 3px;
}

@media (max-width: 1100px) {
  .kanban-board { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 700px) {
  .kanban-board { grid-template-columns: 1fr 1fr; }
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
  :root { --sidebar-w: 220px; }

  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .sidebar-overlay.open { display: block; }
  .main-wrap { margin-left: 0; }
  .hamburger { display: flex; }
  .top-bar { padding: 0 1rem; }
  .content { padding: 1rem; }
  .toolbar { gap: .5rem; }
  .filter-tabs { display: none; }
  .col-fuda, .col-taiou, .col-address { display: none; }
  .form-row { flex-direction: column; gap: .6rem; }
  .form-actions { flex-direction: column-reverse; }
  .form-actions .btn { justify-content: center; }
}