/* Gestor XML Compras - Panel front-end [gxc_panel] */

.gxc-panel {
	--gxc-primary: #2271b1;
	--gxc-primary-dark: #135e96;
	--gxc-border: #e2e4e7;
	--gxc-text: #1d2327;
	--gxc-muted: #646970;
	--gxc-bg-soft: #f6f7f7;

	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--gxc-text);
	max-width: 1100px;
	margin: 0 auto;
	font-size: 14px;
	line-height: 1.5;
}

.gxc-panel--denied {
	padding: 20px;
	background: #fdeaea;
	border: 1px solid #f0c0c0;
	border-radius: 8px;
	color: #9c2626;
}

/* Header */
.gxc-panel__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	padding-bottom: 16px;
	border-bottom: 2px solid var(--gxc-border);
	margin-bottom: 18px;
}

.gxc-panel__title {
	margin: 0;
	font-size: 20px;
	font-weight: 600;
}

/* Botones */
.gxc-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 16px;
	border: none;
	border-radius: 5px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s ease, opacity 0.15s ease;
	line-height: 1.4;
}

.gxc-btn--primary {
	background: var(--gxc-primary);
	color: #fff;
}

.gxc-btn--primary:hover {
	background: var(--gxc-primary-dark);
}

.gxc-btn--secondary {
	background: #fff;
	color: var(--gxc-primary);
	border: 1px solid var(--gxc-primary);
}

.gxc-btn--secondary:hover {
	background: #f0f6fc;
}

/* Grupo de botones del header */
.gxc-panel__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Spinner oscuro para botones de fondo claro */
.gxc-spinner--dark {
	border-color: rgba(0, 0, 0, 0.2);
	border-top-color: var(--gxc-primary);
}

.gxc-btn--small {
	padding: 6px 12px;
	font-size: 12px;
}

.gxc-btn--download {
	background: #1a7f4b;
	color: #fff;
}

.gxc-btn--download:hover {
	background: #14663c;
}

.gxc-btn:disabled,
.gxc-btn.gxc-loading {
	opacity: 0.7;
	cursor: progress;
}

/* Spinner */
.gxc-spinner {
	display: none;
	width: 13px;
	height: 13px;
	border: 2px solid rgba(255, 255, 255, 0.45);
	border-top-color: #fff;
	border-radius: 50%;
	animation: gxc-spin 0.7s linear infinite;
}

.gxc-spinner--small {
	width: 11px;
	height: 11px;
}

.gxc-loading .gxc-spinner {
	display: inline-block;
}

@keyframes gxc-spin {
	to {
		transform: rotate(360deg);
	}
}

/* Avisos y mensajes */
.gxc-notice {
	padding: 11px 16px;
	border-radius: 6px;
	margin-bottom: 16px;
	font-size: 13px;
	border-left: 4px solid #c3c4c7;
}

.gxc-notice--warning {
	background: #fcf6e1;
	border-left-color: #d4a017;
	color: #7a5a0a;
}

.gxc-notice--info {
	background: #e7f0fb;
	border-left-color: #2271b1;
	color: #135e96;
}

.gxc-message {
	margin-bottom: 16px;
}

.gxc-message:empty {
	margin-bottom: 0;
}

.gxc-message__box {
	padding: 11px 16px;
	border-radius: 6px;
	font-size: 13px;
	border-left: 4px solid #c3c4c7;
}

.gxc-message__box--success {
	background: #edfaf1;
	border-left-color: #1a7f4b;
	color: #14663c;
}

.gxc-message__box--error {
	background: #fdeaea;
	border-left-color: #c0392b;
	color: #9c2626;
}

/* Tabla */
.gxc-table-wrap {
	overflow-x: auto;
	border: 1px solid var(--gxc-border);
	border-radius: 8px;
	background: #fff;
}

.gxc-table {
	width: 100%;
	border-collapse: collapse;
	min-width: 760px;
}

.gxc-table thead th {
	background: var(--gxc-bg-soft);
	text-align: left;
	padding: 12px 14px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--gxc-muted);
	border-bottom: 1px solid var(--gxc-border);
	white-space: nowrap;
}

.gxc-table tbody td {
	padding: 12px 14px;
	border-bottom: 1px solid #f0f0f1;
	font-size: 13px;
	vertical-align: middle;
}

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

.gxc-table tbody tr:hover {
	background: #fafbfc;
}

.gxc-col-uid {
	font-family: Menlo, Consolas, monospace;
	font-size: 12px;
	color: var(--gxc-muted);
}

.gxc-col-asunto {
	max-width: 280px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.gxc-col-remitente {
	max-width: 220px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.gxc-empty-row td {
	text-align: center;
	color: var(--gxc-muted);
	padding: 28px 14px !important;
	font-style: italic;
}

/* Badges */
.gxc-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 11px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.6;
	white-space: nowrap;
}

.gxc-badge--yes {
	background: #d8f5e3;
	color: #14663c;
}

.gxc-badge--no {
	background: #f0f0f1;
	color: #646970;
}

.gxc-badge--neutral {
	background: #f0f0f1;
	color: #8c8f94;
}

.gxc-badge--pending {
	background: #fcf3d4;
	color: #8a6d1a;
}

.gxc-badge--success {
	background: #d8f5e3;
	color: #14663c;
}

.gxc-action-done {
	color: #1a7f4b;
	font-weight: 600;
	font-size: 12px;
}

.gxc-action-na {
	color: #c3c4c7;
}

/* Enlaces a archivos descargados (Ver XML / Ver PDF) */
.gxc-file-links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.gxc-file-link {
	display: inline-block;
	padding: 5px 11px;
	border-radius: 5px;
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
	line-height: 1.4;
	white-space: nowrap;
	transition: opacity 0.15s ease;
}

.gxc-file-link:hover {
	opacity: 0.85;
}

.gxc-file-link--xml {
	background: #e7f0fb;
	color: #135e96;
	border: 1px solid #c6dcf5;
}

.gxc-file-link--pdf {
	background: #fdecea;
	color: #b3261e;
	border: 1px solid #f5cdc8;
}

/* Footer */
.gxc-panel__footer {
	margin-top: 14px;
	font-size: 12px;
	color: var(--gxc-muted);
}

/* Responsive */
@media (max-width: 600px) {
	.gxc-panel__header {
		flex-direction: column;
		align-items: flex-start;
	}

	.gxc-panel__title {
		font-size: 18px;
	}

	.gxc-panel__actions {
		width: 100%;
		flex-direction: column;
	}

	.gxc-panel__actions .gxc-btn {
		width: 100%;
		justify-content: center;
	}
}

/* ============================================================
 * BOTONES ADICIONALES
 * ============================================================ */
.gxc-btn--ghost {
	background: transparent;
	color: var(--gxc-muted);
	border: 1px solid var(--gxc-border);
}

.gxc-btn--ghost:hover {
	background: var(--gxc-bg-soft);
	color: var(--gxc-text);
}

.gxc-btn--extract {
	background: var(--gxc-success, #15803d);
	color: #fff;
	border: 1px solid var(--gxc-success, #15803d);
}

.gxc-btn--extract:hover {
	background: #166534;
	border-color: #166534;
}

.gxc-btn--extract.gxc-btn--done {
	background: #ecfdf3;
	color: #14663c;
	border-color: #c6ecd4;
}

.gxc-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.gxc-btn.gxc-loading {
	opacity: 0.7;
	cursor: progress;
}

/* ============================================================
 * MODALES (overlay común)
 * ============================================================ */
.gxc-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(17, 24, 39, 0.55);
	backdrop-filter: blur(2px);
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 99999;
	padding: 20px;
}

.gxc-modal-overlay--visible {
	display: flex;
	animation: gxc-fade-in 0.2s ease;
}

@keyframes gxc-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

.gxc-modal {
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
	width: 100%;
	position: relative;
	animation: gxc-modal-in 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}

@keyframes gxc-modal-in {
	from { opacity: 0; transform: translateY(16px) scale(0.97); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ---- Modal de progreso ---- */
.gxc-modal--progress {
	max-width: 420px;
	padding: 34px 30px 28px;
	text-align: center;
}

.gxc-modal__spinner {
	width: 64px;
	height: 64px;
	margin: 0 auto 18px;
}

.gxc-circular {
	width: 100%;
	height: 100%;
	animation: gxc-rotate 2s linear infinite;
}

.gxc-circular__track {
	stroke: #eef0f2;
}

.gxc-circular__path {
	stroke: var(--gxc-primary);
	stroke-linecap: round;
	stroke-dasharray: 90, 150;
	stroke-dashoffset: 0;
	animation: gxc-dash 1.5s ease-in-out infinite;
}

@keyframes gxc-rotate {
	100% { transform: rotate(360deg); }
}

@keyframes gxc-dash {
	0%   { stroke-dasharray: 1, 150;   stroke-dashoffset: 0; }
	50%  { stroke-dasharray: 90, 150;  stroke-dashoffset: -35; }
	100% { stroke-dasharray: 90, 150;  stroke-dashoffset: -124; }
}

.gxc-modal__title {
	margin: 0 0 6px;
	font-size: 17px;
	font-weight: 600;
	color: var(--gxc-text);
}

.gxc-modal__subtitle {
	margin: 0 0 18px;
	font-size: 13px;
	color: var(--gxc-muted);
	min-height: 18px;
}

/* Barra de progreso */
.gxc-progress {
	width: 100%;
	height: 10px;
	background: #eef0f2;
	border-radius: 6px;
	overflow: hidden;
}

.gxc-progress__bar {
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--gxc-primary), #4f9fd6);
	border-radius: 6px;
	transition: width 0.35s ease;
}

.gxc-progress__text {
	margin: 10px 0 0;
	font-size: 13px;
	font-weight: 700;
	color: var(--gxc-primary);
}

/* ---- Modal de datos ---- */
.gxc-modal--data {
	max-width: 760px;
	max-height: 86vh;
	overflow-y: auto;
	padding: 26px 28px;
}

.gxc-modal__close {
	position: absolute;
	top: 14px;
	right: 16px;
	background: none;
	border: none;
	font-size: 26px;
	line-height: 1;
	color: var(--gxc-muted);
	cursor: pointer;
	padding: 4px 8px;
	border-radius: 6px;
}

.gxc-modal__close:hover {
	background: var(--gxc-bg-soft);
	color: var(--gxc-text);
}

.gxc-modal__body {
	margin-top: 8px;
}

.gxc-data-section {
	margin-bottom: 22px;
}

.gxc-data-section__title {
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--gxc-primary);
	border-bottom: 2px solid var(--gxc-border);
	padding-bottom: 6px;
}

.gxc-data-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 18px;
}

.gxc-data-item {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.gxc-data-item__label {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--gxc-muted);
}

.gxc-data-item__value {
	font-size: 14px;
	font-weight: 600;
	color: var(--gxc-text);
	word-break: break-word;
}

/* Tabla de productos dentro del modal */
.gxc-data-table-wrap {
	overflow-x: auto;
	border: 1px solid var(--gxc-border);
	border-radius: 8px;
}

.gxc-data-table {
	width: 100%;
	border-collapse: collapse;
	min-width: 520px;
}

.gxc-data-table thead th {
	background: var(--gxc-bg-soft);
	text-align: left;
	padding: 9px 12px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--gxc-muted);
	border-bottom: 1px solid var(--gxc-border);
}

