/*!
 * TH Dropzone CF7 v1.0.0 · Nubedocs
 * -> colores heredados del child theme (--th-red, --th-red-dark) con valores de respaldo
 */

.th-dz {
	--dz-rojo: var(--th-red, #C91C1C);
	--dz-rojo-osc: var(--th-red-dark, #A31616);
	--dz-gris: #F5F5F3;
	--dz-borde: rgba(0, 0, 0, 0.12);
	--dz-texto: #222;
	--dz-suave: #888;
	--dz-ok: #2E7D32;
	--dz-radio: 3px;
	position: relative;
	display: block;
	width: 100%;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	line-height: 1.5;
	color: var(--dz-texto);
}
.th-dz *,
.th-dz *::before,
.th-dz *::after { box-sizing: border-box; }

/* Input nativo oculto (sigue siendo accesible vía label) */
.th-dz .th-dz-input {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: 0 !important;
	padding: 0 !important;
	opacity: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	pointer-events: none;
}

/* ---------- Zona ---------- */
.th-dz .th-dz-zona {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-height: 150px;
	margin: 0;
	padding: 22px 16px;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--dz-texto);
	background: var(--dz-gris);
	border: 2px dashed rgba(0, 0, 0, 0.16);
	border-radius: var(--dz-radio);
	cursor: pointer;
	outline: none;
	transition: border-color .15s, background-color .15s, box-shadow .15s, min-height .2s;
	-webkit-tap-highlight-color: transparent;
}
.th-dz .th-dz-zona:hover {
	border-color: var(--dz-rojo);
	background: #fff;
}
.th-dz .th-dz-zona:focus-visible {
	border-color: var(--dz-rojo);
	box-shadow: 0 0 0 2px rgba(201, 28, 28, 0.15);
}

.th-dz-icono {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-bottom: 6px;
	color: var(--dz-rojo);
	border: 2px solid var(--dz-rojo);
	transition: transform .2s, background-color .15s, color .15s;
}
.th-dz-icono svg { width: 22px; height: 22px; display: block; }

.th-dz-titulo {
	font-family: 'Oswald', sans-serif;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--dz-texto);
}
.th-dz-sub { font-size: 13px; color: #555; }
.th-dz-enlace {
	color: var(--dz-rojo);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
.th-dz-limites {
	margin-top: 6px;
	font-size: 11px;
	letter-spacing: 0.02em;
	color: var(--dz-suave);
}

/* Arrastrando encima */
.th-dz--sobre .th-dz-zona {
	border-style: solid;
	border-color: var(--dz-rojo);
	background: rgba(201, 28, 28, 0.04);
}
.th-dz--sobre .th-dz-icono {
	transform: translateY(-3px);
	background: var(--dz-rojo);
	color: #fff;
}

/* Con archivos: zona compacta en horizontal */
.th-dz--con-archivos .th-dz-zona {
	flex-direction: row;
	flex-wrap: wrap;
	min-height: 0;
	padding: 12px 16px;
	gap: 4px 10px;
}
.th-dz--con-archivos .th-dz-icono { width: 34px; height: 34px; margin: 0; }
.th-dz--con-archivos .th-dz-icono svg { width: 18px; height: 18px; }
.th-dz--con-archivos .th-dz-titulo { font-size: 13px; }
.th-dz--con-archivos .th-dz-limites { flex-basis: 100%; margin-top: 0; }

/* Límite alcanzado */
.th-dz--lleno .th-dz-zona { cursor: not-allowed; opacity: .55; }
.th-dz--lleno .th-dz-zona:hover { border-color: rgba(0, 0, 0, 0.16); background: var(--dz-gris); }

/* Error de validación CF7 */
.th-dz.wpcf7-not-valid .th-dz-zona { border-color: var(--dz-rojo); background: #FDF3F3; }

/* ---------- Lista ---------- */
.th-dz .th-dz-lista {
	display: grid;
	gap: 6px;
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}
.th-dz .th-dz-lista:empty { display: none; }

.th-dz .th-dz-item {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 8px 8px 8px 10px;
	list-style: none;
	background: #fff;
	border: 1px solid var(--dz-borde);
	border-left: 3px solid #d6d6d2;
	border-radius: var(--dz-radio);
	animation: th-dz-entra .2s ease-out;
}
.th-dz .th-dz-item::before { display: none; }

.th-dz-item--subiendo,
.th-dz-item--preparando { border-left-color: var(--dz-rojo) !important; }
.th-dz-item--listo { border-left-color: var(--dz-ok) !important; }
.th-dz-item--error { border-left-color: var(--dz-rojo) !important; background: #FDF3F3 !important; }

.th-dz-mini {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	overflow: hidden;
	background: var(--dz-gris);
}
.th-dz-mini img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; max-width: none; }
.th-dz-ext {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-family: 'Oswald', sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #fff;
	background: #222;
}
.th-dz-ext--pdf { background: var(--dz-rojo); }
.th-dz-ext--doc, .th-dz-ext--docx, .th-dz-ext--odt { background: #2B579A; }
.th-dz-ext--xls, .th-dz-ext--xlsx, .th-dz-ext--ods { background: #217346; }
.th-dz-ext--zip, .th-dz-ext--rar { background: #6b6b6b; }

.th-dz-info { display: flex; flex-direction: column; min-width: 0; }
.th-dz-nombre {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-weight: 600;
	color: var(--dz-texto);
}
.th-dz-meta { font-size: 11px; color: var(--dz-suave); }
.th-dz-item--error .th-dz-meta { color: var(--dz-rojo); font-weight: 600; }

.th-dz-barra {
	position: relative;
	display: block;
	height: 3px;
	margin-top: 6px;
	overflow: hidden;
	background: rgba(0, 0, 0, 0.06);
}
.th-dz-barra i {
	position: absolute;
	inset: 0 auto 0 0;
	width: 0;
	background: var(--dz-rojo);
	transition: width .2s linear;
}
.th-dz-item--cola .th-dz-barra i,
.th-dz-item--preparando .th-dz-barra i {
	width: 30% !important;
	opacity: .5;
	animation: th-dz-espera 1.1s ease-in-out infinite;
}
.th-dz-item--listo .th-dz-barra,
.th-dz-item--error .th-dz-barra { display: none; }

/* Acciones */
.th-dz-acciones { display: flex; align-items: center; gap: 2px; }
.th-dz .th-dz-acciones button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px !important;
	min-width: 0 !important;
	height: 32px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	font-size: 0 !important;
	line-height: 1 !important;
	color: var(--dz-suave) !important;
	background: transparent !important;
	border: 1px solid transparent !important;
	border-radius: var(--dz-radio) !important;
	box-shadow: none !important;
	text-transform: none !important;
	cursor: pointer;
	transition: color .15s, background-color .15s, border-color .15s;
	-webkit-appearance: none;
	appearance: none;
}
.th-dz .th-dz-acciones button:hover,
.th-dz .th-dz-acciones button:focus-visible {
	color: var(--dz-rojo) !important;
	background: var(--dz-gris) !important;
	border-color: var(--dz-borde) !important;
	outline: none;
}
.th-dz-acciones svg { width: 16px; height: 16px; display: block; }

.th-dz-ok { display: none; color: var(--dz-ok); width: 22px; }
.th-dz-ok svg { width: 18px; height: 18px; }
.th-dz-item--listo .th-dz-ok { display: inline-flex; }
.th-dz .th-dz-reintentar { display: none !important; }
.th-dz .th-dz-item--error .th-dz-reintentar { display: inline-flex !important; }

/* ---------- Resumen ---------- */
.th-dz-resumen {
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-top: 8px;
	font-family: 'Open Sans', sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--dz-suave);
}
.th-dz-resumen[hidden] { display: none; }
.th-dz-resumen-barra {
	position: relative;
	display: block;
	height: 2px;
	background: rgba(0, 0, 0, 0.08);
}
.th-dz-resumen-barra i {
	position: absolute;
	inset: 0 auto 0 0;
	width: 0;
	background: var(--dz-texto);
	transition: width .25s;
}

/* ---------- Avisos ---------- */
.th-dz-aviso {
	margin-top: 8px;
	padding: 8px 12px;
	font-size: 12px;
	line-height: 1.5;
	color: #8a1212;
	background: #FDF3F3;
	border-left: 3px solid var(--dz-rojo);
	border-radius: var(--dz-radio);
}
.th-dz-aviso[hidden] { display: none; }
.th-dz-aviso--info {
	color: var(--dz-texto);
	background: var(--dz-gris);
	border-left-color: var(--dz-texto);
}

/* ---------- Animaciones ---------- */
@keyframes th-dz-entra {
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: none; }
}
@keyframes th-dz-espera {
	0% { left: -30%; }
	100% { left: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.th-dz *, .th-dz *::before, .th-dz *::after { animation: none !important; transition: none !important; }
}

/* ---------- Móvil ---------- */
@media (max-width: 600px) {
	.th-dz .th-dz-zona { min-height: 120px; padding: 18px 12px; }
	.th-dz--tactil .th-dz-sub { display: none; }
	.th-dz .th-dz-item { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 10px; }
	.th-dz-mini { width: 40px; height: 40px; }
}
