/*--------------------------------------------------------------
PROTECH / BuddyBoss 互換スタイル
Edubin 子テーマの見た目を BuddyBoss 上でも再現する。
--------------------------------------------------------------*/

/*
 * Edubin 由来の html/body overflow-x:hidden は使わない。
 * レッスン下層向けの補正は learndash.css。
 */
body.protech-top-layout,
body.protech-info-layout,
body.protech-faq-layout,
body.protech-page-hero-layout,
.page-template-page-top,
.page-template-page-info,
.page-template-page-faq {
  overflow-x: hidden;
  overflow-x: clip;
}

/* コース詳細の初回視聴ボタン */
body.single-sfwd-courses .learndash_join_button.btn-advance-start .btn-advance {
  background-color: #d94b4b !important;
  border-color: #d94b4b !important;
  border-bottom-color: #d94b4b !important;
  color: #fff;
}

body.single-sfwd-courses .learndash_join_button.btn-advance-start .btn-advance:hover,
body.single-sfwd-courses .learndash_join_button.btn-advance-start .btn-advance:focus {
  background-color: #c43f3f !important;
  border-color: #c43f3f !important;
  border-bottom-color: #c43f3f !important;
  color: #fff;
}

/* トップ / インフォ / FAQ は BuddyBoss のコンテンツ余白を外す */
.protech-top-layout .site-content,
.protech-info-layout .site-content,
.protech-faq-layout .site-content,
.page-template-page-top .site-content,
.page-template-page-info .site-content,
.page-template-page-faq .site-content {
  padding: 0;
}

.site-content:has(.protech-fullbleed-grid) > .container,
.protech-top-layout .site-content > .container,
.protech-info-layout .site-content > .container,
.protech-faq-layout .site-content > .container,
.page-template-page-top .site-content > .container,
.page-template-page-info .site-content > .container,
.page-template-page-faq .site-content > .container {
  max-width: 100%;
  width: 100%;
  padding: 0;
}

.protech-fullbleed-grid {
  display: block;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

body.protech-top-layout.has-sidebar #primary,
body.protech-info-layout.has-sidebar #primary,
body.protech-faq-layout.has-sidebar #primary,
body.protech-top-layout #primary.protech-page-top,
body.protech-info-layout #primary.protech-page-info,
body.protech-faq-layout #primary.protech-page-faq,
.page-template-page-top #primary,
.page-template-page-info #primary,
.page-template-page-faq #primary {
  width: 100%;
  max-width: 100%;
  padding: 0;
}

.protech-page-top.bb-grid-cell,
.protech-page-info.bb-grid-cell,
.protech-page-faq.bb-grid-cell {
  padding-left: 0;
  padding-right: 0;
}

.protech-page-top .site-main,
.protech-page-info .site-main,
.protech-page-faq .site-main {
  padding: 0;
  margin: 0;
}

.protech-top-layout .bb-yoast-breadcrumbs,
.protech-info-layout .bb-yoast-breadcrumbs,
.protech-faq-layout .bb-yoast-breadcrumbs,
.protech-page-hero-layout .bb-yoast-breadcrumbs,
.protech-top-layout #secondary,
.protech-info-layout #secondary,
.protech-faq-layout #secondary {
  display: none;
}

/* 固定ページ 19164（プラン一覧）は info のプランセクションと同じ背景 */
.page-id-19164,
.page-id-19164 .site-content,
.page-id-19164 #primary,
.page-id-19164 .site-main {
  background: #fffbf0;
}

/* ページヒーローは出す。本文側の「プラン一覧」と BuddyBoss 既定見出しは重複するので隠す */
.page-id-19164 .info-plans .info-heading,
.page-id-19164 .site-main > article > .entry-header,
.page-id-19164 .page-header,
.page-id-19164 .bb-page-title,
.page-id-19164 .page-title-wrap {
  display: none;
}

/* 共通ページタイトル（FAQ と同じヒーロー） */
body.protech-page-hero-layout .site-content > .protech-page-hero {
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  margin-left: -50vw;
  margin-right: 0;
}