.gxc-data-table tbody td {
	padding: 9px 12px;
	font-size: 13px;
	border-bottom: 1px solid #f0f0f1;
}

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

/* Responsive del modal de datos */
@media (max-width: 600px) {
	.gxc-data-grid {
		grid-template-columns: 1fr;
	}

	.gxc-modal--data,
	.gxc-modal--progress {
		padding: 22px 18px;
	}
}

/* ============================================================
 * SELECTOR DE MES
 * ============================================================ */
.gxc-month-picker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #fff;
	border: 1px solid var(--gxc-border);
	border-radius: 5px;
	padding: 4px 10px 4px 12px;
	height: 36px;
}

.gxc-month-picker__label {
	font-size: 12px;
	font-weight: 600;
	color: var(--gxc-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.gxc-month-picker__input {
	border: none;
	background: transparent;
	font-size: 13px;
	font-weight: 600;
	color: var(--gxc-text);
	padding: 2px 4px;
	font-family: inherit;
	outline: none;
	cursor: pointer;
}

.gxc-month-picker__input:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

@media (max-width: 600px) {
	.gxc-month-picker {
		width: 100%;
		justify-content: space-between;
	}
}

/* ============================================================
 * PESTAÑAS Y VISTAS
 * ============================================================ */
.gxc-tabs {
	display: flex;
	gap: 4px;
	border-bottom: 2px solid var(--gxc-border);
	margin: 16px 0;
}

.gxc-tab {
	background: transparent;
	border: none;
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 600;
	color: var(--gxc-muted);
	cursor: pointer;
	border-bottom: 2px solid transparent;
	margin-bottom: -2px;
}

.gxc-tab:hover { color: var(--gxc-text); }

.gxc-tab--active {
	color: var(--gxc-primary);
	border-bottom-color: var(--gxc-primary);
}

.gxc-tab__count {
	display: inline-block;
	margin-left: 6px;
	padding: 1px 8px;
	border-radius: 10px;
	background: var(--gxc-primary);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
}

.gxc-view { display: none; }
.gxc-view--active { display: block; }

/* ============================================================
 * FILTROS DE HOMOLOGACIÓN
 * ============================================================ */
.gxc-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: flex-end;
	margin-bottom: 14px;
	padding: 12px;
	background: var(--gxc-bg-soft);
	border-radius: 6px;
}

.gxc-filter { display: flex; flex-direction: column; gap: 4px; }
.gxc-filter label {
	font-size: 11px;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--gxc-muted);
}
.gxc-filter select,
.gxc-filter input {
	padding: 6px 10px;
	border: 1px solid var(--gxc-border);
	border-radius: 4px;
	font-size: 13px;
	background: #fff;
	min-width: 180px;
}

/* ============================================================
 * TABLA DE ITEMS DE HOMOLOGACIÓN — compacta
 * ============================================================ */
.gxc-items-table {
	min-width: 0;
	width: 100%;
	table-layout: fixed;
	font-size: 12.5px;
}

.gxc-items-table th,
.gxc-items-table td {
	padding: 8px 6px;
	vertical-align: top;
	word-break: break-word;
	overflow-wrap: anywhere;
}

/* Anchos relativos por columna para que ninguna domine. */
.gxc-items-table th:nth-child(1),
.gxc-items-table td:nth-child(1) { width: 14%; }     /* Proveedor */
.gxc-items-table th:nth-child(2),
.gxc-items-table td:nth-child(2) { width: 8%; font-family: monospace; font-size: 11px; }  /* Código XML */
.gxc-items-table th:nth-child(3),
.gxc-items-table td:nth-child(3) { width: 16%; }     /* Producto XML */
.gxc-items-table th:nth-child(4),
.gxc-items-table td:nth-child(4) { width: 18%; }     /* Coincidencia WC */
.gxc-items-table th:nth-child(5),
.gxc-items-table td:nth-child(5) { width: 6%; text-align: center; }  /* Confianza */
.gxc-items-table th:nth-child(6),
.gxc-items-table td:nth-child(6) { width: 8%; text-align: right; font-variant-numeric: tabular-nums; }  /* Costo */
.gxc-items-table th:nth-child(7),
.gxc-items-table td:nth-child(7) { width: 8%; text-align: right; font-variant-numeric: tabular-nums; }  /* P. venta WC */
.gxc-items-table th:nth-child(8),
.gxc-items-table td:nth-child(8) { width: 9%; }      /* Estado */
.gxc-items-table th:nth-child(9),
.gxc-items-table td:nth-child(9) { width: 13%; }     /* Acción */

.gxc-proveedor__nombre { font-weight: 600; font-size: 12.5px; line-height: 1.3; }
.gxc-proveedor__nit    { font-size: 10.5px; color: var(--gxc-muted); }

.gxc-prod-wc__nombre { font-weight: 600; font-size: 12.5px; line-height: 1.3; }
.gxc-prod-wc__sku    { font-size: 10.5px; color: var(--gxc-muted); font-family: monospace; }
.gxc-prod-wc__stock  { font-size: 10.5px; color: var(--gxc-muted); }

