/* =========================================================
   StayPress Rakuten — Styles (Card + Compare Table)
   Cleaned & FIX applied (images never cropped; letterboxed)
   ========================================================= */

/* ============ 0) Theme tokens ============ */
:root{
  --prrt-gray-100:#fafafa;
  --prrt-gray-200:#eee;
  --prrt-gray-300:#e8e8e8;
  --prrt-text:#333;
  --prrt-muted:#666;
  --prrt-link:#2457d6;

  --rakuten:#bf0000;
  --jalan:#ff7f00;
  --ikyu:#222;
  --relux:#0046ad;
  --jtb:#d7003a;
  --yahoo:#6001d2;
}

/* =========================================================
   1) 宿カード (stay_card)
   ========================================================= */

.prrt-card{
  border:1px solid var(--prrt-gray-200);
  border-radius:12px;
  padding:16px;
  margin:16px 0;
  background:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}

/* ひとこと */
.prrt-card .editor-note{
  background:transparent !important;
  border:none !important;
  padding:0 !important;
  margin:14px 0 18px !important;
  font-weight:inherit;
  color:inherit;
}

/* セクション間隔 */
.prrt-card .image-wrapper,
.prrt-card .prrt-swiper{ margin-bottom:16px; }
.prrt-card .highlight-block{ margin:18px 0 16px; }
.prrt-card .button-container{ margin:16px 0 18px; }
.prrt-card .facility-head{ margin:18px 0 8px; }

/* おすすめポイント */
.prrt-card .highlight-block .title{
  display:flex; align-items:center; gap:8px;
  font-weight:800; color:var(--prrt-text); margin-bottom:10px;
}
.prrt-card .highlight-block .title::before{
  content:""; width:4px; height:1.15em; background:#2ca24e; border-radius:2px;
}
.prrt-card .highlight-points{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr));
  gap:10px 12px; margin:0; padding:0; list-style:none;
}
.prrt-card .highlight-points li{
  display:flex; align-items:center; gap:8px;
  padding:.65em .9em;
  border:1px solid #d7efdf; background:#f6fff8;
  border-radius:999px; font-weight:700;
  box-shadow:0 2px 8px rgba(44,162,78,.08);
}
.prrt-card .highlight-points li::before{
  content:""; width:18px; height:18px; flex:0 0 18px;
  border-radius:50%; border:2px solid #2ca24e; box-shadow:inset 0 0 0 3px #f6fff8;
}