body.protech-page-hero-layout .site-main > article > .entry-header,
body.protech-page-hero-layout .page-header,
body.protech-page-hero-layout .bb-blog-dir-header__heading {
  display: none;
}

.hero.info-hero {
  height: 600px;
}
@media (max-width: 1024px) {
  .hero.info-hero {
    height: 400px;
  }
}
@media (max-width: 768px) {
  .hero.info-hero {
    height: 300px;
  }
}

/* Edubin ボタンが無いとき用 CTA */
.protech-cta-btn,
.edubin-btn {
  display: inline-block;
  padding: 14px 36px;
  background: #e1d2aa;
  color: #333 !important;
  border-radius: 4px;
  font-weight: 600;
  text-decoration: none;
  line-height: 1.4;
}
.protech-cta-btn:hover,
.edubin-btn:hover {
  background: #000;
  color: #fff !important;
}

/* 関連動画グリッド（Edubin の edubin-row が無い場合） */
.protech-related-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 24px 0 40px;
}
@media (min-width: 768px) {
  .protech-related-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1180px) {
  .protech-related-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.protech-related-courses {
  margin-top: 40px;
}

/* BuddyBoss コース一覧をオーバーレイカードに揃える */
.bb-course-items .protech-course-item {
  list-style: none;
}
.bb-course-items.grid-view .protech-course-item .edubin-child-course-card,
.bb-course-items.grid-view .protech-course-item .course-thumb {
  max-width: 100%;
}

.site-header img.bb-logo,
.site-branding img.site-logo,
#masthead img.bb-logo {
  width: 180px;
  max-height: none;
}

/*
 * メニュー CSS クラス（外観 > メニュー）
 * only-login / only-logout / only-nologin : ログイン状態
 * sp-memberlogin / sp-membernologin     : スマホ + ログイン状態
 * PHP 側でも同じクラスを間引く。ここは保険と SP 幅制御。
 */
body:not(.logged-in) .only-login,
body.logged-in .only-logout,
body.logged-in .only-nologin {
  display: none !important;
}

@media (min-width: 800px) {
  .sp-membernologin,
  .sp-memberlogin {
    display: none !important;
  }
}

@media (max-width: 799px) {
  body:not(.logged-in) .sp-memberlogin,
  body.logged-in .sp-membernologin {
    display: none !important;
  }
}

/* BuddyBoss 見出しと既存セクションタイトル */
.protech-page-info .section-title {
  font-family: "Zen Old Mincho", serif;
}

.protech-page-top .section-title,
.protech-page-top .category-group-label {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
}

.protech-page-top .section-title {
  margin-bottom: 10px;
}

.protech-page-top .category-group-label {
  font-size: 1.25rem;
}

/* コース詳細の未登録 CTA：申し込みボタンを強調（親テーマより後に当てる） */
.bb-single-course-sidebar .edubin-child-ld-cta a.btn-join,
.bb-single-course-sidebar .edubin-child-ld-cta a#btn-join,
.learndash-wrapper .edubin-child-ld-cta a.btn-join,
.learndash-wrapper .edubin-child-ld-cta a#btn-join {
  background: #d94b4b !important;
  background-color: #d94b4b !important;
  border-color: #d94b4b !important;
  border-bottom-color: #d94b4b !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding: 14px 20px !important;
  border-radius: 100px !important;
}
.bb-single-course-sidebar .edubin-child-ld-cta a.btn-join:hover,
.bb-single-course-sidebar .edubin-child-ld-cta a#btn-join:hover,
.learndash-wrapper .edubin-child-ld-cta a.btn-join:hover,
.learndash-wrapper .edubin-child-ld-cta a#btn-join:hover {
  background: #000 !important;
  background-color: #000 !important;
  border-color: #000 !important;
  border-bottom-color: #000 !important;
  color: #fff !important;
}

.learndash-wrapper.learndash-wrapper-login-modal.ld-modal-open:after {
  background: rgba(0, 0, 0, 0.45);
}

