/* noam-links order form options (2026-10-04). Loaded wherever order.js is. Uses the theme's tokens (style.css :root). */
.nlc-order .nlc-order__rules { position: relative; margin: 0; padding: 8px 12px; border-radius: var(--r-sm, 9px); background: var(--cream, #faf7f1); border: 1px solid var(--line, #e7dfcf); font-size: 14px; color: var(--ink-2, #443f38); }

.nlc-order input[type=date], .nlc-order select { min-height: 46px; }
.nlc-order .nlc-field input[type=date] { width: 100%; padding: 10px 14px; border: 1.5px solid var(--line, #e7dfcf); border-radius: var(--r-sm, 9px); font: 16px var(--font, inherit); background: #fff; color: var(--ink, #1c1a17); text-align: left; }
.nlc-order .nlc-field input[type=date]:focus { border-color: var(--red, #b81823); }
.nlc-order [aria-invalid=true] { border-color: var(--red, #b81823) !important; box-shadow: 0 0 0 3px var(--red-50, #fdf1f2); }
.nlc-order .nlc-check input[aria-invalid=true] { outline: 3px solid var(--red, #b81823); outline-offset: 2px; }

/* sub-panels under a radio (own article / writing brief / date) */
.nlc-order .nlc-sub { display: grid; gap: 12px; margin: 8px 0 4px; padding: 12px; border-inline-start: 3px solid var(--red-50, #fdf1f2); background: #fff; }
.nlc-order .nlc-sub[hidden] { display: none !important; }
.nlc-order .nlc-from { color: var(--muted, #6a6158); font-size: 13px; white-space: nowrap; }

/* extra links */
.nlc-order .nlc-links { display: grid; gap: 8px; }
.nlc-order .nlc-links [data-nlc-link-rows] { display: grid; gap: 10px; }
.nlc-order .nlc-links [data-nlc-link-rows]:empty { display: none; }
.nlc-order .nlc-linkrow { display: grid; gap: 8px; margin: 0; padding: 12px; border: 1.5px dashed var(--line, #e7dfcf); border-radius: var(--r-sm, 9px); min-width: 0; }
.nlc-order .nlc-linkrow legend { padding: 0 6px; font-weight: 700; font-size: 14px; }
.nlc-order .nlc-linkrow__del { justify-self: start; min-height: 44px; font-size: 14px; }
.nlc-order .nlc-addlink { justify-self: start; min-height: 44px; padding: 8px 16px; border: 1.5px dashed var(--red, #b81823); border-radius: 999px; background: #fff; color: var(--red, #b81823); font: 700 15px/1.2 var(--font, inherit); cursor: pointer; }
.nlc-order .nlc-links__note { color: var(--muted, #6a6158); font-size: 13px; }

/* checkboxes (add-ons, language) */
.nlc-order .nlc-check { display: flex; gap: 10px; align-items: flex-start; min-height: 44px; padding: 10px 12px; margin-top: 6px; border: 1.5px solid var(--line, #e7dfcf); border-radius: var(--r-sm, 9px); cursor: pointer; font-weight: 400; font-size: 15px; }
.nlc-order .nlc-check:has(input:checked) { border-color: var(--red, #b81823); background: var(--red-50, #fdf1f2); }
.nlc-order .nlc-check input { margin-top: 5px; width: 18px; height: 18px; flex-shrink: 0; accent-color: var(--red, #b81823); }
.nlc-order .nlc-check small { display: block; margin-top: 2px; color: var(--muted, #6a6158); font-size: 13px; }
.nlc-order .nlc-langok { border-color: var(--gold, #f2b134); background: #fff8e6; }

/* publish: two radios side by side */
.nlc-order .nlc-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.nlc-order .nlc-seg .nlc-radio { margin-top: 6px; min-height: 44px; align-items: center; }
.nlc-order .nlc-seg .nlc-radio input { margin-top: 0; }

/* running total, itemised */
.nlc-order .nlc-order__total { display: block; padding: 12px 16px; }
.nlc-order__parts { display: grid; gap: 2px; margin: 0 0 6px; padding: 0 0 6px; border-bottom: 1px solid rgba(255, 255, 255, .18); font-size: 14px; }
.nlc-order__parts div { display: flex; justify-content: space-between; gap: 12px; }
.nlc-order__parts div[hidden] { display: none !important; }
.nlc-order__parts dt { opacity: .85; }
.nlc-order__parts dd { margin: 0; font-weight: 700; }
.nlc-order__sum { display: flex; justify-content: space-between; align-items: center; margin: 0; }
.nlc-order__sum strong { font-size: 24px; }

/* two submit buttons; buy-now mode moves "קנייה מהירה" first IN THE DOM (order.js), so the visual and Tab order agree */
.nlc-order__btns { display: flex; flex-direction: column; gap: 8px; }
.nlc-order__btns .nlc-btn { min-height: 48px; }

@media (max-width: 420px) {
	.nlc-order .nlc-seg { grid-template-columns: 1fr; }
	.nlc-order .nlc-sub { padding: 10px 8px; }
}

/* The order card on /site/ pages grew taller than a screen with the options: a sticky aside would hide its own
   submit buttons behind the fold while the main column scrolls, so the card scrolls with the page. */
.nlc-site-page .nlc-site-side { position: static; }
.nlc-order .nlc-nowrap { white-space: nowrap; }

/* ---------------------------------------------------------------- motion (design-system/MASTER.md, Emil) */
/* The order dialog (inc/order-form.php, data-nlc-dialog) enters from scale .96 + opacity over 240ms on --ease-out and
   leaves faster (170ms); it stays centred (a modal is not anchored to its trigger). @starting-style gives the entry
   frame; overlay/display allow-discrete keep it painted while it leaves. The theme's .nlc-dlg box is not changed. */
dialog.nlc-dlg[data-nlc-dialog] {
	--nlc-ord-ease: var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
	transform-origin: center;
	opacity: 0;
	transform: scale(0.96);
	transition: opacity 170ms var(--nlc-ord-ease), transform 170ms var(--nlc-ord-ease), overlay 170ms allow-discrete, display 170ms allow-discrete;
}
dialog.nlc-dlg[data-nlc-dialog][open] { opacity: 1; transform: none; transition-duration: 240ms; }
dialog.nlc-dlg[data-nlc-dialog]::backdrop { opacity: 0; transition: opacity 170ms var(--nlc-ord-ease), overlay 170ms allow-discrete, display 170ms allow-discrete; }
dialog.nlc-dlg[data-nlc-dialog][open]::backdrop { opacity: 1; transition-duration: 240ms; }
@starting-style {
	dialog.nlc-dlg[data-nlc-dialog][open] { opacity: 0; transform: scale(0.96); }
	dialog.nlc-dlg[data-nlc-dialog][open]::backdrop { opacity: 0; }
}

/* Press feedback on every pressable element of the form and the dialog: scale .97 over 160ms; colours stay 150ms. */
.nlc-order :is(.nlc-btn, .nlc-addlink, .nlc-linkbtn),
[data-nlc-dialog] :is(.nlc-dlg__x, .nlc-btn, .nlc-linkbtn),
.nlc-ok .nlc-btn {
	transition: transform 160ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)), background-color 150ms, border-color 150ms, color 150ms;
}
.nlc-order :is(.nlc-btn, .nlc-addlink, .nlc-linkbtn):active:not([disabled]),
[data-nlc-dialog] :is(.nlc-dlg__x, .nlc-btn, .nlc-linkbtn):active:not([disabled]),
.nlc-ok .nlc-btn:active { transform: scale(0.97); }
.nlc-order .nlc-linkbtn, [data-nlc-dialog] .nlc-linkbtn { display: inline-block; }

/* Hover only with a real pointer (no sticky hover on touch). */
@media (hover: hover) and (pointer: fine) {
	.nlc-order .nlc-addlink:hover { background: var(--red-50, #fdf1f2); }
}

/* Reduced motion: the dialog only fades (no scale), presses do not move. */
@media (prefers-reduced-motion: reduce) {
	dialog.nlc-dlg[data-nlc-dialog], dialog.nlc-dlg[data-nlc-dialog][open] {
		transform: none;
		transition: opacity 150ms linear, overlay 150ms allow-discrete, display 150ms allow-discrete;
	}
	@starting-style {
		dialog.nlc-dlg[data-nlc-dialog][open] { transform: none; opacity: 0; }
	}
	.nlc-order :is(.nlc-btn, .nlc-addlink, .nlc-linkbtn):active:not([disabled]),
	[data-nlc-dialog] :is(.nlc-dlg__x, .nlc-btn, .nlc-linkbtn):active:not([disabled]),
	.nlc-ok .nlc-btn:active { transform: none; }
}