/* CODEXPOL Core: estilos de las herramientas y del listado. Todo va dentro de .cx-* para no chocar con el tema. */
.cx-box {
	--cx-navy: #0a2350;
	--cx-navy2: #12356f;
	--cx-gold: #f2b705;
	--cx-ink: #0b1220;
	--cx-muted: #4a5b74;
	--cx-line: #c8d2e2;
	--cx-bg: #ffffff;
	--cx-bg2: #eef2f8;
	--cx-ok: #17703f;
	--cx-warn: #8a5200;
	--cx-bad: #c0201a;
	margin: 1.5rem 0;
	border: 1px solid var(--cx-line);
	border-radius: 12px;
	background: var(--cx-bg);
	color: var(--cx-ink);
	overflow: hidden;
	font-size: 1rem;
}
.cx-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 10px 16px;
	background: var(--cx-navy);
	color: #fff;
	font-weight: 800;
	font-size: 1.05rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-bottom: 4px solid var(--cx-gold);
}
.cx-body { padding: 16px; }
.cx-label { display: block; font-weight: 600; margin-bottom: 6px; }
.cx-box input[type="datetime-local"],
.cx-box input[type="search"],
.cx-box select {
	width: 100%;
	box-sizing: border-box;
	padding: 9px 12px;
	border: 1px solid var(--cx-line);
	border-radius: 8px;
	background: #fff;
	color: var(--cx-ink);
	font: inherit;
}
.cx-note { color: var(--cx-muted); font-size: 0.85rem; margin: 12px 0 0; }
.cx-count { color: var(--cx-muted); font-size: 0.9rem; margin: 0 0 8px; }

.cx-btn {
	display: inline-block;
	padding: 9px 18px;
	border-radius: 10px;
	border: 1px solid var(--cx-gold);
	background: var(--cx-gold);
	color: #0b1220 !important;
	font: inherit;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none !important;
	cursor: pointer;
}
.cx-btn:hover { filter: brightness(1.06); }
.cx-btn-line { background: transparent; border-color: var(--cx-navy); color: var(--cx-navy) !important; }
.cx-actions { display: flex; gap: 10px; flex-wrap: wrap; margin: 14px 0 0; }

.cx-tag {
	display: inline-block;
	font-size: 0.68rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 3px 9px;
	border-radius: 999px;
	border: 1px solid currentColor;
	white-space: nowrap;
}
.cx-free { color: var(--cx-ok); background: #fff; }
.cx-lock { color: var(--cx-warn); background: #fbebb0; }

/* Calculadora */
.cx-result {
	margin-top: 14px;
	padding: 12px 14px;
	border: 1px solid var(--cx-line);
	border-left: 4px solid var(--cx-navy2);
	border-radius: 8px;
	background: var(--cx-bg2);
	display: grid;
	gap: 8px;
}
.cx-result.cx-ok { border-left-color: var(--cx-ok); }
.cx-result.cx-warn { border-left-color: var(--cx-gold); }
.cx-result.cx-late { border-left-color: var(--cx-bad); background: #fbe3e0; }
.cx-kv { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.cx-kv span { font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--cx-muted); }
.cx-big { font-size: 1.8rem; line-height: 1; }
.cx-bar { height: 6px; background: var(--cx-line); border-radius: 3px; overflow: hidden; }
.cx-bar i { display: block; height: 100%; background: var(--cx-gold); }
.cx-ok .cx-bar i { background: var(--cx-ok); }
.cx-late .cx-bar i { background: var(--cx-bad); }

/* Checklist */
.cx-check { list-style: none; margin: 0; padding: 0; }
.cx-check li { padding: 9px 0; border-bottom: 1px dashed var(--cx-line); }
.cx-check li:last-child { border-bottom: 0; }
.cx-check label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.cx-check input { margin-top: 5px; accent-color: var(--cx-navy); }
.cx-check input:checked + span { color: var(--cx-muted); text-decoration: line-through; }

/* Listado */
.cx-filters { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr auto; gap: 8px; margin-bottom: 14px; }
.cx-list { list-style: none; margin: 0; padding: 0; }
.cx-list li {
	display: grid;
	grid-template-columns: 130px minmax(0, 1fr) auto;
	gap: 14px;
	align-items: center;
	padding: 12px 0;
	border-bottom: 1px solid var(--cx-line);
}
.cx-list li:last-child { border-bottom: 0; }
.cx-ref { font-family: ui-monospace, Menlo, monospace; font-size: 0.8rem; color: var(--cx-muted); overflow-wrap: anywhere; }
.cx-main a { font-weight: 700; text-decoration: none; color: var(--cx-navy); }
.cx-main a:hover { text-decoration: underline; }
.cx-main span, .cx-main em { display: block; font-size: 0.88rem; color: var(--cx-muted); font-style: normal; }
.cx-pager { display: flex; gap: 12px; align-items: center; justify-content: center; margin-top: 16px; flex-wrap: wrap; }
.cx-empty { color: var(--cx-muted); text-align: center; padding: 24px 0; }

/* Documento individual */
.cx-meta { list-style: none; margin: 0 0 1.2rem; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 24px; border: 1px solid #c8d2e2; border-left: 4px solid #f2b705; border-radius: 8px; padding: 12px 16px; background: #eef2f8; }
.cx-meta li { display: grid; gap: 2px; }
.cx-meta span { font-size: 0.7rem; letter-spacing: 0.07em; text-transform: uppercase; color: #4a5b74; }
.cx-paywall { margin: 1.5rem 0; padding: 20px; border: 1px solid #c8d2e2; border-top: 4px solid #f2b705; border-radius: 10px; background: #eef2f8; }
.cx-eyebrow { font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: #8a5200; margin: 0 0 6px; font-weight: 700; }

@media (max-width: 760px) {
	.cx-filters { grid-template-columns: 1fr; }
	.cx-list li { grid-template-columns: minmax(0, 1fr) auto; }
	.cx-ref { grid-column: 1 / -1; }
}
