/* =============================================
   ERP Bicephalus — Layout Shell
   ============================================= */

/* --- Contenedor principal --- */
.erp-layout{
	display:flex;
	min-height:100vh;
	background:var(--content-bg);
}

/* --- Sidebar --- */
.erp-sidebar{
	width:260px;
	min-width:260px;
	background:var(--sidebar-bg);
	display:flex;
	flex-direction:column;
	transition:var(--transition-slow);
	position:fixed;
	top:0;
	left:0;
	bottom:0;
	z-index:100;
	overflow-y:auto;
	overflow-x:hidden;
}

.erp-sidebar.collapsed{
	width:72px;
	min-width:72px;
}

/* Brand */
.sidebar-brand{
	display:flex;
	align-items:center;
	gap:12px;
	padding:20px 20px 16px;
	border-bottom:1px solid rgba(255,255,255,0.06);
	text-decoration:none;
	flex-shrink:0;
}

.sidebar-brand-icon{
	width:40px;
	height:40px;
	min-width:40px;
	border-radius:var(--radius);
	background:linear-gradient(135deg,#2563eb,#4f46e5);
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
}

.sidebar-brand-text{
	display:flex;
	flex-direction:column;
	overflow:hidden;
	white-space:nowrap;
}

.sidebar-brand-text .brand-name{
	font-size:15px;
	font-weight:700;
	color:#fff;
	letter-spacing:-0.3px;
}

.sidebar-brand-text .brand-sub{
	font-size:11px;
	color:rgba(255,255,255,0.4);
	font-weight:400;
}

.erp-sidebar.collapsed .sidebar-brand-text{
	display:none;
}

/* Nav */
.sidebar-nav{
	flex:1;
	padding:12px 10px;
	overflow-y:auto;
}

.sidebar-nav-label{
	font-size:10px;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:1px;
	color:rgba(255,255,255,0.3);
	padding:16px 12px 6px;
	display:block;
}

.erp-sidebar.collapsed .sidebar-nav-label{
	display:none;
}

.sidebar-nav-item{
	display:flex;
	align-items:center;
	gap:12px;
	padding:10px 14px;
	border-radius:var(--radius-sm);
	color:rgba(255,255,255,0.6);
	text-decoration:none;
	font-size:13.5px;
	font-weight:500;
	transition:var(--transition);
	margin-bottom:2px;
	white-space:nowrap;
	overflow:hidden;
}

.sidebar-nav-item:hover{
	background:rgba(255,255,255,0.06);
	color:rgba(255,255,255,0.9);
}

.sidebar-nav-item.active{
	background:rgba(37,99,235,0.15);
	color:#60a5fa;
}

.sidebar-nav-item .nav-icon{
	width:20px;
	height:20px;
	min-width:20px;
	display:flex;
	align-items:center;
	justify-content:center;
}

.sidebar-nav-item .nav-text{
	overflow:hidden;
	text-overflow:ellipsis;
}

.erp-sidebar.collapsed .sidebar-nav-item .nav-text{
	display:none;
}

.erp-sidebar.collapsed .sidebar-nav-item{
	justify-content:center;
	padding:10px;
}

/* Nav groups (collapsible) */
.sidebar-nav-group{
	margin-bottom:2px;
}

.sidebar-nav-parent{
	width:100%;
	border:none;
	background:none;
	cursor:pointer;
	position:relative;
}

.sidebar-nav-parent .nav-arrow{
	position:absolute;
	right:12px;
	top:50%;
	transform:translateY(-50%);
	color:rgba(255,255,255,0.3);
	transition:transform .2s ease;
}

.sidebar-nav-group.open .sidebar-nav-parent .nav-arrow{
	transform:translateY(-50%) rotate(90deg);
}

.sidebar-nav-group.open .sidebar-nav-parent{
	color:rgba(255,255,255,0.9);
}

.sidebar-nav-children{
	max-height:0;
	overflow:hidden;
	transition:max-height .25s ease;
}

.sidebar-nav-group.open .sidebar-nav-children{
	max-height:300px;
}

.sidebar-nav-child{
	display:flex;
	align-items:center;
	gap:10px;
	padding:7px 14px 7px 46px;
	color:rgba(255,255,255,0.5);
	text-decoration:none;
	font-size:13px;
	font-weight:400;
	transition:var(--transition);
	border-radius:var(--radius-sm);
}

.sidebar-nav-child:hover{
	color:rgba(255,255,255,0.85);
	background:rgba(255,255,255,0.04);
}

.sidebar-nav-child.active{
	color:#60a5fa;
	font-weight:500;
}

.sidebar-nav-child .nav-dot{
	width:5px;
	height:5px;
	min-width:5px;
	border-radius:50%;
	background:rgba(255,255,255,0.25);
	transition:var(--transition);
}

.sidebar-nav-child.active .nav-dot{
	background:#60a5fa;
	box-shadow:0 0 6px rgba(96,165,250,0.4);
}

.erp-sidebar.collapsed .sidebar-nav-children{
	display:none;
}

.erp-sidebar.collapsed .sidebar-nav-parent .nav-arrow{
	display:none;
}

/* Sidebar footer / user */
.sidebar-footer{
	padding:12px 14px;
	border-top:1px solid rgba(255,255,255,0.06);
	flex-shrink:0;
}

.sidebar-user{
	display:flex;
	align-items:center;
	gap:10px;
	padding:8px;
	border-radius:var(--radius-sm);
	transition:var(--transition);
	cursor:default;
}

.sidebar-user-avatar{
	width:34px;
	height:34px;
	min-width:34px;
	border-radius:50%;
	background:linear-gradient(135deg,#2563eb,#7c3aed);
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
	font-size:13px;
	font-weight:600;
}

.sidebar-user-info{
	overflow:hidden;
}

.sidebar-user-info .user-name{
	font-size:13px;
	font-weight:600;
	color:#fff;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.sidebar-user-info .user-role{
	font-size:11px;
	color:rgba(255,255,255,0.4);
}

.erp-sidebar.collapsed .sidebar-user-info{
	display:none;
}

/* --- Main wrapper --- */
.erp-main{
	flex:1;
	margin-left:260px;
	display:flex;
	flex-direction:column;
	transition:var(--transition-slow);
	min-width:0;
}

.erp-sidebar.collapsed ~ .erp-main,
.erp-main.expanded{
	margin-left:72px;
}

/* --- Header --- */
.erp-header{
	height:60px;
	min-height:60px;
	background:var(--header-bg);
	border-bottom:1px solid var(--border);
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:0 24px;
	position:sticky;
	top:0;
	z-index:50;
}

.header-left{
	display:flex;
	align-items:center;
	gap:16px;
}

.btn-sidebar-toggle{
	width:36px;
	height:36px;
	border:none;
	background:none;
	border-radius:var(--radius-sm);
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--text-secondary);
	transition:var(--transition);
}

.btn-sidebar-toggle:hover{
	background:rgba(0,0,0,0.04);
	color:var(--text-primary);
}

.header-title{
	font-size:16px;
	font-weight:600;
	color:var(--text-primary);
}

.header-right{
	display:flex;
	align-items:center;
	gap:8px;
}

.header-btn{
	width:36px;
	height:36px;
	border:none;
	background:none;
	border-radius:var(--radius-sm);
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--text-secondary);
	transition:var(--transition);
	position:relative;
}

