/* Lejekontrakt Portal – front-end styles. Scoped under .lkp so themes are not affected. */
.lkp {
	--lkp-accent: #1f4e79;
	--lkp-ink: #1f2933;
	--lkp-muted: #616e7c;
	--lkp-line: #e4e7eb;
	--lkp-soft: #f5f7fa;
	--lkp-ok: #2f8a4c;
	--lkp-warn: #b7791f;
	--lkp-bad: #c53030;
	--lkp-radius: 10px;
	color: var(--lkp-ink);
	font-size: 16px;
	line-height: 1.5;
	max-width: 1080px;
	margin: 0 auto;
}
.lkp *, .lkp *::before, .lkp *::after { box-sizing: border-box; }
.lkp [hidden] { display: none !important; }
.lkp h2 { font-size: 1.6rem; margin: .2em 0 .25em; line-height: 1.2; }
.lkp h3 { font-size: 1.15rem; margin: 0 0 .75em; }
.lkp h4 { margin: 1.5em 0 .5em; }
.lkp-muted { color: var(--lkp-muted); }
.lkp-small { font-size: .9rem; margin: .75em 0 0; }
.lkp-back { color: var(--lkp-muted); text-decoration: none; font-size: .95rem; }
.lkp-back:hover { color: var(--lkp-accent); }

/* Cards & layout */
.lkp-card { background: #fff; border: 1px solid var(--lkp-line); border-radius: var(--lkp-radius); padding: 24px; margin-bottom: 20px; }
.lkp-head { display: flex; gap: 16px; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; margin-bottom: 20px; }
.lkp-head p { margin: 0; }
.lkp-empty { text-align: center; padding: 48px 24px; }
.lkp-view__grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 20px; }

