/* FileDeck frontend styles */

.filedeck {
	--fdk-accent: #1e40af;
	--fdk-border: #e2e8f0;
	--fdk-muted: #64748b;
	--fdk-ink: #0f172a;
	margin: 1.5em 0;
}

/* Table libraries render as a self-contained card: controls strip on top,
   rows in the middle, pagination footer. Grid and folder layouts keep their
   own framing (cards / collapsible sections), so this is table-only.

   Overflow: a many-column table can be wider than the card, so the safe
   default is a horizontal scrollbar — clipping would hide whole columns.
   But a scroll container also disables the viewport-sticky header, so when
   JS measures that the table fits (the common case) it adds .fdk-fits and
   the card switches to overflow: clip — which, unlike hidden, does NOT
   create a scrollport, so the sticky header keeps working. */
.filedeck[data-layout="table"] {
	border: 1px solid var(--fdk-border);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	overflow-x: auto;
}

.filedeck[data-layout="table"].fdk-fits {
	overflow: hidden;
	overflow: clip;
}

.filedeck[data-layout="table"] .fdk-controls {
	margin-bottom: 0;
	padding: 0.75em 1em;
	border-bottom: 1px solid var(--fdk-border);
}

.filedeck[data-layout="table"] .fdk-table th:first-child,
.filedeck[data-layout="table"] .fdk-table td:first-child {
	padding-left: 1em;
}

.filedeck[data-layout="table"] .fdk-table th:last-child,
.filedeck[data-layout="table"] .fdk-table td:last-child {
	padding-right: 1em;
}

.filedeck[data-layout="table"] .fdk-table tbody tr:last-child td {
	border-bottom: 0;
}

.filedeck[data-layout="table"] .fdk-bulkbar {
	margin: 0.75em 1em 0;
}

.filedeck[data-layout="table"] .fdk-empty {
	padding: 1em;
}

.filedeck[data-layout="table"] .fdk-pagination {
	margin-top: 0;
	padding: 0.75em 1em;
	border-top: 1px solid var(--fdk-border);
}

/* Every FileDeck frontend surface is a light-surface component. Pin the color
   scheme on each shortcode root so native controls — <select> option popups
   especially, plus checkboxes and date pickers — render light even when the
   visitor's OS is in dark mode. Without this, a dark-mode device draws the
   dropdown list as an unstyled dark menu over the light UI. */
.filedeck,
.fdk-submit-form,
.fdk-login-form,
.fdk-unlock-form,
.fdk-standalone-search,
.fdk-subscribe,
.fdk-ask {
	color-scheme: light;
}

/* Controls */
.fdk-controls {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75em;
	align-items: center;
	margin-bottom: 1em;
}

.fdk-search-field {
	position: relative;
	display: inline-flex;
	flex: 1 1 220px;
	max-width: 360px;
}

.fdk-search {
	flex: 1 1 auto;
	width: 100%;
	padding: 0.5em 0.75em 0.5em 2.2em;
	border: 1px solid var(--fdk-border);
	border-radius: 6px;
	font-size: 0.95em;
}

.fdk-search-icon {
	position: absolute;
	top: 50%;
	left: 0.7em;
	transform: translateY(-50%);
	color: var(--fdk-muted);
	pointer-events: none;
}

/* In-flight indicator: content/semantic (inline mode) or the library fetch
   (server mode) runs after the instant local filter, so show a spinner while
   the deeper results are still on their way in. */
.fdk-search-field.is-searching .fdk-search {
	padding-right: 2.1em;
}

