/* Colores corporativos de Sycer sobre Tabler. Cambiar aqui los tonos si hace falta. */
:root,
[data-bs-theme=light] {
	--sycer-azul: #131a4b;
	--sycer-azul-oscuro: #0c1133;
	/* Naranja del logo: solo para adornos (bordes, marcas), no para texto. */
	--sycer-naranja: #e5502e;
	/* Naranja oscuro para botones y enlaces: contraste 4,9:1 con blanco (WCAG AA). */
	--sycer-naranja-texto: #c8431f;
	--sycer-naranja-oscuro: #a9361a;

	--tblr-primary: var(--sycer-naranja-texto);
	--tblr-primary-rgb: 200, 67, 31;
	--tblr-primary-darken: var(--sycer-naranja-oscuro);
	--tblr-primary-fg: #ffffff;
	--tblr-link-color: var(--sycer-naranja-texto);
	--tblr-link-color-rgb: 200, 67, 31;
	--tblr-link-hover-color: var(--sycer-naranja-oscuro);
	--tblr-link-hover-color-rgb: 169, 54, 26;
}

/* Menu lateral en azul Sycer */
.sycer-sidebar[data-bs-theme=dark] {
	background: var(--sycer-azul) !important;
}
.sycer-sidebar .nav-item.active .nav-link {
	background: rgba(255, 255, 255, .08);
	box-shadow: inset 3px 0 0 var(--sycer-naranja);
}
.sycer-sidebar .nav-link.disabled {
	opacity: .6;
}
.sycer-sidebar .navbar-brand {
	display: block;
	width: 100%;
}
.sycer-sidebar .navbar-brand-image.sycer-logo-menu {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	background: #fff;
	padding: 8px 14px;
	border-radius: 0;
}
/* En la version ancha, la pastilla del logo va pegada arriba del todo. */
@media (min-width: 992px) {
	.sycer-sidebar.navbar-vertical .navbar-brand {
		padding-top: 0;
	}
}
@media (max-width: 991.98px) {
	/* En movil el logo comparte fila con el boton del menu */
	.sycer-sidebar .navbar-brand {
		width: auto;
		flex: 1;
		padding: 0 .75rem;
	}
	.sycer-sidebar .navbar-brand-image.sycer-logo-menu {
		width: auto;
		height: 2.75rem;
		margin: 0 auto;
	}
}

/* Login */
.sycer-login {
	background: linear-gradient(160deg, var(--sycer-azul) 0%, var(--sycer-azul-oscuro) 100%);
	min-height: 100vh;
}
.sycer-login .card {
	border-top: 4px solid var(--sycer-naranja);
}
/* Enlaces sobre el fondo azul: blancos y subrayados (contraste 16:1). */
.sycer-login .sycer-enlace-fondo {
	color: #ffffff;
	text-decoration: underline;
}
.sycer-login .sycer-enlace-fondo:hover {
	color: #ffffff;
	text-decoration: none;
}
.sycer-logo-login {
	width: 240px;
	max-width: 100%;
	height: auto;
}

/* Aviso de "entrar como": el admin esta viendo el panel como un cliente */
.sycer-escalado {
	background: var(--sycer-naranja-texto);
	color: #ffffff;
}

/* Fichas de cliente: listas de contactos y usuarios */
.sycer-avatar {
	background: var(--sycer-azul);
	color: #ffffff;
	font-weight: 600;
}
.sycer-avatar-apagado {
	background: #e6e7e9;
	color: #49505a;
}
.sycer-ficha .list-group-item .btn-list {
	flex-wrap: nowrap;
}
.sycer-dato dt {
	font-weight: 500;
	color: #49505a;
}

/* Etiquetas con texto oscuro sobre fondo claro: contraste de 7:1 o mas (las -lt de Tabler no llegan a 4,5:1). */
.badge[class*="sycer-badge-"] {
	font-weight: 600;
}
.sycer-badge-naranja { background: #fde8e1; color: #8a2d13; }
.sycer-badge-azul { background: #e2ebfb; color: #1e3a8a; }
.sycer-badge-verde { background: #dcf5e3; color: #14532d; }
.sycer-badge-gris { background: #eceef1; color: #3a414b; }
.sycer-badge-amarillo { background: #fdf3c7; color: #6b4a00; }
.sycer-badge-celeste { background: #dff1fb; color: #0c4a6e; }
.sycer-badge-morado { background: #f1e6fb; color: #581c87; }

/* Tarjetas de contacto dentro de la ficha de cliente. El principal lleva la marca naranja. */
.sycer-contacto-principal {
	border-color: var(--sycer-naranja);
	box-shadow: inset 3px 0 0 var(--sycer-naranja);
}
/* El interruptor del principal va bloqueado (se cambia marcando otro), pero se tiene que leer bien. */
.sycer-contacto .form-check-input:disabled,
.sycer-contacto .form-check-input:disabled ~ .form-check-label {
	opacity: 1;
}

/* Fila recien guardada en un listado (productos.php) */
@keyframes sycer-resalta { from { background-color: #fde8e1; } to { background-color: transparent; } }
.sycer-resaltado > td { animation: sycer-resalta 2.5s ease-out; }

/* Servicios contratados en la ficha de cliente: verde en vigor, rojo de baja (con texto, no solo color) */
.sycer-badge-rojo { background: #fde2e2; color: #7f1d1d; }
.sycer-cs {
	border: 1px solid; border-radius: var(--tblr-border-radius);
	padding: .75rem; margin-bottom: .75rem;
}
.sycer-cs .form-label { font-size: .75rem; margin-bottom: .125rem; }
.sycer-cs-vigor { background: #effbf2; border-color: #9fd9b0; }
.sycer-cs-baja { background: #fdf0f0; border-color: #eeb0b0; }
.sycer-cs.sycer-resaltado { animation: sycer-resalta 2.5s ease-out; }
.sycer-anadir { display: grid; gap: .75rem; margin: 0 0 .75rem; }
.sycer-anadir:last-child { margin: .75rem 0 0; }
.sycer-pastilla {
	background: var(--tblr-bg-surface-secondary, #f6f8fb); border: 1px solid var(--tblr-border-color);
	border-radius: var(--tblr-border-radius); padding: .75rem;
}
.sycer-pastilla > .form-label { font-weight: 600; }

/* Facturas y presupuestos en la ficha de cliente */
.sycer-docs td, .sycer-docs th { white-space: nowrap; }
.sycer-docs .btn-link { font-size: .8125rem; text-decoration: underline; }
.sycer-docs .sycer-doc-acciones { white-space: normal !important; line-height: 1.6; }
#modallineas td { vertical-align: top; }
#modallineas td:nth-child(3), #modallineas td:nth-child(4) { width: 6.5rem; }

/* Avisos flotantes (toasts): texto oscuro sobre fondo claro, contraste AA */
.sycer-toast-ok { background: #dcf5e3; color: #14532d; }
.sycer-toast-error { background: #fde2e2; color: #7f1d1d; }
.sycer-toast-aviso { background: #fff3cd; color: #5c3d00; }