/*
 * Izi Hub v1.10.34 — Customer Portal mobile containment.
 *
 * This file intentionally uses a dedicated asset path and highly scoped
 * selectors. It loads after the shared public stylesheet so WordPress themes,
 * page builders and earlier Izi compatibility rules cannot turn portal grids
 * back into overflowing flex rows or restyle feedback choice buttons.
 */

.izi-public.izi-customer-ops-portal,
.izi-public.izi-customer-ops-portal *,
.izi-public.izi-customer-ops-portal *::before,
.izi-public.izi-customer-ops-portal *::after {
	box-sizing: border-box;
}

.izi-public.izi-customer-ops-portal {
	max-inline-size: 100% !important;
	min-inline-size: 0;
	overflow-x: clip;
}

.izi-customer-ops-portal .izi-portal-shell,
.izi-customer-ops-portal .izi-portal-main,
.izi-customer-ops-portal .izi-portal-section,
.izi-customer-ops-portal .izi-customer-booking-detail,
.izi-customer-ops-portal .izi-booking-card,
.izi-customer-ops-portal .izi-customer-history-card,
.izi-customer-ops-portal .izi-booking-edit-panel,
.izi-customer-ops-portal .izi-booking-change-state,
.izi-customer-ops-portal .izi-booking-change-history,
.izi-customer-ops-portal .izi-portal-form,
.izi-customer-ops-portal .izi-portal-form fieldset,
.izi-customer-ops-portal .izi-form-grid,
.izi-customer-ops-portal .izi-detail-grid {
	min-inline-size: 0;
	max-inline-size: 100%;
}

.izi-customer-ops-portal .izi-portal-shell,
.izi-customer-ops-portal .izi-portal-section,
.izi-customer-ops-portal .izi-booking-card,
.izi-customer-ops-portal .izi-customer-booking-detail,
.izi-customer-ops-portal .izi-booking-edit-panel,
.izi-customer-ops-portal .izi-booking-change-state,
.izi-customer-ops-portal .izi-booking-change-history {
	inline-size: 100%;
}

.izi-customer-ops-portal .izi-portal-main,
.izi-customer-ops-portal .izi-portal-section,
.izi-customer-ops-portal .izi-booking-card,
.izi-customer-ops-portal .izi-customer-booking-detail,
.izi-customer-ops-portal .izi-booking-edit-panel {
	overflow-wrap: anywhere;
}

.izi-customer-ops-portal .izi-btn,
.izi-customer-ops-portal button,
.izi-customer-ops-portal input,
.izi-customer-ops-portal select,
.izi-customer-ops-portal textarea {
	max-inline-size: 100%;
}

.izi-customer-ops-portal .izi-btn {
	min-inline-size: 0;
	white-space: normal;
	overflow-wrap: anywhere;
}