.gxc-confianza {
	display: inline-block;
	padding: 2px 7px;
	border-radius: 10px;
	font-size: 11px;
	font-weight: 700;
}
.gxc-confianza--success { background: #d8f5e3; color: #14663c; }
.gxc-confianza--warning { background: #fcf3d4; color: #8a6d1a; }
.gxc-confianza--danger  { background: #fbd9d9; color: #9c2626; }

.gxc-badge--warning { background: #fcf3d4; color: #8a6d1a; }
.gxc-badge--danger  { background: #fbd9d9; color: #9c2626; }
.gxc-badge--success { background: #d8f5e3; color: #14663c; }
.gxc-badge--neutral { background: #f0f0f1; color: #646970; }

.gxc-item-row--coincidencia_alta { background: rgba(216, 245, 227, 0.25); }
.gxc-item-row--revisar           { background: rgba(252, 243, 212, 0.25); }
.gxc-item-row--no_encontrado     { background: rgba(251, 217, 217, 0.20); }
.gxc-item-row--confirmado        { background: rgba(216, 245, 227, 0.5); }

.gxc-col-accion { white-space: normal; }
.gxc-col-accion .gxc-btn {
	margin: 2px 2px 0 0;
	padding: 4px 8px;
	font-size: 11.5px;
}

/* ============================================================
 * MODAL DE BÚSQUEDA DE PRODUCTO
 * ============================================================ */
.gxc-search-input {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--gxc-border);
	border-radius: 5px;
	font-size: 14px;
	margin-bottom: 12px;
}

.gxc-search-results {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 360px;
	overflow-y: auto;
	border: 1px solid var(--gxc-border);
	border-radius: 5px;
}

.gxc-search-result,
.gxc-search-loading,
.gxc-search-empty {
	padding: 10px 14px;
	font-size: 13px;
	border-bottom: 1px solid #f0f0f1;
}

.gxc-search-result { cursor: pointer; }
.gxc-search-result:hover { background: var(--gxc-bg-soft); }
.gxc-search-result:last-child,
.gxc-search-empty,
.gxc-search-loading { border-bottom: none; }

.gxc-search-price {
	float: right;
	font-weight: 700;
	color: var(--gxc-primary);
}

.gxc-search-empty,
.gxc-search-loading {
	color: var(--gxc-muted);
	font-style: italic;
	text-align: center;
}

/* ============================================================
 * CABECERA DE FACTURA ACTIVA (vista de homologación)
 * ============================================================ */
.gxc-factura-activa {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	padding: 10px 14px;
	background: #eef4fa;
	border-left: 4px solid var(--gxc-primary);
	border-radius: 4px;
	margin-bottom: 12px;
	font-size: 13px;
}
.gxc-factura-activa__info {
	font-weight: 600;
	color: var(--gxc-text);
}
.gxc-factura-activa__progreso {
	margin-left: auto;
	font-size: 12px;
	color: var(--gxc-muted);
	font-weight: 600;
}

/* ============================================================
 * BOTÓN DE IA Y FORMULARIO DE CREACIÓN
 * ============================================================ */
.gxc-btn--ai {
	background: linear-gradient(90deg, #7c3aed, #4f46e5);
	color: #fff;
	border: none;
}
.gxc-btn--ai:hover { opacity: 0.92; }

.gxc-form-row { margin-bottom: 14px; }
.gxc-form-row label {
	display: block;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--gxc-muted);
	margin-bottom: 4px;
}
.gxc-form-input {
	width: 100%;
	padding: 8px 10px;
	border: 1px solid var(--gxc-border);
	border-radius: 4px;
	font-size: 14px;
	background: #fff;
}
.gxc-form-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
}
.gxc-form-actions {
	display: flex;
	gap: 10px;
	margin-top: 16px;
	justify-content: flex-end;
}

@media (max-width: 600px) {
	.gxc-form-grid { grid-template-columns: 1fr; }
	.gxc-factura-activa { flex-direction: column; align-items: flex-start; }
	.gxc-factura-activa__progreso { margin-left: 0; }
}

/* ============================================================
 * RESPONSIVE: tabla → tarjetas en móvil
 * ============================================================ */
@media (max-width: 760px) {
	.gxc-items-table thead { display: none; }
	.gxc-items-table,
	.gxc-items-table tbody,
	.gxc-items-table tr,
	.gxc-items-table td { display: block; width: 100%; }
	.gxc-items-table tr {
		margin-bottom: 12px;
		border: 1px solid var(--gxc-border);
		border-radius: 6px;
		padding: 10px;
		background: #fff;
	}
	.gxc-items-table td {
		border: none;
		padding: 4px 0;
	}
	.gxc-items-table td:before {
		content: attr(data-label);
		display: block;
		font-size: 11px;
		text-transform: uppercase;
		color: var(--gxc-muted);
		font-weight: 700;
	}
}

/* ============================================================
 * v1.8.0 — REDISEÑO: modal 90%, tipo compra/gasto, mayúsculas
 * Sobrescribe estilos previos donde corresponda.
 * ============================================================ */

/* Mayúsculas globales en controles del panel */
.gxc-panel select,
.gxc-panel select option,
.gxc-panel .gxc-btn,
.gxc-panel .gxc-tab,
.gxc-panel .gxc-month-picker__label,
.gxc-panel .gxc-filter label,
.gxc-panel .gxc-form-row label,
.gxc-panel .gxc-table thead th,
.gxc-modal--work select,
.gxc-modal--work select option,
.gxc-modal--work .gxc-btn,
.gxc-modal--work .gxc-filter label,
.gxc-modal--work .gxc-form-row label,
.gxc-modal--work .gxc-table thead th {
	text-transform: uppercase;
	letter-spacing: 0.3px;
}

/* Inputs en mayúsculas en lo escrito (no en el placeholder) */
.gxc-panel input[type="text"],
.gxc-modal--work input[type="text"],
.gxc-form-input {
	text-transform: uppercase;
}
.gxc-panel input[type="text"]::placeholder,
.gxc-modal--work input[type="text"]::placeholder,
.gxc-form-input::placeholder {
	text-transform: none;
}

/* Bandeja: columna TIPO + badges compra/gasto */
.gxc-col-tipo { width: 90px; text-align: center; }

.gxc-badge--compra {
	background: #d8f5e3;
	color: #14663c;
	font-weight: 700;
}
.gxc-badge--gasto {
	background: #dbeafe;
	color: #1e40af;
	font-weight: 700;
}

/* Bloquear scroll del body cuando hay modal grande */
body.gxc-no-scroll { overflow: hidden; }

/* Overlay sólido para el modal de trabajo */
.gxc-modal-overlay--solid {
	background: rgba(15, 23, 42, 0.72);
}

/* ----------------------------------------------------------------
 * Modal grande de TRABAJO (90% pantalla)
 * ---------------------------------------------------------------- */
.gxc-modal--work {
	width: 90vw;
	max-width: 90vw;
	height: 90vh;
	max-height: 90vh;
	display: flex;
	flex-direction: column;
	padding: 0;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
	overflow: hidden;
}

.gxc-modal--work .gxc-modal__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
	padding: 14px 20px;
	border-bottom: 1px solid var(--gxc-border);
	background: linear-gradient(180deg, #f9fafb 0%, #ffffff 100%);
	flex-shrink: 0;
}
.gxc-modal__header-info { flex: 1; min-width: 0; }
.gxc-modal__header-info .gxc-modal__title {
	margin: 0 0 4px;
	font-size: 17px;
	font-weight: 700;
	color: var(--gxc-text);
}
.gxc-modal__header-info .gxc-modal__subtitle {
	margin: 0;
	font-size: 12.5px;
	color: var(--gxc-muted);
}

.gxc-modal__header-actions {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
}

.gxc-modal--work .gxc-modal__close {
	position: static;
	font-size: 28px;
	line-height: 1;
	background: transparent;
	border: none;
	cursor: pointer;
	color: var(--gxc-muted);
	padding: 4px 10px;
	border-radius: 6px;
}
.gxc-modal--work .gxc-modal__close:hover {
	background: #f1f5f9;
	color: var(--gxc-text);
}

.gxc-work-progreso {
	font-size: 12px;
	color: var(--gxc-muted);
	font-weight: 700;
	white-space: nowrap;
}

/* Toggle COMPRA / GASTO en el header del modal */
.gxc-tipo-toggle {
	display: inline-flex;
	border: 1px solid var(--gxc-border);
	border-radius: 6px;
	overflow: hidden;
	background: #fff;
}
.gxc-tipo-toggle__btn {
	background: #fff;
	border: none;
	padding: 6px 14px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.5px;
	cursor: pointer;
	color: var(--gxc-muted);
}
.gxc-tipo-toggle__btn:hover { background: #f1f5f9; }
.gxc-tipo-toggle__btn[data-tipo="compra"].gxc-tipo-toggle__btn--active {
	background: #16a34a;
	color: #fff;
}
.gxc-tipo-toggle__btn[data-tipo="gasto"].gxc-tipo-toggle__btn--active {
	background: #2563eb;
	color: #fff;
}

/* Cuerpo del modal con scroll interno */
.gxc-modal--work .gxc-modal__body {
	flex: 1;
	overflow: hidden;
	padding: 16px 20px;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.gxc-filters--compact {
	display: flex;
	gap: 12px;
	align-items: flex-end;
	margin-bottom: 12px;
	padding: 10px 12px;
	background: var(--gxc-bg-soft);
	border-radius: 6px;
	flex-shrink: 0;
}
.gxc-filters--compact .gxc-filter label {
	font-size: 10.5px;
	font-weight: 700;
	margin-bottom: 4px;
	color: var(--gxc-muted);
	display: block;
}
.gxc-filters--compact select,
.gxc-filters--compact input {
	padding: 6px 10px;
	border: 1px solid var(--gxc-border);
	border-radius: 4px;
	font-size: 12.5px;
	background: #fff;
	min-width: 160px;
}

/* Scroll vertical de items dentro del modal */
.gxc-items-scroll {
	flex: 1;
	overflow-y: auto;
	border: 1px solid var(--gxc-border);
	border-radius: 6px;
	background: #fff;
	min-height: 0;
}
.gxc-items-scroll .gxc-table { margin: 0; border: none; }
.gxc-items-scroll thead {
	position: sticky;
	top: 0;
	z-index: 2;
	background: #f9fafb;
}

/* Tabla de items dentro del modal: anchos ajustados a 90% pantalla */
.gxc-modal--work .gxc-items-table {
	min-width: 0;
	width: 100%;
	table-layout: fixed;
	font-size: 12.5px;
}
.gxc-modal--work .gxc-items-table th,
.gxc-modal--work .gxc-items-table td {
	padding: 8px 8px;
	vertical-align: top;
	word-break: break-word;
}
.gxc-modal--work .gxc-items-table th:nth-child(1),
.gxc-modal--work .gxc-items-table td:nth-child(1) { width: 9%; font-family: monospace; font-size: 11px; }
.gxc-modal--work .gxc-items-table th:nth-child(2),
.gxc-modal--work .gxc-items-table td:nth-child(2) { width: 19%; }
.gxc-modal--work .gxc-items-table th:nth-child(3),
.gxc-modal--work .gxc-items-table td:nth-child(3) { width: 21%; }
.gxc-modal--work .gxc-items-table th:nth-child(4),
.gxc-modal--work .gxc-items-table td:nth-child(4) { width: 8%; text-align: center; }
.gxc-modal--work .gxc-items-table th:nth-child(5),
.gxc-modal--work .gxc-items-table td:nth-child(5) { width: 8%; text-align: right; font-variant-numeric: tabular-nums; }
.gxc-modal--work .gxc-items-table th:nth-child(6),
.gxc-modal--work .gxc-items-table td:nth-child(6) { width: 8%; text-align: right; font-variant-numeric: tabular-nums; }
.gxc-modal--work .gxc-items-table th:nth-child(7),
.gxc-modal--work .gxc-items-table td:nth-child(7) { width: 11%; }
.gxc-modal--work .gxc-items-table th:nth-child(8),
.gxc-modal--work .gxc-items-table td:nth-child(8) { width: 16%; }

/* Responsive: en móvil/tablet, modal a pantalla completa con tarjetas */
@media (max-width: 900px) {
	.gxc-modal--work {
		width: 100vw;
		max-width: 100vw;
		height: 100vh;
		max-height: 100vh;
		border-radius: 0;
	}
	.gxc-modal--work .gxc-modal__header {
		flex-wrap: wrap;
	}
	.gxc-modal__header-actions {
		width: 100%;
		justify-content: space-between;
	}
	.gxc-work-progreso { display: none; }

	/* Tabla a tarjetas */
	.gxc-modal--work .gxc-items-table thead { display: none; }
	.gxc-modal--work .gxc-items-table,
	.gxc-modal--work .gxc-items-table tbody,
	.gxc-modal--work .gxc-items-table tr,
	.gxc-modal--work .gxc-items-table td {
		display: block;
		width: 100% !important;
	}
	.gxc-modal--work .gxc-items-table tr {
		margin-bottom: 10px;
		border: 1px solid var(--gxc-border);
		border-radius: 6px;
		padding: 10px;
	}
	.gxc-modal--work .gxc-items-table td {
		text-align: left !important;
		padding: 4px 0;
		border: none;
	}
	.gxc-modal--work .gxc-items-table td.gxc-col-cod::before { content: "CÓDIGO: "; font-weight: 700; font-size: 10px; color: var(--gxc-muted); }
	.gxc-modal--work .gxc-items-table td.gxc-col-prod-xml::before { content: "PRODUCTO XML: "; font-weight: 700; font-size: 10px; color: var(--gxc-muted); display: block; }
	.gxc-modal--work .gxc-items-table td.gxc-col-prod-wc::before { content: "WOOCOMMERCE: "; font-weight: 700; font-size: 10px; color: var(--gxc-muted); display: block; }
	.gxc-modal--work .gxc-items-table td.gxc-col-confianza::before { content: "CONFIANZA: "; font-weight: 700; font-size: 10px; color: var(--gxc-muted); }
	.gxc-modal--work .gxc-items-table td.gxc-col-costo::before { content: "COSTO: "; font-weight: 700; font-size: 10px; color: var(--gxc-muted); }
	.gxc-modal--work .gxc-items-table td.gxc-col-venta::before { content: "P. VENTA: "; font-weight: 700; font-size: 10px; color: var(--gxc-muted); }
	.gxc-modal--work .gxc-items-table td.gxc-col-estado::before { content: "ESTADO: "; font-weight: 700; font-size: 10px; color: var(--gxc-muted); }
}

/* ============================================================
 * v1.9.0 — REFINAMIENTO BANCARIO
 *
 * Paleta sobria, tablas densas pero respirables, color de acento
 * único, números alineados a la derecha, jerarquía visual clara
 * entre Producto XML (subordinado) y Coincidencia WC (principal).
 * ============================================================ */

.gxc-panel,
.gxc-modal--work {
	--gxc-primary: #1d4ed8;        /* azul de banca */
	--gxc-primary-dark: #1e40af;
	--gxc-text: #0f172a;            /* gris azulado oscuro */
	--gxc-text-soft: #334155;
	--gxc-muted: #64748b;
	--gxc-border: #e2e8f0;
	--gxc-border-strong: #cbd5e1;
	--gxc-bg-soft: #f8fafc;
	--gxc-bg-row-alt: #f9fafb;

	--gxc-success: #15803d;
	--gxc-success-soft: #dcfce7;
	--gxc-success-text: #166534;
	--gxc-warning: #b45309;
	--gxc-warning-soft: #fef3c7;
	--gxc-warning-text: #854d0e;
	--gxc-danger: #b91c1c;
	--gxc-danger-soft: #fee2e2;
	--gxc-danger-text: #991b1b;

	font-family: "Inter", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ----------------------------------------------------------------
 * BOTONES — todos con contraste alto y legibles
 * ---------------------------------------------------------------- */
.gxc-btn--primary {
	background: var(--gxc-primary);
	color: #fff;
	border: 1px solid var(--gxc-primary);
}
.gxc-btn--primary:hover {
	background: var(--gxc-primary-dark);
	border-color: var(--gxc-primary-dark);
}
.gxc-btn--secondary {
	background: #fff;
	color: var(--gxc-text);
	border: 1px solid var(--gxc-border-strong);
}
.gxc-btn--secondary:hover { background: var(--gxc-bg-soft); }

.gxc-btn--ghost {
	background: #fff;
	color: var(--gxc-text-soft);
	border: 1px solid var(--gxc-border-strong);
}
.gxc-btn--ghost:hover {
	background: var(--gxc-bg-soft);
	border-color: var(--gxc-text-soft);
	color: var(--gxc-text);
}

.gxc-btn--ai {
	background: #6d28d9;
	color: #fff;
	border: 1px solid #6d28d9;
}
.gxc-btn--ai:hover { background: #5b21b6; border-color: #5b21b6; }

.gxc-btn--extract {
	background: var(--gxc-success);
	color: #fff;
	border: 1px solid var(--gxc-success);
}
.gxc-btn--extract:hover { background: #166534; border-color: #166534; }

.gxc-btn:disabled,
.gxc-btn[disabled] {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Botones pequeños de la columna ACCIÓN: bordes definidos */
.gxc-col-accion .gxc-btn--small {
	padding: 5px 10px;
	font-size: 11.5px;
	font-weight: 600;
	border-radius: 5px;
	min-height: 28px;
	box-shadow: 0 1px 0 rgba(0,0,0,0.04);
}

/* ----------------------------------------------------------------
 * TABLA DE ITEMS — densa, banca, números tabulares
 * ---------------------------------------------------------------- */
.gxc-modal--work .gxc-items-table {
	font-size: 13px;
	color: var(--gxc-text);
}
.gxc-modal--work .gxc-items-table thead th {
	background: #f1f5f9;
	color: var(--gxc-muted);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.5px;
	padding: 10px 8px;
	text-align: left;
	border-bottom: 2px solid var(--gxc-border-strong);
	white-space: nowrap;
}
.gxc-modal--work .gxc-items-table tbody tr {
	border-bottom: 1px solid var(--gxc-border);
}
.gxc-modal--work .gxc-items-table tbody tr:nth-child(even) {
	background: var(--gxc-bg-row-alt);
}
.gxc-modal--work .gxc-items-table tbody tr:hover {
	background: #eff6ff;
}

/* Anchos en el modal 90% con 9 columnas */
.gxc-modal--work .gxc-items-table th:nth-child(1),
.gxc-modal--work .gxc-items-table td:nth-child(1) { width: 8%; }
.gxc-modal--work .gxc-items-table th:nth-child(2),
.gxc-modal--work .gxc-items-table td:nth-child(2) { width: 18%; }
.gxc-modal--work .gxc-items-table th:nth-child(3),
.gxc-modal--work .gxc-items-table td:nth-child(3) { width: 19%; }
.gxc-modal--work .gxc-items-table th:nth-child(4),
.gxc-modal--work .gxc-items-table td:nth-child(4) { width: 6%; text-align: center; }
.gxc-modal--work .gxc-items-table th:nth-child(5),
.gxc-modal--work .gxc-items-table td:nth-child(5) { width: 8%; text-align: right; font-variant-numeric: tabular-nums; }
.gxc-modal--work .gxc-items-table th:nth-child(6),
.gxc-modal--work .gxc-items-table td:nth-child(6) { width: 9%; }
.gxc-modal--work .gxc-items-table th:nth-child(7),
.gxc-modal--work .gxc-items-table td:nth-child(7) { width: 11%; text-align: right; font-variant-numeric: tabular-nums; }
.gxc-modal--work .gxc-items-table th:nth-child(8),
.gxc-modal--work .gxc-items-table td:nth-child(8) { width: 8%; }
.gxc-modal--work .gxc-items-table th:nth-child(9),
.gxc-modal--work .gxc-items-table td:nth-child(9) { width: 13%; }

/* ----------------------------------------------------------------
 * JERARQUÍA VISUAL: Producto XML subordinado, Coincidencia WC principal
 * ---------------------------------------------------------------- */
.gxc-col-prod-xml {
	color: var(--gxc-muted);
}
.gxc-xml-label {
	display: block;
	font-size: 9.5px;
	font-weight: 700;
	letter-spacing: 0.6px;
	color: #94a3b8;
	margin-bottom: 2px;
	text-transform: uppercase;
}
.gxc-xml-text {
	display: block;
	font-size: 12px;
	font-style: italic;
	color: var(--gxc-muted);
	line-height: 1.4;
	font-weight: 400;
}

.gxc-col-prod-wc { padding-left: 10px !important; }
.gxc-prod-wc__nombre {
	font-size: 13.5px;
	font-weight: 700;
	color: var(--gxc-text);
	line-height: 1.35;
	margin-bottom: 3px;
}
.gxc-prod-wc__sku {
	font-size: 11px;
	color: var(--gxc-muted);
	font-family: ui-monospace, Menlo, Consolas, monospace;
}

/* Código XML: monoespaciado discreto */
.gxc-col-cod code {
	font-family: ui-monospace, Menlo, Consolas, monospace;
	font-size: 11px;
	color: var(--gxc-muted);
	background: transparent;
	padding: 0;
}

/* ----------------------------------------------------------------
 * CONFIANZA y ESTADO — badges legibles
 * ---------------------------------------------------------------- */
.gxc-confianza {
	display: inline-block;
	padding: 3px 9px;
	border-radius: 11px;
	font-size: 11px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
.gxc-confianza--success {
	background: var(--gxc-success-soft);
	color: var(--gxc-success-text);
}
.gxc-confianza--warning {
	background: var(--gxc-warning-soft);
	color: var(--gxc-warning-text);
}
.gxc-confianza--danger {
	background: var(--gxc-danger-soft);
	color: var(--gxc-danger-text);
}

.gxc-badge--success,
.gxc-badge--warning,
.gxc-badge--danger,
.gxc-badge--neutral {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 4px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	white-space: nowrap;
}
.gxc-badge--success { background: var(--gxc-success-soft); color: var(--gxc-success-text); }
.gxc-badge--warning { background: var(--gxc-warning-soft); color: var(--gxc-warning-text); }
.gxc-badge--danger  { background: var(--gxc-danger-soft);  color: var(--gxc-danger-text); }
.gxc-badge--neutral { background: #e2e8f0;                  color: #334155; }

/* Filas tintadas por estado: muy sutil */
.gxc-item-row--coincidencia_alta { background: rgba(220, 252, 231, 0.20); }
.gxc-item-row--revisar           { background: rgba(254, 243, 199, 0.20); }
.gxc-item-row--no_encontrado     { background: rgba(254, 226, 226, 0.20); }
.gxc-item-row--confirmado        { background: rgba(220, 252, 231, 0.35); }

/* ----------------------------------------------------------------
 * CELDAS DE PRECIO Y UTILIDAD — inputs en línea sobrios
 * ---------------------------------------------------------------- */
.gxc-util-cell,
.gxc-precio-cell {
	display: inline-flex;
	align-items: center;
	gap: 3px;
}

.gxc-util-input,
.gxc-precio-input {
	width: 64px;
	padding: 5px 7px;
	font-size: 12.5px;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	border: 1px solid var(--gxc-border-strong);
	border-radius: 4px;
	background: #fff;
	color: var(--gxc-text);
	text-align: right;
	text-transform: none !important;
}
.gxc-precio-input { width: 90px; }
.gxc-util-input:focus,
.gxc-precio-input:focus {
	outline: none;
	border-color: var(--gxc-primary);
	box-shadow: 0 0 0 2px rgba(29, 78, 216, 0.12);
}
.gxc-util-pct {
	color: var(--gxc-muted);
	font-size: 12px;
	font-weight: 600;
}
.gxc-precio-prefix {
	color: var(--gxc-muted);
	font-size: 13px;
	font-weight: 700;
}
.gxc-util-real {
	display: block;
	width: 100%;
	margin-top: 3px;
	font-size: 10px;
	color: #94a3b8;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
}

/* Flash al guardar (verde) o error (rojo) */
@keyframes gxcFlashOk {
	0%   { background-color: rgba(34, 197, 94, 0.20); }
	100% { background-color: transparent; }
}
@keyframes gxcFlashErr {
	0%   { background-color: rgba(220, 38, 38, 0.20); }
	100% { background-color: transparent; }
}
.gxc-flash-ok { animation: gxcFlashOk 1.2s ease-out; }
.gxc-flash-err { animation: gxcFlashErr 1.2s ease-out; }

/* ----------------------------------------------------------------
 * RESPONSIVE: tarjetas en pantalla pequeña
 * ---------------------------------------------------------------- */
@media (max-width: 900px) {
	.gxc-modal--work .gxc-items-table td.gxc-col-utilidad::before {
		content: "% UTILIDAD: ";
		font-weight: 700;
		font-size: 10px;
		color: var(--gxc-muted);
	}
}

/* ----------------------------------------------------------------
 * NOTAS ESTÉTICAS DEL HEADER DEL PANEL
 * ---------------------------------------------------------------- */
.gxc-panel__title {
	font-weight: 700;
	font-size: 19px;
	letter-spacing: 0.3px;
	color: var(--gxc-text);
}
.gxc-table thead th {
	background: #f1f5f9 !important;
	color: var(--gxc-muted) !important;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.4px;
}

/* ============================================================
 * SHORTCODE [gxc_proveedores]
 * ============================================================ */
.gxc-prov {
	max-width: 1200px;
}
.gxc-panel__subtitle {
	margin: 4px 0 0;
	font-size: 13px;
	color: var(--gxc-muted);
	line-height: 1.5;
}
.gxc-prov-table th,
.gxc-prov-table td {
	padding: 10px 10px;
	vertical-align: middle;
}
.gxc-prov-name {
	font-weight: 600;
	color: var(--gxc-text);
}
.gxc-prov-products__cell {
	background: var(--gxc-bg-soft);
	padding: 14px 18px !important;
}
.gxc-prov-products__inner {
	background: #fff;
	border: 1px solid var(--gxc-border);
	border-radius: 6px;
	padding: 10px;
}
.gxc-prov-products__loading {
	margin: 0;
	color: var(--gxc-muted);
	font-style: italic;
	text-align: center;
}
.gxc-prov-products-table {
	width: 100%;
	font-size: 12px;
	border-collapse: collapse;
	margin: 0;
}
.gxc-prov-products-table thead th {
	background: #f1f5f9;
	color: var(--gxc-muted);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.4px;
	padding: 8px 6px;
	text-align: left;
	border-bottom: 1px solid var(--gxc-border-strong);
}
.gxc-prov-products-table tbody td {
	padding: 7px 6px;
	border-bottom: 1px solid var(--gxc-border);
	color: var(--gxc-text-soft);
	vertical-align: top;
}
.gxc-prov-products-table tbody tr:last-child td { border-bottom: none; }
.gxc-prov-products-table code {
	font-family: ui-monospace, Menlo, Consolas, monospace;
	font-size: 10.5px;
	color: var(--gxc-muted);
	background: transparent;
}

/* ============================================================
 * v1.10.0 — MODAL DE BÚSQUEDA REDISEÑADO + REFINAMIENTOS
 * ============================================================ */

/* Filas de items clicables */
.gxc-modal--work .gxc-items-table tbody tr {
	cursor: pointer;
}
.gxc-modal--work .gxc-items-table tbody tr:hover {
	background: #eff6ff;
	box-shadow: inset 3px 0 0 var(--gxc-primary);
}
/* No mostrar cursor pointer sobre inputs y botones */
.gxc-modal--work .gxc-items-table input,
.gxc-modal--work .gxc-items-table button,
.gxc-modal--work .gxc-items-table a,
.gxc-modal--work .gxc-items-table code {
	cursor: auto;
}
.gxc-modal--work .gxc-items-table button { cursor: pointer; }

/* ----------------------------------------------------------------
 * MODAL DE BÚSQUEDA — bancario, limpio, espacioso
 * ---------------------------------------------------------------- */
.gxc-modal--search {
	width: 600px;
	max-width: 92vw;
	max-height: 86vh;
	padding: 0;
	display: flex;
	flex-direction: column;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 20px 50px rgba(15, 23, 42, 0.35);
}

.gxc-modal--search .gxc-modal__close {
	position: absolute;
	top: 12px;
	right: 14px;
	z-index: 2;
	background: transparent;
	border: none;
	font-size: 24px;
	color: var(--gxc-muted);
	cursor: pointer;
	padding: 4px 10px;
	border-radius: 5px;
	line-height: 1;
}
.gxc-modal--search .gxc-modal__close:hover {
	background: #f1f5f9;
	color: var(--gxc-text);
}

.gxc-search-modal__header {
	padding: 18px 24px 14px;
	background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
	border-bottom: 1px solid var(--gxc-border);
}
.gxc-search-modal__header .gxc-modal__title {
	margin: 0;
	font-size: 14px;
	font-weight: 700;
	color: var(--gxc-text);
	letter-spacing: 0.4px;
}
.gxc-search-modal__context {
	margin: 8px 0 0;
	padding: 8px 12px;
	background: var(--gxc-bg-soft);
	border-left: 3px solid var(--gxc-primary);
	border-radius: 4px;
	font-size: 12.5px;
	font-style: italic;
	color: var(--gxc-text-soft);
	font-weight: 500;
}

.gxc-search-modal__body {
	padding: 16px 24px 14px;
	flex: 1;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
}

.gxc-search-modal__input-wrap {
	position: relative;
	margin-bottom: 12px;
}
.gxc-search-modal__icon {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--gxc-muted);
	pointer-events: none;
}
.gxc-search-modal__body .gxc-search-input {
	width: 100%;
	padding: 11px 12px 11px 40px;
	font-size: 14px;
	border: 2px solid var(--gxc-border);
	border-radius: 7px;
	background: #fff;
	color: var(--gxc-text);
	text-transform: none !important;
}
.gxc-search-modal__body .gxc-search-input:focus {
	outline: none;
	border-color: var(--gxc-primary);
	box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.10);
}

.gxc-search-modal__body .gxc-search-results {
	list-style: none;
	margin: 0;
	padding: 0;
	overflow-y: auto;
	flex: 1;
	min-height: 200px;
	max-height: 380px;
	border: 1px solid var(--gxc-border);
	border-radius: 7px;
	background: #fff;
}
.gxc-search-modal__body .gxc-search-result,
.gxc-search-modal__body .gxc-search-loading,
.gxc-search-modal__body .gxc-search-empty {
	padding: 10px 14px;
	border-bottom: 1px solid #f1f5f9;
	font-size: 12.5px;
}
.gxc-search-modal__body .gxc-search-result:last-child,
.gxc-search-modal__body .gxc-search-loading,
.gxc-search-modal__body .gxc-search-empty { border-bottom: none; }

.gxc-search-modal__body .gxc-search-result {
	cursor: pointer;
	position: relative;
	transition: background 0.1s;
}
.gxc-search-modal__body .gxc-search-result:hover {
	background: #eff6ff;
	box-shadow: inset 3px 0 0 var(--gxc-primary);
}

.gxc-search-result__name {
	font-weight: 700;
	color: var(--gxc-text);
	font-size: 13px;
	line-height: 1.35;
	padding-right: 80px;
}
.gxc-search-result__meta {
	margin-top: 3px;
	font-size: 10.5px;
	color: var(--gxc-muted);
	font-family: ui-monospace, Menlo, Consolas, monospace;
}
.gxc-search-result__meta code {
	background: transparent;
	padding: 0;
	color: var(--gxc-text-soft);
}
.gxc-search-result__price {
	position: absolute;
	top: 50%;
	right: 14px;
	transform: translateY(-50%);
	font-size: 13px;
	font-weight: 700;
	color: var(--gxc-primary);
	font-variant-numeric: tabular-nums;
}

.gxc-search-modal__body .gxc-search-loading,
.gxc-search-modal__body .gxc-search-empty {
	color: var(--gxc-muted);
	font-style: italic;
	text-align: center;
	padding: 18px;
}
.gxc-search-modal__body .gxc-search-empty strong {
	color: var(--gxc-success);
	font-style: normal;
}

.gxc-search-modal__footer {
	padding: 14px 24px 18px;
	border-top: 1px solid var(--gxc-border);
	background: var(--gxc-bg-soft);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
.gxc-search-modal__hint {
	font-size: 12px;
	color: var(--gxc-muted);
}
.gxc-search-modal__footer .gxc-btn {
	font-size: 12px;
	padding: 9px 16px;
}

@media (max-width: 600px) {
	.gxc-modal--search {
		width: 100vw;
		max-width: 100vw;
		max-height: 100vh;
		height: 100vh;
		border-radius: 0;
	}
	.gxc-search-modal__footer {
		flex-direction: column;
		align-items: stretch;
	}
	.gxc-search-result__price {
		position: static;
		display: block;
		transform: none;
		margin-top: 4px;
	}
	.gxc-search-result__name { padding-right: 0; }
}

/* ============================================================
 * v1.11.0 — REDISEÑO DEL MODAL "CREAR PRODUCTO" + FIX FOOTER SEARCH
 * ============================================================ */

/* ----------------------------------------------------------------
 * MODAL CREAR PRODUCTO — bancario, ancho cómodo, formulario claro
 * ---------------------------------------------------------------- */
.gxc-modal--data {
	width: 640px;
	max-width: 92vw;
	max-height: 90vh;
	padding: 0;
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 20px 50px rgba(15, 23, 42, 0.35);
	display: flex;
	flex-direction: column;
}

.gxc-modal--data > .gxc-modal__title {
	margin: 0;
	padding: 18px 24px 14px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.4px;
	color: var(--gxc-text, #0f172a);
	background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
	border-bottom: 1px solid var(--gxc-border, #e2e8f0);
}

.gxc-modal--data .gxc-modal__close {
	position: absolute;
	top: 12px;
	right: 14px;
	z-index: 2;
	background: transparent;
	border: none;
	font-size: 24px;
	color: var(--gxc-muted, #64748b);
	cursor: pointer;
	padding: 4px 10px;
	border-radius: 5px;
	line-height: 1;
}
.gxc-modal--data .gxc-modal__close:hover {
	background: #f1f5f9;
	color: var(--gxc-text, #0f172a);
}

.gxc-modal--data .gxc-modal__body {
	padding: 20px 24px 18px;
	overflow-y: auto;
	flex: 1;
}

/* Filas y grid del formulario */
.gxc-modal--data .gxc-form-row {
	margin-bottom: 16px;
}
.gxc-modal--data .gxc-form-row:last-child { margin-bottom: 0; }

.gxc-modal--data .gxc-form-row label {
	display: block;
	margin-bottom: 6px;
	font-size: 10.5px;
	font-weight: 700;
	color: var(--gxc-muted, #64748b);
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

.gxc-modal--data .gxc-form-input {
	width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	font-size: 13.5px;
	font-weight: 500;
	border: 1.5px solid var(--gxc-border, #e2e8f0);
	border-radius: 6px;
	background: #fff;
	color: var(--gxc-text, #0f172a);
	font-variant-numeric: tabular-nums;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.gxc-modal--data .gxc-form-input:focus {
	outline: none;
	border-color: var(--gxc-primary, #1d4ed8);
	box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.10);
}

/* Inputs numéricos: alineados a la derecha, monoespacio en negrita */
.gxc-modal--data input[type="number"].gxc-form-input,
.gxc-modal--data input[inputmode="numeric"].gxc-form-input {
	text-align: right;
	font-weight: 600;
}

/* Quitar las flechitas de los inputs number (estética bancaria) */
.gxc-modal--data input[type="number"].gxc-form-input::-webkit-outer-spin-button,
.gxc-modal--data input[type="number"].gxc-form-input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.gxc-modal--data input[type="number"].gxc-form-input { -moz-appearance: textfield; }

/* Inputs con prefijo $ o sufijo % */
.gxc-input-wrap {
	position: relative;
	display: block;
}
.gxc-input-wrap .gxc-form-input { padding-left: 26px; }
.gxc-input-wrap.gxc-input-wrap--pct .gxc-form-input { padding-left: 12px; padding-right: 28px; }
.gxc-input-wrap__prefix,
.gxc-input-wrap__suffix {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	font-size: 13px;
	font-weight: 700;
	color: var(--gxc-muted, #64748b);
	pointer-events: none;
}
.gxc-input-wrap__prefix { left: 12px; }
.gxc-input-wrap__suffix { right: 12px; }

/* Grid de tres columnas: compra, utilidad, venta */
.gxc-modal--data .gxc-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 12px;
	margin-bottom: 16px;
}
.gxc-modal--data .gxc-form-grid .gxc-form-row { margin-bottom: 0; }

/* El campo de precio venta sugerido se destaca (es el output del cálculo) */
.gxc-modal--data #gxc-create-venta {
	background: #f0fdf4;
	border-color: #bbf7d0;
	color: #166534;
}
.gxc-modal--data #gxc-create-venta:focus {
	border-color: var(--gxc-success, #15803d);
	box-shadow: 0 0 0 3px rgba(21, 128, 61, 0.10);
}

/* Acciones del formulario (footer) */
.gxc-modal--data .gxc-form-actions {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	margin-top: 22px;
	padding-top: 16px;
	border-top: 1px solid var(--gxc-border, #e2e8f0);
}
.gxc-modal--data .gxc-form-actions .gxc-btn {
	padding: 10px 20px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.4px;
	border-radius: 6px;
	min-height: 38px;
}
.gxc-modal--data .gxc-form-actions .gxc-btn--primary {
	background: var(--gxc-primary, #1d4ed8);
	color: #fff;
	border: 1px solid var(--gxc-primary, #1d4ed8);
	box-shadow: 0 1px 0 rgba(0,0,0,0.04);
}
.gxc-modal--data .gxc-form-actions .gxc-btn--primary:hover {
	background: var(--gxc-primary-dark, #1e40af);
	border-color: var(--gxc-primary-dark, #1e40af);
}
.gxc-modal--data .gxc-form-actions .gxc-btn--ghost {
	background: #fff;
	color: var(--gxc-text-soft, #334155);
	border: 1.5px solid var(--gxc-border-strong, #cbd5e1);
}
.gxc-modal--data .gxc-form-actions .gxc-btn--ghost:hover {
	background: var(--gxc-bg-soft, #f8fafc);
	color: var(--gxc-text, #0f172a);
}

/* ----------------------------------------------------------------
 * FIX: footer del SEARCH MODAL — botón crear ahora visible
 * (el verde sólido contrasta con el fondo gris claro del footer)
 * ---------------------------------------------------------------- */
.gxc-search-modal__footer .gxc-btn--extract {
	background: var(--gxc-success, #15803d) !important;
	color: #fff !important;
	border: 1px solid var(--gxc-success, #15803d) !important;
	padding: 10px 18px;
	font-weight: 700;
	letter-spacing: 0.4px;
	font-size: 12px;
	border-radius: 6px;
	box-shadow: 0 1px 0 rgba(0,0,0,0.04);
}
.gxc-search-modal__footer .gxc-btn--extract:hover {
	background: #166534 !important;
	border-color: #166534 !important;
}

/* Responsive */
@media (max-width: 600px) {
	.gxc-modal--data {
		width: 100vw;
		max-width: 100vw;
		max-height: 100vh;
		height: 100vh;
		border-radius: 0;
	}
	.gxc-modal--data .gxc-form-grid {
		grid-template-columns: 1fr;
	}
	.gxc-modal--data .gxc-form-actions {
		flex-direction: column-reverse;
	}
	.gxc-modal--data .gxc-form-actions .gxc-btn {
		width: 100%;
	}
}

/* ============================================================
 * v2.0.0 — Paquete unificado SURTIDORA CAQUETA PRO
 *
 * Componentes nuevos:
 *   - .scp-pin-gate / .scp-pin-card  → login por PIN
 *   - .scp-app / .scp-menu           → panel frontend tipo dashboard
 *   - .scp-card-tile                  → tarjetas con accesos por rol
 *   - .scp-notice                     → avisos (fuera de horario, etc.)
 * ============================================================ */

/* Variables compartidas */
.scp-app,
.scp-pin-gate {
	--scp-primary: #1d4ed8;
	--scp-primary-dark: #1e40af;
	--scp-text: #0f172a;
	--scp-text-soft: #334155;
	--scp-muted: #64748b;
	--scp-border: #e2e8f0;
	--scp-border-strong: #cbd5e1;
	--scp-bg-soft: #f8fafc;
	--scp-success: #15803d;
	--scp-success-soft: #dcfce7;
	--scp-warning: #b45309;
	--scp-warning-soft: #fef3c7;
	--scp-danger: #b91c1c;
	--scp-danger-soft: #fee2e2;

	font-family: "Inter", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--scp-text);
}

/* ----------------------------------------------------------------
 * PIN GATE — pantalla de login bonita
 * ---------------------------------------------------------------- */
.scp-pin-gate {
	min-height: 70vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 20px;
	background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
}
.scp-pin-card {
	width: 100%;
	max-width: 380px;
	background: #fff;
	border-radius: 16px;
	padding: 32px 30px 28px;
	box-shadow: 0 20px 50px rgba(15, 23, 42, 0.12);
	text-align: center;
}
.scp-pin-card__brand {
	margin-bottom: 22px;
}
.scp-pin-card__logo {
	width: 64px;
	height: 64px;
	margin: 0 auto 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--scp-primary) 0%, var(--scp-primary-dark) 100%);
	border-radius: 18px;
	font-size: 30px;
	color: #fff;
	box-shadow: 0 8px 20px rgba(29, 78, 216, 0.25);
}
.scp-pin-card__title {
	font-size: 17px;
	font-weight: 700;
	letter-spacing: 0.5px;
	color: var(--scp-text);
	margin: 0 0 4px;
}
.scp-pin-card__sub {
	font-size: 13px;
	color: var(--scp-muted);
	margin: 0;
}
.scp-pin-card__error {
	background: var(--scp-danger-soft);
	color: var(--scp-danger);
	padding: 10px 14px;
	border-radius: 6px;
	font-size: 12.5px;
	font-weight: 600;
	margin-bottom: 16px;
}
.scp-pin-input {
	width: 100%;
	box-sizing: border-box;
	padding: 14px 16px;
	font-size: 22px;
	text-align: center;
	letter-spacing: 8px;
	font-weight: 700;
	border: 2px solid var(--scp-border);
	border-radius: 10px;
	background: var(--scp-bg-soft);
	color: var(--scp-text);
	margin-bottom: 14px;
	font-family: ui-monospace, Menlo, Consolas, monospace;
}
.scp-pin-input:focus {
	outline: none;
	border-color: var(--scp-primary);
	background: #fff;
	box-shadow: 0 0 0 4px rgba(29, 78, 216, 0.10);
}
.scp-pin-submit {
	width: 100%;
	padding: 13px 18px;
	background: var(--scp-primary);
	color: #fff;
	border: none;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1px;
	cursor: pointer;
	transition: background 0.15s;
}
.scp-pin-submit:hover { background: var(--scp-primary-dark); }
.scp-pin-submit:active { transform: scale(0.98); }

/* ----------------------------------------------------------------
 * PANEL PRINCIPAL — [scp_menu]
 * ---------------------------------------------------------------- */
.scp-app {
	max-width: 1200px;
	margin: 24px auto;
	padding: 0 16px;
}
.scp-app__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	padding: 24px 28px;
	background: #fff;
	border: 1px solid var(--scp-border);
	border-radius: 12px;
	margin-bottom: 20px;
}
.scp-app__brand {
	display: flex;
	align-items: center;
	gap: 14px;
}
.scp-app__logo {
	width: 56px;
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--scp-primary) 0%, var(--scp-primary-dark) 100%);
	color: #fff;
	font-size: 26px;
	border-radius: 14px;
	box-shadow: 0 6px 16px rgba(29, 78, 216, 0.20);
}
.scp-app__title {
	font-size: 19px;
	font-weight: 700;
	margin: 0 0 4px;
	color: var(--scp-text);
	letter-spacing: 0.2px;
}
.scp-app__sub {
	font-size: 13px;
	color: var(--scp-muted);
	margin: 0;
	display: flex;
	align-items: center;
	gap: 8px;
}
.scp-app__sub strong { color: var(--scp-text); }
.scp-app__sub .scp-tag {
	padding: 3px 9px;
	border-radius: 11px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
}
.scp-tag--dueno    { background: #fef3c7; color: #92400e; }
.scp-tag--operario { background: #dbeafe; color: #1e40af; }
.scp-tag--admin    { background: #f3e8ff; color: #6b21a8; }

.scp-app__meta {
	text-align: right;
	font-size: 12.5px;
	color: var(--scp-muted);
}
.scp-app__date {
	font-size: 12.5px;
	color: var(--scp-muted);
	letter-spacing: 0.2px;
}
.scp-app__time {
	font-size: 26px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--scp-text);
	line-height: 1.1;
	margin-top: 2px;
}
.scp-app__session {
	margin: 4px 0 0;
	font-size: 11px;
	color: var(--scp-muted);
}
.scp-logout {
	display: inline-block;
	margin-top: 8px;
	font-size: 11.5px;
	color: var(--scp-danger);
	text-decoration: none;
	font-weight: 600;
	letter-spacing: 0.3px;
}
.scp-logout:hover { text-decoration: underline; }

/* ---------- Notice (avisos contextual) ---------- */
.scp-notice {
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 13px;
	margin-bottom: 18px;
	font-weight: 500;
}
.scp-notice--alert {
	background: var(--scp-warning-soft);
	color: #78350f;
	border-left: 4px solid var(--scp-warning);
}

/* ---------- Cards de accesos ---------- */
.scp-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
}
.scp-card-tile {
	display: block;
	background: #fff;
	border: 1.5px solid var(--scp-border);
	border-radius: 12px;
	padding: 22px 22px 18px;
	text-decoration: none !important;
	color: var(--scp-text);
	transition: transform 0.12s, border-color 0.15s, box-shadow 0.15s;
	position: relative;
	overflow: hidden;
}
.scp-card-tile::before {
	content: '';
	position: absolute;
	left: 0; top: 0; bottom: 0;
	width: 4px;
	background: currentColor;
	opacity: 0.85;
}
.scp-card-tile--blue   { color: #1d4ed8; }
.scp-card-tile--green  { color: #15803d; }
.scp-card-tile--amber  { color: #b45309; }
.scp-card-tile--purple { color: #7e22ce; }
.scp-card-tile--indigo { color: #4338ca; }
.scp-card-tile--teal   { color: #0d9488; }

.scp-card-tile:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.10);
	border-color: currentColor;
}
.scp-card-tile__icon {
	font-size: 30px;
	line-height: 1;
	margin-bottom: 10px;
}
.scp-card-tile__title {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.3px;
	color: var(--scp-text);
	margin: 0 0 6px;
}
.scp-card-tile__desc {
	font-size: 12.5px;
	color: var(--scp-muted);
	margin: 0;
	line-height: 1.45;
}

/* Tarjetas bloqueadas (operario viendo accesos solo de dueño) */
.scp-card-tile--locked {
	opacity: 0.45;
	cursor: not-allowed;
	background: var(--scp-bg-soft);
}
.scp-card-tile--locked:hover {
	transform: none;
	box-shadow: none;
	border-color: var(--scp-border);
}
.scp-card-tile__lock {
	position: absolute;
	top: 12px;
	right: 14px;
	font-size: 10px;
	font-weight: 700;
	color: var(--scp-muted);
	letter-spacing: 0.3px;
	text-transform: uppercase;
}

/* ---------- Responsive ---------- */
@media (max-width: 700px) {
	.scp-app__header {
		flex-direction: column;
		align-items: stretch;
		padding: 18px 20px;
	}
	.scp-app__meta {
		text-align: left;
	}
	.scp-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
	.scp-cards { grid-template-columns: 1fr; }
	.scp-pin-card { padding: 26px 22px 22px; }
	.scp-pin-input { font-size: 18px; letter-spacing: 4px; }
}

/* ============================================================
 * v2.0.4 — Navegación INTEGRADA al panel (estilo ERP contable)
 * ============================================================ */
.gxc-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    padding: 0;
    margin: 0 0 20px 0;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    overflow: hidden;
}
.gxc-nav__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    color: #475569;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2px;
    border-right: 1px solid #e2e8f0;
    background: #f8fafc;
    transition: background 0.15s ease, color 0.15s ease;
    white-space: nowrap;
}
.gxc-nav__item:last-child { border-right: none; }
.gxc-nav__item:hover {
    background: #ffffff;
    color: #1e293b;
    text-decoration: none;
}
.gxc-nav__item--active {
    background: #1d4ed8;
    color: #ffffff;
    border-right-color: #1d4ed8;
}
.gxc-nav__item--active:hover {
    background: #1e40af;
    color: #ffffff;
}
.gxc-nav__icon {
    display: inline-block;
    width: 14px;
    height: 14px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.85;
}
.gxc-nav__item--active .gxc-nav__icon { filter: brightness(0) invert(1); opacity: 1; }
/* Iconos SVG inline en data-uri (no requieren red) */
.gxc-nav__icon--home    { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2h-4v-7H9v7H5a2 2 0 0 1-2-2z'/></svg>"); }
.gxc-nav__icon--edit    { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'/><path d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4z'/></svg>"); }
.gxc-nav__icon--list    { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><line x1='8' y1='6' x2='21' y2='6'/><line x1='8' y1='12' x2='21' y2='12'/><line x1='8' y1='18' x2='21' y2='18'/><line x1='3' y1='6' x2='3.01' y2='6'/><line x1='3' y1='12' x2='3.01' y2='12'/><line x1='3' y1='18' x2='3.01' y2='18'/></svg>"); }
.gxc-nav__icon--chart   { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M23 6l-9.5 9.5-5-5L1 18'/><polyline points='17 6 23 6 23 12'/></svg>"); }
.gxc-nav__icon--tag     { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/><line x1='7' y1='7' x2='7.01' y2='7'/></svg>"); }
.gxc-nav__icon--invoice { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/><polyline points='14 2 14 8 20 8'/><line x1='9' y1='13' x2='15' y2='13'/><line x1='9' y1='17' x2='15' y2='17'/></svg>"); }
.gxc-nav__icon--truck   { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><rect x='1' y='3' width='15' height='13'/><polygon points='16 8 20 8 23 11 23 16 16 16 16 8'/><circle cx='5.5' cy='18.5' r='2.5'/><circle cx='18.5' cy='18.5' r='2.5'/></svg>"); }

/* Header del panel mejorado con subtítulo */
.gxc-panel__header { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 16px; }
.gxc-panel__header-left { display: flex; flex-direction: column; gap: 4px; }
.gxc-panel__subtitle { margin: 0; color: #64748b; font-size: 12px; font-weight: 500; letter-spacing: 0.3px; }

/* ============================================================
 * v2.0.4 — Modal de loading IA por encima del modal de productos
 * ============================================================ */
.gxc-ia-overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.72);
    backdrop-filter: blur(2px);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    border-radius: inherit;
}
.gxc-ia-overlay__spinner {
    width: 56px;
    height: 56px;
    border: 4px solid rgba(255, 255, 255, 0.2);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: gxc-ia-spin 0.9s linear infinite;
}
.gxc-ia-overlay__title {
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-align: center;
    margin: 0;
    max-width: 460px;
    padding: 0 20px;
}
.gxc-ia-overlay__sub {
    color: #cbd5e1;
    font-size: 13px;
    font-weight: 500;
    text-align: center;
    margin: 0;
    max-width: 420px;
    padding: 0 20px;
    line-height: 1.5;
}
.gxc-ia-overlay__dots::after {
    content: '';
    animation: gxc-ia-dots 1.4s steps(4, end) infinite;
}
@keyframes gxc-ia-spin { to { transform: rotate(360deg); } }
@keyframes gxc-ia-dots {
    0%   { content: ''; }
    25%  { content: '.'; }
    50%  { content: '..'; }
    75%  { content: '...'; }
}

/* Responsive: nav se hace scrollable horizontal en móvil */
@media (max-width: 768px) {
    .gxc-nav { overflow-x: auto; flex-wrap: nowrap; }
    .gxc-nav__item { padding: 9px 12px; font-size: 12px; }
    .gxc-nav__label { display: inline; }
    .gxc-panel__header { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
 * v2.0.5 — Badge de estado de homologación en tabla compras
 * ============================================================ */
.gxc-est {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 26px;
    padding: 0 8px;
    border-radius: 13px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.2px;
}
.gxc-est--done    { background: #d1fae5; color: #15803d; border: 1px solid rgba(21, 128, 61, 0.25); }
.gxc-est--pending { background: #fef3c7; color: #b45309; border: 1px solid rgba(180, 83, 9, 0.25); }
.gxc-est--none    { background: #f1f5f9; color: #94a3b8; border: 1px solid #e2e8f0; }
.gxc-col-est { text-align: center; }

/* Dropdown "VER REGISTRO" que despliega VER XML y VER PDF */
.gxc-registro-wrap { position: relative; display: inline-block; }
.gxc-registro-menu {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 10;
    min-width: 160px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.gxc-registro-menu[hidden] { display: none; }
.gxc-registro-menu a {
    display: block;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
    color: #1e293b;
    text-decoration: none;
    border-radius: 4px;
    text-align: left;
}
.gxc-registro-menu a:hover {
    background: #f1f5f9;
    color: #1d4ed8;
}
.gxc-registro-toggle[aria-expanded="true"] {
    background: #e0e7ff;
    color: #1d4ed8;
    border-color: #c7d2fe;
}

/* ============================================================
 * v2.0.5 — Sub-form editable en modal de homologación
 * v2.0.6 — Estilos autosuficientes (no dependen de clases externas)
 * ============================================================ */
.gxc-edit-product {
    padding: 22px 4px 8px;
    border-top: 1px solid #e2e8f0;
    margin-top: 14px;
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}
.gxc-edit-product[hidden] { display: none; }

.gxc-edit-product__header { margin-bottom: 18px; }
.gxc-edit-product__back {
    background: none;
    border: 0;
    color: #1d4ed8;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 0;
    margin-bottom: 10px;
}
.gxc-edit-product__back:hover { text-decoration: underline; }
.gxc-edit-product__title {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.4px;
    color: #1e293b;
}
.gxc-edit-product__hint {
    margin: 0;
    font-size: 12px;
    color: #64748b;
    line-height: 1.55;
}

/* Forzamos estilos de labels e inputs dentro del sub-form para que
   se vean bien aunque otros estilos del modal de búsqueda intenten
   reset / overflow. */
.gxc-edit-product .gxc-form-row {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 14px;
}
.gxc-edit-product .gxc-form-row label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.6px;
    color: #475569;
    text-transform: uppercase;
}
.gxc-edit-product input[type="text"],
.gxc-edit-product input[type="number"] {
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    font-family: inherit;
    color: #1e293b;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(15,23,42,0.04);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    box-sizing: border-box;
}
.gxc-edit-product input[type="text"]:focus,
.gxc-edit-product input[type="number"]:focus {
    outline: none;
    border-color: #1d4ed8;
    box-shadow: 0 0 0 3px rgba(29,78,216,0.12);
}
.gxc-edit-product input::placeholder { color: #94a3b8; }

.gxc-edit-product .gxc-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
@media (max-width: 600px) {
    .gxc-edit-product .gxc-form-grid { grid-template-columns: 1fr; }
}

.gxc-edit-product .gxc-input-wrap {
    position: relative;
    display: flex;
    align-items: stretch;
}
.gxc-edit-product .gxc-input-wrap__prefix {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    border-right: 0;
    border-radius: 6px 0 0 6px;
    font-weight: 700;
    color: #475569;
    font-size: 14px;
}
.gxc-edit-product .gxc-input-wrap input {
    border-radius: 0 6px 6px 0 !important;
    flex: 1;
}

.gxc-edit-product__actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 22px;
    padding-top: 16px;
    border-top: 1px solid #f1f5f9;
}
/* Botones grandes y claros incluso si .gxc-btn--ghost no estiliza dentro
   del modal de búsqueda. */
.gxc-edit-product__actions button {
    padding: 10px 22px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.4px;
    border-radius: 6px;
    cursor: pointer;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #475569;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.gxc-edit-product__actions button:hover {
    background: #f8fafc;
    border-color: #94a3b8;
    color: #1e293b;
}
.gxc-edit-product__actions button#gxc-edit-assign {
    background: #1d4ed8;
    border-color: #1d4ed8;
    color: #ffffff;
}
.gxc-edit-product__actions button#gxc-edit-assign:hover {
    background: #1e40af;
    border-color: #1e40af;
    color: #ffffff;
}
.gxc-edit-product__actions button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ============================================================
 * v2.0.16 — Refresh visual completo del panel
 *
 * Objetivo: ver más profesional sin reescribir todo. Hovers,
 * sombras suaves, tipografía consistente, espaciados modernos,
 * y mobile-first.
 * ============================================================ */

/* --- Panel general --- */
.gxc-panel {
	background: #ffffff;
	border-radius: 18px !important;
	box-shadow:
		0 1px 3px rgba(15, 23, 42, 0.04),
		0 12px 30px -8px rgba(15, 23, 42, 0.08) !important;
	border: 1px solid rgba(226, 232, 240, 0.7);
}

/* Header del panel: tipografía + spacing modernos */
.gxc-panel__title {
	font-weight: 800 !important;
	letter-spacing: -0.5px;
	background: linear-gradient(135deg, #0f172a 0%, #334155 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.gxc-panel__subtitle {
	color: #64748b;
	font-size: 13px;
	margin-top: 2px;
}

/* --- Botones --- */
.gxc-btn {
	border-radius: 10px !important;
	font-weight: 700;
	letter-spacing: 0.3px;
	transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
	border: 1px solid transparent;
}
.gxc-btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 14px -4px rgba(15, 23, 42, 0.2);
}
.gxc-btn:active { transform: translateY(0); }

.gxc-btn--primary {
	background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
	border: 0;
	color: #fff;
}
.gxc-btn--primary:hover {
	background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
}

.gxc-btn--ghost {
	background: #fff;
	border: 1px solid #e2e8f0;
	color: #475569;
}
.gxc-btn--ghost:hover {
	background: #f8fafc;
	border-color: #cbd5e1;
}

/* --- Tabla --- */
.gxc-table {
	border-collapse: separate !important;
	border-spacing: 0;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}
.gxc-table thead th {
	background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.8px !important;
	color: #475569 !important;
	text-transform: uppercase;
	padding: 14px 12px !important;
	border-bottom: 2px solid #e2e8f0;
}
.gxc-table tbody tr {
	transition: background-color .15s ease;
}
.gxc-table tbody tr:hover {
	background-color: #f8fafc !important;
}
.gxc-table tbody tr:nth-child(even) {
	background-color: #fdfdfd;
}
.gxc-table tbody td {
	padding: 13px 12px !important;
	border-bottom: 1px solid #f1f5f9 !important;
	font-size: 13px;
	vertical-align: middle;
}
.gxc-table tbody tr:last-child td { border-bottom: 0 !important; }

/* Botones pequeños dentro de tabla */
.gxc-btn--small {
	padding: 6px 12px !important;
	font-size: 11px !important;
	border-radius: 7px !important;
	letter-spacing: 0.4px;
}

/* --- Nav superior --- */
.gxc-nav {
	background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
	border-radius: 14px;
	padding: 6px;
	margin-bottom: 16px;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
	border: 1px solid rgba(226, 232, 240, 0.7);
	display: flex;
	gap: 2px;
	overflow-x: auto;
}
.gxc-nav__item {
	border-radius: 10px;
	padding: 9px 14px !important;
	transition: all .15s ease;
	color: #64748b !important;
	font-weight: 600;
	font-size: 13px;
	text-decoration: none !important;
	white-space: nowrap;
}
.gxc-nav__item:hover {
	background-color: #f1f5f9;
	color: #0f172a !important;
}
.gxc-nav__item--active {
	background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
	color: #fff !important;
	box-shadow: 0 4px 12px -2px rgba(37, 99, 235, 0.35);
}
.gxc-nav__item--active:hover { color: #fff !important; }

/* --- Notice info --- */
.gxc-notice {
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 13px;
	margin-bottom: 14px;
	border-left: 4px solid;
}
.gxc-notice--info {
	background: #eff6ff;
	color: #1e40af;
	border-left-color: #2563eb;
}

/* --- Mes picker --- */
.gxc-month-picker__input {
	border: 1px solid #e2e8f0;
	border-radius: 9px;
	padding: 8px 12px;
	font-weight: 600;
	transition: border-color .12s ease, box-shadow .12s ease;
}
.gxc-month-picker__input:focus {
	border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
	outline: 0;
}

/* --- Estados (chips) --- */
.gxc-est {
	display: inline-block;
	padding: 3px 9px;
	border-radius: 999px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.4px;
}
.gxc-est--none { background: #f1f5f9; color: #94a3b8; }

/* Botón "VER REGISTRO" más sutil */
.gxc-registro-toggle {
	font-size: 11px !important;
	color: #475569 !important;
	border: 1px solid #e2e8f0 !important;
	background: #fff !important;
}
.gxc-registro-toggle:hover {
	background: #f1f5f9 !important;
	color: #0f172a !important;
}

/* --- Modal de progreso (loading) y modales en general --- */
.gxc-modal-overlay {
	background: rgba(15, 23, 42, 0.55);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}
.gxc-modal {
	border-radius: 18px;
	box-shadow: 0 20px 60px rgba(15, 23, 42, 0.3);
}

/* --- Mobile-first refinements --- */
@media (max-width: 768px) {
	.gxc-panel {
		padding: 16px !important;
		border-radius: 14px !important;
	}
	.gxc-panel__header {
		flex-direction: column;
		align-items: stretch !important;
		gap: 12px;
	}
	.gxc-panel__actions {
		flex-direction: column;
		gap: 8px;
	}
	.gxc-panel__actions .gxc-btn {
		width: 100%;
	}
	.gxc-table thead { display: none; }
	.gxc-table, .gxc-table tbody, .gxc-table tr, .gxc-table td {
		display: block;
		width: 100% !important;
	}
	.gxc-table tr {
		background: #fff !important;
		border-radius: 12px;
		padding: 12px;
		margin-bottom: 10px;
		box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
		border: 1px solid #f1f5f9;
	}
	.gxc-table td {
		padding: 4px 0 !important;
		border-bottom: 0 !important;
		font-size: 12px;
	}
	.gxc-table td::before {
		content: attr(data-label);
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.5px;
		font-size: 10px;
		color: #94a3b8;
		display: block;
		margin-bottom: 2px;
	}
	.gxc-table td.gxc-col-asunto {
		font-weight: 600;
		color: #0f172a;
		margin-top: 4px;
	}
	.gxc-nav__label { font-size: 11px; }
}

/* --- Mensaje de error / warning más visible --- */
.gxc-message--error {
	background: linear-gradient(135deg, #fee2e2, #fecaca);
	color: #991b1b;
	padding: 12px 16px;
	border-radius: 10px;
	border-left: 4px solid #dc2626;
	font-weight: 600;
}
.gxc-message--warning {
	background: linear-gradient(135deg, #fef3c7, #fde68a);
	color: #78350f;
	padding: 12px 16px;
	border-radius: 10px;
	border-left: 4px solid #f59e0b;
	font-weight: 600;
}
.gxc-message--success {
	background: linear-gradient(135deg, #d1fae5, #a7f3d0);
	color: #065f46;
	padding: 12px 16px;
	border-radius: 10px;
	border-left: 4px solid #10b981;
	font-weight: 600;
}