/* good_event brand overlay applied to public web pages.
 * Forces light mode and overrides Frappe-UI tokens so the Good Event palette
 * stays readable regardless of the visitor's prefers-color-scheme.
 *
 * CSS custom property definitions live in theme.py ::BASE_CSS (configurable
 * via Good Event Settings). This file only overrides Frappe-UI's compiled
 * Tailwind utility classes — do not duplicate --ea-* variables here.
 */
:root, html, body {
	color-scheme: light only !important;
}

/* Frappe-UI surface + ink tokens, forced to light values everywhere — the
 * [data-theme="dark"] selector below wins on specificity, so we override it. */
:root, [data-theme="light"], [data-theme="dark"], [data-theme], html, body {
	--bg-color: #ffffff !important;
	--surface-white: #ffffff !important;
	--surface-gray-1: #f7f8f9 !important;
	--surface-gray-2: #f1f2f4 !important;
	--surface-gray-3: #e7e9ec !important;
	--surface-gray-4: #d1d4d9 !important;
	--surface-gray-5: #b9bdc4 !important;
	--surface-cards: #ffffff !important;
	--surface-modal-section: #ffffff !important;
	--surface-menu-bar: #ffffff !important;
	--surface-pill-gray-1: #f1f2f4 !important;
	--ink-gray-1: #6b6f76 !important;
	--ink-gray-2: #5b6068 !important;
	--ink-gray-3: #4a4f57 !important;
	--ink-gray-4: #3c4047 !important;
	--ink-gray-5: #2e3238 !important;
	--ink-gray-6: #232629 !important;
	--ink-gray-7: #1d1d1d !important;
	--ink-gray-8: #1d1d1d !important;
	--ink-gray-9: #1d1d1d !important;
	--ink-white: #ffffff !important;
	--outline-gray-1: #e4e4e4 !important;
	--outline-gray-2: #d8d8d8 !important;
	--outline-gray-3: #c4c4c4 !important;
	--outline-gray-modals: #e4e4e4 !important;
	--green-500: var(--ea-primary) !important;
	--green-600: var(--ea-primary) !important;
	--green-700: var(--ea-primary) !important;
	--blue-500: var(--ea-accent) !important;
	--blue-600: var(--ea-accent) !important;
}