.bb-course-banner-inner h1.entry-title {
  font-size: 36px;
}

@media (max-width: 767px) {
  .bb-course-banner-inner h1.entry-title {
    font-size: 26px;
  }

  .bb-course-single-meta {
    margin-bottom: 0;
  }
}

.bb-single-course-sidebar .bb-course-status-wrap .ld-status {
  font-weight: 700;
}

/* ===== Edubin 型コースフィルター ===== */
.protech-course-dir-grid {
  display: block;
}

body.post-type-archive-sfwd-courses .site-content > .container,
body.page-all-couses .site-content > .container,
body.tax-ld_course_category .site-content > .container,
body.tax-ld_course_tag .site-content > .container {
  max-width: 1280px;
}

.protech-course-archive-primary,
.protech-course-archive,
.protech-course-archive__form {
  width: 100%;
  max-width: 100%;
}

.protech-course-archive__form {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}

.protech-course-filter-mobile {
  display: none;
}

.protech-course-filter {
  background: #f4f5f6;
  border-radius: 16px;
  padding: 22px 20px 28px;
}

.protech-course-filter__search {
  position: relative;
  margin-bottom: 8px;
}

.protech-course-filter__search-input {
  width: 100%;
  height: 44px;
  border: 0;
  border-radius: 999px;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  background-image: none !important;
  padding: 0 18px 0 42px;
  font-size: 14px;
  box-shadow: none;
}

.protech-course-filter__search-input::-webkit-search-decoration,
.protech-course-filter__search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
}

.protech-course-filter__search::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23999'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-4.35-4.35M10.5 18a7.5 7.5 0 1 1 0-15 7.5 7.5 0 0 1 0 15z'/%3E%3C/svg%3E") center / contain no-repeat;
  pointer-events: none;
}

.protech-course-filter__widget + .protech-course-filter__widget {
  border-top: 1px solid #e4e6e8;
  margin-top: 18px;
  padding-top: 16px;
}

.protech-course-filter__toggle {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  background: none;
  border: 0;
  padding: 0 24px 14px 0;
  font-size: 15px;
  font-weight: 600;
  color: #222;
  cursor: pointer;
}

.protech-course-filter__toggle:hover,
.protech-course-filter__toggle:focus,
.protech-course-filter__toggle:active {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: #222 !important;
  outline: none;
}

.protech-course-filter__toggle::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 4px;
  width: 10px;
  height: 10px;
  border-right: 2px solid #888;
  border-bottom: 2px solid #888;
  transform: rotate(-135deg);
  transition: transform 0.2s ease;
}

.protech-course-filter__widget:not(.is-open) .protech-course-filter__toggle::after {
  transform: rotate(45deg);
}

.protech-course-filter__widget:not(.is-open) .protech-course-filter__content {
  display: none;
}

.protech-course-filter__content label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  color: #333;
  cursor: pointer;
}

.protech-course-filter__content label:last-child {
  margin-bottom: 0;
}

.protech-course-filter__content input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  margin: 2px 0 0;
  flex: 0 0 16px;
  border: 1px solid #cfd3d6;
  border-radius: 3px;
  background: #fff;
}

.protech-course-filter__content input[type="checkbox"]:checked {
  background: #111;
  border-color: #111;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' d='M3 8l3.5 3.5L13 4'/%3E%3C/svg%3E");
  background-size: 12px;
  background-position: center;
  background-repeat: no-repeat;
}

.protech-course-filter__content .filter-count {
  color: #888;
  margin-left: 2px;
}

#protech-course-filter label[for="category-97"] {
  display: none;
}

#course-dir-list.is-filtering {
  opacity: 0.45;
  pointer-events: none;
  transition: opacity 0.15s ease;
}

.protech-course-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 22px;
}

.protech-course-found {
  margin: 0;
  font-size: 15px;
  color: #333;
}

.protech-course-toolbar__right {
  display: flex;
  align-items: center;
  gap: 16px;
}

.protech-filter-dropdown {
  position: relative;
}

