.sasd-frontend {
	--sasd-blue: #1d4f91;
	--sasd-border: #ccd3dc;
	--sasd-text: #1f2937;
	box-sizing: border-box;
	color: var(--sasd-text);
	margin: 20px auto;
	max-width: 900px;
}

.sasd-frontend *,
.sasd-frontend *::before,
.sasd-frontend *::after {
	box-sizing: border-box;
}

.sasd-ticket-form {
	background: #fff;
	border: 1px solid var(--sasd-border);
	border-radius: 8px;
	box-shadow: 0 5px 18px rgb(31 41 55 / 7%);
	padding: clamp(20px, 4vw, 38px);
}

.sasd-form-grid {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sasd-ticket-form p {
	margin: 0 0 20px;
}

.sasd-ticket-form label {
	display: block;
	font-weight: 700;
	margin-bottom: 7px;
}

.sasd-ticket-form input,
.sasd-ticket-form select,
.sasd-ticket-form textarea,
.sasd-list-filters select {
	background: #fff;
	border: 1px solid var(--sasd-border);
	border-radius: 4px;
	color: var(--sasd-text);
	font: inherit;
	min-height: 46px;
	padding: 9px 11px;
	width: 100%;
}

.sasd-ticket-form textarea {
	resize: vertical;
}

.sasd-ticket-form input:focus,
.sasd-ticket-form select:focus,
.sasd-ticket-form textarea:focus,
.sasd-list-filters select:focus {
	border-color: var(--sasd-blue);
	box-shadow: 0 0 0 2px rgb(29 79 145 / 16%);
	outline: 0;
}

.sasd-submit,
.sasd-list-filters button {
	background: var(--sasd-blue);
	border: 2px solid var(--sasd-blue);
	border-radius: 4px;
	color: #fff;
	cursor: pointer;
	font: inherit;
	font-weight: 700;
	padding: 11px 20px;
}

.sasd-submit:hover,
.sasd-list-filters button:hover {
	background: #fff;
	color: var(--sasd-blue);
}

.sasd-alert {
	border: 1px solid;
	border-radius: 5px;
	margin: 15px 0;
	padding: 14px 16px;
}

.sasd-alert-success {
	background: #edfaef;
	border-color: #8cc89a;
	color: #176b2c;
}

.sasd-alert-error {
	background: #fcf0f1;
	border-color: #e1a3a8;
	color: #8a2424;
}

.sasd-honeypot {
	height: 1px;
	left: -9999px;
	overflow: hidden;
	position: absolute;
	width: 1px;
}

.sasd-list-filters {
	align-items: end;
	display: grid;
	gap: 10px;
	grid-template-columns: repeat(4, minmax(120px, 1fr)) minmax(100px, auto) auto;
	margin-bottom: 18px;
}

.sasd-table-wrap {
	overflow-x: auto;
}

.sasd-ticket-list table {
	border-collapse: collapse;
	min-width: 850px;
	width: 100%;
}

.sasd-ticket-list th,
.sasd-ticket-list td {
	border: 1px solid var(--sasd-border);
	padding: 10px 12px;
	text-align: left;
	vertical-align: top;
}

.sasd-ticket-list th {
	background: #f3f5f7;
}

@media (max-width: 720px) {
	.sasd-form-grid,
	.sasd-list-filters {
		grid-template-columns: 1fr;
	}
}