/* ============================================================================
   Norquest Work Orders — additions on top of the knowledge base's nq.css.
   Same tokens, same rules: one red for action, 3px corners, tinted shadows.
   ========================================================================== */

/* ------------------------------------------------------------- top nav */

/* nq.css gives .btn a display value, which would beat the hidden attribute. */
[hidden] { display: none !important; }

.shell__spacer { flex: 1 1 auto; }
.topnav { display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: 4px; margin-left: 8px; }
.topnav__link {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 7px 12px; border-radius: var(--nq-radius);
	font-size: .88rem; font-weight: 600; color: var(--nq-ink);
}
.topnav__link:hover { background: var(--nq-surface); color: var(--nq-red); text-decoration: none; }
.topnav__link.is-active { background: var(--nq-red-wash); color: var(--nq-red-dark); }
@media (max-width: 760px) {
	.shell__wordmark { display: none; }
	.topnav { order: 3; flex-basis: 100%; margin-left: 0; }
}

.subnav { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--nq-line); margin-bottom: 24px; }
.subnav__link {
	padding: 9px 14px; margin-bottom: -1px; font-size: .9rem; font-weight: 600; color: var(--nq-ink-soft);
	border-bottom: 3px solid transparent;
}
.subnav__link:hover { color: var(--nq-red); text-decoration: none; }
.subnav__link.is-active { color: var(--nq-ink); border-bottom-color: var(--nq-red); }

/* ---------------------------------------------------------------- misc */

.auth-title { font-size: 1.4rem; }
.narrow { max-width: 620px; }
.muted-ink { color: var(--nq-ink-soft); }
.hint-inline { font-weight: 300; color: var(--nq-ink-soft); font-size: .82rem; }
.mt-1 { margin-top: 4px; }
.error-list { margin: 6px 0 0; padding-left: 20px; }
.form-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.section-head h2 { margin: 0; }
.plain-list { list-style: none; margin: 0; padding: 0; }
.plain-list li + li { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--nq-line); }
.linklike {
	background: none; border: 0; padding: 0; font: inherit; color: var(--nq-red); cursor: pointer;
}
.linklike:hover { color: var(--nq-red-dark); text-decoration: underline; }
.linklike--danger { font-size: .82rem; font-weight: 600; }

.check-inline {
	display: inline-flex; align-items: center; gap: 7px;
	font-weight: 300; font-size: .88rem; color: var(--nq-ink); margin: 8px 14px 0 0; cursor: pointer;
}
.check-inline input { accent-color: var(--nq-red); margin: 0; }

input[type=date] {
	width: 100%; padding: 10px 13px; font-family: inherit; font-size: .95rem; font-weight: 300; color: var(--nq-ink);
	background: var(--nq-white); border: 1px solid var(--nq-line); border-radius: var(--nq-radius);
}
input[type=date]:focus { outline: none; border-color: var(--nq-red); box-shadow: 0 0 0 3px rgba(238, 45, 36, .12); }
input[readonly] { background: var(--nq-surface); color: var(--nq-ink-soft); }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }

/* ------------------------------------------------------------- filters */

.filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 18px; }
.filters input[type=search] { flex: 1 1 240px; width: auto; }
.filters select { width: auto; min-width: 170px; }
.segmented { display: inline-flex; border: 1px solid var(--nq-line); border-radius: var(--nq-radius); overflow: hidden; }
.segmented__btn { padding: 9px 14px; font-size: .88rem; font-weight: 600; color: var(--nq-ink-soft); background: var(--nq-white); }
.segmented__btn + .segmented__btn { border-left: 1px solid var(--nq-line); }
.segmented__btn:hover { background: var(--nq-surface); color: var(--nq-ink); text-decoration: none; }
.segmented__btn.is-active { background: var(--nq-red-wash); color: var(--nq-red-dark); }

.wo-num { font-weight: 700; font-variant-numeric: tabular-nums; }
.wo-title { font-variant-numeric: tabular-nums; }
.wo-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; color: var(--nq-ink-soft); font-size: .9rem; margin: 0; }

/* ----------------------------------------------------------- the form */

.wo-line {
	position: relative;
	background: var(--nq-white); border: 1px solid var(--nq-line); border-radius: var(--nq-radius);
	box-shadow: var(--nq-shadow-sm); padding: 18px 22px 20px; margin-bottom: 16px;
}
.wo-line__legend {
	float: left; width: 100%; margin: 0 0 12px; padding: 0;
	font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--nq-ink-soft);
}
.wo-line__remove { position: absolute; top: 12px; right: 14px; }
.wo-line__grid { clear: both; display: grid; grid-template-columns: 90px 1fr 1fr 110px; gap: 0 16px; }
.wo-line__grid--3 { grid-template-columns: repeat(3, 1fr); }
.wo-line .field { margin-bottom: 14px; }
@media (max-width: 760px) {
	.wo-line__grid, .wo-line__grid--3 { grid-template-columns: 1fr 1fr; }
}

.connections { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
@media (max-width: 860px) { .connections { grid-template-columns: 1fr; } }
.connection { background: var(--nq-surface); border-radius: var(--nq-radius); padding: 12px 14px; }
.connection__end { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--nq-ink); }
.connection__boxpin { display: inline-flex; margin-left: 12px; }
.connection__boxpin .check-inline { margin-top: 0; }
.connection__picks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 8px; }
.connection__picks select { padding: 8px 30px 8px 10px; font-size: .88rem; }
.mini-label { display: block; font-size: .78rem; font-weight: 600; color: var(--nq-ink-soft); margin-bottom: 3px; }