/* Hard force any prefers-color-scheme: dark to be ignored. */
@media (prefers-color-scheme: dark) {
	:root, html, body { color-scheme: light only !important; }
	html, body { background-color: #ffffff !important; color: #1d1d1d !important; }
}

html, body { background-color: #ffffff !important; color: #1d1d1d !important; }

/* Frappe-UI Tailwind utility classes are compiled with literal RGB — overriding the
 * CSS variables alone doesn't help. We have to re-declare the classes themselves. */
.bg-surface-white { background-color: #ffffff !important; }
.bg-surface-cards { background-color: #ffffff !important; }
.bg-surface-modal-section { background-color: #ffffff !important; }
.bg-surface-menu-bar { background-color: #ffffff !important; }
.bg-surface-gray-1 { background-color: #f7f8f9 !important; }
.bg-surface-gray-2 { background-color: #f1f2f4 !important; }
.bg-surface-gray-3 { background-color: #e7e9ec !important; }
.bg-surface-gray-4 { background-color: #d1d4d9 !important; }
.bg-surface-pill-gray-1 { background-color: #f1f2f4 !important; }

.text-ink-gray-1 { color: #6b6f76 !important; }
.text-ink-gray-2 { color: #5b6068 !important; }
.text-ink-gray-3 { color: #4a4f57 !important; }
.text-ink-gray-4 { color: #3c4047 !important; }
.text-ink-gray-5 { color: #2e3238 !important; }
.text-ink-gray-6 { color: #232629 !important; }
.text-ink-gray-7 { color: #1d1d1d !important; }
.text-ink-gray-8 { color: #1d1d1d !important; }
.text-ink-gray-9 { color: #1d1d1d !important; }
.text-ink-white { color: #ffffff !important; }

.border-outline-gray-1 { border-color: #e4e4e4 !important; }
.border-outline-gray-2 { border-color: #d8d8d8 !important; }
.border-outline-gray-3 { border-color: #c4c4c4 !important; }

/* Form controls inside the SPA — match light theme */
.dashboard input, .dashboard select, .dashboard textarea,
input.form-input, select.form-input, textarea.form-input {
	background-color: #ffffff !important;
	color: #1d1d1d !important;
	border-color: #e4e4e4 !important;
}

/* Primary buttons / links pick up the brand */
.text-green-500, .text-green-600, .text-green-700 { color: var(--ea-primary) !important; }
.bg-green-500, .bg-green-600, .bg-green-700 { background-color: var(--ea-primary) !important; }
.border-green-500, .border-green-600 { border-color: var(--ea-primary) !important; }

/* Hide embedded app navs when public content is wrapped in the good_event shell. */
body #app nav,
body #app > div > div > div:has(> nav),
body #app .border-b:has(> nav) { display: none !important; border-bottom: 0 !important; height: 0 !important; }

/* Brand checkout submit buttons like the event-detail CTAs. */
#app button.ea-dashboard-primary-submit,
#app button.bg-surface-gray-7,
#app button.hover\:bg-surface-gray-6:hover,
#app button.active\:bg-surface-gray-5:active {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 0.5rem !important;
	min-height: 44px !important;
	padding: 10px 18px !important;
	border: 0 !important;
	border-radius: 8px !important;
	background-color: var(--ea-primary) !important;
	color: #ffffff !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-align: center !important;
	transition: background-color 0.15s ease !important;
}
#app button.ea-dashboard-primary-submit:hover,
#app button.bg-surface-gray-7:hover {
	background-color: var(--ea-secondary) !important;
	color: #ffffff !important;
}
#app button.ea-dashboard-primary-submit:focus-visible {
	outline: 2px solid var(--ea-primary) !important;
	outline-offset: 2px !important;
}
#app .ea-attendee-identity-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	column-gap: 2rem !important;
	row-gap: 1.5rem !important;
	align-items: end;
}
@media (max-width: 767px) {
	#app .ea-attendee-identity-grid {
		grid-template-columns: 1fr !important;
		column-gap: 0 !important;
		row-gap: 1rem !important;
	}
}
#app .ea-dashboard-subsidy-note {
	position: relative;
	display: inline-flex;
	justify-content: center;
	width: 100%;
	margin: 0.5rem 0 0;
	line-height: 1.2;
}
#app .ea-dashboard-subsidy-trigger {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	min-height: 1.75rem;
	padding: 0.25rem 0.75rem;
	border: 1px solid var(--ea-primary);
	border-radius: 999px;
	background: var(--ea-surface);
	color: var(--ea-primary) !important;
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	transition:
		border-color 0.15s ease,
		background-color 0.15s ease,
		color 0.15s ease;
}
#app .ea-dashboard-subsidy-trigger:hover,
#app .ea-dashboard-subsidy-trigger:focus-visible {
	border-color: var(--ea-primary);
	background: var(--ea-primary-soft);
	color: var(--ea-primary) !important;
	text-decoration: none;
	outline: none;
}
#app .ea-dashboard-subsidy-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-style: normal;
	color: currentColor;
}
#app .ea-dashboard-subsidy-icon-svg {
	display: block;
	width: 1.125rem;
	height: 1.125rem;
}
#app .ea-dashboard-subsidy-tooltip {
	position: absolute;
	left: 50%;
	bottom: calc(100% + 8px);
	z-index: 20;
	width: max-content;
	max-width: min(420px, calc(100vw - 32px));
	padding: 8px 10px;
	border-radius: 6px;
	background: #1d1d1d;
	color: #ffffff;
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1.35;
	text-align: left;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, 2px);
	transition:
		opacity 0.15s ease,
		transform 0.15s ease;
}
#app .ea-dashboard-subsidy-tooltip::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 100%;
	transform: translateX(-50%);
	border: 5px solid transparent;
	border-top-color: #1d1d1d;
}
#app .ea-dashboard-subsidy-trigger:hover .ea-dashboard-subsidy-tooltip,
#app .ea-dashboard-subsidy-trigger:focus-visible .ea-dashboard-subsidy-tooltip {
	opacity: 1;
	transform: translate(-50%, 0);
}
.bg-surface-gray-7 { background-color: #2e3238 !important; }
.bg-surface-gray-6 { background-color: #232629 !important; }
.text-surface-gray-7, .text-surface-gray-9 { color: #1d1d1d !important; }