/**
 * Copamex Reciclados — Capa visual institucional Charcoal / Gris profesional.
 * Idéntico al diseño del sistema de Mantenimiento (mtto).
 * Headers oscuros charcoal (#3a3f51), shell claro, ribbon #50545e y sidebar #252830.
 */
:root {
	--mf-primary: #3a3f51;
	--mf-primary-hover: #2c303c;
	--mf-primary-muted: #eef0f4;
	--mf-accent: #5a6275;
	--mf-success: #3d8b54;
	--mf-success-hover: #327344;
	--mf-ink: #2a2f3a;
	--mf-ink-soft: #5c6570;
	--mf-sidebar-border: #c5c9d4;
	--mf-sidebar-bg: #252830;
	--mf-sidebar-text: #d5d8e0;
	--mf-header-bg: #f3f4f6;
	--mf-header-border: #d0d4dc;
	--mf-page-bg: #e9ecef;
	--mf-card-radius: 6px;
	--mf-focus-ring: 0 0 0 3px rgba(58, 63, 81, 0.28);
	--mf-shadow-widget: 0 2px 10px rgba(37, 40, 48, 0.07);
}

/* -------- Layout / shell -------- */
html {
	scroll-behavior: smooth;
}

body {
	background-color: var(--mf-page-bg) !important;
	color: var(--mf-ink);
	font-family: "Open Sans", "Segoe UI", Helvetica, Arial, sans-serif;
	font-size: 13px;
}

body.minified {
	background-color: var(--mf-page-bg) !important;
}

#header {
	position: relative;
	background: linear-gradient(180deg, #fafbfc 0%, var(--mf-header-bg) 100%) !important;
	border-bottom: 1px solid var(--mf-header-border) !important;
	box-shadow: 0 1px 3px rgba(37, 40, 48, 0.06);
	overflow: visible !important;
}

#header > .pull-right {
	overflow: visible !important;
}

#header #logo-group h5,
#header #logo-group .mf-brand-title,
#header #logo-group strong {
	color: var(--mf-primary) !important;
	font-weight: 700 !important;
	letter-spacing: 0.04em;
	font-size: 1.15em;
}

.mf-brand-title {
	margin: 0;
	line-height: 1.25;
}

#hide-menu .btn-header a,
#logout .btn-header a,
#fullscreen .btn-header a {
	color: var(--mf-ink-soft) !important;
}

#hide-menu .btn-header a:hover,
#logout .btn-header a:hover,
#fullscreen .btn-header a:hover {
	color: var(--mf-primary) !important;
	background: rgba(58, 63, 81, 0.08) !important;
	border-radius: 4px;
}

/* Textos del header claro (planta / idioma) */
#header .header-dropdown-list > li > a,
#header .project-context,
#header .project-selector > *:first-child,
#header .project-selector a {
	color: var(--mf-ink) !important;
}

#header .header-dropdown-list > li > a:hover {
	color: var(--mf-primary) !important;
}

/* Sidebar */
#left-panel,
aside#left-panel.mf-brand-sidebar {
	background: var(--mf-sidebar-bg) !important;
	border-right: 1px solid rgba(0, 0, 0, 0.2);
}

#left-panel .login-info {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

#left-panel .login-info a {
	color: var(--mf-sidebar-text) !important;
}

#left-panel .login-info a:hover {
	color: #fff !important;
}

#left-panel nav ul li a {
	color: var(--mf-sidebar-text) !important;
	border-left: 3px solid transparent;
}

#left-panel nav ul li a:hover {
	background: rgba(255, 255, 255, 0.08) !important;
	border-left-color: #8b92a5;
	color: #fff !important;
}

#left-panel nav ul li.active > a {
	background: rgba(255, 255, 255, 0.12) !important;
	border-left-color: #aeb4c2;
	color: #fff !important;
	font-weight: 600;
}

/* Submenús colapsados por defecto */
#left-panel nav > ul > li > ul,
#left-panel nav ul ul {
	display: none;
}

