/* ============================================================================
   LLMIC — Enhancements: share rail, lightbox, newsletter, mobile TOC, syntax
   ========================================================================== */

/* --- Social share rail -------------------------------------------------- */
.llmic-share {
	display: flex;
	gap: var(--space-2xs);
}
.llmic-share__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.9rem;
	height: 2.9rem;
	border-radius: var(--radius-pill);
	border: 1px solid var(--line-strong);
	background: var(--surface-1);
	color: var(--ink);
	cursor: pointer;
	transition: color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), transform var(--dur-base) var(--ease-spring);
}
.llmic-share__btn:hover {
	color: var(--accent-ink);
	background: var(--accent);
	border-color: var(--accent);
	transform: translateY(-3px);
}
.llmic-share__btn svg { width: 1.35rem; height: 1.35rem; }
.llmic-share__btn.is-copied { color: var(--accent-ink); background: var(--accent); border-color: var(--accent); }

/* A floating share pill, fixed at the bottom-left (clears back-to-top on the
   right and the download bar in the centre). */
.llmic-share--rail {
	position: fixed;
	left: var(--space-m);
	bottom: var(--space-m);
	flex-direction: row;
	gap: var(--space-3xs);
	padding: 0.3rem;
	z-index: var(--llmic-z-floating);
	background: var(--surface-glass);
	-webkit-backdrop-filter: saturate(180%) blur(var(--chrome-blur));
	backdrop-filter: saturate(180%) blur(var(--chrome-blur));
	border: 1px solid var(--line);
	border-radius: var(--radius-pill);
	box-shadow: var(--shadow-2);
}
@media (max-width: 700px) { .llmic-share--rail { display: none; } }

/* Inline share (mobile only — the bottom pill covers larger screens). */
.llmic-share--inline { display: inline-flex; }
.llmic-share--inline .llmic-share__btn { width: 2.1rem; height: 2.1rem; }
@media (min-width: 701px) { .llmic-share--inline { display: none; } }

/* --- Sticky download dock (bottom-centre, site-wide) -------------------- */
.llmic-dock {
	position: fixed;
	left: 50%;
	bottom: var(--space-m);
	z-index: var(--llmic-z-floating);
	display: flex;
	align-items: center;
	gap: var(--space-s);
	max-width: calc(100vw - 2rem);
	padding: 0.55rem 0.6rem 0.55rem 0.6rem;
	background: var(--surface-glass);
	-webkit-backdrop-filter: saturate(180%) blur(var(--chrome-blur));
	backdrop-filter: saturate(180%) blur(var(--chrome-blur));
	border: 1px solid var(--line);
	border-radius: var(--radius-l);
	box-shadow: var(--shadow-2), 0 0 0 1px color-mix(in srgb, var(--accent) 10%, transparent), 0 18px 50px color-mix(in srgb, var(--accent) 16%, transparent);
	opacity: 0;
	transform: translateX(-50%) translateY(140%);
	transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-slow) var(--ease-spring);
}
.llmic-dock.is-visible { opacity: 1; transform: translateX(-50%) translateY(0); }
.llmic-dock__icon {
	flex: none;
	width: 2.7rem;
	height: 2.7rem;
	border-radius: var(--radius-m);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: linear-gradient(140deg, var(--brand-400), var(--accent) 45%, var(--brand-600));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), var(--shadow-1);
}
.llmic-dock__icon svg { width: 1.55rem; height: 1.55rem; }
.llmic-dock__text { font-size: var(--step--1); line-height: 1.25; padding-right: var(--space-2xs); }
.llmic-dock__text strong { display: block; font-weight: 700; color: var(--ink); font-size: var(--step-0); letter-spacing: var(--tracking-tight); }
.llmic-dock__text span { color: var(--ink-3); }
.llmic-dock__btn {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 0.45em;
	background: linear-gradient(140deg, var(--accent), var(--brand-600));
	color: #fff;
	font-weight: 700;
	padding: 0.7em 1.3em;
	border-radius: var(--radius-m);
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 4px 16px color-mix(in srgb, var(--accent) 42%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.25);
	transition: transform var(--dur-fast) var(--ease-out), filter var(--dur-fast) var(--ease-out);
}
.llmic-dock__btn:hover { color: #fff; transform: translateY(-2px); filter: brightness(1.06) saturate(1.05); }
.llmic-dock__btn:active { transform: translateY(0); }
.llmic-dock__close {
	flex: none;
	width: 1.9rem; height: 1.9rem;
	border-radius: 50%;
	border: 0;
	background: transparent;
	color: var(--ink-3);
	cursor: pointer;
	font-size: 1.2rem;
	line-height: 1;
	transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.llmic-dock__close:hover { color: var(--ink); background: var(--surface-2); }
@media (max-width: 600px) {
	.llmic-dock { left: var(--space-2xs); right: var(--space-2xs); bottom: var(--space-2xs); max-width: none; gap: var(--space-2xs); padding: 0.5rem; transform: translateY(140%); }
	.llmic-dock.is-visible { transform: translateY(0); }
	.llmic-dock__text span { display: none; }
	.llmic-dock__btn { padding: 0.7em 1em; }
	/* Lift back-to-top clear of the full-width dock. */
	.llmic-top { bottom: calc(var(--space-m) + 4rem); }
}

/* --- Image lightbox ----------------------------------------------------- */
.entry-content img { cursor: zoom-in; }
.entry-content a img { cursor: pointer; }
.llmic-lightbox {
	position: fixed;
	inset: 0;
	z-index: var(--llmic-z-overlay);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--space-l);
	background: rgba(6, 9, 16, 0.86);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--dur-base) var(--ease-out);
	cursor: zoom-out;
}
.llmic-lightbox.is-open { opacity: 1; pointer-events: auto; }
.llmic-lightbox img {
	max-width: min(96vw, 1400px);
	max-height: 92vh;
	border-radius: var(--radius-m);
	box-shadow: var(--shadow-2);
	transform: scale(0.97);
	transition: transform var(--dur-base) var(--ease-spring);
}
.llmic-lightbox.is-open img { transform: scale(1); }
.llmic-lightbox__close {
	position: absolute;
	top: var(--space-m);
	right: var(--space-m);
	width: 2.6rem; height: 2.6rem;
	border-radius: var(--radius-pill);
	border: 1px solid rgba(255,255,255,0.25);
	background: rgba(255,255,255,0.12);
	color: #fff;
	font-size: 1.3rem;
	cursor: pointer;
}

