@media screen and (max-width : 1580px) {
	.wrapper {padding: 0 calc(var(--pad) * 8);}
}

@media screen and (max-width : 1380px) {
	.wrapper {padding: 0 calc(var(--pad) * 2.5);}
}

@media screen and (max-width : 1280px) {
	.main-menu .level-0 + .level-0 {margin: 0 0 0 calc(var(--pad) * 4);}
	.main-menu .level-0:after {right: -16px;}

	.files-products-grid {--columns: repeat(3, 1fr); --gap: 24px;}

	table.persons-list th,
	table.persons-list td {padding: 4px 8px;}

	.input {width: 800px;}
}

@media screen and (max-width : 1140px) {
	.input {width: 680px;}
}

@media screen and (max-width : 1023px) {
	#header .content {height: 80px; gap: 16px;}

	#main {margin-top: 80px;}

	#header .site-logo {flex: 1;}
	#header .main-menu {display: none;}

	.welcome {padding: 8px;}

	#mobile-menu-toggle {display: inline-block;}

	.filter-form .field.field.statuses .sidebar {width: 100%;}
	.filter-form .field.field.statuses .sidebar p {margin: 0;}
	.filter-form .field.field.statuses .sidebar .checkbox-button {display: inline-block; vertical-align: middle; width: 120px; padding: 8px; font-size: 0.625rem;}

	.files-products-grid {--columns: repeat(2, 1fr);}

	.files-products-download .top .image {width: 320px;}

	.label-input .as-label {width: 180px;}
	.general-form .field-title .title {padding-left: 200px;}
	.general-form .with-indent {padding-left: 200px;}
	.input {width: 600px;}

	table.persons-list {border-spacing: 0; background: white;}
	table.persons-list thead {display: none;}
	table.persons-list tbody {font-size: 0;}
	table.persons-list tr {display: inline-block; width: 50%; font-size: 1rem; padding: 12px;}
	table.persons-list td {display: block; text-align: left; background: white !important; border: 0 !important;}

	.checkbox-grid {--columns: repeat(3, 1fr);}

	.comments-grid .comment .meta {width: 180px;}
}

@media screen and (max-width : 899px) {
	.input {width: 500px;}
}

@media screen and (max-width : 799px) {
	.input {width: 420px;}
}

