/* TooGreen Cookie Consent — styled to match the toogreen-warp theme */

.tgc-root {
	--tgc-bg: #0d0f17;
	--tgc-fg: #f4f3ec;
	--tgc-muted: #a6a9b6;
	--tgc-line: rgba(244, 243, 236, 0.14);
	--tgc-accent: #c6ff3d;
	--tgc-accent-fg: #07080d;
	--tgc-focus: #2ef2d0;
	--tgc-shadow: 0 24px 60px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(139, 108, 255, 0.25);
	font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
	color: var(--tgc-fg);
	box-sizing: border-box;
}
html[data-theme="light"] .tgc-root {
	--tgc-bg: #fffef8;
	--tgc-fg: #07080d;
	--tgc-muted: #555a66;
	--tgc-line: rgba(7, 8, 13, 0.14);
	--tgc-accent: #07080d;
	--tgc-accent-fg: #f4f3ec;
	--tgc-focus: #8b6cff;
	--tgc-shadow: 0 20px 50px rgba(7, 8, 13, 0.18), 0 0 0 1px rgba(7, 8, 13, 0.08);
}
.tgc-root *, .tgc-root *::before, .tgc-root *::after { box-sizing: inherit; }

/* Banner */
.tgc-banner {
	position: fixed;
	z-index: 100001; /* above admin bar (99999) and the A-ADS frame (99998) */
	left: 16px;
	right: 16px;
	bottom: 16px;
	max-width: 560px;
	max-height: calc(100vh - 32px);
	overflow-y: auto;
	padding: 20px 22px 18px;
	background: var(--tgc-bg);
	border: 1px solid var(--tgc-line);
	border-radius: 16px;
	box-shadow: var(--tgc-shadow);
	font-size: 15px;
	line-height: 1.5;
}
@media (prefers-reduced-motion: no-preference) {
	.tgc-banner { animation: tgc-in 0.35s cubic-bezier(0.2, 0.8, 0.2, 1); }
}
@keyframes tgc-in {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: none; }
}

.tgc-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.tgc-head__tools { display: flex; align-items: center; gap: 6px; }
.tgc-kicker {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 12px;
	letter-spacing: 0.04em;
	color: var(--tgc-accent);
	text-transform: uppercase;
}
html[data-theme="light"] .tgc-kicker { color: #6a4fe0; }

.tgc-lang, .tgc-x {
	font: 500 12px/1 "JetBrains Mono", ui-monospace, monospace;
	color: var(--tgc-muted);
	background: transparent;
	border: 1px solid var(--tgc-line);
	border-radius: 999px;
	padding: 6px 10px;
	cursor: pointer;
}
.tgc-x { font-size: 16px; padding: 4px 9px; }
.tgc-lang:hover, .tgc-x:hover { color: var(--tgc-fg); border-color: var(--tgc-fg); }

.tgc-title {
	font: 600 20px/1.25 "Space Grotesk", Inter, system-ui, sans-serif;
	margin: 0 0 8px;
	color: var(--tgc-fg);
}
.tgc-desc { margin: 0 0 14px; color: var(--tgc-muted); }
.tgc-link { color: var(--tgc-fg); text-decoration: underline; text-underline-offset: 3px; }

/* Categories */
.tgc-panel { border-top: 1px solid var(--tgc-line); margin: 0 0 14px; }
.tgc-panel[hidden] { display: none; }
.tgc-cat { padding: 12px 0; border-bottom: 1px solid var(--tgc-line); }
.tgc-cat__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; }
div.tgc-cat__row { cursor: default; }
.tgc-cat__title { font-weight: 600; color: var(--tgc-fg); }
.tgc-cat__desc { margin: 4px 0 0; font-size: 13px; color: var(--tgc-muted); }
.tgc-badge {
	font: 500 11px/1 "JetBrains Mono", ui-monospace, monospace;
	color: var(--tgc-muted);
	border: 1px solid var(--tgc-line);
	border-radius: 999px;
	padding: 5px 8px;
	white-space: nowrap;
}

.tgc-switch {
	appearance: none;
	-webkit-appearance: none;
	flex: none;
	position: relative;
	width: 42px;
	height: 24px;
	margin: 0;
	border-radius: 999px;
	background: var(--tgc-line);
	border: 1px solid var(--tgc-line);
	cursor: pointer;
	transition: background 0.2s;
}
.tgc-switch::after {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--tgc-fg);
	transition: transform 0.2s;
}
.tgc-switch:checked { background: var(--tgc-accent); border-color: var(--tgc-accent); }
.tgc-switch:checked::after { transform: translateX(18px); background: var(--tgc-accent-fg); }

/* Buttons — Accept and Reject get equal weight on purpose */
.tgc-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.tgc-btn {
	flex: 1 1 auto;
	font: 600 14px/1 Inter, system-ui, sans-serif;
	padding: 12px 16px;
	border-radius: 10px;
	cursor: pointer;
	border: 1px solid transparent;
	transition: filter 0.15s, background 0.15s;
}
.tgc-btn--solid { background: var(--tgc-accent); color: var(--tgc-accent-fg); border-color: var(--tgc-accent); }
.tgc-btn--solid:hover { filter: brightness(1.1); }
.tgc-btn--ghost { background: transparent; color: var(--tgc-fg); border-color: var(--tgc-line); }
.tgc-btn--ghost:hover { border-color: var(--tgc-fg); }

.tgc-root button:focus-visible,
.tgc-root a:focus-visible,
.tgc-switch:focus-visible,
.tgc-placeholder button:focus-visible,
.tgc-placeholder a:focus-visible {
	outline: 2px solid var(--tgc-focus);
	outline-offset: 2px;
}

/* Floating "reopen" button */
.tgc-fab {
	position: fixed;
	z-index: 100000;
	left: 16px;
	bottom: 16px;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--tgc-bg);
	color: var(--tgc-fg);
	border: 1px solid var(--tgc-line);
	box-shadow: var(--tgc-shadow);
	cursor: pointer;
	opacity: 0.75;
	transition: opacity 0.15s;
}
.tgc-fab:hover, .tgc-fab:focus-visible { opacity: 1; }
.tgc-fab[hidden] { display: none; }

/* Blocked embeds */
.tgc-hidden { display: none !important; }
.tgc-placeholder {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: 100%;
	min-height: 200px;
	padding: 24px;
	text-align: center;
	font-family: Inter, system-ui, sans-serif;
	font-size: 14px;
	color: #f4f3ec;
	background:
		repeating-linear-gradient(135deg, rgba(139, 108, 255, 0.08) 0 12px, transparent 12px 24px),
		#0d0f17;
	border: 1px dashed rgba(244, 243, 236, 0.25);
	border-radius: 12px;
	--tgc-accent: #c6ff3d;
	--tgc-accent-fg: #07080d;
	--tgc-focus: #2ef2d0;
}
.wp-block-embed__wrapper > .tgc-placeholder { position: absolute; inset: 0; min-height: 0; }
.tgc-placeholder__text { margin: 0; max-width: 40ch; }
.tgc-placeholder .tgc-btn { flex: none; }
.tgc-placeholder__link { color: #a6a9b6; font-size: 12px; }

@media (max-width: 480px) {
	.tgc-banner { left: 10px; right: 10px; bottom: 10px; padding: 16px; }
	.tgc-btn { flex-basis: 100%; }
}