.header-btn:hover{
	background:rgba(0,0,0,0.04);
	color:var(--text-primary);
}

.header-btn .badge-dot{
	position:absolute;
	top:6px;
	right:6px;
	width:8px;
	height:8px;
	border-radius:50%;
	background:var(--error);
	border:2px solid var(--header-bg);
}

.header-divider{
	width:1px;
	height:24px;
	background:var(--border);
	margin:0 8px;
}

/* BU Selector */
.header-bu-selector{
	position:relative;
}

.header-bu-btn{
	display:flex;
	align-items:center;
	gap:6px;
	padding:5px 10px;
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	background:var(--surface);
	color:var(--text-primary);
	font-size:13px;
	font-weight:500;
	cursor:pointer;
	transition:var(--transition);
	white-space:nowrap;
}

.header-bu-btn:hover{
	background:var(--bg-hover);
	border-color:var(--primary);
}

.header-bu-btn .bu-arrow{
	opacity:.5;
	transition:transform .2s ease;
}

.bu-dropdown.open ~ .header-bu-btn .bu-arrow,
.header-bu-selector .bu-dropdown.open + .bu-arrow{
	transform:rotate(180deg);
}

.header-bu-badge{
	display:flex;
	align-items:center;
	gap:6px;
	padding:5px 10px;
	border-radius:var(--radius-sm);
	background:var(--surface);
	border:1px solid var(--border);
	color:var(--text-secondary);
	font-size:13px;
	font-weight:500;
	white-space:nowrap;
}

.bu-dropdown{
	position:absolute;
	top:calc(100% + 6px);
	right:0;
	min-width:240px;
	background:var(--card-bg);
	border:1px solid var(--border);
	border-radius:var(--radius);
	box-shadow:var(--shadow-lg);
	opacity:0;
	visibility:hidden;
	transform:translateY(-8px);
	transition:all .2s ease;
	z-index:1000;
}

.bu-dropdown.open{
	opacity:1;
	visibility:visible;
	transform:translateY(0);
}

.bu-dropdown-title{
	padding:10px 14px 6px;
	font-size:11px;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:.5px;
	color:var(--text-secondary);
}

.bu-dropdown-item{
	display:flex;
	align-items:center;
	gap:10px;
	width:100%;
	padding:9px 14px;
	border:none;
	background:none;
	font-size:13px;
	color:var(--text-primary);
	cursor:pointer;
	transition:background .15s ease;
	text-align:left;
}

.bu-dropdown-item:hover{
	background:var(--bg-hover);
}

.bu-dropdown-item.active{
	background:rgba(var(--primary-rgb,59,130,246),.08);
	font-weight:600;
}

.bu-dropdown-item .bu-dot{
	width:8px;
	height:8px;
	border-radius:50%;
	flex-shrink:0;
}

.bu-dropdown-item .bu-item-name{
	flex:1;
}

.bu-dropdown-item svg{
	flex-shrink:0;
}

.header-user{
	display:flex;
	align-items:center;
	gap:10px;
	padding:4px 8px 4px 4px;
	border-radius:var(--radius-sm);
	cursor:pointer;
	transition:var(--transition);
	text-decoration:none;
}

.header-user:hover{
	background:rgba(0,0,0,0.04);
}

