/* Modal Block - Estilos optimizados para SEO y accesibilidad */

/* Elementos accesibles pero visualmente ocultos */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

/* Modal - Estructura mejorada */
.ttm-modal,
.wp-block-design-toolkit-modal.ttm-modal {
	position: fixed;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	z-index: 9999;
}

.ttm-modal[hidden],
.wp-block-design-toolkit-modal.ttm-modal[hidden] {
	display: none !important;
}

/* Overlay con CSS (sin duplicar contenido) */
.ttm-modal::before,
.wp-block-design-toolkit-modal.ttm-modal::before {
	content: '';
	position: absolute;
	inset: 0;
	/*background: rgba(255, 255, 255, 0.8);*/
	backdrop-filter: blur(8px);
	z-index: -1;
}

/* Panel del modal */
.ttm-modal__panel {
	position: relative;
	z-index: 1;
	width: min(900px, 100%);
	max-height: 100vh;
	overflow: auto;
	background:  white!important;
	border-radius: 16px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

/*.modal-content {}Para usar cuando quiera*/

/* Botón cerrar */
.ttm-modal__close,
.modal-close {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 32px;
	height: 32px;
	border: none;
	background: white;
	cursor: pointer;
	font-size: 24px;
	line-height: 1;
	z-index: 2;
	border-radius: 10px;
}

/* Control de scroll del body */
body.has-modal-open {
	overflow: hidden;
}

/* Compatibilidad con estructura antigua */
.wp-block-design-toolkit-modal:not(.ttm-modal)[hidden] {
	display: none !important;
}

/* Ocultar modal original en la página (solo se muestra cuando se activa) */
/* Excluir el editor de WordPress */
body:not(.block-editor-page) .wp-block-design-toolkit-modal:not([data-initialized]):not(.ttm-modal) {
	display: none;
}