.smiley-box > div:last-child {
	height: 200px;
	border: solid 1px #e5e7eb; 
	overflow: auto;
  padding: 0.05rem;
}
.dark .smiley-box > div:last-child {
  border-color: #1e293b;
}

#mchat-smilies{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(36px, 1fr));
  gap: 8px;
  padding: 10px;
  max-height: 140px;
  overflow: auto;
  margin-bottom: 10px;
  border-radius: 12px;
  background: #FFFFFF;
  border: 1px solid #F3F4F6;
}

#mchat-smilies > a[data-mchat-action="smiley"]{
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 10px;
  text-decoration: none;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  background: #F3F4F6;
  border: 1px solid rgba(15, 23, 42, .08);
}

#mchat-smilies > a[data-mchat-action="smiley"]:hover{
  transform: translateY(-1px);
  background: #F9FAFB;
  border-color: rgba(15, 23, 42, .14);
}

#mchat-smilies > a[data-mchat-action="smiley"]:active{
  transform: translateY(0);
}

#mchat-smilies > a[data-mchat-action="smiley"] img{
  max-width: 22px;
  max-height: 22px;
  width: auto;
  height: auto;
  display: block;
}

#mchat-smilies > a[data-mchat-action="smileyPopup"]{
  grid-column: 1 / -1;
  margin-top: 6px;
  padding: 10px 12px;
  text-align: center;

  border-radius: 10px;
  text-decoration: none;
  transition: background .12s ease, border-color .12s ease;
  background: #F3F4F6;
  border: 1px solid rgba(15, 23, 42, .10);
  color: #0F172A;
}

#mchat-smilies::-webkit-scrollbar{
  width: 10px;
}
#mchat-smilies::-webkit-scrollbar-thumb{
  border-radius: 999px;
  background: rgba(0,0,0,.18);
}
.dark #mchat-smilies::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.14);
}


#mchat-smilies > a[data-mchat-action="smileyPopup"]:hover{
  background: #F9FAFB;
  border-color: rgba(15, 23, 42, .16);
}

.dark #mchat-smilies{
  background: #1E293B;
  border: 1px solid rgba(255,255,255,.10);
}

.dark #mchat-smilies > a[data-mchat-action="smiley"]{
  background: #1B2335;
  border: 1px solid rgba(255,255,255,.08);
}

.dark #mchat-smilies > a[data-mchat-action="smiley"]:hover{
  background: #0F172A;
  border-color: rgba(255,255,255,.14);
}

.dark #mchat-smilies > a[data-mchat-action="smileyPopup"]{
  background: #1B2335;
  border: 1px solid rgba(255,255,255,.10);
  color: #F9FAFB;
}

.dark #mchat-smilies > a[data-mchat-action="smileyPopup"]:hover{
  background: #0F172A;
  border-color: rgba(255,255,255,.16);
}