.header-user-avatar{
	width:32px;
	height:32px;
	border-radius:50%;
	background:linear-gradient(135deg,#2563eb,#7c3aed);
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
	font-size:12px;
	font-weight:600;
}

.header-user-name{
	font-size:13px;
	font-weight:500;
	color:var(--text-primary);
}

/* --- User Dropdown --- */
.header-user-menu{
	position:relative;
}

.header-user{
	display:flex;
	align-items:center;
	gap:8px;
	padding:4px 8px 4px 4px;
	border:none;
	background:none;
	border-radius:var(--radius-sm);
	cursor:pointer;
	transition:var(--transition);
	font-family:var(--font-family);
}

.header-user:hover{
	background:rgba(0,0,0,0.04);
}

.user-dropdown{
	display:none;
	position:absolute;
	top:calc(100% + 8px);
	right:0;
	width:240px;
	background:var(--card-bg);
	border:1px solid var(--border);
	border-radius:var(--radius);
	box-shadow:var(--shadow-lg);
	z-index:200;
	overflow:hidden;
	animation:dropdownFadeIn 0.15s ease;
}

.user-dropdown.open{
	display:block;
}

@keyframes dropdownFadeIn{
	from{opacity:0;transform:translateY(-4px)}
	to{opacity:1;transform:translateY(0)}
}

.dropdown-header{
	padding:12px 16px;
}

.dropdown-user-name{
	font-size:14px;
	font-weight:600;
	color:var(--text-primary);
}

.dropdown-user-email{
	font-size:12px;
	color:var(--text-secondary);
	margin-top:2px;
}

.dropdown-divider{
	height:1px;
	background:var(--border);
}

.dropdown-item{
	display:flex;
	align-items:center;
	gap:10px;
	padding:10px 16px;
	font-size:13px;
	color:var(--text-primary);
	text-decoration:none;
	transition:var(--transition);
}

.dropdown-item:hover{
	background:rgba(0,0,0,0.03);
}

.dropdown-item-danger{
	color:var(--error);
}

.dropdown-item-danger:hover{
	background:var(--error-light);
}

/* --- Content --- */
.erp-content{
	flex:1;
	padding:24px;
}

.content-card{
	background:var(--card-bg);
	border-radius:var(--radius-lg);
	border:1px solid var(--border);
	padding:24px;
}

/* --- Responsive --- */
.sidebar-overlay{
	display:none;
	position:fixed;
	inset:0;
	background:rgba(0,0,0,0.5);
	z-index:99;
}

@media (max-width:768px){
	.erp-sidebar{
		transform:translateX(-100%);
		width:260px;
	}
	.erp-sidebar.mobile-open{
		transform:translateX(0);
	}
	.erp-sidebar.mobile-open ~ .sidebar-overlay{
		display:block;
	}
	.erp-main{
		margin-left:0 !important;
	}
	.header-user-name{
		display:none;
	}
}

/* =============================================
   COMPONENTES REUTILIZABLES
   ============================================= */

/* --- Breadcrumb --- */
.erp-breadcrumb{
	display:flex;
	align-items:center;
	gap:6px;
	margin-bottom:20px;
	font-size:13px;
}

.breadcrumb-link{
	color:var(--text-secondary);
	text-decoration:none;
	transition:var(--transition);
}

.breadcrumb-link:hover{
	color:var(--info);
}

.breadcrumb-sep{
	color:var(--text-secondary);
	opacity:0.4;
	display:flex;
	align-items:center;
}

.breadcrumb-current{
	color:var(--text-primary);
	font-weight:600;
}

/* --- Tablas --- */
.erp-table-wrapper{
	background:var(--card-bg);
	border-radius:var(--radius);
	border:1px solid var(--border);
	overflow:hidden;
	overflow-x:auto;
	position:relative;
}
.erp-table-wrapper.erp-table-loading > table{
	opacity:0;
}
.erp-table-wrapper.erp-table-loading .erp-dt-header,
.erp-table-wrapper.erp-table-loading .erp-dt-footer{
	opacity:0;
}
.erp-table-wrapper.erp-table-ready > table,
.erp-table-wrapper.erp-table-ready .erp-dt-header,
.erp-table-wrapper.erp-table-ready .erp-dt-footer{
	opacity:1;
	transition:opacity .35s ease;
}
.erp-table-spinner{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:12px;
	padding:48px 20px;
	color:var(--text-secondary);
	font-size:13px;
}
.erp-table-spinner span{
	font-weight:500;
}
.erp-spinner{
	width:32px;
	height:32px;
	border:3px solid var(--border);
	border-top-color:var(--primary);
	border-radius:50%;
	animation:erpSpin .7s linear infinite;
}
@keyframes erpSpin{
	to{transform:rotate(360deg)}
}
.erp-table-wrapper.erp-table-ready .erp-table-spinner{
	display:none;
}

.erp-table{
	width:100%;
	border-collapse:collapse;
	font-size:13.5px;
}

.erp-table thead th{
	text-align:left;
	padding:12px 16px;
	font-weight:600;
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:0.5px;
	color:var(--text-secondary);
	background:var(--content-bg);
	border-bottom:1px solid var(--border);
}

.erp-table tbody td{
	padding:12px 16px;
	border-bottom:1px solid var(--border);
	color:var(--text-primary);
	vertical-align:middle;
	white-space:nowrap;
}

.erp-table tbody tr:last-child td{
	border-bottom:none;
}

.erp-table tbody tr:hover{
	background:rgba(0,0,0,0.015);
}

.erp-table-empty{
	text-align:center;
	padding:40px 16px !important;
	color:var(--text-secondary);
	font-style:italic;
}

/* --- DataTables overrides --- */
.erp-dt-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:10px 16px;
	gap:12px;
	flex-wrap:wrap;
	font-size:13px;
	color:var(--text-secondary);
}

.erp-dt-footer{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:10px 16px;
	gap:12px;
	flex-wrap:wrap;
	border-top:1px solid var(--border);
	font-size:13px;
}

.erp-table-wrapper .dataTables_length,
.erp-table-wrapper .dataTables_filter{
	font-size:13px;
	color:var(--text-secondary);
}

.erp-table-wrapper .dataTables_length label,
.erp-table-wrapper .dataTables_filter label{
	display:flex;
	align-items:center;
	gap:6px;
	margin:0;
	font-weight:400;
}

.erp-table-wrapper .dataTables_filter input{
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	padding:5px 10px;
	font-size:13px;
	font-family:var(--font-family);
	outline:none;
	transition:var(--transition);
	margin:0;
	height:32px;
	background:var(--card-bg);
	color:var(--text-primary);
}

.erp-table-wrapper .dataTables_filter input:focus{
	border-color:var(--info);
	box-shadow:0 0 0 2px rgba(59,130,246,0.15);
}

.erp-table-wrapper .dataTables_length select{
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	padding:4px 6px;
	font-size:13px;
	font-family:var(--font-family);
	height:32px;
	background:var(--card-bg);
	color:var(--text-primary);
	cursor:pointer;
}

.erp-table-wrapper .dataTables_info{
	font-size:12px;
	color:var(--text-secondary);
	padding:0;
}

.erp-table-wrapper .dataTables_paginate{
	padding:0;
	display:flex;
	gap:4px;
}

.erp-table-wrapper .dataTables_paginate .paginate_button{
	padding:5px 12px;
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	font-size:12px;
	background:var(--card-bg);
	color:var(--text-primary);
	cursor:pointer;
	text-decoration:none;
	display:inline-block;
}

.erp-table-wrapper .dataTables_paginate .paginate_button.current{
	background:var(--info);
	color:#fff;
	border-color:var(--info);
	font-weight:600;
}

.erp-table-wrapper .dataTables_paginate .paginate_button:hover:not(.disabled):not(.current){
	background:var(--content-bg);
}