@media screen and (max-width : 767px) {
	.mobile-only {display: block;}

	.filter-form-toggle {display: block;}
	.filter-form form .filter-form-toggle {display: inline-flex;}
	.filter-form form {position: fixed; top: 0; left: -300px; width: 300px; height: 100dvh; padding: 20px; background: #f6f6f6; z-index: 18000; overflow-x: auto; -webkit-overflow-scrolling: touch; transition: var(--transition1); will-change: left;}
	.filter-form form.opened {left: 0;}
	body:has(.filter-form form.opened) .filter-form-overlay {opacity: 1; pointer-events: auto;}
	/*.filter-form + .pager {display: none;}*/
	.filter-form .field.field.field.statuses .sidebar-after .checkboxes {grid-template-columns: unset;}
	.filter-form .field {width: 100%;}
	.filter-form .field.half {width: calc(50% - 6px);}
	.filter-form .label-input {width: 100%;}
	.filter-form .input {width: 100%;}
	.filter-form .sorting .title {padding: 0;}
	.filter-form .sorting select {width: 100%;}

	.button {padding: 8px 16px; font-size: 0.875rem;}

	.page-heading {padding-bottom: 24px;}
	.page-heading .title {font-size: 1.125em;}
	.page-heading .title .count {font-size: 1rem; padding: 6px;}
	.page-heading .acts {gap: 8px;}

	.tickets-list, .pager {margin-top: 24px;}

	.tickets-list tr {display: block; position: relative;}
	.tickets-list thead {display: none;}
	.tickets-list td {display: block; width: 100% !important; text-align: left !important; padding: 12px; padding-left: 80px; position: relative; border-bottom: 0;}
	.tickets-list td:last-child {border-bottom: solid 2px var(--primary);}
	.tickets-list td .as-th {display: block;}
	.tickets-list td.info {position: unset !important;}

	/* .table-tickets-list tbody td:nth-child(1):before {content: "№";}
	.table-tickets-list tbody td:nth-child(2):before {content: "№ по ред";}
	.table-tickets-list tbody td:nth-child(3):before {content: "Статус";}
	.table-tickets-list tbody td:nth-child(4):before {content: "Приоритет";}
	.table-tickets-list tbody td:nth-child(5):before {content: "Фирма";}
	.table-tickets-list tbody td:nth-child(6):before {content: "Дата";}
	.table-tickets-list tbody td:nth-child(7):before {content: "Информация";}

	.table-clients-list tbody td:nth-child(1):before {content: "Клиент";}
	.table-clients-list tbody td:nth-child(2):before {content: "Адрес";}
	.table-clients-list tbody td:nth-child(3):before {content: "Телефон";}
	.table-clients-list tbody td:nth-child(4):before {content: "Файлове";}
	.table-clients-list tbody td:nth-child(5):before {content: "Активност";}
	.table-clients-list tbody td:nth-child(6):before {content: "Добавен на";}
	.table-clients-list tbody td:nth-child(7):before {content: "Редактиран на";} */

	.table-in-table tr {display: table-row;}
	.table-in-table th {display: table-cell; width: auto !important;}
	.table-in-table td {display: table-cell; width: auto !important; border: 0 !important;}
	.table-in-table td .as-th {display: none !important;}

	.pager {gap: 8px;}
	.pager a, .pager strong {width: 30px;}

	.files-products-download .top .image {width: 240px;}
	.files-products-download .top .info {flex: 100%;}

	.general-form {padding: 20px;}
	.general-form .label-input .as-label {width: 100%; text-align: left;}
	.general-form .label-input .as-label .label {min-height: unset;}
	.general-form .field-title .title {padding-left: 8px;}
	.general-form .with-indent {padding-left: 0;}
	.general-form .label-input {width: 100%; gap: 8px;}
	.general-form .input {width: 100%;}

	.input-wrap.multiple .elem {width: 100%;}

	.checkbox-grid {--columns: repeat(2, 1fr);}

	.report-form-fixed-row .field-submit {margin-left: 0; padding-block: 12px;}

	.tickets-list-wrap {width: calc(100% + var(--pad) * 5); margin-left: calc(var(--pad) * -2.5);}

	.mobile-reload-button {display: flex;}
}

@media screen and (max-width : 639px) {
	.files-products-grid {--columns: unset;}

	table.persons-list tr {width: 100%;}

	.field-submit ul {gap: 10px;}

	.checkbox-grid {--columns: unset;}
}

@media screen and (max-width : 567px) {
	.site-logo-inline {width: 220px; height: 80px; margin: 0 0 20px 0;}
	#page-login .content {width: 100%; margin: 50px 0; padding: 0 calc(var(--pad) * 2.5);}
	#page-login h1 {font-size: 1.5em; margin: 0 0 20px 0;}
	#page-login form {padding: 20px;}
	#page-login .foot {margin: 20px 0 0 0;}

	#header .site-logo .logo {width: 100px; height: 25px;}
	.site-logo .tagline {font-size: 0.41rem; margin: 4px 0 0 0;}

	.welcome {border: 0; padding: 0;}
	.welcome .avatar {width: 30px; font-size: 1em;}
	.welcome .login {font-size: 0.75em;}

	.hamburger {width: calc(var(--pad) * 6);}

	.files-products-download .ui-accordion .ui-accordion-content {padding: 0 !important;}

	.comments-grid .comment {gap: 0; padding: 0;}
	.comments-grid .comment .meta {width: 100%; text-align: left;}
	.comments-grid .comment .meta .num {left: unset; right: 10px;}
}

@media screen and (max-width : 374px) {
	.welcome {display: none;}
}