/* Buttons */
.lkp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 18px; border-radius: 8px; border: 1px solid var(--lkp-line); background: #fff; color: var(--lkp-ink); font: inherit; font-weight: 600; font-size: .95rem; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s; line-height: 1.2; }
.lkp-btn:hover { border-color: var(--lkp-accent); color: var(--lkp-accent); }
.lkp-btn--primary { background: var(--lkp-accent); border-color: var(--lkp-accent); color: #fff; }
.lkp-btn--primary:hover { filter: brightness(1.1); color: #fff; }
.lkp-btn--ghost { background: transparent; border-color: transparent; }
.lkp-btn--ghost:hover { background: var(--lkp-soft); }
.lkp-btn--danger { color: var(--lkp-bad); }
.lkp-btn--danger:hover { border-color: var(--lkp-bad); color: var(--lkp-bad); }
.lkp-btn--block { width: 100%; }
.lkp-link { background: none; border: 0; color: var(--lkp-accent); cursor: pointer; font: inherit; padding: 0; text-decoration: underline; }
.lkp-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.lkp-actions--secondary { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--lkp-line); }
.lkp-actions--stack { flex-direction: column; align-items: stretch; }
.lkp-inline { display: inline; margin: 0; }
.lkp-actions--stack .lkp-inline { display: block; }

/* Notices & badges */
.lkp-notice { padding: 12px 16px; border-radius: 8px; margin-bottom: 20px; font-weight: 500; }
.lkp-notice--ok { background: #e6f4ea; color: #1d5c32; }
.lkp-notice--err { background: #fdecec; color: #8a1f1f; }
.lkp-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: .78rem; font-weight: 700; background: var(--lkp-soft); color: var(--lkp-muted); white-space: nowrap; }
.lkp-badge--ready { background: #e8f0fb; color: #1f4e79; }
.lkp-badge--sent { background: #fdf3e1; color: #8a5a12; }
.lkp-badge--signed { background: #e6f4ea; color: #1d5c32; }
.lkp-badge--cancelled { background: #fdecec; color: #8a1f1f; }

/* Login */
.lkp-auth { display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; align-items: center; }
.lkp-auth__intro h2 { font-size: 2rem; }
.lkp-ticks { list-style: none; padding: 0; margin: 1em 0 0; }
.lkp-ticks li { padding-left: 28px; position: relative; margin-bottom: .5em; }
.lkp-ticks li::before { content: ""; position: absolute; left: 0; top: .3em; width: 16px; height: 16px; border-radius: 50%; background: var(--lkp-accent); }
.lkp-ticks li::after { content: ""; position: absolute; left: 5px; top: .48em; width: 6px; height: 3px; border: solid #fff; border-width: 0 0 2px 2px; transform: rotate(-45deg); }
.lkp-auth__form #loginform p { margin: 0 0 14px; }
.lkp-auth__form #loginform label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: 4px; }
.lkp-auth__form #loginform input[type=text], .lkp-auth__form #loginform input[type=password] { width: 100%; }
.lkp-auth__form #loginform .login-remember label { font-weight: 400; display: flex; gap: 8px; align-items: center; }
.lkp-auth__form #wp-submit { width: 100%; padding: 12px; border-radius: 8px; border: 0; background: var(--lkp-accent); color: #fff; font-weight: 600; cursor: pointer; }
.lkp-hp { position: absolute; left: -9999px; }

/* Contract list */
.lkp-list { display: flex; flex-direction: column; gap: 10px; }
.lkp-row { display: grid; grid-template-columns: 96px 1fr auto; gap: 16px; align-items: center; padding: 16px 20px; background: #fff; border: 1px solid var(--lkp-line); border-radius: var(--lkp-radius); color: inherit; text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.lkp-row:hover { border-color: var(--lkp-accent); box-shadow: 0 2px 10px rgba(31, 41, 51, .06); }
.lkp-row__type { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--lkp-accent); }
.lkp-row__main { display: flex; flex-direction: column; min-width: 0; }
.lkp-row__main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lkp-row__main .lkp-muted { font-size: .88rem; }

/* Type picker */
.lkp-types { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
.lkp-type { display: flex; flex-direction: column; gap: 6px; text-align: left; padding: 24px; border: 1px solid var(--lkp-line); border-radius: var(--lkp-radius); background: #fff; cursor: pointer; font: inherit; color: inherit; transition: border-color .15s, transform .15s; }
.lkp-type:hover { border-color: var(--lkp-accent); transform: translateY(-2px); }
.lkp-type strong { font-size: 1.15rem; }
.lkp-type span:last-child { color: var(--lkp-muted); font-size: .95rem; }
.lkp-type__icon { width: 40px; height: 40px; border-radius: 10px; background: var(--lkp-soft); position: relative; margin-bottom: 8px; }
.lkp-type__icon::after { content: ""; position: absolute; inset: 10px; background: var(--lkp-accent); }
.lkp-type__icon--beboelse::after { clip-path: polygon(50% 0, 100% 45%, 85% 45%, 85% 100%, 15% 100%, 15% 45%, 0 45%); }
.lkp-type__icon--fremleje::after { clip-path: polygon(50% 0, 100% 45%, 85% 45%, 85% 100%, 55% 100%, 55% 60%, 45% 60%, 45% 100%, 15% 100%, 15% 45%, 0 45%); }
.lkp-type__icon--erhverv::after { clip-path: polygon(0 20%, 100% 20%, 100% 100%, 0 100%, 0 20%, 35% 20%, 35% 0, 65% 0, 65% 20%); }

/* Wizard */
.lkp-wizard__grid { display: grid; grid-template-columns: 250px 1fr; gap: 24px; align-items: start; }
.lkp-steps { position: sticky; top: 24px; }
.lkp-steps ol { list-style: none; margin: 0; padding: 0; }
.lkp-steps button { display: flex; gap: 12px; align-items: center; width: 100%; padding: 9px 10px; border: 0; border-radius: 8px; background: none; cursor: pointer; font: inherit; color: var(--lkp-muted); text-align: left; }
.lkp-steps button:hover { background: var(--lkp-soft); }
.lkp-steps button small { display: block; font-size: .75rem; opacity: .8; }
.lkp-steps button.is-current { background: var(--lkp-soft); color: var(--lkp-ink); font-weight: 600; }
.lkp-steps button.is-done .lkp-steps__n { background: var(--lkp-accent); color: #fff; border-color: var(--lkp-accent); }
.lkp-steps button.has-error .lkp-steps__n { border-color: var(--lkp-bad); color: var(--lkp-bad); }
.lkp-steps__n { flex: 0 0 28px; height: 28px; border-radius: 50%; border: 2px solid var(--lkp-line); display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 700; }
.lkp-panel__head { margin-bottom: 18px; }
.lkp-panel__head h3 { margin: 0; font-size: 1.35rem; }
.lkp-para { font-size: .8rem; font-weight: 700; color: var(--lkp-accent); letter-spacing: .04em; }
.lkp-panel__nav { display: flex; gap: 10px; justify-content: space-between; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--lkp-line); }
.lkp-panel__nav [data-lkp-save] { margin-left: auto; }
.lkp.js .lkp-panel { display: none; }
.lkp.js .lkp-panel.is-current { display: block; }

/* Fields */
.lkp-subhead { grid-column: 1 / -1; margin: 12px 0 -4px; padding-top: 14px; border-top: 1px solid var(--lkp-line); font-size: 1rem; }
.lkp-subhead:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.lkp-fields { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px 18px; }
.lkp-field { grid-column: span 6; min-width: 0; margin-bottom: 0; }
.lkp-w-half { grid-column: span 3; }
.lkp-w-third { grid-column: span 2; }
.lkp-field label, .lkp-field legend { display: block; font-weight: 600; font-size: .92rem; margin-bottom: 6px; padding: 0; }
.lkp-field fieldset { border: 0; padding: 0; margin: 0; }
.lkp input[type=text], .lkp input[type=email], .lkp input[type=tel], .lkp input[type=date], .lkp input[type=number], .lkp input[type=password], .lkp input:not([type]), .lkp select, .lkp textarea {
	width: 100%; padding: 10px 12px; border: 1px solid #cbd2d9; border-radius: 8px; background: #fff; font: inherit; color: inherit; min-height: 44px;
}
.lkp input:focus, .lkp select:focus, .lkp textarea:focus { outline: 2px solid color-mix(in srgb, var(--lkp-accent) 35%, transparent); border-color: var(--lkp-accent); }
.lkp-req { color: var(--lkp-bad); }
.lkp-help { font-size: .85rem; color: var(--lkp-muted); margin: 6px 0 0; }
.lkp-error { font-size: .85rem; color: var(--lkp-bad); margin: 6px 0 0; font-weight: 600; }
.lkp-field.has-error input, .lkp-field.has-error select, .lkp-field.has-error textarea { border-color: var(--lkp-bad); }
.lkp-options { display: flex; flex-wrap: wrap; gap: 8px; }
.lkp-option, .lkp-check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400 !important; cursor: pointer; }
.lkp-option { padding: 9px 14px; border: 1px solid var(--lkp-line); border-radius: 8px; }
.lkp-option:has(input:checked) { border-color: var(--lkp-accent); background: color-mix(in srgb, var(--lkp-accent) 7%, #fff); }
.lkp-option input, .lkp-check input { margin-top: 4px; accent-color: var(--lkp-accent); }
.lkp-field--checkboxes .lkp-options { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.lkp-field[hidden] { display: none; }

/* Summary */
.lkp-summary dl, .lkp-kv { margin: 0 0 20px; }
.lkp-summary dl > div, .lkp-kv > div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--lkp-line); }
.lkp-summary dt, .lkp-kv dt { color: var(--lkp-muted); }
.lkp-summary dd, .lkp-kv dd { margin: 0; font-weight: 600; text-align: right; }
.lkp-summary__total dt, .lkp-summary__total dd { color: var(--lkp-ink); font-size: 1.05rem; }

/* Signers */
.lkp-signers { list-style: none; margin: 0; padding: 0; }
.lkp-signers li { display: grid; grid-template-columns: 14px 1fr auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--lkp-line); }
.lkp-signers__dot { width: 10px; height: 10px; border-radius: 50%; background: var(--lkp-warn); }
.lkp-signers li.is-signed .lkp-signers__dot { background: var(--lkp-ok); }
.lkp-log { list-style: none; margin: 0; padding: 0; font-size: .88rem; max-height: 320px; overflow: auto; }
.lkp-log li { padding: 6px 0; border-bottom: 1px solid var(--lkp-line); }

/* Signing */
.lkp-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.lkp-signform { display: flex; flex-direction: column; gap: 16px; }
.lkp-sigpad { position: relative; border: 1px dashed #9aa5b1; border-radius: 8px; background: var(--lkp-soft); }
.lkp-sigpad canvas { display: block; width: 100%; height: 170px; touch-action: none; cursor: crosshair; }
.lkp-sigpad .lkp-link { position: absolute; right: 10px; bottom: 8px; font-size: .85rem; }
.lkp-done { width: 56px; height: 56px; margin: 0 auto 12px; border-radius: 50%; background: var(--lkp-ok); color: #fff; font-size: 28px; line-height: 56px; }

@media (max-width: 820px) {
	.lkp-wizard__grid, .lkp-view__grid, .lkp-auth, .lkp-sign { grid-template-columns: 1fr; }
	.lkp-steps { position: static; overflow-x: auto; }
	.lkp-steps ol { display: flex; gap: 4px; }
	.lkp-steps button { white-space: nowrap; }
	.lkp-steps button > span:last-child { display: none; }
	.lkp-steps button.is-current > span:last-child { display: block; }
	.lkp-types { grid-template-columns: 1fr; }
	.lkp-w-half, .lkp-w-third { grid-column: span 6; }
	.lkp-row { grid-template-columns: 1fr auto; }
	.lkp-row__type { grid-column: 1 / -1; }
	.lkp-card { padding: 18px; }
	.lkp-panel__nav { flex-wrap: wrap; }
}
