/**
 * assets/css/cruise-cards.css
 *
 * Shared stylesheet for the "compose" cruise card look (.cruise-card and
 * everything inside it) — extracted out of compose_search.php's inline
 * <style> block so any page that renders cards through
 * includes/compose_group_card.php or includes/compose_sail_card.php can
 * just link this file instead of needing its own copy.
 *
 * This is what was missing on render.php: the PageMaker "sailing_search"
 * block prints the exact same .cruise-card markup compose does, but
 * render.php only ever linked bootstrap.min.css + fonts.css — never this.
 * Same markup, no matching styles, so the cards showed up as plain
 * unstyled text/links.
 *
 * compose_search.php still has its own inline copy of these same rules —
 * intentionally left alone for now so nothing about the live compose page
 * changes. Worth pointing compose_search.php at this file too later and
 * deleting its inline copy, so there's truly only one copy of this CSS,
 * but that's a separate cleanup, not done here.
 */

/* ── CRUISE CARD ── */
.cruise-card{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 2px 14px rgba(0,0,0,.07);margin-bottom:18px;transition:box-shadow .2s,transform .18s}
.cruise-card:hover{box-shadow:0 8px 30px rgba(0,0,0,.12);transform:translateY(-2px)}
.card-top{display:flex;align-items:stretch;min-height:220px}

