/* ==========================================================================
   みんなの米国株掲示板 部品スタイル
   ・サイト共通の /css/common.css を土台に、掲示板固有の部品だけを足す。
   ・配色は本家に合わせて紺 #1e3c72 を基調。レイアウト（body/header/footer/
     section/サイドバー）は common.css 側が持つので、ここでは触らない。
   ========================================================================== */

/* 本文中のリンク色を本家の紺に揃える（.main 内のみ） */
.main a { color: #1e3c72; }

/* ---- 検索フォーム（大） ---------------------------------------------- */
.mb-search-big { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.mb-search-big input {
  flex: 1; min-width: 200px; padding: 12px 14px;
  border: 1px solid #ccd3dd; border-radius: 8px; font-size: 16px; font-family: inherit;
}
.mb-search-big button {
  padding: 12px 22px; font-size: 15px; white-space: nowrap; cursor: pointer;
  background: #1e3c72; color: #fff; border: 0; border-radius: 8px; font-weight: bold;
}
.mb-search-big button:hover { background: #2a4f8f; }

/* ---- 銘柄リスト ------------------------------------------------------ */
.mb-list { list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 1px;
  background: #e3e6ea; border: 1px solid #e3e6ea; border-radius: 8px; overflow: hidden; }
/* 全銘柄一覧は3列固定。銘柄名が切れないよう幅を確保する */
.mb-list.mb-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mb-list li { background: #fff; }
.mb-list a { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px;
  color: #333 !important; text-decoration: none; }
.mb-list a:hover { background: #eef2f8; }
.mb-code { font-variant-numeric: tabular-nums; font-weight: bold; color: #1e3c72;
  min-width: 46px; flex-shrink: 0; }
/* 銘柄名は折り返して全文表示（省略記号での切り詰めをしない） */
.mb-nm { flex: 1; min-width: 0; white-space: normal; overflow-wrap: anywhere; line-height: 1.5; }
.mb-mk { color: #888; font-size: 12px; white-space: nowrap; flex-shrink: 0; }
.mb-empty { color: #666; background: #f7f8fa; border: 1px dashed #d5dae2;
  border-radius: 8px; padding: 18px; text-align: center; }

/* ---- ページ送り ------------------------------------------------------ */
.mb-pager { display: flex; align-items: center; justify-content: center; gap: 16px; margin: 18px 0 4px; }
.mb-pager a { padding: 8px 16px; border: 1px solid #ccd3dd; border-radius: 8px;
  background: #fff; color: #1e3c72; text-decoration: none; font-weight: bold; }
.mb-pager a:hover { background: #eef2f8; }
.mb-page-now { color: #666; font-size: 13px; }

/* ---- 掲示板ヘッダー -------------------------------------------------- */
.mb-crumb { color: #666; font-size: 13px; margin-bottom: 6px; }
.mb-board-head h2 { border-left: 5px solid #1e3c72; padding-left: 10px; }
.mb-bcode { color: #1e3c72; font-weight: bold; }
.mb-bmk { color: #888; font-size: 14px; font-weight: normal; margin-left: 8px; }
.mb-small { color: #666; font-size: 13px; margin: 4px 0; }
.mb-links { font-size: 14px; margin: 8px 0 0; }
.mb-flash { background: #e7f6ee; color: #0a7c42; border: 1px solid #b7e3ca;
  border-radius: 8px; padding: 10px 12px; margin: 12px 0 0; }

/* ---- 投稿 ------------------------------------------------------------ */
.mb-post { border: 1px solid #e3e6ea; border-radius: 8px; padding: 12px 14px; margin-bottom: 10px; background: #fff; }
.mb-post:last-child { margin-bottom: 0; }
.mb-post-head { display: flex; gap: 10px; align-items: baseline;
  font-size: 12.5px; color: #888; margin-bottom: 6px; flex-wrap: wrap; }
.mb-no { font-weight: bold; color: #1e3c72; }
.mb-name { font-weight: bold; color: #333; }
.mb-body { word-break: break-word; line-height: 1.8; }

/* 適時開示（システム投稿） */
.mb-post-sys { border-left: 4px solid #1e3c72; background: #f5f8fd; }
.mb-badge { display: inline-block; background: #1e3c72; color: #fff; font-size: 11px;
  font-weight: bold; padding: 1px 7px; border-radius: 4px; vertical-align: middle; }
.mb-doclink { margin: 8px 0 0; font-size: 14px; }
.mb-doclink a { font-weight: bold; }

/* 投稿ごとの削除（クリックで開く） */
.mb-del { margin-top: 8px; }
.mb-del > summary { display: inline-block; cursor: pointer; list-style: none;
  font-size: 12px; color: #a06; }
.mb-del > summary::-webkit-details-marker { display: none; }
.mb-del > summary:hover { text-decoration: underline; }
.mb-del-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  margin-top: 8px; padding: 10px; background: #faf7f8; border: 1px solid #efd9df; border-radius: 8px; }
.mb-del-form input[type="password"] { padding: 8px 10px; border: 1px solid #ccd3dd;
  border-radius: 6px; font-size: 14px; font-family: inherit; }
.mb-del-form button { padding: 8px 14px; font-size: 13px; cursor: pointer; font-weight: bold;
  background: #b42318; color: #fff; border: 0; border-radius: 6px; }
.mb-del-form button:hover { background: #922017; }

/* 過去ログ（アーカイブ）表示 */
.mb-post-arc { background: #fbfbfc; border-style: dashed; }
.mb-backlink { text-align: center; margin-top: 16px; }

/* 新着コメント（全掲示板） */
.mb-feed { list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 1px;
  background: #e3e6ea; border: 1px solid #e3e6ea; border-radius: 8px; overflow: hidden; }
.mb-feed li { background: #fff; padding: 10px 12px; }
.mb-feed-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; text-decoration: none; }
.mb-feed-head:hover { text-decoration: none; }
.mb-feed-head:hover .mb-feed-stock { text-decoration: underline; }
.mb-feed-stock { font-weight: bold; color: #1e3c72; }
.mb-feed-meta { color: #888; font-size: 12px; margin-left: auto; white-space: nowrap; }
.mb-feed-body { margin: 5px 0 0; color: #333; font-size: 14px; line-height: 1.6; word-break: break-word; }

/* 約5件分の高さでスクロールする一覧ボックス */
.mb-scroll-feed { max-height: 340px; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.mb-scroll-list { max-height: 210px; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.mb-scroll-feed::-webkit-scrollbar,
.mb-scroll-list::-webkit-scrollbar { width: 8px; }
.mb-scroll-feed::-webkit-scrollbar-thumb,
.mb-scroll-list::-webkit-scrollbar-thumb { background: #c4ccd8; border-radius: 4px; }

/* ---- 投稿フォーム ---------------------------------------------------- */
.mb-field { margin-bottom: 12px; display: flex; flex-direction: column; gap: 5px; }
.mb-field label { font-size: 13px; color: #666; }
.mb-field input, .mb-field textarea {
  width: 100%; padding: 10px 12px; border: 1px solid #ccd3dd; border-radius: 8px;
  font-size: 15px; font-family: inherit; box-sizing: border-box; }
.mb-field textarea { resize: vertical; }
.mb-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mb-actions button {
  padding: 12px 26px; font-size: 15px; cursor: pointer; font-weight: bold;
  background: #1e3c72; color: #fff; border: 0; border-radius: 8px; }
.mb-actions button:hover { background: #2a4f8f; }
.mb-note { font-size: 12px; color: #888; }
.mb-error { background: #fdecea; color: #b42318; border: 1px solid #f5c2bd;
  border-radius: 8px; padding: 10px 12px; margin: 0 0 12px; }

/* ハニーポット（人間には見せない） */
.mb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---- スマホ --------------------------------------------------------- */
@media screen and (max-width: 767px) {
  /* スマホは1列。銘柄名を全文表示するため横幅を最大限使う */
  .mb-list.mb-grid { grid-template-columns: 1fr; }
}
/* タブレット等の中間幅では2列（3列だと窮屈なため） */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .mb-list.mb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- 米国株版の微調整 ------------------------------------------------ */
/* コードは4桁の数字ではなくティッカー（最大5字＋クラス表記）なので少し広く */
.mb-code { min-width: 58px; }

/* ティッカー変更で移った旧ティッカーの案内 */
.mb-notice { background: #fff8e6; color: #7a5200; border: 1px solid #f0d9a0;
  border-radius: 8px; padding: 10px 12px; margin: 10px 0 4px; }

/* 全銘柄一覧の頭文字ジャンプ（約6,000銘柄・50ページ超あるため） */
.mb-letters { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 12px; }
.mb-letters a { min-width: 30px; text-align: center; padding: 5px 0; font-size: 13px; font-weight: bold;
  border: 1px solid #ccd3dd; border-radius: 6px; background: #fff; color: #1e3c72; text-decoration: none; }
.mb-letters a:hover { background: #eef2f8; }
.mb-letters a.is-now { background: #1e3c72; color: #fff !important; border-color: #1e3c72; }
