/*
 * JEDI Security — Dossier Intake portal
 * Scoped to .jdi-portal. Transparent outer background so the site's existing Matrix
 * animation shows through; no fonts or assets are loaded from third parties.
 */

.jdi-portal {
	--jdi-bg: rgba(4, 8, 6, 0.80);
	--jdi-panel: rgba(10, 16, 13, 0.78);
	--jdi-panel-strong: rgba(6, 11, 9, 0.92);
	--jdi-line: rgba(0, 255, 102, 0.28);
	--jdi-line-soft: rgba(255, 255, 255, 0.14);
	--jdi-green: #00ff66;
	--jdi-green-ink: #39ff88;
	--jdi-green-glow: rgba(0, 255, 102, 0.35);
	--jdi-violet: #b794ff;
	--jdi-violet-glow: rgba(183, 148, 255, 0.30);
	--jdi-text: #f3f7f4;
	--jdi-muted: #b3c2b9;
	--jdi-danger: #ff7a8a;
	--jdi-warn: #ffd166;
	--jdi-radius: 10px;
	--jdi-mono: ui-monospace, "SFMono-Regular", "JetBrains Mono", "Fira Code", "Cascadia Mono", Menlo, Consolas, "Liberation Mono", monospace;
	--jdi-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	box-sizing: border-box;
	color: var(--jdi-text);
	font-family: var(--jdi-sans);
	font-size: 1rem;
	line-height: 1.6;
	max-width: 1120px;
	margin: 0 auto;
	padding: clamp(0.75rem, 2vw, 1.5rem) 0;
}

.jdi-portal *,
.jdi-portal *::before,
.jdi-portal *::after { box-sizing: inherit; }

.jdi-portal [hidden] { display: none !important; }

.jdi-sr {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}

.jdi-portal:not(.jdi-js) .jdi-js-only { display: none !important; }
.jdi-portal.jdi-js .jdi-nojs-only { display: none !important; }

