/* Nordic Movers – flytteformular. Neutral, brandbar via --nml-accent. */

.nml-form-root {
	--nml-accent: #1a1a1a;        /* knapper – kan overstyres pr. forretning */
	--nml-text: #1d2327;
	--nml-muted: #50575e;         /* 7:1 mod hvid */
	--nml-border: #8c8f94;        /* 3:1 mod hvid (WCAG 1.4.11) */
	--nml-bg-soft: #f6f7f7;
	--nml-error: #b32d2e;         /* 5.9:1 mod hvid */
	--nml-ok: #1e7a34;
	--nml-radius: 4px;
	max-width: 720px;
	margin: 0 auto;
	color: var(--nml-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.55;
}
.nml-embed-body { margin: 0; padding: 24px 16px; background: #fff; }

.nml-form-root h2 { font-size: 1.75rem; line-height: 1.2; margin: 0 0 1rem; }
.nml-form-root h3 { font-size: 1.15rem; margin: 1.5rem 0 .5rem; }
.nml-form-root h2:focus, .nml-form-root h3:focus { outline: none; }

.nml-legend-note { color: var(--nml-muted); margin: 0 0 .75rem; }
.nml-req { color: var(--nml-error); text-decoration: none; border: 0; }

.nml-progress {
	height: 8px; background: #e0e0e0; border-radius: 999px; overflow: hidden; margin-bottom: 2rem;
}
.nml-progress-bar { height: 100%; background: var(--nml-ok); border-radius: 999px; transition: width .3s ease; }
@media (prefers-reduced-motion: reduce) { .nml-progress-bar { transition: none; } }

.nml-field { margin: 0 0 1.25rem; }
.nml-field label, .nml-choices legend { font-weight: 600; display: block; margin-bottom: .35rem; }
.nml-field input:not([type=checkbox]):not([type=radio]),
.nml-field select,
.nml-field textarea {
	width: 100%; box-sizing: border-box;
	padding: .65rem .75rem;
	border: 1px solid var(--nml-border);
	border-radius: var(--nml-radius);
	background: var(--nml-bg-soft);
	font: inherit; color: var(--nml-text);
	min-height: 44px;
}
.nml-field textarea { min-height: 120px; }

.nml-form-root :focus-visible {
	outline: 3px solid #1d4ed8;
	outline-offset: 2px;
	border-radius: 2px;
}

.nml-choices { border: 0; padding: 0; margin: 0 0 1.5rem; }
.nml-choice { display: flex; align-items: flex-start; gap: .6rem; margin: .35rem 0; }
.nml-choice input { width: 22px; height: 22px; margin-top: .15rem; accent-color: var(--nml-accent); flex: none; }
.nml-choice label { font-weight: 400; margin: 0; }
.nml-single-check { margin: 0 0 .75rem; }
.nml-single-check label { font-weight: 600; }

.nml-hint { color: var(--nml-muted); font-size: .95rem; margin: .25rem 0 1rem; }

.nml-error { color: var(--nml-error); font-weight: 600; margin: .35rem 0 0; }
[aria-invalid="true"] { border-color: var(--nml-error) !important; }
.nml-error-summary {
	border: 2px solid var(--nml-error); border-radius: var(--nml-radius);
	padding: 1rem 1.25rem; margin: 0 0 1.5rem; background: #fdf2f2;
}
.nml-error-summary h3 { margin: 0 0 .5rem; font-size: 1.05rem; color: var(--nml-error); }
.nml-error-summary a { color: var(--nml-error); }

.nml-btn {
	background: var(--nml-accent); color: #fff; border: 2px solid var(--nml-accent);
	border-radius: var(--nml-radius); padding: .7rem 1.4rem; font: inherit; font-weight: 600;
	cursor: pointer; min-height: 44px;
}
.nml-btn:hover { filter: brightness(1.2); }
.nml-btn[disabled] { opacity: .6; cursor: default; }
.nml-btn-secondary { background: #fff; color: var(--nml-accent); }
.nml-btn-link {
	background: none; border: 0; padding: .25rem; cursor: pointer; font: inherit;
	color: var(--nml-error); text-decoration: underline; min-height: 44px;
}
.nml-nav { display: flex; justify-content: space-between; gap: 1rem; margin-top: 2rem; flex-wrap: wrap; }
.nml-nav .nml-btn:only-child { margin-left: auto; }

.nml-room { border: 1px solid var(--nml-border); border-radius: var(--nml-radius); padding: 1rem 1.25rem; margin: 0 0 1.25rem; background: #fff; }
.nml-room-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.nml-room-head h3 { margin: 0; }
.nml-add-room { display: flex; gap: .75rem; flex-wrap: wrap; margin: 1rem 0; }
.nml-add-room select { min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--nml-border); border-radius: var(--nml-radius); font: inherit; }



.nml-resume ul { padding-left: 1.2rem; }
.nml-terms { background: var(--nml-bg-soft); border-radius: var(--nml-radius); padding: 1rem 1.25rem; margin: 1.5rem 0; }
.nml-accept { margin: 1.25rem 0; }
.nml-consent { margin: 1.5rem 0 .5rem; }
.nml-consent label { font-weight: 400; }

.nml-receipt { border: 2px solid var(--nml-ok); border-radius: var(--nml-radius); padding: 1.5rem; background: #f2faf4; }
.nml-receipt h2 { color: var(--nml-ok); }

.nml-files { border-top: 1px dashed var(--nml-border); margin-top: 1rem; padding-top: .75rem; }
.nml-files h4 { margin: 0 0 .25rem; font-size: 1rem; }
.nml-file-list { list-style: none; padding: 0; margin: .5rem 0; }
.nml-file { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; padding: .4rem 0; border-bottom: 1px solid #ececec; }
.nml-file-name { overflow-wrap: anywhere; }
.nml-file progress { flex: 1; min-width: 120px; height: 10px; accent-color: var(--nml-ok); }
.nml-file-status { font-weight: 600; white-space: nowrap; }
.nml-file-done { color: var(--nml-ok); }
.nml-file-error { color: var(--nml-error); }
.nml-file-pick { position: relative; display: inline-block; margin-top: .25rem; }
.nml-file-input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.nml-file-label { display: inline-block; cursor: pointer; }
.nml-file-input:focus-visible + .nml-file-label { outline: 3px solid #1d4ed8; outline-offset: 2px; }

/* Adressegruppe: titel + diskret landevælger på én linje, derunder enten combobox (Danmark) eller tre felter (udland) */
.nml-addr-group { margin: 0 0 1.25rem; }
.nml-addr-group .nml-field { margin-bottom: .75rem; }
.nml-addr-group .nml-addr-combo { margin-bottom: 0; }
.nml-addr-head { display: flex; justify-content: space-between; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: .35rem; }
.nml-addr-title { font-weight: 600; }
.nml-addr-land { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; color: var(--nml-muted); }
.nml-addr-land label { font-weight: 400; margin: 0; }
.nml-addr-land-select {
	font: inherit; font-size: .9rem; color: var(--nml-text); background: #fff;
	border: 1px solid var(--nml-border); border-radius: var(--nml-radius);
	min-height: 36px; padding: .25rem 1.6rem .25rem .5rem; max-width: 14rem;
}
.nml-addr-foreign .nml-addr-row { display: flex; gap: .75rem; }
.nml-addr-foreign .nml-addr-row .nml-field { flex: 1 1 0; min-width: 0; }
.nml-addr-foreign .nml-addr-row .nml-field:first-child { flex: 0 1 9rem; }
.nml-addr-note { color: var(--nml-error); margin-top: .35rem; }
@media (max-width: 480px) { .nml-addr-foreign .nml-addr-row { flex-direction: column; gap: 0; } .nml-addr-foreign .nml-addr-row .nml-field:first-child { flex: 1 1 auto; } }
.nml-addr-combo { position: relative; }
.nml-addr-list {
	position: absolute; z-index: 20; left: 0; right: 0; margin: 0; padding: 0; list-style: none;
	background: #fff; border: 1px solid var(--nml-border); border-radius: var(--nml-radius);
	box-shadow: 0 4px 12px rgba(0,0,0,.15); max-height: 260px; overflow-y: auto;
}
.nml-addr-list li { padding: .55rem .75rem; cursor: pointer; border-bottom: 1px solid #ececec; }
.nml-addr-list li:last-child { border-bottom: 0; }
.nml-addr-list li:hover, .nml-addr-list li.nml-addr-active { background: var(--nml-bg-soft); outline: 2px solid #1d4ed8; outline-offset: -2px; }

.nml-hp { position: absolute !important; left: -9999px !important; height: 1px; overflow: hidden; }
.screen-reader-text {
	position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

@media (max-width: 600px) {
	.nml-form-root h2 { font-size: 1.4rem; }
	.nml-nav { flex-direction: column-reverse; }
	.nml-nav .nml-btn { width: 100%; }
}

.nml-resume-note { margin: 0 0 1rem; padding: .75rem 1rem; border-left: 4px solid var(--nml-brand, #1a1a1a); background: var(--nml-bg-soft, #f6f7f7); }
.nml-resume-note .nml-btn-link { display: inline; padding: 0; min-height: 0; text-decoration: underline; }

/* Kompakt møbelliste */
.nml-furniture-list { list-style: none; margin: .5rem 0 .75rem; padding: 0; }
.nml-furniture-item { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .45rem 0; border-bottom: 1px solid var(--nml-border); }
.nml-furniture-main { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .6rem; min-width: 0; }
.nml-furniture-name { font-weight: 600; }
.nml-furniture-qty { font-weight: 600; color: var(--nml-accent); }
.nml-furniture-dims { color: var(--nml-muted); font-size: .95rem; }
.nml-furniture-actions { display: flex; gap: .25rem; flex: none; }
.nml-btn-icon {
	background: none; border: 1px solid transparent; border-radius: var(--nml-radius); cursor: pointer;
	width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; color: var(--nml-text);
}
.nml-btn-icon:hover { background: var(--nml-bg-soft, #f4f4f4); border-color: var(--nml-border); }
.nml-btn-icon-danger { color: var(--nml-error); }
.nml-room-add { margin: .25rem 0 1rem; }
.nml-dims { display: flex; flex-wrap: wrap; gap: .75rem; }
.nml-dim { display: flex; flex-direction: column; gap: .2rem; flex: 1 1 90px; }
.nml-dim label { font-size: .9rem; color: var(--nml-muted); }
.nml-dim input { min-height: 44px; padding: .5rem .6rem; border: 1px solid var(--nml-border); border-radius: var(--nml-radius); font: inherit; width: 100%; box-sizing: border-box; }

/* Modal */
.nml-modal-backdrop {
	position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 100000;
	display: flex; align-items: center; justify-content: center; padding: 1rem; box-sizing: border-box;
}
.nml-modal {
	background: #fff; color: var(--nml-text); border-radius: var(--nml-radius); width: 100%; max-width: 480px;
	max-height: calc(100vh - 2rem); overflow: auto; padding: 1.5rem; box-sizing: border-box; box-shadow: 0 12px 40px rgba(0,0,0,.3);
}
.nml-modal h3 { margin: 0 0 1rem; }
.nml-modal .nml-field { margin-bottom: 1rem; }
.nml-modal select { width: 100%; min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--nml-border); border-radius: var(--nml-radius); font: inherit; box-sizing: border-box; }
.nml-modal-dims-label { margin: 0 0 .4rem; font-weight: 600; }
.nml-modal-dims { margin-bottom: 1rem; }
.nml-modal-actions { display: flex; justify-content: flex-end; gap: .75rem; flex-wrap: wrap; margin-top: 1.25rem; }
.nml-qty { display: inline-flex; align-items: stretch; border: 1px solid var(--nml-border); border-radius: var(--nml-radius); overflow: hidden; }
.nml-qty input { width: 72px; text-align: center; border: 0; border-left: 1px solid var(--nml-border); border-right: 1px solid var(--nml-border); font: inherit; min-height: 44px; -moz-appearance: textfield; }
.nml-qty input::-webkit-outer-spin-button, .nml-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.nml-qty-btn { background: #fff; border: 0; width: 44px; font-size: 1.25rem; cursor: pointer; color: var(--nml-text); }
.nml-qty-btn:hover { background: var(--nml-bg-soft, #f4f4f4); }
@media (prefers-reduced-motion: no-preference) { .nml-modal { animation: nml-pop .15s ease-out; } }
@keyframes nml-pop { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