.fdk-search-spin {
	position: absolute;
	top: 50%;
	right: 0.7em;
	width: 14px;
	height: 14px;
	margin-top: -7px;
	border: 2px solid var(--fdk-border);
	border-top-color: var(--fdk-accent, #1e40af);
	border-radius: 50%;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.15s ease;
}

.fdk-search-field.is-searching .fdk-search-spin {
	opacity: 1;
	animation: fdk-spin 0.7s linear infinite;
}

@keyframes fdk-spin {
	to { transform: rotate(360deg); }
}

@media ( prefers-reduced-motion: reduce ) {
	.fdk-search-field.is-searching .fdk-search-spin {
		animation: none;
	}
}

.fdk-filter-cat,
.fdk-filter-tag,
.fdk-facet,
.fdk-page-length {
	padding: 0.45em 0.5em;
	border: 1px solid var(--fdk-border);
	border-radius: 6px;
	font-size: 0.95em;
	background: #fff;
	color: inherit;
}

.fdk-facet-range {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	font-size: 0.9em;
	color: var(--fdk-muted);
}

.fdk-facet-range .fdk-facet-range-label {
	font-weight: 600;
}

.fdk-facet-range input {
	width: 8em;
	padding: 0.4em 0.5em;
	border: 1px solid var(--fdk-border);
	border-radius: 4px;
	font-size: 0.95em;
	background: #fff;
	color: inherit;
}

.fdk-count {
	color: var(--fdk-muted);
	font-size: 0.85em;
	margin-left: auto;
}

/* Table */
.fdk-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95em;
}

.fdk-table th,
.fdk-table td {
	padding: 0.6em 0.75em;
	text-align: left;
	border-bottom: 1px solid var(--fdk-border);
	vertical-align: middle;
}