.erp-table-wrapper .dataTables_paginate .paginate_button.disabled{
	opacity:0.35;
	cursor:default;
}

.erp-table-wrapper table.dataTable{
	border-collapse:collapse !important;
	margin:0 !important;
	width:100% !important;
}

.erp-table-wrapper table.dataTable thead th{
	border-bottom:2px solid var(--border) !important;
	font-size:11px;
	position:relative;
}

.erp-table-wrapper table.dataTable thead .sorting::before,
.erp-table-wrapper table.dataTable thead .sorting_asc::before,
.erp-table-wrapper table.dataTable thead .sorting_desc::before,
.erp-table-wrapper table.dataTable thead .sorting::after,
.erp-table-wrapper table.dataTable thead .sorting_asc::after,
.erp-table-wrapper table.dataTable thead .sorting_desc::after{
	font-size:9px !important;
	opacity:0.3;
	bottom:auto !important;
	top:50% !important;
	transform:translateY(-50%);
}

.erp-table-wrapper table.dataTable thead .sorting_asc::after,
.erp-table-wrapper table.dataTable thead .sorting_desc::after{
	opacity:0.7;
}


/* --- Form Card --- */
.erp-form-card{
	background:var(--card-bg);
	border-radius:var(--radius);
	border:1px solid var(--border);
	margin-bottom:20px;
	overflow:hidden;
}

.erp-form-card-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:14px 20px;
	cursor:pointer;
	transition:var(--transition);
	user-select:none;
}

.erp-form-card-header:hover{
	background:rgba(0,0,0,0.015);
}

.erp-form-card-title{
	display:flex;
	align-items:center;
	gap:10px;
	font-size:14px;
	font-weight:600;
	color:var(--text-primary);
}

.erp-form-card-icon{
	color:var(--info);
	display:flex;
}

.erp-form-card-toggle{
	color:var(--text-secondary);
	display:flex;
	transition:var(--transition);
}

.erp-form-card.collapsed .erp-form-card-toggle{
	transform:rotate(-90deg);
}

.erp-form-card-body{
	padding:0 20px 20px;
}

/* --- Modal --- */
.erp-modal-overlay{
	display:none;
	position:fixed;
	inset:0;
	background:rgba(0,0,0,0.5);
	z-index:1000;
	align-items:center;
	justify-content:center;
}

.erp-modal-overlay.open{
	display:flex;
}

.erp-modal{
	background:var(--card-bg);
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-xl);
	width:90%;
	max-height:90vh;
	overflow-y:auto;
	animation:modalFadeIn 0.2s ease;
}

.erp-modal-sm{max-width:400px}
.erp-modal-md{max-width:560px}
.erp-modal-lg{max-width:800px}

@keyframes modalFadeIn{
	from{opacity:0;transform:scale(0.95)}
	to{opacity:1;transform:scale(1)}
}

.erp-modal-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:20px 24px 0;
}

.erp-modal-title{
	font-size:18px;
	font-weight:600;
	margin:0;
	color:var(--text-primary);
}

.erp-modal-close{
	width:32px;
	height:32px;
	border:none;
	background:none;
	border-radius:var(--radius-sm);
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--text-secondary);
	transition:var(--transition);
}

.erp-modal-close:hover{
	background:rgba(0,0,0,0.06);
	color:var(--text-primary);
}

.erp-modal-body{
	padding:20px 24px;
}

.erp-modal-footer{
	padding:16px 24px;
	border-top:1px solid var(--border);
	display:flex;
	justify-content:flex-end;
	gap:8px;
}

/* --- Empty state --- */
.erp-empty{
	text-align:center;
	padding:48px 24px;
	color:var(--text-secondary);
}

.erp-empty-icon{
	margin-bottom:12px;
	opacity:0.3;
}

.erp-empty-text{
	font-size:14px;
	margin:0;
}

/* --- Botones ERP --- */
.erp-btn{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:8px 16px;
	border:none;
	border-radius:var(--radius-sm);
	font-size:13px;
	font-weight:500;
	font-family:var(--font-family);
	cursor:pointer;
	transition:var(--transition);
	text-decoration:none;
	line-height:1.4;
}

.erp-btn-primary{
	background:var(--info);
	color:#fff;
}
.erp-btn-primary:hover{
	background:#2563eb;
	color:#fff;
}

.erp-btn-success{
	background:var(--success);
	color:#fff;
}
.erp-btn-success:hover{
	background:#059669;
	color:#fff;
}

.erp-btn-danger{
	background:var(--error);
	color:#fff;
}
.erp-btn-danger:hover{
	background:#dc2626;
	color:#fff;
}

.erp-btn-ghost{
	background:none;
	color:var(--text-secondary);
	border:1px solid var(--border);
}
.erp-btn-ghost:hover{
	background:rgba(0,0,0,0.03);
	color:var(--text-primary);
}

.erp-btn-sm{
	padding:5px 10px;
	font-size:12px;
}

.erp-btn-icon{
	width:32px;
	height:32px;
	padding:0;
	justify-content:center;
}

/* --- Action buttons group --- */
.erp-actions{
	display:flex;
	gap:4px;
}

/* --- Form inputs ERP --- */
.erp-input{
	width:100%;
	padding:9px 14px;
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	font-size:13.5px;
	font-family:var(--font-family);
	color:var(--text-primary);
	background:var(--card-bg);
	transition:var(--transition);
}

.erp-input:focus{
	outline:none;
	border-color:var(--info);
	box-shadow:0 0 0 3px var(--info-light);
}

.erp-label{
	display:block;
	font-size:13px;
	font-weight:500;
	color:var(--text-primary);
	margin-bottom:4px;
}

.erp-form-group{
	margin-bottom:16px;
}

.erp-form-row{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
	gap:16px;
}

/* --- Switch --- */
.erp-switch{
	position:relative;
	display:inline-flex;
	align-items:center;
	gap:8px;
	cursor:pointer;
	font-size:13px;
	color:var(--text-primary);
}

.erp-switch input{
	position:absolute;
	opacity:0;
	width:0;
	height:0;
}