/* --------------------------------------------------------- read-only view */

.facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px 22px; margin: 0; }
.facts dt { font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--nq-ink-soft); }
.facts dd { margin: 2px 0 0; color: var(--nq-ink); }
.facts--tight { gap: 10px 18px; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.chip--rush { background: var(--nq-red-wash); color: var(--nq-red-dark); border-color: #f7cfcd; }

.wo-line--view { padding: 16px 20px; }
.wo-line__head { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; margin-bottom: 8px; color: var(--nq-ink); }
.wo-line__no { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--nq-ink-soft); }
.wo-line__desc { white-space: pre-line; margin: 0 0 12px; color: var(--nq-ink); }

/* --------------------------------------------------- revision request */

.request-card { border-top: 3px solid var(--nq-amber); }
.quote { margin: 0 0 16px; padding: 10px 14px; background: var(--nq-surface); border-radius: var(--nq-radius); white-space: pre-line; color: var(--nq-ink); }
.table--diff td { padding: 9px 12px; }
.diff-from { color: var(--nq-ink-soft); text-decoration: line-through; text-decoration-color: rgba(200, 28, 20, .45); }
.diff-to { color: var(--nq-ink); font-weight: 700; background: var(--nq-green-wash); }

.history { list-style: none; margin: 0; padding: 0; }
.history li { padding: 8px 0; border-bottom: 1px solid var(--nq-line); font-size: .9rem; color: var(--nq-ink); }
.history li:last-child { border-bottom: 0; }
.history__when { display: block; font-size: .78rem; color: var(--nq-ink-soft); font-variant-numeric: tabular-nums; }
.history__note { margin-top: 3px; color: var(--nq-olive); white-space: pre-line; }

/* --------------------------------------------------------------- people */

.person { border: 1px solid var(--nq-line); border-radius: var(--nq-radius); margin-bottom: 8px; }
.person > summary {
	display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center;
	padding: 11px 14px; cursor: pointer; list-style: none;
}
.person > summary::-webkit-details-marker { display: none; }
.person[open] > summary { border-bottom: 1px solid var(--nq-line); background: var(--nq-surface); }
.person__last { margin-left: auto; font-size: .8rem; color: var(--nq-ink-soft); }
.person__form { padding: 16px 14px 14px; }
.person__form label input, .person__form label select { margin-top: 6px; font-weight: 300; }

/* -------------------------------------------------------------- admin */

.status-rows { display: grid; gap: 6px; }
.status-row {
	display: grid; grid-template-columns: minmax(150px, 1.4fr) 120px 80px 80px 70px 60px minmax(200px, 1.6fr);
	gap: 10px; align-items: center;
}
.status-row--head { font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--nq-ink-soft); }
.status-row input[type=text], .status-row input[type=number], .status-row select { padding: 8px 10px; }
.status-row .check-inline { margin: 0; justify-content: center; }
@media (max-width: 900px) {
	.status-row { grid-template-columns: 1fr 1fr; }
	.status-row--head { display: none; }
}

.pick-list { list-style: none; margin: 0; padding: 0; max-height: 420px; overflow-y: auto; }
.pick-list li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--nq-line); color: var(--nq-ink); }
.pick-list form { margin: 0; }

.access-log { list-style: none; margin: 6px 0 0; padding: 0; font-size: .8rem; color: var(--nq-ink-soft); }
.person__form--split { border-top: 1px solid var(--nq-line); }

.email-body { white-space: pre-wrap; padding: 18px 22px; font-family: ui-monospace, Consolas, monospace; font-size: .85rem; color: var(--nq-ink); }

/* --------------------------------------------- size / weight combo fields */
.connection__picks input[type=text] { padding: 8px 10px; font-size: .88rem; }
.weight-hint { grid-column: 1 / -1; margin: 2px 0 0; font-size: .8rem; color: var(--nq-amber); }
.weight-hint:empty { display: none; }
.pill--tiny { padding: 1px 6px; font-size: .62rem; vertical-align: 1px; }
.conn-values { overflow-wrap: anywhere; }
.list-chip { display: inline-flex; align-items: center; gap: 4px; margin: 0 6px 6px 0; padding: 3px 4px 3px 9px;
	border: 1px solid var(--nq-line); border-radius: var(--nq-radius); font-size: .85rem; color: var(--nq-ink); background: var(--nq-white); }
.list-chip.is-retired { color: var(--nq-ink-soft); text-decoration: line-through; background: var(--nq-surface); }
.list-chip form { display: inline; margin: 0; }
.list-chip button { border: 0; background: none; cursor: pointer; color: var(--nq-ink-soft); font-size: .78rem; padding: 0 4px; }
.list-chip button:hover { color: var(--nq-red); }
.size-row { padding: 12px 0; border-bottom: 1px solid var(--nq-line); }
.size-row__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 8px; }
.size-row__add { display: inline-flex; gap: 6px; }
.size-row__add input { width: 110px; padding: 6px 8px; font-size: .85rem; }
input.sort-input { width: 72px; padding: 4px 6px; font-size: .85rem; }
.size-row__head .inline-form { display: inline-flex; align-items: center; gap: 4px; }
.size-row__add input.w-160 { width: 160px; }
.size-row__add input.w-220 { width: 220px; }
