/* 旧サイトの見た目（site.css）に、サーバー描画用の差分だけを足す */

/* ページ番号はリンクにした（旧サイトは span） */
.pagination li a{color:#000;float:left;padding:8px 16px;text-decoration:none}
.pagination li a.active{background-color:#bf2e35;color:#fff;border-radius:5px}
.pagination li a:hover:not(.active){background-color:#ddd;border-radius:5px}

/* 選択中の地域タグは JS で位置計算せず、通常の流れに置く */
.forum-content .kj-filter-tags{position:static;margin:-5px 0 10px}
.forum-content .filter_location-tag a{font-size:16px;font-weight:700;color:#bf2e35;text-decoration:none;margin-right:6px}
.filterdPosts p{font-size:14px;color:#757575}

/* ボタン風リンク・枠なしボタン */
.kj-link-button{background:none;border:0;padding:0;cursor:pointer}
.response_button a.kj-button{display:inline-flex;align-items:center;gap:7px;background:#ba3c3c;color:#fff;font-size:12px;border-radius:4px;padding:5px 30px;text-decoration:none}
.response_button_mail a{color:#fa000c;text-decoration:underline}
.kj-inline{display:flex;flex-direction:column;align-items:flex-end}
.kj-inline .btn-submit{background:#000;color:#fff;border-radius:0;border:0;padding:5px 20px;cursor:pointer}
.kj-note{font-size:12px;color:#6d6d6d;margin-top:6px}
.kj-current-images{margin-bottom:30px}
.kj-thumbs{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.kj-thumbs img{object-fit:cover;aspect-ratio:4/3}
.kj-turnstile{margin:10px auto 20px;display:flex;justify-content:center}
.kj-notfound{padding:60px 0;text-align:center}
.kj-notfound h1{font-size:28px;margin-bottom:16px}
.mail-post_textareaPrev{white-space:pre-wrap;word-wrap:break-word;font-family:inherit;margin-bottom:15px}
.post_content p,.post_response_comment_box p{white-space:pre-wrap;word-wrap:break-word}

/* モーダル（dialog 要素） */
dialog.kj-modal{border:1px solid #ccc;border-radius:10px;padding:20px;max-width:min(600px,90vw)}
dialog.kj-modal::backdrop{background:rgba(0,0,0,.282)}
.kj-modal-buttons{display:flex;justify-content:center}
@media (max-width:600px){.kj-modal-buttons{flex-direction:column-reverse;align-items:center}}
.kj-modal-note{font-size:12px;color:#808080;text-align:center;margin-top:15px}
dialog.imageModal{padding:0;width:600px}

/* 送信後のお知らせ（旧サイトのトースト） */
.kj-toast{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:1000;max-width:min(520px,92vw);padding:14px 20px;border-radius:6px;box-shadow:0 4px 12px rgba(0,0,0,.2);font-size:14px;color:#fff;transition:opacity .4s}
.kj-toast--success{background:#5b9c47}
.kj-toast--error{background:#ba3d3d}
.kj-toast.is-hidden{opacity:0;pointer-events:none}

[hidden]{display:none!important}

/* 履歴書 */
.kj-resume-page{height:auto!important;min-height:841px}
.kj-pdf-actions{display:flex;gap:16px;justify-content:center;align-items:center;flex-wrap:wrap;margin:30px 0}
.resume-form h3{font-size:18px;font-weight:700;margin:30px 0 8px}
.kj-repeat{border-top:1px dashed #e3e3e3;padding-top:20px}
.resume-form_addMore,.resume-form_removeMore{color:#ba3c3c;font-weight:700;margin:6px 0 20px}

/* 管理画面 */
body.kj-admin{background:#f7f6f6;font-size:14px}
.kj-admin-header{display:flex;gap:24px;align-items:center;flex-wrap:wrap;padding:12px 24px;background:#fff;border-bottom:1px solid #e3e3e3}
.kj-admin-brand{font-weight:700;color:#212121;text-decoration:none}
.kj-admin-header nav{display:flex;gap:16px;flex-wrap:wrap}
.kj-admin-header nav a{color:#ba3c3c;text-decoration:none}
.kj-admin-user{margin-left:auto;color:#6d6d6d;font-size:12px}
.kj-admin-main{max-width:1200px;margin:0 auto;padding:24px 16px 80px}
.kj-admin-main h1{font-size:22px;margin-bottom:16px}
.kj-admin-main h2{font-size:16px;margin:24px 0 8px}
.kj-admin-filter,.kj-admin-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.kj-admin-filter input,.kj-admin-filter select,.kj-admin-row input[type=text],.kj-admin-row input[type=number],.kj-admin-row input[type=search]{height:32px;border:1px solid #c9c4c4;padding:0 8px}
.kj-admin-row input[type=number]{width:80px}
.kj-admin-main button{height:32px;padding:0 12px;border:1px solid #ba3c3c;background:#fff;color:#ba3c3c;cursor:pointer;border-radius:4px}
.kj-admin-main button:hover{background:#ba3c3c;color:#fff}
.kj-admin-table{width:100%;border-collapse:collapse;background:#fff;display:block;overflow-x:auto}
.kj-admin-table th,.kj-admin-table td{padding:8px 10px;border-bottom:1px solid #eee;text-align:left;vertical-align:middle}
.kj-admin-table th{font-size:12px;color:#6d6d6d;font-weight:600;white-space:nowrap}
.kj-admin-table tr.is-deleted td{color:#a7a7a7;background:#fafafa}
.kj-admin-clip{max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kj-admin-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.kj-admin-cards a{display:flex;gap:12px;background:#fff;padding:12px;border:1px solid #eee;border-radius:6px;color:#212121;text-decoration:none}
.kj-admin-cards img{border-radius:50%;object-fit:cover;flex:none}
.kj-admin-cards span{display:flex;flex-direction:column;gap:2px;min-width:0}
.kj-admin-cards small{color:#6d6d6d}

/* 旧 CSS は input[type=text] だけを整えているので、他の種類の入力欄も揃える */
.forum-content input[type=email],.forum-content input[type=password],.forum-content input[type=tel],.forum-content input[type=date],
.resume-content input[type=email],.resume-content input[type=password],.resume-content input[type=tel],.resume-content input[type=date]{
  font-family:"Roboto",sans-serif;font-size:14px;border:1px solid #ac4642;padding:0 1em;height:40px}

.kj-resume-link-button{display:inline-block;margin-top:16px;padding:.6em 2em;border-radius:40px;background:#b8193f;color:#fff;text-decoration:none}
.forum-post_input .kj-note{flex-basis:100%;width:100%;display:block}

/* ---- キーボード操作のフォーカス表示（site.css が outline を消しているので、最後に上書きする） ---- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible {
  outline: 2px solid #d94a43 !important;
  outline-offset: 2px !important;
}
/* 見えなくした入力欄の代わりに、ラベル側へリングを出す */
label[data-photo-label]:focus-visible { outline: 2px solid #d94a43 !important; outline-offset: 2px !important; }

/* 画面外に隠すだけ（display:none だとキーボードやスクリーンリーダーから届かない） */
.kj-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

/* ---- 履歴書フォームのエラー（項目の下に出せないもの） ---- */
.kj-field-error { color: #ba3c3c; font-size: 13px; font-weight: 500; line-height: 1.5; margin: 6px 0 12px; }

/* ---- 履歴書ホーム: カード全体がリンクなので、文字は通常の見た目に戻す ---- */
.resume-home_body-list { color: #212121; font-style: normal; font-weight: 400; text-decoration: none; }
.resume-home_body-info p { font-style: normal; color: #212121; }
.resume-home_body-info .kj-home-name { font-weight: 600; font-size: 16px; margin-bottom: 4px; }
.resume-home_body-info .kj-home-intro { font-size: 14px; line-height: 1.6; }

/* ---- 履歴書 PDF プレビュー: スマホでは横にスクロールする（PDF は #resume-sheet そのものから作るので、シートは触らない） ---- */
.kj-pdf-scroll { overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
.kj-pdf-scroll-note { display: none; font-size: 12px; color: #6d6d6d; text-align: center; margin: 6px 0; }
.kj-pdf-actions.resume-pdf { max-width: 100%; }
@media (max-width: 640px) {
  .kj-pdf-scroll .resume-pdf { margin: 0; }
  .kj-pdf-scroll-note { display: block; }
}

/* ---- スマホで入力欄にフォーカスしたとき iOS が拡大しないよう 16px 以上にする ---- */
@media (max-width: 768px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
  textarea,
  select,
  .forum-content input,
  .forum-content textarea,
  .forum-content select,
  .resume-content input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  .resume-content textarea,
  .resume-content select {
    font-size: 16px !important;
  }
}

/* ---- 日本語の改行（行頭に「ー」や句読点が来ない・1〜2文字だけの最終行を作らない） ---- */
body { line-break: strict; word-break: auto-phrase; text-wrap: pretty; }
h1, h2, h3, h4, label, button, .btn-submit, .kj-toast, .post-status, .kj-note, .cautionText p:first-child,
.resume-form_text, .breadcrum, .forum-header_subtitle h2, .title-header h2 { text-wrap: balance; }
.nw { white-space: nowrap; }
/* 「送信」のような短いボタンが幅いっぱいに縮んで1文字ずつ折り返さないようにする */
.resume-content button[data-submit], .resume-content button[type="submit"] { white-space: nowrap; min-width: 110px; }
