/*
 * custom.css — テーマ本体には一切手を加えず、新規ファイルとして追加するカスタムCSS。
 * dashboard.blade.php から <link> で読み込む(custom.js と同じ方式)。
 *
 * 2026-09-07: WelcomeCard(マイプラン)内、長いプラン名で「おすすめプラン」枠(右側)が
 * 潰れて表示されなくなる不具合の対策。
 *
 * 原因(index-D-qCWyjY.js のWelcomeCardコンポーネントを実測して特定):
 *   WelcomeCardのルートは flex flex-row (lg以上) で、左(マイプラン情報, class="z-3 flex
 *   flex-col gap-4 p-6 lg:p-8") と右(おすすめプラン等のウィジェット, class="z-3 flex-auto
 *   flex justify-center lg:justify-end items-center ...") の2つを justify-between で並べて
 *   いる。左側の中にプラン名を表示する Ant Design Typography(ellipsis指定)があるが、
 *   Ant Design公式ドキュメントにも明記の通り、flexレイアウト内でellipsisを効かせるには
 *   祖先のflexアイテムに min-width:0 が必要。これが無いため、長いプラン名の時に左側の
 *   flexアイテムの自動最小幅(min-width:auto)がテキストの全幅まで膨れ上がり、
 *   flex-auto指定で伸縮可能な右側(おすすめプラン)がその分だけ圧迫されて幅ゼロ近くまで
 *   潰れていた。
 *
 * 対策: 左側の直下(WelcomeCardの最初の子div)に min-width:0 を1行追加するだけ。
 *   これによりflexboxの縮小アルゴリズムが正しく働き、プラン名は既存のellipsis指定通り
 *   省略表示になり、右側のおすすめプラン枠は本来の幅を確保できる。
 *   [class*="_WelcomeCard_"] というCSS Modulesのハッシュ付きクラス名の前方一致で
 *   スコープを絞っているため、他の画面・他のコンポーネントには影響しない。
 */
[class*="_WelcomeCard_"] > div:first-child {
  min-width: 0;
}

/*
 * 2026-09-07: 期限間近の自動ポップアップ通知(独自クラス _NoticeModalWrapper_ を持つ
 * ant-modal-wrap)が、見た目は小さなカード1枚なのに、機能的には画面全体のクリックを
 * 塞いでしまっていた不具合の対策。
 *
 * 実機で確認した事実:
 *   - antdの標準Modal構造どおり、ラッパー要素(.ant-modal-wrap)はビューポート全体を覆う
 *     大きさで存在するが、この通知には暗く覆うマスク(通常のモーダルにある背景の暗転)が
 *     視覚的には表示されていない。そのため見た目は「小さなお知らせカードが浮いているだけ」
 *     にしか見えないが、実際にはラッパー要素がクリックを最優先で受け取ってしまい、
 *     その裏にある「今すぐ購入」ボタンや、画面上部の「すべてのメニュー」まで
 *     押せなくなる(Playwrightの実機テストで、通知が出ている間は
 *     『データ通信明細』のメニューすら押せないことを確認済み)。
 *   - お客様には「ページの動作がおかしい/フリーズした」ようにしか見えず、
 *     Escapeキーを押す、または見えている×ボタンを押す、という手段があることに
 *     気づく術がない。
 *
 * 対策: ラッパー要素自体はクリックを受け取らない(pointer-events:none)ようにし、
 *   実際に見えているカード本体(.ant-modal)だけクリックを受け付ける
 *   (pointer-events:auto)ようにする。これにより:
 *   - カードの外側(実際には何も見えていない場所)をクリックすれば、
 *     何も塞がれることなく背後のボタン・メニューへ普通に届く
 *   - カード自体(閉じるボタン・「継続更新はこちら」ボタン)は今まで通り押せる
 *   本体(難読化バンドル)は一切変更していない。
 */
div[class*="_NoticeModalWrapper_"] {
  pointer-events: none;
}
div[class*="_NoticeModalWrapper_"] .ant-modal,
div[class*="_NoticeModalWrapper_"] .ant-modal-content {
  pointer-events: auto;
}
