/**
 * ZONAAB Customer Order Experience — Responsive Stylesheet
 * Scoped strictly under .zonaab-order-experience
 */

@media (max-width: 1024px) {
	.zonaab-content-grid {
		grid-template-columns: 1fr !important;
		gap: 1.5rem !important;
	}

	.zonaab-sidebar-column {
		position: static !important;
	}
}

@media (max-width: 768px) {
	.zonaab-order-experience {
		margin: 1rem 0 2rem !important;
	}

	/* Top Header Banner Mobile */
	.zonaab-header-banner {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 1rem !important;
		padding: 1.25rem !important;
		border-radius: 12px !important;
	}

	.zonaab-header-actions {
		width: 100% !important;
		flex-direction: column !important;
		gap: 0.5rem !important;
	}

	.zonaab-header-actions button,
	.zonaab-header-actions a {
		width: 100% !important;
		justify-content: center !important;
	}

	/* Timeline Stepper Mobile */
	.zonaab-timeline-card {
		padding: 1.25rem !important;
		border-radius: 12px !important;
	}

	.zonaab-timeline-track {
		flex-direction: column !important;
		gap: 1.5rem !important;
	}

	.zonaab-timeline-step {
		flex-direction: row !important;
		align-items: center !important;
		gap: 1rem !important;
		width: 100% !important;
	}

	.zonaab-step-icon-wrap {
		margin-bottom: 0 !important;
	}

	.zonaab-step-info {
		text-align: left !important;
	}

	.zonaab-step-connector {
		display: none !important;
	}

	/* Cards / Sections Mobile */
	.zonaab-card {
		padding: 1.25rem !important;
		border-radius: 12px !important;
	}

	.zonaab-product-row {
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 1rem !important;
	}

	.zonaab-product-thumb {
		width: 56px !important;
		height: 56px !important;
		min-width: 56px !important;
		min-height: 56px !important;
	}

	.zonaab-product-total {
		text-align: left !important;
		font-size: 1rem !important;
		width: 100% !important;
		margin-top: 0.25rem !important;
	}

	/* Orders List Mobile Styles */
	.zonaab-order-card-row {
		padding: 1.125rem !important;
		border-radius: 14px !important;
		margin-bottom: 0.875rem !important;
	}

	.zonaab-card-row-top {
		flex-direction: row !important;
		justify-content: space-between !important;
		align-items: center !important;
		flex-wrap: wrap !important;
		gap: 0.5rem !important;
		padding-bottom: 0.75rem !important;
	}

	.zonaab-card-row-content {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 0.875rem !important;
		padding: 0.875rem 0 !important;
	}

	.zonaab-card-items-wrap {
		width: 100% !important;
		gap: 0.75rem !important;
	}

	.zonaab-card-items-names {
		white-space: normal !important;
		display: -webkit-box !important;
		-webkit-line-clamp: 2 !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		max-width: 100% !important;
		font-size: 0.875rem !important;
		line-height: 1.35 !important;
	}

	.zonaab-card-row-pricing {
		text-align: left !important;
		width: 100% !important;
		display: flex !important;
		justify-content: space-between !important;
		align-items: baseline !important;
		border-top: 1px dashed #f1f5f9 !important;
		padding-top: 0.5rem !important;
	}

	.zonaab-card-row-actions {
		width: 100% !important;
		display: flex !important;
		gap: 0.5rem !important;
		justify-content: stretch !important;
		padding-top: 0.75rem !important;
	}

	.zonaab-card-row-actions a.zonaab-btn-primary,
	.zonaab-card-row-actions button.zonaab-btn-primary,
	.zonaab-card-row-actions button.zonaab-btn-secondary,
	.zonaab-card-row-actions a.zonaab-btn-secondary {
		flex: 1 1 50% !important;
		min-width: 0 !important;
		padding: 0.5rem 0.5rem !important;
		font-size: 0.75rem !important;
		justify-content: center !important;
		text-align: center !important;
	}
}

@media (max-width: 480px) {
	.zonaab-main-title {
		font-size: 1.25rem !important;
	}

	.zonaab-section-title {
		font-size: 1rem !important;
	}

	.zonaab-card-row-top {
		justify-content: space-between !important;
	}

	.zonaab-status-badge {
		font-size: 0.7rem !important;
		padding: 0.2rem 0.5rem !important;
	}
}