ProjectSoft

// Подпишемся на ресайз и продиспатчим его для запуска
$(window).on('resize', function(e){
	// Переменная, по которой узнаем запущен слайдер или нет.
	// Храним её в data
	var init = $(".card-box").data('init-slider');
	// Если мобильный
	if(window.innerWidth < 480){
		// Если слайдер не запущен
		if(init != 1){
			// Запускаем слайдер и записываем в data init-slider = 1
			$('#card-box').slick({
				infinite: true,
				slidesToShow: 1,
				slidesToScroll: 1
			}).data({'init-slider': 1});
		}
	}
	// Если десктоп
	else {
		// Если слайдер запущен
		if(init == 1){
			// Разрушаем слайдер и записываем в data init-slider = 0
			$('#card-box').slick('unslick').data({'init-slider': 0});
		}
	}
}).trigger('resize');

https://monosnap.com/file/Jw6PomDPOuv54bY25640JxAz...

Файл dooplay/inc/dt_assets.php функция dooplay_scripts_footer

Либо чуть ниже

Что-то вы с условиями намудрили
https://jsfiddle.net/uk086d15/5/

Перебор элементов с поиском детей
jsfiddle.net/9syk4o68

Если для вопроса Как реализовать появление блока относительно нажатой кнопки?
jsfiddle.net/nbz27sjL
Т. е. Мы показываем инпут, чтобы скрипт datepicker просчитал его позицию и тут же скрываем.

https://jsfiddle.net/uhzbqfnc/

/* вертикальное положение */
@media (orientation: portrait) {
	/*** Стили ***/
}

/* горизонтальное положение */
@media (orientation: landscape) {
	/*** Стили ***/
}

Или так, но принцип один.

$('.priceSort-table__item td:nth-child(2)').each(function(){
	var item = $(this),
		parent = item.closest('tr'),
		text = item.text(),
		regex = /(\d+)(?:х|x)?/g,
		match = text.match(regex),
		arr = [];
	while ((m = regex.exec(text)) !== null) {
		arr.push(m[1]);
	}
	item.text(arr.join(" "));
	arr.forEach(function(dig, idx){
		switch(idx){
			case 0:
				parent.addClass('l' + dig);
				break;
			case 1:
				parent.addClass('w' + dig);
				break;
			case 2:
				parent.addClass('h' + dig);
				break;
		}
	});
});

Условие надо делать раньше. До того, как вы начинаете обращаться к свойствам найденных объектов.
https://codepen.io/anon/pen/qybqEw

Крутите на свой вкус и цвет)))
https://snazzymaps.com/editor

Ещё вариант
jsfiddle.net/ceahnys0

Ещё вариант
jsfiddle.net/enrvfm9u

Сергей Бурдужа, вы подписываете две функции на одно событие. С таким же успехом можно всё написать выше этих функций, а сами функции выкинуть. Так нельзя и не надо делать.

Нужно приблизительно так.
(Код ещё можно оптимизировать)

(function($){
	var windowSize = 1140,
		isDesktop = !($(window).width() < windowSize),
		$categoriesWrap = $('.categories-wrapper'),
		$headerMain = $('header'), // Скорее всего что-то типа так
		headerMainHeight = $headerMain.height(),
		scrollTop = $(window).scrollTop(),
		forDesktop = function(){
		
		!$categoriesWrap.is(":visible") && $categoriesWrap.css({'display': 'block'});
			
			scrollTop = $(window).scrollTop();
			
			if(scrollTop < headerMainHeight  + 10){
				$categoriesWrap.removeClass('fixed');
				$categoriesWrap.css('display', 'block');
				$categoriesWrap.css('opacity', 1);
			} 
			
			if(scrollTop > headerMainHeight  + 10) {
				$categoriesWrap.css('opacity', 0);
				$categoriesWrap.css('display', 'block');
			}
			
			if(scrollTop > headerMainHeight  + 100) {
				$categoriesWrap.addClass('fixed');
				$categoriesWrap.css('opacity', 1);
			}
		},
		forMobile = function(){
			
			$('body').css('padding-top', 100);
			
			$categoriesWrap.is(":visible") && $categoriesWrap.css({'display': 'none'});
			
			scrollTop = $(window).scrollTop();
			
			if(scrollTop > headerMainHeight  + 10) {
				$categoriesWrap.hide();
			}else if(scrollTop < headerMainHeight  + 10){
				headerMain.removeClass('fixed');
				$categoriesWrap.hide();
			}
			
			if(scrollTop > headerMainHeight  + 100) {
				headerMain.addClass('fixed');
			}
		};
	// Подписываемся на события
	$(window).on('resize scroll', function(e){
		isDesktop = !($(window).width() < windowSize);
		headerMainHeight = $headerMain.height();
		isDesktop ? forDesktop() : forMobile();
	});
	
	// Запустим
	isDesktop ? forDesktop() : forMobile();
	
}(jQuery));

Ещё вариант
jsfiddle.net/x5j1b9cm

Как такового события нет у input.

https://codepen.io/anon/pen/BVbdOz
Оно?

Док: https://pugjs.org/language/iteration.html

Сразу со второго вопроса.
Как вариант. Но для каждого брекпоинта (@media) писать нужные (иные) условия, если требуется для адаптации
jsfiddle.net/mo5Ljkf2

По первому вопросу проблем вообще не вижу. Стандартная вёрстка.
А дизайнеру за центрирование по жопе надавать )))

jsfiddle.net/c8mLedyx/embedded/result,js,css,html
Ну и стилизуем как вам надо.
Т.е. описываем свой файл slick-theme.css

Вы пытаетесь на JS писать в PHP
Правильно так

<?php
// Если устройства не iPhone|iPad|iPod
if( !preg_match('/iPhone|iPad|iPod/i', $_SERVER ['HTTP_USER_AGENT']) ) {
	echo '<script src="/js/myscript.js"></script>';
}
?>

Запоминать позицию скролла в localStorage.
При закрытии браузера - стирать.
И первый рендр popup можно тоже сохранить.
Это всё относится к логике JS extension

В настройки сделать галку ибо ни всем это понравится.