/* Modo expandido: mostrar ramas abiertas/activas */
body:not(.minified) #left-panel nav li.open > ul,
body:not(.minified) #left-panel nav li.active.open > ul,
body:not(.minified) #left-panel nav li.mf-menu-parent.open > ul {
	display: block !important;
}

/* Modo minificado */
body.minified #left-panel nav > ul > li > ul,
body.minified #left-panel nav ul ul {
	display: none !important;
}

body.minified #left-panel nav > ul > li:hover > ul,
body.minified #left-panel nav > ul > li.mf-flyout-open > ul {
	display: block !important;
}

#left-panel nav li.mf-menu-parent > a {
	cursor: pointer;
}

#left-panel .minifyme {
	background: rgba(0, 0, 0, 0.25);
	border-top: 1px solid rgba(255, 255, 255, 0.06);
}

#left-panel .minifyme .fa {
	color: #aeb4c2 !important;
}

/* Contenedor principal */
#main {
	background: transparent;
}

#content {
	background: transparent;
}

.page-footer {
	background: var(--mf-sidebar-bg) !important;
	border-top: 1px solid rgba(0, 0, 0, 0.15) !important;
}

.page-footer .txt-color-white {
	color: var(--mf-sidebar-text) !important;
}

/* Jarvis widgets — charcoal */
.jarviswidget,
.jarviswidget[style*="1A8741"],
.jarviswidget[style*="1a8741"] {
	background-color: transparent !important;
}

.jarviswidget > header,
.jarviswidget header {
	background: var(--mf-primary) !important;
	background-image: linear-gradient(180deg, #44495c 0%, var(--mf-primary) 100%) !important;
	border-color: var(--mf-primary-hover) !important;
}

.jarviswidget header h2 {
	color: #fff !important;
	font-weight: 600;
}

.jarviswidget > div > .widget-body {
	background: #fff;
	border-radius: 0 0 var(--mf-card-radius) var(--mf-card-radius);
}

/* Botones primarios Bootstrap 3 */
.btn-primary {
	background-color: var(--mf-primary) !important;
	border-color: var(--mf-primary-hover) !important;
}

.btn-primary:hover,
.btn-primary:focus {
	background-color: var(--mf-primary-hover) !important;
	border-color: #1f232c !important;
}

/* Éxito / Acciones positivas */
.btn-success {
	background-color: var(--mf-success) !important;
	border-color: var(--mf-success-hover) !important;
}

.btn-success:hover,
.btn-success:focus {
	background-color: var(--mf-success-hover) !important;
	border-color: #2a6239 !important;
}

/* Ribbon / migas — tono idéntico al sistema de mantenimiento */
#ribbon {
	background: #50545e !important;
	border-bottom: 1px solid #3e424a;
	color: #fff;
}

#ribbon .breadcrumb {
	background: transparent !important;
}

#ribbon .breadcrumb > li,
#ribbon .breadcrumb > li + li:before {
	color: rgba(255, 255, 255, 0.75);
}

#ribbon .breadcrumb a {
	color: #fff;
}

#ribbon .breadcrumb a:hover {
	color: #e8eaef;
}

/* Tablas: encabezados gris claro suave */
.table thead > tr > th {
	background-color: var(--mf-primary-muted) !important;
	color: var(--mf-ink) !important;
	border-bottom: 2px solid #c5cad3 !important;
}

.table-striped > tbody > tr:nth-child(2n + 1) > td {
	background-color: #fafafa;
}

/* Enlaces */
a.txt-color-magenta,
a {
	color: #3d5a80;
}

a:hover {
	color: var(--mf-primary-hover);
}

/* Enfoque accesible */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
	outline: none;
	box-shadow: var(--mf-focus-ring);
}

/* Header dropdown idioma / sucursales */
.header-dropdown-list .dropdown-menu,
#header .dropdown-menu {
	border-radius: var(--mf-card-radius);
	border: 1px solid #d5d8e0;
}

#header .dropdown-menu > li.active > a {
	background: var(--mf-primary-muted);
	color: var(--mf-ink);
}