#image_selector {
  position: fixed;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: 30;
  border-radius: 0px;
  overflow: hidden;
}

#image_selector_content {
width: 100%;
  height: 80%; /* Full height of the parent */
  font-size: 2em;
  outline: none; /* Remove focus outline */
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  overflow-y: auto; /* Enable scrolling */
  box-sizing: border-box; /* Includes padding in dimensions */
  padding: 10px; /* Optional for spacing */
}

#image_select_toobar {

}

#image_selector_content img {
    width: 15%;
    margin: 10px;
    cursor: pointer;
}

#image_selector_content svg {
    width: 15%;
    margin: 10px;
    cursor: pointer;
}

#image_tags {
    width:100%;
    padding: 5px;
    margin-left: auto;
    margin-right: auto;
}

 .tag {
            display: inline-block;
            padding: 5px 10px;
            margin: 5px;
            border-radius: 3px;
            cursor: pointer;
        }
        
        
/* icon grid */

     .icon-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
            gap: 5px;
            text-align: center;
            padding: 5px;
        }
        .icon-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            font-size: 100px;
            padding: 0px;
        }
        
        .icon-item img {
             min-width: 200px;
    height: auto; /* Ensures aspect ratio is maintained */
        }
        
        .icon-item i {
            font-size: 100px;
            margin-bottom: 5px;
        }
        .icon-name {
            font-size: 12px;
            word-break: break-word;
        }