/* ==========================================================================
   Trip request form – black box, yellow heading, square light inputs.
   Overrides Fluent Forms' default look inside .jgg-request only.
   ========================================================================== */

.jgg-request {
	--jgg-black: #000;
	--jgg-yellow: #f7ec46;
	--jgg-input: #f5f5f5;
	--jgg-font: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

	clear: both;
	max-width: calc(var(--jgg-site-w, 1240px) + 48px); /* header width + padding */
	margin: 80px auto;
	padding: 0 24px;
	font-family: var(--jgg-font);
	box-sizing: border-box;
}

.jgg-request *,
.jgg-request *::before,
.jgg-request *::after { box-sizing: border-box; }

.jgg-request__box {
	background: var(--jgg-black);
	padding: 96px 110px 90px;
	border-radius: 0;
}

.jgg-request .jgg-request__title {
	margin: 0 0 48px;
	padding: 0;
	font-family: var(--jgg-font);
	font-size: 48px;
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.035em;
	color: var(--jgg-yellow);
	text-align: left;
	text-transform: none;
}

.jgg-request__form { padding: 0 16px; }

/* Labels */
.jgg-request .fluentform .ff-el-input--label label,
.jgg-request .fluentform label {
	font-family: var(--jgg-font) !important;
	font-size: 20px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	color: #fff !important;
	margin-bottom: 4px;
}

