/* Shuttle rezervasyon sayfası (/shuttles). Renkler home-modern.css'teki --tt-* değişkenlerinden gelir. */
.grecaptcha-badge { visibility: hidden; }
.drp-item { cursor: pointer; }
.cs-date-picker:not(empty) { color: var(--tt-primary); }
input.invalid, select.invalid { border-color: #ff4371 !important; box-shadow: 0 0 0 3px rgba(255, 67, 113, .12); }

.sh-hero { padding: 56px 0 72px; background: linear-gradient(160deg, #f4f3ff 0%, #eef5ff 55%, #fff 100%); }
.sh-intro { text-align: center; max-width: 640px; margin: 2.5rem auto 0; }
.sh-eyebrow { display: inline-flex; align-items: center; gap: .5rem; padding: .35rem .85rem; border-radius: 999px; background: #fff; color: var(--tt-primary); font-size: .8rem; font-weight: 700; box-shadow: 0 6px 18px -10px rgba(30, 42, 59, .35); }
.sh-intro h1 { font-size: 2.2rem; font-weight: 800; margin: 1rem 0 .6rem; }
.sh-intro p { color: var(--tt-muted); font-size: 1.05rem; line-height: 1.7; margin: 0; }
.sh-perks { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.5rem; list-style: none; padding: 0; margin: 1.25rem 0 0; font-size: .9rem; font-weight: 600; }
.sh-perks i { color: var(--tt-primary); margin-right: .4rem; }

.sh-card { max-width: 860px; margin: 0 auto; background: #fff; border: 1px solid var(--tt-line); border-radius: var(--tt-radius); box-shadow: 0 30px 60px -30px rgba(30, 42, 59, .3); padding: 28px 32px; }

/* Adım göstergesi: showTab() aktif adımı işaretler */
.sh-steps { display: flex; list-style: none; padding: 0 0 22px; margin: 0 0 8px; border-bottom: 1px solid var(--tt-line); counter-reset: step; }
.sh-steps li { flex: 1; display: flex; align-items: center; gap: .55rem; font-size: .85rem; font-weight: 600; color: var(--tt-muted); counter-increment: step; }
.sh-steps li::before { content: counter(step); flex: none; width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--tt-soft); color: var(--tt-primary); font-weight: 700; }
.sh-steps li.is-active { color: var(--tt-ink); }
.sh-steps li.is-active::before { background: var(--tt-primary); color: #fff; box-shadow: 0 0 0 5px rgba(118, 109, 244, .15); }
.sh-steps li.is-done::before { content: '\2713'; background: #e6f7ef; color: #1aa36f; }

.sh-hotel { margin: 18px 0 0; padding: .55rem .9rem; border-radius: 12px; background: var(--tt-soft); color: var(--tt-primary); font-weight: 700; text-align: center; }
.sh-tab-title { font-size: 1.2rem; font-weight: 700; margin-bottom: 1.1rem; }
.tab { padding-top: 1.5rem; display: none; animation: shFade .4s ease-in-out; }
@keyframes shFade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Otel ve shuttle seçenekleri: gizli radio + label, seçili olan çerçevelenir */
.sh-option, .sh-route { display: flex; align-items: center; gap: 16px; width: 100%; margin: 0 0 12px; padding: 14px 16px; border: 1px solid var(--tt-line); border-radius: 16px; background: #fff; cursor: pointer; transition: border-color .2s, box-shadow .2s, transform .2s; }
.sh-option:hover, .sh-route:hover { border-color: rgba(118, 109, 244, .5); box-shadow: 0 12px 28px -18px rgba(30, 42, 59, .45); transform: translateY(-1px); }
input[type="radio"]:checked + .sh-option, input[type="radio"]:checked + .sh-route { border-color: var(--tt-primary); box-shadow: 0 0 0 3px rgba(118, 109, 244, .18); }
.sh-option-img { flex: 0 0 88px; width: 88px; height: 64px; object-fit: contain; border-radius: 10px; background: #f7f8fc; }
.sh-option-body { flex: 1; min-width: 0; }
.sh-option-body strong { display: block; font-size: 1rem; color: var(--tt-ink); }
.sh-option-body small { display: block; color: var(--tt-muted); font-size: .85rem; margin-top: .2rem; }
.sh-option-go { color: var(--tt-primary); }
.sh-group { margin-bottom: 12px; border: 1px solid var(--tt-line); border-radius: 16px; background: #f9f9fd; }
.sh-group summary { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; font-weight: 700; cursor: pointer; list-style: none; }
.sh-group summary::-webkit-details-marker { display: none; }
.sh-group summary::after { content: '\f078'; font-family: 'Font Awesome 5 Pro', 'Font Awesome 5 Free'; font-weight: 900; font-size: .8rem; color: var(--tt-primary); transition: transform .2s; }
.sh-group[open] summary::after { transform: rotate(180deg); }
.sh-group-list { padding: 0 12px 2px; }

.sh-routes { max-height: 360px; overflow: auto; padding: 4px; margin: -4px -4px 1rem; } /* padding: seçili kartın halkası kaydırma alanında kırpılmasın */
.sh-route { justify-content: space-between; text-align: center; }
.sh-route > i { color: var(--tt-primary); font-size: 1.4rem; }
.sh-route-point { flex: 1; }
.sh-route-point small { display: block; text-transform: uppercase; letter-spacing: .05em; font-size: .72rem; font-weight: 700; color: var(--tt-muted); }
.sh-route-point strong { font-size: 1rem; }

.sh-card .form-label { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--tt-muted); }
.sh-card .form-control, .sh-card .custom-select { border-radius: 12px; border-color: var(--tt-line); min-height: 46px; }
.sh-card .form-control:focus, .sh-card .custom-select:focus { border-color: var(--tt-primary); box-shadow: 0 0 0 4px rgba(118, 109, 244, .15); }

.sh-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; margin: 0; }
.sh-summary > div { display: flex; justify-content: space-between; gap: 12px; padding: .7rem 0; border-bottom: 1px dashed var(--tt-line); }
.sh-summary dt { font-weight: 600; color: var(--tt-muted); }
.sh-summary dd { margin: 0; font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.sh-summary .sh-summary-wide { grid-column: 1 / -1; }

.sh-total { margin-top: 1.25rem; padding: 14px 18px; border-radius: 14px; background: #f7f8fc; }
.sh-total.is-final { background: var(--tt-soft); box-shadow: inset 0 0 0 1px rgba(118, 109, 244, .3); }
.sh-total-row { display: flex; justify-content: space-between; align-items: center; font-weight: 600; }
.sh-total-row strong { font-size: 1.4rem; color: var(--tt-primary); }
.sh-app-offer { margin-top: .35rem; font-size: .85rem; color: var(--tt-muted); text-align: right; }
.sh-app-offer s { margin-right: .35rem; }
.sh-app-offer strong { color: #1aa36f; margin-right: .35rem; }

.sh-actions { display: flex; justify-content: space-between; gap: 12px; padding-top: 1.5rem; margin-top: 1.25rem; border-top: 1px solid var(--tt-line); }
.sh-actions .btn { min-width: 130px; }
.sh-actions #nextBtn, .sh-actions #formSubmitBtn { margin-left: auto; }
.sh-secure { margin: 1rem 0 0; text-align: center; font-size: .82rem; color: var(--tt-muted); }
.sh-secure i { margin-right: .35rem; }

@media (max-width: 767.98px) {
  .sh-hero { padding: 32px 0 48px; }
  .sh-intro h1 { font-size: 1.65rem; }
  .sh-card { padding: 20px 16px; }
  .sh-steps li { flex-direction: column; text-align: center; font-size: .72rem; gap: .35rem; }
  .sh-option-img { flex-basis: 64px; width: 64px; height: 48px; }
  .sh-summary { grid-template-columns: 1fr; }
  .sh-actions .btn { min-width: 0; flex: 1; }
}