/* static/css/cashflow_table/cashflow_table.css */

/* ===== 全体 ===== */

.cashflow-main {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0.5rem 1rem 2rem;
    box-sizing: border-box;
    overflow-x: hidden;
}

.cashflow-page {
    width: 100%;
    min-width: 0;
    display: grid;
    gap: 1rem;
}

.cashflow-title-row h1 {
    font-size: 1rem;
}

.cashflow-title-row h1 {
    font-size: 1rem;
}

/* ===== パネル ===== */

.cashflow-panel {
    min-width: 0;
    max-width: 100%;
    background: #fff;
    border: 0.0625rem solid #d9deea;
    border-radius: 0.625rem;
    padding: 0.5rem 0.75rem;
    box-sizing: border-box;
    overflow: hidden;
}

.cashflow-panel h2 {
    font-size: 1rem;
}

/* ===== ヘッダー系 ===== */

.cashflow-title-row,
.box-title-row,
.cashflow-toolbar {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.cashflow-toolbar label {
    display: grid;
    gap: 0.25rem;
    font-weight: 700;
    font-size: 0.875rem;
}

/* ===== 入力 ===== */

.cashflow-toolbar input,
.cashflow-toolbar select,
.partner-row input,
.partner-row select,
.cashflow-table input,
.cashflow-table select {
    padding: 0.375rem 0.5rem;
    border: 0.0625rem solid #cbd5e1;
    border-radius: 0.375rem;
    background: #fff;
    box-sizing: border-box;
    font-size: 0.875rem;
}

/* ===== ボタン ===== */

button,
.primary-btn {
    padding: 0.5rem 0.75rem;
    border: 0.0625rem solid #3b5a7a;
    border-radius: 0.375rem;
    background: #3b5a7a;
    color: #fff;
    cursor: pointer;
    font-size: 0.875rem;
}

button:hover {
    opacity: 0.85;
}

.danger-btn {
    border-color: #dc2626;
    background: #dc2626;
}

/* ===== テーブル ===== */

.table-note {
    display: none;
    color: #777;
    text-align: center;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
}

.cashflow-table-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}

.cashflow-table {
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
    background: #fff;
}

.cashflow-table th,
.cashflow-table td {
    border: 0.0625rem solid #d9deea;
    padding: 0.375rem;
    vertical-align: middle;
    font-size: 0.8125rem;
}

.cashflow-table th {
    background: #eef3ff;
    text-align: center;
    white-space: nowrap;
}

/* ===== 入力サイズ ===== */

.cashflow-table input {
    width: 6rem;
}

.cashflow-table .item-input {
    width: 11rem;
}

.cashflow-table .condition-select {
    width: 9rem;
}

/* ===== 行スタイル ===== */

/* 修正：section-row は td ではなく th に適用 */
.section-row th {
    background: #dbeafe;
    font-weight: 700;
    font-size: 0.9375rem;
    border-top: 2px solid #3b5a7a;
    border-bottom: 2px solid #3b5a7a;
}

.section-row th:first-child {
    border-left: 2px solid #3b5a7a;
}

.section-row th:last-child {
    border-right: 2px solid #3b5a7a;
}

.category-row td {
    background: #f1f5f9;
    font-weight: 700;
}

.total-row td {
    background: #fff7ed;
    font-weight: 700;
}

.balance-row td {
    background: #ecfdf5;
    font-weight: 700;
}

.auto-row {
    background: #f8fafc;
}

.auto-label {
    display: inline-block;
    padding: 0.1875rem 0.375rem;
    border-radius: 999rem;
    background: #e0f2fe;
    color: #0369a1;
    font-size: 0.75rem;
    font-weight: 700;
}

.auto-item-name {
    font-weight: 700;
    color: #334155;
}

/* ===== 行操作 ===== */

.row-action {
    display: flex;
    gap: 0.25rem;
    align-items: center;
}

.small-btn {
    padding: 0.25rem 0.375rem;
    font-size: 0.75rem;
}

.accordion-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

/* ===== レスポンシブ ===== */

@media (max-width: 48rem) {
    .table-note {
        display: block;
    }
}