/* Styles généraux pour l'application HomeBank */
/* NOTE: keep this file UTF-8 (no UTF-16 BOM), otherwise collectstatic fails in prod. */

body {
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Theme-aware utility surfaces (avoid Bootstrap bg-light in dark) */
.hb-surface-1 {
	background-color: var(--color-surface) !important;
	color: var(--color-text);
	border-color: var(--color-border);
}

.hb-surface-2 {
	background-color: var(--color-surface-2) !important;
	color: var(--color-text);
	border-color: var(--color-border);
}

.hb-surface-3 {
	background-color: var(--color-surface-3) !important;
	color: var(--color-text);
	border-color: var(--color-border);
}

/* Theme-aware helpers */
.hb-icon-accent {
	color: var(--color-accent) !important;
}

.hb-icon-warning {
	color: var(--warning-color) !important;
}

.hb-icon-danger {
	color: var(--danger-color) !important;
}

.hb-icon-success {
	color: var(--success-color) !important;
}

.hb-text-muted {
	color: var(--text-muted) !important;
}

.hb-category-header {
	background-color: var(--color-accent);
	color: var(--color-accent-contrast);
}

/* Choices.js (searchable selects) — theme-aware overrides */
.choices {
	position: relative;
}

/* Ensure dropdown overlays tables/headers (e.g., transactions list) */
.choices.is-open {
	z-index: 9999999;
}

.choices__list--dropdown,
.choices__list[aria-expanded] {
	z-index: 10000000;
}

/* Transactions filters accordion: allow dropdown to overflow */
#txFiltersAccordion,
#txFiltersAccordion .accordion-collapse,
#txFiltersAccordion .accordion-body {
	overflow: visible;
}

.choices__inner {
	background-color: var(--input-bg);
	color: var(--input-text);
	border: 1px solid var(--color-border);
	border-radius: 0.375rem;
	min-height: calc(1.5em + 0.75rem + 2px);
	padding: 0.375rem 0.75rem;
}

.choices.is-focused .choices__inner,
.choices.is-open .choices__inner {
	border-color: var(--color-accent);
	box-shadow: 0 0 0 0.15rem rgba(var(--info-color-rgb), 0.2);
}

.choices__input {
	background-color: transparent;
	color: var(--input-text);
	margin-bottom: 0;
}

.choices__input::placeholder {
	color: var(--color-muted);
	opacity: 0.9;
}

.choices__list--dropdown,
.choices__list[aria-expanded] {
	background-color: var(--dropdown-bg);
	color: var(--dropdown-text);
	border: 1px solid var(--color-border);
	border-radius: 0.5rem;
	overflow: hidden;
}

.choices__list--dropdown .choices__item--selectable.is-highlighted {
	background: var(--primary-gradient);
	color: var(--color-accent-contrast);
}

/* Multi-select "tags" */
.choices__list--multiple .choices__item {
	background: var(--primary-gradient);
	border: 1px solid rgba(var(--accent-rgb), 0.35);
	color: var(--color-accent-contrast);
	border-radius: 999px;
	padding: 0.25rem 0.5rem;
}

.choices__list--multiple .choices__item.is-highlighted {
	filter: brightness(0.95);
}

.choices__list--multiple .choices__item .choices__button {
	border-left: 1px solid rgba(255, 255, 255, 0.35);
	opacity: 0.85;
}

.choices__list--multiple .choices__item .choices__button:hover {
	opacity: 1;
}

/* Payee type pill (used in transactions + payee type screens) */
.tx-payee-type-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 8px;
	background: var(--color-surface-3);
	border: 1px solid var(--color-border);
	color: var(--color-text);
	font-weight: 700;
	font-size: 0.85rem;
	line-height: 1;
	user-select: none;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.10);
}

/* Classification palette helpers (global, theme-driven via static/themes/theme-*.css) */
.hb-class-border-left {
	border-left: 4px solid var(--hb-class-accent, var(--color-border));
}

.hb-classification--obligatoire {
	--hb-class-accent: var(--hb-class-obligatoire);
	--hb-class-accent-rgb: var(--hb-class-obligatoire-rgb);
	--hb-class-bg: var(--hb-class-obligatoire-bg);
}
.hb-classification--necessaire {
	--hb-class-accent: var(--hb-class-necessaire);
	--hb-class-accent-rgb: var(--hb-class-necessaire-rgb);
	--hb-class-bg: var(--hb-class-necessaire-bg);
}
.hb-classification--confort {
	--hb-class-accent: var(--hb-class-confort);
	--hb-class-accent-rgb: var(--hb-class-confort-rgb);
	--hb-class-bg: var(--hb-class-confort-bg);
}
.hb-classification--superflu {
	--hb-class-accent: var(--hb-class-superflu);
	--hb-class-accent-rgb: var(--hb-class-superflu-rgb);
	--hb-class-bg: var(--hb-class-superflu-bg);
}
.hb-classification--exceptionnel {
	--hb-class-accent: var(--hb-class-exceptionnel);
	--hb-class-accent-rgb: var(--hb-class-exceptionnel-rgb);
	--hb-class-bg: var(--hb-class-exceptionnel-bg);
}
.hb-classification--revenu-recurrent {
	--hb-class-accent: var(--hb-class-revenu-recurrent);
	--hb-class-accent-rgb: var(--hb-class-revenu-recurrent-rgb);
	--hb-class-bg: var(--hb-class-revenu-recurrent-bg);
}

/* Transactions list: subtle row tint + left accent bar (Option A) */
.table tbody tr.hb-row-tint > td {
	background-color: var(--hb-class-bg) !important;
}

/* Mobile transactions cards: subtle tint */
.tx-mobile-item.hb-row-tint {
	background-color: var(--hb-class-bg);
}

/* Backward-compatible hooks used by templates (ex: statistiques.html) */
.stat-card.obligatoire { border-left: 4px solid var(--hb-class-obligatoire); }
.stat-card.necessaire { border-left: 4px solid var(--hb-class-necessaire); }
.stat-card.confort { border-left: 4px solid var(--hb-class-confort); }
.stat-card.superflu { border-left: 4px solid var(--hb-class-superflu); }
.stat-card.exceptionnel { border-left: 4px solid var(--hb-class-exceptionnel); }
.stat-card.revenu-recurrent { border-left: 4px solid var(--hb-class-revenu-recurrent); }