/*
 * Cosboo Cards：チケット購入ボタン（デザイン案 D）
 * - PC・タブレット：右下に横長のオレンジのピル（.cb-ticket-pill）
 * - スマホ（幅 767px 以下）：画面の下に紺の帯（.cb-ticket-bar）。本文に重ならないよう、ページの下に帯の高さ分の余白を足す
 * テーマの footer.php に直接書かれた今のボタン（#return_top の中の画像）は隠す。
 */
/* テーマの responsive.css（後から読み込まれる）が #return_top に display:block !important を付けているので、body と div を足して強くする */
body div#return_top {
  display: none !important;
}

.cb-ticket-pill,
.cb-ticket-bar {
  --cb-or: rgb(var(--tcd-key1-color, 255, 90, 0));
  --cb-navy: #2a3045;
  --cb-yel: #ffe14d;

  font-family: "M PLUS 2", sans-serif;
  text-decoration: none;
  box-sizing: border-box;
}

/* ===== PC：右下のピル ===== */
.cb-ticket-pill {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 900; /* ヘッダー（1000）と、スマホのメニューを開いたときの暗い幕（999）より下 */
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 56px;
  padding: 0 22px 0 8px;
  border-radius: 99px;
  background: var(--cb-or);
  color: #fff;
  font-weight: 800;
  box-shadow: 0 8px 18px rgba(194, 68, 0, .35);
  transition: transform .2s ease, box-shadow .2s ease;
}
.cb-ticket-pill:hover,
.cb-ticket-pill:focus-visible {
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 12px 22px rgba(194, 68, 0, .4);
}
.cb-ticket-pill:focus-visible {
  outline: 3px solid var(--cb-navy);
  outline-offset: 3px;
}
.cb-ticket-pill__ic {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #fff;
  color: var(--cb-or);
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
}
.cb-ticket-pill__ic sup {
  font-size: 10px;
  vertical-align: super;
}
.cb-ticket-pill__txt {
  font-size: 15px;
  line-height: 1.25;
  white-space: nowrap;
}
.cb-ticket-pill__txt::after {
  content: " →";
}
.cb-ticket-pill__txt small {
  display: block;
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--cb-yel);
}

/* ===== スマホ：画面の下の帯 ===== */
.cb-ticket-bar {
  display: none;
}
@media (max-width: 767px) {
  .cb-ticket-pill {
    display: none;
  }
  .cb-ticket-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 60px;
    padding: 8px 14px calc(8px + env(safe-area-inset-bottom));
    background: var(--cb-navy);
    color: #fff;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, .15);
  }
  .cb-ticket-bar:hover,
  .cb-ticket-bar:focus-visible {
    color: #fff;
  }
  .cb-ticket-bar__txt {
    min-width: 0;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
  }
  .cb-ticket-bar__txt small {
    display: block;
    font-size: 11px;
    color: var(--cb-yel);
  }
  .cb-ticket-bar__go {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: none;
    height: 40px;
    padding: 0 16px;
    border-radius: 99px;
    background: var(--cb-or);
    font-size: 14px;
    font-weight: 800;
  }
  .cb-ticket-bar__go::after {
    content: "→";
  }
  /* 帯の下に本文・フッター（コピーライト）が隠れないよう、ページの下に帯の高さ分の余白を足す */
  body {
    padding-bottom: calc(60px + env(safe-area-inset-bottom)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cb-ticket-pill {
    transition: none;
  }
}