/**
 * Midnight Theme
 *
 * Deep midnight blues with glassmorphism effects. Sleek and immersive.
 * Indigo primary, dark background, glass cards, glow shadows,
 * Inter fonts, 12px border-radius, expressive animations.
 */
@layer pkp-theme {

	/* ── Theme variable overrides ───────────────────────── */
	.pkp-theme-midnight {
		--pkp-color-primary: #818cf8;
		--pkp-color-secondary: #6366f1;
		--pkp-color-background: #0a0a0c;
		--pkp-color-surface: #141420;
		--pkp-color-text: #e2e8f0;
		--pkp-color-text-muted: #a1a1b5;
		--pkp-color-accent: #c084fc;
		--pkp-color-link: #818cf8;
		--pkp-color-link-hover: #a5b4fc;
		--pkp-color-border: #2a2a3e;
		--pkp-font-heading: 'Inter', system-ui, -apple-system, sans-serif;
		--pkp-font-body: 'Inter', system-ui, -apple-system, sans-serif;
		--pkp-border-radius: 12px;

		/* Midnight shadow/glow tokens */
		--pkp-shadow-card: 0 2px 8px rgba(0, 0, 0, 0.5);
		--pkp-shadow-card-hover: 0 0 24px rgba(129, 140, 248, 0.2);
		--pkp-shadow-glow: 0 0 20px rgba(129, 140, 248, 0.25);
		--pkp-shadow-glow-color: rgba(129, 140, 248, 0.4);

		/* Glassmorphism */
		--pkp-glass-bg: rgba(20, 20, 32, 0.7);
		--pkp-glass-blur: 16px;
		--pkp-glass-border: rgba(129, 140, 248, 0.15);

		/* Nav */
		--pkp-nav-bg: rgba(10, 10, 12, 0.7);
		--pkp-nav-blur: 16px;
	}

	/* ── Body background with subtle gradient ────────────── */
	.pkp-theme-midnight.pkp-body {
		background: linear-gradient(180deg, #0a0a0c 0%, #0d0d18 40%, #0a0a0c 100%);
		background-attachment: fixed;
	}

	/* ── Headings ─────────────────────────────────────────── */
	.pkp-theme-midnight h1,
	.pkp-theme-midnight .pkp-hero__title {
		font-family: var(--pkp-font-heading);
		font-size: 3.5rem;
		font-weight: 700;
		color: #f1f5f9;
		letter-spacing: -0.02em;
	}

	.pkp-theme-midnight h2,
	.pkp-theme-midnight .pkp-section__title {
		font-family: var(--pkp-font-heading);
		font-size: 2rem;
		font-weight: 600;
		color: #f1f5f9;
	}

	/* ── Section headings with gradient lines ─────────────── */
	.pkp-theme-midnight .pkp-section__title {
		border-bottom: none;
		text-align: center;
		position: relative;
		display: flex;
		align-items: center;
		gap: 16px;
		text-transform: uppercase;
		letter-spacing: 2px;
	}

	.pkp-theme-midnight .pkp-section__title::before,
	.pkp-theme-midnight .pkp-section__title::after {
		content: '';
		flex: 1;
		height: 1px;
		background: linear-gradient(90deg, transparent, var(--pkp-color-border), var(--pkp-color-primary), var(--pkp-color-border), transparent);
	}

	/* ── Section dividers ─────────────────────────────────── */
	.pkp-theme-midnight .pkp-section {
		padding-bottom: var(--pkp-spacing-xl);
		border-bottom: 1px solid var(--pkp-color-border);
	}

	.pkp-theme-midnight .pkp-section:last-child {
		border-bottom: none;
	}

	/* ── Hero section ─────────────────────────────────────── */
	.pkp-theme-midnight .pkp-hero {
		background: linear-gradient(180deg, #0a0a0c 0%, #12121e 100%);
	}

	.pkp-theme-midnight .pkp-hero--has-art::before {
		background: rgba(10, 10, 12, 0.55);
	}

	.pkp-theme-midnight .pkp-hero__tagline {
		color: var(--pkp-color-text-muted);
	}

	/* ── Glassmorphism Navigation ─────────────────────────── */
	.pkp-theme-midnight .pkp-nav {
		background: var(--pkp-nav-bg);
		border-bottom: 1px solid var(--pkp-glass-border);
		backdrop-filter: blur(var(--pkp-nav-blur));
		-webkit-backdrop-filter: blur(var(--pkp-nav-blur));
	}

	.pkp-theme-midnight .pkp-nav__link {
		color: var(--pkp-color-text-muted);
	}

	.pkp-theme-midnight .pkp-nav__link:hover,
	.pkp-theme-midnight .pkp-nav__link:focus-visible {
		color: var(--pkp-color-primary);
		border-bottom-color: var(--pkp-color-primary);
		text-shadow: 0 0 8px var(--pkp-shadow-glow-color);
	}

	.pkp-theme-midnight .pkp-nav__link--active {
		color: var(--pkp-color-primary);
		border-bottom-color: var(--pkp-color-primary);
		text-shadow: 0 0 8px var(--pkp-shadow-glow-color);
	}

	/* ── Glass card surfaces ──────────────────────────────── */
	.pkp-theme-midnight .pkp-factsheet {
		background: var(--pkp-glass-bg);
		border: 1px solid var(--pkp-glass-border);
		backdrop-filter: blur(var(--pkp-glass-blur));
		-webkit-backdrop-filter: blur(var(--pkp-glass-blur));
		box-shadow: var(--pkp-shadow-card);
	}

	.pkp-theme-midnight .pkp-contact-card {
		background: var(--pkp-glass-bg);
		border: 1px solid var(--pkp-glass-border);
		backdrop-filter: blur(var(--pkp-glass-blur));
		-webkit-backdrop-filter: blur(var(--pkp-glass-blur));
		box-shadow: var(--pkp-shadow-card);
	}

	.pkp-theme-midnight .pkp-key-request {
		background: var(--pkp-glass-bg);
		border: 1px solid var(--pkp-glass-border);
		backdrop-filter: blur(var(--pkp-glass-blur));
		-webkit-backdrop-filter: blur(var(--pkp-glass-blur));
		box-shadow: var(--pkp-shadow-card);
	}

	/* ── Factsheet ────────────────────────────────────────── */
	.pkp-theme-midnight .pkp-factsheet__label {
		color: var(--pkp-color-primary);
	}

	.pkp-theme-midnight .pkp-factsheet__item {
		border-bottom-color: var(--pkp-color-border);
	}

	.pkp-theme-midnight .pkp-factsheet__social {
		border-top-color: var(--pkp-color-border);
	}

	.pkp-theme-midnight .pkp-factsheet__social-link {
		background: rgba(129, 140, 248, 0.06);
		border-color: var(--pkp-color-border);
		color: var(--pkp-color-text-muted);
	}

	.pkp-theme-midnight .pkp-factsheet__social-link:hover,
	.pkp-theme-midnight .pkp-factsheet__social-link:focus-visible {
		color: var(--pkp-color-primary);
		border-color: var(--pkp-color-primary);
		box-shadow: 0 0 10px rgba(129, 140, 248, 0.15);
	}

	/* ── Screenshot grid with glow hover ──────────────────── */
	.pkp-theme-midnight .pkp-screenshots-grid {
		gap: 6px;
	}

	.pkp-theme-midnight .pkp-screenshot {
		background: var(--pkp-color-surface);
		border: 1px solid var(--pkp-color-border);
		box-shadow: var(--pkp-shadow-card);
		transition: transform var(--pkp-transition-fast), box-shadow var(--pkp-transition-fast), border-color var(--pkp-transition-fast);
	}

	.pkp-theme-midnight .pkp-screenshot:hover {
		box-shadow: var(--pkp-shadow-glow);
		border-color: rgba(129, 140, 248, 0.3);
	}

	.pkp-theme-midnight .pkp-screenshot__caption {
		background: var(--pkp-color-surface);
		color: var(--pkp-color-text-muted);
	}

	/* ── Key Art ───────────────────────────────────────────── */
	.pkp-theme-midnight .pkp-keyart {
		background: var(--pkp-color-surface);
		border: 1px solid var(--pkp-color-border);
		box-shadow: var(--pkp-shadow-card);
		transition: transform var(--pkp-transition-fast), box-shadow var(--pkp-transition-fast), border-color var(--pkp-transition-fast);
	}

	.pkp-theme-midnight .pkp-keyart:hover {
		box-shadow: var(--pkp-shadow-glow);
		border-color: rgba(129, 140, 248, 0.3);
	}

	/* ── Logos ─────────────────────────────────────────────── */
	.pkp-theme-midnight .pkp-logo {
		background: var(--pkp-color-surface);
		border: 1px solid var(--pkp-color-border);
		box-shadow: var(--pkp-shadow-card);
		transition: transform var(--pkp-transition-fast), box-shadow var(--pkp-transition-fast), border-color var(--pkp-transition-fast);
	}

	.pkp-theme-midnight .pkp-logo:hover {
		box-shadow: var(--pkp-shadow-glow);
		border-color: rgba(129, 140, 248, 0.3);
	}

	.pkp-theme-midnight .pkp-logo__preview--checkered {
		background-image: repeating-conic-gradient(#141420 0% 25%, #1a1a2e 0% 50%);
		background-size: 16px 16px;
	}

	.pkp-theme-midnight .pkp-logo__preview--dark {
		background: #0a0a0c;
	}

	.pkp-theme-midnight .pkp-logo__info {
		border-top-color: var(--pkp-color-border);
	}

	.pkp-theme-midnight .pkp-logo__format {
		background: rgba(129, 140, 248, 0.1);
		color: var(--pkp-color-primary);
	}

	/* ── GIFs ─────────────────────────────────────────────── */
	.pkp-theme-midnight .pkp-gif {
		background: var(--pkp-color-surface);
		border: 1px solid var(--pkp-color-border);
		box-shadow: var(--pkp-shadow-card);
		transition: transform var(--pkp-transition-fast), box-shadow var(--pkp-transition-fast), border-color var(--pkp-transition-fast);
	}

	.pkp-theme-midnight .pkp-gif:hover {
		box-shadow: var(--pkp-shadow-glow);
		border-color: rgba(129, 140, 248, 0.3);
	}

	.pkp-theme-midnight .pkp-gif__caption {
		background: var(--pkp-color-surface);
		color: var(--pkp-color-text-muted);
	}

	/* ── B-Roll items ─────────────────────────────────────── */
	.pkp-theme-midnight .pkp-broll-item {
		background: var(--pkp-color-surface);
		border: 1px solid var(--pkp-color-border);
		box-shadow: var(--pkp-shadow-card);
	}

	.pkp-theme-midnight .pkp-broll-item:hover {
		background: #1a1a2e;
		border-color: rgba(129, 140, 248, 0.2);
	}

	.pkp-theme-midnight .pkp-broll-item__icon {
		background: var(--pkp-color-primary);
		box-shadow: 0 0 12px rgba(129, 140, 248, 0.3);
	}

	/* ── Trailer embeds ───────────────────────────────────── */
	.pkp-theme-midnight .pkp-trailer__embed {
		border: 1px solid var(--pkp-color-border);
		box-shadow: var(--pkp-shadow-card);
	}

	/* ── Primary buttons ──────────────────────────────────── */
	.pkp-theme-midnight .pkp-btn--primary {
		background: var(--pkp-color-primary);
		border-color: var(--pkp-color-primary);
		color: #0a0a0c;
		box-shadow: var(--pkp-shadow-card);
		transition: background var(--pkp-transition-fast), box-shadow var(--pkp-transition-fast), transform var(--pkp-transition-fast);
	}

	.pkp-theme-midnight .pkp-btn--primary:hover,
	.pkp-theme-midnight .pkp-btn--primary:focus-visible {
		background: #a5b4fc;
		border-color: #a5b4fc;
		box-shadow: var(--pkp-shadow-glow);
		transform: translateY(var(--pkp-hover-lift));
	}

	/* ── Outline buttons ──────────────────────────────────── */
	.pkp-theme-midnight .pkp-btn--outline {
		color: var(--pkp-color-primary);
		background: transparent;
		border: 1px solid var(--pkp-color-primary);
		transition: background var(--pkp-transition-fast), color var(--pkp-transition-fast), box-shadow var(--pkp-transition-fast);
	}

	.pkp-theme-midnight .pkp-btn--outline:hover,
	.pkp-theme-midnight .pkp-btn--outline:focus-visible {
		background: rgba(129, 140, 248, 0.1);
		color: #a5b4fc;
		border-color: #a5b4fc;
		box-shadow: var(--pkp-shadow-glow);
	}

	/* ── Copy button ──────────────────────────────────────── */
	.pkp-theme-midnight .pkp-copy-btn {
		border-color: var(--pkp-color-border);
		color: var(--pkp-color-text-muted);
	}

	.pkp-theme-midnight .pkp-copy-btn:hover,
	.pkp-theme-midnight .pkp-copy-btn:focus-visible {
		border-color: var(--pkp-color-primary);
		color: var(--pkp-color-primary);
		background: rgba(129, 140, 248, 0.06);
		box-shadow: 0 0 10px rgba(129, 140, 248, 0.1);
	}

	/* ── Awards ────────────────────────────────────────────── */
	.pkp-theme-midnight .pkp-award {
		border-bottom-color: var(--pkp-color-border);
	}

	.pkp-theme-midnight .pkp-award__icon {
		background: rgba(129, 140, 248, 0.1);
		color: var(--pkp-color-primary);
	}

	.pkp-theme-midnight .pkp-award__result {
		background: rgba(129, 140, 248, 0.1);
		color: var(--pkp-color-primary);
	}

	/* ── Credits ───────────────────────────────────────────── */
	.pkp-theme-midnight .pkp-credit {
		border-bottom-color: var(--pkp-color-border);
	}

	/* ── Team ──────────────────────────────────────────────── */
	.pkp-theme-midnight .pkp-team-member__photo {
		box-shadow: 0 0 0 2px var(--pkp-color-border);
	}

	.pkp-theme-midnight .pkp-team-member__photo--placeholder {
		background: var(--pkp-color-surface);
		border-color: var(--pkp-color-border);
	}

	.pkp-theme-midnight .pkp-team-member__role {
		color: var(--pkp-color-primary);
	}

	.pkp-theme-midnight .pkp-team-member__social-link {
		background: rgba(129, 140, 248, 0.06);
		border-color: var(--pkp-color-border);
		color: var(--pkp-color-text-muted);
	}

	.pkp-theme-midnight .pkp-team-member__social-link:hover,
	.pkp-theme-midnight .pkp-team-member__social-link:focus-visible {
		color: var(--pkp-color-primary);
		border-color: var(--pkp-color-primary);
		box-shadow: 0 0 10px rgba(129, 140, 248, 0.15);
	}

	/* ── Contact card ─────────────────────────────────────── */
	.pkp-theme-midnight .pkp-contact-card__social {
		border-top-color: var(--pkp-color-border);
	}

	.pkp-theme-midnight .pkp-contact-card__social-link {
		background: rgba(129, 140, 248, 0.06);
		border-color: var(--pkp-color-border);
		color: var(--pkp-color-text-muted);
	}

	.pkp-theme-midnight .pkp-contact-card__social-link:hover {
		color: var(--pkp-color-primary);
		border-color: var(--pkp-color-primary);
		box-shadow: 0 0 10px rgba(129, 140, 248, 0.15);
	}

	/* ── Description section ──────────────────────────────── */
	.pkp-theme-midnight .pkp-description__tagline {
		color: #f1f5f9;
	}

	/* ── Footer ────────────────────────────────────────────── */
	.pkp-theme-midnight .pkp-footer {
		border-top-color: var(--pkp-color-border);
	}

	/* ── Section header title (within flex header) ─────────── */
	.pkp-theme-midnight .pkp-section-header .pkp-section__title {
		text-align: left;
	}

	.pkp-theme-midnight .pkp-section-header .pkp-section__title::before {
		display: none;
	}

	.pkp-theme-midnight .pkp-section-header .pkp-section__title::after {
		flex: 1;
	}

	/* ── Selection color ──────────────────────────────────── */
	.pkp-theme-midnight ::selection {
		background: var(--pkp-color-primary);
		color: #0a0a0c;
	}

	/* ── Empty state ──────────────────────────────────────── */
	.pkp-theme-midnight .pkp-empty {
		background: var(--pkp-color-surface);
		border: 1px solid var(--pkp-color-border);
		color: var(--pkp-color-text-muted);
	}

	/* ── Hamburger menu (mobile) ──────────────────────────── */
	.pkp-theme-midnight .pkp-nav__toggle {
		color: var(--pkp-color-text-muted);
	}

	.pkp-theme-midnight .pkp-nav__toggle:hover,
	.pkp-theme-midnight .pkp-nav__toggle:focus-visible {
		color: var(--pkp-color-primary);
	}

	/* ── Respect prefers-reduced-motion ────────────────────── */
	@media (prefers-reduced-motion: reduce) {
		.pkp-theme-midnight .pkp-screenshot,
		.pkp-theme-midnight .pkp-gif,
		.pkp-theme-midnight .pkp-btn--primary,
		.pkp-theme-midnight .pkp-btn--outline {
			transition: none;
		}

		.pkp-theme-midnight .pkp-screenshot:hover,
		.pkp-theme-midnight .pkp-gif:hover,
		.pkp-theme-midnight .pkp-btn--primary:hover,
		.pkp-theme-midnight .pkp-btn--primary:focus-visible {
			transform: none;
		}
	}
}