.znrpr {
	--z-primary: #0b6e4f;
	--z-primary-dark: #08543c;
	--z-border: #d9dee3;
	--z-bg: #f6f8f9;
	--z-text: #1f2a33;
	--z-muted: #66737f;
	--z-mr: #2e7d32;
	--z-sr: #e09a00;
	--z-vr: #c62828;
	color: var(--z-text);
	font-size: 15px;
	line-height: 1.5;
}
.znrpr *, .znrpr *::before, .znrpr *::after { box-sizing: border-box; }
.znrpr h2 { font-size: 1.45em; margin: 0 0 .8em; }
.znrpr h3 { font-size: 1.1em; margin: 1.6em 0 .6em; }
.znrpr-muted { color: var(--z-muted); font-size: .92em; }

/* Gumbi */
.znrpr-btn {
	display: inline-block; padding: .5em 1em; margin: .2em .3em .2em 0;
	border: 1px solid var(--z-border); border-radius: 6px; background: #fff; color: var(--z-text);
	font: inherit; font-size: .95em; cursor: pointer; text-decoration: none; line-height: 1.3;
}
.znrpr-btn:hover { border-color: var(--z-primary); color: var(--z-primary); }
.znrpr-btn-primary { background: var(--z-primary); border-color: var(--z-primary); color: #fff; }
.znrpr-btn-primary:hover { background: var(--z-primary-dark); color: #fff; }
.znrpr-btn-danger:hover { border-color: var(--z-vr); color: var(--z-vr); }
.znrpr-btn-lg { font-size: 1.1em; padding: .8em 1.6em; }
.znrpr-btn[disabled] { opacity: .5; cursor: not-allowed; }
.znrpr-x { border: 0; background: none; color: var(--z-muted); font-size: 1.4em; cursor: pointer; line-height: 1; padding: 0 .3em; }
.znrpr-x:hover { color: var(--z-vr); }

/* Popis procjena */
.znrpr-list-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5em; }
.znrpr-list-head h3 { margin: 0; }
.znrpr-empty { padding: 1.5em; background: var(--z-bg); border-radius: 8px; }

/* Prijava i registracija */
.znrpr-auth { max-width: 460px; }
.znrpr-auth-tabs { display: flex; gap: .25em; border-bottom: 2px solid var(--z-border); margin: 1em 0 1.2em; }
.znrpr-auth-tabs button { border: 0; background: none; padding: .6em 1.1em; font: inherit; cursor: pointer; color: var(--z-muted); border-bottom: 3px solid transparent; margin-bottom: -2px; }
.znrpr-auth-tabs button.active { color: var(--z-primary); border-bottom-color: var(--z-primary); font-weight: 600; }
.znrpr-auth input[type=text], .znrpr-auth input[type=email], .znrpr-auth input[type=password] {
	width: 100%; padding: .55em .7em; border: 1px solid var(--z-border); border-radius: 5px; font: inherit; background: #fff;
}
.znrpr-auth .znrpr-btn-primary { margin-top: .6em; padding: .65em 1.4em; }
.znrpr-auth-links { font-size: .9em; margin-top: 1em; }
.znrpr-auth-msg:empty { display: none; }
.znrpr-invalid { border-color: var(--z-vr) !important; outline: 2px solid rgba(198, 40, 40, .2); }
.znrpr-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cf-turnstile { margin: .6em 0; }

/* Raspored čarobnjaka */
.znrpr-wrap { display: grid; grid-template-columns: 220px 1fr; gap: 1.5em; align-items: start; }
.znrpr-steps { list-style: none; margin: 0; padding: 0; position: sticky; top: 1em; }
.znrpr-steps li { margin: 0 0 2px; }
.znrpr-steps button {
	width: 100%; text-align: left; padding: .55em .7em; border: 0; border-radius: 6px; background: none;
	font: inherit; font-size: .93em; color: var(--z-muted); cursor: pointer; display: flex; align-items: center; gap: .6em;
}
.znrpr-steps button span {
	flex: 0 0 1.7em; height: 1.7em; border-radius: 50%; border: 1px solid var(--z-border);
	display: inline-flex; align-items: center; justify-content: center; font-size: .85em; background: #fff;
}
.znrpr-steps li.done button { color: var(--z-text); }
.znrpr-steps li.done button span { background: #e3f1ec; border-color: var(--z-primary); color: var(--z-primary); }
.znrpr-steps li.active button { background: var(--z-bg); color: var(--z-text); font-weight: 600; }
.znrpr-steps li.active button span { background: var(--z-primary); border-color: var(--z-primary); color: #fff; }
.znrpr-body { min-width: 0; background: #fff; border: 1px solid var(--z-border); border-radius: 10px; padding: 1.5em; }
.znrpr-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 2em; padding-top: 1em; border-top: 1px solid var(--z-border); gap: .5em; }
.znrpr-status { font-size: .85em; color: var(--z-muted); }
.znrpr-foot-job { flex-wrap: wrap; }
.znrpr-foot-left { display: flex; flex-wrap: wrap; gap: .3em; }
.znrpr-foot-mid { display: flex; flex-direction: column; align-items: center; text-align: center; flex: 1; min-width: 10em; }
.znrpr-tabpos { font-size: .85em; font-weight: 600; color: var(--z-text); }
.znrpr-status.ok { color: var(--z-mr); }
.znrpr-status.err { color: var(--z-vr); }

/* Polja */
.znrpr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .4em 1em; }
.znrpr-field { margin: 0 0 .8em; }
.znrpr-field.wide { grid-column: 1 / -1; }
.znrpr-field label { display: block; font-weight: 600; font-size: .9em; margin-bottom: .25em; }
.znrpr-field .req { color: var(--z-vr); }
.znrpr input[type=text], .znrpr input[type=number], .znrpr input[type=date], .znrpr select, .znrpr textarea {
	width: 100%; padding: .45em .6em; border: 1px solid var(--z-border); border-radius: 5px; font: inherit; font-size: .95em; background: #fff; max-width: 100%;
}
.znrpr input:focus, .znrpr select:focus, .znrpr textarea:focus { outline: 2px solid rgba(11, 110, 79, .25); border-color: var(--z-primary); }
.znrpr-help { display: block; color: var(--z-muted); font-size: .82em; margin-top: .2em; }
.znrpr-err { color: var(--z-vr); }
.znrpr-check { display: flex; gap: .5em; align-items: flex-start; margin: .35em 0; cursor: pointer; }
.znrpr-check input { margin-top: .3em; }

/* Okviri s porukama */
.znrpr-info, .znrpr-warn, .znrpr-note { padding: .8em 1em; border-radius: 8px; margin: 0 0 1.2em; font-size: .93em; }
.znrpr-info { background: #eef6f3; border-left: 4px solid var(--z-primary); }
.znrpr-warn { background: #fdecea; border-left: 4px solid var(--z-vr); }
.znrpr-note { background: #fff6e0; border-left: 4px solid var(--z-sr); }
.znrpr-info p, .znrpr-warn p { margin: .3em 0; }
.znrpr-warn ul, .znrpr-note ul { margin: .4em 0 0 1.2em; }

/* Tablice */
.znrpr-table { width: 100%; border-collapse: collapse; margin: .5em 0 1em; font-size: .92em; }
.znrpr-table th, .znrpr-table td { border: 1px solid var(--z-border); padding: .45em .55em; vertical-align: top; text-align: left; }
.znrpr-table th { background: var(--z-bg); font-weight: 600; }
.znrpr-table.znrpr-edit td { padding: .25em; }
.znrpr-table td.c { text-align: center; }
.znrpr-table .nowrap { white-space: nowrap; }
.znrpr-actions { white-space: nowrap; }
.znrpr-isp th { font-size: .78em; }
.znrpr-scroll { overflow-x: auto; margin: .5em 0 1em; }
.znrpr-scroll > .znrpr-table { margin: 0; }
.znrpr-edit input[type=text] { min-width: 7em; }
.znrpr-edit input[type=number] { min-width: 4.5em; }
.znrpr-card { border: 1px solid var(--z-border); border-radius: 8px; padding: .7em .9em .2em; margin: 0 0 .8em; background: #fff; }
.znrpr-card-head { display: flex; align-items: center; gap: .6em; margin-bottom: .6em; }
.znrpr-card-head b { flex: 1; }
.znrpr-card .znrpr-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.znrpr-isp td:first-child { min-width: 12em; }
.znrpr-cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0 1.2em; margin-bottom: .8em; }
.znrpr-isp-sel { min-width: 11.5em; padding: .3em !important; font-weight: 600; }
.znrpr-isp-P { background: #fff6e0 !important; color: #8a5a00; }
.znrpr-isp-Z { background: #e3f1ec !important; color: var(--z-mr); }
.znrpr-isp-NZ { background: #fdecea !important; color: var(--z-vr); }
.znrpr-haz select { min-width: 11.5em; }
.znrpr-haz textarea { min-width: 14em; }

/* Rizik */
.znrpr-r { display: inline-block; padding: .1em .55em; border-radius: 4px; font-weight: 600; font-size: .85em; color: #fff; white-space: nowrap; }
.znrpr-r-MR { background: var(--z-mr); }
.znrpr-r-SR { background: var(--z-sr); }
.znrpr-r-VR { background: var(--z-vr); }

/* Radna mjesta */
.znrpr-add-job { display: flex; gap: .5em; align-items: center; flex-wrap: wrap; margin: 1em 0; }
.znrpr-add-job select { max-width: 420px; }
.znrpr-job-head { display: flex; align-items: center; gap: 1em; flex-wrap: wrap; margin-bottom: 1em; }
.znrpr-job-head h2 { margin: 0; }
.znrpr-tabs { display: flex; flex-wrap: wrap; gap: .25em; border-bottom: 2px solid var(--z-border); margin-bottom: 1.2em; }
.znrpr-tabs button { border: 0; background: none; padding: .6em 1em; font: inherit; font-size: .93em; cursor: pointer; color: var(--z-muted); border-bottom: 3px solid transparent; margin-bottom: -2px; }
.znrpr-tabs button.active { color: var(--z-primary); border-bottom-color: var(--z-primary); font-weight: 600; }
.znrpr-kat { border: 1px solid var(--z-border); border-radius: 8px; margin: 0 0 .6em; }
.znrpr-kat summary { padding: .6em .9em; cursor: pointer; font-weight: 600; }
.znrpr-akt { padding: 0 .9em .7em; }
.znrpr-badge { display: inline-block; background: var(--z-primary); color: #fff; border-radius: 10px; padding: 0 .55em; font-size: .8em; margin-left: .4em; }
.znrpr-uo { padding: .6em 1em; background: var(--z-bg); border-radius: 6px; }

/* Pravila */
.znrpr-rules td:first-child { width: 55%; }
.znrpr-rule-opts { display: flex; gap: .3em; flex-wrap: wrap; }
.znrpr-pill { border: 1px solid var(--z-border); border-radius: 14px; padding: .15em .7em; font-size: .85em; cursor: pointer; white-space: nowrap; }
.znrpr-pill input { display: none; }
.znrpr-pill-P.on { background: #e3f1ec; border-color: var(--z-mr); color: var(--z-mr); }
.znrpr-pill-N.on { background: #fdecea; border-color: var(--z-vr); color: var(--z-vr); }
.znrpr-pill-NP.on { background: var(--z-bg); border-color: var(--z-muted); }

/* Pregled */
.znrpr-summary { display: flex; flex-wrap: wrap; gap: .7em; margin: 1em 0 1.5em; }
.znrpr-summary div { flex: 1 1 110px; padding: .8em; border-radius: 8px; background: var(--z-bg); text-align: center; }
.znrpr-summary b { display: block; font-size: 1.6em; }
.znrpr-summary span { font-size: .85em; color: var(--z-muted); }
.znrpr-summary .znrpr-r-MR b { color: var(--z-mr); }
.znrpr-summary .znrpr-r-SR b { color: var(--z-sr); }
.znrpr-summary .znrpr-r-VR b { color: var(--z-vr); }
.znrpr-summary .znrpr-r-MR, .znrpr-summary .znrpr-r-SR, .znrpr-summary .znrpr-r-VR { background: var(--z-bg); }

@media (max-width: 820px) {
	.znrpr-wrap { grid-template-columns: 1fr; }
	.znrpr-steps { position: static; display: flex; overflow-x: auto; gap: 2px; padding-bottom: .4em; }
	.znrpr-steps li { flex: 0 0 auto; }
	.znrpr-steps button { white-space: nowrap; }
	.znrpr-body { padding: 1em; }
	.znrpr-table { display: block; overflow-x: auto; }
}