/* Waylo public trip discovery — uses shared light/dark tokens */
.public-trips { max-width: 1190px; margin: 0 auto; padding: 53px 25px 85px; color: var(--text); }
.explore-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin-bottom: 29px; }
.explore-heading h1,.detail-page h1 { margin: 10px 0 13px; font-size: clamp(30px,4vw,45px); color: var(--text); letter-spacing: -1.3px; }
.explore-heading p { color: var(--muted); font-size: 14px; }
.trip-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px,1fr)); gap: 21px; }
.trip-card,.trip-booking-panel { background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: 17px; overflow: hidden; }
.trip-cover { position: relative; display: block; height: 215px; overflow: hidden; background: #1b5947; }
.trip-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.trip-cover-placeholder { display: grid; place-items: center; width: 100%; height: 100%; color: #dbf4eb; font-size: 65px; background: linear-gradient(135deg,#316d5a,#102e24); }
.trip-cover-label { position: absolute; top: 13px; left: 14px; border-radius: 100px; background: #fff; color: #176c59; padding: 7px 11px; font-size: 11px; font-weight: 800; }
.trip-card-body { padding: 21px; }
.trip-location { color: #168c78; font-size: 12px; font-weight: 800; }
.trip-card h2 { margin: 8px 0 12px; color: var(--text); font-size: 22px; line-height: 1.3; }
.trip-description { font-size: 13px; line-height: 1.6; color: var(--muted); white-space: pre-wrap; overflow-wrap: anywhere; max-height: 65px; overflow: hidden; }
.trip-meta { display: flex; gap: 17px; flex-wrap: wrap; padding: 13px 0 17px; color: var(--muted); font-size: 12px; }
.trip-card-footer { display: flex; gap: 12px; justify-content: space-between; align-items: center; border-top: 1px solid var(--border); padding-top: 15px; }
.trip-price { display: flex; flex-direction: column; gap: 2px; }
.trip-price > span { color: #168c78; font-size: 23px; font-weight: 800; }
.trip-price small { color: var(--muted); font-size: 11px; }
.trip-cta { display: inline-flex; justify-content: center; align-items: center; padding: 11px 15px; border-radius: 10px; font-size: 12px; font-weight: 800; background: #168c78; color: #fff !important; }
.trip-cta:hover { background: #106d5d; }
.empty-trip { padding: 40px; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; }
.empty-trip h2 { color: var(--text); }
.empty-trip p { color: var(--muted); }
.detail-cover { height: min(40vw,400px); min-height: 180px; overflow: hidden; border-radius: 18px; background: #2e6555; margin-top: 21px; }
.detail-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.trip-detail-grid { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(290px,1fr); gap: 30px; margin-top: 30px; }
.trip-detail-main { color: var(--text); }
.trip-detail-main h2 { color: var(--text); margin: 30px 0 14px; }
.trip-organizer { color: var(--muted); font-size: 13px; }
.trip-organizer a { color: #168c78; font-weight: 800; }
.trip-detail-description { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text); line-height: 1.8; font-size: 14px; }
.trip-booking-panel { align-self: start; padding: 24px; }
.trip-booking-panel dl { display: grid; grid-template-columns: 110px 1fr; gap: 12px; border-top: 1px solid var(--border); padding-top: 19px; }
.trip-booking-panel dt { color: var(--muted); font-size: 12px; }
.trip-booking-panel dd { color: var(--text); margin: 0; font-size: 13px; font-weight: 800; }
.booking-notice { margin: 20px 0; padding: 14px; color: var(--text); background: var(--background); border: 1px solid var(--border); border-radius: 12px; }
.booking-notice strong { font-size: 13px; }
.booking-notice p { font-size: 12px; line-height: 1.7; color: var(--muted); }
.detail-page .trip-cta { width: 100%; }
@media (max-width:750px) { .public-trips { padding: 28px 15px 65px; } .explore-heading { align-items: start; flex-direction: column; } .trip-detail-grid { grid-template-columns: 1fr; } .detail-cover { min-height: 220px; } }

/* Real destination discovery and SSLCommerz sandbox booking UI */
.explore-search { display:flex; gap:12px; flex-wrap:wrap; align-items:stretch; margin:25px 0 12px; padding:16px; background:var(--surface); border:1px solid var(--border); border-radius:15px; }
.search-field { display:flex; align-items:center; gap:10px; flex:1 1 280px; min-width:0; padding:0 13px; border:1px solid var(--border); border-radius:10px; background:var(--field); color:var(--muted); }
.search-field .wa-icon { width:20px; height:20px; }
.search-field input { flex:1; min-width:0; border:0; outline:0; background:transparent; color:var(--text); padding:13px 0; font:inherit; }
.search-field input:focus { box-shadow:none; border:0; outline:0; }
.search-field:focus-within { outline:2px solid var(--green); outline-offset:2px; }
.search-field input::placeholder { color:var(--muted); opacity:1; }
.explore-search select { flex:0 1 230px; min-height:47px; color:var(--text); background:var(--field); border:1px solid var(--border); border-radius:10px; padding:10px; }
.explore-search select option { background:var(--field); color:var(--text); }
.explore-search .action-primary { flex:0 0 auto; }
.clear-search { align-self:center; color:var(--green); font-weight:800; font-size:13px; }
.result-count { color:var(--muted); font-size:13px; line-height:1.65; margin:12px 0 22px; }
.trip-location,.trip-meta span { display:inline-flex; align-items:center; gap:6px; }
.trip-location .wa-icon,.trip-meta .wa-icon { width:16px; height:16px; }
.trip-cover-placeholder .wa-icon { width:67px; height:67px; color:#d3efe2; }
.trip-card { transition:transform .16s ease, box-shadow .16s ease; }
.trip-card:hover { transform:translateY(-3px); box-shadow:0 12px 30px rgba(0,0,0,.09); }
.trip-meta strong { color:var(--text); }
.booking-sandbox-label { display:inline-flex; margin:0 0 12px; padding:7px 11px; color:var(--text); font-size:10px; font-weight:800; letter-spacing:.3px; background:var(--green-light); border:1px solid var(--border); border-radius:100px; }
.booking-form { padding:14px 0; border-top:1px solid var(--border); }
.booking-form h2 { color:var(--text); margin:0 0 15px; font-size:20px; }
.booking-form h3 { color:var(--text); font-size:13px; margin:23px 0 10px; }
.booking-form label { display:block; margin:10px 0 6px; color:var(--text); font-size:12px; font-weight:800; }
.booking-form select,.booking-form input { display:block; width:100%; min-height:43px; background:var(--field); color:var(--text); border:1px solid var(--border); border-radius:9px; padding:10px 12px; font:inherit; font-size:13px; }
.booking-form input::placeholder { color:var(--muted); }
.booking-form select option { background:var(--field); color:var(--text); }
.booking-form input:focus,.booking-form select:focus { outline:2px solid var(--green); outline-offset:1px; }
.booking-fields { margin:13px 0; }
.booking-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.booking-calculation { padding:15px; margin:19px 0; background:var(--background); border:1px solid var(--border); border-radius:12px; }
.booking-calculation > div { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:10px; color:var(--muted); font-size:12px; }
.booking-calculation strong { color:var(--text); font-size:13px; white-space:nowrap; }
.booking-calculation .calculation-total { border-top:1px solid var(--border); padding-top:12px; margin-top:13px; font-weight:800; color:var(--text); }
.booking-calculation .calculation-total strong { font-size:18px; color:var(--green); }
.booking-calculation p,.sandbox-disclaimer { margin:14px 0 0; font-size:11px; line-height:1.65; color:var(--muted); }
.booking-form .trip-cta { width:100%; margin:20px 0 0; border:0; cursor:pointer; }
.booking-history-link { display:block; padding:12px 0 0; font-size:12px; color:var(--green); font-weight:800; }
.booking-list { display:grid; gap:16px; }
.booking-list-card,.booking-receipt { background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:16px; padding:25px; }
.booking-list-card { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.booking-list-card h2 { margin:12px 0 6px; font-size:20px; color:var(--text); }
.booking-list-card p { margin:0; font-size:13px; color:var(--muted); }
.booking-list-amount { text-align:right; display:grid; gap:5px; }
.booking-list-amount strong { color:var(--green); font-size:21px; }
.booking-list-amount small { color:var(--muted); }
.booking-list-amount a,.booking-receipt a { color:var(--green); font-size:12px; font-weight:800; }
.booking-status { display:inline-block; background:var(--green-light); border-radius:100px; color:var(--text); padding:7px 11px; font-size:11px; letter-spacing:.2px; }
.booking-receipt { max-width:720px; margin:24px auto; }
.booking-receipt p { color:var(--muted); font-size:13px; line-height:1.7; }
.booking-receipt dl { display:grid; grid-template-columns:minmax(100px,1fr) minmax(0,1fr); gap:15px 20px; margin:24px 0; padding:22px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.booking-receipt dt { color:var(--muted); font-size:13px; }
.booking-receipt dd { color:var(--text); text-align:right; margin:0; font-size:14px; font-weight:800; }
.booking-receipt .trip-cta { color:#fff !important; font-size:13px; }
.search-section { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:21px; margin:18px 0; }
.search-section h2 { color:var(--text); margin:0 0 16px; font-size:21px; }
.search-result { padding:14px 0; border-bottom:1px solid var(--border); }
.search-result:last-child { border:0; }
.search-result a { color:var(--green); font-weight:800; }
.search-result p { color:var(--muted); font-size:12px; margin:6px 0 0; }
@media (max-width:680px) {
 .explore-search { flex-direction:column; padding:12px; }
 .explore-search select { flex:auto; width:100%; }
 .booking-two { grid-template-columns:1fr; }
 .booking-list-card { align-items:flex-start; flex-direction:column; }
 .booking-list-amount { text-align:left; }
}

.booking-form .trip-cta:disabled { cursor:not-allowed; opacity:.5; }