.izi-customer-ops-portal .izi-btn-primary {
	border-color: var(--izi-primary, #0d47a1) !important;
	background: var(--izi-primary, #0d47a1) !important;
	color: #fff !important;
}

.izi-customer-ops-portal .izi-btn-secondary {
	border: 1px solid var(--izi-primary, #0d47a1) !important;
	background: #fff !important;
	color: var(--izi-primary, #0d47a1) !important;
}

.izi-customer-ops-portal .izi-btn-ghost {
	border: 1px solid #dce5ef !important;
	background: #f8fafc !important;
	color: var(--izi-primary, #0d47a1) !important;
}

/* Booking header and route containment. */
.izi-customer-ops-portal .izi-customer-history-card > div:first-child {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	min-inline-size: 0;
	gap: 8px 12px;
}

.izi-customer-ops-portal .izi-customer-history-card > div:first-child > strong {
	min-inline-size: 0;
	flex: 1 1 120px;
}

.izi-customer-ops-portal .izi-status-badge {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	max-inline-size: 100%;
	flex: 0 1 auto;
	white-space: normal !important;
	text-align: center;
	line-height: 1.25;
	overflow-wrap: anywhere;
}

.izi-customer-ops-portal .izi-booking-card > p,
.izi-customer-ops-portal .izi-customer-booking-detail .izi-section-title p,
.izi-customer-ops-portal .izi-booking-full-text,
.izi-customer-ops-portal .izi-booking-full-text p {
	min-inline-size: 0;
	max-inline-size: 100%;
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.izi-customer-ops-portal .izi-booking-card-meta,
.izi-customer-ops-portal .izi-booking-card-meta > div,
.izi-customer-ops-portal .izi-booking-primary-actions {
	min-inline-size: 0;
	max-inline-size: 100%;
}

.izi-customer-ops-portal .izi-booking-primary-actions {
	display: flex !important;
	justify-content: center !important;
	flex-wrap: wrap;
}

/* The older .izi-booking-card > div rule has greater selector specificity and
 * otherwise changes this grid into a horizontal flex row. */
.izi-customer-ops-portal .izi-customer-history-card > .izi-post-trip-summary {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	inline-size: 100%;
	min-inline-size: 0;
	max-inline-size: 100%;
}

.izi-customer-ops-portal .izi-post-trip-summary > div {
	display: grid !important;
	min-inline-size: 0;
	max-inline-size: 100%;
	align-content: start;
}

.izi-customer-ops-portal .izi-post-trip-summary span,
.izi-customer-ops-portal .izi-post-trip-summary strong {
	min-inline-size: 0;
	white-space: normal;
	overflow-wrap: anywhere;
}

.izi-customer-ops-portal .izi-post-trip-actions {
	min-inline-size: 0;
	max-inline-size: 100%;
}

.izi-customer-ops-portal .izi-customer-history-card > .izi-post-trip-cases {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	inline-size: 100%;
	min-inline-size: 0;
	max-inline-size: 100%;
}

/* Feedback options are semantic buttons. Portal-wide and theme button rules
 * must not convert their two-line card layout into a horizontal button. */
.izi-public.izi-customer-ops-portal button.izi-feedback-option {
	-webkit-appearance: none;
	appearance: none;
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	align-items: stretch !important;
	align-content: center !important;
	justify-content: stretch !important;
	justify-items: stretch !important;
	gap: 6px !important;
	inline-size: 100% !important;
	min-inline-size: 0 !important;
	max-inline-size: 100% !important;
	min-block-size: 122px !important;
	margin: 0 !important;
	padding: 18px !important;
	border: 1px solid #dce5f0 !important;
	border-radius: 16px !important;
	background: #f8fbff !important;
	box-shadow: none !important;
	color: #172033 !important;
	text-align: left !important;
	white-space: normal !important;
	transform: none !important;
	overflow: hidden;
}

.izi-public.izi-customer-ops-portal button.izi-feedback-option:hover,
.izi-public.izi-customer-ops-portal button.izi-feedback-option:focus-visible {
	border-color: var(--izi-primary, #0d47a1) !important;
	background: #f1f6ff !important;
	box-shadow: 0 0 0 3px rgba(13, 71, 161, 0.1) !important;
}

.izi-public.izi-customer-ops-portal button.izi-feedback-option strong,
.izi-public.izi-customer-ops-portal button.izi-feedback-option span {
	display: block !important;
	min-inline-size: 0;
	max-inline-size: 100%;
	margin: 0 !important;
	padding: 0 !important;
	text-align: left !important;
	white-space: normal !important;
	overflow-wrap: anywhere;
}

.izi-public.izi-customer-ops-portal button.izi-feedback-option strong {
	color: var(--izi-primary, #0d47a1) !important;
	font-size: 15px !important;
	line-height: 1.35 !important;
}

.izi-public.izi-customer-ops-portal button.izi-feedback-option span {
	color: #667085 !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	line-height: 1.55 !important;
}

/* Payment cards and details. Fieldset has an intrinsic min-content width in
 * some mobile browsers, so reset min-inline-size explicitly. */
.izi-customer-ops-portal .izi-booking-change-payment-form,
.izi-customer-ops-portal .izi-payment-method-fieldset,
.izi-customer-ops-portal .izi-payment-method-options,
.izi-customer-ops-portal .izi-payment-method-option,
.izi-customer-ops-portal .izi-payment-method-option > span,
.izi-customer-ops-portal .izi-payment-method-details,
.izi-customer-ops-portal .izi-payment-proof-field {
	inline-size: 100%;
	min-inline-size: 0 !important;
	max-inline-size: 100%;
}

.izi-customer-ops-portal .izi-payment-method-fieldset {
	min-width: 0 !important;
}

.izi-customer-ops-portal .izi-payment-method-fieldset legend {
	max-inline-size: 100%;
	white-space: normal;
}

.izi-customer-ops-portal .izi-payment-method-option > span,
.izi-customer-ops-portal .izi-payment-method-details,
.izi-customer-ops-portal .izi-payment-proof-field {
	overflow-wrap: anywhere;
}

.izi-customer-ops-portal .izi-payment-method-option strong,
.izi-customer-ops-portal .izi-payment-method-option small,
.izi-customer-ops-portal .izi-payment-method-details h5,
.izi-customer-ops-portal .izi-payment-method-details p {
	display: block;
	min-inline-size: 0;
	max-inline-size: 100%;
	white-space: normal;
	overflow-wrap: anywhere;
}

.izi-customer-ops-portal .izi-booking-change-payment-form > .izi-btn {
	max-inline-size: 100%;
}

/* Repricing summary and actions. */
.izi-customer-ops-portal .izi-booking-change-price-summary,
.izi-customer-ops-portal .izi-booking-change-preview,
.izi-customer-ops-portal .izi-booking-change-preview > div,
.izi-customer-ops-portal .izi-booking-change-preview > p,
.izi-customer-ops-portal .izi-booking-change-actions {
	min-inline-size: 0;
	max-inline-size: 100%;
}

.izi-customer-ops-portal .izi-booking-change-price-summary,
.izi-customer-ops-portal .izi-booking-change-preview,
.izi-customer-ops-portal .izi-booking-change-actions {
	inline-size: 100%;
}

.izi-customer-ops-portal .izi-booking-change-preview > div,
.izi-customer-ops-portal .izi-booking-change-preview > p {
	overflow-wrap: anywhere;
}

@media (max-width: 760px) {
	.izi-public.izi-customer-ops-portal {
		margin-inline: 0 !important;
	}

	.izi-customer-ops-portal .izi-portal-main {
		padding-inline: 12px !important;
	}

	.izi-customer-ops-portal .izi-portal-section {
		padding-inline: 14px !important;
	}

	.izi-customer-ops-portal .izi-customer-history-card > .izi-post-trip-summary {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.izi-customer-ops-portal .izi-post-trip-actions {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		inline-size: 100%;
		gap: 10px !important;
	}

	.izi-customer-ops-portal .izi-post-trip-actions .izi-btn,
	.izi-customer-ops-portal .izi-booking-change-actions .izi-btn,
	.izi-customer-ops-portal .izi-booking-change-payment-form > .izi-btn {
		inline-size: 100% !important;
		min-inline-size: 0 !important;
		max-inline-size: 100% !important;
		margin: 0 !important;
	}

	.izi-customer-ops-portal .izi-booking-change-actions {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 10px !important;
	}

	.izi-customer-ops-portal .izi-payment-method-options {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.izi-public.izi-customer-ops-portal button.izi-feedback-option {
		min-block-size: 0 !important;
		padding: 16px !important;
	}

	.izi-customer-ops-portal .izi-feedback-option-grid {
		grid-template-columns: minmax(0, 1fr) !important;
		min-inline-size: 0;
		max-inline-size: 100%;
	}

	/* Short feedback dialogs stay compact; long forms grow only to the visible
	 * viewport and then scroll inside the card. */
	.izi-customer-ops-portal .izi-onboarding-modal[data-izi-modal-state="open"] .izi-modal-card {
		top: 12px !important;
		bottom: auto !important;
		width: calc(100% - 24px) !important;
		height: auto !important;
		max-height: calc(100dvh - 24px) !important;
		block-size: auto !important;
		max-block-size: calc(100dvh - 24px) !important;
		transform: translateX(-50%) !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
	}

	.izi-customer-ops-portal .izi-modal-card > .izi-portal-form {
		inline-size: 100%;
		min-inline-size: 0;
		max-inline-size: 100%;
		margin-inline: 0;
	}
}

@media (max-width: 360px) {
	.izi-customer-ops-portal .izi-customer-history-card > .izi-post-trip-summary,
	.izi-customer-ops-portal .izi-booking-change-price-summary,
	.izi-customer-ops-portal .izi-booking-change-preview {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

@supports not (overflow: clip) {
	.izi-public.izi-customer-ops-portal {
		overflow-x: hidden;
	}
}