/* ==========================================================================
   Directorio de Anexos — frontend
   Base de tamaño fija (16px) para no depender del tamaño raíz del tema;
   todas las medidas internas en em. Colores con variables en .dan-wrap.
   ========================================================================== */
.dan-wrap {
	--dan-text: #2b2b2b;
	--dan-head-bg: #f6eeee;
	--dan-border: #333;
	--dan-accent: #7a2336;
	--dan-accent-dark: #551926;
	--dan-accent-soft: #f9f1f2;
	--dan-accent-line: #d7b5bc;
	--dan-muted: #756d6f;
	--dan-line: #ebe4e2;
	--dan-cols: 1;
	margin: 0 0 2em;
	color: var(--dan-text);
	font-family: inherit;
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}
.dan-wrap *, .dan-wrap *::before, .dan-wrap *::after { box-sizing: border-box; }
.dan-wrap [hidden] { display: none !important; }
.dan-wrap p { margin: 0; }
.dan-wrap ul { margin: 0; padding: 0; list-style: none; }
.dan-wrap li { margin: 0; }
.dan-wrap button { font-family: inherit; }
.dan-svg { display: block; width: 100%; height: 100%; }
.dan-ico { display: inline-flex; flex: 0 0 auto; width: 1em; height: 1em; color: var(--dan-muted); }
.dan-ico--accent { color: var(--dan-accent); }
.dan-chev, .dan-meta, .dan-avatar, .dan-chip__ico { display: none; }
.dan-label { font-weight: 700; }
.dan-titulo { margin: 0 0 .8em; color: var(--dan-text); font-size: 1.5em; font-weight: 800; line-height: 1.2; }
.dan-empty { padding: 2em 1em; text-align: center; color: var(--dan-muted); }
mark.dan-hl { padding: 0 .08em; border-radius: 3px; background: #ffe7a3; color: inherit; }

/* ---------- Buscador ---------- */
.dan-buscador {
	position: relative; z-index: 2;
	display: flex; align-items: center; gap: .35em;
	margin: 0 0 .75em; padding: .35em .35em .35em 1em;
	border: 1px solid var(--dan-line); border-radius: 14px;
	background: #fff;
	box-shadow: 0 10px 30px -14px rgba(50, 15, 25, .35), 0 1px 2px rgba(0, 0, 0, .04);
	transition: border-color .2s, box-shadow .2s;
}
.dan-buscador:focus-within { border-color: var(--dan-accent-line); box-shadow: 0 0 0 4px var(--dan-accent-soft), 0 10px 30px -14px rgba(50, 15, 25, .35); }
.dan-search-ico { flex: 0 0 auto; width: 1.15em; height: 1.15em; color: var(--dan-muted); }
.dan-wrap input.dan-search {
	flex: 1 1 auto; min-width: 0; height: 2.75em; margin: 0; padding: 0 .4em;
	border: 0; border-radius: 0; background: transparent; box-shadow: none; outline: none;
	color: #1f1f1f; font: inherit; font-size: 1em;
	-webkit-appearance: none; appearance: none;
}
.dan-wrap input.dan-search::-webkit-search-cancel-button { display: none; }
.dan-wrap input.dan-search::placeholder { color: #9a9294; opacity: 1; }
.dan-wrap button.dan-clear {
	display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
	width: 2em; height: 2em; margin: 0; padding: .5em;
	border: 0; border-radius: 50%; background: #f2eeed; color: var(--dan-muted);
	cursor: pointer; box-shadow: none;
}
.dan-wrap button.dan-clear:hover { background: #e7e1df; color: var(--dan-text); }
.dan-wrap button.dan-search-btn {
	display: inline-flex; align-items: center; gap: .5em; flex: 0 0 auto;
	height: 2.75em; margin: 0; padding: 0 1.35em;
	border: 0; border-radius: 10px;
	background: var(--dan-accent); color: #fff;
	font-size: 1em; font-weight: 600; line-height: 1; letter-spacing: .01em; text-transform: none;
	cursor: pointer; box-shadow: none;
	transition: background .2s;
}
.dan-wrap button.dan-search-btn:hover { background: var(--dan-accent-dark); color: #fff; }
.dan-wrap button.dan-search-btn:focus-visible { outline: 2px solid var(--dan-accent-dark); outline-offset: 2px; }
.dan-search-btn .dan-svg { width: 1em; height: 1em; }

/* ---------- Barra de estado ---------- */
.dan-toolbar {
	display: flex; align-items: center; justify-content: space-between; gap: 1em;
	margin: 0 0 .6em; padding: 0 .25em;
}
.dan-count { color: var(--dan-muted); font-size: .875em; }
.dan-wrap button.dan-toggle-all {
	margin: 0; padding: .35em .2em;
	border: 0; background: none; box-shadow: none;
	color: var(--dan-accent); font-size: .875em; font-weight: 600; line-height: 1.2;
	text-decoration: underline; text-decoration-color: var(--dan-accent-line); text-underline-offset: 3px;
	cursor: pointer;
}
.dan-wrap button.dan-toggle-all:hover { color: var(--dan-accent-dark); text-decoration-color: currentColor; }

/* ==========================================================================
   ESTILO INSTITUCIONAL
   ========================================================================== */

/* Cabecera */
.dan-hero {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; align-items: center; gap: 1.1em;
	padding: 1.6em 1.75em 3.1em;
	border-radius: 16px;
	background: linear-gradient(120deg, var(--dan-accent-dark) 0%, var(--dan-accent) 60%);
	color: #fff;
}
.dan-hero::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background:
		radial-gradient(90% 120% at 0% 0%, rgba(255, 255, 255, .16), transparent 55%),
		repeating-linear-gradient(135deg, rgba(255, 255, 255, .035) 0 2px, transparent 2px 9px);
}
.dan-hero__art {
	position: absolute; top: 0; right: 0; bottom: 0; z-index: -1; width: 40%;
	display: flex; align-items: flex-end; justify-content: flex-end;
	padding: 1em 1.5em 0 0;
	color: #fff; opacity: .22;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 35%);
	mask-image: linear-gradient(90deg, transparent, #000 35%);
}
.dan-hero__art svg { width: 100%; max-width: 280px; height: auto; }
.dan-hero__brand {
	flex: 0 0 auto; padding-right: 1em;
	border-right: 2px solid rgba(255, 255, 255, .45);
	font-size: 1.6em; font-weight: 800; line-height: 1; letter-spacing: -.01em;
}
.dan-hero__logo { flex: 0 0 auto; width: auto; max-height: 3.6em; padding-right: 1em; border-right: 2px solid rgba(255, 255, 255, .45); }
.dan-hero__text { position: relative; max-width: 68%; }
.dan-wrap .dan-hero__eyebrow {
	margin: 0 0 .35em; color: rgba(255, 255, 255, .78);
	font-size: .78em; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
}
.dan-wrap .dan-hero__title {
	margin: 0; padding: 0; border: 0;
	color: #fff; font-family: inherit; font-size: 1.85em; font-weight: 800; line-height: 1.12; letter-spacing: -.01em;
	text-transform: none;
}
.dan-wrap .dan-hero__sub { margin-top: .4em; color: rgba(255, 255, 255, .85); font-size: .95em; }

/* Buscador flotando sobre la cabecera */
.dan-estilo-institucional .dan-hero + .dan-buscador { margin: -1.85em 1.25em 1em; }
.dan-estilo-institucional .dan-toolbar { margin-top: .25em; }

/* Lista */
.dan-estilo-institucional .dan-list {
	display: grid; gap: .55em;
	grid-template-columns: repeat(var(--dan-cols), minmax(0, 1fr));
	align-items: start;
}
.dan-estilo-institucional .dan-item {
	position: relative; overflow: hidden;
	border: 1px solid var(--dan-line); border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(40, 10, 20, .04);
	transition: border-color .2s, box-shadow .2s;
}
.dan-estilo-institucional .dan-item::before {
	content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 3px;
	background: var(--dan-accent); transform: scaleY(0); transform-origin: top;
	transition: transform .25s ease;
}
.dan-estilo-institucional .dan-item:hover { border-color: var(--dan-accent-line); }
.dan-estilo-institucional .dan-item[open] {
	border-color: var(--dan-accent-line);
	box-shadow: 0 12px 28px -16px rgba(60, 15, 30, .4);
}
.dan-estilo-institucional .dan-item[open]::before { transform: scaleY(1); }

.dan-estilo-institucional .dan-item__head {
	display: flex; align-items: center; gap: .85em;
	margin: 0; padding: .8em 1em;
	color: var(--dan-text);
	font-size: 1em; font-weight: 650; line-height: 1.35;
	cursor: pointer; list-style: none; user-select: none;
	-webkit-tap-highlight-color: transparent;
}
.dan-estilo-institucional .dan-item__head::-webkit-details-marker { display: none; }
.dan-estilo-institucional .dan-item__head::marker { content: ""; }
.dan-estilo-institucional .dan-item__head:focus-visible { outline: 2px solid var(--dan-accent); outline-offset: -2px; border-radius: 12px; }
.dan-estilo-institucional .dan-ico--head {
	width: 2.4em; height: 2.4em; padding: .55em;
	border-radius: 10px; background: var(--dan-accent-soft); color: var(--dan-accent);
	transition: background .2s, color .2s;
}
.dan-estilo-institucional .dan-item[open] .dan-ico--head { background: var(--dan-accent); color: #fff; }
.dan-estilo-institucional .dan-item__title { flex: 1 1 auto; min-width: 0; }
.dan-estilo-institucional .dan-meta {
	display: inline-flex; flex: 0 0 auto; align-items: center;
	padding: .2em .65em; border-radius: 999px;
	background: #f3efee; color: var(--dan-muted);
	font-size: .78em; font-weight: 600; white-space: nowrap;
}
.dan-estilo-institucional .dan-chev {
	display: inline-flex; flex: 0 0 auto;
	width: 2em; height: 2em; padding: .45em;
	border-radius: 50%; background: #f5f1f0; color: var(--dan-text);
	transition: transform .25s ease, background .2s, color .2s;
}
.dan-estilo-institucional .dan-item:hover .dan-chev { background: var(--dan-accent-soft); color: var(--dan-accent); }
.dan-estilo-institucional .dan-item[open] .dan-chev { transform: rotate(180deg); background: var(--dan-accent-soft); color: var(--dan-accent); }

/* Contenido desplegado, alineado con el título */
.dan-estilo-institucional .dan-item__body {
	display: grid; gap: .85em;
	margin: 0 1em; padding: .9em 0 1.05em 3.25em;
	border-top: 1px solid var(--dan-line);
	animation: dan-in .22s ease;
}
@keyframes dan-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.dan-estilo-institucional .dan-row { display: flex; align-items: center; flex-wrap: wrap; gap: .4em .65em; }
.dan-estilo-institucional .dan-row > .dan-ico { display: none; }
.dan-estilo-institucional .dan-field { display: flex; flex-direction: column; min-width: 0; }
.dan-estilo-institucional .dan-label {
	color: var(--dan-muted); font-size: .72em; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
}
.dan-estilo-institucional .dan-colon { display: none; }
.dan-estilo-institucional .dan-value { color: var(--dan-text); font-size: 1em; font-weight: 600; line-height: 1.35; }
.dan-estilo-institucional .dan-avatar {
	display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
	width: 2.5em; height: 2.5em; border-radius: 50%;
	background: linear-gradient(135deg, var(--dan-accent), var(--dan-accent-dark)); color: #fff;
	font-size: .9em; font-weight: 700; letter-spacing: .02em;
}
.dan-estilo-institucional .dan-anexos-row { flex-direction: column; align-items: flex-start; gap: .45em; }
.dan-estilo-institucional .dan-anexos { display: flex; flex-wrap: wrap; gap: .45em; }

/* Chips de anexo */
.dan-wrap .dan-chip {
	display: inline-flex; align-items: center; justify-content: center; gap: .45em;
	padding: .45em .85em;
	border: 1px solid var(--dan-accent-line); border-radius: 9px;
	background: var(--dan-accent-soft); color: var(--dan-accent);
	font-size: .95em; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.2; letter-spacing: .02em;
	text-decoration: none;
	transition: background .2s, color .2s, border-color .2s, transform .15s;
}
.dan-estilo-institucional .dan-chip__ico { display: inline-flex; width: .9em; height: .9em; opacity: .8; }
.dan-wrap a.dan-chip:hover, .dan-wrap a.dan-chip:focus-visible {
	background: var(--dan-accent); border-color: var(--dan-accent); color: #fff; text-decoration: none;
}
.dan-wrap a.dan-chip:active { transform: scale(.97); }

@media (max-width: 782px) {
	.dan-estilo-institucional .dan-list { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	.dan-wrap { font-size: 15px; }
	.dan-hero { flex-direction: column; align-items: flex-start; padding: 1.2em 1.2em 2.9em; border-radius: 14px; gap: .55em; }
	.dan-hero__brand { padding: 0 0 .5em; border-right: 0; border-bottom: 2px solid rgba(255, 255, 255, .35); font-size: 1.05em; }
	.dan-hero__brand br { display: none; }
	.dan-hero__logo { max-height: 2.6em; padding: 0; border-right: 0; }
	.dan-hero__text { max-width: none; }
	.dan-wrap .dan-hero__title { font-size: 1.35em; }
	.dan-hero__art { width: 55%; opacity: .14; }
	.dan-estilo-institucional .dan-hero + .dan-buscador { margin: -1.75em .6em .9em; }
	.dan-wrap button.dan-search-btn { width: 2.75em; padding: 0; justify-content: center; }
	.dan-wrap button.dan-search-btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.dan-estilo-institucional .dan-item__head { gap: .7em; padding: .75em .8em; }
	.dan-estilo-institucional .dan-ico--head { width: 2.2em; height: 2.2em; }
	.dan-estilo-institucional .dan-meta { display: none; }
	.dan-estilo-institucional .dan-item__body { margin: 0 .8em; padding-left: 0; }
}

/* ==========================================================================
   ESTILO TABLA (similar al PDF)
   ========================================================================== */
.dan-estilo-tabla .dan-ico, .dan-estilo-tabla .dan-search-btn { display: none; }
.dan-estilo-tabla .dan-search-ico { display: block; }
.dan-estilo-tabla .dan-titulo { text-align: center; }
.dan-estilo-tabla .dan-buscador { box-shadow: none; }
.dan-estilo-tabla .dan-list { border: 1px solid var(--dan-border); }
.dan-estilo-tabla .dan-item + .dan-item { border-top: 1px solid var(--dan-border); }
.dan-estilo-tabla .dan-item__head {
	margin: 0; padding: .45em .8em; border-bottom: 1px solid var(--dan-border);
	background: #f2f2f2; color: var(--dan-text);
	font-size: 1em; font-weight: 700; text-transform: uppercase;
}
.dan-estilo-tabla .dan-row { padding: .35em .8em; border-bottom: 1px solid rgba(0, 0, 0, .12); }
.dan-estilo-tabla .dan-resp .dan-label { font-size: .85em; text-transform: uppercase; }
.dan-estilo-tabla .dan-anexos-row { padding: 0; border-bottom: 0; }
.dan-estilo-tabla .dan-anexos-row > .dan-label { display: block; padding: .35em .8em; border-bottom: 1px solid rgba(0, 0, 0, .12); }
.dan-estilo-tabla .dan-anexos li { padding: .3em .8em; border-bottom: 1px solid rgba(0, 0, 0, .12); }
.dan-estilo-tabla .dan-anexos li:last-child { border-bottom: 0; }
.dan-estilo-tabla .dan-chip { all: unset; color: inherit; }
.dan-estilo-tabla a.dan-chip { color: var(--dan-accent); cursor: pointer; }

/* ==========================================================================
   ESTILO TARJETAS
   ========================================================================== */
.dan-estilo-tarjetas .dan-list {
	display: grid; gap: 1em;
	grid-template-columns: repeat(var(--dan-cols), minmax(0, 1fr));
}
.dan-estilo-tarjetas .dan-item {
	overflow: hidden; border: 1px solid var(--dan-line); border-top: 3px solid var(--dan-accent);
	border-radius: 12px; background: #fff; box-shadow: 0 6px 18px -12px rgba(0, 0, 0, .25);
}
.dan-estilo-tarjetas .dan-item__head {
	display: flex; align-items: center; gap: .6em; margin: 0; padding: .8em 1em;
	background: var(--dan-head-bg); font-size: 1em; font-weight: 700;
}
.dan-estilo-tarjetas .dan-ico--head { width: 1.3em; height: 1.3em; color: var(--dan-accent); }
.dan-estilo-tarjetas .dan-item__body { display: grid; gap: .6em; padding: .9em 1em 1em; }
.dan-estilo-tarjetas .dan-row { display: flex; align-items: center; flex-wrap: wrap; gap: .35em .55em; }
.dan-estilo-tarjetas .dan-anexos { display: flex; flex-wrap: wrap; gap: .4em; }
@media (max-width: 700px) { .dan-estilo-tarjetas .dan-list { grid-template-columns: 1fr; } }

/* ==========================================================================
   ESTILO ACORDEÓN (simple)
   ========================================================================== */
.dan-estilo-acordeon .dan-item { overflow: hidden; margin-bottom: .5em; border: 1px solid var(--dan-line); border-radius: 10px; background: #fff; }
.dan-estilo-acordeon .dan-item__head {
	display: flex; align-items: center; gap: .6em; margin: 0; padding: .75em 1em;
	background: var(--dan-head-bg); font-size: 1em; font-weight: 700;
	cursor: pointer; list-style: none;
}
.dan-estilo-acordeon .dan-item__head::-webkit-details-marker { display: none; }
.dan-estilo-acordeon .dan-ico--head { width: 1.2em; height: 1.2em; color: var(--dan-accent); }
.dan-estilo-acordeon .dan-item__title { flex: 1 1 auto; }
.dan-estilo-acordeon .dan-chev { display: inline-flex; width: 1em; height: 1em; transition: transform .2s; }
.dan-estilo-acordeon .dan-item[open] .dan-chev { transform: rotate(180deg); }
.dan-estilo-acordeon .dan-item__body { display: grid; gap: .5em; padding: .8em 1em; }
.dan-estilo-acordeon .dan-row { display: flex; align-items: center; flex-wrap: wrap; gap: .35em .55em; }
.dan-estilo-acordeon .dan-anexos { display: flex; flex-wrap: wrap; gap: .4em; }

@media print {
	.dan-buscador, .dan-toolbar, .dan-chev { display: none !important; }
	.dan-item { break-inside: avoid; box-shadow: none !important; }
}
