/* 本システム独自の追加スタイル(テーマ複製ファイルは触らずここに足す) */
.column .rlabel,
.studiocard .rlabel {
    display: inline-block;
    margin: .35em 0;
    padding: .1em .6em;
    font-size: .7em;
    font-weight: 700;
    color: #1A1A1A;
    border: 1px solid #1A1A1A;
    border-radius: 3px;
    line-height: 1.6;
}

/* 一覧カードの最低利用時間(時計アイコン) */
.list .container .row .column a .body .price .mintime {
    display: inline-block;
    margin-left: 1em;
    padding: 0 0 0 1.5em;
    background-image: url(../images/icon/mintime.svg);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: auto 1.125em;
}

/* 料金行のツールチップ */
.price [data-tip] { position: relative; cursor: help; }
.price [data-tip]:hover::after {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    padding: .35em .8em;
    background: #1a1a1a;
    color: #fff;
    font-size: .75em;
    font-weight: 400;
    line-height: 1.4;
    white-space: nowrap;
    border-radius: 4px;
    z-index: 20;
    pointer-events: none;
}
.price [data-tip]:hover::before {
    content: "";
    position: absolute;
    bottom: calc(100% + 3px);
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: #1a1a1a;
    z-index: 20;
    pointer-events: none;
}

/* スタジオ詳細ページの空き状況ヒートバー */
.availability { margin: 2em 0; }
.availability h3 { margin-bottom: .5em; }
.avail-note { font-size: .75em; color: #777; line-height: 1.6; margin-bottom: .8em; }
.avail-legend { display: flex; flex-wrap: wrap; gap: 1em; margin-bottom: .8em; font-size: .8125em; }
.avail-legend .sw { display: inline-block; width: 1em; height: 1em; margin-right: .35em; border-radius: 2px; vertical-align: -.1em; }
.avail-legend .sw.free { background: #BBE3C6; }
.avail-legend .sw.tentative { background: #F4C95D; }
.avail-legend .sw.busy { background: #1A1A1A; }
.avail-legend .sw.closed { background: #ECECEC; }

.avail-ticks { padding-left: 6.5em; }
.avail-ticks .ticks { display: flex; justify-content: space-between; font-size: .6875em; color: #aaa; }
.avail-row { display: grid; grid-template-columns: 6.5em 1fr; align-items: center; column-gap: .5em; margin-bottom: .3em; }
.avail-row.is-today { background: #FAFAF5; border-radius: 4px; }
.avail-day { font-size: .8125em; white-space: nowrap; }
.avail-day .wd { font-weight: normal; }
.avail-day.weekend .wd { color: #C0392B; }
.avail-bar { display: grid; grid-template-columns: repeat(48, 1fr); gap: 1px; height: 1.5em; border-radius: 3px; overflow: hidden; background: #fff; }
.avail-bar .c { display: block; height: 100%; }
.avail-bar .c-free { background: #BBE3C6; }
.avail-bar .c-tentative { background: #F4C95D; }
.avail-bar .c-busy { background: #1A1A1A; }
.avail-bar .c-closed { background: #ECECEC; }
.avail-nav { display: flex; align-items: center; justify-content: space-between; margin-top: .8em; font-size: .8125em; }
.avail-nav .range { color: #777; }
.avail-nav a { color: #1A1A1A; font-weight: 700; }

/* 周辺スタジオ(詳細ページ下部)のシンプルカード */
.related-studios { margin: 2.5em 0; }
.related-studios .container { width: 92%; max-width: 960px; margin: 0 auto; }
.related-heading { font-size: 1.2em; font-weight: 700; margin-bottom: 1em; }
.mini-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5em 1.25em; }
.mini-card a { display: block; color: inherit; text-decoration: none; }
.mini-card .mini-image { aspect-ratio: 4 / 3; border-radius: .5em; overflow: hidden; background: #f3f3f3; }
.mini-card .mini-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.mini-card a:hover .mini-image img { transform: scale(1.04); }
.mini-loc { display: flex; align-items: center; gap: .3em; margin-top: .6em; font-size: .8125em; color: #666; }
.mini-loc .ico { width: 1em; height: 1em; opacity: .65; }
.mini-name { font-size: 1.0625em; font-weight: 700; line-height: 1.45; margin: .2em 0 .35em; }
.mini-card a:hover .mini-name { text-decoration: underline; }
.mini-desc { font-size: .8125em; color: #666; line-height: 1.6; margin-bottom: .6em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mini-meta { display: flex; align-items: center; flex-wrap: wrap; gap: .4em 1.2em; font-size: .8125em; color: #333; }
.mini-meta span { display: inline-flex; align-items: center; gap: .35em; }
.mini-meta .ico { width: 1em; height: 1em; opacity: .65; }
@media (max-width: 769px) {
  .mini-grid { grid-template-columns: repeat(2, 1fr); gap: 1.2em 1em; }
}

/* 予約導線(ボタン・空きセルクリック) */
.preview-flag { margin-bottom: .8em; padding: .5em .8em; background: #FFF7E0; border: 1px solid #E8B84B; border-radius: 4px; font-size: .8125em; color: #8a6d1a; }
.avail-pick-hint { margin-top: .6em; font-size: .75em; color: #888; }
.availability[data-bookable] .avail-bar .c-free { cursor: pointer; }
.availability[data-bookable] .avail-bar .c-free:hover { outline: 2px solid #1A1A1A; outline-offset: -1px; }
.reserve-flash { animation: reserveFlash 1.2s ease; }
@keyframes reserveFlash { 0%, 100% { background: transparent; } 25% { background: #FFF7E0; } }
.floating-reserve {
  position: fixed; right: 1.5em; bottom: 1.5em; z-index: 9999;
  display: inline-flex; align-items: center; gap: .5em;
  padding: .9em 1.5em; border-radius: 2.5em;
  background: #1A1A1A; color: #fff; font-weight: 700; font-size: .9375em;
  text-decoration: none; box-shadow: 0 4px 16px rgba(0,0,0,.25);
  transition: transform .2s ease, opacity .2s ease;
}
.floating-reserve:hover { transform: translateY(-2px); color: #fff; }
.floating-reserve.is-hidden { opacity: 0; pointer-events: none; transform: translateY(1em); }
@media (max-width: 769px) {
  /* スマホは既存の #sp_reserve 固定バーを使うため、フローティングは非表示 */
  .floating-reserve { display: none; }
}