/* CTA 区切り */
.prrt-card .cta-divider{
  display:flex; align-items:center; gap:12px; color:#777; font-weight:700; margin:.6em 0 .5em;
}
.prrt-card .cta-divider::before,
.prrt-card .cta-divider::after{
  content:""; flex:1; height:1px; background:linear-gradient(to right, transparent, #ddd);
}
.prrt-card .cta-divider span{ white-space:nowrap; }

/* ボタン（カード用） */
.prrt-card .button-container{
  display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:28px 0 36px;
}
@media (min-width:720px){
  .prrt-card .button-container{ grid-template-columns:repeat(3,1fr); }
}
.prrt-card .btn{
  display:flex; align-items:center; justify-content:center; text-align:center;
  min-height:44px; padding:.6em 1em; border-radius:10px;
  font-weight:800; font-size:.98rem; text-decoration:none; line-height:1.2;
  color:#fff;
}
.prrt-card .btn:hover{ filter:brightness(.96); }
.prrt-card .btn-rakuten{ background:var(--rakuten); }
.prrt-card .btn-jalan  { background:var(--jalan); }
.prrt-card .btn-ikkyu  { background:var(--ikyu); }
.prrt-card .btn-relux  { background:var(--relux); }
.prrt-card .btn-jtb    { background:var(--jtb); }
.prrt-card .btn-yahoo  { background:var(--yahoo); }

/* 施設情報 */
.prrt-card .facility-head{
  font-weight:800; color:var(--prrt-text);
  margin:36px 0 16px; display:flex; align-items:center; gap:10px;
}
.prrt-card .facility-head::after{
  content:""; flex:1; height:1px; background:linear-gradient(to right, var(--prrt-gray-300), transparent);
}
.prrt-card .facility-wrap{ position:relative; padding-bottom:46px; }
.prrt-card .facility-collapsible{
  max-height:230px; overflow:hidden; position:relative; transition:max-height .25s ease;
  border:1px solid var(--prrt-gray-200); border-radius:10px; background:#fff; margin-top:6px;
}
@media (max-width:640px){
  .prrt-card .facility-collapsible{ max-height:200px; }
}
.prrt-card .facility-collapsible::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:32px;
  background:linear-gradient(to bottom, rgba(255,255,255,0), #fff 65%); pointer-events:none;
}
.prrt-card .facility-collapsible.open{ max-height:none; }
.prrt-card .facility-collapsible.open::after{ display:none; }

.prrt-card .facility-table{ width:100%; border-collapse:separate; border-spacing:0; }
.prrt-card .facility-table th,
.prrt-card .facility-table td{
  padding:12px 14px; border-bottom:1px solid #f0f0f0; vertical-align:top; text-align:left;
}
.prrt-card .facility-table th{
  width:9.5em; color:#666; background:var(--prrt-gray-100); border-right:1px solid #f0f0f0;
}
.prrt-card .facility-table tr:first-child th{ border-top-left-radius:10px; }
.prrt-card .facility-table tr:first-child td{ border-top-right-radius:10px; }
.prrt-card .facility-table tr:last-child th,
.prrt-card .facility-table tr:last-child td{ border-bottom:none; }

.prrt-card .facility-source{ text-align:right; font-size:.82rem; color:#999; margin-top:8px; }

.prrt-card .facility-table .cell-review{ display:flex; flex-wrap:wrap; align-items:center; gap:.35em .6em; }
.prrt-card .facility-table .review-date-inline{ color:#777; font-size:.9em; margin-left:.2em; }

/* レビュー：リンク／数値（※星はCocoon [star]） */
.prrt-card .review-link{ margin-left:.5em; font-weight:700; color:var(--prrt-link); text-decoration:underline; }
.prrt-card .review-score{ margin-left:.35em; }

/* 詳細トグル */
.prrt-card .facility-toggle{
  position:absolute; left:50%; bottom:6px; transform:translateX(-50%);
  display:inline-flex; align-items:center; gap:8px; padding:.55em 1.1em;
  border-radius:999px; background:rgba(255,255,255,.92);
  border:1px solid #d9e4ff; color:var(--prrt-link); font-weight:800;
  box-shadow:0 6px 18px rgba(0,0,0,.08); cursor:pointer; backdrop-filter:blur(4px); z-index:3;
}
.prrt-card .facility-toggle .toggle-ico{
  width:10px; height:10px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(45deg); transition:transform .25s ease; margin-top:-2px;
}
.prrt-card .facility-wrap.open .facility-toggle .toggle-ico{ transform:rotate(-135deg); margin-top:2px; }

/* 画像 (Swiper) + クレジット
   ※ 画像は絶対にトリミングしない（contain でレターボックス） */
.prrt-card .prrt-swiper,
.prrt-card .image-wrapper{ margin-bottom:28px; }

/* 横長の表示枠は保ちつつ、画像は切らない */
.prrt-swiper .prrt-swiper-main{
  width:100%;
  height:clamp(220px,56vw,460px);
  border-radius:12px;
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:#fff;
}
.prrt-swiper .prrt-swiper-main .swiper-slide{
  display:flex; align-items:center; justify-content:center;
  background:#fff;
}
.prrt-swiper .prrt-swiper-main img{
  max-width:100% !important;
  max-height:100% !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
  display:block;
}

/* サムネイルも切らない（小さく収める） */
.prrt-swiper .prrt-swiper-thumbs{ margin-top:10px; }
.prrt-swiper .prrt-swiper-thumbs .swiper-slide{
  height:64px; border-radius:8px; overflow:hidden; opacity:.85; cursor:pointer;
  display:flex; align-items:center; justify-content:center; background:#fff;
}
@media (max-width:640px){
  .prrt-swiper .prrt-swiper-thumbs .swiper-slide{ height:56px; }
}
.prrt-swiper .prrt-swiper-thumbs .swiper-slide-thumb-active{ opacity:1; }
.prrt-swiper .prrt-swiper-thumbs img{
  max-width:100% !important;
  max-height:100% !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
  display:block;
}

.prrt-swiper .swiper-button-prev, .prrt-swiper .swiper-button-next{
  color:#fff; filter:drop-shadow(0 1px 6px rgba(0,0,0,.5));
}
.prrt-swiper{ position:relative; }
.prrt-credit{
  position:absolute; left:8px; bottom:8px; z-index:5;
  background:rgba(0,0,0,.6); color:#fff; font-size:12px; padding:2px 6px; border-radius:4px;
}

/* 単枚画像でも同様に「切らない」 */
.prrt-card .image-wrapper{
  position:relative; border-radius:12px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:#fff;
  /* 単枚でも横長枠に見せたいなら、必要に応じて比率を固定
     aspect-ratio: 16 / 9;  ←付けたい場合はコメントアウト解除 */
}
.prrt-card .image-wrapper a{ display:block; line-height:0; }
.prrt-card .image-wrapper img{
  max-width:100% !important;
  max-height:100% !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
  display:block;
}

/* 見出し内の日付は1行で */
.prrt-card .facility-table th .review-date-under{
  display:inline; margin-left:.6em; font-size:.9em; color:#777; font-weight:400; white-space:nowrap;
}
/* レビュー行の下線カット */
.prrt-card .facility-table tbody tr:first-child th,
.prrt-card .facility-table tbody tr:first-child td{ border-bottom:none; }

/* =========================================================
   2) 比較表 (stay_compare)
   ========================================================= */

/* ラッパー＆注記 */
.prrt-compare-wrap{ margin:18px 0 28px; }
.prrt-compare-wrap .compare-caption{
  display:flex; align-items:center; gap:10px; padding:10px 12px;
  border:1px solid #e6eefc; background:#f7faff; color:#1e3a8a;
  font-weight:800; border-radius:10px; box-shadow:0 2px 8px rgba(30,58,138,.06);
}
.prrt-compare-wrap .compare-caption::after{
  content:""; flex:1 1 auto; height:1px; margin-left:8px; background:linear-gradient(to right, #dbe7ff, transparent);
}
.prrt-compare-wrap .table-note{ margin:0 0 8px; font-size:.9rem; color:#666; }
.prrt-compare-wrap .table-note--below{ margin:10px 0 0; }
.prrt-compare-wrap .sr-only{
  position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px);
}

/* スクロールコンテナ */
.prrt-compare-wrap .table-scroll{ overflow-x:auto; }

/* 表本体（Safari対策入り） */
.prrt-compare-table{
  width:100%;
  min-width:900px;
  border-collapse:separate;
  border-spacing:0;
  table-layout:auto;
  font-size:.88rem;
}
.prrt-compare-table thead th{
  position:sticky; top:0; z-index:1;
  background:#f9fbff; color:#244; border-bottom:2px solid #e1eaff;
  box-shadow:inset 0 -1px 0 #e1eaff, 0 1px 0 rgba(0,0,0,0.02);
}
.prrt-compare-table th,
.prrt-compare-table td{
  padding:8px 10px; border-bottom:1px solid var(--prrt-gray-200);
  text-align:left; vertical-align:top;
  height:auto;
  word-break:break-word; overflow-wrap:anywhere;
}

/* 宿名 */
.prrt-compare-table .c-name{
  min-width:220px; max-width:28em;
  white-space:nowrap; font-weight:700; color:#222;
}
.prrt-compare-table .c-name a{ color:var(--prrt-link); text-decoration:none; }
.prrt-compare-table .c-name a:hover{ text-decoration:underline; }

/* 画像（小さめ、比率固定） */
.prrt-compare-table .c-img{ width:100px; }
.prrt-compare-table .c-img .thumb{
  width:90px; aspect-ratio:4/3; border-radius:6px; overflow:hidden; margin:0 auto;
  display:flex; align-items:center; justify-content:center; background:#fff;
}
.prrt-compare-table .c-img img{
  max-width:100% !important; max-height:100% !important;
  width:auto !important; height:auto !important;
  object-fit:contain !important; display:block;
}

/* 価格 */
.prrt-compare-table .c-price .price{ font-weight:700; color:#333; white-space:nowrap; }

/* 予約サイト（楽天・じゃらん・Yahooのみ） */
.prrt-compare-table .c-ota{ min-width:280px; }
.prrt-compare-table .c-ota .button-container{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.prrt-compare-table .c-ota .btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:5px 10px; border-radius:6px; font-size:.82rem; line-height:1.2; color:#fff; font-weight:700;
}
.prrt-compare-table .btn-rakuten{ background:var(--rakuten); }
.prrt-compare-table .btn-jalan  { background:var(--jalan); }
.prrt-compare-table .btn-yahoo  { background:var(--yahoo); }

/* レビュー */
.prrt-compare-table .c-review{ font-size:.82rem; color:#444; white-space:nowrap; width:72px; }

/* 長文列（全文表示が前提：折返し許可） */
.prrt-compare-table .c-address,
.prrt-compare-table .c-access,
.prrt-compare-table .c-official{
  white-space:normal;
  max-width:36em;
}
.prrt-compare-table .c-official{ min-width:20rem; max-width:none; }

/* 行の折りたたみ */
.prrt-compare-table tbody tr.is-folded{ display:none; }
.compare-more{ text-align:center; margin-top:12px; }
.compare-more .compare-toggle{
  border:1px solid #d0d7de; background:#fff; border-radius:999px; padding:10px 18px; cursor:pointer;
}
.compare-more .compare-toggle:focus-visible{ outline:3px solid rgba(0,127,255,.35); outline-offset:2px; }

/* しましま・ホバー */
.prrt-compare-table tbody tr:nth-child(even){ background:#fcfcfd; }
.prrt-compare-table tbody tr:hover{ background:#f7faff; }

/* 汎用クランプ（他所で使う前提。比較表内では全文表示に上書き済み） */
.clamp-2{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
  overflow:hidden; text-overflow:ellipsis; white-space:normal; line-height:1.5; max-height:calc(1.5em * 2); }
.clamp-3{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;
  overflow:hidden; text-overflow:ellipsis; white-space:normal; line-height:1.5; max-height:calc(1.5em * 3); }

/* ====== PC：コンパクトにしつつ崩れない ====== */
@media (min-width:1025px){
  .prrt-compare-table{ min-width:900px; }
  .prrt-compare-table .c-img{ width:80px; }
  .prrt-compare-table .c-img .thumb{ width:72px; }
  .prrt-compare-table .c-price{ width:100px; }
}

/* ====== スマホ：横スク量を抑えつつ読みやすく ====== */
@media (max-width:768px){
  .prrt-compare-table{
    font-size:.88rem; min-width:700px; table-layout:auto;
  }
  .prrt-compare-table th,
  .prrt-compare-table td{ padding:6px 6px; }
  .prrt-compare-table .c-name{
    min-width:7.5rem; width:7.5rem; max-width:7.5rem; white-space:normal;
  }
  .prrt-compare-table .c-img{ width:72px; }
  .prrt-compare-table .c-img .thumb{ width:64px; }
  .prrt-compare-table .c-price{ width:92px; }
  .prrt-compare-table .c-ota{ min-width:240px; }
  .prrt-compare-table .c-ota .btn{
    padding:4px 8px; font-size:.78rem; border-radius:6px;
  }
  .prrt-compare-table .c-review{ width:64px; }
  .prrt-compare-table .c-address{ min-width:11rem; }
  .prrt-compare-table .c-access { min-width:10.5rem; }
  .prrt-compare-table .c-official{ min-width:14rem; }
}

/* ===== Fix pack: stay_compare 幅・クランプ・余白の整形（必ず最後に置く） ===== */

/* 列幅の基準（PC） */
.prrt-compare-table .c-ota      { min-width: 240px !important; }
.prrt-compare-table .c-review   { width: 72px !important; }
.prrt-compare-table .c-address  { min-width: 13rem !important; width: 13rem !important; }
.prrt-compare-table .c-access   { min-width: 12rem !important; width: 12rem !important; }
.prrt-compare-table .c-official { min-width: 20rem !important; max-width: none !important; white-space: normal !important; }

/* モバイルは少しだけ詰める */
@media (max-width: 768px){
  .prrt-compare-table .c-ota      { min-width: 220px !important; }
  .prrt-compare-table .c-address  { min-width: 11rem !important; width: auto !important; }
  .prrt-compare-table .c-access   { min-width: 10.5rem !important; width: auto !important; }
  .prrt-compare-table .c-official { min-width: 14rem !important; }
}

/* 比較表内は “全文表示” にする（clamp 無効化） */
.prrt-compare-table .clamp-2,
.prrt-compare-table .clamp-3{
  display: block !important;
  -webkit-line-clamp: unset !important;
  max-height: none !important;
  overflow: visible !important;
  white-space: normal !important;
}

/* ヘッダーが縦長化しないよう、セルは常に上揃え＋自動高さ */
.prrt-compare-table th,
.prrt-compare-table td{
  vertical-align: top !important;
  height: auto !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

/* 見出しと表の間に余裕を作る */
.prrt-compare-wrap .compare-caption{ margin: 6px 0 12px !important; }
.prrt-compare-wrap .table-scroll   { margin-top: 4px !important; }

/* ===== 高さベース折りたたみ用 ===== */
.prrt-fold { position: relative; }
.prrt-fold .table-scroll { max-height: none; }
.prrt-fold.is-clamped .table-scroll { max-height: var(--prrt-fold-max, 420px); overflow-y: hidden; }
.prrt-fold .prrt-fade{
  display: none; position: absolute; left: 0; right: 0; bottom: 42px; height: 48px;
  pointer-events: none; background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 70%);
}
.prrt-fold.is-clamped .prrt-fade{ display:block; }
.prrt-fold .compare-more{ display:none; text-align:center; margin-top:10px; }
.prrt-fold.is-clamped .compare-more{ display:block; }
.prrt-fold .compare-toggle{
  border:1px solid #d0d7de; background:#fff; border-radius:999px; padding:10px 18px; cursor:pointer; font-weight:700; color:#2457d6;
}
.prrt-fold .compare-toggle:focus-visible{ outline:3px solid rgba(0,127,255,.35); outline-offset:2px; }

/* === 高さ折りたたみの見た目 ===================== */
.prrt-compare-wrap .table-scroll-wrap{ position: relative; margin-top: 8px; }
.prrt-compare-wrap .table-scroll-wrap .table-fade{
  display: none; position: absolute; left: 0; right: 0; bottom: 0; height: 40px;
  background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 65%); pointer-events: none; z-index: 1;
}
.prrt-compare-wrap .compare-more{ text-align: center; margin-top: 10px; }
.prrt-compare-wrap .compare-toggle-open,
.prrt-compare-wrap .compare-toggle-close{
  border:1px solid #d0d7de; background:#fff; border-radius:999px; padding:10px 18px; cursor:pointer;
}

/* =========================================================
   FINAL OVERRIDE — Images: never crop, always letterboxed
   （テーマや他プラグインに勝つため最終行に配置）
   ========================================================= */

/* メイン表示枠（Swiper 上段）を常に横長レターボックスで固定 */
.prrt-card .prrt-swiper .prrt-swiper-main{
  height: clamp(220px, 56vw, 460px) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  background:#fff !important;
  border-radius:12px !important;
}

/* スライド内の配置を中央に固定（テーマの干渉除去） */
.prrt-card .prrt-swiper .prrt-swiper-main .swiper-slide{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#fff !important;
}

/* “絶対に切らない” 画像ルール（contain を最優先） */
.prrt-card .prrt-swiper .prrt-swiper-main img,
.prrt-card .image-wrapper img{
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  display:block !important;
}

/* 下部サムネイルも切らない＋中央寄せ */
.prrt-card .prrt-swiper .prrt-swiper-thumbs .swiper-slide{
  height:64px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  background:#fff !important;
  border-radius:8px !important;
}
@media (max-width:640px){
  .prrt-card .prrt-swiper .prrt-swiper-thumbs .swiper-slide{ height:56px !important; }
}
.prrt-card .prrt-swiper .prrt-swiper-thumbs img{
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  display:block !important;
}

/* メイン画像（Swiper/単枚共通） */
.prrt-fit-img{
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:clamp(220px, 56vw, 460px) !important;
  object-fit:contain !important;
  display:block !important;
  background:#fff;
}

/* サムネイル */
.prrt-fit-thumb{
  width:auto !important;
  height:100% !important;
  max-width:100% !important;
  object-fit:contain !important;
  display:block !important;
}