/**
 * TechSewa — project-wide mobile responsiveness
 * Loaded after style.css / admin-theme-modern.css
 */

html {
	-webkit-text-size-adjust: 100%;
}

iframe {
	max-width: 100%;
}

.table-responsive {
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

@media (max-width: 1024px) {
	html,
	body,
	#body-wrapper {
		max-width: 100%;
		overflow-x: hidden;
	}

	#main-content {
		min-width: 0 !important;
		max-width: 100% !important;
		box-sizing: border-box;
	}

	body:not(.admin-theme-v2) #main-content {
		margin-left: 10px !important;
		margin-right: 10px !important;
		width: auto !important;
		max-width: calc(100% - 20px) !important;
	}
}

@media (max-width: 768px) {
	*,
	*::before,
	*::after {
		box-sizing: border-box;
	}

	html,
	body,
	#body-wrapper,
	.contenrwrapper,
	.content-box,
	.content-box-content,
	#main-content,
	#login-wrapper,
	#center_wrapper,
	#content_wrapper {
		max-width: 100% !important;
		min-width: 0 !important;
	}

	body:not(.admin-theme-v2) #main-content {
		margin: 10px 0 0 !important;
		padding: 10px !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	body:not(.admin-theme-v2) .header {
		height: auto !important;
		padding: 10px 12px !important;
		overflow: hidden;
	}

	body:not(.admin-theme-v2) h1.main-title {
		font-size: 15px !important;
		padding-top: 6px !important;
		position: static !important;
	}

	/* Cap hardcoded inline widths used across views and popups */
	#main-content [style],
	.content-box [style],
	.toolbar1 [style],
	.toolbar [style],
	#facebox [style],
	#login-wrapper [style],
	#jobcard [style],
	#cardContent [style] {
		max-width: 100% !important;
	}

	.col-1,
	.col-2,
	.col,
	.col-3,
	.col-33,
	#col-1,
	.full_width,
	.column-left,
	.column-right,
	.left-box,
	.right-box,
	.one-third,
	.box_check,
	.grid_5,
	.push_2,
	.container_10,
	.section_wrapper {
		width: 100% !important;
		float: none !important;
		display: block !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	form .col-1,
	form .col-2,
	form .col {
		width: 100% !important;
		display: block !important;
	}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="number"],
	input[type="tel"],
	input[type="search"],
	input.text-input,
	select,
	textarea,
	.wysiwyg {
		max-width: 100% !important;
		box-sizing: border-box !important;
		font-size: 16px !important;
	}

	#main-content input[type="text"],
	#main-content input[type="password"],
	#main-content input.text-input,
	#main-content select,
	#main-content textarea,
	form input.text-input,
	form select,
	form textarea {
		width: 100% !important;
	}

	input[type="checkbox"],
	input[type="radio"] {
		width: auto !important;
		max-width: none !important;
	}

	.toolbar1,
	.toolbar,
	.content-box-content,
	.tblForm {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		max-width: 100%;
	}

	.toolbar1 table,
	.toolbar table {
		min-width: 620px;
	}

	table.tblgrid {
		min-width: 560px;
	}

	table.tblForm {
		min-width: 0 !important;
		width: 100% !important;
	}

	form fieldset legend {
		width: auto !important;
		max-width: calc(100% - 16px);
	}

	#submit_btn {
		float: none !important;
		margin: 12px 0 0 !important;
	}

	.pagination {
		display: flex;
		flex-wrap: wrap;
		gap: 4px;
	}

	.select2-container {
		width: 100% !important;
		max-width: 100% !important;
	}

	.ui-datepicker,
	#ui-datepicker-div {
		max-width: 96vw !important;
		width: auto !important;
	}

	#facebox {
		max-width: 96vw !important;
		box-sizing: border-box;
	}

	#facebox .popup,
	#facebox .body,
	#facebox .content {
		width: auto !important;
		max-width: 96vw !important;
		box-sizing: border-box;
	}

	#facebox table {
		width: 100% !important;
		min-width: 0 !important;
	}

	#login-box {
		width: auto !important;
		max-width: 94vw;
		height: auto !important;
		background: #fff;
		border-radius: 12px;
		padding: 20px 16px 28px;
		box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
	}

	#login-wrapper #login-top {
		padding: 24px 12px 8px;
	}

	#login-wrapper #login-content {
		width: 100% !important;
		max-width: 100%;
	}

	#login-wrapper #login-content input {
		width: 100% !important;
		max-width: 100%;
		box-sizing: border-box;
	}

	#login-wrapper #login-content input#btn_submit {
		width: 100% !important;
		left: auto;
		position: static;
		margin-top: 8px;
	}

	.main_footer img {
		max-width: 110px;
		height: auto;
	}

	.receipt,
	#jobcard,
	#cardContent,
	.top-box,
	.main-box {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
	}

	.validation-error {
		width: 100% !important;
		max-width: 100%;
	}

	.ui-dialog {
		max-width: 96vw !important;
		left: 2vw !important;
	}

	#dispatch {
		flex-wrap: wrap;
	}

	img {
		max-width: 100%;
		height: auto;
	}

	img.btn,
	img.ui-datepicker-trigger,
	#sidebar img,
	.header img {
		max-width: none;
	}
}

@media (max-width: 480px) {
	body:not(.admin-theme-v2) {
		font-size: 13px;
	}

	.button,
	input.button,
	button.button {
		margin: 4px 4px 4px 0 !important;
	}
}

@media print {
	.table-responsive,
	.toolbar1,
	.content-box-content {
		overflow: visible !important;
	}

	table.tblgrid,
	.toolbar1 table {
		min-width: 0 !important;
	}

	#sidebar,
	.header,
	#menuhide,
	#sidebar-backdrop {
		display: none !important;
	}

	#main-content {
		margin: 0 !important;
		padding: 0 !important;
		max-width: 100% !important;
		width: 100% !important;
	}
}