/* ===== base.css ===== */
/* =====================================================
   MCP — Paleta: Negro profundo + Azul institucional
   Azul logo:   #1A6FBF (principal)  #5BAAE0 (suave)
   Fondos:      #07090E → #0A0E15 → #0D1520
   Acento dark: #0D1E30  Stroke: rgba(26,111,191,.20)
   ===================================================== */
:root{
	/* Paleta institucional MCP */
	--azul: #1A6FBF;
	--cielo: #5BAAE0;
	--rojo: #C04040;
	--naranja: #C86830;
	--verde: #1A8A6A;
	--amarillo: #C89010;
	--dorado: #A87830;

	/* Dark predominante — negro profundo con tinte azul */
	--bg: #07090E;
	--bg-2: #0A0E15;
	--bg-3: #0D1520;
	--bg-4: #1A6FBF;

	--panel: rgba(26,111,191,.18);
	--panel-2: rgba(26,111,191,.26);
	--panel-3: rgba(91,170,224,.10);
	--panel-soft: rgba(91,170,224,.05);

	--stroke: rgba(91,170,224,.18);
	--stroke-strong: rgba(91,170,224,.32);

	--text: rgba(255,255,255,.95);
	--text-soft: rgba(221,232,245,.76);
	--text-muted: rgba(221,232,245,.50);

	--brand-pink: var(--azul);
	--brand-purple: var(--cielo);
	--blue-1: var(--azul);
	--blue-2: var(--cielo);
	--green-1: var(--verde);
	--orange-1: var(--naranja);
	--yellow-1: var(--amarillo);
	--yellow-2: var(--dorado);

	--soft-pink: #d7ecff;
	--soft-purple: #bfeeff;
	--soft-blue: #8edfff;
	--soft-green: #b7f3ea;

	--success: var(--verde);
	--warning: var(--amarillo);
	--danger: var(--rojo);
	--info: var(--cielo);
	--review: var(--dorado);

	--shadow-1: 0 12px 35px rgba(0,0,0,.28);
	--shadow-2: 0 20px 60px rgba(0,0,0,.40);
	--shadow-3: 0 28px 90px rgba(0,0,0,.52);

	--radius-xs: 10px;
	--radius-sm: 14px;
	--radius-md: 18px;
	--radius-lg: 24px;
	--radius-xl: 26px;

	--space-1: 8px;
	--space-2: 12px;
	--space-3: 16px;
	--space-4: 20px;
	--space-5: 24px;
	--space-6: 28px;

	--sidebar-w: 230px;
	--sidebar-collapsed: 84px;
	--topbar-h: 64px;

	--panel-pad-x: 20px;
	--panel-pad-y: 20px;
	--modal-pad-x: 22px;
	--modal-pad-y: 22px;


	/* Aliases globales para módulos heredados/refactorizados. */
	--muted: var(--text-muted);
	--muted-text: var(--text-muted);
	--text-primary: var(--text);
	--surface: var(--panel);
	--surface-1: var(--panel);
	--surface-2: var(--panel-2);
	--border: var(--stroke);
	--border-color: var(--stroke);
	--input-bg: rgba(255,255,255,.045);
	--accent: var(--cielo);
	--cyan-1: var(--cielo);

	--transition: .22s ease;
}

*,
*::before,
*::after{ box-sizing:border-box; }

html,body{
	margin:0;
	min-height:100%;
}

html{ scroll-behavior:smooth; }

body{
	font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	color:var(--text);
	background:var(--bg);
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	text-rendering:optimizeLegibility;
	overflow-x:hidden;
	position:relative;
}

body::before{
	content:"";
	position:fixed;
	inset:0;
	z-index:-1;
	pointer-events:none;
	background:
		radial-gradient(1000px 540px at 12% -5%, rgba(91,170,224,.06), transparent 75%),
		radial-gradient(860px 520px at 88% 6%, rgba(26,111,191,.45), transparent 75%),
		radial-gradient(760px 460px at 70% 96%, rgba(91,170,224,.04), transparent 75%),
		linear-gradient(180deg, var(--bg), var(--bg-2) 45%, var(--bg-3));
	background-repeat:no-repeat;
}

