@charset "utf-8";

.layout-portlets-box-custom {
	width: 40%;
	padding: 1% 24%;
	margin: 8px auto;
	float: left;
	background-color: #F6FAFC /*#F1F6F9*/;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-box-shadow: 0px 1px 0px 0px rgba(159, 172, 183, 0.7);
	box-shadow: 0px 1px 0px 0px rgba(159, 172, 183, 0.7);
}

@media screen and (max-width: 768px) {
	.layout-portlets-box-custom {
		width: 100% !important;
		padding: 1% 5% !important;
		margin: 0 auto !important;
		/* le float doit rester ! */
		float: left !important;
		/* Essentiels */
		display: block !important;
		box-sizing: border-box !important;
		overflow: hidden; /* <-- empêche tout débordement visible */
		background-color: #F6FAFC !important;
		-webkit-box-shadow: 0px 1px 0px 0px rgba(159, 172, 183, 0.7);
		box-shadow: 0px 1px 0px 0px rgba(159, 172, 183, 0.7);
	}
}

/* Desktop : on laisse à 100% */
.full-mobile {
	width: 100% !important;
}

.full-mobile.ui-button, .full-mobile .ui-button, .ui-button.full-mobile
	{
	width: 97% !important;
	display: block !important;
	box-sizing: border-box !important;
}
/* Fix pour le span interne */
.full-mobile .ui-button-text {
	width: 97% !important;
	text-align: center !important;
	display: block !important;
	font-size: 1.2rem !important;
}

/* Mobile : on force à s’étendre */
@media screen and (max-width: 768px) {
	.full-mobile {
		width: 92% !important;
		min-width: 250px; /* Ajuste la valeur selon ton besoin */
		display: block !important;
	}
	.full-mobile.ui-button, .full-mobile .ui-button, .ui-button.full-mobile
		{
		width: 88% !important;
		display: block !important;
		box-sizing: border-box !important;
	}
	/* Fix pour le span interne */
	.full-mobile .ui-button-text {
		width: 88% !important;
		text-align: center !important;
		display: block !important;
		font-size: 1.2rem !important;
	}
	/* Réduction du texte principal */
	.ui-messages, .ui-messages li, .ui-messages .ui-messages-error,
		.ui-messages .ui-messages-warn, .ui-messages .ui-messages-info,
		.ui-messages .ui-messages-fatal {
		font-size: 0.70rem !important; /* Ajuste selon ton besoin */
		line-height: 1.1rem !important;
	}
	/* Réduit aussi le texte dans la bulle */
	.ui-messages .ui-messages-error-summary, .ui-messages .ui-messages-error-detail,
		.ui-messages .ui-messages-info-summary, .ui-messages .ui-messages-info-detail
		{
		font-size: 0.70rem !important;
	}
	/* Un léger padding plus compact */
	.ui-messages .ui-messages-error, .ui-messages .ui-messages-warn,
		.ui-messages .ui-messages-info, .ui-messages .ui-messages-fatal {
		padding: 6px 8px !important;
	}
}