.erp-switch-slider{
	width:36px;
	height:20px;
	background:var(--border);
	border-radius:10px;
	position:relative;
	transition:var(--transition);
	flex-shrink:0;
}

.erp-switch-slider::after{
	content:'';
	position:absolute;
	width:16px;
	height:16px;
	background:#fff;
	border-radius:50%;
	top:2px;
	left:2px;
	transition:var(--transition);
	box-shadow:var(--shadow-sm);
}

.erp-switch input:checked + .erp-switch-slider{
	background:var(--info);
}

.erp-switch input:checked + .erp-switch-slider::after{
	transform:translateX(16px);
}

/* --- Response area --- */
.erp-rsp{
	margin-top:12px;
}

/* --- Toast notifications --- */
.erp-toast-container{
	position:fixed;
	top:20px;
	right:20px;
	z-index:9999;
	display:flex;
	flex-direction:column;
	gap:8px;
	max-width:380px;
}

.erp-toast{
	display:flex;
	align-items:flex-start;
	gap:10px;
	padding:14px 16px;
	border-radius:var(--radius);
	background:var(--card-bg);
	border:1px solid var(--border);
	box-shadow:var(--shadow-lg);
	animation:toastSlideIn 0.3s ease;
	font-size:13.5px;
	line-height:1.4;
	color:var(--text-primary);
}

.erp-toast.removing{
	animation:toastSlideOut 0.25s ease forwards;
}

@keyframes toastSlideIn{
	from{opacity:0;transform:translateX(40px)}
	to{opacity:1;transform:translateX(0)}
}

@keyframes toastSlideOut{
	from{opacity:1;transform:translateX(0)}
	to{opacity:0;transform:translateX(40px)}
}

.erp-toast-icon{
	flex-shrink:0;
	width:20px;
	height:20px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-top:1px;
}

.erp-toast-content{
	flex:1;
	min-width:0;
}

.erp-toast-title{
	font-weight:600;
	font-size:13px;
	margin-bottom:2px;
}

.erp-toast-message{
	color:var(--text-secondary);
	font-size:13px;
}

.erp-toast-close{
	flex-shrink:0;
	width:24px;
	height:24px;
	border:none;
	background:none;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--text-secondary);
	border-radius:4px;
	transition:var(--transition);
	padding:0;
}

.erp-toast-close:hover{
	background:rgba(0,0,0,0.06);
	color:var(--text-primary);
}

.erp-toast-success .erp-toast-icon{color:var(--success)}
.erp-toast-success{border-left:3px solid var(--success)}
.erp-toast-error .erp-toast-icon{color:var(--error)}
.erp-toast-error{border-left:3px solid var(--error)}
.erp-toast-warning .erp-toast-icon{color:var(--warning)}
.erp-toast-warning{border-left:3px solid var(--warning)}
.erp-toast-info .erp-toast-icon{color:var(--info)}
.erp-toast-info{border-left:3px solid var(--info)}

/* --- Page section header --- */
.erp-section-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom:20px;
	flex-wrap:wrap;
	gap:12px;
}

.erp-section-title{
	font-size:18px;
	font-weight:700;
	color:var(--text-primary);
	margin:0;
}

.erp-section-subtitle{
	font-size:13px;
	color:var(--text-secondary);
	margin:2px 0 0;
}

/* --- Dashboard cards --- */
.erp-dash-grid{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
	gap:16px;
}

.erp-dash-card{
	background:var(--card-bg);
	border:1px solid var(--border);
	border-radius:var(--radius);
	padding:24px 20px;
	text-decoration:none;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:12px;
	text-align:center;
	transition:var(--transition);
	color:var(--text-primary);
}

.erp-dash-card:hover{
	border-color:var(--info);
	box-shadow:var(--shadow);
	transform:translateY(-2px);
}

.erp-dash-card-icon{
	width:48px;
	height:48px;
	border-radius:var(--radius);
	display:flex;
	align-items:center;
	justify-content:center;
	background:var(--info-light);
	color:var(--info);
}

.erp-dash-card-label{
	font-size:14px;
	font-weight:600;
}

/* --- Modal --- */
.erp-modal-overlay{
	position:fixed;
	top:0;left:0;right:0;bottom:0;
	background:rgba(0,0,0,0.45);
	z-index:1000;
	display:none;
	align-items:center;
	justify-content:center;
	padding:24px;
	animation:erpFadeIn .2s ease;
}

.erp-modal-overlay.open{
	display:flex;
}

.erp-modal{
	background:var(--card-bg);
	border-radius:var(--radius);
	width:100%;
	max-height:85vh;
	display:flex;
	flex-direction:column;
	box-shadow:0 20px 60px rgba(0,0,0,0.25);
	animation:erpSlideUp .25s ease;
}

.erp-modal-sm{max-width:400px}
.erp-modal-md{max-width:560px}
.erp-modal-lg{max-width:720px}

.erp-modal-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:16px 20px;
	border-bottom:1px solid var(--border);
	flex-shrink:0;
}

.erp-modal-title{
	font-size:16px;
	font-weight:600;
	color:var(--text-primary);
	margin:0;
}

.erp-modal-close{
	width:32px;height:32px;
	border:none;background:none;
	border-radius:var(--radius-sm);
	cursor:pointer;
	display:flex;align-items:center;justify-content:center;
	color:var(--text-secondary);
	transition:var(--transition);
}

.erp-modal-close:hover{
	background:var(--content-bg);
	color:var(--text-primary);
}

.erp-modal-body{
	padding:20px;
	overflow-y:auto;
	flex:1;
}

.erp-modal-footer{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:8px;
	padding:12px 20px;
	border-top:1px solid var(--border);
	flex-shrink:0;
}

@keyframes erpFadeIn{
	from{opacity:0}to{opacity:1}
}

@keyframes erpSlideUp{
	from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}
}

/* --- Form Groups & Labels --- */
.erp-form-group{
	margin-bottom:16px;
}

.erp-label{
	display:block;
	font-size:13px;
	font-weight:500;
	color:var(--text-primary);
	margin-bottom:5px;
}

