/* ===== スマホ：カリキュラム（数字なし / タイトル+ボタン / 合格は下）===== */
@media (max-width: 768px){

  /* ヘッダー行は消す */
  .table-wrap--curriculum .curriculum-table thead,
  .table-wrap--curriculum .curriculum-table th{
    display:none !important;
  }

  /* tableを崩してカード化 */
  .table-wrap--curriculum .curriculum-table,
  .table-wrap--curriculum .curriculum-table tbody{
    display:block !important;
    width:100% !important;
  }

  /* 1行(tr)を「上：カリキュラム / 下：判定」に固定 */
  .table-wrap--curriculum .curriculum-table tr{
    display:grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "cur"
      "judge" !important;
    row-gap:10px !important;

    background:#fff !important;
    border:1px solid #eee !important;
    border-radius:16px !important;
    padding:12px !important;
    margin:0 0 14px !important;
    box-shadow:0 2px 10px rgba(0,0,0,.06) !important;
  }

  /* td共通 */
  .table-wrap--curriculum .curriculum-table td{
    display:block !important;
    border:none !important;
    padding:0 !important;
    white-space:normal !important;
    min-width:0 !important;
  }

  /* 数字（順）は非表示 */
  .table-wrap--curriculum .curriculum-table td[data-label="順"],
  .table-wrap--curriculum .curriculum-table tr > td:first-child{
    display:none !important;
  }

  /* カリキュラム（タイトル＋ボタン） */
  .table-wrap--curriculum .curriculum-table td[data-label="カリキュラム"],
  .table-wrap--curriculum .curriculum-table tr > td:nth-child(2){
    grid-area:cur !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
    gap:8px !important;

    font-weight:900 !important;
    font-size:15px !important;
    line-height:1.35 !important;
  }

  /* ボタン群（縦になっても中央） */
  .table-wrap--curriculum .curriculum-table td[data-label="カリキュラム"] > div,
  .table-wrap--curriculum .curriculum-table tr > td:nth-child(2) > div{
    margin:0 !important;
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
    justify-content:center !important;
    align-items:center !important;
  }

  /* 判定（合格）＝下段 */
  .table-wrap--curriculum .curriculum-table td[data-label="判定"],
  .table-wrap--curriculum .curriculum-table tr > td:last-child{
    grid-area:judge !important;

    text-align:center !important;
    padding-top:10px !important;
    border-top:1px dashed rgba(0,0,0,.10) !important;
    width:100% !important;
  }

  /* 合格バッジは横のまま */
  .table-wrap--curriculum .curriculum-table tr > td:last-child .judge-status{
    display:inline-flex !important;
    margin:0 auto !important;
    writing-mode: horizontal-tb !important;
    white-space:nowrap !important;
  }

  /* 日付いらないなら消す */
  .table-wrap--curriculum .curriculum-table tr > td:last-child .judge-date{
    display:none !important;
  }
}


/* =================================================
   Community (掲示板) 追加CSS
================================================= */

.community-wrap{
  max-width:980px;
  margin:0 auto;
  padding:16px;
}