.fdk-table thead th {
	position: sticky;
	/* WordPress sets this var on the frontend when the admin bar shows, so the
	   sticky header lands below it for logged-in visitors. */
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 2;
	padding-top: 0.55em;
	padding-bottom: 0.55em;
	border-bottom: 1px solid var(--fdk-border);
	background: #f8fafc;
	color: var(--fdk-muted);
	font-size: 0.78em;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.fdk-table th.fdk-sortable[aria-sort="ascending"],
.fdk-table th.fdk-sortable[aria-sort="descending"] {
	color: var(--fdk-accent);
}

.fdk-table th.fdk-sortable {
	cursor: pointer;
	user-select: none;
}

.fdk-table th.fdk-sortable::after {
	content: "\2195";
	opacity: 0.35;
	margin-left: 0.35em;
	font-size: 0.85em;
}

.fdk-table th.fdk-sortable[aria-sort="ascending"]::after {
	content: "\2191";
	opacity: 1;
}

.fdk-table th.fdk-sortable[aria-sort="descending"]::after {
	content: "\2193";
	opacity: 1;
}

.fdk-table tbody tr {
	transition: background-color 0.12s ease;
}

.fdk-table tbody tr:hover {
	background: rgba(30, 64, 175, 0.06);
	background: color-mix(in srgb, var(--fdk-accent) 6%, transparent);
}

/* Title is the row's hero: ink, weight, no underline until hover. */
.fdk-table td[data-col="title"] a {
	color: var(--fdk-ink, #0f172a);
	font-weight: 600;
	text-decoration: none;
}

.fdk-table td[data-col="title"] a:hover {
	color: var(--fdk-accent);
	text-decoration: underline;
}

/* Categories are quiet pills, not competing links. */
.fdk-cat {
	display: inline-block;
	padding: 0.1em 0.7em;
	margin: 0.1em 0.15em 0.1em 0;
	border: 1px solid var(--fdk-border);
	border-radius: 999px;
	background: #fff;
	color: var(--fdk-muted);
	font-size: 0.85em;
	white-space: nowrap;
	text-decoration: none;
}

a.fdk-cat:hover {
	border-color: var(--fdk-accent);
	color: var(--fdk-accent);
}

/* Grid */
.fdk-grid {
	display: grid;
	grid-template-columns: repeat(var(--fdk-grid-cols, auto-fill), minmax(230px, 1fr));
	gap: 1em;
}

.fdk-card {
	border: 1px solid var(--fdk-border);
	border-radius: 8px;
	padding: 1em;
	display: flex;
	flex-direction: column;
	gap: 0.5em;
	background: #fff;
}

.fdk-card-title {
	font-size: 1.05em;
	margin: 0;
	line-height: 1.3;
}

.fdk-card-excerpt {
	font-size: 0.88em;
	color: var(--fdk-muted);
	margin: 0;
}

.fdk-card-meta {
	display: flex;
	gap: 0.5em;
	align-items: center;
	font-size: 0.82em;
	color: var(--fdk-muted);
	margin: 0;
}

.fdk-card .fdk-dl {
	margin-top: auto;
	align-self: flex-start;
}

/* Tile thumbnails: featured image, image files, or a PDF first-page preview.
   Small by default (safe inside a table cell); full-bleed inside a grid card. */
.fdk-tile-thumb {
	display: block;
	width: 48px;
	height: 48px;
	object-fit: cover;
	object-position: top center;
	border-radius: 4px;
	border: 1px solid var(--fdk-border);
	background: #fff;
}

.fdk-card-image {
	margin: -1em -1em 0.25em;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: 8px 8px 0 0;
	border-bottom: 1px solid var(--fdk-border);
	background: #f6f8fa;
}

.fdk-card-image .fdk-tile-thumb {
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: 0;
}

/* Badges & buttons */
.fdk-badge {
	display: inline-block;
	padding: 0.15em 0.5em;
	border-radius: 4px;
	background: rgba(30, 64, 175, 0.08);
	background: color-mix(in srgb, var(--fdk-accent) 8%, transparent);
	color: var(--fdk-accent);
	font-size: 0.78em;
	font-weight: 600;
	letter-spacing: 0.02em;
}

/* Outlined at rest so 50 rows don't become a solid blue stripe; fills on
   hover so the primary action still asserts itself. */
.fdk-dl-button {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	padding: 0.4em 0.9em;
	background: #fff;
	color: var(--fdk-accent, #1e40af) !important;
	border: 1px solid rgba(30, 64, 175, 0.4);
	border: 1px solid color-mix(in srgb, var(--fdk-accent, #1e40af) 40%, #fff);
	border-radius: 6px;
	text-decoration: none;
	font-size: 0.88em;
	font-weight: 600;
	font-family: inherit;
	cursor: pointer;
	transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.fdk-dl-button:hover {
	background: var(--fdk-accent, #1e40af);
	border-color: var(--fdk-accent, #1e40af);
	color: #fff !important;
}

/* The lead-capture modal's submit is the one genuinely primary CTA — solid. */
.fdk-lead-form .fdk-dl-button {
	justify-content: center;
	background: var(--fdk-accent, #1e40af);
	border-color: var(--fdk-accent, #1e40af);
	color: #fff !important;
}

.fdk-lead-form .fdk-dl-button:hover {
	opacity: 0.9;
}

.fdk-dl-icon-only {
	font-size: 1.1em;
	text-decoration: none;
}

/* Pagination */
.fdk-pagination {
	display: flex;
	gap: 0.35em;
	margin-top: 1em;
	flex-wrap: wrap;
}

.fdk-pagination:empty {
	display: none;
}

.fdk-page {
	padding: 0.35em 0.75em;
	border: 1px solid var(--fdk-border);
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
	font-size: 0.9em;
	font-family: inherit;
}

.fdk-page.is-active {
	background: var(--fdk-accent);
	border-color: var(--fdk-accent);
	color: #fff;
}

.fdk-empty {
	color: var(--fdk-muted);
	font-style: italic;
	padding: 1em 0;
}

/* Folders layout */
.fdk-folders {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
}

.fdk-folder {
	border: 1px solid var(--fdk-border);
	border-radius: 8px;
	overflow: hidden;
}

.fdk-folder summary {
	cursor: pointer;
	padding: 0.75em 1em;
	font-weight: 600;
	background: rgba(30, 64, 175, 0.04);
	background: color-mix(in srgb, var(--fdk-accent) 4%, transparent);
	list-style: none;
	display: flex;
	align-items: center;
	gap: 0.5em;
}

.fdk-folder summary::-webkit-details-marker {
	display: none;
}

.fdk-folder[open] summary {
	border-bottom: 1px solid var(--fdk-border);
}

.fdk-folder-count {
	margin-left: auto;
	background: rgba(30, 64, 175, 0.08);
	background: color-mix(in srgb, var(--fdk-accent) 8%, transparent);
	color: var(--fdk-accent);
	border-radius: 10px;
	padding: 0.1em 0.6em;
	font-size: 0.8em;
}

.fdk-folder-body {
	padding: 0 1em 1em;
}

/* Bulk bar */
.fdk-bulkbar[hidden] {
	display: none;
}

.fdk-bulkbar {
	display: flex;
	align-items: center;
	gap: 1em;
	padding: 0.6em 1em;
	margin-bottom: 0.75em;
	background: rgba(30, 64, 175, 0.06);
	background: color-mix(in srgb, var(--fdk-accent) 6%, transparent);
	border: 1px solid var(--fdk-border);
	border-radius: 6px;
	font-size: 0.9em;
}

/* Modals (preview + lead capture) */
.fdk-modal {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.6);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 99999;
	padding: 1em;
}

.fdk-modal[hidden] {
	display: none;
}

.fdk-modal-box {
	background: #fff;
	border-radius: 8px;
	padding: 1.5em;
	max-width: 420px;
	width: 100%;
	position: relative;
	max-height: 90vh;
	overflow: auto;
}

.fdk-modal-wide {
	max-width: 900px;
}

.fdk-modal-close {
	position: absolute;
	top: 0.4em;
	right: 0.6em;
	background: none;
	border: none;
	font-size: 1.6em;
	line-height: 1;
	cursor: pointer;
	color: var(--fdk-muted);
}

.fdk-preview-body iframe {
	width: 100%;
	height: 70vh;
	border: none;
}

.fdk-preview-body img,
.fdk-preview-body video {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}

.fdk-preview-body audio {
	width: 100%;
}

body.fdk-modal-open {
	overflow: hidden;
}

.fdk-preview-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	background: none;
	border: 1px solid var(--fdk-border);
	border-radius: 6px;
	padding: 0.35em 0.7em;
	cursor: pointer;
	font-size: 0.85em;
	font-family: inherit;
	color: inherit;
	white-space: nowrap;
	transition: border-color 0.12s ease, color 0.12s ease;
}

.fdk-preview-btn:hover {
	border-color: var(--fdk-accent);
	color: var(--fdk-accent);
}

/* Lead form */
.fdk-lead-form {
	display: flex;
	flex-direction: column;
	gap: 0.75em;
}

.fdk-lead-form input {
	padding: 0.55em 0.75em;
	border: 1px solid var(--fdk-border);
	border-radius: 4px;
	font-size: 0.95em;
}

/* Unlock form */
.fdk-unlock-form {
	max-width: 380px;
	padding: 1.5em;
	border: 1px solid var(--fdk-border);
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	gap: 0.75em;
}

.fdk-unlock-form input[type="password"] {
	padding: 0.55em 0.75em;
	border: 1px solid var(--fdk-border);
	border-radius: 4px;
}

/* Standalone search */
.fdk-standalone-search {
	display: flex;
	gap: 0.5em;
	max-width: 480px;
}

.fdk-standalone-search input {
	flex: 1;
	padding: 0.5em 0.75em;
	border: 1px solid var(--fdk-border);
	border-radius: 4px;
}

/* Misc */
.fdk-lock {
	opacity: 0.75;
}

.filedeck input[type="checkbox"] {
	accent-color: var(--fdk-accent);
}

.filedeck a:focus-visible,
.filedeck button:focus-visible,
.filedeck input:focus-visible,
.filedeck select:focus-visible,
.filedeck th.fdk-sortable:focus-visible {
	outline: 2px solid var(--fdk-accent);
	outline-offset: 1px;
}

.fdk-card-actions {
	display: flex;
	gap: 0.5em;
	align-items: center;
	margin-top: auto;
}

/* Responsive table: stacked cards on phones (no awkward horizontal scroll).
   Each row becomes a card; each cell shows its column name (from data-label)
   with the value on the right. Title + download button span full width. */
@media (max-width: 600px) {
	.filedeck {
		overflow-x: visible;
	}

	/* Rows become standalone cards on phones, so the outer card wrapper (and
	   its edge paddings/borders) comes off — a card of cards reads wrong. */
	.filedeck[data-layout="table"],
	.filedeck[data-layout="table"].fdk-fits {
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
		overflow: visible;
	}

	.filedeck[data-layout="table"] .fdk-controls {
		padding: 0;
		border-bottom: 0;
		margin-bottom: 1em;
	}

	.filedeck[data-layout="table"] .fdk-table td:first-child {
		padding-left: 0;
	}

	.filedeck[data-layout="table"] .fdk-table td:last-child {
		padding-right: 0;
	}

	.filedeck[data-layout="table"] .fdk-bulkbar {
		margin: 0 0 0.75em;
	}

	.filedeck[data-layout="table"] .fdk-empty {
		padding: 1em 0;
	}

	.filedeck[data-layout="table"] .fdk-pagination {
		padding: 0;
		border-top: 0;
		margin-top: 1em;
	}

	.fdk-table {
		min-width: 0;
		display: block;
		font-size: 1em;
	}

	.fdk-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}

	.fdk-table tbody,
	.fdk-table tr,
	.fdk-table td {
		display: block;
	}

	/* Keep paginated-away rows hidden: the display:block above would otherwise
	   override the [hidden] attribute the pager sets, showing every row on
	   phones (a long scroll) even though desktop paginates correctly. */
	.fdk-table tr[hidden] {
		display: none;
	}

	.fdk-table tr {
		border: 1px solid var(--fdk-border);
		border-radius: 10px;
		padding: 0.75em 0.9em;
		margin-bottom: 0.75em;
		background: #fff;
		box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
	}

	.fdk-table tbody tr:hover {
		background: #fff;
	}

	.fdk-table td {
		border: none;
		padding: 0.3em 0;
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		gap: 1.5em;
		text-align: right;
	}

	/* Column name label on the left of each row. */
	.fdk-table td::before {
		content: attr(data-label);
		font-weight: 600;
		color: var(--fdk-muted, #64748b);
		text-align: left;
		flex: 0 0 auto;
	}

	/* Title leads the card: full width, prominent, no label. */
	.fdk-table td[data-col="title"] {
		display: block;
		text-align: left;
		font-size: 1.08em;
		font-weight: 650;
		padding-bottom: 0.4em;
		margin-bottom: 0.2em;
		border-bottom: 1px solid var(--fdk-border);
	}
	.fdk-table td[data-col="title"]::before {
		display: none;
	}

	/* Download + select + preview + image span full width, no label. */
	.fdk-table td[data-col="link"],
	.fdk-table td[data-col="preview"],
	.fdk-table td[data-col="select"],
	.fdk-table td[data-col="image"] {
		display: block;
		text-align: left;
	}
	.fdk-table td[data-col="link"]::before,
	.fdk-table td[data-col="preview"]::before,
	.fdk-table td[data-col="select"]::before,
	.fdk-table td[data-col="image"]::before {
		display: none;
	}

	.fdk-table td[data-col="link"] {
		margin-top: 0.5em;
	}

	/* Empty cells shouldn't render a lonely label. */
	.fdk-table td:empty {
		display: none;
	}
}

/* Fixed grid columns never overflow small screens */
@media (max-width: 700px) {
	.fdk-grid {
		grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	}
}

/* Page-length dropdown */
.fdk-page-length {
	padding: 0.45em 0.6em;
	border: 1px solid var(--fdk-border);
	border-radius: 6px;
	background: #fff;
}

/* Single document page */
.fdk-single-download {
	/* This block renders on the single-document page, outside any .filedeck
	   wrapper, so it defines the brand vars itself — without them the button
	   background is empty and its #fff label is invisible. */
	--fdk-accent: #1e40af;
	--fdk-border: #e2e8f0;
	display: flex;
	align-items: center;
	gap: 1em;
	margin-top: 1.5em;
	padding: 1em;
	border: 1px solid var(--fdk-border);
	border-radius: 8px;
	background: rgba(30, 64, 175, 0.04);
	background: color-mix(in srgb, var(--fdk-accent) 4%, transparent);
}

.fdk-single-download .fdk-single-meta {
	display: flex;
	align-items: center;
	gap: 0.75em;
	margin: 0;
}

/* Frontend submission form */
.fdk-submit-form label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.25em;
}

.fdk-submit-form input[type="text"],
.fdk-submit-form textarea,
.fdk-submit-form select {
	width: 100%;
	max-width: 480px;
	padding: 0.5em 0.65em;
	border: 1px solid var(--fdk-border);
	border-radius: 6px;
}

.fdk-submit-form .fdk-required {
	color: #b32d2e;
}

.fdk-submit-success {
	padding: 0.75em 1em;
	border-left: 4px solid #00a32a;
	background: rgba(0, 163, 42, 0.08);
}

.fdk-submit-error {
	padding: 0.75em 1em;
	border-left: 4px solid #b32d2e;
	background: rgba(179, 45, 46, 0.08);
}

/* Login form */
.fdk-login-form form {
	max-width: 360px;
}

.fdk-login-form input[type="text"],
.fdk-login-form input[type="password"] {
	width: 100%;
	padding: 0.5em 0.65em;
	border: 1px solid var(--fdk-border);
	border-radius: 6px;
}

/* ---- R1: shareable views, hover cards, QR ---- */
.fdk-copy-link {
	cursor: pointer;
	border: 1px solid var(--fdk-border, #d1d5db);
	background: #fff;
	color: var(--fdk-ink, #0f172a);
	border-radius: 6px;
	padding: 6px 12px;
	font: inherit;
	line-height: 1.2;
}
.fdk-copy-link:hover { border-color: var(--fdk-accent, #1e40af); }

.fdk-hovercard {
	position: fixed;
	z-index: 99998;
	max-width: 280px;
	background: #fff;
	color: var(--fdk-ink, #0f172a);
	border: 1px solid var(--fdk-border, #e2e8f0);
	border-radius: 10px;
	box-shadow: 0 12px 32px rgba(15, 23, 42, .18);
	padding: 10px;
	display: flex;
	gap: 10px;
	pointer-events: none;
}
.fdk-hovercard .fdk-hc-thumb {
	flex: 0 0 auto;
	width: 64px;
	height: 64px;
	overflow: hidden;
	border-radius: 6px;
	background: #f1f5f9;
}
.fdk-hovercard .fdk-hc-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fdk-hovercard .fdk-hc-title { font-weight: 600; line-height: 1.3; margin-bottom: 3px; }
.fdk-hovercard .fdk-hc-meta { color: #64748b; font-size: 12px; }

.fdk-qr { display: inline-block; }
.fdk-qr .fdk-qr-img { line-height: 0; }
.fdk-qr .fdk-qr-dl { margin-top: 8px; }

/* --- Ask this library (R5) ------------------------------------------------ */
/* --- Ask this library: chat UI ------------------------------------------- */
.fdk-ask {
	/* Rendered standalone (outside any .filedeck wrapper), so it defines its
	   own brand vars; a theme can override --fdk-accent on .fdk-ask. */
	--fdk-accent: #1e40af;
	--fdk-border: #e2e8f0;
	--fdk-muted: #64748b;
	margin: 1.5em 0;
}
.fdk-ask-chat {
	display: flex; flex-direction: column;
	max-width: 640px; background: #fff;
	border: 1px solid var(--fdk-border); border-radius: 12px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	overflow: hidden;
}
.fdk-ask-bar {
	display: flex; align-items: center; gap: 10px;
	padding: 10px 14px; border-bottom: 1px solid var(--fdk-border);
}
.fdk-ask-mark {
	flex: 0 0 auto; width: 28px; height: 28px;
	display: grid; place-items: center;
	border-radius: 8px;
	color: var(--fdk-accent);
	background: rgba(30, 64, 175, 0.08);
	background: color-mix(in srgb, var(--fdk-accent) 8%, transparent);
}
.fdk-ask-heading { display: block; font-weight: 600; line-height: 1.25; }
.fdk-ask-subline {
	display: block; font-size: 12px; line-height: 1.4;
	color: var(--fdk-muted); font-weight: 400;
}
.fdk-ask-thread {
	flex: 1 1 auto; min-height: 180px; max-height: 440px; overflow-y: auto;
	padding: 16px; display: flex; flex-direction: column; gap: 12px;
	scroll-behavior: smooth;
}
.fdk-ask-empty {
	margin: auto; width: 100%; text-align: center;
	color: var(--fdk-muted); font-size: 14px; line-height: 1.5;
}
.fdk-ask-empty p { max-width: 42ch; margin: 0 auto 14px; }
.fdk-ask-suggest { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.fdk-ask-chip {
	padding: 7px 14px; font: inherit; font-size: 13.5px; cursor: pointer;
	color: var(--fdk-accent); background: #fff;
	border: 1px solid var(--fdk-border); border-radius: 999px; line-height: 1.3;
	transition: border-color .12s ease, background .12s ease;
}
.fdk-ask-chip:hover { border-color: var(--fdk-accent); background: #f8fafc; }
.fdk-ask-msg {
	max-width: 88%; padding: 10px 14px; border-radius: 14px;
	font-size: 15px; line-height: 1.55; overflow-wrap: anywhere;
	animation: fdk-ask-in 0.16s ease-out;
}
@keyframes fdk-ask-in {
	from { opacity: 0; transform: translateY(4px); }
	to { opacity: 1; transform: none; }
}
.fdk-ask-msg.is-user {
	align-self: flex-end; background: var(--fdk-accent); color: #fff;
	border-bottom-right-radius: 4px;
}
.fdk-ask-msg.is-bot {
	align-self: flex-start; background: #f1f5f9; color: var(--fdk-ink, #0f172a);
	border-bottom-left-radius: 4px;
}
/* An answer with no citations couldn't be grounded in the library — show it
   empty-handed (dashed outline) rather than dressed like a sourced answer. */
.fdk-ask-msg.is-unsourced {
	background: #fff;
	border: 1px dashed var(--fdk-border);
}
.fdk-ask-msg.is-error {
	background: #fef2f2;
	border: 1px solid #fecaca;
}
.fdk-ask-msg .fdk-ask-text p { margin: 0 0 .6em; }
.fdk-ask-msg .fdk-ask-text > :last-child { margin-bottom: 0; }
.fdk-ask-msg .fdk-ask-list { margin: 0 0 .6em; padding-left: 1.25em; }
.fdk-ask-msg .fdk-ask-list li { margin: .15em 0; }
.fdk-ask-msg .fdk-ask-text strong { font-weight: 600; }
.fdk-ask-error { color: #b91c1c; margin: 0; }
.fdk-ask-sources {
	margin-top: 10px; padding-top: 8px;
	border-top: 1px solid rgba(15, 23, 42, 0.08);
}
.fdk-ask-sources-label {
	display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .05em;
	color: var(--fdk-muted); margin-bottom: 6px;
}
.fdk-ask-source-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.fdk-ask-src {
	display: inline-block; max-width: 220px; padding: 3px 10px;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	font-size: 13px; line-height: 1.4;
	background: #fff; border: 1px solid var(--fdk-border); border-radius: 999px;
	color: var(--fdk-accent); text-decoration: none;
}
/* Document glyph via mask so it inherits the chip's link color. */
.fdk-ask-src::before {
	content: "";
	display: inline-block;
	width: 12px; height: 12px;
	margin-right: 5px;
	vertical-align: -1px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2.5h7l5 5V21.5H6z'/%3E%3Cpath d='M13 2.5V8h5'/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2.5h7l5 5V21.5H6z'/%3E%3Cpath d='M13 2.5V8h5'/%3E%3C/svg%3E") no-repeat center / contain;
}
.fdk-ask-src:hover { border-color: var(--fdk-accent); }
.fdk-ask-typing { display: inline-flex; gap: 4px; padding: 4px 2px; }
.fdk-ask-typing span {
	width: 7px; height: 7px; border-radius: 50%; background: var(--fdk-muted);
	opacity: .5; animation: fdk-ask-bounce 1.2s infinite ease-in-out;
}
.fdk-ask-typing span:nth-child(2) { animation-delay: .2s; }
.fdk-ask-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes fdk-ask-bounce { 0%,80%,100% { transform: translateY(0); opacity: .4; } 40% { transform: translateY(-4px); opacity: .9; } }
.fdk-ask-composer {
	display: flex; align-items: flex-end; gap: 8px;
	padding: 10px; border-top: 1px solid var(--fdk-border); background: #fff;
}
.fdk-ask-input {
	flex: 1 1 auto; resize: none; max-height: 140px; overflow-y: auto;
	padding: 10px 12px; font: inherit; font-size: 15px; line-height: 1.4;
	border: 1px solid var(--fdk-border); border-radius: 10px; background: #fff;
}
.fdk-ask-input:focus { outline: 2px solid var(--fdk-accent); outline-offset: 1px; }
.fdk-ask-send {
	flex: 0 0 auto; width: 40px; height: 40px; display: grid; place-items: center;
	color: #fff; background: var(--fdk-accent); border: 0; border-radius: 50%;
	cursor: pointer; transition: opacity .15s ease;
}
.fdk-ask-send:hover { opacity: .9; }
.fdk-ask-send:disabled { opacity: .5; cursor: default; }
.fdk-ask-disclaimer {
	margin: 0; padding: 12px 16px 14px; font-size: 12px; line-height: 1.5;
	color: var(--fdk-muted); border-top: 1px solid var(--fdk-border);
}
.fdk-ask-disabled { padding: 12px; border: 1px dashed var(--fdk-border); border-radius: 8px; color: var(--fdk-muted); }
/* The Ask widget renders standalone (outside .filedeck), so it needs its own
   focus-visible treatment — the library-scoped rule doesn't reach it. */
.fdk-ask a:focus-visible,
.fdk-ask button:focus-visible,
.fdk-ask textarea:focus-visible {
	outline: 2px solid var(--fdk-accent);
	outline-offset: 1px;
}
@media (prefers-reduced-motion: reduce) {
	.fdk-ask-typing span { animation: none; }
	.fdk-ask-msg { animation: none; }
	.fdk-ask-thread { scroll-behavior: auto; }
}

/* --- Related documents (R5) ----------------------------------------------- */
.fdk-related { margin: 1.5em 0; padding-top: 1em; border-top: 1px solid var(--fdk-border); }
.fdk-related-title { margin: 0 0 .5em; font-size: 1.1em; }
.fdk-related-list { margin: 0; padding-left: 1.3em; }
.fdk-related-list li { margin: 3px 0; }

/* --- Change subscriptions (R6) -------------------------------------------- */
.fdk-subscribe { margin: 1.5em 0; }
.fdk-subscribe-heading { margin: 0 0 .5em; font-size: 1.15em; }
.fdk-subscribe-row { display: flex; flex-wrap: wrap; gap: 8px; }
.fdk-subscribe-email { flex: 1 1 12em; padding: 10px 12px; font-size: 15px; border: 1px solid var(--fdk-border); border-radius: 8px; }
.fdk-subscribe-scope { padding: 10px 12px; font-size: 15px; border: 1px solid var(--fdk-border); border-radius: 8px; }
.fdk-subscribe-email:focus, .fdk-subscribe-scope:focus { outline: 2px solid var(--fdk-accent); outline-offset: 1px; }
.fdk-subscribe-submit { padding: 10px 18px; font-size: 15px; cursor: pointer; color: #fff; background: var(--fdk-accent); border: 1px solid var(--fdk-accent); border-radius: 8px; }
.fdk-subscribe-submit:disabled { opacity: .6; cursor: default; }
.fdk-subscribe-msg { margin-top: 8px; font-size: 14px; color: var(--fdk-muted); }
.fdk-subscribe-msg:empty { margin-top: 0; }

/* --- Client areas ([filedeck_my_documents]) -------------------------------- */
.fdk-clients-area { margin: 0 0 2.5em; }
.fdk-clients-title { margin: 0 0 .25em; font-size: 1.35em; color: var(--fdk-ink); }
.fdk-clients-desc { margin: 0 0 1em; color: var(--fdk-muted); }
.fdk-clients-empty { color: var(--fdk-muted); }
.fdk-clients-upload { margin-top: 1em; }
.fdk-clients-upload > summary { cursor: pointer; font-weight: 600; color: var(--fdk-accent); }
.fdk-clients-upload[open] > summary { margin-bottom: .75em; }