/* ---------- Hero ---------- */
.jdi-hero {
	background: var(--jdi-bg);
	border: 1px solid var(--jdi-line);
	border-radius: var(--jdi-radius);
	padding: clamp(1.25rem, 3vw, 2rem);
	margin-bottom: 1.5rem;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.4), 0 0 32px rgba(0, 255, 102, 0.08) inset;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	position: relative;
	overflow: hidden;
}
.jdi-hero::before {
	content: "";
	position: absolute; inset: 0 auto auto 0;
	width: 100%; height: 2px;
	background: linear-gradient(90deg, var(--jdi-green), var(--jdi-violet) 70%, transparent);
	opacity: 0.8;
}
.jdi-kicker {
	font-family: var(--jdi-mono);
	font-size: 0.8rem;
	letter-spacing: 0.14em;
	color: var(--jdi-green-ink);
	margin: 0 0 0.5rem;
	text-shadow: 0 0 10px var(--jdi-green-glow);
}
.jdi-title {
	font-family: var(--jdi-mono);
	font-size: clamp(1.35rem, 3.4vw, 2rem);
	line-height: 1.25;
	margin: 0 0 0.75rem;
	color: var(--jdi-text);
}
.jdi-lead { margin: 0 0 0.5rem; color: var(--jdi-text); max-width: 70ch; }
.jdi-motto {
	margin: 0;
	font-family: var(--jdi-mono);
	font-size: 0.85rem;
	color: var(--jdi-violet);
}
.jdi-jump { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; margin-top: 1rem; }
.jdi-jump a {
	color: var(--jdi-green-ink);
	font-family: var(--jdi-mono);
	font-size: 0.85rem;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- Generic panels ---------- */
.jdi-panel,
.jdi-section {
	background: var(--jdi-panel);
	border: 1px solid var(--jdi-line-soft);
	border-radius: var(--jdi-radius);
	padding: clamp(1rem, 2.5vw, 1.75rem);
	margin-bottom: 1.5rem;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
#jdi-submit.jdi-section { background: transparent; border: 0; padding: 0; backdrop-filter: none; -webkit-backdrop-filter: none; }

.jdi-section-title,
.jdi-panel-title {
	display: flex; align-items: center; gap: 0.6rem;
	font-family: var(--jdi-mono);
	font-size: 1.15rem;
	margin: 0 0 1rem;
	color: var(--jdi-text);
}
.jdi-panel-title { color: var(--jdi-green-ink); }
.jdi-icon { width: 1.4em; height: 1.4em; flex: none; }

/* ---------- Category grid ---------- */
.jdi-grid {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 0.9rem;
}
.jdi-grid li { margin: 0; padding: 0; }
.jdi-card {
	display: flex; flex-direction: column; gap: 0.45rem;
	height: 100%;
	padding: 1.1rem 1rem 1rem;
	background: var(--jdi-panel);
	border: 1px solid var(--jdi-line);
	border-radius: var(--jdi-radius);
	color: var(--jdi-text) !important;
	text-decoration: none !important;
	position: relative;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background-color .18s ease;
}
.jdi-card:hover {
	border-color: var(--jdi-green);
	box-shadow: 0 0 0 1px var(--jdi-green-glow), 0 0 22px var(--jdi-green-glow);
	transform: translateY(-2px);
}
.jdi-card.is-active {
	border-color: var(--jdi-green);
	background: rgba(0, 255, 102, 0.08);
	box-shadow: 0 0 0 2px var(--jdi-green), 0 0 26px var(--jdi-green-glow);
}
.jdi-card.is-active::before {
	content: "";
	position: absolute; left: 12px; right: 12px; top: -1px; height: 3px;
	border-radius: 0 0 3px 3px;
	background: var(--jdi-violet);
	box-shadow: 0 0 12px var(--jdi-violet-glow);
}
.jdi-card-icon { color: var(--jdi-green-ink); }
.jdi-card-icon .jdi-icon { width: 30px; height: 30px; }
.jdi-card-title { font-family: var(--jdi-mono); font-weight: 700; font-size: 1rem; line-height: 1.3; }
.jdi-card-desc { color: var(--jdi-muted); font-size: 0.9rem; flex: 1; }
.jdi-card-action { font-family: var(--jdi-mono); font-size: 0.82rem; color: var(--jdi-green-ink); letter-spacing: 0.04em; }
.jdi-card .jdi-when-active { display: none; }
.jdi-card.is-active .jdi-when-active { display: inline; color: var(--jdi-violet); }
.jdi-card.is-active .jdi-when-idle { display: none; }

/* ---------- Forms ---------- */
.jdi-form-panel { border-color: var(--jdi-line); box-shadow: 0 0 28px rgba(0, 255, 102, 0.06); }
.jdi-fieldset {
	border: 1px solid var(--jdi-line-soft);
	border-radius: var(--jdi-radius);
	padding: 1rem clamp(0.75rem, 2vw, 1.25rem) 0.5rem;
	margin: 0 0 1.25rem;
	min-width: 0;
}
.jdi-fieldset legend {
	font-family: var(--jdi-mono);
	font-size: 0.85rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--jdi-violet);
	padding: 0 0.4rem;
}
.jdi-field { margin: 0 0 1.1rem; }
.jdi-field label,
.jdi-nojs-only label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.3rem;
	color: var(--jdi-text);
}
.jdi-req { font-weight: 400; font-size: 0.85em; color: var(--jdi-warn); }
.jdi-help { color: var(--jdi-muted); font-size: 0.9rem; margin: 0 0 0.5rem; }

