/**
 * Master Fibers, Inc. — capa visual sobre SmartAdmin (Fase 1)
 * Paleta derivada de los verdes ya usados en el portal (#1A8741, #008f39).
 * No modifica el comportamiento de DataTables; solo refina shell y widgets.
 */
:root {
	--mf-primary: #1a8741;
	--mf-primary-hover: #156f36;
	--mf-primary-muted: #e8f5ed;
	--mf-accent: #008f39;
	--mf-ink: #0f172a;
	--mf-ink-soft: #475569;
	--mf-sidebar-border: #c8e6d1;
	--mf-sidebar-bg: #102218;
	--mf-sidebar-text: #e2ece6;
	--mf-header-bg: #0c1f14;
	--mf-page-bg: #eef2f0;
	--mf-card-radius: 8px;
	--mf-focus-ring: 0 0 0 3px rgba(26, 135, 65, 0.35);
	--mf-shadow-widget: 0 4px 14px rgba(15, 23, 42, 0.08);
}

/* -------- Layout / shell -------- */
html {
	scroll-behavior: smooth;
}

body {
	background-color: var(--mf-page-bg) !important;
	color: var(--mf-ink);
	font-family: "Segoe UI", "Open Sans", Helvetica, Arial, sans-serif;
}

body.minified {
	background-color: var(--mf-page-bg) !important;
}

#header {
	position: relative;
	background: linear-gradient(180deg, var(--mf-header-bg) 0%, #122a1a 100%) !important;
	border-bottom: 3px solid var(--mf-primary) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.mf-header-aviso-wrap {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	max-width: min(760px, calc(100vw - 360px));
	padding: 0 10px;
	text-align: center;
	z-index: 2;
	pointer-events: none;
}

#header .mf-header-aviso.mf-alert-banner {
	display: inline-block;
	max-width: 100%;
	pointer-events: auto;
	color: #b91c1c !important;
	background: #fff;
	padding: 6px 14px;
	border-radius: 6px;
	font-size: 13px;
	line-height: 1.35;
	font-weight: 700;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
	border: 1px solid rgba(255, 255, 255, 0.85);
}

#header .mf-header-aviso.mf-alert-banner strong {
	font-weight: 700;
	color: inherit;
}

#header #logo-group h5,
#header #logo-group .mf-brand-title,
#header #logo-group strong {
	color: #fff !important;
	font-weight: 600 !important;
	letter-spacing: 0.02em;
}

.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-sidebar-text) !important;
}

#hide-menu .btn-header a:hover,
#logout .btn-header a:hover,
#fullscreen .btn-header a:hover {
	color: #fff !important;
	background: rgba(255, 255, 255, 0.08) !important;
	border-radius: 4px;
}

/* Sidebar */
#left-panel,
aside#left-panel.mf-brand-sidebar {
	background: var(--mf-sidebar-bg) !important;
	border-right: 1px solid rgba(26, 135, 65, 0.25);
}

#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(26, 135, 65, 0.22) !important;
	border-left-color: var(--mf-accent);
	color: #fff !important;
}

#left-panel nav ul li.active > a {
	background: rgba(26, 135, 65, 0.35) !important;
	border-left-color: var(--mf-accent);
	color: #fff !important;
	font-weight: 600;
}

/* Submenús: mantener visibles las ramas abiertas/activas */
#left-panel nav > ul > li > ul,
#left-panel nav ul ul {
	display: none;
}

#left-panel nav li.open > ul,
#left-panel nav li.active.open > ul,
#left-panel nav li.mf-menu-parent.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: var(--mf-accent) !important;
}

/* Contenedor principal */
#main {
	background: transparent;
}

#content {
	background: transparent;
}

.page-footer {
	background: var(--mf-header-bg) !important;
	border-top: 1px solid rgba(26, 135, 65, 0.35) !important;
}

.page-footer .txt-color-white {
	color: var(--mf-sidebar-text) !important;
}

/* Jarvis widgets — alinear con marca (respeta estructura SmartAdmin) */
.jarviswidget header {
	background: var(--mf-primary) !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 en contexto app */
.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: #0f5228 !important;
}

.btn-success {
	background-color: var(--mf-accent) !important;
	border-color: #00782f !important;
}

/* Ribbon / migas */
#ribbon {
	background: #fff !important;
	border-bottom: 1px solid #d5e8dc;
}

#ribbon .breadcrumb > li + li:before {
	color: var(--mf-primary);
}

#ribbon .breadcrumb a {
	color: var(--mf-primary-hover);
}

/* Tablas: solo encabezados suaves (DataTables sigue controlando el grueso del estilo) */
.table thead > tr > th {
	background-color: var(--mf-primary-muted) !important;
	color: var(--mf-ink) !important;
	border-bottom: 2px solid var(--mf-primary) !important;
}

.table-striped > tbody > tr:nth-child(2n + 1) > td {
	background-color: #fafcfb;
}

/* Enlaces */
a.txt-color-magenta,
a {
	color: var(--mf-primary-hover);
}

a:hover {
	color: var(--mf-accent);
}

/* Enfoque accesible */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
	outline: none;
	box-shadow: var(--mf-focus-ring);
}

/* Header dropdown idioma */
.header-dropdown-list .dropdown-menu,
#header .dropdown-menu {
	border-radius: var(--mf-card-radius);
	border: 1px solid #cfe8d6;
}

#header .dropdown-menu > li.active > a {
	background: var(--mf-primary-muted);
	color: var(--mf-ink);
}

@media (max-width: 991px) {
	.mf-header-aviso-wrap {
		position: static;
		transform: none;
		max-width: 100%;
		width: 100%;
		order: 3;
		margin: 4px 0 2px;
		padding: 0 8px 6px;
	}
}
