/* JiD Jobagent - CTA, popup and account pages. Colours from jid-theme's tokens (fallbacks for safety). */

/* ------------------------------------------------------------------ CTA */

.jid-ja-cta {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	background: var(--jid-brand-50, #f0fdf8);
	border: 1px solid var(--jid-brand-light, #e6f9f3);
	border-radius: var(--jid-radius-lg, 16px);
}
.jid-ja-cta[hidden] { display: none; }
.jid-ja-cta__icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--jid-brand, #04b88e);
	color: #fff;
}
.jid-ja-cta__text { flex: 1 1 auto; min-width: 0; }
.jid-ja-cta__text p { margin: 0; }
.jid-ja-cta__title { font-weight: 700; font-size: 1rem; line-height: 1.3; color: var(--jid-gray-900, #0f1923); }
.jid-ja-cta__search { font-size: .85rem; color: var(--jid-brand-darker, #028064); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jid-ja-cta__search:empty { display: none; }
.jid-ja-cta__hint { margin: 4px 0 0 !important; font-size: .85rem; color: var(--jid-gray-600, #42526b); }
.jid-ja-cta__hint:empty { display: none; }
/* Not enough for an agent yet: the hint replaces the button. */
.jid-ja-cta.is-incomplete .jid-ja-cta__btn { display: none; }
.jid-ja-cta__btn { flex: 0 0 auto; white-space: nowrap; }
/* jid-job-board sets .jid .jid-btn--primary { width: 100% } - on the board that squeezed the text to one word per line. */
.jid .jid-ja-cta .jid-ja-cta__btn, .jid-ja-cta .jid-ja-cta__btn { width: auto; }

/* Board: a slim bar above the results. */
.jid-ja-cta--board { margin: 0 0 var(--jid-space-md, 16px); }

/* Job page: a card in the sidebar, under "Ansøg nu". */
.jid-ja-cta--single { flex-wrap: wrap; padding: 16px; }
.jid-ja-cta--single .jid-ja-cta__text { flex-basis: calc(100% - 60px); }
.jid-ja-cta--single .jid-ja-cta__search { white-space: normal; }
.jid-ja-cta--single .jid-ja-cta__btn { flex: 1 1 100%; justify-content: center; }

@media (max-width: 640px) {
	.jid-ja-cta--board { flex-wrap: wrap; }
	.jid-ja-cta--board .jid-ja-cta__text { flex-basis: calc(100% - 60px); }
	.jid-ja-cta--board .jid-ja-cta__btn { flex: 1 1 100%; justify-content: center; }
}

/* ---------------------------------------------------------------- popup */

.jid-ja-dialog {
	width: min(460px, calc(100vw - 32px));
	max-height: calc(100vh - 32px);
	padding: 0;
	border: 0;
	border-radius: 20px;
	background: #fff;
	color: var(--jid-gray-800, #1c2736);
	box-shadow: 0 24px 64px rgba(15, 25, 35, .28);
	overflow: auto;
	font-family: var(--jid-font-body, -apple-system, BlinkMacSystemFont, sans-serif);
}
.jid-ja-dialog::backdrop { background: rgba(15, 25, 35, .55); backdrop-filter: blur(3px); }
.jid-ja-dialog[open] { animation: jid-ja-in .22s var(--jid-ease, ease-out); }
@keyframes jid-ja-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .jid-ja-dialog[open] { animation: none; } }

.jid-ja-dialog__head {
	position: relative;
	padding: 26px 24px 22px;
	background: linear-gradient(135deg, var(--jid-brand, #04b88e) 0%, var(--jid-brand-darker, #028064) 100%);
	color: #fff;
}
.jid-ja-dialog__head p { margin: 0; }
.jid-ja-dialog__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	margin-bottom: 12px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .18);
}
.jid-ja-dialog__title { font-size: 1.3rem; font-weight: 700; line-height: 1.25; }
.jid-ja-dialog__sub { margin-top: 6px !important; font-size: .92rem; opacity: .92; }
.jid-ja-dialog__search {
	display: inline-block;
	margin-top: 12px !important;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .2);
	font-size: .85rem;
	font-weight: 600;
}
.jid-ja-dialog__search:empty { display: none; }
.jid-ja-dialog__close {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .18);
	color: #fff;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
}
.jid-ja-dialog__close:hover, .jid-ja-dialog__close:focus-visible { background: rgba(255, 255, 255, .32); }

.jid-ja-dialog__body { padding: 20px 24px 22px; }
.jid-ja-dialog .jid-ja-form { margin: 0; }
.jid-ja-dialog .jid-ja-form p { margin: 0 0 14px; }
.jid-ja-dialog label { display: block; font-weight: 600; font-size: .88rem; margin: 0 0 6px; color: var(--jid-gray-700, #2d3a4a); }
.jid-ja-dialog input[type="email"],
.jid-ja-dialog input[type="text"],
.jid-ja-dialog select {
	box-sizing: border-box;
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--jid-gray-300, #c9d1d8);
	border-radius: 10px;
	background: #fff;
	font: inherit;
	font-size: 1rem;
	color: inherit;
}
.jid-ja-dialog input:focus, .jid-ja-dialog select:focus {
	outline: none;
	border-color: var(--jid-brand, #04b88e);
	box-shadow: 0 0 0 3px rgba(4, 184, 142, .18);
}
.jid-ja-dialog .jid-ja-consent label { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: .85rem; line-height: 1.45; }
.jid-ja-dialog .jid-ja-consent input { flex: 0 0 auto; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--jid-brand, #04b88e); }
.jid-ja-dialog__submit { width: 100%; justify-content: center; padding: 14px 20px; font-size: 1rem; }
.jid-ja-dialog__foot { margin: 0 !important; text-align: center; }
.jid-ja-dialog .jid-ja-notice { margin: 0 0 14px; }

/* Phones: a bottom sheet. */
@media (max-width: 480px) {
	.jid-ja-dialog {
		width: 100%;
		max-width: 100%;
		max-height: 92vh;
		margin: auto 0 0;
		border-radius: 20px 20px 0 0;
	}
}

/* ---------------------------------------------------------- shared form */

.jid-ja-form p { margin: 0 0 12px; }
.jid-ja-row { display: flex; flex-wrap: wrap; gap: 0 var(--jid-space-md, 16px); }
.jid-ja-row > * { flex: 1 1 220px; min-width: 0; }
.jid-ja-field { margin: 0 0 12px; border: 0; padding: 0; }
.jid-ja-field label, .jid-ja-field legend { display: block; font-weight: 600; font-size: .9rem; margin: 0 0 4px; color: var(--jid-gray-700, #2d3a4a); }
.jid-ja-field .jid-input, .jid-ja-field .jid-select { width: 100%; box-sizing: border-box; }
.jid-ja-inline { display: flex; gap: 8px; }
.jid-ja-inline .jid-input { max-width: 110px; }
.jid-ja-checks { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.jid-ja-checks label { font-weight: 400; display: inline-flex; gap: 6px; align-items: center; }
.jid-ja-muted { color: var(--jid-gray-500, #5f6f80); font-size: .88rem; }
.jid-ja-chip { border: 1px solid var(--jid-gray-200, #e2e7eb); border-radius: 999px; padding: 2px 10px; }

/* Honeypot: off screen, not display:none (some bots skip hidden fields). */
.jid-ja-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.jid-ja-notice { padding: 10px 14px; border-radius: var(--jid-radius, 10px); margin: 0 0 12px; font-size: .95rem; }
.jid-ja-notice--ok { background: var(--jid-brand-light, #e6f9f3); color: var(--jid-brand-darker, #028064); }
.jid-ja-notice--info { background: #eef4ff; color: #1e429f; }
.jid-ja-notice--err { background: #fdecec; color: #9b1c1c; }

/* -------------------------------------------------------- account pages */

.jid-ja-profile, .jid-ja-login { max-width: 760px; }
.jid-ja-h { font-size: 1.25rem; margin: var(--jid-space-xl, 40px) 0 var(--jid-space-md, 16px); }
.jid-ja-box { padding: var(--jid-space-md, 16px) var(--jid-space-lg, 24px); border-radius: var(--jid-radius-lg, 16px); margin: 0 0 var(--jid-space-md, 16px); }
.jid-ja-box--cta { background: var(--jid-brand-50, #f0fdf8); border: 1px solid var(--jid-brand-light, #e6f9f3); }
.jid-ja-agent { border: 1px solid var(--jid-gray-200, #e2e7eb); border-radius: var(--jid-radius, 10px); padding: var(--jid-space-md, 16px); margin: 0 0 12px; }
.jid-ja-agent.is-paused { opacity: .75; }
.jid-ja-agent__title { margin: 0 0 4px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.jid-ja-agent__actions { display: flex; gap: 8px; margin: 8px 0; }
.jid-ja-agent__actions form { margin: 0; }
.jid-ja-badge { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; background: var(--jid-gray-100, #f1f4f6); border-radius: 999px; padding: 2px 8px; }
.jid-ja-agent:not(.is-paused) .jid-ja-badge { background: var(--jid-brand-light, #e6f9f3); color: var(--jid-brand-darker, #028064); }
.jid-ja-edit > summary, .jid-ja-danger > summary { cursor: pointer; color: var(--jid-brand-darker, #028064); font-weight: 600; }
.jid-ja-danger { margin-top: var(--jid-space-xl, 40px); }

/* The board styles .jid-btn full width; buttons on the account pages hug their text. */
.jid-ja-profile button.jid-btn, .jid-ja-login button.jid-btn { width: auto; }
/* Inputs on the account pages - the same look as the popup (the board's .jid-input styles are not loaded there). */
.jid-ja-profile input[type="text"], .jid-ja-profile input[type="email"], .jid-ja-profile input[type="password"], .jid-ja-profile input[type="number"], .jid-ja-profile select,
.jid-ja-login input[type="text"], .jid-ja-login input[type="email"], .jid-ja-login input[type="password"] {
	box-sizing: border-box;
	width: 100%;
	max-width: 420px;
	padding: 12px 14px;
	border: 1px solid var(--jid-gray-300, #c9d1d8);
	border-radius: 10px;
	background: #fff;
	font: inherit;
	font-size: 1rem;
	color: inherit;
}
.jid-ja-profile input:focus, .jid-ja-profile select:focus, .jid-ja-login input:focus {
	outline: none;
	border-color: var(--jid-brand, #04b88e);
	box-shadow: 0 0 0 3px rgba(4, 184, 142, .18);
}
.jid-ja-login label, .jid-ja-profile .jid-ja-field > label { display: block; font-weight: 600; font-size: .9rem; margin: 0 0 6px; color: var(--jid-gray-700, #2d3a4a); }