/* --- Newsletter --------------------------------------------------------- */
.llmic-newsletter {
	max-width: var(--measure);
	margin: var(--space-xl) auto;
	padding: var(--space-l);
	border-radius: var(--radius-xl);
	border: 1px solid var(--line);
	background: var(--surface-1);
	text-align: center;
	box-shadow: var(--shadow-1);
}
.llmic-newsletter__title { font-size: var(--step-2); margin: 0 0 var(--space-2xs); }
.llmic-newsletter__text { color: var(--ink-2); margin: 0 auto var(--space-m); max-width: 46ch; }
.llmic-newsletter__form { display: flex; gap: var(--space-2xs); max-width: 30rem; margin: 0 auto; }
.llmic-newsletter__form input[type="email"] { flex: 1; }
.llmic-newsletter__form button {
	flex: none; font: inherit; font-weight: 600; padding: 0.6em 1.3em;
	border-radius: var(--radius-m); border: 0; background: var(--accent); color: var(--accent-ink); cursor: pointer;
}
.llmic-newsletter__form button:hover { background: var(--accent-hover); }

/* --- Syntax highlighting (highlight.js, token-matched to our palette) ---- */
.entry-content code.hljs { background: transparent; padding: 0; color: var(--code-ink); }
.hljs-comment, .hljs-quote { color: var(--ink-3); font-style: italic; }
.hljs-keyword, .hljs-selector-tag, .hljs-literal, .hljs-type, .hljs-section { color: var(--accent-strong); font-weight: 600; }
.hljs-string, .hljs-doctag, .hljs-regexp, .hljs-addition { color: #18a058; }
.hljs-number, .hljs-symbol, .hljs-bullet, .hljs-deletion { color: #c0468a; }
.hljs-title, .hljs-title.function_, .hljs-name { color: #2b6fd6; }
.hljs-attr, .hljs-attribute, .hljs-variable, .hljs-template-variable { color: #b5660b; }
.hljs-built_in, .hljs-class .hljs-title { color: #2b6fd6; }
.hljs-tag { color: var(--ink-2); }
.hljs-meta { color: var(--ink-3); }
.hljs-emphasis { font-style: italic; }
.hljs-strong { font-weight: 700; }
[data-theme="dark"] .hljs-keyword, [data-theme="dark"] .hljs-selector-tag, [data-theme="dark"] .hljs-literal { color: var(--brand-400); }
[data-theme="dark"] .hljs-string, [data-theme="dark"] .hljs-doctag { color: #5fd39a; }
[data-theme="dark"] .hljs-number, [data-theme="dark"] .hljs-symbol { color: #f08fbf; }
[data-theme="dark"] .hljs-title, [data-theme="dark"] .hljs-built_in, [data-theme="dark"] .hljs-name { color: #79b8ff; }
[data-theme="dark"] .hljs-attr, [data-theme="dark"] .hljs-variable { color: #e0a85a; }

/* --- RTL baseline ------------------------------------------------------- */
[dir="rtl"] .llmic-takeaways,
[dir="rtl"] .llmic-callout,
[dir="rtl"] .entry-content blockquote { border-left: 0; border-right: 3px solid var(--accent); padding-left: 0; padding-right: var(--space-m); }
[dir="rtl"] .llmic-toc { border-left: 0; border-right: 1px solid var(--line); padding-left: 0; padding-right: var(--space-s); }
[dir="rtl"] .llmic-checklist li { padding-left: 0; padding-right: 2em; }
[dir="rtl"] .llmic-checklist li::before { left: auto; right: 0; }
[dir="rtl"] .llmic-checklist li::after { left: auto; right: 0.46em; }
[dir="rtl"] .llmic-copy { right: auto; left: 0.6rem; }
[dir="rtl"] .llmic-top { right: auto; left: var(--space-m); }
[dir="rtl"] .llmic-share--rail { left: auto; right: var(--space-m); }