/* ============================================================
   Rezervasyon Talebi Modalı — tur detay sayfası
   Marka token'ları st-style.css'ten gelir (--st-navy, --st-red vb.);
   burada yalnız bu bileşene ait kurallar var, global hiçbir şey ezilmez.
   ============================================================ */

body.st-rez-open { overflow: hidden; }

.st-rez-overlay {
	position: fixed;
	inset: 0;
	z-index: 2000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(6, 18, 30, .62);
	backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity .22s ease;
}
.st-rez-overlay.is-in { opacity: 1; }
.st-rez-overlay[hidden] { display: none; }

.st-rez-dialog {
	width: 100%;
	max-width: 560px;
	max-height: calc(100vh - 48px);
	overflow-y: auto;
	background: #fff;
	border-radius: 22px;
	box-shadow: 0 30px 90px rgba(6, 18, 30, .34);
	transform: translateY(14px) scale(.985);
	transition: transform .26s cubic-bezier(.2, .7, .3, 1);
	-webkit-overflow-scrolling: touch;
}
.st-rez-overlay.is-in .st-rez-dialog { transform: none; }

/* ---------- başlık ---------- */
.st-rez-head {
	position: relative;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
	padding: 22px 24px 18px;
	background: linear-gradient(135deg, #0c2034 0%, #123a5c 100%);
	border-radius: 22px 22px 0 0;
	color: #fff;
}
.st-rez-eyebrow {
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .14em;
	color: var(--st-gold, #e2bd68);
}
.st-rez-head h3 {
	margin: 6px 0 0;
	font-size: 19px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: -.02em;
	color: #fff;
}
.st-rez-close {
	flex: 0 0 auto;
	width: 34px;
	height: 34px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .14);
	color: #fff;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	transition: background .18s;
}
.st-rez-close:hover { background: rgba(255, 255, 255, .26); }

/* ---------- adım göstergesi ---------- */
.st-rez-steps { padding: 18px 24px 4px; }
.st-rez-bar {
	height: 3px;
	border-radius: 999px;
	background: var(--st-line, #e7eff6);
	overflow: hidden;
}
.st-rez-bar span {
	display: block;
	height: 100%;
	width: 0;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--st-red, #e2231a), #ff6a52);
	transition: width .3s ease;
}
.st-rez-steps ol {
	display: flex;
	justify-content: space-between;
	list-style: none;
	margin: 12px 0 0;
	padding: 0;
}
.st-rez-steps li {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 12px;
	font-weight: 600;
	color: var(--st-muted, #7e93a7);
}
.st-rez-steps li b {
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--st-line, #e7eff6);
	color: var(--st-muted, #7e93a7);
	font-size: 11px;
	font-weight: 800;
	transition: background .2s, color .2s;
}
.st-rez-steps li.on { color: var(--st-navy, #0c2034); }
.st-rez-steps li.on b { background: var(--st-red, #e2231a); color: #fff; }
.st-rez-steps li.ok b { background: var(--st-green, #1f8a5b); color: #fff; }
@media (max-width: 520px) {
	.st-rez-steps li span { display: none; }
	.st-rez-steps ol { gap: 8px; }
}

/* ---------- adım gövdesi ---------- */
.st-rez-step { display: none; padding: 18px 24px 4px; }
.st-rez-step.is-on { display: block; animation: stRezIn .26s ease both; }
@keyframes stRezIn {
	from { opacity: 0; transform: translateX(10px); }
	to   { opacity: 1; transform: none; }
}

.st-rez-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .st-rez-grid { grid-template-columns: 1fr; } }

.fld { display: block; margin-bottom: 12px; }
.fld > span {
	display: block;
	margin-bottom: 6px;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--st-ink, #33475b);
}
.fld > span i { font-style: normal; font-weight: 500; color: var(--st-muted, #7e93a7); }
.fld input,
.fld select,
.fld textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1.5px solid var(--st-line, #e7eff6);
	border-radius: 12px;
	background: #fff;
	font-family: inherit;
	font-size: 14.5px;
	color: var(--st-navy, #0c2034);
	transition: border-color .18s, box-shadow .18s;
	-webkit-appearance: none;
	appearance: none;
}
.fld select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237e93a7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 36px;
}
.fld textarea { resize: vertical; min-height: 92px; }
.fld input:focus,
.fld select:focus,
.fld textarea:focus {
	outline: 0;
	border-color: var(--st-blue, #1fa9d6);
	box-shadow: 0 0 0 3px rgba(31, 169, 214, .16);
}
.fld.has-err input,
.fld.has-err select,
.fld.has-err textarea {
	border-color: var(--st-red, #e2231a);
	box-shadow: 0 0 0 3px rgba(226, 35, 26, .12);
}

/* ---------- 1. adım özeti ---------- */
.st-rez-sum,
.st-rez-review {
	background: var(--st-soft, #f6fafd);
	border: 1px solid var(--st-line, #e7eff6);
	border-radius: 14px;
	padding: 4px 16px;
}
.st-rez-sum .row,
.st-rez-review .row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding: 10px 0;
	border-bottom: 1px solid var(--st-line, #e7eff6);
	font-size: 13.5px;
}
.st-rez-sum .row:last-child,
.st-rez-review .row:last-child { border-bottom: 0; }
.st-rez-sum span,
.st-rez-review span { color: var(--st-muted, #7e93a7); flex: 0 0 auto; }
.st-rez-sum b,
.st-rez-review b {
	color: var(--st-navy, #0c2034);
	font-weight: 700;
	text-align: right;
	word-break: break-word;
}
.st-rez-hint {
	margin: 8px 0 14px;
	font-size: 12.5px;
	color: var(--st-muted, #7e93a7);
}
.st-rez-total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 4px;
	padding: 14px 16px;
	border-radius: 14px;
	background: linear-gradient(135deg, #0c2034, #123a5c);
	color: #fff;
}
.st-rez-total span { font-size: 13px; color: rgba(255, 255, 255, .74); }
.st-rez-total b { font-size: 19px; font-weight: 800; color: var(--st-gold-2, #f2d488); }

/* ---------- KVKK ---------- */
.st-rez-kvkk {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-top: 14px;
	font-size: 12.8px;
	line-height: 1.6;
	color: var(--st-body, #4a5b6c);
	cursor: pointer;
}
.st-rez-kvkk input { margin-top: 2px; width: 17px; height: 17px; accent-color: var(--st-red, #e2231a); flex: 0 0 auto; }

/* ---------- uyarı ---------- */
.st-rez-msg {
	margin: 4px 24px 0;
	padding: 11px 14px;
	border-radius: 11px;
	background: #fdeceb;
	border: 1px solid #f6c9c6;
	color: #a3160f;
	font-size: 13.2px;
	line-height: 1.55;
}
.st-rez-msg[hidden] { display: none; }

/* ---------- honeypot ---------- */
.st-rez-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px; height: 1px;
	overflow: hidden;
}

/* ---------- başarı ---------- */
.st-rez-done { padding: 30px 26px 10px; text-align: center; }
.st-rez-done[hidden] { display: none; }
.st-rez-done .ico {
	display: grid;
	place-items: center;
	width: 62px; height: 62px;
	margin: 0 auto 16px;
	border-radius: 50%;
	background: rgba(31, 138, 91, .12);
	color: var(--st-green, #1f8a5b);
}
.st-rez-done h4 {
	margin: 0 0 8px;
	font-size: 21px;
	font-weight: 800;
	color: var(--st-navy, #0c2034);
}
.st-rez-done p {
	margin: 0 auto 14px;
	max-width: 380px;
	font-size: 14.2px;
	line-height: 1.65;
	color: var(--st-body, #4a5b6c);
}
.st-rez-done .no {
	display: inline-block;
	padding: 10px 22px;
	border-radius: 999px;
	background: var(--st-soft, #f6fafd);
	border: 1.5px dashed var(--st-line, #e7eff6);
	font-size: 17px;
	font-weight: 800;
	letter-spacing: .04em;
	color: var(--st-navy, #0c2034);
}
.st-rez-done .mini { margin-top: 14px; font-size: 12.5px; color: var(--st-muted, #7e93a7); }

/* ---------- alt butonlar ---------- */
.st-rez-foot {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 18px 24px 24px;
}
.st-rez-foot button {
	flex: 1 1 auto;
	padding: 14px 20px;
	border: 0;
	border-radius: 999px;
	font-family: inherit;
	font-size: 14.5px;
	font-weight: 700;
	cursor: pointer;
	transition: filter .18s, background .18s, opacity .18s;
}
.st-rez-foot button[hidden] { display: none; }
.st-rez-back {
	flex: 0 0 auto !important;
	min-width: 96px;
	background: var(--st-soft, #f6fafd);
	color: var(--st-ink, #33475b);
	border: 1.5px solid var(--st-line, #e7eff6) !important;
}
.st-rez-back:hover { background: #eef5fb; }
.st-rez-next,
.st-rez-send,
.st-rez-finish {
	background: var(--st-red, #e2231a);
	color: #fff;
	box-shadow: 0 10px 24px rgba(226, 35, 26, .26);
}
.st-rez-next:hover,
.st-rez-send:hover,
.st-rez-finish:hover { filter: brightness(1.07); }
.st-rez-send:disabled { opacity: .65; cursor: default; box-shadow: none; }
.st-rez-finish { background: var(--st-navy, #0c2034); box-shadow: none; }

/* ---------- mobil: tam ekran sayfa ---------- */
@media (max-width: 640px) {
	.st-rez-overlay { padding: 0; align-items: stretch; }
	.st-rez-dialog {
		max-width: none;
		max-height: none;
		height: 100%;
		border-radius: 0;
		display: flex;
		flex-direction: column;
	}
	.st-rez-head { border-radius: 0; padding: 18px 18px 16px; }
	.st-rez-head h3 { font-size: 17px; }
	/* form dikeyde esner ki alt buton her zaman ekranın dibine otursun */
	.st-rez-dialog > .st-rez-form {
		display: flex;
		flex-direction: column;
		flex: 1 1 auto;
		min-height: 0;
	}
	.st-rez-steps { padding: 16px 18px 4px; }
	.st-rez-step { padding: 16px 18px 4px; }
	.st-rez-step.is-on { flex: 1 1 auto; }
	.st-rez-done { flex: 1 1 auto; }
	.st-rez-msg { margin: 4px 18px 0; }
	.st-rez-foot {
		margin-top: auto;
		position: sticky;
		bottom: 0;
		padding: 14px 18px calc(14px + env(safe-area-inset-bottom));
		background: #fff;
		border-top: 1px solid var(--st-line, #e7eff6);
	}
	/* alt sabit nav ile çakışmasın */
	body.st-rez-open .st-bottom-nav,
	body.st-rez-open .st-wa-float,
	body.st-rez-open .crayn-chatbox { display: none !important; }
}