.msg-ok, .msg-err{
  padding:10px 12px;
  border-radius:12px;
  margin:0 0 10px;
  font-weight:700;
}
.msg-ok{ background:#eefaf0; color:#1a7f37; border:1px solid #cfead6; }
.msg-err{ background:#fff0f0; color:#b42318; border:1px solid #ffd2d2; }

.community-lead{
  color:#444;
  line-height:1.6;
  margin-top:6px;
}

.community-note{
  color:#666;
  font-weight:700;
}

.community-search{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
  align-items:center;
}
.community-search input[type="text"]{
  flex:1;
  min-width:220px;
  padding:10px 12px;
  border:1px solid #ddd;
  border-radius:12px;
  outline:none;
}

.community-form .form-row{
  margin-top:10px;
}
.community-form input[type="text"],
.community-form textarea,
.reply-form textarea{
  width:100%;
  padding:10px 12px;
  border:1px solid #ddd;
  border-radius:12px;
  outline:none;
  box-sizing:border-box;
}
.form-label{
  display:block;
  font-weight:800;
  margin-bottom:6px;
  color:#333;
}
.form-actions{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

/* thread list */
.thread-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.thread-item{
  border:1px solid #eee;
  border-radius:14px;
  padding:12px;
  background:#fff;
}
.thread-head{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.thread-title{
  font-weight:900;
  font-size:16px;
}
.thread-title a{
  text-decoration:none;
}
.thread-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  color:#666;
  font-size:12px;
}
.thread-snippet{
  margin-top:8px;
  color:#444;
  line-height:1.6;
}
.thread-actions{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

.thread-badge{
  display:inline-block;
  font-size:12px;
  font-weight:900;
  padding:3px 8px;
  border-radius:999px;
  margin-right:6px;
  vertical-align:middle;
}
.thread-badge--pin{ background:#fff5cc; border:1px solid #ffd24d; }
.thread-badge--close{ background:#f2f2f2; border:1px solid #ddd; }

/* thread view */
.thread-view .thread-body{
  white-space:normal;
  line-height:1.8;
  color:#333;
}

/* replies */
.reply-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.reply-item{
  border:1px solid #eee;
  border-radius:14px;
  padding:12px;
  background:#fff;
}
.reply-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:6px;
}
.reply-author{
  font-weight:900;
  color:#333;
}
.reply-date{
  color:#777;
  font-size:12px;
}
.reply-body{
  color:#333;
  line-height:1.8;
  white-space:normal;
}

/* pager */
.pager{
  margin-top:12px;
  display:flex;
  gap:10px;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
}
.pager-info{
  font-weight:900;
  color:#444;
}

/* ===== コミュニティ（ダッシュボード最新） ===== */
.community-latest{
  display:grid;
  gap:10px;
}

.community-latest-item{
  display:block;
  padding:12px;
  border:1px solid #eee;
  border-radius:12px;
  background:#fff;
}

.community-latest-item:hover{
  border-color:#e6d9c6;
  box-shadow:0 6px 16px rgba(0,0,0,.05);
}

.community-latest-title{
  font-weight:900;
  line-height:1.35;
}

.community-latest-meta{
  margin-top:6px;
  font-size:12px;
  color:#666;
}

.community-latest-body{
  margin-top:8px;
  font-size:14px;
  color:#333;
  line-height:1.5;
}

/* ===== テーマ一覧：少し大きく太く ===== */
.community-wrap .section-title{
  font-weight:900;
  font-size:16px;
}

/* ===== スレッドタイトル左にマーク（🧵） ===== */
.thread-title a{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.thread-title a::before{
  content:"💡";
  line-height:1;
}


/* =================================================
   Community page title (おしゃれ見出し)
================================================= */
.community-hero{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:14px 12px;
  border-radius:16px;
  background:linear-gradient(135deg, #fff7e6 0%, #eef6ff 100%);
  border:1px solid #f0e7d6;
  margin-bottom:8px;
}

.community-page-title{
  display:inline-block;
  font-weight:900;
  font-size:20px;
  letter-spacing:.12em;
  color:#333;
  text-shadow:0 1px 0 rgba(255,255,255,.8);
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI",
               "Hiragino Sans", "Noto Sans JP", sans-serif;
}

@media (min-width: 992px){
  .community-page-title{ font-size:22px; }
}

/* ===== リード文を中央揃え（CSSに追記 or 既存に追加）===== */
.community-lead{
  text-align:center;
}

/* ==============================
   コメント（投稿）を華やかにするCSS
   ※ 既存CSSの末尾に追記
============================== */

/* 1件のコメント枠：淡い配色＋左ライン */
.reply-item{
  background:#ffffff;
  border:1px solid #e9eef5;
  border-left:6px solid #cfe8ff;   /* ←色変えOK */
  border-radius:16px;
  padding:14px 14px 12px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}

/* 名前行：アイコン付きにする */
.reply-author{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:900;
}
.reply-author::before{
  content:"💬";                   /* ←好きな絵文字に変更OK（📝✨🐾など） */
  font-size:16px;
  line-height:1;
}

/* 日付の見た目 */
.reply-date{
  font-size:12px;
  color:#7a8796;
}

/* 本文：読みやすく */
.reply-body{
  margin-top:8px;
  line-height:1.9;
  color:#2f3640;
}

/* 返信一覧の余白感 */
.reply-list{
  gap:12px;
}

/* 入力欄カードも少し華やかに */
.reply-form textarea{
  background:#fbfdff;
  border:1px solid #dbe6f3;
}

/* 送信ボタン（黒が重いなら） */
.btn.primary{
  background:#2b2b2b;   /* 好みで #2f6fed などに */
  border:1px solid #1f1f1f;
  border-radius:12px;
}

/* 交互に色を変えて「並び」を出す（任意） */
.reply-item:nth-child(even){
  border-left-color:#d9f5e5;
  background:#ffffff;
}
/* ついでに、スレッド本文カードも少しだけ立体感（任意） */
.thread-view{
  border:1px solid #eef2f7;
  box-shadow:0 2px 10px rgba(0,0,0,.03);
  border-radius:16px;
}

/* ダッシュボード：最新5件の本文（抜粋）の左に💬 */
.community-latest-body{
  position:relative;
  padding-left:22px;   /* アイコン分 */
}

.community-latest-body::before{
  content:"💬";
  position:absolute;
  left:0;
  top:0;
  line-height:1.2;
}

.deadline-soon{
  color:#c00;
  font-weight:900;
}


/* 提出済：見た目だけ変える（未判定は解除できるように押せるまま） */
.btn.submit-toggle.is-submitted{
  /* 色は今のままでOK（ここで pointer-events:none は絶対入れない） */
}

/* 合格（ロック）：押せない */
.btn.submit-toggle.is-locked,
.btn.submit-toggle:disabled{
  opacity:.55;
  pointer-events:none;
  cursor:not-allowed;
}

/* PCだけ 6件目以降を非表示（=PCは5件のまま） */
@media (min-width: 992px){
  .latest-works-grid > a:nth-child(n+6){
    display: none;
  }
}

.pc-only{ display:block; }
.sp-only{ display:none; }
@media (max-width: 991.98px){
  .pc-only{ display:none; }
  .sp-only{ display:inline; }
}

/* みんなの作品：タイトル内だけ pc-only / sp-only を改行させない */
.latest-works-title .pc-only,
.latest-works-title .sp-only{
  display:inline !important;
}

.latest-works-title .works-count{
  display:inline-block;
  white-space:nowrap;
}

/* PCだけ5件表示（6件目以降を非表示） */
@media (min-width: 992px){
  .latest-works-grid > a:nth-child(n+6){
    display:none;
  }
}

.teacher-memo{ margin-top:12px; }
.teacher-memo__title{ font-weight:800; margin-bottom:8px; }
.teacher-memo__textarea{
  width:100%;
  min-height:220px;
  resize:vertical;
  padding:10px;
  border:1px solid #ddd;
  border-radius:12px;
}
.teacher-memo__ok{ color:blue; margin:0 0 8px; }
.teacher-memo__err{ color:red; margin:0 0 8px; }


/* file input を画面から隠す（標準の「選択されていません」を出さない） */
.file-ui__input{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

/* ボタン＋ファイル名行 */
.file-ui{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.file-ui__name{
  font-size:12px;
  color:#666;
}

.file-ui__clear{
  background:#fff;
  border:1px solid #ccc;
  color:#333;
}

  .cert-rows{ display:flex; flex-direction:column; gap:10px; }
  .cert-none,
  .cert-row{
    display:flex; align-items:center; gap:12px; flex-wrap:wrap;
    padding:10px 12px; border:1px solid rgba(0,0,0,.12);
    border-radius:12px; background:#fff;
  }
  .cert-check{ display:flex; align-items:center; gap:8px; min-width:160px; font-weight:800; }
  .cert-date{ display:flex; align-items:center; gap:8px; }
  .cert-date-input{ min-width:170px; }

  @media (max-width:600px){
    .cert-date{ width:100%; }
    .cert-date-input{ width:100%; min-width:0; }
  }

.btn{ color:#111; }
.btn.btn-ghost{ color:#111 !important; }

/* 製作物 詳細の本文を全部 折り返し可能にする */
.work-detail, .work-detail *{
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* 改行は残して折り返す */
.work-detail .text-wrap{
  white-space: pre-wrap;
}

/* 親に nowrap が居ても勝つ */
.work-detail .text-wrap{
  white-space: pre-wrap !important;
}

/* 本文系の折り返しを強制 */
.text-wrap{
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* 親が nowrap を持ってても折り返す */
.text-wrap{
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
