/**
 * Browse Categories Widget - Responsive Styles
 *
 * @package WebsiteBuilderAddon
 * @since   1.0.0
 */

/* ── Tablet 1024 ── */
@media (max-width: 1024px) {
	.brc {
		padding: 56px 32px;
	}

	.brc__grid {
		grid-template-columns: repeat(var(--brc-columns-tablet, 4), minmax(0, 1fr));
		gap: 20px;
	}

	.brc__title {
		font-size: 26px;
	}
}

/* ── Tablet 768 ── */
@media (max-width: 768px) {
	.brc {
		padding: 48px 28px;
	}

	.brc__grid {
		grid-template-columns: repeat(var(--brc-columns-tablet, 4), minmax(0, 1fr));
		gap: 18px;
	}

	.brc__header {
		margin-bottom: 28px;
	}

	.brc__title {
		font-size: 24px;
	}

	.brc__card {
		width: 100%;
		height: 140px;
	}
}

/* ── Mobile 480 ── */
@media (max-width: 480px) {
	.brc {
		padding: 40px 20px;
	}

	.brc__header {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
		margin-bottom: 24px;
	}

	.brc__title {
		font-size: 22px;
	}

	.brc__grid {
		grid-template-columns: repeat(var(--brc-columns-mobile, 2), minmax(0, 1fr));
		gap: 16px;
	}

	.brc__card {
		height: 130px;
	}

	.brc__icon {
		width: 48px;
		height: 48px;
	}

	.brc__icon svg {
		width: 20px;
		height: 20px;
	}

	.brc__name {
		font-size: 14px;
	}

	.brc__count {
		font-size: 12px;
	}

	.brc__card-inner {
		gap: 10px;
	}
}

/* ── Small Mobile 390/375/360/320 ── */
@media (max-width: 390px) {
	.brc {
		padding: 32px 16px;
	}

	.brc__grid {
		gap: 14px;
	}

	.brc__card {
		height: 120px;
	}

	.brc__icon {
		width: 44px;
		height: 44px;
	}

	.brc__icon svg {
		width: 18px;
		height: 18px;
	}

	.brc__name {
		font-size: 13px;
	}

	.brc__count {
		font-size: 11px;
	}
}