.erp-input{
	width:100%;
	padding:8px 12px;
	font-size:13.5px;
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	background:var(--card-bg);
	color:var(--text-primary);
	transition:var(--transition);
	outline:none;
	box-sizing:border-box;
}

.erp-input:focus{
	border-color:#2563eb;
	box-shadow:0 0 0 3px rgba(37,99,235,0.1);
}

.erp-input::placeholder{
	color:var(--text-secondary);
	opacity:0.6;
}

/* --- Select con "Crear nuevo" --- */
.erp-select-wrapper{
	position:relative;
	display:flex;
	gap:6px;
}

.erp-select-wrapper .erp-select{
	flex:1;
}

.erp-btn-create-new{
	width:36px;
	height:36px;
	min-width:36px;
	padding:0;
	display:flex;
	align-items:center;
	justify-content:center;
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	background:var(--card-bg);
	color:var(--text-secondary);
	cursor:pointer;
	transition:var(--transition);
}

.erp-btn-create-new:hover{
	border-color:#2563eb;
	color:#2563eb;
	background:rgba(37,99,235,0.06);
}

/* --- Upload Zone --- */
.erp-upload-zone{
	margin-bottom:16px;
}

.erp-upload-dropzone{
	border:2px dashed var(--border);
	border-radius:var(--radius);
	padding:24px;
	text-align:center;
	cursor:pointer;
	transition:var(--transition);
	position:relative;
}

.erp-upload-dropzone:hover{
	border-color:#2563eb;
	background:rgba(37,99,235,0.03);
}

.erp-upload-dropzone.dragover{
	border-color:#2563eb;
	background:rgba(37,99,235,0.06);
}

.erp-upload-input{
	position:absolute;
	top:0;left:0;width:100%;height:100%;
	opacity:0;cursor:pointer;z-index:1;
}

.erp-upload-placeholder{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:6px;
	color:var(--text-secondary);
	font-size:13px;
	pointer-events:none;
}

.erp-upload-placeholder svg{
	color:var(--text-secondary);
	opacity:0.5;
}

.upload-hint{
	font-size:11px;
	opacity:0.6;
}

.erp-upload-preview{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	z-index:2;
	position:relative;
}

.upload-preview-name{
	font-size:13px;
	font-weight:500;
	color:var(--text-primary);
}

.erp-upload-remove{
	width:24px;height:24px;
	border:none;background:none;
	color:var(--text-secondary);
	cursor:pointer;
	display:flex;align-items:center;justify-content:center;
	border-radius:50%;
	transition:var(--transition);
}

.erp-upload-remove:hover{
	background:rgba(239,68,68,0.1);
	color:#ef4444;
}

.erp-upload-current{
	padding:10px 14px;
	background:rgba(37,99,235,0.04);
	border:1px solid rgba(37,99,235,0.15);
	border-radius:var(--radius-sm);
	margin-bottom:8px;
}

.erp-upload-thumb-wrap{
	display:flex;
	align-items:center;
	gap:12px;
}

.erp-upload-thumb{
	display:flex;
	align-items:center;
	justify-content:center;
	width:72px;
	height:72px;
	border-radius:var(--radius-sm);
	overflow:hidden;
	flex-shrink:0;
	border:1px solid var(--border);
	background:var(--content-bg);
	transition:transform .2s ease, box-shadow .2s ease;
}
.erp-upload-thumb:hover{
	transform:scale(1.05);
	box-shadow:0 4px 12px rgba(0,0,0,.12);
}
.erp-upload-thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.erp-upload-thumb-pdf{
	flex-direction:column;
	gap:2px;
	color:var(--danger);
	background:rgba(239,68,68,.06);
	border-color:rgba(239,68,68,.2);
}
.erp-upload-thumb-pdf span{
	font-size:10px;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.5px;
}

.upload-file-info{
	display:flex;
	flex-direction:column;
	gap:6px;
	font-size:13px;
	color:var(--text-primary);
}

.upload-file-info svg{
	color:#2563eb;
}

/* Thumbnail para nuevo archivo */
.erp-upload-thumb-new{
	display:none;
}
.erp-upload-thumb-new.has-preview{
	display:flex;
	align-items:center;
	justify-content:center;
	width:56px;
	height:56px;
	border-radius:var(--radius-sm);
	overflow:hidden;
	flex-shrink:0;
	border:1px solid var(--border);
	margin-right:8px;
	animation:erpFadeIn .3s ease;
}
.erp-upload-thumb-new img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.erp-upload-thumb-new.is-pdf{
	background:rgba(239,68,68,.06);
	border-color:rgba(239,68,68,.2);
	color:var(--danger);
	flex-direction:column;
	gap:2px;
}
.erp-upload-thumb-new.is-pdf span{
	font-size:9px;
	font-weight:700;
}
@keyframes erpFadeIn{
	from{opacity:0;transform:scale(.9)}
	to{opacity:1;transform:scale(1)}
}

/* --- Document Cards (vista detalle) --- */
.erp-docs-grid{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
	gap:16px;
	margin-top:8px;
}
.erp-doc-card{
	display:flex;
	flex-direction:column;
	border:1px solid var(--border);
	border-radius:var(--radius);
	overflow:hidden;
	background:var(--content-bg);
	transition:box-shadow .2s ease;
}
.erp-doc-card:hover{
	box-shadow:0 4px 16px rgba(0,0,0,.1);
}
.erp-doc-thumb{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	height:120px;
	overflow:hidden;
	background:var(--card-bg);
	transition:transform .2s ease;
}
.erp-doc-thumb:hover{
	transform:scale(1.03);
}
.erp-doc-thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.erp-doc-thumb-pdf{
	flex-direction:column;
	gap:4px;
	color:var(--danger);
	background:rgba(239,68,68,.04);
}
.erp-doc-thumb-pdf span{
	font-size:11px;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.5px;
}
.erp-doc-info{
	display:flex;
	flex-direction:column;
	gap:2px;
	padding:10px 12px;
}
.erp-doc-label{
	font-size:12px;
	font-weight:600;
	color:var(--text-primary);
}
.erp-doc-name{
	font-size:11px;
	color:var(--text-secondary);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.erp-doc-expiry{
	font-size:11px;
	color:var(--warning);
	font-weight:500;
}

.erp-upload-expiry{
	margin-top:8px;
}

.erp-upload-expiry .erp-input{
	max-width:200px;
}

/* --- Conditional Groups --- */
.erp-conditional-group{
	padding:12px 0 0;
}

/* --- Utility --- */
.hidden{
	display:none!important;
}

.erp-form-row{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
	gap:0 16px;
}

.erp-form-row-3{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:0 16px;
}

.erp-form-row-2{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:0 16px;
}

@media (max-width:768px){
	.erp-form-row-3,.erp-form-row-2{
		grid-template-columns:1fr;
	}
}

/* --- Section Divider --- */
.erp-section-title{
	font-size:14px;
	font-weight:600;
	color:var(--text-primary);
	padding:16px 0 8px;
	margin:8px 0 12px;
	border-bottom:1px solid var(--border);
}

/* --- Section Header (title + action) --- */
.erp-section-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom:16px;
	flex-wrap:wrap;
	gap:10px;
}