.protech-filter-dropdown__button {
  height: 36px;
  padding: 0 16px;
  border: 1px solid #e5e5e5 !important;
  border-radius: 999px;
  background: #fff !important;
  color: #555 !important;
  font-size: 14px;
  cursor: pointer;
}

.protech-filter-dropdown__button:hover,
.protech-filter-dropdown__button:focus,
.protech-filter-dropdown__button:active {
  background: #fff !important;
  border-color: #e5e5e5 !important;
  box-shadow: none !important;
  color: #555 !important;
}

.protech-filter-dropdown__button::after {
  content: "";
  display: inline-block;
  margin-left: 8px;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid #666;
  border-bottom: 1.5px solid #666;
  transform: rotate(45deg) translateY(-2px);
}

.protech-filter-dropdown__panel {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  min-width: 200px;
  padding: 12px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  z-index: 5;
}

.protech-filter-dropdown.is-open .protech-filter-dropdown__panel {
  display: block;
}

.protech-filter-dropdown__panel select {
  width: 100%;
}

.protech-my-courses {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  font-size: 13px;
}

.protech-course-archive .bb-course-items.grid-view {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.protech-course-archive .bb-course-items.list-view,
.protech-course-archive .grid-filters {
  display: none !important;
}

.protech-course-archive .bb-course-items.grid-view.hide {
  display: grid !important;
}

.protech-course-archive .bb-course-items.hide:not(.grid-view) {
  display: none !important;
}

.protech-course-archive .bb-course-items .protech-course-item,
.protech-course-archive .bb-course-items .bb-course-item-wrap {
  margin: 0;
  padding-right: 0 !important;
  padding-left: 0 !important;
  width: auto;
}

@media (max-width: 1100px) {
  .protech-course-archive .bb-course-items.grid-view {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* BuddyBoss メンバー一覧・プロフィール導線を出さない */
.widget_bp_core_members_widget,
.widget_bp_core_whos_online_widget,
.widget_bp_core_recently_active_widget,
.elementor-widget-bbp-members,
#wp-admin-bar-my-account-xprofile,
.menu-item-object-members,
.bp-menu-item-members {
  display: none !important;
}

/* アカウント設定：プライバシー・エクスポートデータを非表示 */
.bp-settings-container #profile-personal-li,
.bp-settings-container #export-personal-li {
  display: none !important;
}

@media (max-width: 880px) {
  .protech-course-archive__form {
    grid-template-columns: 1fr;
  }

  .protech-course-filter-mobile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    grid-column: 1;
    height: 40px;
    padding: 0 16px;
    border: 1px solid #e5e5e5;
    border-radius: 999px;
    background: #fff !important;
    color: #555 !important;
    box-shadow: none !important;
  }

  .protech-course-filter-mobile::after {
    content: "";
    width: 8px;
    height: 8px;
    margin-left: 10px;
    margin-top: -4px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.2s ease;
  }

  .protech-course-filter-mobile[aria-expanded="true"]::after {
    margin-top: 4px;
    transform: rotate(-135deg);
  }

  .protech-course-filter {
    display: none;
  }

  .protech-course-filter.is-mobile-open {
    display: block;
  }

  .protech-course-toolbar {
    flex-wrap: wrap;
  }
}

/* プロフィール編集の氏名欄を姓 → 名の順にする */
.editfield.field_name .bp-profile-field-flex,
.editfield.field_name .input-options {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 12px;
}

#member-profile-edit .pmpro_form_fields,
#pmpro_member_profile_edit .pmpro_form_fields {
  display: flex;
  flex-wrap: wrap;
}

#member-profile-edit .pmpro_form_field-last_name,
#pmpro_member_profile_edit .pmpro_form_field-last_name {
  order: 1;
}

#member-profile-edit .pmpro_form_field-first_name,
#pmpro_member_profile_edit .pmpro_form_field-first_name {
  order: 2;
}

/* LearnDash プロフィールのコース一覧：上下 1em の空きをなくす */
.learndash-wrapper #ld-profile .ld-item-list .ld-item-list-item {
  margin: 0;
}

