/* Wartungsplan-Generator – produktionspraxis.de */
.ppw {
	--ppw-primary: #071D33;
	--ppw-accent: #FF6500;
	--ppw-text: #1f2933;
	--ppw-muted: #52606d;
	--ppw-line: #d9dee5;
	--ppw-soft: #f4f6f9;
	--ppw-ok: #1e6b3a;
	--ppw-err: #9b1c1c;
	--ppw-radius: 8px;
	color: var(--ppw-text);
	font-size: 16px;
	line-height: 1.5;
	margin: 1.5em 0 2.5em;
	box-sizing: border-box;
	container-type: inline-size;
	container-name: ppw;
}
.ppw *, .ppw *::before, .ppw *::after { box-sizing: border-box; }
.ppw [hidden] { display: none !important; }
.ppw-app { background: #fff; border: 1px solid var(--ppw-line); border-radius: 12px; padding: 0; overflow: hidden; }
.ppw-loading, .ppw-noscript, .ppw-error { padding: 2em; color: var(--ppw-muted); }

/* Schritte */
.ppw-steps { display: flex; list-style: none; margin: 0; padding: 0; background: var(--ppw-primary); counter-reset: none; }
.ppw-step { flex: 1 1 0; margin: 0; padding: 0; position: relative; }
.ppw-step > span, .ppw-step > button {
	display: flex; align-items: center; gap: .5em; width: 100%; padding: .9em 1em; color: rgba(255,255,255,.65);
	background: none; border: 0; font: inherit; font-size: .92em; text-align: left; cursor: default; margin: 0; border-radius: 0; box-shadow: none; text-transform: none; letter-spacing: 0;
}
.ppw-step > button { cursor: pointer; color: rgba(255,255,255,.85); }
.ppw-step > button:hover, .ppw-step > button:focus-visible { background: rgba(255,255,255,.08); color: #fff; }
.ppw-step-no { display: inline-flex; align-items: center; justify-content: center; width: 1.8em; height: 1.8em; flex: 0 0 1.8em; border-radius: 50%; border: 2px solid currentColor; font-weight: 700; font-size: .85em; }
.ppw-step.is-current > span { color: #fff; font-weight: 700; }
.ppw-step.is-current .ppw-step-no { background: var(--ppw-accent); border-color: var(--ppw-accent); color: #fff; }
.ppw-step.is-done .ppw-step-no { background: rgba(255,255,255,.2); border-color: transparent; }
.ppw-step.is-current::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--ppw-accent); }

.ppw-body { padding: 1.6em 1.8em .6em; }
.ppw .ppw-h2 { font-size: 1.45em; line-height: 1.25; margin: 0 0 .4em; color: var(--ppw-primary); }
.ppw .ppw-h3 { font-size: 1.08em; margin: 1.4em 0 .6em; color: var(--ppw-primary); }
.ppw-lead { color: var(--ppw-muted); margin: 0 0 1.2em; max-width: 60em; }
.ppw-note { color: var(--ppw-muted); font-size: .88em; margin: .4em 0 1em; }

/* Formularelemente */
.ppw-field { display: flex; flex-direction: column; gap: .25em; margin: 0 0 1em; min-width: 0; border: 0; padding: 0; }
.ppw-field > label:not(.ppw-radio-card), .ppw-field > legend { font-weight: 600; font-size: .9em; padding: 0; }
.ppw-field small { color: var(--ppw-muted); font-size: .8em; }
.ppw input[type=text], .ppw input[type=email], .ppw input[type=tel], .ppw input[type=number], .ppw input[type=date], .ppw input[type=search], .ppw select, .ppw textarea {
	width: 100%; max-width: 100%; padding: .55em .7em; border: 1px solid #b8c2cc; border-radius: 6px; background: #fff; color: var(--ppw-text);
	font: inherit; font-size: .95em; line-height: 1.3; margin: 0; height: auto; box-shadow: none;
}
.ppw input:focus, .ppw select:focus, .ppw textarea:focus { outline: 2px solid var(--ppw-accent); outline-offset: 1px; border-color: var(--ppw-accent); }
.ppw input[type=checkbox], .ppw input[type=radio] { width: 1.15em; height: 1.15em; accent-color: var(--ppw-accent); margin: .15em 0 0; flex: 0 0 auto; }
.ppw-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0 1em; }
.ppw-row-tight .ppw-field { margin-bottom: .6em; }
.ppw-check { display: flex; gap: .6em; align-items: flex-start; font-size: .92em; margin: .6em 0; cursor: pointer; }
.ppw-shifts { margin-bottom: .2em; }
.ppw-shifts legend { margin-bottom: .4em; }
.ppw-shifts { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .6em; }
.ppw-shifts legend { grid-column: 1 / -1; }
.ppw-radio-card { position: relative; display: flex; flex-direction: column; gap: .15em; padding: .75em .9em .75em 2.4em; border: 1px solid var(--ppw-line); border-radius: var(--ppw-radius); cursor: pointer; background: #fff; }
.ppw-radio-card input { position: absolute; left: .85em; top: .95em; }
.ppw-radio-card strong { font-size: .95em; }
.ppw-radio-card span { font-size: .8em; color: var(--ppw-muted); }
.ppw-radio-card.is-on { border-color: var(--ppw-accent); box-shadow: 0 0 0 1px var(--ppw-accent); background: #fff8f3; }
.ppw-more { border: 1px solid var(--ppw-line); border-radius: var(--ppw-radius); padding: .6em 1em; margin: .4em 0 1em; background: var(--ppw-soft); }
.ppw-more > summary { cursor: pointer; font-weight: 600; font-size: .92em; color: var(--ppw-primary); }
.ppw-more[open] > summary { margin-bottom: .8em; }
.ppw-more-small { padding: .3em .8em; background: #fff; }
.ppw-more-small > summary { font-weight: 500; font-size: .85em; }

/* Buttons */
.ppw .ppw-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .4em; padding: .7em 1.3em; border-radius: 6px; border: 2px solid var(--ppw-primary);
	background: var(--ppw-primary); color: #fff; font: inherit; font-weight: 600; font-size: .95em; line-height: 1.2; cursor: pointer; text-decoration: none; text-transform: none; letter-spacing: 0; box-shadow: none; margin: 0; width: auto;
}
.ppw .ppw-btn:hover { filter: brightness(1.15); }
.ppw .ppw-btn:focus-visible { outline: 3px solid var(--ppw-accent); outline-offset: 2px; }
.ppw .ppw-btn[disabled] { opacity: .45; cursor: not-allowed; filter: none; }
.ppw .ppw-btn-primary { background: var(--ppw-accent); border-color: var(--ppw-accent); color: #fff; }
.ppw .ppw-btn-ghost { background: #fff; color: var(--ppw-primary); }
.ppw .ppw-btn-ghost:hover { background: var(--ppw-soft); filter: none; }
.ppw .ppw-btn-small { padding: .4em .8em; font-size: .85em; border-width: 1px; }
.ppw .ppw-btn-big { padding: .95em 1.6em; font-size: 1.05em; }
.ppw .ppw-link { background: none; border: 0; padding: 0; margin: 0; color: var(--ppw-primary); text-decoration: underline; font: inherit; font-size: .9em; cursor: pointer; box-shadow: none; text-transform: none; }
.ppw .ppw-icon-btn { background: none; border: 1px solid var(--ppw-line); color: var(--ppw-muted); width: 2em; height: 2em; border-radius: 50%; font-size: 1.1em; line-height: 1; cursor: pointer; padding: 0; margin: 0 0 0 auto; display: inline-flex; align-items: center; justify-content: center; }
.ppw .ppw-icon-btn:hover { color: var(--ppw-err); border-color: var(--ppw-err); }
.ppw-nav { display: flex; justify-content: space-between; gap: 1em; padding: 1.1em 1.8em 1.6em; border-top: 1px solid var(--ppw-line); background: var(--ppw-soft); }

/* Maschinen */
.ppw-search { margin: .4em 0 .2em; }
.ppw-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .8em; }
.ppw-card { display: flex; flex-direction: column; gap: .35em; padding: .9em 1em; border: 1px solid var(--ppw-line); border-radius: var(--ppw-radius); background: #fff; }
.ppw-card.is-on { border-color: var(--ppw-accent); background: #fff8f3; }
.ppw-card-title { color: var(--ppw-primary); line-height: 1.3; }
.ppw-card p { margin: 0; font-size: .84em; color: var(--ppw-muted); flex: 1; }
.ppw-card-foot { display: flex; align-items: center; justify-content: space-between; gap: .5em; margin-top: .3em; flex-wrap: wrap; }
.ppw-meta { font-size: .75em; color: var(--ppw-muted); }
.ppw-box { border: 1px solid var(--ppw-line); border-radius: var(--ppw-radius); padding: .4em 1.1em 1em; margin: 0 0 1.4em; background: #fff; }
.ppw-box > .ppw-h3:first-child { margin-top: .6em; }
.ppw-mlist { display: flex; flex-direction: column; gap: .8em; }
.ppw-m { border: 1px solid var(--ppw-line); border-left: 4px solid var(--ppw-primary); border-radius: 6px; padding: .7em .9em .5em; background: #fff; }
.ppw-m.is-new { animation: ppw-flash 1.2s ease-out; }
@keyframes ppw-flash { from { background: #ffe3cc; } to { background: #fff; } }
.ppw-m-head { display: flex; align-items: center; gap: .6em; margin-bottom: .5em; }
.ppw-m-type { font-size: .85em; color: var(--ppw-muted); }
.ppw-badge { display: inline-block; background: var(--ppw-primary); color: #fff; font-size: .75em; font-weight: 700; padding: .15em .5em; border-radius: 4px; letter-spacing: .02em; }

/* Aufgaben */
.ppw-info { background: #eef3f9; border-left: 4px solid var(--ppw-primary); padding: .8em 1em; border-radius: 4px; font-size: .9em; margin: 0 0 1.2em; }
.ppw-info-warn { background: #fff6e8; border-left-color: var(--ppw-accent); }
.ppw-panel { border: 1px solid var(--ppw-line); border-radius: var(--ppw-radius); margin: 0 0 .7em; background: #fff; }
.ppw-panel.is-open { border-color: #9fb0c3; }
.ppw .ppw-panel-head { display: flex; align-items: center; gap: .7em; width: 100%; padding: .8em 1em; background: none; border: 0; border-radius: var(--ppw-radius); cursor: pointer; font: inherit; color: var(--ppw-text); text-align: left; margin: 0; box-shadow: none; text-transform: none; }
.ppw .ppw-panel-head:hover { background: var(--ppw-soft); }
.ppw-panel-title { font-weight: 700; flex: 1; color: var(--ppw-primary); }
.ppw-panel-count { font-size: .82em; color: var(--ppw-muted); white-space: nowrap; }
.ppw-chev { color: var(--ppw-muted); }
.ppw-panel-body { padding: 0 1em 1em; }
.ppw-tip { font-size: .86em; background: var(--ppw-soft); padding: .6em .8em; border-radius: 6px; margin: 0 0 .6em; }
.ppw-tools { display: flex; gap: 1.2em; margin: .2em 0 .5em; }
.ppw-tasks { display: flex; flex-direction: column; border-top: 1px solid var(--ppw-line); margin-bottom: .8em; }
.ppw-task { display: grid; grid-template-columns: 2em minmax(0, 1fr) 190px 150px 80px; gap: .4em .8em; align-items: start; padding: .6em 0; border-bottom: 1px solid var(--ppw-line); }
.ppw-task.is-off .ppw-task-main, .ppw-task.is-off .ppw-task-int, .ppw-task.is-off .ppw-task-role, .ppw-task.is-off .ppw-task-min { opacity: .45; }
.ppw-task-cb { padding-top: .2em; display: flex; justify-content: center; cursor: pointer; }
.ppw-task-main { display: flex; flex-direction: column; gap: .2em; min-width: 0; }
.ppw-task-title { font-weight: 600; font-size: .93em; }
.ppw-task-hint { color: var(--ppw-muted); font-size: .8em; line-height: 1.4; }
.ppw-tag { display: inline-block; font-size: .7em; font-weight: 500; color: var(--ppw-muted); background: var(--ppw-soft); border: 1px solid var(--ppw-line); padding: 0 .4em; border-radius: 3px; vertical-align: 1px; }
.ppw-mini { display: none; font-size: .72em; color: var(--ppw-muted); }
.ppw-inline { display: flex; gap: .3em; min-width: 0; }
.ppw-task-int, .ppw-task-role, .ppw-task-min { min-width: 0; }
.ppw input.ppw-num { width: 5.2em; flex: 0 0 auto; padding: .45em .4em; }
.ppw .ppw-inline select { flex: 1 1 auto; min-width: 0; width: auto; }
.ppw-task select { padding: .45em .4em; font-size: .88em; }
.ppw .ppw-task-min input.ppw-num { width: 100%; }
.ppw .ppw-del { color: var(--ppw-err); font-size: .8em; align-self: flex-start; }
.ppw-sum { font-weight: 600; color: var(--ppw-primary); margin: 1em 0 .4em; }

/* Prüfpflichten */
.ppw-pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: .8em; }
.ppw-pcard { border: 1px solid var(--ppw-line); border-radius: var(--ppw-radius); padding: .9em 1em; background: #fff; font-size: .9em; }
.ppw-pcard-check { background: var(--ppw-soft); }
.ppw-pcard-check.is-on { background: #fff; border-color: var(--ppw-accent); }
.ppw-pcheck { display: flex; gap: .5em; align-items: center; font-weight: 600; font-size: .85em; color: var(--ppw-primary); margin-bottom: .4em; cursor: pointer; }
.ppw-p-title { display: block; color: var(--ppw-primary); margin-bottom: .4em; line-height: 1.3; }
.ppw-p-dl { display: grid; grid-template-columns: 6.5em 1fr; gap: .2em .6em; margin: 0 0 .4em; }
.ppw-p-dl dt { color: var(--ppw-muted); font-size: .9em; margin: 0; }
.ppw-p-dl dd { margin: 0; }
.ppw-applies { font-size: .9em; margin: .3em 0; }
.ppw-pdet summary { cursor: pointer; font-size: .85em; color: var(--ppw-primary); }
.ppw-pdet p { margin: .4em 0; font-size: .92em; }

/* Ergebnis */
.ppw-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .7em; margin: .4em 0 1.4em; }
.ppw-tile { background: var(--ppw-soft); border-radius: var(--ppw-radius); padding: .9em 1em; display: flex; flex-direction: column; gap: .1em; }
.ppw-tile strong { font-size: 1.6em; color: var(--ppw-primary); line-height: 1.1; }
.ppw-tile span { font-size: .8em; color: var(--ppw-muted); }
.ppw-actions { display: flex; flex-wrap: wrap; gap: .8em; align-items: center; margin-bottom: .4em; }
.ppw-status { min-height: 1.4em; font-size: .9em; margin: .3em 0 1.2em; }
.ppw-status.is-ok, .ppw-form-msg.is-ok { color: var(--ppw-ok); font-weight: 600; }
.ppw-status.is-err, .ppw-form-msg.is-err { color: var(--ppw-err); font-weight: 600; }
.ppw-ul { margin: .3em 0 .6em 1.2em; padding: 0; font-size: .92em; }
.ppw-ul li { margin: .2em 0; }
.ppw-sem { list-style: none; margin: 0; padding: 0; }
.ppw-sem li { display: flex; gap: .8em; padding: .45em 0; border-bottom: 1px solid var(--ppw-line); font-size: .93em; }
.ppw-sem-date { font-weight: 700; color: var(--ppw-accent); white-space: nowrap; min-width: 6.2em; }
.ppw-more-link { font-weight: 600; font-size: .9em; }
.ppw-person { display: flex; gap: 1em; align-items: center; margin: .6em 0 1em; }
.ppw-person img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.ppw-person div { display: flex; flex-direction: column; font-size: .92em; }
.ppw-person span { color: var(--ppw-muted); }
.ppw-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.ppw-form-msg { min-height: 1.2em; margin: .6em 0 0; font-size: .92em; }
.ppw-disclaimer { font-size: .8em; color: var(--ppw-muted); margin: 1.2em 0 .4em; }
.ppw-restart { margin: 0 0 1em; }

/* Ratgeber */
.ppw-guide { margin: 2.5em 0 1em; }
.ppw-faq { border-bottom: 1px solid var(--ppw-line, #d9dee5); padding: .7em 0; }
.ppw-faq summary { cursor: pointer; font-weight: 600; font-size: 1.02em; }
.ppw-faq p { margin: .6em 0 .2em; }

/* Schmale Container (Sidebar-Layouts) und Mobil */
@container ppw (max-width: 860px) {
	.ppw-task { grid-template-columns: 2em minmax(0, 1.4fr) minmax(0, 1fr) 4.5em; grid-template-areas: "cb main main main" ". int role min"; }
	.ppw-task-cb { grid-area: cb; } .ppw-task-main { grid-area: main; } .ppw-task-int { grid-area: int; } .ppw-task-role { grid-area: role; } .ppw-task-min { grid-area: min; }
	.ppw-mini { display: block; }
}
@container ppw (max-width: 480px) {
	.ppw-task { grid-template-columns: 2em minmax(0, 1fr) 4.5em; grid-template-areas: "cb main main" ". int int" ". role min"; }
}
@container ppw (max-width: 620px) {
	.ppw-body { padding: 1.1em 1em .4em; }
	.ppw-nav { padding: 1em; }
	.ppw-nav .ppw-btn { padding: .7em .9em; font-size: .9em; }
	.ppw-step-name { display: none; }
	.ppw-step.is-current .ppw-step-name { display: inline; }
	.ppw-step.is-current { flex: 2.6 1 0; }
	.ppw-step > span, .ppw-step > button { padding: .75em .5em; justify-content: center; }
	.ppw-pgrid, .ppw-cards { grid-template-columns: 1fr; }
	.ppw-p-dl { grid-template-columns: 1fr; }
	.ppw-p-dl dt { margin-top: .2em; }
}
@supports not (container-type: inline-size) {
	@media (max-width: 860px) {
		.ppw-task { grid-template-columns: 2em minmax(0, 1.4fr) minmax(0, 1fr) 4.5em; grid-template-areas: "cb main main main" ". int role min"; }
		.ppw-task-cb { grid-area: cb; } .ppw-task-main { grid-area: main; } .ppw-task-int { grid-area: int; } .ppw-task-role { grid-area: role; } .ppw-task-min { grid-area: min; }
		.ppw-mini { display: block; }
	}
	@media (max-width: 720px) {
		.ppw-body { padding: 1.1em 1em .4em; }
		.ppw-nav { padding: 1em; }
		.ppw-nav .ppw-btn { padding: .7em .9em; font-size: .9em; }
		.ppw-step-name { display: none; }
		.ppw-step.is-current .ppw-step-name { display: inline; }
		.ppw-step.is-current { flex: 2.6 1 0; }
		.ppw-step > span, .ppw-step > button { padding: .75em .5em; justify-content: center; }
		.ppw-pgrid, .ppw-cards { grid-template-columns: 1fr; }
		.ppw-p-dl { grid-template-columns: 1fr; }
		.ppw-p-dl dt { margin-top: .2em; }
	}
}

/* Druck */
.ppw-print { display: none; }
@media print {
	body.ppw-printing > :not(.ppw-print) { display: none !important; } /* sonst leere Folgeseiten in Seitenhöhe */
	body.ppw-printing * { visibility: hidden !important; }
	body.ppw-printing .ppw-print, body.ppw-printing .ppw-print * { visibility: visible !important; }
	body.ppw-printing .ppw-print { display: block; position: absolute; left: 0; top: 0; width: 100%; font: 10pt/1.4 Arial, sans-serif; color: #000; }
	.ppw-print h1 { font-size: 16pt; margin: 0 0 4pt; }
	.ppw-print h2 { font-size: 11.5pt; margin: 14pt 0 4pt; break-after: avoid; }
	.ppw-print table { width: 100%; border-collapse: collapse; }
	.ppw-print th, .ppw-print td { border: 1px solid #999; padding: 3pt 5pt; text-align: left; vertical-align: top; font-size: 9pt; }
	.ppw-print th { background: #eee; }
	.ppw-print tr { break-inside: avoid; }
	.ppw-print-foot { font-size: 8pt; margin-top: 14pt; color: #444; }
}