/* Responsive Overrides — Ollie Pro */
/* Per-side classes ensure only explicitly set sides are overridden. */
/* Unset sides inherit their desktop value. */

/* === Tablet (max-width: 768px) === */
@media (max-width: 768px) {
	.has-ollie-fs-tablet {
		font-size: var(--ollie-fs-tablet, inherit) !important;
	}

	.has-ollie-padding-top-tablet { padding-top: var(--ollie-padding-top-tablet) !important; }
	.has-ollie-padding-right-tablet { padding-right: var(--ollie-padding-right-tablet) !important; }
	.has-ollie-padding-bottom-tablet { padding-bottom: var(--ollie-padding-bottom-tablet) !important; }
	.has-ollie-padding-left-tablet { padding-left: var(--ollie-padding-left-tablet) !important; }

	.has-ollie-margin-top-tablet { margin-top: var(--ollie-margin-top-tablet) !important; }
	.has-ollie-margin-right-tablet { margin-right: var(--ollie-margin-right-tablet) !important; }
	.has-ollie-margin-bottom-tablet { margin-bottom: var(--ollie-margin-bottom-tablet) !important; }
	.has-ollie-margin-left-tablet { margin-left: var(--ollie-margin-left-tablet) !important; }

	/* Block gap — flex/grid use gap, flow/constrained use margin-block-start on children */
	.has-ollie-gap-tablet.is-layout-flex,
	.has-ollie-gap-tablet.is-layout-grid {
		gap: var(--ollie-gap-tablet) !important;
	}
	.has-ollie-gap-tablet.is-layout-flow > *,
	.has-ollie-gap-tablet.is-layout-constrained > * {
		margin-block-start: var(--ollie-gap-tablet) !important;
	}
	.has-ollie-gap-tablet.is-layout-flow > :first-child,
	.has-ollie-gap-tablet.is-layout-constrained > :first-child {
		margin-block-start: 0 !important;
	}

	.has-ollie-mh-tablet { min-height: var(--ollie-mh-tablet) !important; }
	.has-ollie-ta-tablet { text-align: var(--ollie-ta-tablet) !important; }
}

/* === Mobile (max-width: 480px) === */
@media (max-width: 480px) {
	.has-ollie-fs-mobile {
		font-size: var(--ollie-fs-mobile, inherit) !important;
	}

	.has-ollie-padding-top-mobile { padding-top: var(--ollie-padding-top-mobile) !important; }
	.has-ollie-padding-right-mobile { padding-right: var(--ollie-padding-right-mobile) !important; }
	.has-ollie-padding-bottom-mobile { padding-bottom: var(--ollie-padding-bottom-mobile) !important; }
	.has-ollie-padding-left-mobile { padding-left: var(--ollie-padding-left-mobile) !important; }

	.has-ollie-margin-top-mobile { margin-top: var(--ollie-margin-top-mobile) !important; }
	.has-ollie-margin-right-mobile { margin-right: var(--ollie-margin-right-mobile) !important; }
	.has-ollie-margin-bottom-mobile { margin-bottom: var(--ollie-margin-bottom-mobile) !important; }
	.has-ollie-margin-left-mobile { margin-left: var(--ollie-margin-left-mobile) !important; }

	/* Block gap — flex/grid use gap, flow/constrained use margin-block-start on children */
	.has-ollie-gap-mobile.is-layout-flex,
	.has-ollie-gap-mobile.is-layout-grid {
		gap: var(--ollie-gap-mobile) !important;
	}
	.has-ollie-gap-mobile.is-layout-flow > *,
	.has-ollie-gap-mobile.is-layout-constrained > * {
		margin-block-start: var(--ollie-gap-mobile) !important;
	}
	.has-ollie-gap-mobile.is-layout-flow > :first-child,
	.has-ollie-gap-mobile.is-layout-constrained > :first-child {
		margin-block-start: 0 !important;
	}

	.has-ollie-mh-mobile { min-height: var(--ollie-mh-mobile) !important; }
	.has-ollie-ta-mobile { text-align: var(--ollie-ta-mobile) !important; }
}