/* Bootstrap → MudBlazor 互換: リファクタリングで Bootstrap 削除後に必要 */
.text-center { text-align: center !important; }

.mud-textfield-success .mud-input-root{border:green !important;color:green}.mud-textfield-error .mud-input-root{border-color:red !important;color:red !important}.custom-paper{box-shadow:inset 0 0 0 2px var(--mud-palette-lines-default) !important}

/* テーブルのコンテナがスクロールを持たないように強制（取引履歴ページのみ） */
.transactions-paper .mud-table-container {
    overflow: visible !important;
}

/* ヘッダーの固定設定 */
.sticky-header {
    position: sticky;
    top: 0;
    background-color: var(--mud-palette-surface);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    z-index: 2;
}

/* カード本体の角丸クリッピング */
.transactions-paper {
    -webkit-clip-path: inset(0 round var(--mud-default-borderradius));
}

/* スクロール位置復元中はテーブルを非表示（レイアウトは維持） */
.scroll-restoring {
    visibility: hidden;
}

/* レコード上でカーソルをポインタに変更 */
.page-scroll-table tr.mud-table-row:hover {
    cursor: pointer;
}

/* readonly-field-gray: 読み取り専用テキストフィールドの背景をグレーにする。
   MudBlazor 9.x の Outlined input（.mud-input-slot クラスを持つ input 要素）に直接適用し、
   デフォルト背景との詳細度競合や readonly 属性の付与有無に左右されず確実にグレー表示する。
   readonly-field-gray クラスは読み取り専用フィールドにのみ付与する運用のため、
   readonly 属性での絞り込みは行わない（design-rules 6-2 の運用ルール準拠）。 */
.readonly-field-gray .mud-input-slot,
.readonly-field-gray input,
.readonly-field-gray textarea {
    background-color: #f0f0f0 !important;
    color: inherit;
}

/* 折り返し強制 */
.link-wrap-break,
.wrap-break {
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
}

.privacy-paper {
    height: 170px; /* 基準の高さ */
    overflow-y: auto;
    background-color: #f5f5f5;
}

/* 小さい画面で高さを大きくする */
@media (max-width: 960px) {
    .privacy-paper {
        height: 300px; 
    }
}

/* スマホ等の場合はさらに高く */
@media (max-width: 420px) {
    .privacy-paper {
        height: 380px;
    }
}

/* ===== JsonTree: ネスト時のレスポンシブ対応 ===== */
@media (max-width: 960px) {
    .jtv-indent {
        margin-left: 8px !important;
    }
}

@media (max-width: 600px) {
    /* ネスト: インデントなし、全幅使用 */
    .jtv-indent {
        margin-left: 0 !important;
        padding-left: 0 !important;
        border-left: none !important;
    }

    /* Value行: 縦積みで全幅使用 */
    .jtv-row {
        flex-wrap: wrap !important;
        gap: 2px 8px !important;
    }

    .jtv-label {
        width: 100% !important;
        max-width: none !important;
    }

    .jtv-input {
        width: 100% !important;
        max-width: none !important;
    }

    .jtv-chip {
        min-width: auto !important;
    }

    .jtv-desc {
        width: 100% !important;
        flex-basis: 100% !important;
        border-left: none !important;
        padding-left: 0 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: unset !important;
    }
}