/* src/public/css/calculator/income_wall.css … 年収の壁の計算（/calculator/income-wall）
   💡 入力欄・カード・表は money.css（mc-…）。ここは壁の一覧と、勤め先の条件のチェックだけ */

.iw-work { margin: 4px 0 0; padding: 0; border: 0; min-width: 0; }
.iw-work legend { margin-bottom: 6px; padding: 0; font-weight: bold; font-size: 0.9rem; color: #334155; }
.iw-work .check-label { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 6px; font-size: 0.9rem; line-height: 1.5; }
.iw-work .check-label input { margin-top: 3px; flex: 0 0 auto; }

.iw-next-name { font-size: 1.25rem; line-height: 1.4; }
.mc-card-main .iw-next-name { font-size: 1.25rem; }
.iw-next-room { font-size: 1.6rem; font-weight: bold; color: #15803d; font-variant-numeric: tabular-nums; }
.iw-next-room:empty { display: none; }

.iw-walls { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.iw-wall { display: grid; gap: 4px; padding: 10px 12px; border: 1px solid #e2e8f0; border-left: 4px solid #22c55e; border-radius: 8px; background: #fff; min-width: 0; }
.iw-wall.is-over { border-left-color: #94a3b8; background: #f8fafc; }
.iw-wall.is-next { border-color: #bfd0ee; border-left-color: #2a5298; background: #eef3fb; }
.iw-wall-head { display: grid; gap: 2px; min-width: 0; }
.iw-c-name { font-weight: bold; color: #1e293b; overflow-wrap: anywhere; }
.iw-c-line { color: #475569; font-size: 0.9rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.iw-c-status { justify-self: start; font-weight: bold; color: #15803d; font-size: 0.95rem; }
/* 超えた壁は、はっきり分かるように札（ピル）にする */
.iw-wall.is-over .iw-c-status { padding: 2px 10px; border-radius: 10px; line-height: 1.4; background: #fef3c7; color: #92400e; font-size: 0.85rem; }
.iw-c-effect { font-size: 0.85rem; color: #475569; line-height: 1.55; }

#iw-result-title:focus { outline: none; }
#iw-next-sub { color: #475569; }
/* 早見表：長い名前は折り返す（金額の列が画面の外に出ないように） */
#iw-quick th { white-space: normal; }

.iw-notes { margin: 12px 0 0; padding-left: 1.2em; font-size: 0.82rem; color: #64748b; line-height: 1.6; }
.iw-notes li + li { margin-top: 4px; }

/* スマホでは、詳細オプションの欄を1列に（地域の選択肢が切れないように） */
@media (max-width: 480px) {
    .pc-options .mc-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ダークモード */
:root[data-theme="dark"] .iw-work legend { color: var(--dk-text, #e2e8f0); }
:root[data-theme="dark"] .iw-wall { background: var(--dk-surface, #1e293b); border-color: var(--dk-border, #334155); border-left-color: #22c55e; }
:root[data-theme="dark"] .iw-wall.is-over { background: var(--dk-raised, #172033); border-left-color: #64748b; }
:root[data-theme="dark"] .iw-wall.is-next { background: #1c2c4a; border-color: #36518a; border-left-color: #7aa7e9; }
:root[data-theme="dark"] .iw-c-name { color: var(--dk-text, #e2e8f0); }
:root[data-theme="dark"] .iw-c-line,
:root[data-theme="dark"] .iw-c-effect,
:root[data-theme="dark"] .iw-notes { color: var(--dk-text-sub, #a3b1c6); }
:root[data-theme="dark"] .iw-c-status,
:root[data-theme="dark"] .iw-next-room { color: #4ade80; }
:root[data-theme="dark"] .iw-wall.is-over .iw-c-status { background: #422006; color: #fcd34d; }
:root[data-theme="dark"] #iw-next-sub { color: var(--dk-text-sub, #a3b1c6); }