/* PMPro Checkout: Googleでかんたん登録カード */
.protech-pmpro-google-checkout .nsl-container {
  width: 100%;
}

.protech-pmpro-google-divider {
  position: relative;
  text-align: center;
  margin: 20px 0 4px;
}

.protech-pmpro-google-divider::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  border-top: 1px solid #ddd;
}

.protech-pmpro-google-divider span {
  position: relative;
  display: inline-block;
  background: #fff;
  padding: 0 12px;
  color: #757575;
  font-size: 13px;
}

/*
 * 「または」の区切りが枠の下端で途切れて見える違和感を解消するため、
 * Googleカードと直後の「アカウント情報」カードを1つの枠として連結する。
 * これにより「Googleで登録」か「アカウント情報を入力して登録」かの
 * 二択であることが視覚的に分かりやすくなる。
 */
.protech-pmpro-google-checkout {
  margin-bottom: 0 !important;
  border-bottom: none !important;
  border-radius: var(--pmpro--base--border-radius, 8px)
    var(--pmpro--base--border-radius, 8px) 0 0 !important;
  box-shadow: none !important;
}

#pmpro_form:has(.protech-pmpro-google-checkout) #pmpro_user_fields {
  margin-top: 0 !important;
}

#pmpro_form:has(.protech-pmpro-google-checkout) #pmpro_user_fields > .pmpro_card {
  margin-top: 0 !important;
  border-top: none !important;
  border-radius: 0 0 var(--pmpro--base--border-radius, 8px)
    var(--pmpro--base--border-radius, 8px) !important;
}

#pmpro_form:has(.protech-pmpro-google-checkout) #pmpro_user_fields > .pmpro_card .pmpro_card_title {
  padding-top: 4px;
}

/*
 * PMProのテンプレートを変更している場合にも適用するフォールバック。
 * Googleカードとユーザー情報欄が同じフォーム内にあれば、隣接関係に
 * 依存せず上下の余白と境界線を調整する。
 */
#pmpro_form:has(.protech-pmpro-google-checkout) #pmpro_user_fields {
  margin-top: 0 !important;
}

#pmpro_form:has(.protech-pmpro-google-checkout) #pmpro_user_fields > .pmpro_card {
  margin-top: 0 !important;
  border-top: none !important;
  border-radius: 0 0 var(--pmpro--base--border-radius, 8px)
    var(--pmpro--base--border-radius, 8px) !important;
}

#pmpro_form:has(.protech-pmpro-google-checkout) #pmpro_user_fields > .pmpro_card .pmpro_card_title {
  padding-top: 4px;
}

/* PMPro のカードはサイト全体で影を付けない */
.pmpro_card {
  box-shadow: none !important;
}

/* アカウントメニューから未使用のプライバシー・データ出力を隠す */
#wp-admin-bar-my-account-settings-profile,
#wp-admin-bar-my-account-settings-export {
  display: none;
}

/* Nextend が後から追加する重複した「ソーシャルアカウント」も隠す */
.bp-navs li:has(> a[href*="/settings/nsl-social"]),
.bp-navs li:has(> a[href*="/settings/nsl-social/"]) {
  display: none;
}

/* お問い合わせ本文は読みやすい幅のカードとして中央に配置 */
.page-id-2066,
.page-id-2066 .site-content,
.page-id-2066 #primary,
.page-id-2066 .site-main {
  background: #fffbf0;
}

.page-id-2066 .site-main {
  padding: 72px 24px 96px;
}

.page-id-2066 .site-main > article {
  max-width: 840px;
  margin: 0 auto;
  padding: 56px 64px;
  background: #fff;
  border: 1px solid #eee5d4;
  border-radius: 4px;
}

.page-id-2066 .entry-content {
  font-size: 16px;
  line-height: 2;
}

.page-id-2066 .entry-content p {
  margin: 0 0 1.5em;
}

@media (max-width: 767px) {
  .page-id-2066 .site-main {
    padding: 40px 16px 56px;
  }

  .page-id-2066 .site-main > article {
    padding: 32px 24px;
  }
}