/**
 * マイホームの売却タイミング 固有スタイル
 * プレフィックス: snl- (sell-now-vs-later)
 *
 * 共通スタイルは以下から継承:
 * - common/style.css - グローバルスタイル
 * - common/common.css - 共通レイアウト
 * - common/calculator-common.css - 計算機共通スタイル
 *
 * このファイルには、売却タイミングシミュレーターでのみ使用される
 * 固有のスタイルのみを定義しています。
 */

/* ===============================================
   比較エリア - レイアウト修正
   =============================================== */

/* 比較パネルにbox-sizingを明示的に設定 */
.compare {
    box-sizing: border-box;  /* padding/borderをwidthに含める */
}

/* 共通項目エリアは calculator-common.css の .common-items を使用 */

/* 共通項目テーブルのセル幅調整 - 改行を防ぐ */
.common-items table td:nth-child(2),
.common-items table td:nth-child(5) {
    white-space: nowrap;  /* 質問テキストの改行を防ぐ */
}

.common-items table td:nth-child(3),
.common-items table td:nth-child(6) {
    white-space: nowrap;  /* 入力フィールド+単位の改行を防ぐ */
    width: 180px;         /* 入力フィールド(110px) + 単位(40px) + 余白に十分な幅 */
}

/* ===============================================
   比較エリア - テーブルセル調整
   calculator-common.cssの.compareを拡張
   =============================================== */

/* 通常のセルは自動改行を許可（オリジナルコード由来） */
.compare td {
    white-space: normal !important;
}

/* 単位セルは改行しない（オリジナルコード由来） */
.compare td.unit {
    white-space: nowrap !important;
}

/* ===============================================
   売却後買い換えテーブル - パディング調整
   =============================================== */

#baikyakugo th,
#baikyakugo td {
    padding: 7px 10px;
}

/* ===============================================
   入力フィールド - 個別調整
   =============================================== */

/* 「何年後に売却？」の年・月入力フィールドは固定幅で設定 */
#txtFKeikanen {
    width: 50px !important;      /* 2つのフィールドを横並びにするため幅を縮小 */
}

#txtFKeikatuki {
    width: 50px !important;      /* 2つのフィールドを横並びにするため幅を縮小 */
}

/* 「何年後に売却？」セル内の単位スタイル調整 - 2つのフィールドがあるため幅を節約 */
#sellTimingCell .unit {
    width: auto !important;      /* 固定幅40pxを解除して自動幅に */
    margin-left: 0 !important;   /* 左側の余白を削除 */
}

/* ===============================================
   タブ切り替えボタン
   =============================================== */

#baikyakuTab {
    margin-bottom: 20px;
}

#baikyakuTab a {
    display: inline-block;
    padding: 10px 20px 13px;
    border-radius: 5px;
    margin-right: 15px;
    text-decoration: none;
    box-shadow: 0 0 2px #dbdde0;
    background: #FFF;
    color: #023F64;
    font-size: 20px;
    transition: all 0.2s ease;
    cursor: pointer;
}

#baikyakuTab a:hover {
    background: #f5f5f5;
    box-shadow: 0 2px 4px #dbdde0;
}

#baikyakuTab a.thistab {
    background: #DC6552;
    color: #FFF;
    box-shadow: 0 3px 0 #b54a3f;
}

#baikyakuTab a.thistab:hover {
    background: #C85542;
}

/* ===============================================
   リアルタイム自動計算メッセージ
   =============================================== */

/* 残債表示 */
.calc-value {
    color: #3498DB;
    font-size: 1.1em;
    font-weight: bold;
}

#lblFZansai {
    color: #3498DB;
    font-weight: bold;
    display: block;
    margin-top: 5px;
    font-size: 0.95em;
}

/* 固定資産税の目安値リンク */
.tax-guide-link {
    color: #3498DB;
    text-decoration: underline;
    font-size: 12px;
    cursor: pointer;
}

.tax-guide-link:hover {
    color: #2980B9;
    text-decoration: underline;
}

#lblMFKoteisisanzei {
    display: block;
    margin-top: 5px;
}

/* 年間上昇率表示 */
#lblMFBaikyakukakaku {
    color: #666666;
    font-size: 0.9em;
    font-style: italic;
    display: block;
    margin-top: 5px;
}

#lblMFBaikyakukakaku strong {
    font-style: normal;
}