.erp-section-title-inline{
	font-size:18px;
	font-weight:600;
	color:var(--text-primary);
	margin:0;
}

/* --- Detail Grid --- */
.erp-detail-grid{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
	gap:12px 24px;
	margin-bottom:8px;
}

.erp-detail-item{
	display:flex;
	flex-direction:column;
	gap:2px;
}

.erp-detail-label{
	font-size:11px;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:0.5px;
	color:var(--text-secondary);
}

.erp-detail-value{
	font-size:13.5px;
	color:var(--text-primary);
}

.erp-detail-value a{
	color:#2563eb;
	text-decoration:none;
}

.erp-detail-value a:hover{
	text-decoration:underline;
}

/* --- Badges --- */
.erp-badge{
	display:inline-flex;
	align-items:center;
	padding:2px 8px;
	border-radius:10px;
	font-size:11px;
	font-weight:600;
	letter-spacing:0.3px;
}

.erp-badge-success{
	background:rgba(34,197,94,0.1);
	color:#16a34a;
}

.erp-badge-warning{
	background:rgba(234,179,8,0.1);
	color:#ca8a04;
}

.erp-badge-danger{
	background:rgba(239,68,68,0.1);
	color:#dc2626;
}

.erp-badge-info{
	background:rgba(59,130,246,0.1);
	color:#2563eb;
}

.erp-badge-muted{
	background:rgba(100,116,139,0.1);
	color:#64748b;
}

