/* =========================
       課程列表容器
       ========================= */
    .course_bg {
      display: flex;
      flex-direction: column;
      gap: 1.25rem;
    }

    /* =========================
       單筆課程卡片
    ========================= */
    .course_card {
      font-size: 1rem;
      background: #ffffff;
      border-radius: 1rem;
      padding: clamp(0.774rem, 1.25vw, 1.5rem);
      box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
      border: 1px solid #e5e7eb;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
      display: flex;
      flex-direction: column;
      gap: clamp(0.645rem, 1.04vw, 1.25rem);
    }

    .course_card:hover {
      /* transform: translateY(-2px); */
      box-shadow: 0 12px 30px rgba(15, 23, 42, 0.12);
    }

    /* =========================
       上方區塊：分類 / 名稱 / 狀態
       ========================= */
    .course-top {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 1rem;
      /* margin-bottom: 20px; */
    }

    .course-info {
      /* flex: 1; */
      /* min-width: 0; */
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      /* flex-direction: column; */
      column-gap: 0.6250rem;
      row-gap: 0.7500rem;
    }

    .course-category {
      width: 100%;
    }
    .course-category span{
        display: inline-block;
        padding: 6px 12px;
        font-size: inherit;
        font-weight: 600;
        /* color: #fff;
        background: #2b286a; */



        color: #2b286a;
        border: #2b286a 1px solid;
        border-radius: 999px;
        /* margin-bottom: 12px; */
    }

    .course-name {
      font-size: clamp(1.125rem, 0.725rem + 0.65vw, 1.5rem);
      font-weight: 700;
      color: #111827;
      /* margin: 0 0 10px; */
      padding: 0;
      margin: 0;
    }

    .course-class {
      font-size: inherit;
      color: #4b5563;
    }

    .course-status {
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 5px 9px;
      border-radius: 5px;
      font-size: inherit;
      font-weight: 700;
      white-space: nowrap;
      height: auto;
      line-height: normal;
    }

    /* 已開課狀態 */
    .is-open {
      background: #00b7ee;
      color: #fff;
    }

    /* 未開課狀態 */
    .is-pending {
      background: #fff7ed;
      color: #ea580c;
    }

    /* =========================
       中間資料區塊
       ========================= */
    .course-meta {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: clamp(0.516rem, 0.83vw, 1rem);
      /* margin-bottom: 20px; */
    }

    .meta-item {
      background: #ececec47;
      border: 1px solid #d4d4d4;
      border-radius: 5px;
      padding: 11.5px 16px;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .meta-label {
      display: block;
      font-size: 0.8750rem;
      color: #7d7d7d;
      /* margin-bottom: 6px; */
    }

    .meta-value {
      font-size: 1.1250rem;
      font-weight: 700;
      color: #313131;
    }

    .meta-item:first-of-type .meta-value {
      font-family: 'Kulim Park', sans-serif;
    }




    /* =========================
       下方操作區
       ========================= */
    .course-bottom {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: clamp(0.516rem, 0.83vw, 1rem);
      border-top: 1px solid #e5e7eb;
      padding-top: clamp(0.645rem, 1.04vw, 1.25rem);
    }

    .course-id {
      font-size: 15px;
      color: #4b5563;
    }

    .course-id strong {
      color: #111827;
    }

    .course_card .btn {
      /* display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 120px;
      height: 44px;
      padding: 0 20px;
      border: none;
      border-radius: 10px;
      background: #2b286a;
      color: #ffffff;
      font-size: 15px;
      font-weight: 700;
      text-decoration: none;
      cursor: pointer;
      transition: background 0.2s ease, transform 0.2s ease; */
    }
    .course_card .btn a{
      display: inline-flex;
      align-items: center;
      justify-content: center;
      height: auto;
      padding: 10px 40px;
      line-height: normal;
      border: none;
      border-radius: 5px;
      background: #7d7d7d;
      color: #ffffff;
      font-size: 1rem;
      font-weight: 700;
      text-decoration: none;
      cursor: pointer;
      transition: background 0.2s ease, transform 0.2s ease;
    }
    .course_card .btn a:hover {
      background: #2b286a;
      /* transform: translateY(-1px); */
    }

    .course_card .btn a:active {
      /* transform: translateY(0); */
    }

    /* 額滿按鈕狀態 */
    .course_card .btn.is-disabled a {
      /* background: #9ca3af;
      cursor: not-allowed;
      pointer-events: none; */

        cursor: default;
        color: #909090;
        background: #ececec;
    }


    



    @media (max-width: 768px) {
      .course-top {
        flex-direction: column;
      }

      .course-meta {
        grid-template-columns: 1fr;
      }

      .course-bottom {
        flex-direction: column;
        align-items: stretch;
      }

      .course_card .btn {
        width: 100%;
      }

      .course-name {
        font-size: 1.25rem;
      }

      .course_card .btn a{
        display: flex;
      }
    }


       
    @media (max-width: 640px) {

        
    }