/*
 * ISA — Design System (marca Mundo Visión Kids)
 * Tokens de marca aplicados sobre la interfaz de Frappe/ERPNext.
 * Colores, tipografías y formas alineados al WordPress de la marca.
 */

:root,
:root[data-theme="light"],
:root[data-theme="dark"] {
	/* Paleta de marca */
	--mv-navy: #1F3A8A;
	--mv-teal: #18B7B0;
	--mv-coral: #FF5D8F;
	--mv-yellow: #FFD36B;
	--mv-lavender: #DCC9FF;
	--mv-gray: #F7F8FA;
	--mv-ink: #202124;

	/* Formas */
	--mv-radius: 16px;
	--mv-radius-lg: 24px;
	--mv-radius-pill: 999px;
	--mv-shadow: 0 12px 40px rgba(31, 58, 138, 0.10);

	/* Sobrescribe variables de Frappe con la marca */
	--primary: var(--mv-navy);
	--primary-color: var(--mv-navy);
	--btn-primary: var(--mv-coral);
	--text-on-primary: #ffffff;
	--navbar-height: 56px;
	--border-radius: var(--mv-radius);
	--border-radius-md: var(--mv-radius);
	--border-radius-lg: var(--mv-radius-lg);
	--font-stack: "Nunito Sans", "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Tipografía de marca */
body,
.page-container,
.navbar,
.ellipsis {
	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

h1, h2, h3, h4, h5,
.page-title,
.title-text,
.navbar-brand {
	font-family: "Poppins", "Nunito Sans", sans-serif !important;
	font-weight: 600;
	letter-spacing: -0.01em;
}

/* Barra superior con el azul de marca */
.navbar,
header.navbar {
	background: linear-gradient(90deg, var(--mv-navy) 0%, #2748a8 100%) !important;
	border-bottom: none !important;
	box-shadow: var(--mv-shadow);
}
.navbar .navbar-brand,
.navbar a,
.navbar .nav-link,
.navbar .navbar-nav .nav-link {
	color: #ffffff !important;
}

/* Botones primarios en coral (CTA de marca) */
.btn-primary,
.btn-modal-primary {
	background-color: var(--mv-coral) !important;
	border-color: var(--mv-coral) !important;
	border-radius: var(--mv-radius-pill) !important;
	color: #ffffff !important;
	font-weight: 700;
	box-shadow: 0 6px 18px rgba(255, 93, 143, 0.35);
}
.btn-primary:hover,
.btn-primary:focus {
	background-color: #ff4880 !important;
	border-color: #ff4880 !important;
}

/* Botones secundarios redondeados */
.btn {
	border-radius: var(--mv-radius-pill);
}

/* Tarjetas y formularios con bordes suaves */
.form-section,
.widget,
.dashboard-card,
.frappe-card,
.form-layout,
.list-row-container {
	border-radius: var(--mv-radius-lg) !important;
}

/* Enlaces con el teal de marca */
a,
.text-primary {
	color: var(--mv-teal);
}
a:hover {
	color: var(--mv-navy);
}

/* Sidebar / fondo general suave */
.layout-side-section,
.desk-sidebar {
	background: var(--mv-gray);
}

/* ---- Página de login con identidad de marca ---- */
.page-card,
.login-content.page-card {
	border-radius: var(--mv-radius-lg) !important;
	box-shadow: var(--mv-shadow) !important;
	border: none !important;
}
.for-login .page-card-head h4,
.page-card-head h4 {
	font-family: "Poppins", sans-serif !important;
	color: var(--mv-navy);
}
body.login-page,
.login-content {
	background: linear-gradient(135deg, var(--mv-lavender) 0%, var(--mv-gray) 60%) !important;
}
.btn-login,
.btn-primary.btn-login {
	background-color: var(--mv-coral) !important;
	border-color: var(--mv-coral) !important;
	border-radius: var(--mv-radius-pill) !important;
	font-weight: 700;
}

/* Indicadores/etiquetas de estado con tonos de marca */
.indicator-pill.blue,
.indicator.blue { background: rgba(31, 58, 138, 0.12); color: var(--mv-navy); }
.indicator-pill.green,
.indicator.green { background: rgba(24, 183, 176, 0.15); color: #0e7a75; }