.jdi-portal input[type="text"],
.jdi-portal input[type="email"],
.jdi-portal input[type="password"],
.jdi-portal input[type="date"],
.jdi-portal input[type="file"],
.jdi-portal select,
.jdi-portal textarea {
	width: 100%;
	max-width: 100%;
	font: inherit;
	font-size: 16px; /* prevents iOS zoom-on-focus */
	color: var(--jdi-text);
	background: rgba(0, 0, 0, 0.55);
	border: 1px solid rgba(255, 255, 255, 0.24);
	border-radius: 8px;
	padding: 0.65rem 0.75rem;
	line-height: 1.45;
	box-shadow: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.jdi-portal textarea { resize: vertical; min-height: 6.5rem; }
.jdi-portal textarea[data-type="url_list"] { font-family: var(--jdi-mono); font-size: 15px; min-height: 4.5rem; }
.jdi-portal select { appearance: auto; }
.jdi-portal input[type="date"] { color-scheme: dark; }
.jdi-portal option { background: #0b120e; color: var(--jdi-text); }
.jdi-portal input::placeholder,
.jdi-portal textarea::placeholder { color: #8b9a91; opacity: 1; }
.jdi-portal input:hover,
.jdi-portal select:hover,
.jdi-portal textarea:hover { border-color: rgba(0, 255, 102, 0.5); }

/* Focus: always visible, high contrast */
.jdi-portal :focus { outline: none; }
.jdi-portal :focus-visible,
.jdi-portal input:focus,
.jdi-portal select:focus,
.jdi-portal textarea:focus {
	outline: 3px solid var(--jdi-green);
	outline-offset: 2px;
	box-shadow: 0 0 0 5px rgba(0, 255, 102, 0.18);
}
/* Containers that receive programmatic focus: outline only for keyboard users. */
.jdi-portal .jdi-panel-title:focus:not(:focus-visible),
.jdi-portal .jdi-review:focus:not(:focus-visible),
.jdi-portal .jdi-receipt:focus:not(:focus-visible),
.jdi-portal .jdi-error-summary:focus:not(:focus-visible),
.jdi-portal .jdi-track-result:focus:not(:focus-visible) { outline: none; box-shadow: none; }
.jdi-portal .jdi-panel-title:focus-visible,
.jdi-portal .jdi-review:focus-visible,
.jdi-portal .jdi-receipt:focus-visible,
.jdi-portal .jdi-error-summary:focus-visible { outline: 2px dashed var(--jdi-violet); outline-offset: 4px; box-shadow: none; }

.jdi-check { display: flex; align-items: flex-start; gap: 0.6rem; margin: 0 0 0.9rem; }
.jdi-check input[type="checkbox"] {
	flex: none;
	width: 1.25rem; height: 1.25rem;
	margin: 0.15rem 0 0;
	accent-color: var(--jdi-green);
}
.jdi-check label { font-weight: 400; margin: 0; }

.has-error input,
.has-error select,
.has-error textarea,
.jdi-portal [aria-invalid="true"] { border-color: var(--jdi-danger) !important; }
.jdi-error {
	color: var(--jdi-danger);
	font-size: 0.92rem;
	margin: 0.35rem 0 0;
	font-weight: 600;
}
.jdi-error::before { content: "✕ "; }
.jdi-error-summary {
	border: 1px solid var(--jdi-danger);
	background: rgba(255, 122, 138, 0.10);
	border-radius: 8px;
	padding: 0.75rem 1rem;
	margin: 0 0 1.25rem;
}
.jdi-error-summary p { margin: 0 0 0.4rem; }
.jdi-error-summary ul { margin: 0; padding-left: 1.2rem; }
.jdi-error-summary a { color: #ffd1d7; text-decoration: underline; }

.jdi-warning {
	display: flex; gap: 0.75rem; align-items: flex-start;
	border: 1px solid rgba(255, 209, 102, 0.55);
	background: rgba(255, 209, 102, 0.08);
	color: #ffe7ad;
	border-radius: 8px;
	padding: 0.75rem 1rem;
	margin: 0 0 1.25rem;
}
.jdi-warning p { margin: 0; }
.jdi-warning .jdi-icon { color: var(--jdi-warn); margin-top: 0.1rem; }
.jdi-notice-inline { color: var(--jdi-warn); }

.jdi-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Uploader ---------- */
.jdi-dropzone {
	display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
	text-align: center;
	border: 1.5px dashed rgba(0, 255, 102, 0.45);
	border-radius: var(--jdi-radius);
	padding: 1.25rem 1rem;
	background: rgba(0, 0, 0, 0.35);
	transition: background-color .15s ease, border-color .15s ease;
}
.jdi-dropzone > .jdi-icon { width: 34px; height: 34px; color: var(--jdi-green-ink); }
.jdi-dropzone.is-over { background: rgba(0, 255, 102, 0.10); border-color: var(--jdi-green); }
.jdi-drop-text { margin: 0; color: var(--jdi-muted); }
.jdi-drop-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; }
.jdi-portal:not(.jdi-touch) .jdi-camera-btn { display: none; }

.jdi-file-list { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: 0.75rem; }
.jdi-file {
	display: grid;
	grid-template-columns: 88px 1fr;
	gap: 0.75rem;
	align-items: start;
	padding: 0.75rem;
	border: 1px solid var(--jdi-line-soft);
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.4);
}
.jdi-file img {
	width: 88px; height: 88px;
	object-fit: cover;
	border-radius: 6px;
	border: 1px solid var(--jdi-line);
	background: #111;
}
.jdi-file-meta { min-width: 0; }
.jdi-file-name { font-family: var(--jdi-mono); font-size: 0.85rem; word-break: break-all; margin: 0 0 0.35rem; }
.jdi-file-row { display: flex; gap: 0.5rem; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.jdi-file textarea { min-height: 3.25rem; margin-top: 0.4rem; }
.jdi-file label { font-weight: 400; font-size: 0.85rem; color: var(--jdi-muted); }

/* ---------- Buttons ---------- */
.jdi-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1rem; }
.jdi-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.45rem;
	min-height: 44px;
	padding: 0.6rem 1.15rem;
	border-radius: 8px;
	font-family: var(--jdi-mono);
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2;
	cursor: pointer;
	text-decoration: none;
	transition: box-shadow .15s ease, background-color .15s ease, color .15s ease, transform .15s ease;
}
.jdi-btn .jdi-icon { width: 1.15em; height: 1.15em; }
.jdi-btn-primary {
	background: var(--jdi-green);
	color: #021108 !important;
	border: 1px solid var(--jdi-green);
	box-shadow: 0 0 16px var(--jdi-green-glow);
}
.jdi-btn-primary:hover { background: #5dffa0; box-shadow: 0 0 24px var(--jdi-green-glow); }
.jdi-btn-ghost {
	background: rgba(0, 0, 0, 0.45);
	color: var(--jdi-green-ink) !important;
	border: 1px solid var(--jdi-line);
}
.jdi-btn-ghost:hover { border-color: var(--jdi-green); box-shadow: 0 0 14px var(--jdi-green-glow); }
.jdi-btn-small { min-height: 36px; padding: 0.35rem 0.75rem; font-size: 0.85rem; }
.jdi-btn-danger { color: #ffd1d7 !important; border-color: rgba(255, 122, 138, 0.6); }
.jdi-btn[disabled],
.jdi-btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; box-shadow: none; }

/* ---------- Review, progress, receipt ---------- */
.jdi-review {
	border: 1px solid var(--jdi-violet);
	border-radius: var(--jdi-radius);
	padding: 1rem clamp(0.75rem, 2vw, 1.25rem);
	background: var(--jdi-panel-strong);
	box-shadow: 0 0 22px var(--jdi-violet-glow);
}
.jdi-review h4 { font-family: var(--jdi-mono); margin: 0 0 0.4rem; color: var(--jdi-violet); }
.jdi-review-list,
.jdi-receipt-values,
.jdi-status-card {
	display: grid;
	grid-template-columns: minmax(140px, 30%) 1fr;
	gap: 0.45rem 1rem;
	margin: 0.75rem 0;
}
.jdi-review-list dt,
.jdi-receipt-values dt,
.jdi-status-card dt { color: var(--jdi-muted); font-size: 0.9rem; }
.jdi-review-list dd,
.jdi-receipt-values dd,
.jdi-status-card dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.jdi-pre { white-space: pre-wrap; }

.jdi-progress { margin: 0.75rem 0; }
.jdi-progress-bar {
	height: 10px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.10);
	overflow: hidden;
	border: 1px solid var(--jdi-line);
}
.jdi-progress-bar span {
	display: block; height: 100%; width: 0;
	background: linear-gradient(90deg, var(--jdi-green), var(--jdi-violet));
	transition: width .2s linear;
}

.jdi-receipt {
	border: 1px solid var(--jdi-green);
	box-shadow: 0 0 0 1px var(--jdi-green-glow), 0 0 30px var(--jdi-green-glow);
}
.jdi-receipt h3,
.jdi-receipt h4 { font-family: var(--jdi-mono); color: var(--jdi-green-ink); margin-top: 0; }
.jdi-receipt code,
.jdi-status-card code,
.jdi-hashes code {
	font-family: var(--jdi-mono);
	font-size: 1rem;
	color: var(--jdi-green-ink);
	background: rgba(0, 0, 0, 0.55);
	border: 1px solid var(--jdi-line);
	border-radius: 6px;
	padding: 0.15rem 0.45rem;
	word-break: break-all;
}
.jdi-hashes { list-style: none; padding: 0; margin: 0.25rem 0 0; display: grid; gap: 0.35rem; }
.jdi-hashes code { font-size: 0.78rem; display: inline-block; }
.jdi-copy-row { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }

/* ---------- Tracking ---------- */
.jdi-track-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.jdi-status-card { border: 1px solid var(--jdi-line); border-radius: 8px; padding: 0.9rem 1rem; background: rgba(0, 0, 0, 0.4); }
.jdi-track-result:empty { display: none; }

/* ---------- Prose, details ---------- */
.jdi-prose { color: var(--jdi-text); }
.jdi-prose p { margin: 0 0 0.75rem; }
.jdi-prose ul { margin: 0.25rem 0 0.75rem; padding-left: 1.25rem; }
.jdi-prose a,
.jdi-portal .jdi-help a { color: var(--jdi-green-ink); }
.jdi-details { margin: 0 0 0.75rem; }
.jdi-details summary {
	cursor: pointer;
	font-family: var(--jdi-mono);
	color: var(--jdi-green-ink);
	padding: 0.25rem 0;
}
.jdi-details[open] summary { margin-bottom: 0.5rem; }
.jdi-notice p { margin: 0; }
.jdi-referral .jdi-consent-extra { padding-left: 1.85rem; }

/* ---------- Responsive ---------- */
@media (max-width: 720px) {
	.jdi-grid { grid-template-columns: 1fr; }
	.jdi-track-grid { grid-template-columns: 1fr; }
	.jdi-review-list,
	.jdi-receipt-values,
	.jdi-status-card { grid-template-columns: 1fr; gap: 0.15rem; }
	.jdi-review-list dd,
	.jdi-receipt-values dd,
	.jdi-status-card dd { margin-bottom: 0.6rem; }
	.jdi-card { flex-direction: row; flex-wrap: wrap; align-items: center; }
	.jdi-card-title { flex: 1; }
	.jdi-card-desc { flex-basis: 100%; }
	.jdi-actions .jdi-btn { flex: 1 1 100%; }
	.jdi-referral .jdi-consent-extra { padding-left: 0; }
}
@media (max-width: 420px) {
	.jdi-file { grid-template-columns: 64px 1fr; }
	.jdi-file img { width: 64px; height: 64px; }
}

/* ---------- Motion & contrast preferences ---------- */
@media (prefers-reduced-motion: reduce) {
	.jdi-portal *,
	.jdi-portal *::before,
	.jdi-portal *::after {
		transition: none !important;
		animation: none !important;
		scroll-behavior: auto !important;
	}
	.jdi-card:hover { transform: none; }
}
@media (forced-colors: active) {
	.jdi-card,
	.jdi-panel,
	.jdi-fieldset,
	.jdi-dropzone,
	.jdi-btn { border: 1px solid CanvasText; }
	.jdi-card.is-active { outline: 3px solid Highlight; }
}
@media print {
	.jdi-portal { color: #000; }
	.jdi-grid, .jdi-form-panel, .jdi-track-form, .jdi-jump { display: none !important; }
	.jdi-receipt { border: 1px solid #000; box-shadow: none; background: #fff; }
	.jdi-receipt code { color: #000; background: #fff; }
}