img,
svg{
	display:block;
	max-width:100%;
}

.custom-logo-link,
.brand-logo .custom-logo-link{
	display:block;
	line-height:0;
}

.custom-logo{
	width:100%;
	height:100%;
	object-fit:contain;
}

button,
input,
select,
textarea{
	font:inherit;
	color:inherit;
}

a{
	color:inherit;
	text-decoration:none;
}

button{
	border:0;
	background:none;
	padding:0;
	cursor:pointer;
}

input,
select,
textarea{
	width:100%;
	border:1px solid var(--stroke);
	background:rgba(255,255,255,.045);
	color:var(--text);
	outline:none;
	border-radius:16px;
	transition:border-color var(--transition), box-shadow var(--transition), background var(--transition);
}

input:focus,
select:focus,
textarea:focus{
	border-color:rgba(91,170,224,.38);
	box-shadow:0 0 0 4px rgba(91,170,224,.12);
	background:rgba(255,255,255,.065);
}

::placeholder{ color:var(--text-muted); }

h1,
h2,
h3,
h4,
h5,
h6{
	margin:0;
	color:var(--text);
}

p{ margin:0; }

.content-shell{
	display:flex;
	flex-direction:column;
	gap:22px;
}

.u-text-soft{ color:var(--text-soft); }
.u-text-muted{ color:var(--text-muted); }
.u-full{ width:100%; }
.u-nowrap{ white-space:nowrap; }
.u-prewrap{ white-space:pre-wrap; }
.u-hidden{ display:none !important; }

.filter-grid{ padding-bottom:8px; }
.modal-form{ display:grid; gap:18px; }
.modal-body--flush-top{ padding-top:18px; }

.textarea-lg{
	min-height:132px;
	padding:14px 16px;
	border-radius:16px;
	border:1px solid rgba(255,255,255,.08);
	background:rgba(255,255,255,.03);
	color:var(--text);
	line-height:1.5;
	resize:vertical;
	outline:none;
	transition:border-color var(--transition), background var(--transition), box-shadow var(--transition);
}

.textarea-lg::placeholder{
	color:var(--text-soft);
}

.textarea-lg:focus{
	border-color:rgba(255,255,255,.16);
	background:rgba(255,255,255,.05);
	box-shadow:0 0 0 3px rgba(255,255,255,.04);
}

.alert,
.theme-alert{
	margin:0 var(--panel-pad-x) 12px;
	padding:14px 16px;
	border-radius:16px;
	border:1px solid var(--stroke);
	font-size:14px;
	line-height:1.45;
}

.alert-success,
.theme-alert-success{ color:#dbffef; background:rgba(69,142,99,.18); border-color:rgba(69,142,99,.28); }
.alert-warning,
.theme-alert-warning{ color:#fff1c8; background:rgba(212,175,55,.16); border-color:rgba(212,175,55,.28); }
.alert-danger,
.theme-alert-danger{ color:#ffe1db; background:rgba(184,107,75,.18); border-color:rgba(184,107,75,.28); }
.alert-info{ color:#d8ebff; background:rgba(91,170,224,.18); border-color:rgba(91,170,224,.30); }

.checkbox-field{ align-items:flex-start; }
.checkbox-ui{
	display:inline-flex;
	align-items:center;
	gap:10px;
	color:var(--text-soft);
	font-weight:600;
}

.checkbox-ui input{
	width:18px;
	height:18px;
	accent-color:var(--brand-pink);
}

html.sidebar-precollapsed #appShell,
html.sidebar-precollapsed #appShell .sidebar,
html.sidebar-precollapsed #appShell .main-content{ transition:none !important; }

html.theme-prelight *,
html.theme-prelight *::before,
html.theme-prelight *::after{ transition:none !important; }