.dj-event-schedule {
	--schedule-accent: #31d7ff;
	--schedule-bg: rgba(18, 53, 72, 0.72);
	--schedule-border: rgba(255, 255, 255, 0.2);
	color: #fff;
	display: grid;
	gap: 18px;
}

.dj-event-schedule *,
.dj-event-schedule *::before,
.dj-event-schedule *::after { box-sizing: border-box; }

.dj-event-schedule button,
.dj-event-schedule input,
.dj-event-schedule textarea { font: inherit; }

.dj-event-schedule-head {
	align-items: end;
	display: flex;
	gap: 18px;
	justify-content: space-between;
}

.dj-event-schedule-head p {
	color: var(--schedule-accent);
	font-size: 12px;
	font-weight: 800;
	margin: 0 0 5px;
	text-transform: uppercase;
}

.dj-event-schedule-head h3 {
	color: #fff;
	font-size: clamp(22px, 3vw, 32px);
	line-height: 1.15;
	margin: 0;
}

.dj-event-schedule-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.dj-event-schedule button {
	align-items: center;
	appearance: none;
	background: transparent;
	border: 1px solid var(--schedule-border);
	border-radius: 6px;
	color: #fff;
	cursor: pointer;
	display: inline-flex;
	font-weight: 700;
	gap: 7px;
	justify-content: center;
	min-height: 40px;
	padding: 8px 12px;
}

.dj-event-schedule button:hover,
.dj-event-schedule button:focus-visible {
	background: rgba(49, 215, 255, 0.1);
	border-color: var(--schedule-accent);
}

.dj-event-schedule-list {
	display: grid;
	gap: 14px;
}

.dj-event-schedule-item {
	background: var(--schedule-bg);
	border: 1px solid var(--schedule-border);
	border-radius: 8px;
	display: grid;
	gap: 8px;
	grid-template-columns: 38px 105px minmax(260px, 2fr) minmax(135px, 0.8fr) minmax(135px, 0.8fr) 36px;
	padding: 8px 10px;
}

.dj-event-schedule-item label {
	display: grid;
	gap: 6px;
}

.dj-event-schedule-item label > span,
.dj-event-schedule-mail label > span {
	color: rgba(255, 255, 255, 0.68);
	font-size: 11px;
	font-weight: 800;
	text-transform: uppercase;
}

.dj-event-schedule-item input,
.dj-event-schedule-item textarea,
.dj-event-schedule-mail input {
	background: rgba(7, 28, 39, 0.68);
	border: 1px solid rgba(255, 255, 255, 0.28);
	border-radius: 6px;
	color: #fff;
	min-height: 34px;
	padding: 5px 8px;
	width: 100%;
}

.dj-event-schedule-item textarea {
	min-height: 64px;
	resize: vertical;
}

.dj-event-schedule-item input[type="time"]::-webkit-calendar-picker-indicator {
	filter: invert(1);
}

.dj-event-schedule-order,
.dj-event-schedule-remove {
	display: grid;
	gap: 6px;
}

.dj-event-schedule-order button,
.dj-event-schedule-remove button {
	height: 30px;
	min-height: 30px;
	padding: 0;
	width: 36px;
}

.dj-event-schedule-notes {
	grid-column: 2 / -2;
}

.dj-event-schedule-notes summary {
	color: rgba(255, 255, 255, 0.72);
	cursor: pointer;
	font-size: 12px;
	font-weight: 700;
	padding: 2px 0;
}

.dj-event-schedule-notes[open] summary {
	color: var(--schedule-accent);
	margin-bottom: 7px;
}

.dj-event-schedule-insert {
	height: 0;
	position: relative;
	z-index: 4;
}

.dj-event-schedule-insert button {
	background: #123848;
	border-color: rgba(49, 215, 255, 0.55);
	left: 50%;
	min-height: 28px;
	padding: 3px 9px;
	position: absolute;
	top: -21px;
	transform: translateX(-50%);
}

.dj-event-schedule-insert button span {
	font-size: 11px;
}

.dj-event-schedule-remove button { color: #ff8ca0; }

.dj-event-schedule-add {
	background: #123848 !important;
	border-color: rgba(49, 215, 255, 0.55) !important;
	font-size: 11px;
	justify-self: center;
	min-height: 28px !important;
	padding: 3px 9px !important;
}

.dj-event-schedule-mail {
	align-items: end;
	background: rgba(49, 215, 255, 0.07);
	border: 1px solid rgba(49, 215, 255, 0.25);
	border-radius: 8px;
	display: grid;
	gap: 12px;
	grid-template-columns: minmax(220px, 1fr) minmax(220px, 0.8fr) auto;
	padding: 15px;
}

.dj-event-schedule-mail > div { display: grid; gap: 3px; }
.dj-event-schedule-mail > div span { color: rgba(255, 255, 255, 0.68); font-size: 12px; }
.dj-event-schedule-mail label { display: grid; gap: 6px; }
.dj-event-schedule-mail p { color: var(--schedule-accent); font-size: 12px; grid-column: 1 / -1; margin: 0; min-height: 1em; }
.dj-event-schedule-honeypot { height: 1px; left: -10000px; overflow: hidden; position: absolute; width: 1px; }

@media (max-width: 1050px) {
	.dj-event-schedule-item { grid-template-columns: 38px 95px minmax(220px, 1.5fr) minmax(130px, 1fr) 36px; }
	.dj-event-schedule-item > label:nth-of-type(4) { grid-column: 2 / 5; }
	.dj-event-schedule-notes { grid-column: 2 / 5; }
}

@media (max-width: 700px) {
	.dj-event-schedule-head { align-items: start; flex-direction: column; }
	.dj-event-schedule-item { grid-template-columns: 40px minmax(0, 1fr) auto; }
	.dj-event-schedule-item > label { grid-column: 2; }
	.dj-event-schedule-item > label:nth-of-type(4) { grid-column: 2; }
	.dj-event-schedule-notes { grid-column: 2; }
	.dj-event-schedule-remove { grid-column: 3; grid-row: 1; }
	.dj-event-schedule-mail { grid-template-columns: 1fr; }
	.dj-event-schedule-insert button span { display: none; }
}

@media print {
	body * { visibility: hidden !important; }
	.dj-event-schedule,
	.dj-event-schedule * { visibility: visible !important; }
	.dj-event-schedule { color: #000; left: 0; position: absolute; top: 0; width: 100%; }
	.dj-event-schedule-actions,
	.dj-event-schedule-add,
	.dj-event-schedule-insert,
	.dj-event-schedule-mail,
	.dj-event-schedule-order,
	.dj-event-schedule-remove { display: none !important; }
	.dj-event-schedule-item { background: #fff; border-color: #bbb; break-inside: avoid; color: #000; grid-template-columns: 70px 1.5fr 1fr 1fr; }
	.dj-event-schedule-item input,
	.dj-event-schedule-item textarea { background: #fff; border: 0; color: #000; padding: 0; }
	.dj-event-schedule-item label > span { color: #555; }
	.dj-event-schedule-notes { grid-column: 1 / -1; }
	.dj-event-schedule-notes summary { display: none; }
	.dj-event-schedule-notes:not([open]) > label { display: grid; }
}
