/*
 * ERP JC — tema verde do Desk.
 * Só sobrescreve variáveis CSS do Frappe (azul/primária -> verde). Não altera o núcleo.
 * Carregado por app_include_css / web_include_css (hooks.py).
 */

html:root,
html[data-theme="light"] {
	/* escala verde da marca (substitui a escala azul do Frappe) */
	--jc-green-50: #f1faf4;
	--jc-green-100: #e0f3e7;
	--jc-green-200: #c8e9d4;
	--jc-green-300: #a3d9b7;
	--jc-green-400: #5fbd84;
	--jc-green-500: #2e9e5b;
	/* 600 = cor primária: branco sobre ela >= 4.5:1 (F1b, WCAG AA) */
	--jc-green-600: #187a43;
	--jc-green-700: #136637;
	--jc-green-800: #0f552d;
	--jc-green-900: #0b3d21;

	--blue-50: var(--jc-green-50);
	--blue-100: var(--jc-green-100);
	--blue-200: var(--jc-green-200);
	--blue-300: var(--jc-green-300);
	--blue-400: var(--jc-green-400);
	--blue-500: var(--jc-green-500);
	--blue-600: var(--jc-green-600);
	--blue-700: var(--jc-green-700);
	--blue-800: var(--jc-green-800);
	--blue-900: var(--jc-green-900);
	--blue: var(--jc-green-600);

	--surface-blue-1: var(--jc-green-50);
	--surface-blue-2: var(--jc-green-100);
	--surface-blue-3: var(--jc-green-600);
	--ink-blue-1: var(--jc-green-50);
	--ink-blue-2: var(--jc-green-500);
	--ink-blue-3: var(--jc-green-600);
	--ink-blue-link: var(--jc-green-400);
	--outline-blue-1: var(--jc-green-300);
	--focus-blue: 0px 0px 0px 2px var(--jc-green-400);

	/* primária / marca */
	--primary: var(--jc-green-600);
	--primary-color: var(--jc-green-600);
	--primary-light: var(--jc-green-100);
	--brand-color: var(--jc-green-600);
	--btn-primary: var(--jc-green-600);
	--border-primary: var(--jc-green-600);
	--focus-default: 0px 0px 0px 2px var(--jc-green-600);
	--checkbox-focus-shadow: 0 0 0 2px var(--jc-green-600);
	--highlight-shadow: 1px 1px 10px var(--jc-green-50), 0px 0px 4px var(--jc-green-600);

	/* F1b — cores nativas do Frappe abaixo de 4.5:1 */
	--alert-text-success: var(--jc-green-700);
	--alert-text-warning: #8a5a00;
	--text-on-yellow: #8a5a00;
}

html[data-theme="dark"] {
	/* A escala --blue-* NÃO é invertida no escuro: o Frappe usa --blue-900 como fundo escuro
	   (ex.: toast de informação). Inverter deixou texto branco sobre verde-claro (F1b). */
	--surface-blue-1: #10301d;
	--surface-blue-2: #154026;
	--surface-blue-3: #3fb26c;
	--ink-blue-1: #10301d;
	--ink-blue-2: #3fb26c;
	--ink-blue-3: #4cc27b;
	--ink-blue-link: #6fd296;

	--primary: #3fb26c; /* usado como texto/realce sobre fundo escuro */
	--primary-color: #3fb26c;
	--brand-color: #3fb26c;
	--btn-primary: var(--jc-green-600); /* fundo do botão com texto branco */
	--border-primary: #3fb26c;
	--focus-default: 0px 0px 0px 2px #3fb26c;
	--checkbox-focus-shadow: 0 0 0 2px #3fb26c;

	--bg-yellow: #8a5904; /* pill amarela: texto claro sobre este fundo >= 4.5:1 */

	/* o bloco claro (html:root) também vale no escuro e vence o [data-theme=dark] do Frappe:
	   devolve os valores escuros do Frappe para o que foi ajustado no claro */
	--alert-text-success: var(--green-300);
	--alert-text-warning: var(--yellow-300);
	--text-on-yellow: var(--yellow-50);
}

/* badge secundário do Bootstrap (#7c7c7c fixo): 4.17:1 com branco */
.badge-secondary {
	background-color: #6b6b6b;
	color: #fff;
}

/* foco dos campos: o Bootstrap usa cinza 25% (1.3:1); usa o anel do tema */
.form-control:focus,
.form-control:focus-visible {
	box-shadow: var(--focus-default) !important;
}

/* botões primários: fundo verde e texto branco nos dois temas */
.btn-primary,
.btn.btn-primary {
	background-color: var(--btn-primary);
	border-color: var(--btn-primary);
	color: #fff;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn.btn-primary:hover {
	background-color: var(--jc-green-700, #17733e);
	border-color: var(--jc-green-700, #17733e);
	color: #fff;
}

/* links e textos "primários" */
.text-primary,
a.text-primary {
	color: var(--primary) !important;
}
.bg-primary {
	background-color: var(--primary) !important;
}

/* tela de login: o Frappe usa --gray-900 direto no botão */
.page-card .page-card-actions .btn-login,
.page-card .page-card-actions .btn-ldap-login {
	background: var(--btn-primary) !important;
}
.page-card .page-card-actions .btn-login:hover,
.page-card .page-card-actions .btn-login:focus,
.page-card .page-card-actions .btn-login:active {
	background: var(--jc-green-700, #17733e) !important;
}