/* Mobile Footer Menu V1 */
:root{
	--mfm-bg:#0b1f4d;
	--mfm-bg-2:#102a66;
	--mfm-accent:#f8bf17;
	--mfm-text:#ffffff;
	--mfm-muted:rgba(255,255,255,.78);
	--mfm-shadow:0 -12px 30px rgba(16,42,102,.16);
}

.mfm-footer{
	display:none;
	position:fixed;
	left:0;
	right:0;
	bottom:0;
	z-index:99999;
	background:linear-gradient(180deg,var(--mfm-bg-2),var(--mfm-bg));
	box-shadow:var(--mfm-shadow);
	border-top:1px solid rgba(255,255,255,.08);
	padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
	align-items:center;
	justify-content:space-between;
	gap:8px;
}

.mfm-item{
	position:relative;
	flex:1 1 20%;
	min-width:0;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:4px;
	padding:10px 4px;
	color:var(--mfm-text);
	text-decoration:none;
	border:0;
	background:transparent;
	border-radius:14px;
	font:inherit;
	cursor:pointer;
}

.mfm-item:hover,
.mfm-item:focus{
	background:rgba(255,255,255,.08);
	outline:none;
}

.mfm-icon{
	display:grid;
	place-items:center;
	width:28px;
	height:28px;
	border-radius:999px;
	background:rgba(255,255,255,.08);
	font-size:16px;
	line-height:1;
}

.mfm-label{
	font-size:11px;
	line-height:1.1;
	font-weight:700;
	color:var(--mfm-text);
}

.mfm-badge{
	position:absolute;
	top:6px;
	right:18px;
	min-width:16px;
	height:16px;
	padding:0 4px;
	border-radius:999px;
	background:var(--mfm-accent);
	color:#0b1f4d;
	font-size:10px;
	font-weight:900;
	line-height:16px;
	text-align:center;
}

/* Drawers */
.mfm-drawer{
	position:fixed;
	inset:0;
	z-index:100000;
	display:none;
}

.mfm-drawer.is-open{
	display:block;
}

.mfm-drawer__backdrop{
	position:absolute;
	inset:0;
	background:rgba(7,16,34,.55);
	backdrop-filter:blur(4px);
}

.mfm-drawer__panel{
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	max-height:82vh;
	background:#fff;
	border-radius:22px 22px 0 0;
	box-shadow:0 -16px 50px rgba(0,0,0,.16);
	overflow:hidden;
	display:flex;
	flex-direction:column;
}

.mfm-drawer__header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:16px 18px;
	background:linear-gradient(135deg,var(--mfm-bg-2),var(--mfm-bg));
	color:#fff;
}

.mfm-close{
	border:0;
	background:rgba(255,255,255,.1);
	color:#fff;
	width:36px;
	height:36px;
	border-radius:999px;
	cursor:pointer;
}

.mfm-categories{
	padding:12px 14px 18px;
	overflow:auto;
}

.mfm-cat-list,
.mfm-cat-list ul{
	list-style:none;
	margin:0;
	padding:0;
}

.mfm-cat-item{
	border:1px solid #e7edf7;
	border-radius:14px;
	margin-bottom:10px;
	overflow:hidden;
	background:#fff;
}

.mfm-cat-link{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:14px 14px;
	color:#13213c;
	text-decoration:none;
	font-weight:800;
}

.mfm-cat-link:hover{
	background:#f8fbff;
}

.mfm-cat-toggle{
	border:0;
	background:#eef3ff;
	color:#102a66;
	width:34px;
	height:34px;
	border-radius:999px;
	font-size:18px;
	line-height:1;
	cursor:pointer;
	flex:0 0 auto;
}

.mfm-cat-children{
	display:none;
	padding:0 0 10px 12px;
	border-top:1px solid #edf2fa;
	background:#fbfdff;
}

.mfm-cat-item.is-open > .mfm-cat-children{
	display:block;
}

.mfm-cat-children .mfm-cat-item{
	margin:10px 10px 0 0;
}

.mfm-search-form{
	display:flex;
	gap:10px;
	padding:16px 16px 20px;
}

.mfm-search-input{
	flex:1;
	min-width:0;
	border:1px solid #dfe6f1;
	border-radius:14px;
	padding:14px 14px;
	font-size:16px;
}

.mfm-search-submit{
	border:0;
	background:var(--mfm-accent);
	color:#0b1f4d;
	font-weight:900;
	padding:14px 18px;
	border-radius:14px;
	cursor:pointer;
}

/* Show only on mobile */
@media (max-width: 768px){
	body{
		padding-bottom: calc(72px + env(safe-area-inset-bottom));
	}
	.mfm-footer{
		display:flex;
	}
}

@media (min-width: 769px){
	body{
		padding-bottom:0 !important;
	}
}