.jgg-request .fluentform .ff-el-input--label { margin-bottom: 14px; }
.jgg-request .fluentform .ff-el-is-required.asterisk-right label::after,
.jgg-request .fluentform .ff-el-is-required.asterisk-left label::before { color: #ff5a5a !important; margin-left: 6px; }

.jgg-request .fluentform .ff-el-group { margin-bottom: 30px; }

/* Inputs */
.jgg-request .fluentform .ff-el-form-control,
.jgg-request .fluentform input[type="text"],
.jgg-request .fluentform input[type="email"],
.jgg-request .fluentform input[type="tel"],
.jgg-request .fluentform input[type="number"],
.jgg-request .fluentform select,
.jgg-request .fluentform textarea,
.jgg-request .fluentform .choices__inner {
	width: 100%;
	min-height: 64px;
	padding: 16px 24px !important;
	font-family: var(--jgg-font) !important;
	font-size: 18px !important;
	color: #111 !important;
	background-color: var(--jgg-input) !important;
	border: 1px solid #d9d9d9 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.jgg-request .fluentform textarea { min-height: 150px; }

.jgg-request .fluentform .ff-el-form-control::placeholder { color: #555; opacity: 1; }

.jgg-request .fluentform .ff-el-form-control:focus,
.jgg-request .fluentform select:focus,
.jgg-request .fluentform textarea:focus {
	outline: 2px solid var(--jgg-yellow) !important;
	outline-offset: 0;
	border-color: var(--jgg-yellow) !important;
}

/* Dropdowns (incl. country / searchable selects) */
.jgg-request .fluentform .choices,
.jgg-request .fluentform .choices__list--dropdown { border-radius: 0 !important; }
.jgg-request .fluentform .choices__list--dropdown { color: #111; }

/* Checkboxes / radios */
.jgg-request .fluentform .ff-el-form-check-label,
.jgg-request .fluentform .ff-el-form-check label { font-size: 16px !important; font-weight: 400 !important; color: #fff !important; }

/* Help text, errors */
.jgg-request .fluentform .ff-el-help-message { color: #bbb; }
.jgg-request .fluentform .error,
.jgg-request .fluentform .text-danger { color: #ff7a7a !important; }

/* Columns gap (First / Last name) */
.jgg-request .fluentform .ff-t-container { gap: 24px; }
.jgg-request .fluentform .ff-t-container .ff-t-cell { padding: 0 !important; }

/* Submit button – yellow on black, square */
.jgg-request .fluentform .ff-btn-submit,
.jgg-request .fluentform button[type="submit"] {
	min-height: 64px;
	padding: 16px 48px !important;
	font-family: var(--jgg-font) !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	color: var(--jgg-black) !important;
	background: var(--jgg-yellow) !important;
	border: 1px solid var(--jgg-yellow) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	transition: opacity .2s;
}

.jgg-request .fluentform .ff-btn-submit:hover { opacity: .85; }

/* Success message */
.jgg-request .ff-message-success {
	background: #111 !important;
	border: 1px solid var(--jgg-yellow) !important;
	border-radius: 0 !important;
	color: #fff !important;
	box-shadow: none !important;
}

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
	.jgg-request__box { padding: 64px 48px; }
	.jgg-request .jgg-request__title { font-size: 38px; }
	.jgg-request__form { padding: 0; }
}

@media (max-width: 640px) {
	.jgg-request { margin: 48px auto; padding: 0 16px; }
	.jgg-request__box { padding: 40px 20px; }
	.jgg-request .jgg-request__title { font-size: 28px; margin-bottom: 32px; }
	.jgg-request .fluentform .ff-el-input--label label,
	.jgg-request .fluentform label { font-size: 16px !important; }
	.jgg-request .fluentform .ff-el-form-control,
	.jgg-request .fluentform select { min-height: 54px; font-size: 16px !important; }
	.jgg-request .fluentform .ff-t-container { flex-direction: column; gap: 0; }
	.jgg-request .fluentform .ff-btn-submit { width: 100%; }
}

/* ---------- Compact size ---------- */
.jgg-request { max-width: 920px; margin: 64px auto; }
.jgg-request__box { padding: 56px 64px 52px; }
.jgg-request__form { padding: 0; }
.jgg-request .jgg-request__title { font-size: 32px; margin-bottom: 32px; }
.jgg-request .fluentform .ff-el-input--label label,
.jgg-request .fluentform label { font-size: 15px !important; }
.jgg-request .fluentform .ff-el-input--label { margin-bottom: 8px; }
.jgg-request .fluentform .ff-el-group { margin-bottom: 20px; }
.jgg-request .fluentform .ff-el-form-control,
.jgg-request .fluentform input[type="text"],
.jgg-request .fluentform input[type="email"],
.jgg-request .fluentform input[type="tel"],
.jgg-request .fluentform input[type="number"],
.jgg-request .fluentform select,
.jgg-request .fluentform textarea,
.jgg-request .fluentform .choices__inner {
	min-height: 48px;
	padding: 11px 16px !important;
	font-size: 15px !important;
}
.jgg-request .fluentform textarea { min-height: 110px; }
.jgg-request .fluentform .ff-t-container { gap: 16px; }
.jgg-request .fluentform .ff-btn-submit,
.jgg-request .fluentform button[type="submit"] { min-height: 52px; padding: 12px 40px !important; font-size: 16px !important; }

@media (max-width: 640px) {
	.jgg-request { margin: 40px auto; padding: 0 16px; }
	.jgg-request__box { padding: 36px 22px; }
	.jgg-request .jgg-request__title { font-size: 26px; margin-bottom: 24px; }
}

/* ---------- Same layout as /tours/: centered heading, form scrolls inside the box ---------- */
.jgg-request { max-width: calc(var(--jgg-site-w, 1240px) + 48px); /* header width + padding */ }
.jgg-request__box { padding: 65px 65px 0; overflow: hidden; }
.jgg-request .jgg-request__title { text-align: center; font-size: 36px; margin-bottom: 28px; }
.jgg-request__form {
	max-height: 340px;
	overflow-y: auto;
	padding: 0 4px 48px;
	scrollbar-width: thin;
	scrollbar-color: #f7ec46 #222;
}
.jgg-request__form::-webkit-scrollbar { width: 6px; }
.jgg-request__form::-webkit-scrollbar-track { background: #222; }
.jgg-request__form::-webkit-scrollbar-thumb { background: #f7ec46; }
.jgg-request__form:focus { outline: none; }
.jgg-request__box { padding-bottom: 65px; }

@media (max-width: 640px) {
	.jgg-request__box { padding: 36px 20px; }
	.jgg-request .jgg-request__title { font-size: 26px; }
	.jgg-request__form { max-height: 420px; }
}

/* ---------- Read Our Latest Travel Tips ---------- */
.jgg-tips {
	max-width: calc(var(--jgg-site-w, 1240px) + 48px); /* header width + padding */
	margin: 0 auto 96px;
	padding: 0 24px;
	font-family: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	box-sizing: border-box;
}
.jgg-tips__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.jgg-tips .jgg-tips__title { margin: 0 0 20px; font-size: 36px; font-weight: 800; line-height: 1.1; letter-spacing: -0.03em; color: #000; }
.jgg-tips__text { margin: 0 0 40px; font-size: 17px; line-height: 1.7; color: #111; }
.jgg-tips__big .p-featured img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }

/* Fallback (non-Foxiz) cards */
.jgg-tips__post { display: grid; grid-template-columns: 220px 1fr; gap: 24px; margin-bottom: 32px; }
.jgg-tips__left .jgg-tips__post { grid-template-columns: 1fr; }
.jgg-tips__post img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.jgg-tips__post h3 { margin: 0 0 10px; font-size: 22px; line-height: 1.25; }
.jgg-tips__post p { margin: 0 0 12px; font-size: 14px; color: #555; }
.jgg-tips__more { font-size: 14px; font-weight: 600; color: #000; }

@media (max-width: 960px) {
	.jgg-tips__inner { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 640px) {
	.jgg-tips { padding: 0 16px; margin-bottom: 64px; }
	.jgg-tips .jgg-tips__title { font-size: 28px; }
	.jgg-tips__post { grid-template-columns: 1fr; }
}

/* Travel tips: hide the category tags (Life, LGBTQ Resources, Travel Tips…) */
.jgg-tips .p-categories,
.jgg-tips .p-category,
.jgg-tips .p-top { display: none !important; }

/* Desktop: start exactly at the header logo (inc/jgg-layout.php) */
html.jgg-site-fit .jgg-request,
html.jgg-site-fit .jgg-tips { margin-left: max(0px, calc(var(--jgg-site-l) - 24px)); margin-right: 0; }

/* ---------- Tours page: photo left, black form box right (jgg_trip_request_render 'image') ---------- */
.jgg-request--photo { margin: 28px auto 40px; }
.jgg-request--photo .jgg-request__box { display: grid; grid-template-columns: 49% 1fr; height: 344px; padding: 0 !important; overflow: hidden; }
.jgg-request--photo .jgg-request__photo { position: relative; min-height: 0; background: #222; }
.jgg-request--photo .jgg-request__photo img { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; }
.jgg-request--photo .jgg-request__main { display: flex; flex-direction: column; min-height: 0; padding: 40px 48px 0; }
.jgg-request--photo .jgg-request__title { margin: 0 0 12px; font-size: 30px; line-height: 1.15; letter-spacing: -0.025em; text-align: left; }
.jgg-request--photo .jgg-request__text { margin: 0 0 14px; max-width: 520px; font-size: 15px; line-height: 1.5; color: #fff; }
.jgg-request--photo .jgg-request__form { flex: 1 1 auto; max-height: none; min-height: 0; padding: 0 8px 32px 0; }
.jgg-request--photo .fluentform .ff-el-input--label { margin-bottom: 4px; }
.jgg-request--photo .fluentform .ff-el-input--label label,
.jgg-request--photo .fluentform label { font-size: 15px !important; font-weight: 500 !important; }
.jgg-request--photo .fluentform .ff-el-group { margin-bottom: 14px; }
.jgg-request--photo .fluentform .ff-el-form-control,
.jgg-request--photo .fluentform input[type="text"],
.jgg-request--photo .fluentform input[type="email"],
.jgg-request--photo .fluentform input[type="tel"],
.jgg-request--photo .fluentform input[type="number"],
.jgg-request--photo .fluentform select,
.jgg-request--photo .fluentform .choices__inner {
	min-height: 36px;
	height: 36px;
	padding: 6px 12px !important;
	font-size: 15px !important;
	background-color: #fff !important;
	border-color: #fff !important;
}
.jgg-request--photo .fluentform textarea { height: auto; min-height: 90px; background-color: #fff !important; }
.jgg-request--photo .fluentform .ff-t-container { gap: 8px; }

@media (max-width: 960px) {
	.jgg-request--photo .jgg-request__box { grid-template-columns: 1fr; height: auto; }
	.jgg-request--photo .jgg-request__photo { aspect-ratio: 16 / 7; }
	.jgg-request--photo .jgg-request__main { padding: 32px 28px 0; }
	.jgg-request--photo .jgg-request__form { max-height: 380px; }
}
@media (max-width: 640px) {
	.jgg-request.jgg-request--photo { padding: 0 20px; } /* same 20px side margin as the tour list */
	.jgg-request--photo .jgg-request__box { padding: 0 !important; }
	.jgg-request--photo .jgg-request__main { padding: 28px 20px 0; }
	.jgg-request--photo .jgg-request__title { font-size: 26px; }
}
