/*---------------------------------------*/
/*---------------------------------------*/
/* INIT -          SQUARE MENU           */
/*---------------------------------------*/
/*---------------------------------------*/

#iledysile-square-menu {
	position: fixed;
	top: 0;
	left: -100%; /* El menú está oculto fuera de la pantalla */
	width: 50%;
	height: 100%;
	z-index: 9999;
	transition: left 0.75s ease; /* Animación suave al abrir y cerrar */
}

.iledysile-square-menu-top {
	width: 100%;
	height: 75%;
	display: flex;
}

.iledysile-square-menu-top-left {
	width: 67%;
	height: 100%;
	background-color: rgb(255, 255, 255);
	display: flex;
	align-items: flex-end;
    justify-content: flex-end;
	border-bottom: solid 2px black;
}

.iledysile-square-menu-top-right {
	width: 19%;
	height: 100%;
	align-items: flex-end;
    justify-content: flex-end;
	border-bottom: solid 2px black;
}

/* El logo inicialmente oculto */
.iledysile-square-menu-logo {
    position: absolute; /* Fija el logo en la pantalla */
    top: 6px; /* Ajusta la distancia desde la parte superior de la pantalla */
    left: 75px; /* Ajusta la distancia desde el borde izquierdo de la pantalla */
    transform: rotate(90deg); /* Rota el logo 90 grados */
    transform-origin: left top; /* Hace que la rotación ocurra desde la esquina superior izquierda */
    white-space: nowrap; /* Evita que el texto se divida en varias líneas */
	z-index: 1;
}

.iledysile-logo {
    font-size: 4rem; /* Tamaño de fuente con rem para flexibilidad */
    color: black; 
	text-transform: uppercase;
	word-spacing: 0.4em;
}

.iledysile-square-menu-bottom {
	width: 100%;
	height: 25%;
}

.iledysile-square-menu-bottom-left {
    width: 12.5%;
    height: 12.5%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    border-bottom: 2px solid black;
    z-index: 1;
    position: absolute;
}

.iledysile-square-menu-bottom-right {
	width: 67%;
    height: 100%;
    background: #ffffff;
    position: absolute;
    top: 75%;
}

/* Estilos para el overlay (fondo semitransparente) */
#iledysile-square-menu-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.35);
	z-index: 9998;
}

#iledysile-square-menu.active {
	left: 0;
}

#iledysile-square-menu-overlay.active {
	display: block;
}

.iledysile-square-menu-items ul{
	margin: 0 0 0.8em 0.8em;
}


.iledysile-menu li {
	position: relative;
	text-transform: uppercase;
	list-style: none;
	width: 10em;
}

.iledysile-menu li a {
	display: block;
	width: 100%;
	height: 100%;
	padding-right: 14%
}

.iledysile-menu>li {
	text-align: right;
}

.iledysile-menu a:hover {
	color: #6B04FA;
}


.iledysile-menu li.menu-item-has-children>a {
	pointer-events: none;
	/* Desactiva los clics */
	cursor: default;
	/* Cambia el cursor para que no parezca un enlace */
	color: inherit !important;
	/* Mantiene el color original */
	text-decoration: none !important;
	/* Elimina subrayados */
}

.iledysile-menu li a:focus {
	outline: none;
}

.iledysile-square-menu {
	list-style-type: none;
	/* Elimina los puntos */
	padding: 0;
	/* Elimina el espacio interior predeterminado */
	margin: 0;
	/* Elimina el espacio exterior predeterminado */
}

#iledysile-square-menu li.current-menu-item a {
	text-decoration-thickness: from-font;
	text-decoration-color: #b7816b;
	color: #a7a7a7;
}

.iledysile-square-menu-button {
	border: none;
	width: 9rem;
	height: 9rem;
	background-color: #6B04FA;
	cursor: pointer;
	transition: 0.5s ease;
	transform: scale(0.3);
	position: fixed;
	right: 0;
	z-index: 10000;
	outline: none;
}


@media (min-width: 768px) and (hover: hover) {
    .iledysile-square-menu-button:hover {
        background-color: #f1defc;
    }
}

@media (max-width: 768px), (hover: none) {
    .iledysile-square-menu-button:hover {
        background-color: #6B04FA;
    }
}

@media (min-width: 768px) {
	.iledysile-square-menu {
		font-size: 26pt;
	}
}

@media (max-width: 768px) {
	#iledysile-square-menu {
		left: -150%;
		width: 150%;
		font-size: 20pt;
	}
}

/*---------------------------------------*/
/*---------------------------------------*/
/* END - SLIDING SQUARE MENU */
/*---------------------------------------*/
/*---------------------------------------*/