/* Image */
.card-img{flex:0 0 300px;position:relative;overflow:hidden;background:#0d2b52}
.card-img img.ship-img{width:100%;height:100%;object-fit:cover;display:block;min-height:220px;transition:transform .4s}
.cruise-card:hover .card-img img.ship-img{transform:scale(1.04)}

/* Vendor logo badge — replaces text badge */
.img-vendor-logo-wrap{
    position:absolute;top:12px;left:12px;
    background:rgba(255,255,255,.96);
    border-radius:8px;
    padding:5px 10px;
    box-shadow:0 2px 8px rgba(0,0,0,.18);
    max-width:130px;
    display:flex;align-items:center;
}
.img-vendor-logo-wrap img{
    max-height:32px;width:auto;max-width:120px;display:block;
}
.img-badge-nights{position:absolute;bottom:14px;left:14px;background:#fff;color:#1a1f2e;font-size:13px;font-weight:700;padding:5px 13px;border-radius:50px;box-shadow:0 2px 8px rgba(0,0,0,.15)}

/* Heart / favorite button wrapper — positions the real .cb-heart button
   (from includes/heart_js.php) inside compose's dark circular badge. */
.cc-heart-wrap{
    position:absolute;top:12px;right:12px;
    background:rgba(5,16,30,.55);backdrop-filter:blur(4px);
    border-radius:50%;width:34px;height:34px;
    display:flex;align-items:center;justify-content:center;
    z-index:5;
}
.cc-heart-wrap .cb-heart{ color:#fff; }
.cc-heart-wrap .cb-heart:hover{ color:#e8566a; }
.cc-heart-wrap .cb-heart-saved{ color:#e8566a !important; }

/* Info */
.card-info{flex:1;padding:22px 24px;display:flex;flex-direction:column;justify-content:space-between;min-width:0}
.card-vendor-lbl{font-size:11.5px;font-weight:700;color:#0055a5;text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px}
.card-title{font-family:'Montserrat',sans-serif;font-size:21px;font-weight:800;color:#1a1f2e;margin:0 0 4px;line-height:1.2}
.card-title a{color:#1a1f2e}
.card-title a:hover{color:#0055a5}
.card-ship{font-size:13.5px;color:#4a5568;margin-bottom:10px}
.card-ship a{color:#0055a5;font-weight:600}
.card-ship a:hover{text-decoration:underline}
.card-meta{display:flex;align-items:center;gap:7px;font-size:13px;color:#5a6a82;margin-bottom:5px}
.card-ports{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.port-chip{padding:4px 11px;background:#f0f5ff;color:#0055a5;border-radius:50px;font-size:12px;font-weight:500;transition:background .12s;display:inline-block}
.port-chip:hover{background:#dbeafe}
.port-chip-more{background:#e8edf5;color:#6b7a99;cursor:pointer;user-select:none}
.port-chip-more:hover{background:#0055a5;color:#fff}

/* Price panel */
.card-price{flex:0 0 200px;background:linear-gradient(160deg,#0d2b52 0%,#0f4080 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px 16px;text-align:center;gap:10px}
.price-from-lbl{font-size:11px;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.price-amt{font-family:'Montserrat',sans-serif;font-size:36px;font-weight:800;color:#fff;line-height:1}
.price-amt sup{font-size:17px;vertical-align:top;margin-top:4px;display:inline-block;line-height:1.5}
.price-pn{font-size:12px;color:rgba(255,255,255,.6)}
.price-call{font-size:16px;font-weight:700;color:#fff;text-align:center;padding:0 4px;line-height:1.4}
.btn-dates{display:block;width:100%;padding:10px 12px;background:#fff;color:#0055a5;border:none;border-radius:50px;font-size:13px;font-weight:700;cursor:pointer;font-family:'Inter',sans-serif;transition:all .15s}
.btn-dates:hover{background:#e8f0fe;transform:translateY(-1px)}
.btn-quote-card{display:block;width:100%;padding:9px 12px;background:rgba(255,255,255,.13);color:#fff;border:1.5px solid rgba(255,255,255,.35);border-radius:50px;font-size:12.5px;font-weight:600;cursor:pointer;font-family:'Inter',sans-serif;transition:all .15s}
.btn-quote-card:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.65)}

/* Dates panel (grouped/multi-date cards) */
.dates-panel{display:none;border-top:2px solid #e8f0fe;background:#f7faff}
.dates-panel.open{display:block}
.dates-tbl{width:100%;border-collapse:collapse}
.dates-tbl th{padding:11px 14px;font-size:11px;font-weight:700;color:#0055a5;text-transform:uppercase;letter-spacing:.07em;background:#eef4ff;border-bottom:1px solid #d4e3ff;text-align:left;white-space:nowrap}
.dates-tbl td{padding:12px 14px;font-size:13px;border-bottom:1px solid #edf1f8;vertical-align:middle}
.dates-tbl tr:last-child td{border-bottom:none}
.dates-tbl tbody tr:hover{background:#eef5ff}
.td-date{font-weight:500;white-space:nowrap;color:#1a1f2e;min-width:110px}
.dates-tbl th.th-cat{text-align:right;white-space:nowrap}
.td-cat{text-align:right;white-space:nowrap;vertical-align:middle}
.cat-price{font-weight:700;color:#0055a5;font-size:15px}
.cat-price small{font-size:11px;font-weight:400;color:#8894a8;margin-left:1px}
.td-cat-na{text-align:right;color:#ccc;font-size:18px;vertical-align:middle}
.savings-badge{
    border-bottom: 2px solid #28a745;
    color: #1a7a32;
    font-weight: 800;
    display: inline;
}
.td-cat.has-sale .cat-price{ color: #1a7a32; }
.td-actions{text-align:right;white-space:nowrap;padding-right:18px !important}
.tbl-air-btn{
    display:inline-block;padding:7px 12px;
    background:#e8f0fe;color:#0055a5;
    border:none;border-radius:50px;font-size:12px;font-weight:700;
    cursor:pointer;font-family:'Inter',sans-serif;
    margin-right:6px;transition:background .15s;
}
.tbl-air-btn:hover{background:#dbeafe;}
.tbl-book{display:inline-block;padding:8px 18px;background:#0055a5;color:#fff;border-radius:50px;font-size:13px;font-weight:600;white-space:nowrap;text-decoration:none;transition:background .15s}
.tbl-book:hover{background:#003d7a;color:#fff}
.tbl-quote{display:inline-block;padding:8px 14px;background:#ff6b00;color:#fff;border:none;border-radius:50px;font-size:13px;font-weight:600;cursor:pointer;font-family:'Inter',sans-serif;margin-left:7px;transition:background .15s;white-space:nowrap}
.tbl-quote:hover{background:#e05a00}

/* Single-sailing category grid shown directly on card */
.single-cats{margin-top:14px;border-top:1px solid #e8f0fe;padding-top:12px;display:flex;flex-wrap:wrap;gap:8px}
.single-cat-item{flex:1;min-width:90px;background:#f7faff;border-radius:10px;padding:10px 12px;text-align:center;border:1px solid #e2ecff}
.single-cat-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#8894a8;display:block;margin-bottom:4px}
.single-cat-price{font-size:17px;font-weight:800;color:#0055a5;display:block;line-height:1}
.single-cat-price small{font-size:10px;font-weight:400;color:#8894a8}
.single-cat-item.has-sale{border-color:#28a745;background:#f0fff4}
.single-cat-item.has-sale .single-cat-lbl{color:#1a7a32}
.single-cat-item.has-sale .single-cat-price{color:#1a7a32}

/* Ship exclude button on card */
.ship-exclude-btn{
    display:inline-flex;align-items:center;gap:3px;
    margin-left:8px;padding:2px 8px;
    background:none;border:1.5px solid #e2e8f0;border-radius:50px;
    font-size:11px;font-weight:600;color:#8894a8;
    cursor:pointer;font-family:'Inter',sans-serif;
    transition:all .15s;vertical-align:middle;
}
.ship-exclude-btn:hover{
    background:#fff0f0;border-color:#c0392b;color:#c0392b;
}
.bonus-badge{
    position:absolute;bottom:14px;left:14px;
    display:inline-flex;align-items:center;
    padding:5px 13px;
    background:#28a745;color:#fff;
    border-radius:50px;font-size:12px;font-weight:700;
    cursor:pointer;border:none;font-family:'Inter',sans-serif;
    letter-spacing:.03em;transition:all .15s;
    text-transform:uppercase;
    box-shadow:0 2px 8px rgba(0,0,0,.2);
}
.bonus-badge:hover{background:#1e7e34;transform:translateY(-1px);box-shadow:0 4px 12px rgba(40,167,69,.4)}
.card-bonus-row{margin-bottom:10px}

/* See all bar */
.see-all-bar{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 20px;background:#f0f5ff;border-top:1px solid #e2ecff;cursor:pointer;font-size:13.5px;font-weight:600;color:#0055a5;border-radius:0 0 18px 18px;transition:background .15s;user-select:none}
.see-all-bar:hover{background:#dbeafe}
.see-all-caret{font-size:11px;transition:transform .25s}
.see-all-bar.open .see-all-caret{transform:rotate(180deg)}

@media(max-width:991px){
    .card-img{flex:0 0 240px}
    .card-price{flex:0 0 175px}
    .price-amt{font-size:30px}
}
@media(max-width:767px){
    .card-top{flex-direction:column}
    .card-img{flex:none;min-height:190px;max-height:200px}
    .card-img img.ship-img{min-height:190px}
    .card-price{flex:none;flex-direction:row;flex-wrap:wrap;gap:8px;padding:14px 16px}
    .price-from-lbl{display:none}
    .price-amt{font-size:26px}
    .btn-dates,.btn-quote-card{flex:1}
    .dates-tbl th,.dates-tbl td{padding:9px 10px;font-size:12px}
}
