#galleries_display {
    margin: 30px 0 30px;
    border: 2px solid #0b420d;
    border-radius: 10px;
    padding: 10px;
    background: #fff;
}

#gallery_list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 12px;
}

#gallery_list .gallery {
    box-sizing: border-box;                         
    flex: 0 0 calc((100% - 24px) / 3);              
    max-width: calc((100% - 24px) / 3);             
    min-width: 260px;
    padding: 10px 12px;
    border: 1px solid #000;
    border-radius: 10px;
    background: #f6fded;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    transition: transform .2s, box-shadow .2s, border-color .2s;
    }

#gallery_list .gallery:hover {
    transform: scale(1.02);
    border-color: #4CAF50;
    box-shadow: 0 0 0 3px rgba(76,175,80,.15);
}
#gallery_list .gallery.selected {
    border: solid #205838 2px;
}

#gallery_list .gallery_text { display: flex; flex-direction: column; gap: 4px; }
#gallery_list .gallery_owner { font-weight: 600; color: #222; }
#gallery_list .num_images   { color: #333; opacity: .9; }
#gallery_list .view_gallery_btn .btn { white-space: nowrap; }

#gallery_controls {
    display: flex;
    justify-content: space-between;   /* opposite sides */
    align-items: center;
    gap: 8px;

    margin-top: 10px;
    padding: 8px 10px;
    background: #f6fded;              /* same as #image_controls */
    border: 1px solid #0b420d;
    border-radius: 10px;
}

#galleries_display #previous_gallery_btn { background-image: url(../media/left-arrow.png);  background-size: cover; }
#galleries_display #next_gallery_btn     { background-image: url(../media/right-arrow.png); background-size: cover; }

@media (max-width: 900px) { #gallery_list .gallery { flex: 0 0 calc(50% - 6px); } }
@media (max-width: 600px) { #gallery_list .gallery { flex: 0 0 100%; } }