* { box-sizing: border-box; }
	body { font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; margin: 0; background: #eef2ef; color: #1f2937; font-size: 15px; line-height: 1.5; }
	/* ===== Kartu konten ===== */
	.wrap { max-width: 1280px; margin: 24px auto; padding: 20px 24px 24px; background: #fff; min-height: 70vh; border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,.08), 0 4px 16px rgba(0,0,0,.04); }
	.page-title { font-size: 20px; color: #1f2937; border-bottom: 1px solid #dfe5e0; padding-bottom: 10px; margin: 0 0 16px; font-weight: 700; }
	.page-title #judulTanggal, .page-title #totalInfo { float: right; font-size: 14px; font-weight: 400; color: #5b6b5f; }
	/* ===== Toolbar (bilah filter) ===== */
	.toolbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 16px; padding: 12px; background: #f7faf8; border: 1px solid #dfe5e0; border-radius: 10px; }
	.toolbar input, .toolbar select { padding: 10px 12px; font-size: 14px; border: 1px solid #cfd8d1; border-radius: 8px; background: #fff; color: #1f2937; font-family: inherit; }
	.toolbar input:focus, .toolbar select:focus { outline: none; border-color: #1e7d46; box-shadow: 0 0 0 3px rgba(30,125,70,.15); }
	.toolbar input[type=text], .toolbar input[type=date] { flex: 1; min-width: 220px; }
	.toolbar select { cursor: pointer; min-width: 180px; }
	.btn { border: 1px solid #1e7d46; cursor: pointer; padding: 10px 20px; font-size: 14px; font-weight: 600; border-radius: 8px; color: #fff; background: #1e7d46; font-family: inherit; }
	.btn:hover { background: #176a3c; border-color: #176a3c; }
	.btn:focus { outline: none; box-shadow: 0 0 0 3px rgba(30,125,70,.2); }
	.btn-sekunder { background: #fff; color: #1f2937; border-color: #cfd8d1; }
	.btn-sekunder:hover { background: #f7faf8; border-color: #1e7d46; }
	.btn-cetak { margin-left: auto; }
	/* ===== Tabel ===== */
	.tabel-wrap { overflow-x: auto; border: 1px solid #dfe5e0; border-radius: 10px; }
	table.data { border-collapse: collapse; width: 100%; font-size: 14px; }
	table.data th { background: #1e7d46; color: #fff; padding: 11px 12px; text-align: left; font-weight: 600; position: sticky; top: 0; z-index: 1; }
	table.data th.sortable { cursor: pointer; } table.data th.sortable:hover { background: #166539; }
	table.data td { padding: 11px 12px; border-bottom: 1px solid #e5ebe6; vertical-align: top; }
	table.data tr:nth-child(even) td { background: #f7faf8; }
	table.data tbody tr:hover td { background: #eef5f0; }
	.note { background: #f0f7f2; border: 1px solid #c8e0cf; padding: 11px 14px; font-size: 13.5px; margin-top: 14px; border-radius: 10px; color: #1f2937; }
	/* ===== Modal CETAK JADWAL SIDANG ===== */
	.backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 50; }
	.backdrop.show { display: block; }
	.modal { width: 520px; max-width: 94vw; margin: 8vh auto 0; background: #fff; border: none; border-radius: 14px; overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
	.modal-head { background: #1e7d46; color: #fff; text-align: center; font-size: 18px; padding: 14px; letter-spacing: .5px; font-weight: 700; }
	.modal-body { padding: 0; }
	.mrow { display: flex; border-bottom: 1px solid #e5ebe6; }
	.mrow label { width: 170px; flex-shrink: 0; background: #1e7d46; color: #fff; padding: 13px 12px; font-size: 14px; }
	.mrow label i { color: #ff5252; font-style: normal; }
	.mrow .field { flex: 1; padding: 10px; background: #f7faf8; display: flex; gap: 0; }
	.mrow .field input, .mrow .field select { flex: 1; padding: 10px; font-size: 14px; border: 1px solid #cfd8d1; border-radius: 8px; background: #fff; font-family: inherit; }
	.mrow .field input:focus, .mrow .field select:focus { outline: none; border-color: #1e7d46; box-shadow: 0 0 0 3px rgba(30,125,70,.15); }
	.modal-foot { text-align: center; padding: 16px; background: #fff; }
	.modal-foot button { cursor: pointer; padding: 11px 28px; font-size: 15px; font-weight: 600; border-radius: 8px; margin: 0 4px; font-family: inherit; }
	.btn-kembali { background: #fff; color: #1f2937; border: 1px solid #cfd8d1; }
	.btn-kembali:hover { border-color: #1e7d46; background: #f7faf8; }
	.btn-cetak-merah { background: #d32f2f; color: #fff; border: 1px solid #d32f2f; }
	.btn-cetak-merah:hover { background: #b71c1c; border-color: #b71c1c; }
	/* ===== Layar kecil ===== */
	@media (max-width: 640px) {
		.wrap { margin: 12px; padding: 14px; }
		.page-title #judulTanggal, .page-title #totalInfo { float: none; display: block; margin-top: 4px; }
		.toolbar input[type=text], .toolbar input[type=date] { min-width: 100%; }
		.toolbar select { min-width: 100%; }
		.btn-cetak { margin-left: 0; }
		table.data { font-size: 13px; }
		table.data th, table.data td { padding: 9px 10px; }
		.modal { margin-top: 4vh; }
		.mrow { flex-direction: column; }
		.mrow label { width: auto; }
	}