/*
 * BLOOM thanks page design
 * v1.7.20 CSS強化版
 * Cocoonの見出し装飾・本文装飾との干渉を抑え、スマホ表示を優先する。
 */

.bloom-thanks-page,
.bloom-thanks-page * {
  box-sizing: border-box;
}

/* Cocoonやテーマ側の見出し装飾・マーカー・疑似要素をBLOOMエリア内だけ無効化 */
.bloom-thanks-page h1,
.bloom-thanks-page h2,
.bloom-thanks-page h3,
.bloom-thanks-page p,
.bloom-thanks-page div,
.bloom-thanks-page section {
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none;
  text-shadow: none;
}

.bloom-thanks-page h1::before,
.bloom-thanks-page h1::after,
.bloom-thanks-page h2::before,
.bloom-thanks-page h2::after,
.bloom-thanks-page h3::before,
.bloom-thanks-page h3::after,
.bloom-thanks-page p::before,
.bloom-thanks-page p::after {
  content: none !important;
  display: none !important;
}

.bloom-thanks-page {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0 calc(50% - 50vw) !important;
  padding: 0 16px 64px !important;
  min-height: 72vh;
  background:
    radial-gradient(circle at 92% 4%, rgba(156, 175, 152, 0.14) 0 82px, transparent 83px),
    linear-gradient(180deg, #fbf8f1 0%, #fffdf8 54%, #fbf8f1 100%) !important;
  color: #2f2f2f !important;
  font-family: "Hiragino Sans", "Yu Gothic", "YuGothic", "Noto Sans JP", sans-serif !important;
}

.bloom-thanks-hero {
  max-width: 900px;
  margin: 0 auto !important;
  padding: 54px 0 0 !important;
  text-align: center !important;
}

.bloom-thanks-title {
  margin: 0 !important;
  padding: 0 !important;
  color: #263d2e !important;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif JP", serif !important;
  font-size: clamp(28px, 4vw, 42px) !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.55 !important;
}

.bloom-title-divider {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  max-width: 600px;
  margin: 20px auto 46px !important;
  color: #9caf98 !important;
}

.bloom-title-divider .bloom-divider-line {
  display: block !important;
  height: 1px !important;
  width: min(36%, 220px) !important;
  background: linear-gradient(90deg, transparent 0%, #aebfa8 42%, #c9d5c4 100%) !important;
}

.bloom-title-divider .bloom-divider-line:last-child {
  background: linear-gradient(90deg, #c9d5c4 0%, #aebfa8 58%, transparent 100%) !important;
}

.bloom-divider-leaf {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 58px !important;
  height: 24px !important;
  font-style: normal !important;
}

.bloom-divider-leaf::before {
  content: "" !important;
  position: absolute !important;
  left: 8px !important;
  right: 8px !important;
  top: 12px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: #a8b99f !important;
  transform: rotate(-8deg) !important;
}

.bloom-divider-leaf i {
  position: absolute !important;
  display: block !important;
  width: 18px !important;
  height: 10px !important;
  border-radius: 18px 2px 18px 2px !important;
  background: linear-gradient(135deg, #b6c8ae 0%, #8fa684 100%) !important;
  box-shadow: 0 1px 4px rgba(73, 103, 73, 0.12) !important;
}

.bloom-divider-leaf i:nth-child(1) { left: 9px !important; top: 4px !important; transform: rotate(-34deg) !important; }
.bloom-divider-leaf i:nth-child(2) { left: 22px !important; top: 8px !important; transform: rotate(-12deg) !important; }
.bloom-divider-leaf i:nth-child(3) { right: 8px !important; top: 3px !important; transform: rotate(26deg) scaleX(-1) !important; }

.bloom-thanks-card {
  position: relative !important;
  overflow: visible !important;
  max-width: 900px;
  margin: 0 auto !important;
  background: #ffffff !important;
  border: 1px solid rgba(222, 222, 214, 0.72) !important;
  border-radius: 28px !important;
  box-shadow: 0 18px 44px rgba(75, 65, 55, 0.13), 0 2px 10px rgba(75, 65, 55, 0.05) !important;
  padding: 54px 56px 50px !important;
  color: #2d2d2d !important;
}

.bloom-thanks-card::before,
.bloom-thanks-card::after {
  content: none !important;
  display: none !important;
}

.bloom-thanks-icon {
  width: 104px !important;
  height: 104px !important;
  margin: 0 auto 30px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at 34% 28%, #f8fbf5 0%, #edf5ea 58%, #dfeadd 100%) !important;
  color: #3f7d52 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 58px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: inset 0 0 0 1px rgba(63, 125, 82, 0.08), 0 10px 22px rgba(63, 125, 82, 0.12) !important;
}

.bloom-thanks-card.is-success .bloom-thanks-icon { background: radial-gradient(circle at 34% 28%, #f8fbf5 0%, #edf5ea 58%, #dfeadd 100%) !important; color: #3f7d52 !important; }
.bloom-thanks-card.is-pending .bloom-thanks-icon { background: radial-gradient(circle at 34% 28%, #fffaf0 0%, #fff3d2 68%, #f4e2ad 100%) !important; color: #a67823 !important; }
.bloom-thanks-card.is-failed .bloom-thanks-icon { background: radial-gradient(circle at 34% 28%, #fff8f8 0%, #fff0f0 64%, #f3d7d7 100%) !important; color: #b94a48 !important; }
.bloom-thanks-card.is-cancelled .bloom-thanks-icon { background: radial-gradient(circle at 34% 28%, #fafafa 0%, #f2f2f2 68%, #e3e3e3 100%) !important; color: #666 !important; }
.bloom-thanks-card.is-refunded .bloom-thanks-icon { background: radial-gradient(circle at 34% 28%, #f7fbfd 0%, #eef4f7 64%, #dce9ef 100%) !important; color: #4f7285 !important; }

.bloom-thanks-heading {
  margin: 0 !important;
  padding: 0 !important;
  color: #2f6f45 !important;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif JP", serif !important;
  font-size: clamp(24px, 3vw, 32px) !important;
  font-weight: 700 !important;
  line-height: 1.65 !important;
  letter-spacing: 0.045em !important;
  text-align: center !important;
}


/* v1.7.17: Cocoon側の見出し囲み・マーカー装飾をさらに無効化 */
.bloom-thanks-page .bloom-thanks-card > .bloom-thanks-heading {
  display: block !important;
  max-width: 100% !important;
  width: auto !important;
  min-height: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.bloom-thanks-page .bloom-thanks-card > .bloom-thanks-heading::before,
.bloom-thanks-page .bloom-thanks-card > .bloom-thanks-heading::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

.bloom-thanks-card.is-pending .bloom-thanks-heading { color: #8a651f !important; }
.bloom-thanks-card.is-failed .bloom-thanks-heading { color: #b94a48 !important; }
.bloom-thanks-card.is-cancelled .bloom-thanks-heading { color: #555 !important; }
.bloom-thanks-card.is-refunded .bloom-thanks-heading { color: #4f7285 !important; }

.bloom-heading-line {
  width: 84px !important;
  height: 3px !important;
  margin: 20px auto 30px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, #7fbd8b, transparent) !important;
}

.bloom-thanks-message {
  max-width: 690px;
  margin: 0 auto !important;
  color: #2d2d2d !important;
  font-size: 18px !important;
  line-height: 2.12 !important;
  letter-spacing: 0.045em !important;
  text-align: center !important;
}

.bloom-thanks-message p {
  margin: 0 0 26px !important;
  padding: 0 !important;
  color: #2d2d2d !important;
}

.bloom-thanks-message p:last-child { margin-bottom: 0 !important; }

.bloom-privacy-box {
  display: flex !important;
  align-items: flex-start !important;
  gap: 18px !important;
  max-width: 720px;
  margin: 44px auto 0 !important;
  padding: 24px 28px !important;
  background: linear-gradient(180deg, #fbfbf8 0%, #f6f6f1 100%) !important;
  border: 1px solid rgba(210, 210, 200, 0.88) !important;
  border-radius: 18px !important;
  text-align: center !important;
  justify-content: center !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.86) !important;
}

.bloom-privacy-icon {
  flex: 0 0 auto !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at 34% 28%, #fff 0%, #edf5ea 78%) !important;
  color: #3f7d52 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 23px !important;
  box-shadow: 0 6px 16px rgba(75,65,55,0.08) !important;
}

.bloom-privacy-text {
  color: #333 !important;
  font-size: 15px !important;
  text-align: center !important;
  flex: 1 1 auto !important;
  line-height: 1.95 !important;
  letter-spacing: 0.03em !important;
}

.bloom-privacy-text p {
  margin: 0 !important;
  color: #333 !important;
  text-align: center !important;
}

.bloom-privacy-title {
  margin: 0 0 8px !important;
  text-align: center !important;
  padding: 0 !important;
  color: #263d2e !important;
  font-size: 18px !important;
  font-weight: 700 !important;
}

.bloom-thanks-back {
  margin-top: 34px !important;
  text-align: center !important;
}

.bloom-thanks-back a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #3d3732 !important;
  font-size: 15px !important;
  letter-spacing: 0.04em !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(61,55,50,0.62) !important;
  padding-bottom: 5px !important;
}

.bloom-thanks-back a::before,
.bloom-thanks-back a::after {
  content: none !important;
  display: none !important;
}

.bloom-thanks-back a:hover { opacity: 0.72; }

.bloom-close-note {
  display: none;
  max-width: 560px;
  text-align: center !important;
  margin: 14px auto 0 !important;
  color: #555 !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
  letter-spacing: 0.03em !important;
}

.sp-only { display: none; }

@media screen and (max-width: 768px) {
  .bloom-thanks-page {
    margin: 0 calc(50% - 50vw) !important;
    padding: 0 14px 48px !important;
    background: linear-gradient(180deg, #fbf8f1 0%, #fffdf8 52%, #fbf8f1 100%) !important;
  }

  .bloom-thanks-hero { padding-top: 42px !important; }

  .bloom-thanks-title {
    font-size: 25px !important;
    letter-spacing: 0.04em !important;
    line-height: 1.62 !important;
  }

  .bloom-title-divider { margin: 16px auto 34px !important; gap: 10px !important; }
  .bloom-title-divider .bloom-divider-line { width: 32% !important; }
  .bloom-divider-leaf { width: 48px !important; transform: scale(0.9) !important; }

  .bloom-thanks-card {
    border-radius: 24px !important;
    padding: 40px 22px 34px !important;
    box-shadow: 0 12px 30px rgba(75, 65, 55, 0.12), 0 1px 8px rgba(75, 65, 55, 0.04) !important;
  }

  .bloom-thanks-icon {
    width: 86px !important;
    height: 86px !important;
    margin-bottom: 24px !important;
    font-size: 48px !important;
  }

  .bloom-thanks-heading {
    font-size: 22px !important;
    letter-spacing: 0.025em !important;
    line-height: 1.65 !important;
  }

  .bloom-heading-line { width: 58px !important; margin: 16px auto 24px !important; }

  .bloom-thanks-message {
    font-size: 16px !important;
    line-height: 2.02 !important;
    letter-spacing: 0.025em !important;
    text-align: center !important;
  }

  .bloom-thanks-message p { margin-bottom: 22px !important; }

  .bloom-privacy-box {
    display: flex !important;
    gap: 14px !important;
    margin-top: 34px !important;
    padding: 20px 18px !important;
    border-radius: 16px !important;
    text-align: center !important;
    justify-content: center !important;
  }

  .bloom-privacy-icon {
    width: 48px !important;
    height: 48px !important;
    font-size: 20px !important;
  }

  .bloom-privacy-title { font-size: 16px !important; line-height: 1.65 !important; }
  .bloom-privacy-text { font-size: 14px !important; line-height: 1.85 !important; }

  .sp-only { display: inline !important; }
  .pc-only { display: none !important; }

  .bloom-thanks-title,
  .bloom-thanks-heading,
  .bloom-thanks-message {
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }

  .bloom-thanks-back a { font-size: 14px !important; padding-bottom: 4px !important; }
  .bloom-close-note { font-size: 12px !important; line-height: 1.85 !important; }
}

@media screen and (max-width: 420px) {
  .bloom-thanks-title { font-size: 24px !important; }
  .bloom-thanks-card { padding-left: 20px !important; padding-right: 20px !important; }
  .bloom-privacy-box { display: block !important; text-align: center !important; }
  .bloom-privacy-icon { margin: 0 auto 12px !important; }
  .bloom-privacy-text,
  .bloom-privacy-text p,
  .bloom-privacy-title { text-align: center !important; }
}

/* v1.7.20: payment-errorページもBLOOMデザインへ統一 */
.bloom-payment-error-page .bloom-thanks-card {
  border-color: rgba(210, 190, 184, 0.72) !important;
}

.bloom-payment-error-page .bloom-heading-line {
  background: linear-gradient(90deg, transparent, #d9a09d, transparent) !important;
}

.bloom-error-note {
  max-width: 520px;
  margin: 32px auto 0 !important;
  padding: 16px 18px !important;
  border-radius: 16px !important;
  background: #fff8f8 !important;
  border: 1px solid rgba(185, 74, 72, 0.18) !important;
  color: #6f3e3d !important;
  text-align: center !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  letter-spacing: 0.03em !important;
}

.bloom-error-note p {
  margin: 0 0 6px !important;
  color: #6f3e3d !important;
  text-align: center !important;
}

.bloom-error-note p:last-child {
  margin-bottom: 0 !important;
}

.bloom-error-actions {
  margin: 34px auto 0 !important;
  text-align: center !important;
}

.bloom-retry-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 240px !important;
  min-height: 52px !important;
  padding: 14px 28px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #4f8b62 0%, #3f7d52 100%) !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
  letter-spacing: 0.05em !important;
  text-decoration: none !important;
  box-shadow: 0 12px 26px rgba(63, 125, 82, 0.22) !important;
}

.bloom-retry-button:hover {
  opacity: 0.88 !important;
  color: #fff !important;
}

.bloom-retry-button::before,
.bloom-retry-button::after {
  content: none !important;
  display: none !important;
}

@media screen and (max-width: 768px) {
  .bloom-error-note {
    margin-top: 28px !important;
    padding: 14px 16px !important;
    font-size: 13px !important;
    line-height: 1.75 !important;
  }

  .bloom-error-actions {
    margin-top: 30px !important;
  }

  .bloom-retry-button {
    min-width: 220px !important;
    min-height: 54px !important;
    padding: 13px 24px !important;
    font-size: 15px !important;
  }
}