/* --- Inline status select (lists) --- */
.erp-sts-select{
	appearance:none;
	-webkit-appearance:none;
	border:1px solid var(--border);
	border-radius:10px;
	padding:2px 24px 2px 22px;
	font-size:11px;
	font-weight:600;
	letter-spacing:0.3px;
	cursor:pointer;
	background-repeat:no-repeat,no-repeat;
	background-position:right 6px center,left 8px center;
	background-size:10px,8px 8px;
	transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.erp-sts-select:focus{
	outline:none;
}
.erp-sts-select--erp-badge-success{
	background-color:rgba(34,197,94,0.1);
	color:#16a34a;
	border-color:rgba(34,197,94,0.25);
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Ccircle cx='4' cy='4' r='4' fill='%2316a34a'/%3E%3C/svg%3E");
}
.erp-sts-select--erp-badge-success:focus{
	border-color:#16a34a;
	box-shadow:0 0 0 3px rgba(34,197,94,0.18);
}
.erp-sts-select--erp-badge-warning{
	background-color:rgba(234,179,8,0.1);
	color:#ca8a04;
	border-color:rgba(234,179,8,0.25);
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Ccircle cx='4' cy='4' r='4' fill='%23ca8a04'/%3E%3C/svg%3E");
}
.erp-sts-select--erp-badge-warning:focus{
	border-color:#ca8a04;
	box-shadow:0 0 0 3px rgba(234,179,8,0.18);
}
.erp-sts-select--erp-badge-danger{
	background-color:rgba(239,68,68,0.1);
	color:#dc2626;
	border-color:rgba(239,68,68,0.25);
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Ccircle cx='4' cy='4' r='4' fill='%23dc2626'/%3E%3C/svg%3E");
}
.erp-sts-select--erp-badge-danger:focus{
	border-color:#dc2626;
	box-shadow:0 0 0 3px rgba(239,68,68,0.18);
}
.erp-sts-select--erp-badge-info{
	background-color:rgba(59,130,246,0.1);
	color:#2563eb;
	border-color:rgba(59,130,246,0.25);
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Ccircle cx='4' cy='4' r='4' fill='%232563eb'/%3E%3C/svg%3E");
}
.erp-sts-select--erp-badge-info:focus{
	border-color:#2563eb;
	box-shadow:0 0 0 3px rgba(59,130,246,0.18);
}
.erp-sts-select--erp-badge-muted{
	background-color:rgba(100,116,139,0.1);
	color:#64748b;
	border-color:rgba(100,116,139,0.25);
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Ccircle cx='4' cy='4' r='4' fill='%2364748b'/%3E%3C/svg%3E");
}
.erp-sts-select--erp-badge-muted:focus{
	border-color:#64748b;
	box-shadow:0 0 0 3px rgba(100,116,139,0.18);
}

/* --- Action buttons --- */
.erp-actions{
	display:flex;
	gap:4px;
}

.erp-btn{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:8px 16px;
	border-radius:var(--radius-sm);
	font-size:13px;
	font-weight:500;
	text-decoration:none;
	border:none;
	cursor:pointer;
	transition:var(--transition);
}

.erp-btn-primary{
	background:#2563eb;
	color:#fff;
}

.erp-btn-primary:hover{
	background:#1d4ed8;
}

.erp-btn-ghost{
	background:transparent;
	color:var(--text-secondary);
	border:1px solid var(--border);
}

.erp-btn-ghost:hover{
	background:var(--hover-bg, rgba(0,0,0,0.04));
	color:var(--text-primary);
}

.erp-btn-sm{
	padding:5px 8px;
	font-size:12px;
	border-radius:var(--radius-sm);
	border:none;
	background:none;
	cursor:pointer;
	color:var(--text-secondary);
	display:inline-flex;
	align-items:center;
	gap:4px;
	transition:var(--transition);
}

.erp-btn-sm:hover{
	background:rgba(37,99,235,0.08);
	color:#2563eb;
}

/* --- Content Card --- */
.content-card{
	background:var(--card-bg);
	border-radius:var(--radius);
	border:1px solid var(--border);
	padding:24px;
}

/* =============================================
   VALIDACIÓN VISUAL DE CAMPOS
   ============================================= */
.erp-input.erp-field-error,
.erp-select.erp-field-error{
	border-color:var(--error) !important;
	box-shadow:0 0 0 2px rgba(239,68,68,0.15) !important;
}

.erp-input.erp-field-error:focus,
.erp-select.erp-field-error:focus{
	border-color:var(--error) !important;
	box-shadow:0 0 0 3px rgba(239,68,68,0.2) !important;
}

.erp-field-error-msg{
	display:block;
	font-size:12px;
	color:var(--error);
	margin-top:4px;
	line-height:1.3;
	animation:fieldErrorIn 0.2s ease;
}

@keyframes fieldErrorIn{
	from{opacity:0;transform:translateY(-4px)}
	to{opacity:1;transform:translateY(0)}
}

.erp-input.erp-field-success{
	border-color:var(--success) !important;
	box-shadow:0 0 0 2px rgba(16,185,129,0.15) !important;
}

/* =============================================
   TOOLTIPS DE AYUDA EN CAMPOS
   ============================================= */
.erp-label-row{
	display:flex;
	align-items:center;
	gap:6px;
}

.erp-help-tip{
	position:relative;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:16px;
	height:16px;
	border-radius:50%;
	background:var(--info-light);
	color:var(--info);
	font-size:10px;
	font-weight:700;
	cursor:help;
	flex-shrink:0;
	transition:var(--transition);
}

.erp-help-tip:hover{
	background:var(--info);
	color:#fff;
}

.erp-help-tip .erp-tip-text{
	display:none;
	position:absolute;
	bottom:calc(100% + 8px);
	left:50%;
	transform:translateX(-50%);
	background:#1e293b;
	color:#f1f5f9;
	font-size:12px;
	font-weight:400;
	padding:8px 12px;
	border-radius:var(--radius-sm);
	white-space:nowrap;
	max-width:280px;
	white-space:normal;
	line-height:1.4;
	box-shadow:var(--shadow-lg);
	z-index:500;
	pointer-events:none;
}

.erp-help-tip .erp-tip-text::after{
	content:'';
	position:absolute;
	top:100%;
	left:50%;
	transform:translateX(-50%);
	border:5px solid transparent;
	border-top-color:#1e293b;
}

.erp-help-tip:hover .erp-tip-text{
	display:block;
	animation:tipFadeIn 0.15s ease;
}

@keyframes tipFadeIn{
	from{opacity:0;transform:translateX(-50%) translateY(4px)}
	to{opacity:1;transform:translateX(-50%) translateY(0)}
}

/* =============================================
   PANEL LATERAL DE AYUDA
   ============================================= */
.erp-help-toggle{
	position:fixed;
	bottom:24px;
	right:24px;
	width:48px;
	height:48px;
	border-radius:50%;
	background:linear-gradient(135deg,#3b82f6,#2563eb);
	color:#fff;
	border:none;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 4px 16px rgba(37,99,235,0.35);
	z-index:900;
	transition:all 0.3s ease;
	font-size:20px;
	font-weight:700;
}

.erp-help-toggle:hover{
	transform:scale(1.1);
	box-shadow:0 6px 24px rgba(37,99,235,0.45);
}

.erp-help-toggle.active{
	background:linear-gradient(135deg,#ef4444,#dc2626);
	box-shadow:0 4px 16px rgba(239,68,68,0.35);
}

.erp-help-panel{
	position:fixed;
	top:0;
	right:-380px;
	width:380px;
	height:100vh;
	background:var(--card-bg);
	border-left:1px solid var(--border);
	box-shadow:var(--shadow-xl);
	z-index:899;
	transition:right 0.3s ease;
	display:flex;
	flex-direction:column;
	overflow:hidden;
}

.erp-help-panel.open{
	right:0;
}

.erp-help-panel-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:20px 24px;
	border-bottom:1px solid var(--border);
	flex-shrink:0;
}

.erp-help-panel-title{
	font-size:16px;
	font-weight:600;
	color:var(--text-primary);
	display:flex;
	align-items:center;
	gap:8px;
}

.erp-help-panel-close{
	width:32px;
	height:32px;
	border:none;
	background:none;
	border-radius:var(--radius-sm);
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--text-secondary);
	transition:var(--transition);
}

.erp-help-panel-close:hover{
	background:rgba(0,0,0,0.06);
	color:var(--text-primary);
}

.erp-help-panel-body{
	flex:1;
	overflow-y:auto;
	padding:20px 24px;
}

.erp-help-section{
	margin-bottom:20px;
}

.erp-help-section-title{
	font-size:13px;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:0.5px;
	color:var(--text-secondary);
	margin-bottom:10px;
	display:flex;
	align-items:center;
	gap:6px;
}

.erp-help-item{
	padding:10px 14px;
	background:var(--content-bg);
	border-radius:var(--radius-sm);
	margin-bottom:8px;
	font-size:13px;
	line-height:1.5;
	color:var(--text-primary);
}

.erp-help-item strong{
	color:var(--info);
}

.erp-help-item code{
	font-family:var(--font-mono);
	font-size:12px;
	background:rgba(59,130,246,0.08);
	color:var(--info);
	padding:1px 5px;
	border-radius:3px;
}

.erp-help-panel-overlay{
	display:none;
	position:fixed;
	inset:0;
	background:rgba(0,0,0,0.3);
	z-index:898;
}

.erp-help-panel-overlay.open{
	display:block;
}

@media(max-width:768px){
	.erp-help-panel{
		width:100%;
		right:-100%;
	}
	.erp-help-toggle{
		bottom:16px;
		right:16px;
		width:42px;
		height:42px;
	}
}